TextField: Color always primary, even when disabled/readonly

[scottlovegrove]

🐛 Bug report

Current behavior

When using the TextField I have tried being able to change the colour of the text, but appear to be unable to do so. I actually do just need this input to be readonly, but I didn't want pure white text for the text colour, but we don't seem to have a different colour for that, nor do we for disabled (something else I also tried in order to change the colour value).

We also seem to support the color field on the input, but setting that changes nothing within the input itself.

This is my current code

<TextField
    label=""
    readOnly
    value={calendarLink}
    color="red"
    disabled
/>

This is what that looks like

And this is what the rendered css gives

Steps to reproduce the bug

Use the code above

Expected behavior

The colour of the text should change, especially when setting the color field, and definitely when you disable the input.

Environment

• @doist/reactist version: 11.0.0
• react version: 17.0.2
• Browser: Chrome

[gnapse]

That color prop seems to come from the native props supported by an input element. Although I cannot find that attribute in MDN, it is coming from the TypeScript type definitions for HTMLAttributes in React types (ref).

So, this attribute is not there intentionally from us. It is there because of our intention to allow the consumer of our components to be able to pass all the other props that they'd be able to pass to a native <input /> element. I can understand how it is confusing, though.

The only thing that I agree with here is that the text field should indeed show a different appearance when dimmed. This change of appearance may affect not only the input field, but may also affect that label. We'd need to check with the design team what's the design for a disabled text field. And maybe along the way, to check if we have a proper disabled state for all the other field elements in the library.