day8
Use the `:parts` and `:theme` system for all existing components
Newer re-com components (nested-grid, tree-select, dropdown) can use a :theme prop. :theme expresses an update to a component's props (e.g. style & class), as a function of the current props and a context. The context includes :part and :re-com. :part is a qualified id. :re-com is a map describing global configuration (such as color palettes) and any dynamic state (such as {:drop-down :open}).
As a user, you can write a single :theme function and "register" it once, to apply it to every re-com component. This theme-function can vary its behavior based on the :part (for instance, with a multimethod), gathering together all your visual adjustments for the app.
You can also pass a :theme function to an individual component, conveniently extracting the logic of styling from that component's implementation.
Complementing :theme, I've also expanded the :parts system. Previously, a :parts value could only be a map. Now, newer re-com components support strings, hiccups and functions. Strings & hiccups will replace the entire part, while a function will replace its component function.
The way :theme and :parts works is mostly stable in these newer components, so it would be great to add this feature to all our current components.
- [x] alert
- [ ] box
- [x] buttons
- [x] checkbox
- [x] close-button
- [ ] datepicker
- [x] dropdown
- [x] input-text
- [x] typeahead
- [x] input-time
- [x] splits
- [x] modal-panel
- [x] error-modal
- [ ] multi-select
- [ ] popover
- [x] progress-bar
- [x] radio-button
- [x] selection-list
- [x] slider
- [x] horizontal-tabs
- [x] bar-tabs
- [x] pill-tabs
- [ ] table-filter
- [x] tag-dropdown
- [x] text
- [x] throbber
- [ ] tour
- [x] tree-select
- [ ] v-table
- [ ] simple-v-table
- [x] nested-grid
