Parity between paste features and existing codebase - Studio team #2529
-
|
Background: Studio team is currently migrating to Paste from our legacy framework |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 8 replies
-
|
Hi all! 👋 With your desired functionality of needing to customize the text area and dropdown, we suggest that you try using the Combobox Primitive to have more control for what you need. We also encouraging ensuring the implementation is accessible from a screenreader and keyboard perspective, allowing a user to understand that a list of options is being presented and the ability to tab through or move between the options, and also have those options “announced” by a screenreader. Per Lee’s comment, from an a11y standpoint, it could be a little complicated, the implementation could similar to a rich text area. She is going to find and share an example of this for the group! The implementation needs to be able to convey to the users what is happening, it’s not clear that only using/typing the curly brackets will open a dropdown at this time. Once your team gives the combobox primitive a try, please let us know here that you’re ready for feedback, or if you have more questions, we’re here for you! We’ll follow up with you in a week or so. Thanks again for all attending office hours, it was great to meet you! |
Beta Was this translation helpful? Give feedback.
-
|
Hi @ashinde-git, It is likely you will need custom components rather than the Paste Textarea yeah. Another option is something like this: https://codersblock.com/blog/highlight-text-inside-a-textarea/ |
Beta Was this translation helpful? Give feedback.
-
|
@TheSisb That's a neat trick. Will try this out and let you know. Thank you! |
Beta Was this translation helpful? Give feedback.
-
|
Hey @shleewhite we are able to style the DraftJS editor so we can still have the liquid logic and have the same interface as the Paste Text Area field. Is there anything from an accessiblity standpoint we need to make sure to add so we can adhere to paste design principles even if we can't use a paste component for this usecase? I know |
Beta Was this translation helpful? Give feedback.
-
|
Hi @cfahlgren1 - we don't have guidance for WISYWIG/rich text editors yet, but the most important thing is making sure the field is properly labelled and that the interactions you can do with a mouse are possible with only a keyboard. We have some guidance on labeling in the Textarea documentation. |
Beta Was this translation helpful? Give feedback.
-
|
Hey all! Here's the recording from your office hours session last week (password is in the #help-design-system channel in Slack). Let us know if you have any other questions! |
Beta Was this translation helpful? Give feedback.
Hi all! 👋
Here is a link to today's recording.
With your desired functionality of needing to customize the text area and dropdown, we suggest that you try using the Combobox Primitive to have more control for what you need. We also encouraging ensuring the implementation is accessible from a screenreader and keyboard perspective, allowing a user to understand that a list of options is being presented and the ability to tab through or move between the options, and also have those options “announced” by a screenreader.
Per Lee’s comment, from an a11y standpoint, it could be a little complicated, the implementation could similar to a rich text area. She is going to find and share an example …