feat: add support for optgroups in SelectWidget and related documentation updates#5000
feat: add support for optgroups in SelectWidget and related documentation updates#5000nlemoine wants to merge 2 commits into
Conversation
|
@nlemoine It seems like you are trying to complete the work from #4374. This feature is currently only set up for the native select. I'm curious whether you think it could benefit the other themes? And if so, are you interested in expanding the feature for them? Honestly, I'm not even sure what other themes may have support for it. |
| render(<Form schema={schema} uiSchema={uiSchema} validator={validator} />, document.getElementById('app')); | ||
| ``` | ||
|
|
||
| Currently supported by the `core` and `react-bootstrap` theme packages. |
There was a problem hiding this comment.
| Currently supported by the `core` and `react-bootstrap` theme packages. | |
| Currently only supported by the `core` and `react-bootstrap` theme packages. |
I started to look at it but it's not that straight forward. Some themes don't use native Before I dig in a bit more, is it fine if the feature isn't supported everywhere? (falling back to flat list eventually) |
nlemoine
force-pushed
the
feat/optgroup-select-widget
branch
from
00d14c3 to
1b0ded9
Compare
Yes, I'm fine with doing more work in a follow-up PR. I'll take a second look at your PR soon to see if I missed anything. |
You can wait until next week, I should be able to at least implement the obvious/not problematic themes. |
|
I also need to push a fix on select indices (related to the work done in #4773). That might be needed before this. |
| const selectedIndexes = enumOptionsIndexForValue<S>(value, enumOptions, multiple); | ||
| const showPlaceholderOption = !multiple && schema.default === undefined; | ||
|
|
||
| function renderOption(i: number): ReactNode { |
There was a problem hiding this comment.
This code looks (nearly) identical to what you put into the react-bootstrap code. I would love for you to find a way to DRY up the two implementations. One approach could be to implement a component in core that is a peer to the RichDescription/RichHelp/SchemaExamples components and use it in both places. It likely would require passing props that are currently local variables. Let me know what you think is the best approach.
| const selectedIndexes = enumOptionsIndexForValue<S>(value, enumOptions, multiple); | ||
| const showPlaceholderOption = !multiple && schema.default === undefined; | ||
|
|
||
| function renderOption(i: number): ReactNode { |
There was a problem hiding this comment.
DRY all of this up please
|
@nlemoine I'm assuming you will get back to this once you return from your break |
2 participants
Reasons for making this change
Fixes #1813, #580 and closes #4374
Add optgroup support to RJSF.
Checklist
npx nx run-many --target=build --exclude=@rjsf/docs && npm run test:updateto update snapshots, if needed.