@ecopages/radiant-ui 0.1.0-rc.7 → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -3
- package/dist/components/ui/alert/alert.d.ts +2 -4
- package/dist/components/ui/alert/alert.script.d.ts +25 -15
- package/dist/components/ui/autocomplete/autocomplete.css +1 -2
- package/dist/components/ui/autocomplete/autocomplete.d.ts +8 -3
- package/dist/components/ui/autocomplete/autocomplete.script.d.ts +29 -4
- package/dist/components/ui/avatar/avatar.css +10 -8
- package/dist/components/ui/avatar/avatar.d.ts +3 -1
- package/dist/components/ui/breadcrumb/breadcrumb.d.ts +11 -11
- package/dist/components/ui/breadcrumb/breadcrumb.script.d.ts +10 -10
- package/dist/components/ui/calendar/calendar.css +10 -5
- package/dist/components/ui/calendar/calendar.script.d.ts +24 -21
- package/dist/components/ui/calendar/index.js +1 -1
- package/dist/components/ui/calendar/index.js.map +3 -3
- package/dist/components/ui/carousel/carousel-autoplay.d.ts +22 -0
- package/dist/components/ui/carousel/carousel-swipe.d.ts +17 -0
- package/dist/components/ui/carousel/carousel-window.d.ts +63 -0
- package/dist/components/ui/carousel/carousel.css +71 -18
- package/dist/components/ui/carousel/carousel.d.ts +8 -4
- package/dist/components/ui/carousel/carousel.script.d.ts +73 -40
- package/dist/components/ui/carousel/index.js +1 -1
- package/dist/components/ui/carousel/index.js.map +4 -4
- package/dist/components/ui/checkbox/checkbox.d.ts +11 -0
- package/dist/components/ui/checkbox/checkbox.script.d.ts +31 -8
- package/dist/components/ui/checkbox/index.js +1 -1
- package/dist/components/ui/checkbox/index.js.map +4 -4
- package/dist/components/ui/checkbox-group/checkbox-group.d.ts +4 -2
- package/dist/components/ui/checkbox-group/checkbox-group.script.d.ts +39 -20
- package/dist/components/ui/checkbox-group/index.js +1 -1
- package/dist/components/ui/checkbox-group/index.js.map +4 -4
- package/dist/components/ui/combobox/combobox.css +9 -1
- package/dist/components/ui/combobox/combobox.d.ts +12 -4
- package/dist/components/ui/combobox/combobox.script.d.ts +74 -25
- package/dist/components/ui/combobox/index.d.ts +2 -2
- package/dist/components/ui/combobox/index.js +1 -1
- package/dist/components/ui/combobox/index.js.map +4 -4
- package/dist/components/ui/cycle-toggle/cycle-toggle.d.ts +6 -2
- package/dist/components/ui/cycle-toggle/cycle-toggle.script.d.ts +35 -4
- package/dist/components/ui/cycle-toggle/index.js +1 -1
- package/dist/components/ui/cycle-toggle/index.js.map +3 -3
- package/dist/components/ui/date-field/date-field.css +13 -17
- package/dist/components/ui/date-field/date-field.d.ts +10 -8
- package/dist/components/ui/date-field/date-field.script.d.ts +35 -52
- package/dist/components/ui/date-field/index.js +1 -1
- package/dist/components/ui/date-field/index.js.map +4 -4
- package/dist/components/ui/date-input/date-input-segment-dom.d.ts +24 -0
- package/dist/components/ui/date-input/date-input.css +50 -0
- package/dist/components/ui/date-input/date-input.d.ts +8 -0
- package/dist/components/ui/date-input/date-input.script.d.ts +137 -0
- package/dist/components/ui/date-input/index.d.ts +2 -0
- package/dist/components/ui/date-input/index.js +2 -0
- package/dist/components/ui/date-input/index.js.map +7 -0
- package/dist/components/ui/date-range-picker/date-range-picker.css +18 -19
- package/dist/components/ui/date-range-picker/date-range-picker.d.ts +11 -9
- package/dist/components/ui/date-range-picker/date-range-picker.script.d.ts +42 -51
- package/dist/components/ui/date-range-picker/index.js +1 -1
- package/dist/components/ui/date-range-picker/index.js.map +4 -4
- package/dist/components/ui/dialog/dialog.css +18 -14
- package/dist/components/ui/dialog/dialog.d.ts +6 -0
- package/dist/components/ui/dialog/dialog.script.d.ts +43 -10
- package/dist/components/ui/dialog/index.js +1 -1
- package/dist/components/ui/dialog/index.js.map +4 -4
- package/dist/components/ui/disclosure/disclosure-group.script.d.ts +19 -3
- package/dist/components/ui/disclosure/disclosure.css +3 -6
- package/dist/components/ui/disclosure/disclosure.d.ts +23 -7
- package/dist/components/ui/disclosure/disclosure.script.d.ts +31 -7
- package/dist/components/ui/disclosure/index.d.ts +1 -1
- package/dist/components/ui/disclosure/index.js +1 -1
- package/dist/components/ui/disclosure/index.js.map +4 -4
- package/dist/components/ui/field/field-description.d.ts +1 -0
- package/dist/components/ui/field/field-error.d.ts +2 -2
- package/dist/components/ui/field/field.d.ts +4 -4
- package/dist/components/ui/field/field.script.d.ts +54 -24
- package/dist/components/ui/field/index.js +1 -1
- package/dist/components/ui/field/index.js.map +4 -4
- package/dist/components/ui/form/control-protocol.d.ts +38 -1
- package/dist/components/ui/form/form-context.d.ts +3 -0
- package/dist/components/ui/form/form.d.ts +6 -0
- package/dist/components/ui/form/form.script.d.ts +29 -12
- package/dist/components/ui/form/index.d.ts +2 -1
- package/dist/components/ui/form/index.js +1 -1
- package/dist/components/ui/form/index.js.map +4 -4
- package/dist/components/ui/grid/grid.d.ts +4 -3
- package/dist/components/ui/grid/grid.script.d.ts +19 -11
- package/dist/components/ui/hover-card/hover-card.css +12 -101
- package/dist/components/ui/hover-card/hover-card.d.ts +7 -2
- package/dist/components/ui/hover-card/hover-card.script.d.ts +36 -5
- package/dist/components/ui/hover-card/index.js +1 -1
- package/dist/components/ui/hover-card/index.js.map +4 -4
- package/dist/components/ui/input/index.js +1 -1
- package/dist/components/ui/input/index.js.map +4 -4
- package/dist/components/ui/input/input.css +1 -1
- package/dist/components/ui/knob/index.js +1 -1
- package/dist/components/ui/knob/index.js.map +3 -3
- package/dist/components/ui/knob/knob.css +6 -1
- package/dist/components/ui/knob/knob.d.ts +4 -4
- package/dist/components/ui/knob/knob.script.d.ts +55 -20
- package/dist/components/ui/label/index.js +1 -1
- package/dist/components/ui/label/index.js.map +4 -4
- package/dist/components/ui/label/label.d.ts +2 -1
- package/dist/components/ui/listbox/index.d.ts +2 -2
- package/dist/components/ui/listbox/index.js +1 -1
- package/dist/components/ui/listbox/index.js.map +4 -4
- package/dist/components/ui/listbox/listbox.css +14 -0
- package/dist/components/ui/listbox/listbox.d.ts +16 -2
- package/dist/components/ui/listbox/listbox.script.d.ts +55 -12
- package/dist/components/ui/menu-button/index.js +1 -1
- package/dist/components/ui/menu-button/index.js.map +4 -4
- package/dist/components/ui/menu-button/menu-button.d.ts +2 -2
- package/dist/components/ui/menu-button/menu-button.script.d.ts +30 -27
- package/dist/components/ui/menubar/index.js +1 -1
- package/dist/components/ui/menubar/index.js.map +4 -4
- package/dist/components/ui/menubar/menubar.script.d.ts +41 -15
- package/dist/components/ui/meter/index.js +1 -1
- package/dist/components/ui/meter/index.js.map +3 -3
- package/dist/components/ui/meter/meter.css +27 -2
- package/dist/components/ui/meter/meter.script.d.ts +19 -14
- package/dist/components/ui/navigation-menu/index.d.ts +1 -1
- package/dist/components/ui/navigation-menu/index.js +1 -1
- package/dist/components/ui/navigation-menu/index.js.map +4 -4
- package/dist/components/ui/navigation-menu/navigation-menu.css +32 -34
- package/dist/components/ui/navigation-menu/navigation-menu.d.ts +34 -5
- package/dist/components/ui/navigation-menu/navigation-menu.script.d.ts +93 -12
- package/dist/components/ui/number-field/index.js +1 -1
- package/dist/components/ui/number-field/index.js.map +4 -4
- package/dist/components/ui/number-field/number-field.css +1 -1
- package/dist/components/ui/number-field/number-field.d.ts +8 -19
- package/dist/components/ui/number-field/number-field.script.d.ts +30 -9
- package/dist/components/ui/pagination/index.d.ts +1 -1
- package/dist/components/ui/pagination/index.js +1 -1
- package/dist/components/ui/pagination/index.js.map +3 -3
- package/dist/components/ui/pagination/pagination.css +50 -13
- package/dist/components/ui/pagination/pagination.d.ts +33 -9
- package/dist/components/ui/pagination/pagination.script.d.ts +29 -9
- package/dist/components/ui/popover/index.js +1 -1
- package/dist/components/ui/popover/index.js.map +4 -4
- package/dist/components/ui/popover/popover.d.ts +17 -1
- package/dist/components/ui/popover/popover.script.d.ts +57 -9
- package/dist/components/ui/radio-group/index.js +1 -1
- package/dist/components/ui/radio-group/index.js.map +4 -4
- package/dist/components/ui/radio-group/radio-group.d.ts +2 -2
- package/dist/components/ui/radio-group/radio-group.script.d.ts +35 -16
- package/dist/components/ui/select/index.d.ts +2 -2
- package/dist/components/ui/select/index.js +1 -1
- package/dist/components/ui/select/index.js.map +4 -4
- package/dist/components/ui/select/select.css +8 -6
- package/dist/components/ui/select/select.d.ts +18 -9
- package/dist/components/ui/select/select.script.d.ts +74 -26
- package/dist/components/ui/shared/calendar-popover-behavior.d.ts +27 -0
- package/dist/components/ui/shared/control-toggle.css +8 -4
- package/dist/components/ui/shared/field-label.d.ts +5 -0
- package/dist/components/ui/shared/listbox-host-controller.d.ts +41 -0
- package/dist/components/ui/shared/listbox-option.d.ts +4 -0
- package/dist/components/ui/shared/multi-value.d.ts +23 -1
- package/dist/components/ui/shared/numeric-range.d.ts +8 -0
- package/dist/components/ui/shared/popover.css +10 -99
- package/dist/components/ui/sidebar/index.d.ts +2 -1
- package/dist/components/ui/sidebar/index.js +1 -1
- package/dist/components/ui/sidebar/index.js.map +4 -4
- package/dist/components/ui/sidebar/sidebar-trigger.d.ts +12 -0
- package/dist/components/ui/sidebar/sidebar-trigger.script.d.ts +52 -31
- package/dist/components/ui/sidebar/sidebar.css +67 -61
- package/dist/components/ui/sidebar/sidebar.d.ts +9 -4
- package/dist/components/ui/sidebar/sidebar.script.d.ts +42 -20
- package/dist/components/ui/slider/index.js +1 -1
- package/dist/components/ui/slider/index.js.map +4 -4
- package/dist/components/ui/slider/slider.css +5 -5
- package/dist/components/ui/slider/slider.d.ts +20 -10
- package/dist/components/ui/slider/slider.script.d.ts +103 -27
- package/dist/components/ui/switch/index.js +1 -1
- package/dist/components/ui/switch/index.js.map +4 -4
- package/dist/components/ui/switch/switch.css +28 -22
- package/dist/components/ui/switch/switch.d.ts +13 -0
- package/dist/components/ui/switch/switch.script.d.ts +34 -8
- package/dist/components/ui/table/index.js +1 -1
- package/dist/components/ui/table/index.js.map +4 -4
- package/dist/components/ui/table/table.d.ts +9 -7
- package/dist/components/ui/table/table.script.d.ts +55 -12
- package/dist/components/ui/tabs/tabs.css +18 -12
- package/dist/components/ui/tabs/tabs.d.ts +7 -4
- package/dist/components/ui/tabs/tabs.script.d.ts +39 -9
- package/dist/components/ui/tag-group/index.js +1 -1
- package/dist/components/ui/tag-group/index.js.map +4 -4
- package/dist/components/ui/tag-group/tag-group.d.ts +19 -7
- package/dist/components/ui/tag-group/tag-group.script.d.ts +58 -10
- package/dist/components/ui/textarea/index.js +1 -1
- package/dist/components/ui/textarea/index.js.map +4 -4
- package/dist/components/ui/textarea/textarea.css +1 -1
- package/dist/components/ui/toast/index.js +1 -1
- package/dist/components/ui/toast/index.js.map +4 -4
- package/dist/components/ui/toast/toast.css +35 -32
- package/dist/components/ui/toast/toast.script.d.ts +17 -31
- package/dist/components/ui/toast/toaster.script.d.ts +24 -12
- package/dist/components/ui/toc/toc.script.d.ts +19 -8
- package/dist/components/ui/toolbar/toolbar.d.ts +5 -0
- package/dist/components/ui/toolbar/toolbar.script.d.ts +24 -4
- package/dist/components/ui/tooltip/index.js +1 -1
- package/dist/components/ui/tooltip/index.js.map +4 -4
- package/dist/components/ui/tooltip/tooltip.css +14 -94
- package/dist/components/ui/tooltip/tooltip.d.ts +7 -0
- package/dist/components/ui/tooltip/tooltip.script.d.ts +36 -6
- package/dist/components/ui/tree/tree.d.ts +4 -3
- package/dist/components/ui/tree/tree.script.d.ts +28 -15
- package/dist/components/ui/treegrid/treegrid.d.ts +5 -3
- package/dist/components/ui/treegrid/treegrid.script.d.ts +33 -14
- package/dist/components/ui/window-splitter/index.d.ts +1 -1
- package/dist/components/ui/window-splitter/index.js +1 -1
- package/dist/components/ui/window-splitter/index.js.map +3 -3
- package/dist/components/ui/window-splitter/window-splitter.d.ts +10 -1
- package/dist/components/ui/window-splitter/window-splitter.script.d.ts +26 -8
- package/dist/index.d.ts +2 -0
- package/dist/index.js +1 -1
- package/dist/index.js.map +4 -4
- package/dist/lib/icons/check.d.ts +3 -0
- package/dist/lib/icons/chevron-down.d.ts +0 -1
- package/dist/lib/icons/index.d.ts +2 -0
- package/dist/lib/icons/x.d.ts +5 -0
- package/dist/lib/intl-date/index.d.ts +4 -2
- package/dist/lib/intl-date/segment-editing.d.ts +34 -0
- package/dist/lib/intl-date/segments.d.ts +26 -4
- package/dist/lib/non-empty.d.ts +6 -0
- package/dist/lib/unique-id.d.ts +11 -0
- package/dist/lib/viewport/breakpoints.d.ts +6 -0
- package/dist/lib/viewport/mobile-layout.d.ts +15 -0
- package/dist/styles/primitives.css +14 -11
- package/dist/styles/radiant-ui-core.css +10 -0
- package/dist/styles/radiant-ui.css +40 -11
- package/dist/styles/style-dependencies.json +38 -13
- package/dist/styles/styles.css +485 -252
- package/dist/styles/tailwind.css +40 -101
- package/dist/styles/tokens/presets/colors/aurora.css +2 -0
- package/dist/styles/tokens/presets/colors/basalt.css +2 -0
- package/dist/styles/tokens/presets/colors/ember.css +2 -0
- package/dist/styles/tokens/presets/colors/glacier.css +2 -0
- package/dist/styles/tokens/semantic.css +1 -0
- package/dist/styles/tokens/system.css +11 -3
- package/dist/styles/tokens/typography/default.css +8 -0
- package/package.json +27 -13
|
@@ -13,7 +13,6 @@ rui-select {
|
|
|
13
13
|
}
|
|
14
14
|
.rui-select__control {
|
|
15
15
|
display: flex;
|
|
16
|
-
min-height: calc(var(--spacing, 0.25rem) * 10);
|
|
17
16
|
width: 100%;
|
|
18
17
|
min-width: 0px;
|
|
19
18
|
align-items: center;
|
|
@@ -24,6 +23,7 @@ rui-select {
|
|
|
24
23
|
border-color: var(--color-border, var(--border));
|
|
25
24
|
background-color: var(--color-background, var(--background));
|
|
26
25
|
padding-inline: var(--spacing-1, var(--space-1));
|
|
26
|
+
min-height: var(--size-control-md);
|
|
27
27
|
}
|
|
28
28
|
.rui-select__control:focus-within {
|
|
29
29
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
@@ -47,18 +47,19 @@ rui-select {
|
|
|
47
47
|
color: var(--color-on-background, var(--on-background));
|
|
48
48
|
--tw-outline-style: none;
|
|
49
49
|
outline-style: none;
|
|
50
|
-
font-size: var(--text-control
|
|
50
|
+
font-size: var(--text-control-input);
|
|
51
51
|
}
|
|
52
|
-
.rui-select__trigger
|
|
52
|
+
.rui-select__trigger[aria-disabled='true'] {
|
|
53
53
|
cursor: not-allowed;
|
|
54
54
|
opacity: var(--opacity-muted, var(--opacity-muted));
|
|
55
55
|
}
|
|
56
56
|
.rui-select__value {
|
|
57
|
+
display: flex;
|
|
57
58
|
min-width: 0px;
|
|
58
59
|
flex: 1;
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
60
|
+
flex-wrap: wrap;
|
|
61
|
+
align-items: center;
|
|
62
|
+
gap: var(--spacing-1, var(--space-1));
|
|
62
63
|
min-height: 1.25em;
|
|
63
64
|
}
|
|
64
65
|
.rui-select__value[data-placeholder] {
|
|
@@ -89,6 +90,7 @@ rui-select {
|
|
|
89
90
|
color: var(--color-on-background, var(--on-background));
|
|
90
91
|
--tw-outline-style: none;
|
|
91
92
|
outline-style: none;
|
|
93
|
+
font-size: var(--text-control-input);
|
|
92
94
|
}
|
|
93
95
|
.rui-select__search:focus-visible {
|
|
94
96
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
@@ -9,23 +9,31 @@ export type RuiSelectControlProps = JsxElementProps<HTMLDivElement>;
|
|
|
9
9
|
* @cssclass rui-select__control - Trigger row; bordered, control-height surface.
|
|
10
10
|
*/
|
|
11
11
|
export declare function RuiSelectControl({ children, class: className, ...props }: RuiSelectControlProps): JsxRenderable;
|
|
12
|
-
export type RuiSelectTriggerProps = JsxElementProps<
|
|
12
|
+
export type RuiSelectTriggerProps = JsxElementProps<HTMLDivElement> & {
|
|
13
13
|
disabled?: boolean;
|
|
14
14
|
};
|
|
15
15
|
/**
|
|
16
|
-
*
|
|
16
|
+
* Combobox surface. Stamps `[data-select-trigger]`. Place `RuiSelectValue` inside.
|
|
17
17
|
*
|
|
18
|
-
* @
|
|
18
|
+
* @remarks A native `<button>` cannot wrap multi-select chip remove controls
|
|
19
|
+
* (`<button>` in `<button>`). The host sets `role="combobox"`.
|
|
20
|
+
*
|
|
21
|
+
* @cssclass rui-select__trigger - Combobox surface; `role="combobox"` set by the controller.
|
|
19
22
|
*/
|
|
20
23
|
export declare function RuiSelectTrigger({ children, class: className, disabled, ...props }: RuiSelectTriggerProps): JsxRenderable;
|
|
21
24
|
export type RuiSelectToggleProps = JsxElementProps<HTMLButtonElement> & {
|
|
22
25
|
disabled?: boolean;
|
|
23
26
|
};
|
|
24
|
-
/** Toggle button for opening the listbox popup. */
|
|
27
|
+
/** Toggle button for opening the listbox popup. Stamps `[data-select-toggle]`. Children replace the default chevron icon. */
|
|
25
28
|
export declare function RuiSelectToggle({ children, class: className, aria, disabled, ...props }: RuiSelectToggleProps): JsxRenderable;
|
|
29
|
+
export type RuiSelectClearProps = JsxElementProps<HTMLButtonElement> & {
|
|
30
|
+
disabled?: boolean;
|
|
31
|
+
};
|
|
32
|
+
/** Clears the current selection. Stamps `[data-select-clear]`. Place next to `RuiSelectToggle`. Children replace the default close icon. */
|
|
33
|
+
export declare function RuiSelectClear({ children, class: className, aria, disabled, ...props }: RuiSelectClearProps): JsxRenderable;
|
|
26
34
|
export type RuiSelectValueProps = JsxElementProps<HTMLSpanElement>;
|
|
27
35
|
/**
|
|
28
|
-
* Selected value display inside `RuiSelectTrigger`.
|
|
36
|
+
* Selected value display inside `RuiSelectTrigger`. Stamps `[data-select-value]`.
|
|
29
37
|
*
|
|
30
38
|
* @remarks When empty, shows the select `placeholder`. For the `options` API,
|
|
31
39
|
* the view SSRs the resolved label (or placeholder) so the control height does
|
|
@@ -37,7 +45,7 @@ export type RuiSelectValueProps = JsxElementProps<HTMLSpanElement>;
|
|
|
37
45
|
export declare function RuiSelectValue({ children, class: className, ...props }: RuiSelectValueProps): JsxRenderable;
|
|
38
46
|
export type RuiSelectListboxProps = JsxElementProps<HTMLDivElement>;
|
|
39
47
|
/**
|
|
40
|
-
* Popup shell
|
|
48
|
+
* Popup shell. Stamps `[data-select-listbox]`. Place an embedded `RuiListbox` inside.
|
|
41
49
|
*
|
|
42
50
|
* @cssclass rui-select__listbox - Popup shell; composes `rui-popover` surface roles.
|
|
43
51
|
*/
|
|
@@ -48,16 +56,17 @@ export type RuiSelectSearchProps = JsxElementProps<HTMLInputElement> & {
|
|
|
48
56
|
};
|
|
49
57
|
/**
|
|
50
58
|
* Search input for filtering inside `RuiAutocomplete` within a select listbox.
|
|
59
|
+
* Stamps `[data-autocomplete-input]`.
|
|
51
60
|
*
|
|
52
61
|
* @cssclass rui-select__search - Filtering input inside the popup.
|
|
53
62
|
*/
|
|
54
63
|
export declare function RuiSelectSearch({ placeholder, class: className, disabled, ...props }: RuiSelectSearchProps): JsxRenderable;
|
|
55
64
|
export type RuiSelectOptionData = RuiListboxOptionData;
|
|
56
65
|
/**
|
|
57
|
-
* Select view.
|
|
58
|
-
*
|
|
66
|
+
* Select view. Wraps children in `[data-ref="root"]`. Pass `options` for the
|
|
67
|
+
* simple API, or compose `RuiSelect*` children.
|
|
59
68
|
*/
|
|
60
69
|
export type RuiSelectViewProps = JsxCustomElementAttributes<RuiSelectElement, RuiSelectProps & {
|
|
61
70
|
options?: RuiSelectOptionData[];
|
|
62
71
|
}>;
|
|
63
|
-
export declare function RuiSelect({ options, children, ...props }: RuiSelectViewProps): JsxRenderable;
|
|
72
|
+
export declare function RuiSelect({ options, children, value, ...props }: RuiSelectViewProps): JsxRenderable;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import { RadiantElement } from '@ecopages/radiant';
|
|
2
2
|
import type { EventEmitter } from '@ecopages/radiant/tools/event-emitter';
|
|
3
|
+
import { type ViewMultiValue } from '../shared/multi-value';
|
|
3
4
|
export type RuiSelectSelectionMode = 'single' | 'multiple';
|
|
5
|
+
export type RuiSelectTriggerKind = 'focus' | 'manual';
|
|
4
6
|
export type RuiSelectProps = {
|
|
5
|
-
value?:
|
|
7
|
+
value?: ViewMultiValue;
|
|
6
8
|
/** Accessible name when there is no visible `RuiLabel` associated with the trigger. */
|
|
7
9
|
label?: string;
|
|
8
10
|
placeholder?: string;
|
|
@@ -13,45 +15,96 @@ export type RuiSelectProps = {
|
|
|
13
15
|
* Defaults to false for multiple and true for single.
|
|
14
16
|
*/
|
|
15
17
|
shouldCloseOnSelect?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Controls what opens the listbox. `focus` opens when the trigger receives focus;
|
|
20
|
+
* `manual` requires a click, the toggle, or arrow keys (the default).
|
|
21
|
+
*/
|
|
22
|
+
triggerKind?: RuiSelectTriggerKind;
|
|
16
23
|
};
|
|
17
24
|
export type RuiSelectChangeDetail = {
|
|
18
|
-
value: string;
|
|
25
|
+
value: string[];
|
|
19
26
|
};
|
|
20
27
|
/**
|
|
21
28
|
* `<rui-select>` — a select-only combobox with a button trigger and listbox popup.
|
|
22
29
|
*
|
|
30
|
+
* The custom element is a behavior host: it does not render the composed tree.
|
|
31
|
+
* Import the script and place light-DOM children that match the contract below,
|
|
32
|
+
* or use the `RuiSelect*` view helpers which stamp the same targets.
|
|
33
|
+
*
|
|
23
34
|
* Implements the APG Combobox pattern (select-only variant). DOM focus stays on the
|
|
24
35
|
* trigger button; visual focus moves into the popup via `aria-activedescendant`.
|
|
25
|
-
*
|
|
26
36
|
* Pair with `RuiLabel` (sibling, or via `RuiField`) for the visible name.
|
|
27
|
-
* Compose with `data-select-trigger`, `data-select-toggle`, `data-select-value`, `data-select-listbox`
|
|
28
|
-
* (popup shell), and `RuiListbox` with `embedded` for options.
|
|
29
37
|
*
|
|
30
|
-
*
|
|
31
|
-
*
|
|
38
|
+
* ## Light-DOM contract
|
|
39
|
+
*
|
|
40
|
+
* Required:
|
|
41
|
+
* - `[data-ref="root"]` — shell for popover anchoring.
|
|
42
|
+
* - `[data-select-trigger]` — combobox surface (a `div`, not a native button).
|
|
43
|
+
* Host sets `id`, `role="combobox"`, `aria-haspopup="listbox"`,
|
|
44
|
+
* `aria-autocomplete="none"`, `aria-expanded`, `aria-controls`, `tabIndex`,
|
|
45
|
+
* and `aria-disabled`. Do not use a `<button>` here: multi-select chips include
|
|
46
|
+
* remove buttons, and `<button>` in `<button>` aborts HTML parsing.
|
|
47
|
+
* - `[data-select-value]` — selected value inside the trigger. Host sets
|
|
48
|
+
* `data-placeholder` when empty and may inject `[data-select-placeholder]`.
|
|
49
|
+
* - `[data-select-listbox]` — popup shell. Host toggles `hidden`.
|
|
50
|
+
*
|
|
51
|
+
* Per option (inside embedded listbox):
|
|
52
|
+
* - `[role="option"]` — selection identity; see `rui-listbox`.
|
|
53
|
+
*
|
|
54
|
+
* Optional:
|
|
55
|
+
* - `[data-select-toggle]` — popup toggle beside the trigger. Host sets
|
|
56
|
+
* `aria-expanded` and `disabled`.
|
|
57
|
+
* - `[data-select-clear]` — clears selection. Host toggles `hidden` and `disabled`.
|
|
58
|
+
* - `[data-autocomplete-input]` — search field inside the listbox. When the popup
|
|
59
|
+
* is open the host moves `role="combobox"` and related `aria-*` to this input.
|
|
60
|
+
*
|
|
61
|
+
* Do not set `role`, `aria-expanded`, `aria-controls`, or `aria-haspopup` on
|
|
62
|
+
* the trigger — the host owns those. The trigger must be a `div`, not a
|
|
63
|
+
* `<button>`: multi-select chips render remove buttons inside it.
|
|
64
|
+
*
|
|
65
|
+
* Nested hosts:
|
|
66
|
+
* - `rui-listbox` (`embedded`) — options at `[role="option"]`; host drives
|
|
67
|
+
* `aria-selected` and `aria-multiselectable` on the inner listbox.
|
|
68
|
+
* - `rui-tag-group` inside `[data-select-value]` — multi-select chips; host listens
|
|
69
|
+
* for `rui-remove` and `[data-tag]` clicks.
|
|
70
|
+
* - `rui-autocomplete` (optional) — filter wrapper inside `[data-select-listbox]`.
|
|
32
71
|
*
|
|
33
72
|
* @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/
|
|
34
73
|
* @element rui-select
|
|
35
|
-
* @
|
|
74
|
+
* @attr {string} value - Comma-separated selected values in markup; the property is `string[]`. Default: `[]`.
|
|
75
|
+
* @attr {string} label - Accessible name when there is no associated `RuiLabel`.
|
|
76
|
+
* @attr {string} placeholder - Shown when nothing is selected.
|
|
77
|
+
* @attr {boolean} disabled - Disable the trigger and popup. Default: `false`.
|
|
78
|
+
* @attr {('single'|'multiple')} selection-mode - Single or multi-select. Default: `single`.
|
|
79
|
+
* @attr {boolean} should-close-on-select - Whether selecting closes the popup (defaults to `true` for single, `false` for multiple).
|
|
80
|
+
* @attr {('focus'|'manual')} trigger-kind - Controls what opens the listbox. Default: `manual`.
|
|
81
|
+
* @fires rui-change - Emitted when the selected `value` changes; `detail.value` is `string[]`.
|
|
82
|
+
*
|
|
83
|
+
* @remarks
|
|
84
|
+
* Minimum tree: `[data-ref="root"]` > `[data-select-trigger]` > `[data-select-value]`,
|
|
85
|
+
* sibling `[data-select-listbox]` > `rui-listbox[embedded]` > `[role="option"]`.
|
|
86
|
+
* BEM classes live on the view helpers; the host never queries them.
|
|
87
|
+
* Not form-associated: wrap in `rui-field` and read `RuiForm` `onSubmit`.
|
|
88
|
+
* The selected value does not appear in native `FormData`.
|
|
36
89
|
*/
|
|
37
90
|
export declare class RuiSelect extends RadiantElement {
|
|
38
|
-
value: string;
|
|
91
|
+
value: string[];
|
|
39
92
|
label: string;
|
|
40
93
|
placeholder: string;
|
|
41
94
|
disabled: boolean;
|
|
42
95
|
selectionMode: RuiSelectSelectionMode;
|
|
43
96
|
shouldCloseOnSelect: boolean | undefined;
|
|
97
|
+
triggerKind: RuiSelectTriggerKind;
|
|
44
98
|
changeEvent: EventEmitter<RuiSelectChangeDetail>;
|
|
45
99
|
private open;
|
|
46
100
|
private readonly uid;
|
|
101
|
+
private readonly collection;
|
|
47
102
|
private readonly listboxBehavior;
|
|
48
103
|
rootTarget: HTMLElement;
|
|
49
104
|
private get listboxId();
|
|
50
105
|
private get triggerId();
|
|
51
106
|
private isMultiple;
|
|
52
107
|
private closesOnSelect;
|
|
53
|
-
private getSelectedValues;
|
|
54
|
-
private setSelectedValues;
|
|
55
108
|
private getSearchInput;
|
|
56
109
|
private hasSearchInput;
|
|
57
110
|
/** Element that receives `aria-activedescendant` while the popup is open. */
|
|
@@ -59,35 +112,22 @@ export declare class RuiSelect extends RadiantElement {
|
|
|
59
112
|
private resetSearchFilter;
|
|
60
113
|
private syncSearchInput;
|
|
61
114
|
private focusPopupInput;
|
|
62
|
-
/**
|
|
63
|
-
* Resolves the multi-select chip host inside the value slot.
|
|
64
|
-
*
|
|
65
|
-
* @remarks
|
|
66
|
-
* During Storybook/SSR upgrade, `querySelector` can return the host before
|
|
67
|
-
* `rui-tag-group` is defined — treat that as absent until `setItems` exists.
|
|
68
|
-
*/
|
|
69
|
-
private getTagGroup;
|
|
70
115
|
private hasTagGroup;
|
|
71
116
|
private syncTagGroup;
|
|
72
117
|
private syncTagGroupPlaceholder;
|
|
73
118
|
private removeSelectedValue;
|
|
119
|
+
private clearSelection;
|
|
74
120
|
private getTrigger;
|
|
121
|
+
private isTriggerFocusTarget;
|
|
75
122
|
private getToggle;
|
|
76
123
|
private getValueElement;
|
|
77
124
|
private getListboxPopup;
|
|
78
|
-
private getListbox;
|
|
79
|
-
private getListboxHost;
|
|
80
|
-
private getOptions;
|
|
81
|
-
private getOptionLabel;
|
|
82
|
-
private getOptionValue;
|
|
83
125
|
private ensureOptionIds;
|
|
84
126
|
private getAccessibleName;
|
|
85
127
|
private syncLabel;
|
|
86
128
|
private syncTrigger;
|
|
87
129
|
private syncToggle;
|
|
88
|
-
private syncListboxHost;
|
|
89
130
|
private syncValueDisplay;
|
|
90
|
-
private syncOptionSelection;
|
|
91
131
|
private setOpen;
|
|
92
132
|
private selectOption;
|
|
93
133
|
private handleListboxKeydown;
|
|
@@ -96,15 +136,23 @@ export declare class RuiSelect extends RadiantElement {
|
|
|
96
136
|
protected onConnected(): void;
|
|
97
137
|
disconnectedCallback(): void;
|
|
98
138
|
onPropsUpdated(): void;
|
|
139
|
+
onTriggerPointerDown(event: PointerEvent): void;
|
|
99
140
|
onTriggerClick(event: Event): void;
|
|
100
141
|
onTriggerKeydown(event: KeyboardEvent): void;
|
|
101
142
|
onSearchKeydown(event: KeyboardEvent): void;
|
|
102
143
|
onSearchInput(): void;
|
|
103
144
|
onTagRemove(event: Event): void;
|
|
145
|
+
onClearClick(event: Event): void;
|
|
104
146
|
onTagClick(event: Event): void;
|
|
105
147
|
onOptionPointerOver(event: Event): void;
|
|
106
148
|
onOptionMouseDown(event: Event): void;
|
|
107
149
|
onOptionClick(event: Event): void;
|
|
150
|
+
/**
|
|
151
|
+
* @remarks With `trigger-kind="focus"`, only focus arriving from outside the host
|
|
152
|
+
* opens the listbox. Focus the host moves back itself (option select, clear,
|
|
153
|
+
* toggle, search input) comes from a descendant and never reopens it.
|
|
154
|
+
*/
|
|
155
|
+
onRootFocusIn(event: FocusEvent): void;
|
|
108
156
|
onFocusOut(event: FocusEvent): void;
|
|
109
157
|
onDocumentPointerDown(event: PointerEvent): void;
|
|
110
158
|
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export type CalendarPopoverBehaviorConfig = {
|
|
2
|
+
getHost: () => HTMLElement;
|
|
3
|
+
getAnchor: () => HTMLElement | null;
|
|
4
|
+
getFloating: () => HTMLElement | null;
|
|
5
|
+
getOpen: () => boolean;
|
|
6
|
+
getCalendar: () => HTMLElement | null;
|
|
7
|
+
getFocusIso: () => string | undefined;
|
|
8
|
+
};
|
|
9
|
+
/**
|
|
10
|
+
* Shared popover positioning and dismissal for calendar-backed date pickers.
|
|
11
|
+
*
|
|
12
|
+
* @remarks Date-field and date-range-picker keep value commit and selection mode local.
|
|
13
|
+
*/
|
|
14
|
+
export declare class CalendarPopoverBehavior {
|
|
15
|
+
private readonly config;
|
|
16
|
+
private popoverController;
|
|
17
|
+
private suppressPopoverDismiss;
|
|
18
|
+
constructor(config: CalendarPopoverBehaviorConfig);
|
|
19
|
+
destroy(): void;
|
|
20
|
+
suppressDismiss(): void;
|
|
21
|
+
syncPopover(): void;
|
|
22
|
+
focusCalendarDay(): void;
|
|
23
|
+
handleFocusOut(event: FocusEvent, onClose: () => void): void;
|
|
24
|
+
private ensureController;
|
|
25
|
+
}
|
|
26
|
+
/** Focus the calendar's selected day, or the roving tabindex day, or the first available day. */
|
|
27
|
+
export declare function focusCalendarPickerDay(calendar: HTMLElement | null, iso?: string): void;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
2
|
@layer properties;
|
|
3
3
|
@layer components {
|
|
4
|
-
.rui-control-toggle
|
|
4
|
+
.rui-control-toggle,
|
|
5
|
+
.rui-control-clear {
|
|
5
6
|
display: inline-flex;
|
|
6
7
|
height: var(--spacing-8, var(--space-8));
|
|
7
8
|
width: var(--spacing-8, var(--space-8));
|
|
@@ -15,17 +16,20 @@
|
|
|
15
16
|
color: var(--color-on-surface, var(--on-surface));
|
|
16
17
|
cursor: pointer;
|
|
17
18
|
}
|
|
18
|
-
.rui-control-toggle:hover:not(:disabled)
|
|
19
|
+
.rui-control-toggle:hover:not(:disabled),
|
|
20
|
+
.rui-control-clear:hover:not(:disabled) {
|
|
19
21
|
background-color: var(--color-surface-container-low, var(--surface-container-low));
|
|
20
22
|
}
|
|
21
|
-
.rui-control-toggle:focus-visible
|
|
23
|
+
.rui-control-toggle:focus-visible,
|
|
24
|
+
.rui-control-clear:focus-visible {
|
|
22
25
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
23
26
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
24
27
|
--tw-ring-color: var(--color-focus-ring, var(--focus-ring));
|
|
25
28
|
--tw-outline-style: none;
|
|
26
29
|
outline-style: none;
|
|
27
30
|
}
|
|
28
|
-
.rui-control-toggle:disabled
|
|
31
|
+
.rui-control-toggle:disabled,
|
|
32
|
+
.rui-control-clear:disabled {
|
|
29
33
|
cursor: not-allowed;
|
|
30
34
|
opacity: var(--opacity-muted, var(--opacity-muted));
|
|
31
35
|
}
|
|
@@ -5,5 +5,10 @@ export type FieldLabelSyncOptions = {
|
|
|
5
5
|
};
|
|
6
6
|
/** Finds the visible label associated with a composed field control. */
|
|
7
7
|
export declare function findAssociatedLabel(owner: HTMLElement): HTMLLabelElement | null;
|
|
8
|
+
/** Points a visible label at a composed control and prefers it over `aria-label`. */
|
|
9
|
+
export declare function bindVisibleLabel(label: HTMLLabelElement, control: HTMLElement, options: {
|
|
10
|
+
controlId: string;
|
|
11
|
+
labelId: string;
|
|
12
|
+
}): void;
|
|
8
13
|
/** Applies the shared label-to-control ARIA contract for an unmanaged control. */
|
|
9
14
|
export declare function syncFieldLabel(owner: HTMLElement, control: HTMLElement | null, options: FieldLabelSyncOptions): void;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { RuiListbox, RuiListboxSelectionMode } from '../listbox/listbox.script';
|
|
2
|
+
import type { RuiTagGroup } from '../tag-group/tag-group.script';
|
|
3
|
+
export type ListboxHostControllerConfig = {
|
|
4
|
+
getRoot: () => ParentNode | null;
|
|
5
|
+
getSelectionMode: () => RuiListboxSelectionMode;
|
|
6
|
+
getValue: () => string[];
|
|
7
|
+
setValue: (value: string[]) => void;
|
|
8
|
+
/** Popup shell used when no `rui-listbox` host is present. */
|
|
9
|
+
getPopup?: () => HTMLElement | null;
|
|
10
|
+
/** Selector for an optional chip host, e.g. `[data-select-value] rui-tag-group`. */
|
|
11
|
+
tagGroupSelector?: string;
|
|
12
|
+
};
|
|
13
|
+
/**
|
|
14
|
+
* Selection and listbox-host sync shared by select and combobox.
|
|
15
|
+
*
|
|
16
|
+
* @remarks Popup open state, filtering, and trigger-kind policy stay on the
|
|
17
|
+
* owning custom element. This controller owns the contract both hosts must
|
|
18
|
+
* agree on: the embedded listbox, the `string[]` value property, option
|
|
19
|
+
* `aria-selected`, and optional tag-group chips. The comma-separated attribute
|
|
20
|
+
* protocol is handled by `multiValueTransform` on each host.
|
|
21
|
+
*/
|
|
22
|
+
export declare class ListboxHostController {
|
|
23
|
+
private readonly config;
|
|
24
|
+
constructor(config: ListboxHostControllerConfig);
|
|
25
|
+
getListboxHost(): RuiListbox | null;
|
|
26
|
+
getListbox(): HTMLElement | null;
|
|
27
|
+
getOptions(): HTMLElement[];
|
|
28
|
+
getSelectedValues(): string[];
|
|
29
|
+
setSelectedValues(values: string[]): void;
|
|
30
|
+
toggleValue(optionValue: string): void;
|
|
31
|
+
removeValue(optionValue: string): boolean;
|
|
32
|
+
clearValues(): boolean;
|
|
33
|
+
findOption(eventTarget: EventTarget | null): HTMLElement | null;
|
|
34
|
+
isSelectableOption(option: HTMLElement | null): option is HTMLElement;
|
|
35
|
+
syncListboxHost(): void;
|
|
36
|
+
syncOptionSelection(): void;
|
|
37
|
+
syncMultiselectable(listbox: HTMLElement | null): void;
|
|
38
|
+
getTagGroup(): RuiTagGroup | null;
|
|
39
|
+
syncTagGroup(): void;
|
|
40
|
+
labelForValue(value: string): string;
|
|
41
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/** Returns an option label without decorative selection-indicator content. */
|
|
2
|
+
export declare function getListboxOptionLabel(option: HTMLElement): string;
|
|
3
|
+
/** Returns the explicit option value or its visible label. */
|
|
4
|
+
export declare function getListboxOptionValue(option: HTMLElement): string;
|
|
@@ -1,4 +1,26 @@
|
|
|
1
|
+
import type { PropTransform } from '@ecopages/radiant';
|
|
1
2
|
/** Parses the comma-separated value protocol used by multi-select controls. */
|
|
2
3
|
export declare function parseMultiValue(value: string | null | undefined): string[];
|
|
3
4
|
/** Serializes multi-select values into the public custom-element value protocol. */
|
|
4
|
-
export declare function serializeMultiValue(values: string[]): string;
|
|
5
|
+
export declare function serializeMultiValue(values: readonly string[]): string;
|
|
6
|
+
/** `@prop` transform for comma-separated multi-value host attributes. */
|
|
7
|
+
export declare const multiValueTransform: PropTransform<string[]>;
|
|
8
|
+
/** Shared `@prop` options for comma-separated `string[]` host values. */
|
|
9
|
+
export declare const multiValuePropOptions: {
|
|
10
|
+
readonly type: ArrayConstructor;
|
|
11
|
+
readonly reflect: true;
|
|
12
|
+
readonly transform: PropTransform<string[]>;
|
|
13
|
+
};
|
|
14
|
+
/**
|
|
15
|
+
* JSX / view `value` accepted by listbox, select, combobox, checkbox-group,
|
|
16
|
+
* tag-group, and table. The live host property is always `string[]`.
|
|
17
|
+
*/
|
|
18
|
+
export type ViewMultiValue = string | readonly string[] | undefined;
|
|
19
|
+
/** Reads a view `value` as the selected-token array for SSR of selected children. */
|
|
20
|
+
export declare function parseViewValue(value: ViewMultiValue): string[];
|
|
21
|
+
/** `@prop` transform for comma-separated numeric host attributes (e.g. slider). */
|
|
22
|
+
export declare const numberArrayTransform: PropTransform<number[]>;
|
|
23
|
+
/**
|
|
24
|
+
* JSX / view `value` accepted by slider. The live host property is always `number[]`.
|
|
25
|
+
*/
|
|
26
|
+
export type ViewNumericValue = number | readonly number[] | undefined;
|
|
@@ -25,6 +25,14 @@ export declare function fractionDigitsFromStep(step: number): number;
|
|
|
25
25
|
export declare function resolveValuePrecision(step: number, valuePrecision: number | undefined): number;
|
|
26
26
|
/** Formats a numeric value for readouts, tooltips, and `aria-valuetext`. */
|
|
27
27
|
export declare function formatNumericValue(value: number, valuePrecision: number): string;
|
|
28
|
+
/**
|
|
29
|
+
* Whether two values sit on the same step tick after binary rounding.
|
|
30
|
+
*
|
|
31
|
+
* @remarks IEEE-754 noise can make `clamp(x) !== x` even when both stringify to
|
|
32
|
+
* the same step. Writing the clamped number back into a reflected `value`
|
|
33
|
+
* attribute then oscillates forever (`0.3` ↔ `0.30000000000000004`).
|
|
34
|
+
*/
|
|
35
|
+
export declare function valuesAlignOnStep(left: number, right: number, step: number): boolean;
|
|
28
36
|
/** Normalizes numeric-control bounds and step values into a stable interaction model. */
|
|
29
37
|
export declare function createNumericRange(min: number, max: number, step: number): NumericRange;
|
|
30
38
|
/**
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties;
|
|
3
2
|
@layer components {
|
|
4
3
|
.rui-popover {
|
|
4
|
+
--rui-popover-radius: var(--radius-container);
|
|
5
|
+
--rui-popover-surface: var(--background);
|
|
6
|
+
--rui-popover-border-color: var(--border);
|
|
7
|
+
--rui-popover-shadow: var(--shadow-overlay);
|
|
5
8
|
z-index: var(--z-index-popover, var(--z-popover));
|
|
6
9
|
overflow: auto;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
border-
|
|
10
|
-
border
|
|
11
|
-
background-color: var(--
|
|
12
|
-
|
|
13
|
-
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
10
|
+
max-height: var(--rui-popover-max-height, calc(100dvh - 1rem));
|
|
11
|
+
max-width: var(--rui-popover-max-width, calc(100vw - 1rem));
|
|
12
|
+
border-radius: var(--rui-popover-radius);
|
|
13
|
+
border: 1px solid var(--rui-popover-border-color);
|
|
14
|
+
background-color: var(--rui-popover-surface);
|
|
15
|
+
box-shadow: var(--rui-popover-shadow);
|
|
14
16
|
}
|
|
15
17
|
.rui-popover--listbox {
|
|
16
18
|
display: flex;
|
|
@@ -26,94 +28,3 @@
|
|
|
26
28
|
display: inline-flex;
|
|
27
29
|
}
|
|
28
30
|
}
|
|
29
|
-
@property --tw-border-style {
|
|
30
|
-
syntax: "*";
|
|
31
|
-
inherits: false;
|
|
32
|
-
initial-value: solid;
|
|
33
|
-
}
|
|
34
|
-
@property --tw-shadow {
|
|
35
|
-
syntax: "*";
|
|
36
|
-
inherits: false;
|
|
37
|
-
initial-value: 0 0 #0000;
|
|
38
|
-
}
|
|
39
|
-
@property --tw-shadow-color {
|
|
40
|
-
syntax: "*";
|
|
41
|
-
inherits: false;
|
|
42
|
-
}
|
|
43
|
-
@property --tw-shadow-alpha {
|
|
44
|
-
syntax: "<percentage>";
|
|
45
|
-
inherits: false;
|
|
46
|
-
initial-value: 100%;
|
|
47
|
-
}
|
|
48
|
-
@property --tw-inset-shadow {
|
|
49
|
-
syntax: "*";
|
|
50
|
-
inherits: false;
|
|
51
|
-
initial-value: 0 0 #0000;
|
|
52
|
-
}
|
|
53
|
-
@property --tw-inset-shadow-color {
|
|
54
|
-
syntax: "*";
|
|
55
|
-
inherits: false;
|
|
56
|
-
}
|
|
57
|
-
@property --tw-inset-shadow-alpha {
|
|
58
|
-
syntax: "<percentage>";
|
|
59
|
-
inherits: false;
|
|
60
|
-
initial-value: 100%;
|
|
61
|
-
}
|
|
62
|
-
@property --tw-ring-color {
|
|
63
|
-
syntax: "*";
|
|
64
|
-
inherits: false;
|
|
65
|
-
}
|
|
66
|
-
@property --tw-ring-shadow {
|
|
67
|
-
syntax: "*";
|
|
68
|
-
inherits: false;
|
|
69
|
-
initial-value: 0 0 #0000;
|
|
70
|
-
}
|
|
71
|
-
@property --tw-inset-ring-color {
|
|
72
|
-
syntax: "*";
|
|
73
|
-
inherits: false;
|
|
74
|
-
}
|
|
75
|
-
@property --tw-inset-ring-shadow {
|
|
76
|
-
syntax: "*";
|
|
77
|
-
inherits: false;
|
|
78
|
-
initial-value: 0 0 #0000;
|
|
79
|
-
}
|
|
80
|
-
@property --tw-ring-inset {
|
|
81
|
-
syntax: "*";
|
|
82
|
-
inherits: false;
|
|
83
|
-
}
|
|
84
|
-
@property --tw-ring-offset-width {
|
|
85
|
-
syntax: "<length>";
|
|
86
|
-
inherits: false;
|
|
87
|
-
initial-value: 0px;
|
|
88
|
-
}
|
|
89
|
-
@property --tw-ring-offset-color {
|
|
90
|
-
syntax: "*";
|
|
91
|
-
inherits: false;
|
|
92
|
-
initial-value: #fff;
|
|
93
|
-
}
|
|
94
|
-
@property --tw-ring-offset-shadow {
|
|
95
|
-
syntax: "*";
|
|
96
|
-
inherits: false;
|
|
97
|
-
initial-value: 0 0 #0000;
|
|
98
|
-
}
|
|
99
|
-
@layer properties {
|
|
100
|
-
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
101
|
-
*, ::before, ::after, ::backdrop {
|
|
102
|
-
--tw-border-style: solid;
|
|
103
|
-
--tw-shadow: 0 0 #0000;
|
|
104
|
-
--tw-shadow-color: initial;
|
|
105
|
-
--tw-shadow-alpha: 100%;
|
|
106
|
-
--tw-inset-shadow: 0 0 #0000;
|
|
107
|
-
--tw-inset-shadow-color: initial;
|
|
108
|
-
--tw-inset-shadow-alpha: 100%;
|
|
109
|
-
--tw-ring-color: initial;
|
|
110
|
-
--tw-ring-shadow: 0 0 #0000;
|
|
111
|
-
--tw-inset-ring-color: initial;
|
|
112
|
-
--tw-inset-ring-shadow: 0 0 #0000;
|
|
113
|
-
--tw-ring-inset: initial;
|
|
114
|
-
--tw-ring-offset-width: 0px;
|
|
115
|
-
--tw-ring-offset-color: #fff;
|
|
116
|
-
--tw-ring-offset-shadow: 0 0 #0000;
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export { RuiSidebar as RuiSidebarElement, type RuiSidebarProps, type RuiSidebarVariant, type RuiSidebarSide, type RuiSidebarCollapsible, type RuiSidebarState, type RuiSidebarMatchMode, type RuiSidebarToggleDetail, type RuiSidebarResizeDetail, } from './sidebar.script';
|
|
2
2
|
export { RuiSidebarTrigger as RuiSidebarTriggerElement, type RuiSidebarTriggerProps, type RuiSidebarTriggerPlacement, } from './sidebar-trigger.script';
|
|
3
|
-
export {
|
|
3
|
+
export { RuiSidebarTrigger, type RuiSidebarTriggerViewProps } from './sidebar-trigger';
|
|
4
|
+
export { RuiSidebar, RuiSidebarProvider, RuiSidebarHeader, RuiSidebarContent, RuiSidebarFooter, RuiSidebarSeparator, RuiSidebarGroup, RuiSidebarGroupLabel, RuiSidebarGroupAction, RuiSidebarGroupHeader, RuiSidebarMenu, RuiSidebarMenuItem, RuiSidebarMenuButton, RuiSidebarMenuAction, RuiSidebarInset, type RuiSidebarProviderProps, type RuiSidebarHeaderProps, type RuiSidebarContentProps, type RuiSidebarFooterProps, type RuiSidebarSeparatorProps, type RuiSidebarGroupProps, type RuiSidebarGroupLabelProps, type RuiSidebarGroupActionProps, type RuiSidebarGroupHeaderProps, type RuiSidebarMenuProps, type RuiSidebarMenuItemProps, type RuiSidebarMenuButtonControlProps, type RuiSidebarMenuButtonLinkProps, type RuiSidebarMenuButtonProps, type RuiSidebarMenuActionProps, type RuiSidebarInsetProps, type RuiSidebarViewProps, } from './sidebar';
|