@greypan/web-ui 5.0.0 → 6.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.
Files changed (134) hide show
  1. package/README.CN.md +97 -23
  2. package/README.md +112 -21
  3. package/dist/assets/glass.js +1 -1
  4. package/dist/assets/glass.js.map +1 -1
  5. package/dist/assets/menu-portal.js +1 -1
  6. package/dist/assets/menu-portal.js.map +1 -1
  7. package/dist/components/autocomplete/index.d.ts +367 -4
  8. package/dist/components/autocomplete/index.js +83 -77
  9. package/dist/components/autocomplete/index.js.map +1 -1
  10. package/dist/components/autocomplete/style.js +1 -1
  11. package/dist/components/autocomplete/style.js.map +1 -1
  12. package/dist/components/avatar/style.js +1 -1
  13. package/dist/components/avatar/style.js.map +1 -1
  14. package/dist/components/back-top/style.js +1 -1
  15. package/dist/components/back-top/style.js.map +1 -1
  16. package/dist/components/badge/style.js +1 -1
  17. package/dist/components/badge/style.js.map +1 -1
  18. package/dist/components/button/style.js +1 -1
  19. package/dist/components/button/style.js.map +1 -1
  20. package/dist/components/button-group/style.js +1 -1
  21. package/dist/components/button-group/style.js.map +1 -1
  22. package/dist/components/checkbox/index.d.ts +366 -5
  23. package/dist/components/checkbox/index.js +19 -31
  24. package/dist/components/checkbox/index.js.map +1 -1
  25. package/dist/components/checkbox/style.js +1 -1
  26. package/dist/components/checkbox/style.js.map +1 -1
  27. package/dist/components/checkbox-group/index.d.ts +366 -4
  28. package/dist/components/checkbox-group/index.js +16 -25
  29. package/dist/components/checkbox-group/index.js.map +1 -1
  30. package/dist/components/collapse/index.js +24 -27
  31. package/dist/components/collapse/index.js.map +1 -1
  32. package/dist/components/context-menu/index.d.ts +6 -34
  33. package/dist/components/context-menu/index.js +88 -201
  34. package/dist/components/context-menu/index.js.map +1 -1
  35. package/dist/components/dialog/index.js +20 -23
  36. package/dist/components/dialog/index.js.map +1 -1
  37. package/dist/components/dialog/style.js +1 -1
  38. package/dist/components/dialog/style.js.map +1 -1
  39. package/dist/components/drawer/index.js +54 -57
  40. package/dist/components/drawer/index.js.map +1 -1
  41. package/dist/components/drawer/style.js +1 -1
  42. package/dist/components/drawer/style.js.map +1 -1
  43. package/dist/components/dropdown/index.d.ts +11 -14
  44. package/dist/components/dropdown/index.js +128 -155
  45. package/dist/components/dropdown/index.js.map +1 -1
  46. package/dist/components/dropdown-header/style.js +1 -1
  47. package/dist/components/dropdown-header/style.js.map +1 -1
  48. package/dist/components/dropdown-item/style.js +1 -1
  49. package/dist/components/dropdown-item/style.js.map +1 -1
  50. package/dist/components/empty/style.js +1 -1
  51. package/dist/components/empty/style.js.map +1 -1
  52. package/dist/components/input/index.d.ts +366 -5
  53. package/dist/components/input/index.js +35 -47
  54. package/dist/components/input/index.js.map +1 -1
  55. package/dist/components/input/style.js +1 -1
  56. package/dist/components/input/style.js.map +1 -1
  57. package/dist/components/input-number/index.d.ts +366 -5
  58. package/dist/components/input-number/index.js +31 -44
  59. package/dist/components/input-number/index.js.map +1 -1
  60. package/dist/components/input-number/style.js +1 -1
  61. package/dist/components/input-number/style.js.map +1 -1
  62. package/dist/components/layout/style.js +1 -1
  63. package/dist/components/layout/style.js.map +1 -1
  64. package/dist/components/option/style.js +1 -1
  65. package/dist/components/option/style.js.map +1 -1
  66. package/dist/components/popover/index.d.ts +2 -0
  67. package/dist/components/popover/index.js +33 -44
  68. package/dist/components/popover/index.js.map +1 -1
  69. package/dist/components/popover/style.js +1 -1
  70. package/dist/components/popover/style.js.map +1 -1
  71. package/dist/components/radio/index.d.ts +366 -5
  72. package/dist/components/radio/index.js +19 -31
  73. package/dist/components/radio/index.js.map +1 -1
  74. package/dist/components/radio/style.js +1 -1
  75. package/dist/components/radio/style.js.map +1 -1
  76. package/dist/components/radio-group/index.d.ts +366 -4
  77. package/dist/components/radio-group/index.js +16 -25
  78. package/dist/components/radio-group/index.js.map +1 -1
  79. package/dist/components/segmented/index.d.ts +366 -4
  80. package/dist/components/segmented/index.js +26 -35
  81. package/dist/components/segmented/index.js.map +1 -1
  82. package/dist/components/segmented/style.js +1 -1
  83. package/dist/components/segmented/style.js.map +1 -1
  84. package/dist/components/segmented-trigger/style.js +1 -1
  85. package/dist/components/segmented-trigger/style.js.map +1 -1
  86. package/dist/components/select/index.d.ts +368 -5
  87. package/dist/components/select/index.js +65 -67
  88. package/dist/components/select/index.js.map +1 -1
  89. package/dist/components/select/style.js +1 -1
  90. package/dist/components/select/style.js.map +1 -1
  91. package/dist/components/slider/index.d.ts +366 -5
  92. package/dist/components/slider/index.js +38 -50
  93. package/dist/components/slider/index.js.map +1 -1
  94. package/dist/components/slider/style.js +1 -1
  95. package/dist/components/slider/style.js.map +1 -1
  96. package/dist/components/spinner/style.js +1 -1
  97. package/dist/components/spinner/style.js.map +1 -1
  98. package/dist/components/switch/index.d.ts +366 -5
  99. package/dist/components/switch/index.js +26 -38
  100. package/dist/components/switch/index.js.map +1 -1
  101. package/dist/components/switch/style.js +1 -1
  102. package/dist/components/switch/style.js.map +1 -1
  103. package/dist/components/textarea/index.d.ts +366 -5
  104. package/dist/components/textarea/index.js +43 -57
  105. package/dist/components/textarea/index.js.map +1 -1
  106. package/dist/components/textarea/style.js +1 -1
  107. package/dist/components/textarea/style.js.map +1 -1
  108. package/dist/components/theme/style.js +1 -1
  109. package/dist/components/theme/style.js.map +1 -1
  110. package/dist/components/toast/style.js +1 -1
  111. package/dist/components/toast/style.js.map +1 -1
  112. package/dist/components/tooltip/index.d.ts +1 -0
  113. package/dist/components/tooltip/index.js +32 -46
  114. package/dist/components/tooltip/index.js.map +1 -1
  115. package/dist/components/tooltip/style.js +1 -1
  116. package/dist/components/tooltip/style.js.map +1 -1
  117. package/dist/shared/form-association/index.js +31 -4
  118. package/dist/shared/form-association/index.js.map +1 -1
  119. package/dist/shared/menu-behavior/index.js +112 -0
  120. package/dist/shared/menu-behavior/index.js.map +1 -0
  121. package/dist/shared/menu-portal/menu-tree.js +60 -1
  122. package/dist/shared/menu-portal/menu-tree.js.map +1 -1
  123. package/dist/shared/open-state/index.js +12 -0
  124. package/dist/shared/open-state/index.js.map +1 -0
  125. package/dist/shared/option-portal/combobox-shell.js +41 -0
  126. package/dist/shared/option-portal/combobox-shell.js.map +1 -0
  127. package/dist/shared/option-portal/index.js +23 -22
  128. package/dist/shared/option-portal/index.js.map +1 -1
  129. package/dist/shared/overlay/overlay.js.map +1 -1
  130. package/dist/shared/overlay/placement-props.js +19 -0
  131. package/dist/shared/overlay/placement-props.js.map +1 -0
  132. package/dist/shared/overlay/portal.js +94 -20
  133. package/dist/shared/overlay/portal.js.map +1 -1
  134. package/package.json +6 -7
@@ -1,7 +1,370 @@
1
1
  import { LitElement } from 'lit';
2
- export declare class WebUiSegmented extends LitElement {
2
+ declare const WebUiSegmented_base: {
3
+ new (...args: any[]): {
4
+ formResetCallback(): void;
5
+ formDisabledCallback(disabled: boolean): void;
6
+ formStateRestoreCallback(state: File | FormData | string | null): void;
7
+ accessKey: string;
8
+ readonly accessKeyLabel: string;
9
+ autocapitalize: string;
10
+ autocorrect: boolean;
11
+ dir: string;
12
+ draggable: boolean;
13
+ hidden: boolean | "until-found";
14
+ inert: boolean;
15
+ innerText: string;
16
+ lang: string;
17
+ readonly offsetHeight: number;
18
+ readonly offsetLeft: number;
19
+ readonly offsetParent: Element | null;
20
+ readonly offsetTop: number;
21
+ readonly offsetWidth: number;
22
+ outerText: string;
23
+ popover: string | null;
24
+ spellcheck: boolean;
25
+ title: string;
26
+ translate: boolean;
27
+ writingSuggestions: string;
28
+ attachInternals(): ElementInternals;
29
+ click(): void;
30
+ hidePopover(): void;
31
+ showPopover(options?: ShowPopoverOptions): void;
32
+ togglePopover(options?: TogglePopoverOptions | boolean): boolean;
33
+ addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
34
+ addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
35
+ removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
36
+ removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
37
+ readonly attributes: NamedNodeMap;
38
+ get classList(): DOMTokenList;
39
+ set classList(value: string);
40
+ className: string;
41
+ readonly clientHeight: number;
42
+ readonly clientLeft: number;
43
+ readonly clientTop: number;
44
+ readonly clientWidth: number;
45
+ readonly currentCSSZoom: number;
46
+ readonly customElementRegistry: CustomElementRegistry | null;
47
+ id: string;
48
+ innerHTML: string;
49
+ readonly localName: string;
50
+ readonly namespaceURI: string | null;
51
+ onfullscreenchange: ((this: Element, ev: Event) => any) | null;
52
+ onfullscreenerror: ((this: Element, ev: Event) => any) | null;
53
+ outerHTML: string;
54
+ readonly ownerDocument: Document;
55
+ get part(): DOMTokenList;
56
+ set part(value: string);
57
+ readonly prefix: string | null;
58
+ readonly scrollHeight: number;
59
+ scrollLeft: number;
60
+ scrollTop: number;
61
+ readonly scrollWidth: number;
62
+ readonly shadowRoot: ShadowRoot | null;
63
+ slot: string;
64
+ readonly tagName: string;
65
+ attachShadow(init: ShadowRootInit): ShadowRoot;
66
+ checkVisibility(options?: CheckVisibilityOptions): boolean;
67
+ closest<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K] | null;
68
+ closest<K extends keyof SVGElementTagNameMap>(selector: K): SVGElementTagNameMap[K] | null;
69
+ closest<K extends keyof MathMLElementTagNameMap>(selector: K): MathMLElementTagNameMap[K] | null;
70
+ closest<E extends Element = Element>(selectors: string): E | null;
71
+ computedStyleMap(): StylePropertyMapReadOnly;
72
+ getAttribute(qualifiedName: string): string | null;
73
+ getAttributeNS(namespace: string | null, localName: string): string | null;
74
+ getAttributeNames(): string[];
75
+ getAttributeNode(qualifiedName: string): Attr | null;
76
+ getAttributeNodeNS(namespace: string | null, localName: string): Attr | null;
77
+ getBoundingClientRect(): DOMRect;
78
+ getClientRects(): DOMRectList;
79
+ getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
80
+ getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
81
+ getElementsByTagName<K extends keyof SVGElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<SVGElementTagNameMap[K]>;
82
+ getElementsByTagName<K extends keyof MathMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<MathMLElementTagNameMap[K]>;
83
+ getElementsByTagName<K extends keyof HTMLElementDeprecatedTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementDeprecatedTagNameMap[K]>;
84
+ getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
85
+ getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
86
+ getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
87
+ getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1998/Math/MathML", localName: string): HTMLCollectionOf<MathMLElement>;
88
+ getElementsByTagNameNS(namespace: string | null, localName: string): HTMLCollectionOf<Element>;
89
+ getHTML(options?: GetHTMLOptions): string;
90
+ hasAttribute(qualifiedName: string): boolean;
91
+ hasAttributeNS(namespace: string | null, localName: string): boolean;
92
+ hasAttributes(): boolean;
93
+ hasPointerCapture(pointerId: number): boolean;
94
+ insertAdjacentElement(where: InsertPosition, element: Element): Element | null;
95
+ insertAdjacentHTML(position: InsertPosition, string: string): void;
96
+ insertAdjacentText(where: InsertPosition, data: string): void;
97
+ matches<K extends keyof HTMLElementTagNameMap>(selectors: K): this is HTMLElementTagNameMap[K];
98
+ matches<K extends keyof SVGElementTagNameMap>(selectors: K): this is SVGElementTagNameMap[K];
99
+ matches<K extends keyof MathMLElementTagNameMap>(selectors: K): this is MathMLElementTagNameMap[K];
100
+ matches(selectors: string): boolean;
101
+ releasePointerCapture(pointerId: number): void;
102
+ removeAttribute(qualifiedName: string): void;
103
+ removeAttributeNS(namespace: string | null, localName: string): void;
104
+ removeAttributeNode(attr: Attr): Attr;
105
+ requestFullscreen(options?: FullscreenOptions): Promise<void>;
106
+ requestPointerLock(options?: PointerLockOptions): Promise<void>;
107
+ scroll(options?: ScrollToOptions): void;
108
+ scroll(x: number, y: number): void;
109
+ scrollBy(options?: ScrollToOptions): void;
110
+ scrollBy(x: number, y: number): void;
111
+ scrollIntoView(arg?: boolean | ScrollIntoViewOptions): void;
112
+ scrollTo(options?: ScrollToOptions): void;
113
+ scrollTo(x: number, y: number): void;
114
+ setAttribute(qualifiedName: string, value: string): void;
115
+ setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
116
+ setAttributeNode(attr: Attr): Attr | null;
117
+ setAttributeNodeNS(attr: Attr): Attr | null;
118
+ setHTMLUnsafe(html: string): void;
119
+ setPointerCapture(pointerId: number): void;
120
+ toggleAttribute(qualifiedName: string, force?: boolean): boolean;
121
+ webkitMatchesSelector(selectors: string): boolean;
122
+ get textContent(): string;
123
+ set textContent(value: string | null);
124
+ readonly baseURI: string;
125
+ readonly childNodes: NodeListOf<ChildNode>;
126
+ readonly firstChild: ChildNode | null;
127
+ readonly isConnected: boolean;
128
+ readonly lastChild: ChildNode | null;
129
+ readonly nextSibling: ChildNode | null;
130
+ readonly nodeName: string;
131
+ readonly nodeType: number;
132
+ nodeValue: string | null;
133
+ readonly parentElement: HTMLElement | null;
134
+ readonly parentNode: ParentNode | null;
135
+ readonly previousSibling: ChildNode | null;
136
+ appendChild<T extends Node>(node: T): T;
137
+ cloneNode(subtree?: boolean): Node;
138
+ compareDocumentPosition(other: Node): number;
139
+ contains(other: Node | null): boolean;
140
+ getRootNode(options?: GetRootNodeOptions): Node;
141
+ hasChildNodes(): boolean;
142
+ insertBefore<T extends Node>(node: T, child: Node | null): T;
143
+ isDefaultNamespace(namespace: string | null): boolean;
144
+ isEqualNode(otherNode: Node | null): boolean;
145
+ isSameNode(otherNode: Node | null): boolean;
146
+ lookupNamespaceURI(prefix: string | null): string | null;
147
+ lookupPrefix(namespace: string | null): string | null;
148
+ normalize(): void;
149
+ removeChild<T extends Node>(child: T): T;
150
+ replaceChild<T extends Node>(node: Node, child: T): T;
151
+ readonly ELEMENT_NODE: 1;
152
+ readonly ATTRIBUTE_NODE: 2;
153
+ readonly TEXT_NODE: 3;
154
+ readonly CDATA_SECTION_NODE: 4;
155
+ readonly ENTITY_REFERENCE_NODE: 5;
156
+ readonly ENTITY_NODE: 6;
157
+ readonly PROCESSING_INSTRUCTION_NODE: 7;
158
+ readonly COMMENT_NODE: 8;
159
+ readonly DOCUMENT_NODE: 9;
160
+ readonly DOCUMENT_TYPE_NODE: 10;
161
+ readonly DOCUMENT_FRAGMENT_NODE: 11;
162
+ readonly NOTATION_NODE: 12;
163
+ readonly DOCUMENT_POSITION_DISCONNECTED: 1;
164
+ readonly DOCUMENT_POSITION_PRECEDING: 2;
165
+ readonly DOCUMENT_POSITION_FOLLOWING: 4;
166
+ readonly DOCUMENT_POSITION_CONTAINS: 8;
167
+ readonly DOCUMENT_POSITION_CONTAINED_BY: 16;
168
+ readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
169
+ dispatchEvent(event: Event): boolean;
170
+ ariaActiveDescendantElement: Element | null;
171
+ ariaAtomic: string | null;
172
+ ariaAutoComplete: string | null;
173
+ ariaBrailleLabel: string | null;
174
+ ariaBrailleRoleDescription: string | null;
175
+ ariaBusy: string | null;
176
+ ariaChecked: string | null;
177
+ ariaColCount: string | null;
178
+ ariaColIndex: string | null;
179
+ ariaColIndexText: string | null;
180
+ ariaColSpan: string | null;
181
+ ariaControlsElements: ReadonlyArray<Element> | null;
182
+ ariaCurrent: string | null;
183
+ ariaDescribedByElements: ReadonlyArray<Element> | null;
184
+ ariaDescription: string | null;
185
+ ariaDetailsElements: ReadonlyArray<Element> | null;
186
+ ariaDisabled: string | null;
187
+ ariaErrorMessageElements: ReadonlyArray<Element> | null;
188
+ ariaExpanded: string | null;
189
+ ariaFlowToElements: ReadonlyArray<Element> | null;
190
+ ariaHasPopup: string | null;
191
+ ariaHidden: string | null;
192
+ ariaInvalid: string | null;
193
+ ariaKeyShortcuts: string | null;
194
+ ariaLabel: string | null;
195
+ ariaLabelledByElements: ReadonlyArray<Element> | null;
196
+ ariaLevel: string | null;
197
+ ariaLive: string | null;
198
+ ariaModal: string | null;
199
+ ariaMultiLine: string | null;
200
+ ariaMultiSelectable: string | null;
201
+ ariaOrientation: string | null;
202
+ ariaOwnsElements: ReadonlyArray<Element> | null;
203
+ ariaPlaceholder: string | null;
204
+ ariaPosInSet: string | null;
205
+ ariaPressed: string | null;
206
+ ariaReadOnly: string | null;
207
+ ariaRelevant: string | null;
208
+ ariaRequired: string | null;
209
+ ariaRoleDescription: string | null;
210
+ ariaRowCount: string | null;
211
+ ariaRowIndex: string | null;
212
+ ariaRowIndexText: string | null;
213
+ ariaRowSpan: string | null;
214
+ ariaSelected: string | null;
215
+ ariaSetSize: string | null;
216
+ ariaSort: string | null;
217
+ ariaValueMax: string | null;
218
+ ariaValueMin: string | null;
219
+ ariaValueNow: string | null;
220
+ ariaValueText: string | null;
221
+ role: string | null;
222
+ animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions): Animation;
223
+ getAnimations(options?: GetAnimationsOptions): Animation[];
224
+ after(...nodes: (Node | string)[]): void;
225
+ before(...nodes: (Node | string)[]): void;
226
+ remove(): void;
227
+ replaceWith(...nodes: (Node | string)[]): void;
228
+ readonly nextElementSibling: Element | null;
229
+ readonly previousElementSibling: Element | null;
230
+ readonly childElementCount: number;
231
+ readonly children: HTMLCollection;
232
+ readonly firstElementChild: Element | null;
233
+ readonly lastElementChild: Element | null;
234
+ append(...nodes: (Node | string)[]): void;
235
+ moveBefore(node: Node, child: Node | null): void;
236
+ prepend(...nodes: (Node | string)[]): void;
237
+ querySelector<K extends keyof HTMLElementTagNameMap>(selectors: K): HTMLElementTagNameMap[K] | null;
238
+ querySelector<K extends keyof SVGElementTagNameMap>(selectors: K): SVGElementTagNameMap[K] | null;
239
+ querySelector<K extends keyof MathMLElementTagNameMap>(selectors: K): MathMLElementTagNameMap[K] | null;
240
+ querySelector<K extends keyof HTMLElementDeprecatedTagNameMap>(selectors: K): HTMLElementDeprecatedTagNameMap[K] | null;
241
+ querySelector<E extends Element = Element>(selectors: string): E | null;
242
+ querySelectorAll<K extends keyof HTMLElementTagNameMap>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;
243
+ querySelectorAll<K extends keyof SVGElementTagNameMap>(selectors: K): NodeListOf<SVGElementTagNameMap[K]>;
244
+ querySelectorAll<K extends keyof MathMLElementTagNameMap>(selectors: K): NodeListOf<MathMLElementTagNameMap[K]>;
245
+ querySelectorAll<K extends keyof HTMLElementDeprecatedTagNameMap>(selectors: K): NodeListOf<HTMLElementDeprecatedTagNameMap[K]>;
246
+ querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;
247
+ replaceChildren(...nodes: (Node | string)[]): void;
248
+ readonly assignedSlot: HTMLSlotElement | null;
249
+ readonly attributeStyleMap: StylePropertyMap;
250
+ get style(): CSSStyleDeclaration;
251
+ set style(cssText: string);
252
+ contentEditable: string;
253
+ enterKeyHint: string;
254
+ inputMode: string;
255
+ readonly isContentEditable: boolean;
256
+ onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
257
+ onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
258
+ onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
259
+ onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
260
+ onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
261
+ onauxclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
262
+ onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
263
+ onbeforematch: ((this: GlobalEventHandlers, ev: Event) => any) | null;
264
+ onbeforetoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
265
+ onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
266
+ oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
267
+ oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
268
+ oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
269
+ onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
270
+ onclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
271
+ onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
272
+ oncommand: ((this: GlobalEventHandlers, ev: Event) => any) | null;
273
+ oncontextlost: ((this: GlobalEventHandlers, ev: Event) => any) | null;
274
+ oncontextmenu: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
275
+ oncontextrestored: ((this: GlobalEventHandlers, ev: Event) => any) | null;
276
+ oncopy: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
277
+ oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
278
+ oncut: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
279
+ ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
280
+ ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
281
+ ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
282
+ ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
283
+ ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
284
+ ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
285
+ ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
286
+ ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
287
+ ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
288
+ onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
289
+ onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
290
+ onerror: OnErrorEventHandler;
291
+ onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
292
+ onformdata: ((this: GlobalEventHandlers, ev: FormDataEvent) => any) | null;
293
+ ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
294
+ oninput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
295
+ oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
296
+ onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
297
+ onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
298
+ onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
299
+ onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
300
+ onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
301
+ onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
302
+ onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
303
+ onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
304
+ onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
305
+ onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
306
+ onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
307
+ onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
308
+ onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
309
+ onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
310
+ onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
311
+ onpaste: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
312
+ onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
313
+ onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
314
+ onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
315
+ onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
316
+ onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
317
+ onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
318
+ onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
319
+ onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
320
+ onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
321
+ onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
322
+ onpointerrawupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
323
+ onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
324
+ onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
325
+ onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
326
+ onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
327
+ onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
328
+ onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
329
+ onscrollend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
330
+ onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
331
+ onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
332
+ onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
333
+ onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
334
+ onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
335
+ onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
336
+ onslotchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
337
+ onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
338
+ onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
339
+ onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
340
+ ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
341
+ ontoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
342
+ ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
343
+ ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
344
+ ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
345
+ ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
346
+ ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
347
+ ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
348
+ ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
349
+ ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
350
+ onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
351
+ onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
352
+ onwebkitanimationend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
353
+ onwebkitanimationiteration: ((this: GlobalEventHandlers, ev: Event) => any) | null;
354
+ onwebkitanimationstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
355
+ onwebkittransitionend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
356
+ onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
357
+ autofocus: boolean;
358
+ readonly dataset: DOMStringMap;
359
+ nonce: string;
360
+ tabIndex: number;
361
+ blur(): void;
362
+ focus(options?: FocusOptions): void;
363
+ };
364
+ formAssociated: boolean;
365
+ } & typeof LitElement;
366
+ export declare class WebUiSegmented extends WebUiSegmented_base {
3
367
  static styles: import('lit').CSSResult;
4
- static formAssociated: boolean;
5
368
  name: string;
6
369
  disabled: boolean;
7
370
  required: boolean;
@@ -21,9 +384,7 @@ export declare class WebUiSegmented extends LitElement {
21
384
  private handlePointerLeave;
22
385
  private readonly _formAssociation;
23
386
  private readonly _formAssociationController;
24
- formResetCallback(): void;
25
387
  formDisabledCallback(disabled: boolean): void;
26
- formStateRestoreCallback(state: string | File | FormData | null): void;
27
388
  render(): import('lit').TemplateResult<1>;
28
389
  readonly $events: {
29
390
  input: Event;
@@ -35,3 +396,4 @@ declare global {
35
396
  'web-ui-segmented': WebUiSegmented;
36
397
  }
37
398
  }
399
+ export {};
@@ -1,16 +1,16 @@
1
1
  import e from "../../_virtual/_@oxc-project_runtime@0.146.0/helpers/esm/decorate.js";
2
- import { FormAssociationController as t, defineFormAssociation as n } from "../../shared/form-association/index.js";
3
- import { GroupController as r, defineGroupCoordinator as i } from "../../shared/group-management/index.js";
4
- import { attachDragGesture as a } from "../../shared/gesture/drag-gesture.js";
5
- import { clamp as o, snapToNearest as s } from "../../shared/gesture/physics.js";
6
- import c from "./style.js";
7
- import { LitElement as l, html as u, unsafeCSS as d } from "lit";
8
- import { customElement as f, property as p, state as m } from "lit/decorators.js";
9
- import { classMap as h } from "lit/directives/class-map.js";
2
+ import { FormAssociated as t, FormAssociationController as n, defineFormAssociation as r } from "../../shared/form-association/index.js";
3
+ import { GroupController as i, defineGroupCoordinator as a } from "../../shared/group-management/index.js";
4
+ import { attachDragGesture as o } from "../../shared/gesture/drag-gesture.js";
5
+ import { clamp as s, snapToNearest as c } from "../../shared/gesture/physics.js";
6
+ import l from "./style.js";
7
+ import { LitElement as u, html as d, unsafeCSS as f } from "lit";
8
+ import { customElement as p, property as m, state as h } from "lit/decorators.js";
9
+ import { classMap as g } from "lit/directives/class-map.js";
10
10
  //#region src/components/segmented/index.ts
11
- var g = class extends l {
11
+ var _ = class extends t(u) {
12
12
  constructor(...e) {
13
- super(...e), this.name = "", this.disabled = !1, this.required = !1, this._value = "", this._indicatorReady = !1, this._pressed = !1, this._isDragging = !1, this._dragGestureHandle = null, this._groupController = new r(this, i({
13
+ super(...e), this.name = "", this.disabled = !1, this.required = !1, this._value = "", this._indicatorReady = !1, this._pressed = !1, this._isDragging = !1, this._dragGestureHandle = null, this._groupController = new i(this, a({
14
14
  host: this,
15
15
  getItems: () => [...this.querySelectorAll("web-ui-segmented-trigger")],
16
16
  getValue: () => this._value,
@@ -35,7 +35,7 @@ var g = class extends l {
35
35
  composed: !0
36
36
  }));
37
37
  }
38
- }).make(), { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }), this._formAssociation = n({
38
+ }).make(), { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }), this._formAssociation = r({
39
39
  host: this,
40
40
  initialize: () => {
41
41
  let e = this.getAttribute("value");
@@ -50,13 +50,10 @@ var g = class extends l {
50
50
  restoreState: (e) => {
51
51
  typeof e == "string" && (this.value = e);
52
52
  }
53
- }).make(), this._formAssociationController = new t(this, this._formAssociation);
53
+ }).make(), this._formAssociationController = new n(this, this._formAssociation);
54
54
  }
55
55
  static {
56
- this.styles = d(c);
57
- }
58
- static {
59
- this.formAssociated = !0;
56
+ this.styles = f(l);
60
57
  }
61
58
  disconnectedCallback() {
62
59
  super.disconnectedCallback(), this._dragGestureHandle?.destroy(), this._dragGestureHandle = null;
@@ -89,22 +86,22 @@ var g = class extends l {
89
86
  let i = r.getBoundingClientRect();
90
87
  if (!(e.clientX >= i.left && e.clientX <= i.right && e.clientY >= i.top && e.clientY <= i.bottom)) return;
91
88
  this._pressed = !0;
92
- let c = this.getBoundingClientRect(), l = r.getBoundingClientRect(), u = l.left - c.left, d = l.width, f = t[0].getBoundingClientRect(), p = t[t.length - 1].getBoundingClientRect(), m = f.left - c.left, h = p.right - c.left - d, g = n.map((e) => {
89
+ let a = this.getBoundingClientRect(), l = r.getBoundingClientRect(), u = l.left - a.left, d = l.width, f = t[0].getBoundingClientRect(), p = t[t.length - 1].getBoundingClientRect(), m = f.left - a.left, h = p.right - a.left - d, g = n.map((e) => {
93
90
  let t = e.getBoundingClientRect();
94
- return t.left - c.left + t.width / 2;
91
+ return t.left - a.left + t.width / 2;
95
92
  });
96
- this._dragGestureHandle?.destroy(), this._dragGestureHandle = a(e, {
93
+ this._dragGestureHandle?.destroy(), this._dragGestureHandle = o(e, {
97
94
  axis: "x",
98
95
  threshold: 6,
99
96
  onMove: (e) => {
100
97
  this._isDragging = !0;
101
- let t = o(u + e.deltaX, m, h);
98
+ let t = s(u + e.deltaX, m, h);
102
99
  this.style.setProperty("--indicator-left", `${t}px`), this.style.setProperty("--indicator-width", `${d}px`);
103
100
  },
104
101
  onEnd: (e) => {
105
102
  let t = this._isDragging;
106
103
  if (this._isDragging = !1, this._pressed = !1, t) {
107
- let t = o(u + e.deltaX, m, h) + d / 2, i = r;
104
+ let t = s(u + e.deltaX, m, h) + d / 2, i = r;
108
105
  if (e.velocityX > 300) {
109
106
  let e = n.indexOf(r);
110
107
  i = e !== -1 && e < n.length - 1 ? n[e + 1] : n[n.length - 1];
@@ -112,7 +109,7 @@ var g = class extends l {
112
109
  let e = n.indexOf(r);
113
110
  i = e > 0 ? n[e - 1] : n[0];
114
111
  } else {
115
- let e = s(t, g);
112
+ let e = c(t, g);
116
113
  e !== -1 && n[e] && (i = n[e]);
117
114
  }
118
115
  i.value === this._value ? this._updateIndicator() : (this.value = i.value, this._groupController.sync(), this.dispatchEvent(new Event("input", {
@@ -136,19 +133,13 @@ var g = class extends l {
136
133
  handlePointerLeave() {
137
134
  this._dragGestureHandle?.isDragging() || (this._pressed = !1);
138
135
  }
139
- formResetCallback() {
140
- this._formAssociation.reset();
141
- }
142
136
  formDisabledCallback(e) {
143
137
  this._formAssociation.setDisabled(e), this._groupController.sync();
144
138
  }
145
- formStateRestoreCallback(e) {
146
- this._formAssociation.restore(e);
147
- }
148
139
  render() {
149
- return u`
140
+ return d`
150
141
  <div
151
- class=${h({
142
+ class=${g({
152
143
  "wui-segmented": !0,
153
144
  "is-disabled": this._isDisabled,
154
145
  "is-pressed": this._pressed,
@@ -168,17 +159,17 @@ var g = class extends l {
168
159
  `;
169
160
  }
170
161
  };
171
- e([p({
162
+ e([m({
172
163
  type: String,
173
164
  reflect: !0
174
- })], g.prototype, "name", void 0), e([p({
165
+ })], _.prototype, "name", void 0), e([m({
175
166
  type: Boolean,
176
167
  reflect: !0
177
- })], g.prototype, "disabled", void 0), e([p({
168
+ })], _.prototype, "disabled", void 0), e([m({
178
169
  type: Boolean,
179
170
  reflect: !0
180
- })], g.prototype, "required", void 0), e([m()], g.prototype, "_value", void 0), e([m()], g.prototype, "_indicatorReady", void 0), e([m()], g.prototype, "_pressed", void 0), e([m()], g.prototype, "_isDragging", void 0), g = e([f("web-ui-segmented")], g);
171
+ })], _.prototype, "required", void 0), e([h()], _.prototype, "_value", void 0), e([h()], _.prototype, "_indicatorReady", void 0), e([h()], _.prototype, "_pressed", void 0), e([h()], _.prototype, "_isDragging", void 0), _ = e([p("web-ui-segmented")], _);
181
172
  //#endregion
182
- export { g as WebUiSegmented };
173
+ export { _ as WebUiSegmented };
183
174
 
184
175
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/segmented/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport { defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, snapToNearest } from '@/shared/gesture/physics'\nimport { defineGroupCoordinator, GroupController } from '@/shared/group-management'\n\nimport type { WebUiSegmentedTrigger } from '../segmented-trigger'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-segmented')\nexport class WebUiSegmented extends LitElement {\n static override styles = unsafeCSS(style)\n static formAssociated = true\n\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n\n @state() private _value = ''\n @state() private _indicatorReady = false\n @state() private _pressed = false\n @state() private _isDragging = false\n\n private _dragGestureHandle: DragGestureHandle | null = null\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n }\n\n private readonly _groupController = new GroupController(\n this,\n defineGroupCoordinator<WebUiSegmentedTrigger, string>({\n host: this,\n getItems: () => [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')],\n getValue: () => this._value,\n setValue: value => {\n this.value = value\n },\n getDisabled: () => this._isDisabled,\n isItem: (target): target is WebUiSegmentedTrigger =>\n target instanceof HTMLElement && target.matches('web-ui-segmented-trigger'),\n isItemSelected: (trigger, value) => trigger.value === value,\n getNextValue: (trigger, value) => (trigger.checked ? trigger.value : value),\n valuesEqual: (a, b) => a === b,\n copyValue: value => value,\n setItemSelected: (trigger, selected) => {\n trigger.checked = selected\n },\n dispatchValueChange: () => {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n }).make(),\n { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }\n )\n\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._formAssociation.sync()\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private _updateIndicator() {\n const triggers = this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')\n let left = 0\n let width = 0\n\n triggers.forEach(trigger => {\n if (trigger.value === this._value) {\n const triggerRect = trigger.getBoundingClientRect()\n const groupRect = this.getBoundingClientRect()\n left = triggerRect.left - groupRect.left\n width = triggerRect.width\n }\n })\n\n this.style.setProperty('--indicator-left', `${left}px`)\n this.style.setProperty('--indicator-width', `${width}px`)\n\n // 首帧只完成定位:先把当前定位以「未启用 left/width transition」状态提交为 before 值,\n // 再打开移动动画。若同一趟里 set 定位与启用 transition,浏览器会把 0→选项 当作一次过渡。\n if (!this._indicatorReady) {\n const indicator = this.renderRoot.querySelector<HTMLElement>('.wui-segmented-indicator')\n void indicator?.offsetWidth\n this._indicatorReady = true\n }\n }\n\n private handlePointerDown(e: PointerEvent) {\n if (this._isDisabled) return\n const triggers = [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')]\n const enabledTriggers = triggers.filter(t => !t.disabled)\n if (enabledTriggers.length === 0) return\n\n // 必须按下当前选中的 trigger 才能启动指示器拖拽\n const activeTrigger = triggers.find(t => t.value === this._value)\n if (!activeTrigger || activeTrigger.disabled) return\n\n const activeTriggerRect = activeTrigger.getBoundingClientRect()\n const isPressedOnActive =\n e.clientX >= activeTriggerRect.left &&\n e.clientX <= activeTriggerRect.right &&\n e.clientY >= activeTriggerRect.top &&\n e.clientY <= activeTriggerRect.bottom\n\n if (!isPressedOnActive) return\n\n this._pressed = true\n\n const groupRect = this.getBoundingClientRect()\n const initialTriggerRect = activeTrigger.getBoundingClientRect()\n const initialLeft = initialTriggerRect.left - groupRect.left\n const initialWidth = initialTriggerRect.width\n\n const firstTriggerRect = triggers[0].getBoundingClientRect()\n const lastTriggerRect = triggers[triggers.length - 1].getBoundingClientRect()\n const minLeft = firstTriggerRect.left - groupRect.left\n const maxLeft = lastTriggerRect.right - groupRect.left - initialWidth\n\n const enabledCenters = enabledTriggers.map(t => {\n const r = t.getBoundingClientRect()\n return r.left - groupRect.left + r.width / 2\n })\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n this.style.setProperty('--indicator-left', `${currentLeft}px`)\n this.style.setProperty('--indicator-width', `${initialWidth}px`)\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n const currentCenter = currentLeft + initialWidth / 2\n\n let targetTrigger = activeTrigger\n if (info.velocityX > 300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx !== -1 && currentIdx < enabledTriggers.length - 1) {\n targetTrigger = enabledTriggers[currentIdx + 1]\n } else {\n targetTrigger = enabledTriggers[enabledTriggers.length - 1]\n }\n } else if (info.velocityX < -300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx > 0) {\n targetTrigger = enabledTriggers[currentIdx - 1]\n } else {\n targetTrigger = enabledTriggers[0]\n }\n } else {\n const nearestIdx = snapToNearest(currentCenter, enabledCenters)\n if (nearestIdx !== -1 && enabledTriggers[nearestIdx]) {\n targetTrigger = enabledTriggers[nearestIdx]\n }\n }\n\n if (targetTrigger.value !== this._value) {\n this.value = targetTrigger.value\n this._groupController.sync()\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n } else {\n this._updateIndicator()\n }\n }\n this.requestUpdate()\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n this._updateIndicator()\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._dragGestureHandle?.isDragging()) {\n this._pressed = false\n }\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\n const attrValue = this.getAttribute('value')\n if (attrValue !== null && this._value === '') this._value = attrValue\n },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => (this.name && this._value ? this._value : null),\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n }\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n formResetCallback() {\n this._formAssociation.reset()\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formAssociation.setDisabled(disabled)\n this._groupController.sync()\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this._formAssociation.restore(state)\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n 'wui-segmented': true,\n 'is-disabled': this._isDisabled,\n 'is-pressed': this._pressed,\n 'is-dragging': this._isDragging,\n 'is-indicator-ready': this._indicatorReady\n })}\n role=\"listbox\"\n aria-orientation=\"horizontal\"\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <span class=\"wui-segmented-indicator\"></span>\n <slot></slot>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-segmented': WebUiSegmented\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/segmented/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, snapToNearest } from '@/shared/gesture/physics'\nimport { defineGroupCoordinator, GroupController } from '@/shared/group-management'\n\nimport type { WebUiSegmentedTrigger } from '../segmented-trigger'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-segmented')\nexport class WebUiSegmented extends FormAssociated(LitElement) {\n static override styles = unsafeCSS(style)\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n\n @state() private _value = ''\n @state() private _indicatorReady = false\n @state() private _pressed = false\n @state() private _isDragging = false\n\n private _dragGestureHandle: DragGestureHandle | null = null\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n }\n\n private readonly _groupController = new GroupController(\n this,\n defineGroupCoordinator<WebUiSegmentedTrigger, string>({\n host: this,\n getItems: () => [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')],\n getValue: () => this._value,\n setValue: value => {\n this.value = value\n },\n getDisabled: () => this._isDisabled,\n isItem: (target): target is WebUiSegmentedTrigger =>\n target instanceof HTMLElement && target.matches('web-ui-segmented-trigger'),\n isItemSelected: (trigger, value) => trigger.value === value,\n getNextValue: (trigger, value) => (trigger.checked ? trigger.value : value),\n valuesEqual: (a, b) => a === b,\n copyValue: value => value,\n setItemSelected: (trigger, selected) => {\n trigger.checked = selected\n },\n dispatchValueChange: () => {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n }).make(),\n { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }\n )\n\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._formAssociation.sync()\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private _updateIndicator() {\n const triggers = this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')\n let left = 0\n let width = 0\n\n triggers.forEach(trigger => {\n if (trigger.value === this._value) {\n const triggerRect = trigger.getBoundingClientRect()\n const groupRect = this.getBoundingClientRect()\n left = triggerRect.left - groupRect.left\n width = triggerRect.width\n }\n })\n\n this.style.setProperty('--indicator-left', `${left}px`)\n this.style.setProperty('--indicator-width', `${width}px`)\n\n // 首帧只完成定位:先把当前定位以「未启用 left/width transition」状态提交为 before 值,\n // 再打开移动动画。若同一趟里 set 定位与启用 transition,浏览器会把 0→选项 当作一次过渡。\n if (!this._indicatorReady) {\n const indicator = this.renderRoot.querySelector<HTMLElement>('.wui-segmented-indicator')\n void indicator?.offsetWidth\n this._indicatorReady = true\n }\n }\n\n private handlePointerDown(e: PointerEvent) {\n if (this._isDisabled) return\n const triggers = [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')]\n const enabledTriggers = triggers.filter(t => !t.disabled)\n if (enabledTriggers.length === 0) return\n\n // 必须按下当前选中的 trigger 才能启动指示器拖拽\n const activeTrigger = triggers.find(t => t.value === this._value)\n if (!activeTrigger || activeTrigger.disabled) return\n\n const activeTriggerRect = activeTrigger.getBoundingClientRect()\n const isPressedOnActive =\n e.clientX >= activeTriggerRect.left &&\n e.clientX <= activeTriggerRect.right &&\n e.clientY >= activeTriggerRect.top &&\n e.clientY <= activeTriggerRect.bottom\n\n if (!isPressedOnActive) return\n\n this._pressed = true\n\n const groupRect = this.getBoundingClientRect()\n const initialTriggerRect = activeTrigger.getBoundingClientRect()\n const initialLeft = initialTriggerRect.left - groupRect.left\n const initialWidth = initialTriggerRect.width\n\n const firstTriggerRect = triggers[0].getBoundingClientRect()\n const lastTriggerRect = triggers[triggers.length - 1].getBoundingClientRect()\n const minLeft = firstTriggerRect.left - groupRect.left\n const maxLeft = lastTriggerRect.right - groupRect.left - initialWidth\n\n const enabledCenters = enabledTriggers.map(t => {\n const r = t.getBoundingClientRect()\n return r.left - groupRect.left + r.width / 2\n })\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n this.style.setProperty('--indicator-left', `${currentLeft}px`)\n this.style.setProperty('--indicator-width', `${initialWidth}px`)\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n const currentCenter = currentLeft + initialWidth / 2\n\n let targetTrigger = activeTrigger\n if (info.velocityX > 300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx !== -1 && currentIdx < enabledTriggers.length - 1) {\n targetTrigger = enabledTriggers[currentIdx + 1]\n } else {\n targetTrigger = enabledTriggers[enabledTriggers.length - 1]\n }\n } else if (info.velocityX < -300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx > 0) {\n targetTrigger = enabledTriggers[currentIdx - 1]\n } else {\n targetTrigger = enabledTriggers[0]\n }\n } else {\n const nearestIdx = snapToNearest(currentCenter, enabledCenters)\n if (nearestIdx !== -1 && enabledTriggers[nearestIdx]) {\n targetTrigger = enabledTriggers[nearestIdx]\n }\n }\n\n if (targetTrigger.value !== this._value) {\n this.value = targetTrigger.value\n this._groupController.sync()\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n } else {\n this._updateIndicator()\n }\n }\n this.requestUpdate()\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n this._updateIndicator()\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._dragGestureHandle?.isDragging()) {\n this._pressed = false\n }\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\n const attrValue = this.getAttribute('value')\n if (attrValue !== null && this._value === '') this._value = attrValue\n },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => (this.name && this._value ? this._value : null),\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n }\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n override formDisabledCallback(disabled: boolean) {\n this._formAssociation.setDisabled(disabled)\n this._groupController.sync()\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n 'wui-segmented': true,\n 'is-disabled': this._isDisabled,\n 'is-pressed': this._pressed,\n 'is-dragging': this._isDragging,\n 'is-indicator-ready': this._indicatorReady\n })}\n role=\"listbox\"\n aria-orientation=\"horizontal\"\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <span class=\"wui-segmented-indicator\"></span>\n <slot></slot>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-segmented': WebUiSegmented\n }\n}\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/segmented/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{-webkit-user-select:none;user-select:none;display:inline-block}.wui-segmented{touch-action:pan-y;cursor:default;background-color:var(--wui-color-surface-segmented,#e5e5ea);border-radius:2147483647px;align-items:stretch;padding:4px;display:inline-flex;position:relative}.wui-segmented.is-disabled{cursor:not-allowed;opacity:.4}.wui-segmented.is-disabled .wui-segmented-trigger.is-disabled{opacity:1}.wui-segmented-indicator{z-index:0;top:4px;bottom:4px;left:var(--indicator-left,0);transform-origin:50%;width:var(--indicator-width,0);background-color:var(--wui-color-surface-selected,#fff);transition:transform var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,80ms) ease, box-shadow var(--wui-duration-press,80ms) ease;border-radius:2147483647px;display:block;position:absolute;transform:scale(1);box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.is-indicator-ready:not(.is-dragging) .wui-segmented-indicator{transition:left var(--wui-duration-trigger,.16s) var(--wui-ease-slide,cubic-bezier(.77, 0, .175, 1)), width var(--wui-duration-trigger,.16s) var(--wui-ease-slide,cubic-bezier(.77, 0, .175, 1)), transform var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,80ms) ease, box-shadow var(--wui-duration-press,80ms) ease}.wui-segmented.is-pressed .wui-segmented-indicator,.wui-segmented.is-dragging .wui-segmented-indicator{background-color:var(--wui-color-surface-glass,#fafafa57);-webkit-backdrop-filter:blur(4px)saturate(160%);backdrop-filter:blur(4px)saturate(160%);transform:scale(1.5);box-shadow:0 0 1px #0000000d,0 2px 8px #0000000a}.wui-segmented.is-dragging:not(.is-disabled){--wui-internal-segmented-trigger-cursor:grabbing;cursor:grabbing}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{-webkit-user-select:none;user-select:none;display:inline-block}.wui-segmented{touch-action:pan-y;cursor:default;border-radius:var(--wui-radius-control,calc(infinity * 1px));background-color:var(--wui-color-surface-segmented,#e5e5ea);align-items:stretch;padding:4px;display:inline-flex;position:relative}.wui-segmented.is-disabled{cursor:not-allowed;opacity:.4}.wui-segmented.is-disabled .wui-segmented-trigger.is-disabled{opacity:1}.wui-segmented-indicator{z-index:0;top:4px;bottom:4px;left:var(--indicator-left,0);transform-origin:50%;width:var(--indicator-width,0);border-radius:var(--wui-radius-control,calc(infinity * 1px));background-color:var(--wui-color-surface-selected,#fff);transition:transform var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,80ms) ease, box-shadow var(--wui-duration-press,80ms) ease;display:block;position:absolute;transform:scale(1);box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.is-indicator-ready:not(.is-dragging) .wui-segmented-indicator{transition:left var(--wui-duration-trigger,.16s) var(--wui-ease-slide,cubic-bezier(.77, 0, .175, 1)), width var(--wui-duration-trigger,.16s) var(--wui-ease-slide,cubic-bezier(.77, 0, .175, 1)), transform var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,80ms) ease, box-shadow var(--wui-duration-press,80ms) ease}.wui-segmented.is-pressed .wui-segmented-indicator,.wui-segmented.is-dragging .wui-segmented-indicator{background-color:var(--wui-color-surface-glass,#fafafa57);-webkit-backdrop-filter:blur(4px)saturate(160%);backdrop-filter:blur(4px)saturate(160%);transform:scale(1.5);box-shadow:0 0 1px #0000000d,0 2px 8px #0000000a}.wui-segmented.is-dragging:not(.is-disabled){--wui-internal-segmented-trigger-cursor:grabbing;cursor:grabbing}";
3
3
  //#endregion
4
4
  export { e as default };
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/segmented/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n user-select: none;\n display: inline-block;\n}\n\n.wui-segmented {\n touch-action: pan-y;\n cursor: default;\n\n position: relative;\n\n display: inline-flex;\n align-items: stretch;\n\n padding: 4px;\n border-radius: calc(infinity * 1px);\n\n background-color: var(--wui-color-surface-segmented, #e5e5ea);\n\n &.is-disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n\n &.is-disabled .wui-segmented-trigger.is-disabled {\n opacity: 1;\n }\n}\n\n.wui-segmented-indicator {\n position: absolute;\n z-index: 0;\n top: 4px;\n bottom: 4px;\n left: var(--indicator-left, 0);\n transform-origin: center center;\n transform: scale(1);\n\n display: block;\n\n width: var(--indicator-width, 0);\n border-radius: calc(infinity * 1px);\n\n background-color: var(--wui-color-surface-selected, #fff);\n box-shadow:\n 0 1px 3px rgb(0 0 0 / 0.12),\n 0 1px 2px rgb(0 0 0 / 0.08);\n\n transition:\n transform var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 80ms) ease,\n box-shadow var(--wui-duration-press, 80ms) ease;\n\n /* transition 只在首帧定位后且非拖拽状态启用,避免组件进入视口时触发初始化动画或拖拽跟手产生延迟 */\n .is-indicator-ready:not(.is-dragging) & {\n transition:\n left var(--wui-duration-trigger, 160ms) var(--wui-ease-slide, cubic-bezier(0.77, 0, 0.175, 1)),\n width var(--wui-duration-trigger, 160ms) var(--wui-ease-slide, cubic-bezier(0.77, 0, 0.175, 1)),\n transform var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 80ms) ease,\n box-shadow var(--wui-duration-press, 80ms) ease;\n }\n}\n\n.wui-segmented.is-pressed .wui-segmented-indicator,\n.wui-segmented.is-dragging .wui-segmented-indicator {\n transform: scale(1.5);\n background-color: var(--wui-color-surface-glass, rgb(250 250 250 / 0.34));\n backdrop-filter: blur(4px) saturate(160%);\n box-shadow:\n 0 0 1px rgb(0 0 0 / 0.05),\n 0 2px 8px rgb(0 0 0 / 0.04);\n}\n\n.wui-segmented.is-dragging:not(.is-disabled) {\n --wui-internal-segmented-trigger-cursor: grabbing;\n cursor: grabbing;\n}\n"],"mappings":""}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/segmented/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n user-select: none;\n display: inline-block;\n}\n\n.wui-segmented {\n touch-action: pan-y;\n cursor: default;\n\n position: relative;\n\n display: inline-flex;\n align-items: stretch;\n\n padding: 4px;\n border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n background-color: var(--wui-color-surface-segmented, #e5e5ea);\n\n &.is-disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n\n &.is-disabled .wui-segmented-trigger.is-disabled {\n opacity: 1;\n }\n}\n\n.wui-segmented-indicator {\n position: absolute;\n z-index: 0;\n top: 4px;\n bottom: 4px;\n left: var(--indicator-left, 0);\n transform-origin: center center;\n transform: scale(1);\n\n display: block;\n\n width: var(--indicator-width, 0);\n border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n background-color: var(--wui-color-surface-selected, #fff);\n box-shadow:\n 0 1px 3px rgb(0 0 0 / 0.12),\n 0 1px 2px rgb(0 0 0 / 0.08);\n\n transition:\n transform var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 80ms) ease,\n box-shadow var(--wui-duration-press, 80ms) ease;\n\n /* transition 只在首帧定位后且非拖拽状态启用,避免组件进入视口时触发初始化动画或拖拽跟手产生延迟 */\n .is-indicator-ready:not(.is-dragging) & {\n transition:\n left var(--wui-duration-trigger, 160ms) var(--wui-ease-slide, cubic-bezier(0.77, 0, 0.175, 1)),\n width var(--wui-duration-trigger, 160ms) var(--wui-ease-slide, cubic-bezier(0.77, 0, 0.175, 1)),\n transform var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 80ms) ease,\n box-shadow var(--wui-duration-press, 80ms) ease;\n }\n}\n\n.wui-segmented.is-pressed .wui-segmented-indicator,\n.wui-segmented.is-dragging .wui-segmented-indicator {\n transform: scale(1.5);\n background-color: var(--wui-color-surface-glass, rgb(250 250 250 / 0.34));\n backdrop-filter: blur(4px) saturate(160%);\n box-shadow:\n 0 0 1px rgb(0 0 0 / 0.05),\n 0 2px 8px rgb(0 0 0 / 0.04);\n}\n\n.wui-segmented.is-dragging:not(.is-disabled) {\n --wui-internal-segmented-trigger-cursor: grabbing;\n cursor: grabbing;\n}\n"],"mappings":""}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/segmented-trigger/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{--wui-segmented-trigger-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-segmented-trigger-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent));display:inline-block}:host([disabled]){cursor:not-allowed}.wui-segmented-trigger{cursor:var(--wui-internal-segmented-trigger-cursor,default);-webkit-user-select:none;user-select:none;z-index:1;height:calc(var(--wui-control-size,36px) - 8px);padding:0 var(--wui-segmented-trigger-px,12px);font-size:var(--wui-font-size,14px);color:var(--wui-color-text-secondary,#6a6a6a);white-space:nowrap;transition:color var(--wui-duration-focus,.2s) ease;background-color:#0000;border-radius:2147483647px;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative}.wui-segmented-trigger:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}.wui-segmented-trigger.is-checked{color:var(--wui-color-text,#1b1b1b)}@media (hover:hover) and (pointer:fine){.wui-segmented-trigger:hover:not(.is-disabled){background-color:var(--wui-segmented-trigger-bg-hover)}}.wui-segmented-trigger:active:not(.is-disabled){background-color:var(--wui-segmented-trigger-bg-active)}.wui-segmented-trigger.is-disabled{cursor:not-allowed;opacity:.4}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{--wui-segmented-trigger-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-segmented-trigger-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent));display:inline-block}:host([disabled]){cursor:not-allowed}.wui-segmented-trigger{cursor:var(--wui-internal-segmented-trigger-cursor,default);-webkit-user-select:none;user-select:none;z-index:1;height:calc(var(--wui-control-size,36px) - 8px);padding:0 var(--wui-segmented-trigger-px,12px);border-radius:var(--wui-radius-control,calc(infinity * 1px));font-size:var(--wui-font-size,14px);color:var(--wui-color-text-secondary,#6a6a6a);white-space:nowrap;transition:color var(--wui-duration-focus,.2s) ease;background-color:#0000;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative}.wui-segmented-trigger:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}.wui-segmented-trigger.is-checked{color:var(--wui-color-text,#1b1b1b)}@media (hover:hover) and (pointer:fine){.wui-segmented-trigger:hover:not(.is-disabled){background-color:var(--wui-segmented-trigger-bg-hover)}}.wui-segmented-trigger:active:not(.is-disabled){background-color:var(--wui-segmented-trigger-bg-active)}.wui-segmented-trigger.is-disabled{cursor:not-allowed;opacity:.4}";
3
3
  //#endregion
4
4
  export { e as default };
5
5