Skip to main content

I’m creating a text input component with several states (ie enabled, focused, disabled etc)


I have centralised parts of this input component. For example; the ‘Supporting text’ lockup (icon and text) has been created as a component and NESTED into a text input component.


I have added a text property (string) to the supporting text. I would expect that no matter which state I select for the input component (ie enabled, focused, disabled etc) that IF I change the supporting text string to something other than the default, it would carry across when I select the different input states.


It does not carry across. The only way I have found to get around this is to not centralise the supporting text component; thus losing the ability to make changes to styling in one place and have it apply consistently across different variants


Image below to give a visual to what I’m talking about.


All help appreciated. TIA


😅 hey @Ryan_Phipps-Mitchell – I have a general understanding on what you’re reporting (thank you for the screenshot - super helpful), but I’m not insightful enough to recommend what to adjust in order to get the states behaving as you would expect them to.


I’m going to follow up via DM to see if I can get someone more savvy to take a look. In the meantime, I’m leaving this open just in case any of our other community members may have suggestions!


Reply