@llui/components 0.4.10 → 0.5.1
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/dist/components/accordion.d.ts +13 -13
- package/dist/components/accordion.d.ts.map +1 -1
- package/dist/components/accordion.js +9 -9
- package/dist/components/accordion.js.map +1 -1
- package/dist/components/alert-dialog.d.ts +8 -8
- package/dist/components/alert-dialog.d.ts.map +1 -1
- package/dist/components/alert-dialog.js +2 -2
- package/dist/components/alert-dialog.js.map +1 -1
- package/dist/components/angle-slider.d.ts +13 -13
- package/dist/components/angle-slider.d.ts.map +1 -1
- package/dist/components/angle-slider.js +11 -11
- package/dist/components/angle-slider.js.map +1 -1
- package/dist/components/async-list.d.ts +7 -7
- package/dist/components/async-list.d.ts.map +1 -1
- package/dist/components/async-list.js +5 -8
- package/dist/components/async-list.js.map +1 -1
- package/dist/components/avatar.d.ts +9 -9
- package/dist/components/avatar.d.ts.map +1 -1
- package/dist/components/avatar.js +7 -7
- package/dist/components/avatar.js.map +1 -1
- package/dist/components/carousel.d.ts +18 -18
- package/dist/components/carousel.d.ts.map +1 -1
- package/dist/components/carousel.js +12 -12
- package/dist/components/carousel.js.map +1 -1
- package/dist/components/cascade-select.d.ts +12 -12
- package/dist/components/cascade-select.d.ts.map +1 -1
- package/dist/components/cascade-select.js +8 -8
- package/dist/components/cascade-select.js.map +1 -1
- package/dist/components/checkbox.d.ts +14 -14
- package/dist/components/checkbox.d.ts.map +1 -1
- package/dist/components/checkbox.js +12 -12
- package/dist/components/checkbox.js.map +1 -1
- package/dist/components/clipboard.d.ts +8 -8
- package/dist/components/clipboard.d.ts.map +1 -1
- package/dist/components/clipboard.js +6 -6
- package/dist/components/clipboard.js.map +1 -1
- package/dist/components/collapsible.d.ts +11 -11
- package/dist/components/collapsible.d.ts.map +1 -1
- package/dist/components/collapsible.js +9 -9
- package/dist/components/collapsible.js.map +1 -1
- package/dist/components/color-picker.d.ts +19 -19
- package/dist/components/color-picker.d.ts.map +1 -1
- package/dist/components/color-picker.js +21 -21
- package/dist/components/color-picker.js.map +1 -1
- package/dist/components/combobox.d.ts +25 -25
- package/dist/components/combobox.d.ts.map +1 -1
- package/dist/components/combobox.js +54 -59
- package/dist/components/combobox.js.map +1 -1
- package/dist/components/context-menu.d.ts +14 -14
- package/dist/components/context-menu.d.ts.map +1 -1
- package/dist/components/context-menu.js +15 -19
- package/dist/components/context-menu.js.map +1 -1
- package/dist/components/date-input.d.ts +13 -13
- package/dist/components/date-input.d.ts.map +1 -1
- package/dist/components/date-input.js +11 -11
- package/dist/components/date-input.js.map +1 -1
- package/dist/components/date-picker.d.ts +11 -11
- package/dist/components/date-picker.d.ts.map +1 -1
- package/dist/components/date-picker.js +7 -7
- package/dist/components/date-picker.js.map +1 -1
- package/dist/components/dialog.d.ts +15 -15
- package/dist/components/dialog.d.ts.map +1 -1
- package/dist/components/dialog.js +45 -50
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/drawer.d.ts +13 -13
- package/dist/components/drawer.d.ts.map +1 -1
- package/dist/components/drawer.js +44 -49
- package/dist/components/drawer.js.map +1 -1
- package/dist/components/editable.d.ts +11 -11
- package/dist/components/editable.d.ts.map +1 -1
- package/dist/components/editable.js +9 -9
- package/dist/components/editable.js.map +1 -1
- package/dist/components/file-upload.d.ts +19 -19
- package/dist/components/file-upload.d.ts.map +1 -1
- package/dist/components/file-upload.js +14 -14
- package/dist/components/file-upload.js.map +1 -1
- package/dist/components/floating-panel.d.ts +14 -14
- package/dist/components/floating-panel.d.ts.map +1 -1
- package/dist/components/floating-panel.js +13 -14
- package/dist/components/floating-panel.js.map +1 -1
- package/dist/components/form.d.ts +9 -9
- package/dist/components/form.d.ts.map +1 -1
- package/dist/components/form.js +7 -7
- package/dist/components/form.js.map +1 -1
- package/dist/components/hover-card.d.ts +9 -9
- package/dist/components/hover-card.d.ts.map +1 -1
- package/dist/components/hover-card.js +12 -13
- package/dist/components/hover-card.js.map +1 -1
- package/dist/components/image-cropper.d.ts +8 -8
- package/dist/components/image-cropper.d.ts.map +1 -1
- package/dist/components/image-cropper.js +7 -8
- package/dist/components/image-cropper.js.map +1 -1
- package/dist/components/in-view.d.ts +6 -6
- package/dist/components/in-view.d.ts.map +1 -1
- package/dist/components/in-view.js +2 -2
- package/dist/components/in-view.js.map +1 -1
- package/dist/components/listbox.d.ts +16 -16
- package/dist/components/listbox.d.ts.map +1 -1
- package/dist/components/listbox.js +16 -16
- package/dist/components/listbox.js.map +1 -1
- package/dist/components/marquee.d.ts +8 -8
- package/dist/components/marquee.d.ts.map +1 -1
- package/dist/components/marquee.js +8 -11
- package/dist/components/marquee.js.map +1 -1
- package/dist/components/menu.d.ts +15 -15
- package/dist/components/menu.d.ts.map +1 -1
- package/dist/components/menu.js +16 -17
- package/dist/components/menu.js.map +1 -1
- package/dist/components/navigation-menu.d.ts +12 -12
- package/dist/components/navigation-menu.d.ts.map +1 -1
- package/dist/components/navigation-menu.js +8 -8
- package/dist/components/navigation-menu.js.map +1 -1
- package/dist/components/number-input.d.ts +18 -18
- package/dist/components/number-input.d.ts.map +1 -1
- package/dist/components/number-input.js +16 -20
- package/dist/components/number-input.js.map +1 -1
- package/dist/components/pagination.d.ts +13 -13
- package/dist/components/pagination.d.ts.map +1 -1
- package/dist/components/pagination.js +11 -17
- package/dist/components/pagination.js.map +1 -1
- package/dist/components/password-input.d.ts +11 -11
- package/dist/components/password-input.d.ts.map +1 -1
- package/dist/components/password-input.js +11 -11
- package/dist/components/password-input.js.map +1 -1
- package/dist/components/pin-input.d.ts +9 -9
- package/dist/components/pin-input.d.ts.map +1 -1
- package/dist/components/pin-input.js +9 -9
- package/dist/components/pin-input.js.map +1 -1
- package/dist/components/popover.d.ts +11 -11
- package/dist/components/popover.d.ts.map +1 -1
- package/dist/components/popover.js +61 -60
- package/dist/components/popover.js.map +1 -1
- package/dist/components/presence.d.ts +7 -5
- package/dist/components/presence.d.ts.map +1 -1
- package/dist/components/presence.js +5 -3
- package/dist/components/presence.js.map +1 -1
- package/dist/components/progress.d.ts +14 -14
- package/dist/components/progress.d.ts.map +1 -1
- package/dist/components/progress.js +12 -12
- package/dist/components/progress.js.map +1 -1
- package/dist/components/qr-code.d.ts +7 -7
- package/dist/components/qr-code.d.ts.map +1 -1
- package/dist/components/qr-code.js +7 -7
- package/dist/components/qr-code.js.map +1 -1
- package/dist/components/radio-group.d.ts +15 -15
- package/dist/components/radio-group.d.ts.map +1 -1
- package/dist/components/radio-group.js +12 -13
- package/dist/components/radio-group.js.map +1 -1
- package/dist/components/rating-group.d.ts +13 -13
- package/dist/components/rating-group.d.ts.map +1 -1
- package/dist/components/rating-group.js +10 -11
- package/dist/components/rating-group.js.map +1 -1
- package/dist/components/scroll-area.d.ts +10 -10
- package/dist/components/scroll-area.d.ts.map +1 -1
- package/dist/components/scroll-area.js +10 -15
- package/dist/components/scroll-area.js.map +1 -1
- package/dist/components/select.d.ts +26 -26
- package/dist/components/select.d.ts.map +1 -1
- package/dist/components/select.js +29 -33
- package/dist/components/select.js.map +1 -1
- package/dist/components/signature-pad.d.ts +12 -12
- package/dist/components/signature-pad.d.ts.map +1 -1
- package/dist/components/signature-pad.js +10 -10
- package/dist/components/signature-pad.js.map +1 -1
- package/dist/components/slider.d.ts +22 -22
- package/dist/components/slider.d.ts.map +1 -1
- package/dist/components/slider.js +17 -17
- package/dist/components/slider.js.map +1 -1
- package/dist/components/sortable.d.ts +11 -11
- package/dist/components/sortable.d.ts.map +1 -1
- package/dist/components/sortable.js +20 -20
- package/dist/components/sortable.js.map +1 -1
- package/dist/components/splitter.d.ts +15 -15
- package/dist/components/splitter.d.ts.map +1 -1
- package/dist/components/splitter.js +15 -15
- package/dist/components/splitter.js.map +1 -1
- package/dist/components/steps.d.ts +14 -14
- package/dist/components/steps.d.ts.map +1 -1
- package/dist/components/steps.js +10 -16
- package/dist/components/steps.js.map +1 -1
- package/dist/components/switch.d.ts +12 -12
- package/dist/components/switch.d.ts.map +1 -1
- package/dist/components/switch.js +10 -10
- package/dist/components/switch.js.map +1 -1
- package/dist/components/tabs.d.ts +15 -15
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +11 -11
- package/dist/components/tabs.js.map +1 -1
- package/dist/components/tags-input.d.ts +14 -14
- package/dist/components/tags-input.d.ts.map +1 -1
- package/dist/components/tags-input.js +10 -10
- package/dist/components/tags-input.js.map +1 -1
- package/dist/components/theme-switch.d.ts +5 -5
- package/dist/components/theme-switch.d.ts.map +1 -1
- package/dist/components/theme-switch.js +3 -3
- package/dist/components/theme-switch.js.map +1 -1
- package/dist/components/time-picker.d.ts +19 -19
- package/dist/components/time-picker.d.ts.map +1 -1
- package/dist/components/time-picker.js +17 -17
- package/dist/components/time-picker.js.map +1 -1
- package/dist/components/timer.d.ts +10 -10
- package/dist/components/timer.d.ts.map +1 -1
- package/dist/components/timer.js +8 -8
- package/dist/components/timer.js.map +1 -1
- package/dist/components/toast.d.ts +8 -8
- package/dist/components/toast.d.ts.map +1 -1
- package/dist/components/toast.js +4 -4
- package/dist/components/toast.js.map +1 -1
- package/dist/components/toc.d.ts +12 -12
- package/dist/components/toc.d.ts.map +1 -1
- package/dist/components/toc.js +8 -8
- package/dist/components/toc.js.map +1 -1
- package/dist/components/toggle-group.d.ts +13 -13
- package/dist/components/toggle-group.d.ts.map +1 -1
- package/dist/components/toggle-group.js +9 -9
- package/dist/components/toggle-group.js.map +1 -1
- package/dist/components/toggle.d.ts +8 -8
- package/dist/components/toggle.d.ts.map +1 -1
- package/dist/components/toggle.js +6 -6
- package/dist/components/toggle.js.map +1 -1
- package/dist/components/tooltip.d.ts +10 -10
- package/dist/components/tooltip.d.ts.map +1 -1
- package/dist/components/tooltip.js +13 -14
- package/dist/components/tooltip.js.map +1 -1
- package/dist/components/tour.d.ts +7 -7
- package/dist/components/tour.d.ts.map +1 -1
- package/dist/components/tour.js +5 -5
- package/dist/components/tour.js.map +1 -1
- package/dist/components/tree-view.d.ts +19 -19
- package/dist/components/tree-view.d.ts.map +1 -1
- package/dist/components/tree-view.js +23 -23
- package/dist/components/tree-view.js.map +1 -1
- package/dist/patterns/confirm-dialog.d.ts +4 -4
- package/dist/patterns/confirm-dialog.d.ts.map +1 -1
- package/dist/patterns/confirm-dialog.js +7 -9
- package/dist/patterns/confirm-dialog.js.map +1 -1
- package/package.json +3 -3
- package/dist/components/enter-view.d.ts +0 -73
- package/dist/components/enter-view.d.ts.map +0 -1
- package/dist/components/enter-view.js +0 -51
- package/dist/utils/validators.d.ts +0 -34
- package/dist/utils/validators.d.ts.map +0 -1
- package/dist/utils/validators.js +0 -83
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Send } from '@llui/dom';
|
|
1
|
+
import type { Send, Signal } from '@llui/dom';
|
|
2
2
|
/**
|
|
3
3
|
* Tabs — tabbed interface with keyboard navigation. Each tab has a value
|
|
4
4
|
* (string) that identifies both the trigger and the associated panel.
|
|
@@ -72,20 +72,20 @@ export interface TabsInit {
|
|
|
72
72
|
}
|
|
73
73
|
export declare function init(opts?: TabsInit): TabsState;
|
|
74
74
|
export declare function update(state: TabsState, msg: TabsMsg): [TabsState, never[]];
|
|
75
|
-
export interface TabsItemParts
|
|
75
|
+
export interface TabsItemParts {
|
|
76
76
|
trigger: {
|
|
77
77
|
type: 'button';
|
|
78
78
|
role: 'tab';
|
|
79
|
-
'aria-selected':
|
|
79
|
+
'aria-selected': Signal<boolean>;
|
|
80
80
|
'aria-controls': string;
|
|
81
|
-
'aria-disabled':
|
|
81
|
+
'aria-disabled': Signal<'true' | undefined>;
|
|
82
82
|
id: string;
|
|
83
|
-
'data-state':
|
|
84
|
-
'data-disabled':
|
|
83
|
+
'data-state': Signal<'active' | 'inactive'>;
|
|
84
|
+
'data-disabled': Signal<'' | undefined>;
|
|
85
85
|
'data-scope': 'tabs';
|
|
86
86
|
'data-part': 'trigger';
|
|
87
87
|
'data-value': string;
|
|
88
|
-
tabIndex:
|
|
88
|
+
tabIndex: Signal<number>;
|
|
89
89
|
onClick: (e: MouseEvent) => void;
|
|
90
90
|
onKeyDown: (e: KeyboardEvent) => void;
|
|
91
91
|
onFocus: (e: FocusEvent) => void;
|
|
@@ -95,18 +95,18 @@ export interface TabsItemParts<S> {
|
|
|
95
95
|
id: string;
|
|
96
96
|
'aria-labelledby': string;
|
|
97
97
|
tabIndex: 0;
|
|
98
|
-
hidden:
|
|
99
|
-
'data-state':
|
|
98
|
+
hidden: Signal<boolean>;
|
|
99
|
+
'data-state': Signal<'active' | 'inactive'>;
|
|
100
100
|
'data-scope': 'tabs';
|
|
101
101
|
'data-part': 'panel';
|
|
102
102
|
'data-value': string;
|
|
103
103
|
};
|
|
104
104
|
}
|
|
105
|
-
export interface TabsParts
|
|
105
|
+
export interface TabsParts {
|
|
106
106
|
root: {
|
|
107
107
|
'data-scope': 'tabs';
|
|
108
108
|
'data-part': 'root';
|
|
109
|
-
'data-orientation':
|
|
109
|
+
'data-orientation': Signal<Orientation>;
|
|
110
110
|
};
|
|
111
111
|
/**
|
|
112
112
|
* A movable underline/highlight element. Position tracks the active
|
|
@@ -119,15 +119,15 @@ export interface TabsParts<S> {
|
|
|
119
119
|
indicator: {
|
|
120
120
|
'data-scope': 'tabs';
|
|
121
121
|
'data-part': 'indicator';
|
|
122
|
-
'data-orientation':
|
|
122
|
+
'data-orientation': Signal<Orientation>;
|
|
123
123
|
};
|
|
124
124
|
list: {
|
|
125
125
|
role: 'tablist';
|
|
126
|
-
'aria-orientation':
|
|
126
|
+
'aria-orientation': Signal<Orientation>;
|
|
127
127
|
'data-scope': 'tabs';
|
|
128
128
|
'data-part': 'list';
|
|
129
129
|
};
|
|
130
|
-
item: (value: string) => TabsItemParts
|
|
130
|
+
item: (value: string) => TabsItemParts;
|
|
131
131
|
}
|
|
132
132
|
export interface ConnectOptions {
|
|
133
133
|
id: string;
|
|
@@ -138,7 +138,7 @@ export interface ConnectOptions {
|
|
|
138
138
|
*/
|
|
139
139
|
onNavigate?: (value: string) => void;
|
|
140
140
|
}
|
|
141
|
-
export declare function connect
|
|
141
|
+
export declare function connect(state: Signal<TabsState>, send: Send<TabsMsg>, opts: ConnectOptions): TabsParts;
|
|
142
142
|
/**
|
|
143
143
|
* Track the active tab trigger and update CSS custom properties on the
|
|
144
144
|
* indicator element so it can be animated into position. Call from
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.ts"],"names":[],"mappings":"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"}
|
package/dist/components/tabs.js
CHANGED
|
@@ -112,7 +112,7 @@ export function update(state, msg) {
|
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
114
|
}
|
|
115
|
-
export function connect(
|
|
115
|
+
export function connect(state, send, opts) {
|
|
116
116
|
const base = opts.id;
|
|
117
117
|
const triggerId = (v) => `${base}:trigger:${v}`;
|
|
118
118
|
const panelId = (v) => `${base}:panel:${v}`;
|
|
@@ -120,33 +120,33 @@ export function connect(get, send, opts) {
|
|
|
120
120
|
root: {
|
|
121
121
|
'data-scope': 'tabs',
|
|
122
122
|
'data-part': 'root',
|
|
123
|
-
'data-orientation': (s) =>
|
|
123
|
+
'data-orientation': state.map((s) => s.orientation),
|
|
124
124
|
},
|
|
125
125
|
list: {
|
|
126
126
|
role: 'tablist',
|
|
127
|
-
'aria-orientation': (s) =>
|
|
127
|
+
'aria-orientation': state.map((s) => s.orientation),
|
|
128
128
|
'data-scope': 'tabs',
|
|
129
129
|
'data-part': 'list',
|
|
130
130
|
},
|
|
131
131
|
indicator: {
|
|
132
132
|
'data-scope': 'tabs',
|
|
133
133
|
'data-part': 'indicator',
|
|
134
|
-
'data-orientation': (s) =>
|
|
134
|
+
'data-orientation': state.map((s) => s.orientation),
|
|
135
135
|
},
|
|
136
136
|
item: (value) => ({
|
|
137
137
|
trigger: {
|
|
138
138
|
type: 'button',
|
|
139
139
|
role: 'tab',
|
|
140
|
-
'aria-selected': (s) =>
|
|
140
|
+
'aria-selected': state.map((s) => s.value === value),
|
|
141
141
|
'aria-controls': panelId(value),
|
|
142
|
-
'aria-disabled': (s) => (
|
|
142
|
+
'aria-disabled': state.map((s) => (s.disabledItems.includes(value) ? 'true' : undefined)),
|
|
143
143
|
id: triggerId(value),
|
|
144
|
-
'data-state': (s) => (
|
|
145
|
-
'data-disabled': (s) => (
|
|
144
|
+
'data-state': state.map((s) => (s.value === value ? 'active' : 'inactive')),
|
|
145
|
+
'data-disabled': state.map((s) => (s.disabledItems.includes(value) ? '' : undefined)),
|
|
146
146
|
'data-scope': 'tabs',
|
|
147
147
|
'data-part': 'trigger',
|
|
148
148
|
'data-value': value,
|
|
149
|
-
tabIndex: (s) => (
|
|
149
|
+
tabIndex: state.map((s) => (s.value === value ? 0 : -1)),
|
|
150
150
|
onClick: tagSend(send, ['focusTab'], () => {
|
|
151
151
|
send({ type: 'focusTab', value });
|
|
152
152
|
opts.onNavigate?.(value);
|
|
@@ -195,8 +195,8 @@ export function connect(get, send, opts) {
|
|
|
195
195
|
id: panelId(value),
|
|
196
196
|
'aria-labelledby': triggerId(value),
|
|
197
197
|
tabIndex: 0,
|
|
198
|
-
hidden: (s) =>
|
|
199
|
-
'data-state': (s) => (
|
|
198
|
+
hidden: state.map((s) => s.value !== value),
|
|
199
|
+
'data-state': state.map((s) => (s.value === value ? 'active' : 'inactive')),
|
|
200
200
|
'data-scope': 'tabs',
|
|
201
201
|
'data-part': 'panel',
|
|
202
202
|
'data-value': value,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/components/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send } from '@llui/dom'\nimport { flipArrow } from '../utils/direction.js'\n\n/**\n * Tabs — tabbed interface with keyboard navigation. Each tab has a value\n * (string) that identifies both the trigger and the associated panel.\n *\n * Two activation modes:\n * - `'automatic'` (default): focusing a trigger also activates it.\n * - `'manual'`: arrow keys move focus without activating; Enter/Space activates.\n */\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Activation = 'automatic' | 'manual'\n\nexport interface TabsState {\n value: string\n items: string[]\n disabledItems: string[]\n orientation: Orientation\n activation: Activation\n /** The currently focused (but not necessarily active) tab. For manual mode. */\n focused: string | null\n /** Whether Arrow navigation wraps at the ends of the tab list. Default: true. */\n loopFocus: boolean\n /** Whether clicking the active tab deselects it (empty value). Default: false. */\n deselectable: boolean\n}\n\nexport type TabsMsg =\n /** @intent(\"Switch to the tab with the given value\") */\n | { type: 'setValue'; value: string }\n /** @humanOnly */\n | { type: 'setItems'; items: string[]; disabled?: string[] }\n /** @humanOnly */\n | { type: 'focusTab'; value: string }\n /** @humanOnly */\n | { type: 'focusNext'; from: string }\n /** @humanOnly */\n | { type: 'focusPrev'; from: string }\n /** @humanOnly */\n | { type: 'focusFirst' }\n /** @humanOnly */\n | { type: 'focusLast' }\n /** @intent(\"Activate the currently-focused tab (for manual activation mode)\") */\n | { type: 'activateFocused' }\n\nexport interface TabsInit {\n value?: string\n items?: string[]\n disabledItems?: string[]\n orientation?: Orientation\n activation?: Activation\n loopFocus?: boolean\n deselectable?: boolean\n}\n\nexport function init(opts: TabsInit = {}): TabsState {\n const items = opts.items ?? []\n return {\n value: opts.value ?? items[0] ?? '',\n items,\n disabledItems: opts.disabledItems ?? [],\n orientation: opts.orientation ?? 'horizontal',\n activation: opts.activation ?? 'automatic',\n focused: null,\n loopFocus: opts.loopFocus ?? true,\n deselectable: opts.deselectable ?? false,\n }\n}\n\nfunction firstEnabled(items: string[], disabled: string[]): string | null {\n for (const v of items) if (!disabled.includes(v)) return v\n return null\n}\n\nfunction lastEnabled(items: string[], disabled: string[]): string | null {\n for (let i = items.length - 1; i >= 0; i--) {\n const v = items[i]!\n if (!disabled.includes(v)) return v\n }\n return null\n}\n\nfunction nextEnabled(\n items: string[],\n disabled: string[],\n from: string,\n delta: 1 | -1,\n loop: boolean,\n): string | null {\n if (items.length === 0) return null\n const idx = items.indexOf(from)\n if (idx === -1) return firstEnabled(items, disabled)\n const n = items.length\n for (let i = 1; i <= n; i++) {\n const rawIdx = idx + delta * i\n if (!loop && (rawIdx < 0 || rawIdx >= n)) return null\n const next = items[(rawIdx + n * n) % n]!\n if (!disabled.includes(next)) return next\n }\n return null\n}\n\nexport function update(state: TabsState, msg: TabsMsg): [TabsState, never[]] {\n switch (msg.type) {\n case 'setValue':\n if (state.disabledItems.includes(msg.value)) return [state, []]\n return [{ ...state, value: msg.value }, []]\n case 'setItems': {\n const disabled = msg.disabled ?? state.disabledItems\n // Ensure value still points to an existing enabled item\n let value = state.value\n if (!msg.items.includes(value) || disabled.includes(value)) {\n value = firstEnabled(msg.items, disabled) ?? ''\n }\n return [{ ...state, items: msg.items, disabledItems: disabled, value }, []]\n }\n case 'focusTab': {\n if (state.disabledItems.includes(msg.value)) return [state, []]\n const next: TabsState = { ...state, focused: msg.value }\n if (state.activation === 'automatic') {\n // Deselectable: clicking the already-active tab clears the value.\n next.value = state.deselectable && state.value === msg.value ? '' : msg.value\n }\n return [next, []]\n }\n case 'focusNext': {\n const to = nextEnabled(state.items, state.disabledItems, msg.from, 1, state.loopFocus)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusPrev': {\n const to = nextEnabled(state.items, state.disabledItems, msg.from, -1, state.loopFocus)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusFirst': {\n const to = firstEnabled(state.items, state.disabledItems)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusLast': {\n const to = lastEnabled(state.items, state.disabledItems)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'activateFocused': {\n if (state.focused === null) return [state, []]\n return [{ ...state, value: state.focused }, []]\n }\n }\n}\n\nexport interface TabsItemParts<S> {\n trigger: {\n type: 'button'\n role: 'tab'\n 'aria-selected': (s: S) => boolean\n 'aria-controls': string\n 'aria-disabled': (s: S) => 'true' | undefined\n id: string\n 'data-state': (s: S) => 'active' | 'inactive'\n 'data-disabled': (s: S) => '' | undefined\n 'data-scope': 'tabs'\n 'data-part': 'trigger'\n 'data-value': string\n tabIndex: (s: S) => number\n onClick: (e: MouseEvent) => void\n onKeyDown: (e: KeyboardEvent) => void\n onFocus: (e: FocusEvent) => void\n }\n panel: {\n role: 'tabpanel'\n id: string\n 'aria-labelledby': string\n tabIndex: 0\n hidden: (s: S) => boolean\n 'data-state': (s: S) => 'active' | 'inactive'\n 'data-scope': 'tabs'\n 'data-part': 'panel'\n 'data-value': string\n }\n}\n\nexport interface TabsParts<S> {\n root: {\n 'data-scope': 'tabs'\n 'data-part': 'root'\n 'data-orientation': (s: S) => Orientation\n }\n /**\n * A movable underline/highlight element. Position tracks the active\n * trigger via CSS custom properties written by `watchTabIndicator()`:\n * `--indicator-left`, `--indicator-top`, `--indicator-width`,\n * `--indicator-height` — all in pixels.\n * The consumer styles the indicator using these properties (e.g.\n * `transform: translateX(var(--indicator-left))`).\n */\n indicator: {\n 'data-scope': 'tabs'\n 'data-part': 'indicator'\n 'data-orientation': (s: S) => Orientation\n }\n list: {\n role: 'tablist'\n 'aria-orientation': (s: S) => Orientation\n 'data-scope': 'tabs'\n 'data-part': 'list'\n }\n item: (value: string) => TabsItemParts<S>\n}\n\nexport interface ConnectOptions {\n id: string\n /**\n * Called whenever a tab is clicked/activated. Useful for anchor-style\n * navigation where the tab's value is a URL path and you want to push\n * to the history or router.\n */\n onNavigate?: (value: string) => void\n}\n\nexport function connect<S>(\n get: (s: S) => TabsState,\n send: Send<TabsMsg>,\n opts: ConnectOptions,\n): TabsParts<S> {\n const base = opts.id\n const triggerId = (v: string): string => `${base}:trigger:${v}`\n const panelId = (v: string): string => `${base}:panel:${v}`\n\n return {\n root: {\n 'data-scope': 'tabs',\n 'data-part': 'root',\n 'data-orientation': (s) => get(s).orientation,\n },\n list: {\n role: 'tablist',\n 'aria-orientation': (s) => get(s).orientation,\n 'data-scope': 'tabs',\n 'data-part': 'list',\n },\n indicator: {\n 'data-scope': 'tabs',\n 'data-part': 'indicator',\n 'data-orientation': (s) => get(s).orientation,\n },\n item: (value: string): TabsItemParts<S> => ({\n trigger: {\n type: 'button',\n role: 'tab',\n 'aria-selected': (s) => get(s).value === value,\n 'aria-controls': panelId(value),\n 'aria-disabled': (s) => (get(s).disabledItems.includes(value) ? 'true' : undefined),\n id: triggerId(value),\n 'data-state': (s) => (get(s).value === value ? 'active' : 'inactive'),\n 'data-disabled': (s) => (get(s).disabledItems.includes(value) ? '' : undefined),\n 'data-scope': 'tabs',\n 'data-part': 'trigger',\n 'data-value': value,\n tabIndex: (s) => (get(s).value === value ? 0 : -1),\n onClick: tagSend(send, ['focusTab'], () => {\n send({ type: 'focusTab', value })\n opts.onNavigate?.(value)\n }),\n onFocus: tagSend(send, ['focusTab'], () => {\n // `focusTab` handles automatic activation\n send({ type: 'focusTab', value })\n }),\n onKeyDown: tagSend(\n send,\n ['focusNext', 'focusPrev', 'focusFirst', 'focusLast', 'activateFocused'],\n (e: KeyboardEvent) => {\n // Read orientation from the ancestor [data-part=\"list\"] so the\n // handler can dispatch the correct arrow keys per WAI-ARIA.\n // Horizontal tabs: ArrowLeft/Right navigate; vertical: Up/Down.\n const target = e.currentTarget as HTMLElement | null\n const list = target?.closest(\n '[data-scope=\"tabs\"][data-part=\"list\"]',\n ) as HTMLElement | null\n const orientation =\n (list?.getAttribute('aria-orientation') as Orientation | null) ?? 'horizontal'\n const key = flipArrow(e.key, e.currentTarget as Element)\n const nextKey = orientation === 'vertical' ? 'ArrowDown' : 'ArrowRight'\n const prevKey = orientation === 'vertical' ? 'ArrowUp' : 'ArrowLeft'\n switch (key) {\n case nextKey:\n e.preventDefault()\n send({ type: 'focusNext', from: value })\n return\n case prevKey:\n e.preventDefault()\n send({ type: 'focusPrev', from: value })\n return\n case 'Home':\n e.preventDefault()\n send({ type: 'focusFirst' })\n return\n case 'End':\n e.preventDefault()\n send({ type: 'focusLast' })\n return\n case 'Enter':\n case ' ':\n e.preventDefault()\n send({ type: 'activateFocused' })\n return\n }\n },\n ),\n },\n panel: {\n role: 'tabpanel',\n id: panelId(value),\n 'aria-labelledby': triggerId(value),\n tabIndex: 0,\n hidden: (s) => get(s).value !== value,\n 'data-state': (s) => (get(s).value === value ? 'active' : 'inactive'),\n 'data-scope': 'tabs',\n 'data-part': 'panel',\n 'data-value': value,\n },\n }),\n }\n}\n\n/**\n * Track the active tab trigger and update CSS custom properties on the\n * indicator element so it can be animated into position. Call from\n * `onMount` with the tabs root element; the returned function removes\n * the observers.\n *\n * Sets `--indicator-left`, `--indicator-top`, `--indicator-width`,\n * `--indicator-height` on the indicator element every time the active\n * trigger changes or the list resizes. Style the indicator with:\n * transform: translate(var(--indicator-left), var(--indicator-top));\n * width: var(--indicator-width);\n * height: var(--indicator-height);\n */\nexport function watchTabIndicator(root: HTMLElement): () => void {\n const indicator = root.querySelector<HTMLElement>('[data-scope=\"tabs\"][data-part=\"indicator\"]')\n const list = root.querySelector<HTMLElement>('[data-scope=\"tabs\"][data-part=\"list\"]')\n if (!indicator || !list) return () => {}\n\n const sync = (): void => {\n const active = list.querySelector<HTMLElement>(\n '[data-scope=\"tabs\"][data-part=\"trigger\"][data-state=\"active\"]',\n )\n if (!active) return\n indicator.style.setProperty('--indicator-left', `${active.offsetLeft}px`)\n indicator.style.setProperty('--indicator-top', `${active.offsetTop}px`)\n indicator.style.setProperty('--indicator-width', `${active.offsetWidth}px`)\n indicator.style.setProperty('--indicator-height', `${active.offsetHeight}px`)\n }\n\n sync()\n\n const mo = new MutationObserver(sync)\n mo.observe(list, { attributes: true, attributeFilter: ['data-state'], subtree: true })\n\n // ResizeObserver may be absent in older environments or jsdom — skip\n // gracefully; layout changes that don't involve a data-state flip just\n // won't reposition the indicator until the next attribute change.\n const ro = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(sync) : null\n ro?.observe(list)\n\n return () => {\n mo.disconnect()\n ro?.disconnect()\n }\n}\n\nexport const tabs = { init, update, connect, watchTabIndicator }\n"]}
|
|
1
|
+
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/components/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send, Signal } from '@llui/dom'\nimport { flipArrow } from '../utils/direction.js'\n\n/**\n * Tabs — tabbed interface with keyboard navigation. Each tab has a value\n * (string) that identifies both the trigger and the associated panel.\n *\n * Two activation modes:\n * - `'automatic'` (default): focusing a trigger also activates it.\n * - `'manual'`: arrow keys move focus without activating; Enter/Space activates.\n */\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Activation = 'automatic' | 'manual'\n\nexport interface TabsState {\n value: string\n items: string[]\n disabledItems: string[]\n orientation: Orientation\n activation: Activation\n /** The currently focused (but not necessarily active) tab. For manual mode. */\n focused: string | null\n /** Whether Arrow navigation wraps at the ends of the tab list. Default: true. */\n loopFocus: boolean\n /** Whether clicking the active tab deselects it (empty value). Default: false. */\n deselectable: boolean\n}\n\nexport type TabsMsg =\n /** @intent(\"Switch to the tab with the given value\") */\n | { type: 'setValue'; value: string }\n /** @humanOnly */\n | { type: 'setItems'; items: string[]; disabled?: string[] }\n /** @humanOnly */\n | { type: 'focusTab'; value: string }\n /** @humanOnly */\n | { type: 'focusNext'; from: string }\n /** @humanOnly */\n | { type: 'focusPrev'; from: string }\n /** @humanOnly */\n | { type: 'focusFirst' }\n /** @humanOnly */\n | { type: 'focusLast' }\n /** @intent(\"Activate the currently-focused tab (for manual activation mode)\") */\n | { type: 'activateFocused' }\n\nexport interface TabsInit {\n value?: string\n items?: string[]\n disabledItems?: string[]\n orientation?: Orientation\n activation?: Activation\n loopFocus?: boolean\n deselectable?: boolean\n}\n\nexport function init(opts: TabsInit = {}): TabsState {\n const items = opts.items ?? []\n return {\n value: opts.value ?? items[0] ?? '',\n items,\n disabledItems: opts.disabledItems ?? [],\n orientation: opts.orientation ?? 'horizontal',\n activation: opts.activation ?? 'automatic',\n focused: null,\n loopFocus: opts.loopFocus ?? true,\n deselectable: opts.deselectable ?? false,\n }\n}\n\nfunction firstEnabled(items: string[], disabled: string[]): string | null {\n for (const v of items) if (!disabled.includes(v)) return v\n return null\n}\n\nfunction lastEnabled(items: string[], disabled: string[]): string | null {\n for (let i = items.length - 1; i >= 0; i--) {\n const v = items[i]!\n if (!disabled.includes(v)) return v\n }\n return null\n}\n\nfunction nextEnabled(\n items: string[],\n disabled: string[],\n from: string,\n delta: 1 | -1,\n loop: boolean,\n): string | null {\n if (items.length === 0) return null\n const idx = items.indexOf(from)\n if (idx === -1) return firstEnabled(items, disabled)\n const n = items.length\n for (let i = 1; i <= n; i++) {\n const rawIdx = idx + delta * i\n if (!loop && (rawIdx < 0 || rawIdx >= n)) return null\n const next = items[(rawIdx + n * n) % n]!\n if (!disabled.includes(next)) return next\n }\n return null\n}\n\nexport function update(state: TabsState, msg: TabsMsg): [TabsState, never[]] {\n switch (msg.type) {\n case 'setValue':\n if (state.disabledItems.includes(msg.value)) return [state, []]\n return [{ ...state, value: msg.value }, []]\n case 'setItems': {\n const disabled = msg.disabled ?? state.disabledItems\n // Ensure value still points to an existing enabled item\n let value = state.value\n if (!msg.items.includes(value) || disabled.includes(value)) {\n value = firstEnabled(msg.items, disabled) ?? ''\n }\n return [{ ...state, items: msg.items, disabledItems: disabled, value }, []]\n }\n case 'focusTab': {\n if (state.disabledItems.includes(msg.value)) return [state, []]\n const next: TabsState = { ...state, focused: msg.value }\n if (state.activation === 'automatic') {\n // Deselectable: clicking the already-active tab clears the value.\n next.value = state.deselectable && state.value === msg.value ? '' : msg.value\n }\n return [next, []]\n }\n case 'focusNext': {\n const to = nextEnabled(state.items, state.disabledItems, msg.from, 1, state.loopFocus)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusPrev': {\n const to = nextEnabled(state.items, state.disabledItems, msg.from, -1, state.loopFocus)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusFirst': {\n const to = firstEnabled(state.items, state.disabledItems)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'focusLast': {\n const to = lastEnabled(state.items, state.disabledItems)\n if (to === null) return [state, []]\n const next: TabsState = { ...state, focused: to }\n if (state.activation === 'automatic') next.value = to\n return [next, []]\n }\n case 'activateFocused': {\n if (state.focused === null) return [state, []]\n return [{ ...state, value: state.focused }, []]\n }\n }\n}\n\nexport interface TabsItemParts {\n trigger: {\n type: 'button'\n role: 'tab'\n 'aria-selected': Signal<boolean>\n 'aria-controls': string\n 'aria-disabled': Signal<'true' | undefined>\n id: string\n 'data-state': Signal<'active' | 'inactive'>\n 'data-disabled': Signal<'' | undefined>\n 'data-scope': 'tabs'\n 'data-part': 'trigger'\n 'data-value': string\n tabIndex: Signal<number>\n onClick: (e: MouseEvent) => void\n onKeyDown: (e: KeyboardEvent) => void\n onFocus: (e: FocusEvent) => void\n }\n panel: {\n role: 'tabpanel'\n id: string\n 'aria-labelledby': string\n tabIndex: 0\n hidden: Signal<boolean>\n 'data-state': Signal<'active' | 'inactive'>\n 'data-scope': 'tabs'\n 'data-part': 'panel'\n 'data-value': string\n }\n}\n\nexport interface TabsParts {\n root: {\n 'data-scope': 'tabs'\n 'data-part': 'root'\n 'data-orientation': Signal<Orientation>\n }\n /**\n * A movable underline/highlight element. Position tracks the active\n * trigger via CSS custom properties written by `watchTabIndicator()`:\n * `--indicator-left`, `--indicator-top`, `--indicator-width`,\n * `--indicator-height` — all in pixels.\n * The consumer styles the indicator using these properties (e.g.\n * `transform: translateX(var(--indicator-left))`).\n */\n indicator: {\n 'data-scope': 'tabs'\n 'data-part': 'indicator'\n 'data-orientation': Signal<Orientation>\n }\n list: {\n role: 'tablist'\n 'aria-orientation': Signal<Orientation>\n 'data-scope': 'tabs'\n 'data-part': 'list'\n }\n item: (value: string) => TabsItemParts\n}\n\nexport interface ConnectOptions {\n id: string\n /**\n * Called whenever a tab is clicked/activated. Useful for anchor-style\n * navigation where the tab's value is a URL path and you want to push\n * to the history or router.\n */\n onNavigate?: (value: string) => void\n}\n\nexport function connect(\n state: Signal<TabsState>,\n send: Send<TabsMsg>,\n opts: ConnectOptions,\n): TabsParts {\n const base = opts.id\n const triggerId = (v: string): string => `${base}:trigger:${v}`\n const panelId = (v: string): string => `${base}:panel:${v}`\n\n return {\n root: {\n 'data-scope': 'tabs',\n 'data-part': 'root',\n 'data-orientation': state.map((s) => s.orientation),\n },\n list: {\n role: 'tablist',\n 'aria-orientation': state.map((s) => s.orientation),\n 'data-scope': 'tabs',\n 'data-part': 'list',\n },\n indicator: {\n 'data-scope': 'tabs',\n 'data-part': 'indicator',\n 'data-orientation': state.map((s) => s.orientation),\n },\n item: (value: string): TabsItemParts => ({\n trigger: {\n type: 'button',\n role: 'tab',\n 'aria-selected': state.map((s) => s.value === value),\n 'aria-controls': panelId(value),\n 'aria-disabled': state.map((s) => (s.disabledItems.includes(value) ? 'true' : undefined)),\n id: triggerId(value),\n 'data-state': state.map((s) => (s.value === value ? 'active' : 'inactive')),\n 'data-disabled': state.map((s) => (s.disabledItems.includes(value) ? '' : undefined)),\n 'data-scope': 'tabs',\n 'data-part': 'trigger',\n 'data-value': value,\n tabIndex: state.map((s) => (s.value === value ? 0 : -1)),\n onClick: tagSend(send, ['focusTab'], () => {\n send({ type: 'focusTab', value })\n opts.onNavigate?.(value)\n }),\n onFocus: tagSend(send, ['focusTab'], () => {\n // `focusTab` handles automatic activation\n send({ type: 'focusTab', value })\n }),\n onKeyDown: tagSend(\n send,\n ['focusNext', 'focusPrev', 'focusFirst', 'focusLast', 'activateFocused'],\n (e: KeyboardEvent) => {\n // Read orientation from the ancestor [data-part=\"list\"] so the\n // handler can dispatch the correct arrow keys per WAI-ARIA.\n // Horizontal tabs: ArrowLeft/Right navigate; vertical: Up/Down.\n const target = e.currentTarget as HTMLElement | null\n const list = target?.closest(\n '[data-scope=\"tabs\"][data-part=\"list\"]',\n ) as HTMLElement | null\n const orientation =\n (list?.getAttribute('aria-orientation') as Orientation | null) ?? 'horizontal'\n const key = flipArrow(e.key, e.currentTarget as Element)\n const nextKey = orientation === 'vertical' ? 'ArrowDown' : 'ArrowRight'\n const prevKey = orientation === 'vertical' ? 'ArrowUp' : 'ArrowLeft'\n switch (key) {\n case nextKey:\n e.preventDefault()\n send({ type: 'focusNext', from: value })\n return\n case prevKey:\n e.preventDefault()\n send({ type: 'focusPrev', from: value })\n return\n case 'Home':\n e.preventDefault()\n send({ type: 'focusFirst' })\n return\n case 'End':\n e.preventDefault()\n send({ type: 'focusLast' })\n return\n case 'Enter':\n case ' ':\n e.preventDefault()\n send({ type: 'activateFocused' })\n return\n }\n },\n ),\n },\n panel: {\n role: 'tabpanel',\n id: panelId(value),\n 'aria-labelledby': triggerId(value),\n tabIndex: 0,\n hidden: state.map((s) => s.value !== value),\n 'data-state': state.map((s) => (s.value === value ? 'active' : 'inactive')),\n 'data-scope': 'tabs',\n 'data-part': 'panel',\n 'data-value': value,\n },\n }),\n }\n}\n\n/**\n * Track the active tab trigger and update CSS custom properties on the\n * indicator element so it can be animated into position. Call from\n * `onMount` with the tabs root element; the returned function removes\n * the observers.\n *\n * Sets `--indicator-left`, `--indicator-top`, `--indicator-width`,\n * `--indicator-height` on the indicator element every time the active\n * trigger changes or the list resizes. Style the indicator with:\n * transform: translate(var(--indicator-left), var(--indicator-top));\n * width: var(--indicator-width);\n * height: var(--indicator-height);\n */\nexport function watchTabIndicator(root: HTMLElement): () => void {\n const indicator = root.querySelector<HTMLElement>('[data-scope=\"tabs\"][data-part=\"indicator\"]')\n const list = root.querySelector<HTMLElement>('[data-scope=\"tabs\"][data-part=\"list\"]')\n if (!indicator || !list) return () => {}\n\n const sync = (): void => {\n const active = list.querySelector<HTMLElement>(\n '[data-scope=\"tabs\"][data-part=\"trigger\"][data-state=\"active\"]',\n )\n if (!active) return\n indicator.style.setProperty('--indicator-left', `${active.offsetLeft}px`)\n indicator.style.setProperty('--indicator-top', `${active.offsetTop}px`)\n indicator.style.setProperty('--indicator-width', `${active.offsetWidth}px`)\n indicator.style.setProperty('--indicator-height', `${active.offsetHeight}px`)\n }\n\n sync()\n\n const mo = new MutationObserver(sync)\n mo.observe(list, { attributes: true, attributeFilter: ['data-state'], subtree: true })\n\n // ResizeObserver may be absent in older environments or jsdom — skip\n // gracefully; layout changes that don't involve a data-state flip just\n // won't reposition the indicator until the next attribute change.\n const ro = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(sync) : null\n ro?.observe(list)\n\n return () => {\n mo.disconnect()\n ro?.disconnect()\n }\n}\n\nexport const tabs = { init, update, connect, watchTabIndicator }\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Send } from '@llui/dom';
|
|
1
|
+
import type { Send, Signal } from '@llui/dom';
|
|
2
2
|
/**
|
|
3
3
|
* Tags input — text input that creates chips (tags) on commit keys
|
|
4
4
|
* (Enter, comma, blur). Backspace on empty input removes the last tag.
|
|
@@ -66,50 +66,50 @@ export interface TagsInputInit {
|
|
|
66
66
|
}
|
|
67
67
|
export declare function init(opts?: TagsInputInit): TagsInputState;
|
|
68
68
|
export declare function update(state: TagsInputState, msg: TagsInputMsg): [TagsInputState, never[]];
|
|
69
|
-
export interface TagItemParts
|
|
69
|
+
export interface TagItemParts {
|
|
70
70
|
root: {
|
|
71
|
-
tabIndex:
|
|
71
|
+
tabIndex: Signal<number>;
|
|
72
72
|
'data-scope': 'tags-input';
|
|
73
73
|
'data-part': 'tag';
|
|
74
74
|
'data-value': string;
|
|
75
75
|
'data-index': string;
|
|
76
|
-
'data-focused':
|
|
76
|
+
'data-focused': Signal<'' | undefined>;
|
|
77
77
|
onKeyDown: (e: KeyboardEvent) => void;
|
|
78
78
|
onFocus: (e: FocusEvent) => void;
|
|
79
79
|
};
|
|
80
80
|
remove: {
|
|
81
81
|
type: 'button';
|
|
82
|
-
'aria-label': string
|
|
82
|
+
'aria-label': string;
|
|
83
83
|
tabIndex: -1;
|
|
84
84
|
'data-scope': 'tags-input';
|
|
85
85
|
'data-part': 'tag-remove';
|
|
86
86
|
onClick: (e: MouseEvent) => void;
|
|
87
87
|
};
|
|
88
88
|
}
|
|
89
|
-
export interface TagsInputParts
|
|
89
|
+
export interface TagsInputParts {
|
|
90
90
|
root: {
|
|
91
91
|
role: 'group';
|
|
92
|
-
'aria-disabled':
|
|
92
|
+
'aria-disabled': Signal<'true' | undefined>;
|
|
93
93
|
'data-scope': 'tags-input';
|
|
94
94
|
'data-part': 'root';
|
|
95
|
-
'data-disabled':
|
|
95
|
+
'data-disabled': Signal<'' | undefined>;
|
|
96
96
|
};
|
|
97
97
|
input: {
|
|
98
98
|
type: 'text';
|
|
99
99
|
autoComplete: 'off';
|
|
100
|
-
'aria-label': string
|
|
101
|
-
disabled:
|
|
102
|
-
value:
|
|
100
|
+
'aria-label': string;
|
|
101
|
+
disabled: Signal<boolean>;
|
|
102
|
+
value: Signal<string>;
|
|
103
103
|
'data-scope': 'tags-input';
|
|
104
104
|
'data-part': 'input';
|
|
105
105
|
onInput: (e: Event) => void;
|
|
106
106
|
onKeyDown: (e: KeyboardEvent) => void;
|
|
107
107
|
onBlur: (e: FocusEvent) => void;
|
|
108
108
|
};
|
|
109
|
-
tag: (value: string, index: number) => TagItemParts
|
|
109
|
+
tag: (value: string, index: number) => TagItemParts;
|
|
110
110
|
clearTrigger: {
|
|
111
111
|
type: 'button';
|
|
112
|
-
'aria-label': string
|
|
112
|
+
'aria-label': string;
|
|
113
113
|
'data-scope': 'tags-input';
|
|
114
114
|
'data-part': 'clear-trigger';
|
|
115
115
|
onClick: (e: MouseEvent) => void;
|
|
@@ -126,7 +126,7 @@ export interface ConnectOptions {
|
|
|
126
126
|
/** Validate a tag value before adding. Non-empty array blocks addTag. */
|
|
127
127
|
validate?: (value: string) => string[] | null;
|
|
128
128
|
}
|
|
129
|
-
export declare function connect
|
|
129
|
+
export declare function connect(state: Signal<TagsInputState>, send: Send<TagsInputMsg>, opts?: ConnectOptions): TagsInputParts;
|
|
130
130
|
export declare const tagsInput: {
|
|
131
131
|
init: typeof init;
|
|
132
132
|
update: typeof update;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tags-input.d.ts","sourceRoot":"","sources":["../../src/components/tags-input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"tags-input.d.ts","sourceRoot":"","sources":["../../src/components/tags-input.ts"],"names":[],"mappings":"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"}
|
|
@@ -60,11 +60,11 @@ export function update(state, msg) {
|
|
|
60
60
|
return [{ ...state, value: [], focusedIndex: null }, []];
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
|
-
export function connect(
|
|
63
|
+
export function connect(state, send, opts = {}) {
|
|
64
64
|
const locale = useContext(LocaleContext);
|
|
65
|
-
const inputLabel = opts.inputLabel ??
|
|
66
|
-
const removeLabel = opts.removeLabel ??
|
|
67
|
-
const clearLabel = opts.clearLabel ??
|
|
65
|
+
const inputLabel = opts.inputLabel ?? locale.tagsInput.input;
|
|
66
|
+
const removeLabel = opts.removeLabel ?? locale.tagsInput.remove;
|
|
67
|
+
const clearLabel = opts.clearLabel ?? locale.tagsInput.clear;
|
|
68
68
|
const delimiters = opts.delimiters ?? [','];
|
|
69
69
|
const commitOnBlur = opts.commitOnBlur !== false;
|
|
70
70
|
const validate = opts.validate;
|
|
@@ -81,17 +81,17 @@ export function connect(get, send, opts = {}) {
|
|
|
81
81
|
return {
|
|
82
82
|
root: {
|
|
83
83
|
role: 'group',
|
|
84
|
-
'aria-disabled': (s) => (
|
|
84
|
+
'aria-disabled': state.map((s) => (s.disabled ? 'true' : undefined)),
|
|
85
85
|
'data-scope': 'tags-input',
|
|
86
86
|
'data-part': 'root',
|
|
87
|
-
'data-disabled': (s) => (
|
|
87
|
+
'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),
|
|
88
88
|
},
|
|
89
89
|
input: {
|
|
90
90
|
type: 'text',
|
|
91
91
|
autoComplete: 'off',
|
|
92
92
|
'aria-label': inputLabel,
|
|
93
|
-
disabled: (s) =>
|
|
94
|
-
value: (s) =>
|
|
93
|
+
disabled: state.map((s) => s.disabled),
|
|
94
|
+
value: state.map((s) => s.inputValue),
|
|
95
95
|
'data-scope': 'tags-input',
|
|
96
96
|
'data-part': 'input',
|
|
97
97
|
onInput: tagSend(send, ['setInput'], (e) => {
|
|
@@ -129,12 +129,12 @@ export function connect(get, send, opts = {}) {
|
|
|
129
129
|
},
|
|
130
130
|
tag: (value, index) => ({
|
|
131
131
|
root: {
|
|
132
|
-
tabIndex: (s) => (
|
|
132
|
+
tabIndex: state.map((s) => (s.focusedIndex === index ? 0 : -1)),
|
|
133
133
|
'data-scope': 'tags-input',
|
|
134
134
|
'data-part': 'tag',
|
|
135
135
|
'data-value': value,
|
|
136
136
|
'data-index': String(index),
|
|
137
|
-
'data-focused': (s) => (
|
|
137
|
+
'data-focused': state.map((s) => (s.focusedIndex === index ? '' : undefined)),
|
|
138
138
|
onFocus: tagSend(send, ['focusTag'], () => send({ type: 'focusTag', index })),
|
|
139
139
|
onKeyDown: tagSend(send, ['focusTagPrev', 'focusTagNext', 'removeTag'], (e) => {
|
|
140
140
|
const key = flipArrow(e.key, e.currentTarget);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tags-input.js","sourceRoot":"","sources":["../../src/components/tags-input.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAiD5C,MAAM,UAAU,IAAI,CAAC,OAAsB,EAAE;IAC3C,OAAO;QACL,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,EAAE;QACvB,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,EAAE;QACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,KAAK;QAChC,GAAG,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC;QAClB,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,IAAI;QAC3B,YAAY,EAAE,IAAI;KACnB,CAAA;AACH,CAAC;AAED,MAAM,UAAU,MAAM,CAAC,KAAqB,EAAE,GAAiB;IAC7D,IAAI,KAAK,CAAC,QAAQ,IAAI,GAAG,CAAC,IAAI,KAAK,UAAU;QAAE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;IACjE,QAAQ,GAAG,CAAC,IAAI,EAAE,CAAC;QACjB,KAAK,UAAU;YACb,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,GAAG,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAA;QAClD,KAAK,QAAQ,CAAC,CAAC,CAAC;YACd,MAAM,SAAS,GAAG,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,UAAU,CAAC,CAAC,IAAI,EAAE,CAAA;YACxD,IAAI,SAAS,KAAK,EAAE;gBAAE,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;YAC/D,IAAI,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC;gBAAE,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;YAC9F,IAAI,KAAK,CAAC,GAAG,GAAG,CAAC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,GAAG;gBAClD,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;YAC3C,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;QAC/E,CAAC;QACD,KAAK,WAAW,CAAC,CAAC,CAAC;YACjB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAA;YAC3D,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAA;QACtD,CAAC;QACD,KAAK,YAAY;YACf,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;gBAAE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;YAChD,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;QAC5D,KAAK,UAAU;YACb,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAA;QAC7C,KAAK,UAAU;YACb,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAA;QACpD,KAAK,cAAc,CAAC,CAAC,CAAC;YACpB,MAAM,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAA;YAC9B,IAAI,GAAG,KAAK,CAAC;gBAAE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;YACjC,IAAI,KAAK,CAAC,YAAY,KAAK,IAAI;gBAAE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;YACnD,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,GAAG,CAAC,CAAA;YACnC,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,CAAC,CAAA;QACpE,CAAC;QACD,KAAK,cAAc,CAAC,CAAC,CAAC;YACpB,MAAM,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAA;YAC9B,IAAI,GAAG,KAAK,CAAC;gBAAE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;YACjC,IAAI,KAAK,CAAC,YAAY,KAAK,IAAI;gBAAE,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,GAAG,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;YACjF,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;QAC9E,CAAC;QACD,KAAK,UAAU;YACb,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAA;IAC5D,CAAC;AACH,CAAC;AAiED,MAAM,UAAU,OAAO,CACrB,GAA6B,EAC7B,IAAwB,EACxB,OAAuB,EAAE;IAEzB,MAAM,MAAM,GAAG,UAAU,CAAY,aAAa,CAAC,CAAA;IACnD,MAAM,UAAU,GACd,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,CAAI,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAA;IAC1D,MAAM,WAAW,GACf,IAAI,CAAC,WAAW,IAAI,CAAC,CAAC,CAAI,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IAC5D,MAAM,UAAU,GACd,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,CAAI,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAA;IAC1D,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,CAAC,GAAG,CAAC,CAAA;IAC3C,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,KAAK,KAAK,CAAA;IAChD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;IAC9B,IAAI,YAAY,GAAG,EAAE,CAAA;IAErB,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,EAAE,CAAA;QACrC,IAAI,QAAQ,IAAI,SAAS,KAAK,EAAE,EAAE,CAAC;YACjC,MAAM,MAAM,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAA;YAClC,IAAI,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC;gBAAE,OAAM;QACzC,CAAC;QACD,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAA;IAC1B,CAAC,CAAA;IAED,OAAO;QACL,IAAI,EAAE;YACJ,IAAI,EAAE,OAAO;YACb,eAAe,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;YAC9D,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,MAAM;YACnB,eAAe,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;SAC3D;QACD,KAAK,EAAE;YACL,IAAI,EAAE,MAAM;YACZ,YAAY,EAAE,KAAK;YACnB,YAAY,EAAE,UAAU;YACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ;YAChC,KAAK,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,UAAU;YAC/B,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,OAAO;YACpB,OAAO,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE;gBACzC,YAAY,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAA;gBACnD,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,CAAA;YACjD,CAAC,CAAC;YACF,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,YAAY,EAAE,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE;gBAC7D,MAAM,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,aAAwB,CAAC,CAAA;gBACxD,IAAI,GAAG,KAAK,OAAO,EAAE,CAAC;oBACpB,CAAC,CAAC,cAAc,EAAE,CAAA;oBAClB,SAAS,EAAE,CAAA;gBACb,CAAC;qBAAM,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;oBACpC,CAAC,CAAC,cAAc,EAAE,CAAA;oBAClB,SAAS,EAAE,CAAA;gBACb,CAAC;qBAAM,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;oBAC/B,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B,CAAA;oBAC3C,IAAI,MAAM,CAAC,KAAK,KAAK,EAAE,EAAE,CAAC;wBACxB,IAAI,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,CAAA;oBAC9B,CAAC;gBACH,CAAC;qBAAM,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;oBAC/B,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B,CAAA;oBAC3C,IAAI,MAAM,CAAC,KAAK,KAAK,EAAE,EAAE,CAAC;wBACxB,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAA;oBAChC,CAAC;gBACH,CAAC;YACH,CAAC,CAAC;YACF,MAAM,EAAE,GAAG,EAAE;gBACX,IAAI,YAAY;oBAAE,SAAS,EAAE,CAAA;YAC/B,CAAC;SACF;QACD,GAAG,EAAE,CAAC,KAAa,EAAE,KAAa,EAAmB,EAAE,CAAC,CAAC;YACvD,IAAI,EAAE;gBACJ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBACzD,YAAY,EAAE,YAAY;gBAC1B,WAAW,EAAE,KAAK;gBAClB,YAAY,EAAE,KAAK;gBACnB,YAAY,EAAE,MAAM,CAAC,KAAK,CAAC;gBAC3B,cAAc,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;gBACvE,OAAO,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,CAAC;gBAC7E,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,cAAc,EAAE,cAAc,EAAE,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE;oBAC5E,MAAM,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,aAAwB,CAAC,CAAA;oBACxD,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;wBACxB,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAA;oBAChC,CAAC;yBAAM,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;wBAChC,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAA;oBAChC,CAAC;yBAAM,IAAI,GAAG,KAAK,WAAW,IAAI,GAAG,KAAK,QAAQ,EAAE,CAAC;wBACnD,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAA;oBACpC,CAAC;gBACH,CAAC,CAAC;aACH;YACD,MAAM,EAAE;gBACN,IAAI,EAAE,QAAQ;gBACd,YAAY,EAAE,WAAW;gBACzB,QAAQ,EAAE,CAAC,CAAC;gBACZ,YAAY,EAAE,YAAY;gBAC1B,WAAW,EAAE,YAAY;gBACzB,OAAO,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAC;aAChF;SACF,CAAC;QACF,YAAY,EAAE;YACZ,IAAI,EAAE,QAAQ;YACd,YAAY,EAAE,UAAU;YACxB,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,eAAe;YAC5B,OAAO,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;SACvE;KACF,CAAA;AACH,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,CAAA","sourcesContent":["import type { Send } from '@llui/dom'\nimport { useContext, tagSend } from '@llui/dom'\nimport { flipArrow } from '../utils/direction.js'\nimport { LocaleContext } from '../locale.js'\nimport type { Locale } from '../locale.js'\n\n/**\n * Tags input — text input that creates chips (tags) on commit keys\n * (Enter, comma, blur). Backspace on empty input removes the last tag.\n * Each tag is focusable via arrow keys.\n */\n\nexport interface TagsInputState {\n value: string[]\n inputValue: string\n disabled: boolean\n /** Maximum tag count. 0 = unlimited. */\n max: number\n /** Only allow unique values. */\n unique: boolean\n /** Currently-focused tag index, or null. */\n focusedIndex: number | null\n}\n\nexport type TagsInputMsg =\n /** @intent(\"Update the in-progress text in the input field\") */\n | { type: 'setInput'; value: string }\n /** @intent(\"Commit a new tag (defaults to the current input value)\") */\n | { type: 'addTag'; value?: string }\n /** @intent(\"Remove the tag at the given index\") */\n | { type: 'removeTag'; index: number }\n /** @intent(\"Remove the last tag (typically backspace on empty input)\") */\n | { type: 'removeLast' }\n /** @intent(\"Replace the full tag list with the provided values\") */\n | { type: 'setValue'; value: string[] }\n /** @humanOnly */\n | { type: 'focusTag'; index: number | null }\n /** @humanOnly */\n | { type: 'focusTagNext' }\n /** @humanOnly */\n | { type: 'focusTagPrev' }\n /** @intent(\"Remove every tag and reset the input\") */\n | { type: 'clearAll' }\n\nexport interface TagsInputInit {\n value?: string[]\n inputValue?: string\n disabled?: boolean\n max?: number\n unique?: boolean\n}\n\nexport function init(opts: TagsInputInit = {}): TagsInputState {\n return {\n value: opts.value ?? [],\n inputValue: opts.inputValue ?? '',\n disabled: opts.disabled ?? false,\n max: opts.max ?? 0,\n unique: opts.unique ?? true,\n focusedIndex: null,\n }\n}\n\nexport function update(state: TagsInputState, msg: TagsInputMsg): [TagsInputState, never[]] {\n if (state.disabled && msg.type !== 'setValue') return [state, []]\n switch (msg.type) {\n case 'setInput':\n return [{ ...state, inputValue: msg.value }, []]\n case 'addTag': {\n const candidate = (msg.value ?? state.inputValue).trim()\n if (candidate === '') return [{ ...state, inputValue: '' }, []]\n if (state.unique && state.value.includes(candidate)) return [{ ...state, inputValue: '' }, []]\n if (state.max > 0 && state.value.length >= state.max)\n return [{ ...state, inputValue: '' }, []]\n return [{ ...state, value: [...state.value, candidate], inputValue: '' }, []]\n }\n case 'removeTag': {\n const value = state.value.filter((_, i) => i !== msg.index)\n return [{ ...state, value, focusedIndex: null }, []]\n }\n case 'removeLast':\n if (state.value.length === 0) return [state, []]\n return [{ ...state, value: state.value.slice(0, -1) }, []]\n case 'setValue':\n return [{ ...state, value: msg.value }, []]\n case 'focusTag':\n return [{ ...state, focusedIndex: msg.index }, []]\n case 'focusTagNext': {\n const len = state.value.length\n if (len === 0) return [state, []]\n if (state.focusedIndex === null) return [state, []]\n const next = state.focusedIndex + 1\n return [{ ...state, focusedIndex: next >= len ? null : next }, []]\n }\n case 'focusTagPrev': {\n const len = state.value.length\n if (len === 0) return [state, []]\n if (state.focusedIndex === null) return [{ ...state, focusedIndex: len - 1 }, []]\n return [{ ...state, focusedIndex: Math.max(0, state.focusedIndex - 1) }, []]\n }\n case 'clearAll':\n return [{ ...state, value: [], focusedIndex: null }, []]\n }\n}\n\nexport interface TagItemParts<S> {\n root: {\n tabIndex: (s: S) => number\n 'data-scope': 'tags-input'\n 'data-part': 'tag'\n 'data-value': string\n 'data-index': string\n 'data-focused': (s: S) => '' | undefined\n onKeyDown: (e: KeyboardEvent) => void\n onFocus: (e: FocusEvent) => void\n }\n remove: {\n type: 'button'\n 'aria-label': string | ((s: S) => string)\n tabIndex: -1\n 'data-scope': 'tags-input'\n 'data-part': 'tag-remove'\n onClick: (e: MouseEvent) => void\n }\n}\n\nexport interface TagsInputParts<S> {\n root: {\n role: 'group'\n 'aria-disabled': (s: S) => 'true' | undefined\n 'data-scope': 'tags-input'\n 'data-part': 'root'\n 'data-disabled': (s: S) => '' | undefined\n }\n input: {\n type: 'text'\n autoComplete: 'off'\n 'aria-label': string | ((s: S) => string)\n disabled: (s: S) => boolean\n value: (s: S) => string\n 'data-scope': 'tags-input'\n 'data-part': 'input'\n onInput: (e: Event) => void\n onKeyDown: (e: KeyboardEvent) => void\n onBlur: (e: FocusEvent) => void\n }\n tag: (value: string, index: number) => TagItemParts<S>\n clearTrigger: {\n type: 'button'\n 'aria-label': string | ((s: S) => string)\n 'data-scope': 'tags-input'\n 'data-part': 'clear-trigger'\n onClick: (e: MouseEvent) => void\n }\n}\n\nexport interface ConnectOptions {\n inputLabel?: string\n removeLabel?: string\n clearLabel?: string\n /** Characters that commit the current input as a tag (default: [',']). */\n delimiters?: string[]\n /** Commit on blur (default: true). */\n commitOnBlur?: boolean\n /** Validate a tag value before adding. Non-empty array blocks addTag. */\n validate?: (value: string) => string[] | null\n}\n\nexport function connect<S>(\n get: (s: S) => TagsInputState,\n send: Send<TagsInputMsg>,\n opts: ConnectOptions = {},\n): TagsInputParts<S> {\n const locale = useContext<S, Locale>(LocaleContext)\n const inputLabel: string | ((s: S) => string) =\n opts.inputLabel ?? ((s: S) => locale(s).tagsInput.input)\n const removeLabel: string | ((s: S) => string) =\n opts.removeLabel ?? ((s: S) => locale(s).tagsInput.remove)\n const clearLabel: string | ((s: S) => string) =\n opts.clearLabel ?? ((s: S) => locale(s).tagsInput.clear)\n const delimiters = opts.delimiters ?? [',']\n const commitOnBlur = opts.commitOnBlur !== false\n const validate = opts.validate\n let currentInput = ''\n\n const tryAddTag = () => {\n const candidate = currentInput.trim()\n if (validate && candidate !== '') {\n const errors = validate(candidate)\n if (errors && errors.length > 0) return\n }\n send({ type: 'addTag' })\n }\n\n return {\n root: {\n role: 'group',\n 'aria-disabled': (s) => (get(s).disabled ? 'true' : undefined),\n 'data-scope': 'tags-input',\n 'data-part': 'root',\n 'data-disabled': (s) => (get(s).disabled ? '' : undefined),\n },\n input: {\n type: 'text',\n autoComplete: 'off',\n 'aria-label': inputLabel,\n disabled: (s) => get(s).disabled,\n value: (s) => get(s).inputValue,\n 'data-scope': 'tags-input',\n 'data-part': 'input',\n onInput: tagSend(send, ['setInput'], (e) => {\n currentInput = (e.target as HTMLInputElement).value\n send({ type: 'setInput', value: currentInput })\n }),\n onKeyDown: tagSend(send, ['removeLast', 'focusTagPrev'], (e) => {\n const key = flipArrow(e.key, e.currentTarget as Element)\n if (key === 'Enter') {\n e.preventDefault()\n tryAddTag()\n } else if (delimiters.includes(key)) {\n e.preventDefault()\n tryAddTag()\n } else if (key === 'Backspace') {\n const target = e.target as HTMLInputElement\n if (target.value === '') {\n send({ type: 'removeLast' })\n }\n } else if (key === 'ArrowLeft') {\n const target = e.target as HTMLInputElement\n if (target.value === '') {\n e.preventDefault()\n send({ type: 'focusTagPrev' })\n }\n }\n }),\n onBlur: () => {\n if (commitOnBlur) tryAddTag()\n },\n },\n tag: (value: string, index: number): TagItemParts<S> => ({\n root: {\n tabIndex: (s) => (get(s).focusedIndex === index ? 0 : -1),\n 'data-scope': 'tags-input',\n 'data-part': 'tag',\n 'data-value': value,\n 'data-index': String(index),\n 'data-focused': (s) => (get(s).focusedIndex === index ? '' : undefined),\n onFocus: tagSend(send, ['focusTag'], () => send({ type: 'focusTag', index })),\n onKeyDown: tagSend(send, ['focusTagPrev', 'focusTagNext', 'removeTag'], (e) => {\n const key = flipArrow(e.key, e.currentTarget as Element)\n if (key === 'ArrowLeft') {\n e.preventDefault()\n send({ type: 'focusTagPrev' })\n } else if (key === 'ArrowRight') {\n e.preventDefault()\n send({ type: 'focusTagNext' })\n } else if (key === 'Backspace' || key === 'Delete') {\n e.preventDefault()\n send({ type: 'removeTag', index })\n }\n }),\n },\n remove: {\n type: 'button',\n 'aria-label': removeLabel,\n tabIndex: -1,\n 'data-scope': 'tags-input',\n 'data-part': 'tag-remove',\n onClick: tagSend(send, ['removeTag'], () => send({ type: 'removeTag', index })),\n },\n }),\n clearTrigger: {\n type: 'button',\n 'aria-label': clearLabel,\n 'data-scope': 'tags-input',\n 'data-part': 'clear-trigger',\n onClick: tagSend(send, ['clearAll'], () => send({ type: 'clearAll' })),\n },\n }\n}\n\nexport const tagsInput = { init, update, connect }\n"]}
|
|
1
|
+
{"version":3,"file":"tags-input.js","sourceRoot":"","sources":["../../src/components/tags-input.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Send, Signal } from '@llui/dom'\nimport { useContext, tagSend } from '@llui/dom'\nimport { flipArrow } from '../utils/direction.js'\nimport { LocaleContext } from '../locale.js'\n\n/**\n * Tags input — text input that creates chips (tags) on commit keys\n * (Enter, comma, blur). Backspace on empty input removes the last tag.\n * Each tag is focusable via arrow keys.\n */\n\nexport interface TagsInputState {\n value: string[]\n inputValue: string\n disabled: boolean\n /** Maximum tag count. 0 = unlimited. */\n max: number\n /** Only allow unique values. */\n unique: boolean\n /** Currently-focused tag index, or null. */\n focusedIndex: number | null\n}\n\nexport type TagsInputMsg =\n /** @intent(\"Update the in-progress text in the input field\") */\n | { type: 'setInput'; value: string }\n /** @intent(\"Commit a new tag (defaults to the current input value)\") */\n | { type: 'addTag'; value?: string }\n /** @intent(\"Remove the tag at the given index\") */\n | { type: 'removeTag'; index: number }\n /** @intent(\"Remove the last tag (typically backspace on empty input)\") */\n | { type: 'removeLast' }\n /** @intent(\"Replace the full tag list with the provided values\") */\n | { type: 'setValue'; value: string[] }\n /** @humanOnly */\n | { type: 'focusTag'; index: number | null }\n /** @humanOnly */\n | { type: 'focusTagNext' }\n /** @humanOnly */\n | { type: 'focusTagPrev' }\n /** @intent(\"Remove every tag and reset the input\") */\n | { type: 'clearAll' }\n\nexport interface TagsInputInit {\n value?: string[]\n inputValue?: string\n disabled?: boolean\n max?: number\n unique?: boolean\n}\n\nexport function init(opts: TagsInputInit = {}): TagsInputState {\n return {\n value: opts.value ?? [],\n inputValue: opts.inputValue ?? '',\n disabled: opts.disabled ?? false,\n max: opts.max ?? 0,\n unique: opts.unique ?? true,\n focusedIndex: null,\n }\n}\n\nexport function update(state: TagsInputState, msg: TagsInputMsg): [TagsInputState, never[]] {\n if (state.disabled && msg.type !== 'setValue') return [state, []]\n switch (msg.type) {\n case 'setInput':\n return [{ ...state, inputValue: msg.value }, []]\n case 'addTag': {\n const candidate = (msg.value ?? state.inputValue).trim()\n if (candidate === '') return [{ ...state, inputValue: '' }, []]\n if (state.unique && state.value.includes(candidate)) return [{ ...state, inputValue: '' }, []]\n if (state.max > 0 && state.value.length >= state.max)\n return [{ ...state, inputValue: '' }, []]\n return [{ ...state, value: [...state.value, candidate], inputValue: '' }, []]\n }\n case 'removeTag': {\n const value = state.value.filter((_, i) => i !== msg.index)\n return [{ ...state, value, focusedIndex: null }, []]\n }\n case 'removeLast':\n if (state.value.length === 0) return [state, []]\n return [{ ...state, value: state.value.slice(0, -1) }, []]\n case 'setValue':\n return [{ ...state, value: msg.value }, []]\n case 'focusTag':\n return [{ ...state, focusedIndex: msg.index }, []]\n case 'focusTagNext': {\n const len = state.value.length\n if (len === 0) return [state, []]\n if (state.focusedIndex === null) return [state, []]\n const next = state.focusedIndex + 1\n return [{ ...state, focusedIndex: next >= len ? null : next }, []]\n }\n case 'focusTagPrev': {\n const len = state.value.length\n if (len === 0) return [state, []]\n if (state.focusedIndex === null) return [{ ...state, focusedIndex: len - 1 }, []]\n return [{ ...state, focusedIndex: Math.max(0, state.focusedIndex - 1) }, []]\n }\n case 'clearAll':\n return [{ ...state, value: [], focusedIndex: null }, []]\n }\n}\n\nexport interface TagItemParts {\n root: {\n tabIndex: Signal<number>\n 'data-scope': 'tags-input'\n 'data-part': 'tag'\n 'data-value': string\n 'data-index': string\n 'data-focused': Signal<'' | undefined>\n onKeyDown: (e: KeyboardEvent) => void\n onFocus: (e: FocusEvent) => void\n }\n remove: {\n type: 'button'\n 'aria-label': string\n tabIndex: -1\n 'data-scope': 'tags-input'\n 'data-part': 'tag-remove'\n onClick: (e: MouseEvent) => void\n }\n}\n\nexport interface TagsInputParts {\n root: {\n role: 'group'\n 'aria-disabled': Signal<'true' | undefined>\n 'data-scope': 'tags-input'\n 'data-part': 'root'\n 'data-disabled': Signal<'' | undefined>\n }\n input: {\n type: 'text'\n autoComplete: 'off'\n 'aria-label': string\n disabled: Signal<boolean>\n value: Signal<string>\n 'data-scope': 'tags-input'\n 'data-part': 'input'\n onInput: (e: Event) => void\n onKeyDown: (e: KeyboardEvent) => void\n onBlur: (e: FocusEvent) => void\n }\n tag: (value: string, index: number) => TagItemParts\n clearTrigger: {\n type: 'button'\n 'aria-label': string\n 'data-scope': 'tags-input'\n 'data-part': 'clear-trigger'\n onClick: (e: MouseEvent) => void\n }\n}\n\nexport interface ConnectOptions {\n inputLabel?: string\n removeLabel?: string\n clearLabel?: string\n /** Characters that commit the current input as a tag (default: [',']). */\n delimiters?: string[]\n /** Commit on blur (default: true). */\n commitOnBlur?: boolean\n /** Validate a tag value before adding. Non-empty array blocks addTag. */\n validate?: (value: string) => string[] | null\n}\n\nexport function connect(\n state: Signal<TagsInputState>,\n send: Send<TagsInputMsg>,\n opts: ConnectOptions = {},\n): TagsInputParts {\n const locale = useContext(LocaleContext)\n const inputLabel = opts.inputLabel ?? locale.tagsInput.input\n const removeLabel = opts.removeLabel ?? locale.tagsInput.remove\n const clearLabel = opts.clearLabel ?? locale.tagsInput.clear\n const delimiters = opts.delimiters ?? [',']\n const commitOnBlur = opts.commitOnBlur !== false\n const validate = opts.validate\n let currentInput = ''\n\n const tryAddTag = () => {\n const candidate = currentInput.trim()\n if (validate && candidate !== '') {\n const errors = validate(candidate)\n if (errors && errors.length > 0) return\n }\n send({ type: 'addTag' })\n }\n\n return {\n root: {\n role: 'group',\n 'aria-disabled': state.map((s) => (s.disabled ? 'true' : undefined)),\n 'data-scope': 'tags-input',\n 'data-part': 'root',\n 'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),\n },\n input: {\n type: 'text',\n autoComplete: 'off',\n 'aria-label': inputLabel,\n disabled: state.map((s) => s.disabled),\n value: state.map((s) => s.inputValue),\n 'data-scope': 'tags-input',\n 'data-part': 'input',\n onInput: tagSend(send, ['setInput'], (e) => {\n currentInput = (e.target as HTMLInputElement).value\n send({ type: 'setInput', value: currentInput })\n }),\n onKeyDown: tagSend(send, ['removeLast', 'focusTagPrev'], (e) => {\n const key = flipArrow(e.key, e.currentTarget as Element)\n if (key === 'Enter') {\n e.preventDefault()\n tryAddTag()\n } else if (delimiters.includes(key)) {\n e.preventDefault()\n tryAddTag()\n } else if (key === 'Backspace') {\n const target = e.target as HTMLInputElement\n if (target.value === '') {\n send({ type: 'removeLast' })\n }\n } else if (key === 'ArrowLeft') {\n const target = e.target as HTMLInputElement\n if (target.value === '') {\n e.preventDefault()\n send({ type: 'focusTagPrev' })\n }\n }\n }),\n onBlur: () => {\n if (commitOnBlur) tryAddTag()\n },\n },\n tag: (value: string, index: number): TagItemParts => ({\n root: {\n tabIndex: state.map((s) => (s.focusedIndex === index ? 0 : -1)),\n 'data-scope': 'tags-input',\n 'data-part': 'tag',\n 'data-value': value,\n 'data-index': String(index),\n 'data-focused': state.map((s) => (s.focusedIndex === index ? '' : undefined)),\n onFocus: tagSend(send, ['focusTag'], () => send({ type: 'focusTag', index })),\n onKeyDown: tagSend(send, ['focusTagPrev', 'focusTagNext', 'removeTag'], (e) => {\n const key = flipArrow(e.key, e.currentTarget as Element)\n if (key === 'ArrowLeft') {\n e.preventDefault()\n send({ type: 'focusTagPrev' })\n } else if (key === 'ArrowRight') {\n e.preventDefault()\n send({ type: 'focusTagNext' })\n } else if (key === 'Backspace' || key === 'Delete') {\n e.preventDefault()\n send({ type: 'removeTag', index })\n }\n }),\n },\n remove: {\n type: 'button',\n 'aria-label': removeLabel,\n tabIndex: -1,\n 'data-scope': 'tags-input',\n 'data-part': 'tag-remove',\n onClick: tagSend(send, ['removeTag'], () => send({ type: 'removeTag', index })),\n },\n }),\n clearTrigger: {\n type: 'button',\n 'aria-label': clearLabel,\n 'data-scope': 'tags-input',\n 'data-part': 'clear-trigger',\n onClick: tagSend(send, ['clearAll'], () => send({ type: 'clearAll' })),\n },\n }\n}\n\nexport const tagsInput = { init, update, connect }\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Send } from '@llui/dom';
|
|
1
|
+
import type { Send, Signal } from '@llui/dom';
|
|
2
2
|
/**
|
|
3
3
|
* Theme Switch — light/dark/system theme toggle.
|
|
4
4
|
*
|
|
@@ -47,7 +47,7 @@ export declare function applyTheme(resolved: ResolvedTheme): void;
|
|
|
47
47
|
* change if you want the UI to auto-follow OS settings.
|
|
48
48
|
*/
|
|
49
49
|
export declare function watchSystemTheme(callback: (theme: ResolvedTheme) => void): () => void;
|
|
50
|
-
export interface ThemeSwitchParts
|
|
50
|
+
export interface ThemeSwitchParts {
|
|
51
51
|
root: {
|
|
52
52
|
'data-scope': 'theme-switch';
|
|
53
53
|
'data-part': 'root';
|
|
@@ -59,7 +59,7 @@ export interface ThemeSwitchParts<S> {
|
|
|
59
59
|
'data-scope': 'theme-switch';
|
|
60
60
|
'data-part': 'option';
|
|
61
61
|
'data-theme': Theme;
|
|
62
|
-
'aria-pressed':
|
|
62
|
+
'aria-pressed': Signal<boolean>;
|
|
63
63
|
'aria-label': string;
|
|
64
64
|
onClick: (e: MouseEvent) => void;
|
|
65
65
|
};
|
|
@@ -67,7 +67,7 @@ export interface ThemeSwitchParts<S> {
|
|
|
67
67
|
type: 'button';
|
|
68
68
|
'data-scope': 'theme-switch';
|
|
69
69
|
'data-part': 'toggle';
|
|
70
|
-
'data-theme':
|
|
70
|
+
'data-theme': Signal<Theme>;
|
|
71
71
|
'aria-label': string;
|
|
72
72
|
onClick: (e: MouseEvent) => void;
|
|
73
73
|
};
|
|
@@ -77,7 +77,7 @@ export interface ConnectOptions {
|
|
|
77
77
|
/** Accessible label for the theme group (default: 'Theme'). */
|
|
78
78
|
label?: string;
|
|
79
79
|
}
|
|
80
|
-
export declare function connect
|
|
80
|
+
export declare function connect(state: Signal<ThemeSwitchState>, send: Send<ThemeSwitchMsg>, opts: ConnectOptions): ThemeSwitchParts;
|
|
81
81
|
export declare const themeSwitch: {
|
|
82
82
|
init: typeof init;
|
|
83
83
|
update: typeof update;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-switch.d.ts","sourceRoot":"","sources":["../../src/components/theme-switch.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"theme-switch.d.ts","sourceRoot":"","sources":["../../src/components/theme-switch.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAE7C;;;;;;;;;;;;;;;;;GAiBG;AAEH,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,CAAA;AAE5C,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,KAAK,CAAA;CACb;AAED,MAAM,MAAM,cAAc,GAAG;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,KAAK,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,CAAA;AAEpF,wBAAgB,IAAI,CAAC,KAAK,GAAE,KAAgB,GAAG,gBAAgB,CAE9D;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,cAAc,GAAG,CAAC,gBAAgB,EAAE,KAAK,EAAE,CAAC,CAYhG;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,aAAa,CAOxD;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,QAAQ,EAAE,aAAa,GAAG,IAAI,CAGxD;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,GAAG,MAAM,IAAI,CAQrF;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE;QACJ,YAAY,EAAE,cAAc,CAAA;QAC5B,WAAW,EAAE,MAAM,CAAA;QACnB,IAAI,EAAE,OAAO,CAAA;QACb,YAAY,EAAE,MAAM,CAAA;KACrB,CAAA;IACD,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK;QACxB,IAAI,EAAE,QAAQ,CAAA;QACd,YAAY,EAAE,cAAc,CAAA;QAC5B,WAAW,EAAE,QAAQ,CAAA;QACrB,YAAY,EAAE,KAAK,CAAA;QACnB,cAAc,EAAE,MAAM,CAAC,OAAO,CAAC,CAAA;QAC/B,YAAY,EAAE,MAAM,CAAA;QACpB,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;KACjC,CAAA;IACD,MAAM,EAAE;QACN,IAAI,EAAE,QAAQ,CAAA;QACd,YAAY,EAAE,cAAc,CAAA;QAC5B,WAAW,EAAE,QAAQ,CAAA;QACrB,YAAY,EAAE,MAAM,CAAC,KAAK,CAAC,CAAA;QAC3B,YAAY,EAAE,MAAM,CAAA;QACpB,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;KACjC,CAAA;CACF;AAED,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAA;IACV,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAQD,wBAAgB,OAAO,CACrB,KAAK,EAAE,MAAM,CAAC,gBAAgB,CAAC,EAC/B,IAAI,EAAE,IAAI,CAAC,cAAc,CAAC,EAC1B,IAAI,EAAE,cAAc,GACnB,gBAAgB,CA2BlB;AAED,eAAO,MAAM,WAAW;;;;;;;CAOvB,CAAA"}
|
|
@@ -59,7 +59,7 @@ const LABELS = {
|
|
|
59
59
|
dark: 'Dark theme',
|
|
60
60
|
system: 'Use system theme',
|
|
61
61
|
};
|
|
62
|
-
export function connect(
|
|
62
|
+
export function connect(state, send, opts) {
|
|
63
63
|
const label = opts.label ?? 'Theme';
|
|
64
64
|
return {
|
|
65
65
|
root: {
|
|
@@ -73,7 +73,7 @@ export function connect(get, send, opts) {
|
|
|
73
73
|
'data-scope': 'theme-switch',
|
|
74
74
|
'data-part': 'option',
|
|
75
75
|
'data-theme': theme,
|
|
76
|
-
'aria-pressed': (s) =>
|
|
76
|
+
'aria-pressed': state.map((s) => s.theme === theme),
|
|
77
77
|
'aria-label': LABELS[theme],
|
|
78
78
|
onClick: tagSend(send, ['setTheme'], () => send({ type: 'setTheme', theme })),
|
|
79
79
|
}),
|
|
@@ -81,7 +81,7 @@ export function connect(get, send, opts) {
|
|
|
81
81
|
type: 'button',
|
|
82
82
|
'data-scope': 'theme-switch',
|
|
83
83
|
'data-part': 'toggle',
|
|
84
|
-
'data-theme': (s) =>
|
|
84
|
+
'data-theme': state.map((s) => s.theme),
|
|
85
85
|
'aria-label': 'Toggle theme',
|
|
86
86
|
onClick: tagSend(send, ['toggle'], () => send({ type: 'toggle' })),
|
|
87
87
|
},
|