Subtle IconOnly buttons using a Font Icon do not show click state on iOS

[gremlin529]

Willing to submit a PR to fix?

• [ ] I am willing to submit a PR to fix

Requested priority

High

Products/applications affected

Sync Furn, in ButtonIconTestSelection.tsx add the following lines of code around line 30 (just under <View style={testContentrootViewstyle}>

<Button
        iconOnly
        appearance='subtle'
        icon={{
            fontSource: { ...fontBuiltInProps, fontSize: 32 },
            color: '#060' }}
            style={commonTestStyles.vmargin}/>

result:

Now run the app and you'll see on iOS That this icon doesn't show a pressed state when clicked on, trying an SVG Icon you'll see it works fine, also just text in Subtle works fine.

Package version(s)

yarn button 35.9

OS version(s)

17.0

Platform

• [X] iOS
• [ ] macOS
• [ ] win32
• [ ] windows
• [ ] android

Xcode version

No response

Please provide a reproduction of the bug

as above

Actual behavior

no click state shown

Expected behavior

show click state

[gremlin529]

Actually the problem here is that you want the icon to have separate colours for each states, that actually needs to be accomplished with the customise function like so:

const CustomIconButton = Button.customize({
    subtle: {iconColor: 'red', pressed: {iconColor: 'orange'}},
  });

[gremlin529]

closed as this can be accomplished with the above