classy-ui icon indicating copy to clipboard operation
classy-ui copied to clipboard

Discussion: Add aria-invalid utility | conditional styling based on html attributes

Open CodingDive opened this issue 4 years ago • 0 comments

Hey, sorry for reporting so many issues. This one is not a bug but a suggestion where I'd love your input to understand which direction classy-ui wants to go.

I've been using smooth-ui for a while and one thing I really liked about their API is to be able to pass in an aria-invalid HTML attribute that will lead to some custom styles being applied. E.g if the attribute is true, the underlying input will turn red to let all users know that the input is invalid. Combining a11y with styles brings about a very lovely API.

I'm now building an input component and am wondering if something like &[aria-invalid='true'] as seen in the smooth-ui source code would be a useful utility to have, or if this is outside of the scope of classy-ui. Essentially, applying styles based on HTML attributes (and their values). Alternatively, I will just stick to compose + props.

CodingDive avatar Apr 11 '20 01:04 CodingDive