Text input

[wilfredomerced]

I had a question on the text area component. The input text appears to be visually different from whats in the DS docs. Is there a setting that I’m missing in figma?

DS Docs

Paste Component

[gloriliale]

Hi @wilfredomerced! To clarify, the second screenshot is from the Paste Input Component when it's a text area in Figma?

[wilfredomerced]

sorry just found that you need to set the text component to be a placeholder. for designing purposes might be easier to start off as the text being set to placeholder by default because when you're designing screens you're going to design the first state of the input field

[serifluous]

Ah yeah, the Figma component shows the style of the typed value first since placeholder text isn't used too often.

If you want to swap to the placeholder style, you can click into the component in the layer list called ". Field text", and swap the variant to "Placeholder".

That's a good point. Placeholders aren't used too often in Twilio products, which is why we went with the typed value as the default. I've thought about having the form fields start off as blank...though that might make it harder for folks to figure out how to then add text to the form field. Very open to suggestions, though!

[wilfredomerced]

Hmm I wonder if you it could be easier to access in the panel of variants. its a bit confusing to access the variant for placeholder because I kept clicking on the text inside and not the text field part to change it to the placeholder text

[serifluous]

Yeah, hmm..we definitely want to take another pass at Buttons and Form fields, since they're our most variant-dense components. It might be cool to workshop it with a few PDs and decide on what variants are the most convenient to expose at the top level (hopefully without having to create hundreds of variants).

[wilfredomerced]

yeah I'd be down to participate