RichSelectList: update color and make label optional #330
Conversation
jliotta
requested review from
christianvuerings,
somethiiing and
williamnewman94
🦋 Changeset detectedLatest commit: 28a5bcb The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
jliotta
changed the title
| @@ -2,3 +2,7 @@ | |||
| .richSelectBox:focus-visible { | |||
There was a problem hiding this comment.
@jliotta could you make sure to add a changeset to this PR? pnpm run changeset
| @@ -59,7 +60,9 @@ export type RichSelectListProps = Omit< | |||
| /** Text shown below select box */ | |||
| helperText?: string; | |||
| /** Text shown above select box */ | |||
| label: string; | |||
| label?: string; | |||
| //** */ | |||
There was a problem hiding this comment.
@jliotta instead of adding new accessibilityLabel prop, can we allow for an id to be passed in? This follows the same API as TextField:
The way folks can then add a label, is by adding a custom label outside of RichSelectList:
syntax/packages/syntax-core/src/TextField/TextField.tsx
Lines 91 to 92 in 09370d9
| @@ -117,6 +121,7 @@ function RichSelectList(props: RichSelectListProps): ReactElement { | |||
| ...richSelectBoxProps | |||
| } = props; | |||
|
|
|||
| const id = useId(); | |||
There was a problem hiding this comment.
See
syntax/packages/syntax-core/src/TextField/TextField.tsx
Lines 91 to 92 in 09370d9
| @@ -32,6 +32,7 @@ | |||
| outline: 0; | |||
| padding: 0 36px 0 12px; | |||
| width: 100%; | |||
| background-color: var(--color-base-white); | |||
There was a problem hiding this comment.
NIT: can we alphabetically sort this?
|
@christianvuerings I think I addressed your comments but please take another look! I'm going to merge this in for now since it's blocking some FE work but I can submit a follow-up PR if needed on Monday |
This PR adds the following updates for RichSelectList:
labelprop optional (similar to what we do for TextFieldaccessibilityLabelpropChanges needed for Shoppable Group Lessons which is the first use case of RichSelectList