How can I customize the icon of a Button using the Customizer component?

Question

I am using the Customizer component to apply a specific theme and style to my Fabric/Fluent components.

I would like to also customize the icons from the customizer properties.

In the Customizer component source code there is a block of text which states:

The Customizer component allows for default props to be mixed into components which are decorated with the customizable() decorator, or use the styled HOC. This enables injection scenarios like:

1. render svg icons instead of the icon font within all buttons
2. inject a custom theme object into a component

Does this mean that it is possible to alter the icon from the Customizer props?

I have created a CodePen to illustrate my problem.

const buttonProps = {
  text: "My Button",
  iconProps: {
    iconName: "Delete"
  }
};

const customizerProps = {
  scopedSettings: {
    DefaultButton: {
      styles: ButtonStyles,
      iconProps: {
        iconName: "Cancel" // replace original icon with this
      }
    }
  }
};

<DefaultButton { ...buttonProps } />
<Customizer { ...customizerProps }>
  <DefaultButton { ...buttonProps } />
</Customizer>

I have two DefaultButtons with iconProps. I would like to use the Customizer to change the icon of the second button however only the style is being changed.

Is it possible to do this?