@sekiui/elements 0.0.49 → 0.0.50

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 (129) hide show
  1. package/dist/cdn/index.js +2 -2
  2. package/dist/cdn/{p-BLeUUc2-.js → p-DOQb1L-i.js} +28 -3
  3. package/dist/cdn/seki-button.js +1 -1
  4. package/dist/cdn/seki-field-description.js +1 -1
  5. package/dist/cdn/seki-field-error.js +1 -1
  6. package/dist/cdn/seki-field-group.js +1 -1
  7. package/dist/cdn/seki-field-label.js +1 -1
  8. package/dist/cdn/seki-field-legend.js +1 -1
  9. package/dist/cdn/seki-field.js +1 -1
  10. package/dist/cdn/seki-fieldset.js +1 -1
  11. package/dist/cdn/seki-input.js +1 -1
  12. package/dist/cdn/seki-select-content.d.ts +11 -0
  13. package/dist/cdn/seki-select-content.js +94 -0
  14. package/dist/cdn/seki-select-group.d.ts +11 -0
  15. package/dist/cdn/seki-select-group.js +42 -0
  16. package/dist/cdn/seki-select-option.d.ts +11 -0
  17. package/dist/cdn/seki-select-option.js +101 -0
  18. package/dist/cdn/seki-select-trigger.d.ts +11 -0
  19. package/dist/cdn/seki-select-trigger.js +147 -0
  20. package/dist/cdn/seki-select.d.ts +11 -0
  21. package/dist/cdn/seki-select.js +303 -0
  22. package/dist/cdn/seki-skeleton.js +2 -2
  23. package/dist/cjs/{index-BxD7Xe36.js → index-8TkHNmrx.js} +28 -3
  24. package/dist/cjs/index.cjs.js +1 -1
  25. package/dist/cjs/loader.cjs.js +2 -2
  26. package/dist/cjs/seki-button.cjs.entry.js +1 -1
  27. package/dist/cjs/seki-field-description.cjs.entry.js +1 -1
  28. package/dist/cjs/seki-field-error.cjs.entry.js +1 -1
  29. package/dist/cjs/seki-field-group.cjs.entry.js +1 -1
  30. package/dist/cjs/seki-field-label.cjs.entry.js +1 -1
  31. package/dist/cjs/seki-field-legend.cjs.entry.js +1 -1
  32. package/dist/cjs/seki-field.cjs.entry.js +1 -1
  33. package/dist/cjs/seki-fieldset.cjs.entry.js +1 -1
  34. package/dist/cjs/seki-input.cjs.entry.js +1 -1
  35. package/dist/cjs/seki-select-content.cjs.entry.js +72 -0
  36. package/dist/cjs/seki-select-group.cjs.entry.js +21 -0
  37. package/dist/cjs/seki-select-option.cjs.entry.js +78 -0
  38. package/dist/cjs/seki-select-trigger.cjs.entry.js +126 -0
  39. package/dist/cjs/seki-select.cjs.entry.js +254 -0
  40. package/dist/cjs/seki-skeleton.cjs.entry.js +2 -2
  41. package/dist/cjs/seki-switch.cjs.entry.js +1 -1
  42. package/dist/cjs/sekiui.cjs.js +2 -2
  43. package/dist/collection/collection-manifest.json +5 -0
  44. package/dist/collection/components/select/seki-select.css +410 -0
  45. package/dist/collection/components/select/seki-select.js +728 -0
  46. package/dist/collection/components/select-content/seki-select-content.css +403 -0
  47. package/dist/collection/components/select-content/seki-select-content.js +112 -0
  48. package/dist/collection/components/select-group/seki-select-group.css +393 -0
  49. package/dist/collection/components/select-group/seki-select-group.js +51 -0
  50. package/dist/collection/components/select-option/seki-select-option.css +423 -0
  51. package/dist/collection/components/select-option/seki-select-option.js +178 -0
  52. package/dist/collection/components/select-trigger/seki-select-trigger.css +477 -0
  53. package/dist/collection/components/select-trigger/seki-select-trigger.js +138 -0
  54. package/dist/collection/components/skeleton/seki-skeleton.js +1 -1
  55. package/dist/collection/utils/select/index.js +6 -0
  56. package/dist/collection/utils/select/select-context.js +38 -0
  57. package/dist/collection/utils/select/types.js +1 -0
  58. package/dist/components/index.js +2 -2
  59. package/dist/components/{p-BFmmBW7R.js → p-Bo3Iu2B_.js} +28 -3
  60. package/dist/components/seki-button.js +1 -1
  61. package/dist/components/seki-field-description.js +1 -1
  62. package/dist/components/seki-field-error.js +1 -1
  63. package/dist/components/seki-field-group.js +1 -1
  64. package/dist/components/seki-field-label.js +1 -1
  65. package/dist/components/seki-field-legend.js +1 -1
  66. package/dist/components/seki-field.js +1 -1
  67. package/dist/components/seki-fieldset.js +1 -1
  68. package/dist/components/seki-input.js +1 -1
  69. package/dist/components/seki-select-content.d.ts +11 -0
  70. package/dist/components/seki-select-content.js +94 -0
  71. package/dist/components/seki-select-group.d.ts +11 -0
  72. package/dist/components/seki-select-group.js +42 -0
  73. package/dist/components/seki-select-option.d.ts +11 -0
  74. package/dist/components/seki-select-option.js +101 -0
  75. package/dist/components/seki-select-trigger.d.ts +11 -0
  76. package/dist/components/seki-select-trigger.js +147 -0
  77. package/dist/components/seki-select.d.ts +11 -0
  78. package/dist/components/seki-select.js +303 -0
  79. package/dist/components/seki-skeleton.js +2 -2
  80. package/dist/esm/{index-ByHohxc0.js → index-CXbcuidh.js} +28 -3
  81. package/dist/esm/index.js +1 -1
  82. package/dist/esm/loader.js +3 -3
  83. package/dist/esm/seki-button.entry.js +1 -1
  84. package/dist/esm/seki-field-description.entry.js +1 -1
  85. package/dist/esm/seki-field-error.entry.js +1 -1
  86. package/dist/esm/seki-field-group.entry.js +1 -1
  87. package/dist/esm/seki-field-label.entry.js +1 -1
  88. package/dist/esm/seki-field-legend.entry.js +1 -1
  89. package/dist/esm/seki-field.entry.js +1 -1
  90. package/dist/esm/seki-fieldset.entry.js +1 -1
  91. package/dist/esm/seki-input.entry.js +1 -1
  92. package/dist/esm/seki-select-content.entry.js +70 -0
  93. package/dist/esm/seki-select-group.entry.js +19 -0
  94. package/dist/esm/seki-select-option.entry.js +76 -0
  95. package/dist/esm/seki-select-trigger.entry.js +124 -0
  96. package/dist/esm/seki-select.entry.js +252 -0
  97. package/dist/esm/seki-skeleton.entry.js +2 -2
  98. package/dist/esm/seki-switch.entry.js +1 -1
  99. package/dist/esm/sekiui.js +3 -3
  100. package/dist/sekiui/index.esm.js +1 -1
  101. package/dist/sekiui/{p-3b2d3e96.entry.js → p-0dc263b4.entry.js} +1 -1
  102. package/dist/sekiui/{p-51f2af94.entry.js → p-2c2c1b32.entry.js} +1 -1
  103. package/dist/sekiui/p-34efaa97.entry.js +1 -0
  104. package/dist/sekiui/p-422ca6b1.entry.js +1 -0
  105. package/dist/sekiui/p-462e506e.entry.js +1 -0
  106. package/dist/sekiui/{p-1b1a5e38.entry.js → p-46eb60c1.entry.js} +1 -1
  107. package/dist/sekiui/{p-128cfe90.entry.js → p-4b53d186.entry.js} +1 -1
  108. package/dist/sekiui/{p-1c923d08.entry.js → p-4d5088f9.entry.js} +1 -1
  109. package/dist/sekiui/{p-459bb637.entry.js → p-5071ac36.entry.js} +1 -1
  110. package/dist/sekiui/p-69c09654.entry.js +1 -0
  111. package/dist/sekiui/{p-bc921daa.entry.js → p-930b01ff.entry.js} +1 -1
  112. package/dist/sekiui/p-CXbcuidh.js +2 -0
  113. package/dist/sekiui/{p-70281e83.entry.js → p-b8aa77e4.entry.js} +1 -1
  114. package/dist/sekiui/{p-d034b071.entry.js → p-bdbf3000.entry.js} +1 -1
  115. package/dist/sekiui/p-cec05c04.entry.js +1 -0
  116. package/dist/sekiui/{p-2ecf7587.entry.js → p-ddc8d46e.entry.js} +1 -1
  117. package/dist/sekiui/{p-281803dd.entry.js → p-e79c7b4d.entry.js} +1 -1
  118. package/dist/sekiui/sekiui.esm.js +1 -1
  119. package/dist/types/components/select/seki-select.d.ts +80 -0
  120. package/dist/types/components/select-content/seki-select-content.d.ts +15 -0
  121. package/dist/types/components/select-group/seki-select-group.d.ts +10 -0
  122. package/dist/types/components/select-option/seki-select-option.d.ts +29 -0
  123. package/dist/types/components/select-trigger/seki-select-trigger.d.ts +21 -0
  124. package/dist/types/components.d.ts +310 -0
  125. package/dist/types/utils/select/index.d.ts +6 -0
  126. package/dist/types/utils/select/select-context.d.ts +19 -0
  127. package/dist/types/utils/select/types.d.ts +109 -0
  128. package/package.json +4 -1
  129. package/dist/sekiui/p-ByHohxc0.js +0 -2
@@ -6,7 +6,9 @@
6
6
  */
7
7
  import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
8
8
  import { Event } from "./stencil-public-runtime";
9
+ import { SelectChangeEventDetail, SelectOpenChangeEventDetail, SelectPlacement, SelectValidateEventDetail, SelectValue } from "./utils/select";
9
10
  export { Event } from "./stencil-public-runtime";
11
+ export { SelectChangeEventDetail, SelectOpenChangeEventDetail, SelectPlacement, SelectValidateEventDetail, SelectValue } from "./utils/select";
10
12
  export namespace Components {
11
13
  interface SekiButton {
12
14
  /**
@@ -183,6 +185,121 @@ export namespace Components {
183
185
  */
184
186
  "value"?: string;
185
187
  }
188
+ interface SekiSelect {
189
+ /**
190
+ * ID of element that describes this select
191
+ */
192
+ "ariaDescribedby"?: string;
193
+ /**
194
+ * Accessible label for screen readers
195
+ */
196
+ "ariaLabel"?: string;
197
+ /**
198
+ * ID of element that labels this select
199
+ */
200
+ "ariaLabelledby"?: string;
201
+ /**
202
+ * Clear all selections
203
+ */
204
+ "clearSelection": () => Promise<void>;
205
+ /**
206
+ * Programmatically close the dropdown
207
+ */
208
+ "closeDropdown": () => Promise<void>;
209
+ /**
210
+ * Initial dropdown open state (uncontrolled mode)
211
+ * @default false
212
+ */
213
+ "defaultOpen": boolean;
214
+ /**
215
+ * Initial selected value (uncontrolled mode)
216
+ */
217
+ "defaultValue"?: SelectValue;
218
+ /**
219
+ * Disable all interactions
220
+ * @default false
221
+ */
222
+ "disabled": boolean;
223
+ /**
224
+ * Focus the trigger element
225
+ */
226
+ "focusTrigger": () => Promise<void>;
227
+ /**
228
+ * Maximum dropdown height
229
+ * @default '12.5rem'
230
+ */
231
+ "maxHeight": string;
232
+ /**
233
+ * Maximum visible pills in multi-select mode
234
+ * @default 3
235
+ */
236
+ "maxVisiblePills": number;
237
+ /**
238
+ * Enable multi-select mode
239
+ * @default false
240
+ */
241
+ "multiple": boolean;
242
+ /**
243
+ * Form field name for form submission
244
+ */
245
+ "name"?: string;
246
+ /**
247
+ * Control dropdown open state (controlled mode)
248
+ */
249
+ "open"?: boolean;
250
+ /**
251
+ * Programmatically open the dropdown
252
+ */
253
+ "openDropdown": () => Promise<void>;
254
+ /**
255
+ * Placeholder text shown when no selection
256
+ * @default 'Select an option'
257
+ */
258
+ "placeholder": string;
259
+ /**
260
+ * Preferred dropdown placement
261
+ * @default 'bottom'
262
+ */
263
+ "placement": SelectPlacement;
264
+ /**
265
+ * Mark as required for form validation
266
+ * @default false
267
+ */
268
+ "required": boolean;
269
+ /**
270
+ * Current selected value (controlled mode)
271
+ */
272
+ "value"?: SelectValue;
273
+ }
274
+ interface SekiSelectContent {
275
+ /**
276
+ * Scroll to make an option visible
277
+ */
278
+ "scrollToOption": (optionId: string) => Promise<void>;
279
+ }
280
+ interface SekiSelectGroup {
281
+ /**
282
+ * Group label text (required)
283
+ */
284
+ "label": string;
285
+ }
286
+ interface SekiSelectOption {
287
+ /**
288
+ * Whether the option is disabled
289
+ * @default false
290
+ */
291
+ "disabled": boolean;
292
+ /**
293
+ * Display text for the option
294
+ */
295
+ "label"?: string;
296
+ /**
297
+ * Unique identifier for the option (required)
298
+ */
299
+ "value": string | number;
300
+ }
301
+ interface SekiSelectTrigger {
302
+ }
186
303
  /**
187
304
  * @component seki-skeleton
188
305
  * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -242,6 +359,14 @@ export interface SekiInputCustomEvent<T> extends CustomEvent<T> {
242
359
  detail: T;
243
360
  target: HTMLSekiInputElement;
244
361
  }
362
+ export interface SekiSelectCustomEvent<T> extends CustomEvent<T> {
363
+ detail: T;
364
+ target: HTMLSekiSelectElement;
365
+ }
366
+ export interface SekiSelectOptionCustomEvent<T> extends CustomEvent<T> {
367
+ detail: T;
368
+ target: HTMLSekiSelectOptionElement;
369
+ }
245
370
  export interface SekiSwitchCustomEvent<T> extends CustomEvent<T> {
246
371
  detail: T;
247
372
  target: HTMLSekiSwitchElement;
@@ -315,6 +440,61 @@ declare global {
315
440
  prototype: HTMLSekiInputElement;
316
441
  new (): HTMLSekiInputElement;
317
442
  };
443
+ interface HTMLSekiSelectElementEventMap {
444
+ "sekiChange": SelectChangeEventDetail;
445
+ "sekiOpenChange": SelectOpenChangeEventDetail;
446
+ "sekiValidate": SelectValidateEventDetail;
447
+ }
448
+ interface HTMLSekiSelectElement extends Components.SekiSelect, HTMLStencilElement {
449
+ addEventListener<K extends keyof HTMLSekiSelectElementEventMap>(type: K, listener: (this: HTMLSekiSelectElement, ev: SekiSelectCustomEvent<HTMLSekiSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
450
+ addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
451
+ addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
452
+ addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
453
+ removeEventListener<K extends keyof HTMLSekiSelectElementEventMap>(type: K, listener: (this: HTMLSekiSelectElement, ev: SekiSelectCustomEvent<HTMLSekiSelectElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
454
+ removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
455
+ removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
456
+ removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
457
+ }
458
+ var HTMLSekiSelectElement: {
459
+ prototype: HTMLSekiSelectElement;
460
+ new (): HTMLSekiSelectElement;
461
+ };
462
+ interface HTMLSekiSelectContentElement extends Components.SekiSelectContent, HTMLStencilElement {
463
+ }
464
+ var HTMLSekiSelectContentElement: {
465
+ prototype: HTMLSekiSelectContentElement;
466
+ new (): HTMLSekiSelectContentElement;
467
+ };
468
+ interface HTMLSekiSelectGroupElement extends Components.SekiSelectGroup, HTMLStencilElement {
469
+ }
470
+ var HTMLSekiSelectGroupElement: {
471
+ prototype: HTMLSekiSelectGroupElement;
472
+ new (): HTMLSekiSelectGroupElement;
473
+ };
474
+ interface HTMLSekiSelectOptionElementEventMap {
475
+ "sekiOptionSelect": { value: string | number };
476
+ "sekiOptionFocus": { value: string | number };
477
+ }
478
+ interface HTMLSekiSelectOptionElement extends Components.SekiSelectOption, HTMLStencilElement {
479
+ addEventListener<K extends keyof HTMLSekiSelectOptionElementEventMap>(type: K, listener: (this: HTMLSekiSelectOptionElement, ev: SekiSelectOptionCustomEvent<HTMLSekiSelectOptionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
480
+ addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
481
+ addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
482
+ addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
483
+ removeEventListener<K extends keyof HTMLSekiSelectOptionElementEventMap>(type: K, listener: (this: HTMLSekiSelectOptionElement, ev: SekiSelectOptionCustomEvent<HTMLSekiSelectOptionElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
484
+ removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
485
+ removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
486
+ removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
487
+ }
488
+ var HTMLSekiSelectOptionElement: {
489
+ prototype: HTMLSekiSelectOptionElement;
490
+ new (): HTMLSekiSelectOptionElement;
491
+ };
492
+ interface HTMLSekiSelectTriggerElement extends Components.SekiSelectTrigger, HTMLStencilElement {
493
+ }
494
+ var HTMLSekiSelectTriggerElement: {
495
+ prototype: HTMLSekiSelectTriggerElement;
496
+ new (): HTMLSekiSelectTriggerElement;
497
+ };
318
498
  /**
319
499
  * @component seki-skeleton
320
500
  * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -361,6 +541,11 @@ declare global {
361
541
  "seki-field-legend": HTMLSekiFieldLegendElement;
362
542
  "seki-fieldset": HTMLSekiFieldsetElement;
363
543
  "seki-input": HTMLSekiInputElement;
544
+ "seki-select": HTMLSekiSelectElement;
545
+ "seki-select-content": HTMLSekiSelectContentElement;
546
+ "seki-select-group": HTMLSekiSelectGroupElement;
547
+ "seki-select-option": HTMLSekiSelectOptionElement;
548
+ "seki-select-trigger": HTMLSekiSelectTriggerElement;
364
549
  "seki-skeleton": HTMLSekiSkeletonElement;
365
550
  "seki-switch": HTMLSekiSwitchElement;
366
551
  }
@@ -545,6 +730,121 @@ declare namespace LocalJSX {
545
730
  */
546
731
  "value"?: string;
547
732
  }
733
+ interface SekiSelect {
734
+ /**
735
+ * ID of element that describes this select
736
+ */
737
+ "ariaDescribedby"?: string;
738
+ /**
739
+ * Accessible label for screen readers
740
+ */
741
+ "ariaLabel"?: string;
742
+ /**
743
+ * ID of element that labels this select
744
+ */
745
+ "ariaLabelledby"?: string;
746
+ /**
747
+ * Initial dropdown open state (uncontrolled mode)
748
+ * @default false
749
+ */
750
+ "defaultOpen"?: boolean;
751
+ /**
752
+ * Initial selected value (uncontrolled mode)
753
+ */
754
+ "defaultValue"?: SelectValue;
755
+ /**
756
+ * Disable all interactions
757
+ * @default false
758
+ */
759
+ "disabled"?: boolean;
760
+ /**
761
+ * Maximum dropdown height
762
+ * @default '12.5rem'
763
+ */
764
+ "maxHeight"?: string;
765
+ /**
766
+ * Maximum visible pills in multi-select mode
767
+ * @default 3
768
+ */
769
+ "maxVisiblePills"?: number;
770
+ /**
771
+ * Enable multi-select mode
772
+ * @default false
773
+ */
774
+ "multiple"?: boolean;
775
+ /**
776
+ * Form field name for form submission
777
+ */
778
+ "name"?: string;
779
+ /**
780
+ * Emitted when selected value changes
781
+ */
782
+ "onSekiChange"?: (event: SekiSelectCustomEvent<SelectChangeEventDetail>) => void;
783
+ /**
784
+ * Emitted when dropdown open state changes
785
+ */
786
+ "onSekiOpenChange"?: (event: SekiSelectCustomEvent<SelectOpenChangeEventDetail>) => void;
787
+ /**
788
+ * Emitted when validation state changes
789
+ */
790
+ "onSekiValidate"?: (event: SekiSelectCustomEvent<SelectValidateEventDetail>) => void;
791
+ /**
792
+ * Control dropdown open state (controlled mode)
793
+ */
794
+ "open"?: boolean;
795
+ /**
796
+ * Placeholder text shown when no selection
797
+ * @default 'Select an option'
798
+ */
799
+ "placeholder"?: string;
800
+ /**
801
+ * Preferred dropdown placement
802
+ * @default 'bottom'
803
+ */
804
+ "placement"?: SelectPlacement;
805
+ /**
806
+ * Mark as required for form validation
807
+ * @default false
808
+ */
809
+ "required"?: boolean;
810
+ /**
811
+ * Current selected value (controlled mode)
812
+ */
813
+ "value"?: SelectValue;
814
+ }
815
+ interface SekiSelectContent {
816
+ }
817
+ interface SekiSelectGroup {
818
+ /**
819
+ * Group label text (required)
820
+ */
821
+ "label": string;
822
+ }
823
+ interface SekiSelectOption {
824
+ /**
825
+ * Whether the option is disabled
826
+ * @default false
827
+ */
828
+ "disabled"?: boolean;
829
+ /**
830
+ * Display text for the option
831
+ */
832
+ "label"?: string;
833
+ /**
834
+ * Emitted when option receives focus
835
+ */
836
+ "onSekiOptionFocus"?: (event: SekiSelectOptionCustomEvent<{ value: string | number }>) => void;
837
+ /**
838
+ * Emitted when option is selected
839
+ */
840
+ "onSekiOptionSelect"?: (event: SekiSelectOptionCustomEvent<{ value: string | number }>) => void;
841
+ /**
842
+ * Unique identifier for the option (required)
843
+ */
844
+ "value": string | number;
845
+ }
846
+ interface SekiSelectTrigger {
847
+ }
548
848
  /**
549
849
  * @component seki-skeleton
550
850
  * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -613,6 +913,11 @@ declare namespace LocalJSX {
613
913
  "seki-field-legend": SekiFieldLegend;
614
914
  "seki-fieldset": SekiFieldset;
615
915
  "seki-input": SekiInput;
916
+ "seki-select": SekiSelect;
917
+ "seki-select-content": SekiSelectContent;
918
+ "seki-select-group": SekiSelectGroup;
919
+ "seki-select-option": SekiSelectOption;
920
+ "seki-select-trigger": SekiSelectTrigger;
616
921
  "seki-skeleton": SekiSkeleton;
617
922
  "seki-switch": SekiSwitch;
618
923
  }
@@ -630,6 +935,11 @@ declare module "@stencil/core" {
630
935
  "seki-field-legend": LocalJSX.SekiFieldLegend & JSXBase.HTMLAttributes<HTMLSekiFieldLegendElement>;
631
936
  "seki-fieldset": LocalJSX.SekiFieldset & JSXBase.HTMLAttributes<HTMLSekiFieldsetElement>;
632
937
  "seki-input": LocalJSX.SekiInput & JSXBase.HTMLAttributes<HTMLSekiInputElement>;
938
+ "seki-select": LocalJSX.SekiSelect & JSXBase.HTMLAttributes<HTMLSekiSelectElement>;
939
+ "seki-select-content": LocalJSX.SekiSelectContent & JSXBase.HTMLAttributes<HTMLSekiSelectContentElement>;
940
+ "seki-select-group": LocalJSX.SekiSelectGroup & JSXBase.HTMLAttributes<HTMLSekiSelectGroupElement>;
941
+ "seki-select-option": LocalJSX.SekiSelectOption & JSXBase.HTMLAttributes<HTMLSekiSelectOptionElement>;
942
+ "seki-select-trigger": LocalJSX.SekiSelectTrigger & JSXBase.HTMLAttributes<HTMLSekiSelectTriggerElement>;
633
943
  /**
634
944
  * @component seki-skeleton
635
945
  * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Select Utilities
3
+ * Shared utilities, types, and context for select components
4
+ */
5
+ export * from './types';
6
+ export * from './select-context';
@@ -0,0 +1,19 @@
1
+ /**
2
+ * Select Context
3
+ * Context for sharing state between select components
4
+ */
5
+ import type { SelectContext } from './types';
6
+ /**
7
+ * Default context value
8
+ * Used as placeholder before provider initializes
9
+ */
10
+ export declare const defaultSelectContext: SelectContext;
11
+ /**
12
+ * Context for select component family
13
+ *
14
+ * Note: Since Stencil doesn't provide built-in context API,
15
+ * we use direct parent-child communication via element references.
16
+ *
17
+ * The parent seki-select component exposes a `selectContext` property
18
+ * that children can access via `this.el.closest('seki-select').selectContext`
19
+ */
@@ -0,0 +1,109 @@
1
+ /**
2
+ * Select Component Type Definitions
3
+ * Shared types used across all select components
4
+ */
5
+ /**
6
+ * Value type for select component
7
+ * - Single-select: string | number
8
+ * - Multi-select: (string | number)[]
9
+ */
10
+ export type SelectValue = string | number | (string | number)[];
11
+ /**
12
+ * Option data structure
13
+ */
14
+ export interface SelectOption {
15
+ /** Unique identifier for the option */
16
+ value: string | number;
17
+ /** Display text for the option */
18
+ label: string;
19
+ /** Whether the option is disabled */
20
+ disabled?: boolean;
21
+ /** Whether the option is selected */
22
+ selected?: boolean;
23
+ }
24
+ /**
25
+ * Event detail for selection change
26
+ */
27
+ export interface SelectChangeEventDetail {
28
+ /** Current value (single or array) */
29
+ value: SelectValue;
30
+ /** Selected option (single-select only) */
31
+ option?: SelectOption;
32
+ /** Selected options (multi-select only) */
33
+ options?: SelectOption[];
34
+ }
35
+ /**
36
+ * Event detail for open state change
37
+ */
38
+ export interface SelectOpenChangeEventDetail {
39
+ /** Whether dropdown is open */
40
+ open: boolean;
41
+ }
42
+ /**
43
+ * Event detail for validation state
44
+ */
45
+ export interface SelectValidateEventDetail {
46
+ /** Whether the value is valid */
47
+ valid: boolean;
48
+ /** Error message if invalid */
49
+ errorMessage?: string;
50
+ }
51
+ /**
52
+ * Dropdown placement options
53
+ */
54
+ export type SelectPlacement = 'top' | 'bottom' | 'left' | 'right';
55
+ /**
56
+ * Context shared between select components
57
+ * Provided by seki-select, consumed by child components
58
+ */
59
+ export interface SelectContext {
60
+ /** Current selected value(s) */
61
+ value: SelectValue;
62
+ /** Whether multi-select mode is enabled */
63
+ multiple: boolean;
64
+ /** Whether dropdown is open */
65
+ open: boolean;
66
+ /** Whether select is disabled */
67
+ disabled: boolean;
68
+ /** Whether select is required */
69
+ required: boolean;
70
+ /** Currently focused option value */
71
+ focusedOptionValue: string | number | null;
72
+ /** Unique ID for the content element (for aria-controls) */
73
+ contentId: string;
74
+ /** Unique ID for the trigger element */
75
+ triggerId: string;
76
+ /** Accessible label for screen readers */
77
+ ariaLabel?: string;
78
+ /** ID of element that labels this select */
79
+ ariaLabelledby?: string;
80
+ /** ID of element that describes this select */
81
+ ariaDescribedby?: string;
82
+ /** Handler for value changes */
83
+ onValueChange: (value: SelectValue) => void;
84
+ /** Handler for open state changes */
85
+ onOpenChange: (open: boolean) => void;
86
+ /** Handler for option focus changes */
87
+ onOptionFocus: (value: string | number) => void;
88
+ /** Handler for option selection */
89
+ onOptionSelect: (value: string | number) => void;
90
+ /** Check if a value is selected */
91
+ isValueSelected: (value: string | number) => boolean;
92
+ /** Get all selected options */
93
+ getSelectedOptions: () => SelectOption[];
94
+ /** Register an option with the context */
95
+ registerOption: (option: SelectOption) => void;
96
+ /** Unregister an option from the context */
97
+ unregisterOption: (value: string | number) => void;
98
+ }
99
+ /**
100
+ * Type-ahead search state
101
+ */
102
+ export interface TypeAheadState {
103
+ /** Accumulated search string */
104
+ buffer: string;
105
+ /** Timeout ID for buffer reset */
106
+ timeoutId: number | null;
107
+ /** Debounce duration in milliseconds */
108
+ debounce: number;
109
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sekiui/elements",
3
- "version": "0.0.49",
3
+ "version": "0.0.50",
4
4
  "description": "Modern, accessible Web Components with shadcn/ui-inspired design",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -55,5 +55,8 @@
55
55
  "lit": "^3.3.1",
56
56
  "prettier": "^3.6.2",
57
57
  "storybook": "^9.1.10"
58
+ },
59
+ "dependencies": {
60
+ "@floating-ui/dom": "^1.7.4"
58
61
  }
59
62
  }
@@ -1,2 +0,0 @@
1
- const e=()=>{};var t=Object.defineProperty,s=e=>{if(e.__stencil__getHostRef)return e.__stencil__getHostRef()},i=(e,t)=>{t&&(e.__stencil__getHostRef=()=>t,t.t=e)},n=(e,t)=>t in e,r=(e,t)=>(0,console.error)(e,t),o=new Map,l=new Map,a="slot-fb{display:contents}slot-fb[hidden]{display:none}",u="http://www.w3.org/1999/xlink",c=["formAssociatedCallback","formResetCallback","formDisabledCallback","formStateRestoreCallback"],k="undefined"!=typeof window?window:{},d={i:0,o:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,s,i)=>e.addEventListener(t,s,i),rel:(e,t,s,i)=>e.removeEventListener(t,s,i),ce:(e,t)=>new CustomEvent(e,t)},p=e=>Promise.resolve(e),h=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(e){}return!1})(),f=!!h&&(()=>!!k.document&&Object.getOwnPropertyDescriptor(k.document.adoptedStyleSheets,"length").writable)(),m=!1,b=[],v=[],g=(e,t)=>s=>{e.push(s),m||(m=!0,t&&4&d.i?w(x):d.raf(x))},y=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){r(e)}e.length=0},x=()=>{y(b),y(v),(m=b.length>0)&&d.raf(x)},w=e=>p().then(e),$=g(v,!0),S=e=>"object"==(e=typeof e)||"function"===e;function j(e){var t,s,i;return null!=(i=null==(s=null==(t=e.head)?void 0:t.querySelector('meta[name="csp-nonce"]'))?void 0:s.getAttribute("content"))?i:void 0}((e,s)=>{for(var i in s)t(e,i,{get:s[i],enumerable:!0})})({},{err:()=>C,map:()=>M,ok:()=>O,unwrap:()=>R,unwrapErr:()=>z});var O=e=>({isOk:!0,isErr:!1,value:e}),C=e=>({isOk:!1,isErr:!0,value:e});function M(e,t){if(e.isOk){const s=t(e.value);return s instanceof Promise?s.then((e=>O(e))):O(s)}if(e.isErr)return C(e.value);throw"should never get here"}var E,R=e=>{if(e.isOk)return e.value;throw e.value},z=e=>{if(e.isErr)return e.value;throw e.value};function P(){var e;const t=this.attachShadow({mode:"open"});void 0===E&&(E=null!=(e=function(){if(!h)return;const e=new CSSStyleSheet;return e.replaceSync(":host{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:host{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:host([data-theme='dark']){--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:host{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md)}:host{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:host{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:host{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:host{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}"),e}())?e:null),E&&(f?t.adoptedStyleSheets.push(E):t.adoptedStyleSheets=[...t.adoptedStyleSheets,E])}var N=new WeakMap,A=e=>"sc-"+e.l,D=(e,t,...s)=>{let i=null,n=null,r=!1,o=!1;const l=[],a=t=>{for(let s=0;s<t.length;s++)i=t[s],Array.isArray(i)?a(i):null!=i&&"boolean"!=typeof i&&((r="function"!=typeof e&&!S(i))&&(i+=""),r&&o?l[l.length-1].u+=i:l.push(r?U(null,i):i),o=r)};if(a(s),t){t.key&&(n=t.key);{const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}}const u=U(e,null);return u.k=t,l.length>0&&(u.p=l),u.h=n,u},U=(e,t)=>({i:0,m:e,u:t,v:null,p:null,k:null,h:null}),F={},W=e=>{const t=(e=>e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"))(e);return RegExp(`(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${t}))(${t}\\b)`,"g")};W("::slotted"),W(":host"),W(":host-context");var H,L=(e,t,s)=>null==e||S(e)?e:4&t?(s&&"string"==typeof e||"false"!==e)&&(""===e||!!e):2&t?"string"==typeof e?parseFloat(e):"number"==typeof e?e:NaN:1&t?e+"":e,T=e=>{var t;return null==(t=s(e))?void 0:t.$hostElement$},V=(e,t)=>{const s=T(e);return{emit:e=>q(s,t,{bubbles:!0,composed:!0,cancelable:!0,detail:e})}},q=(e,t,s)=>{const i=d.ce(t,s);return e.dispatchEvent(i),i},I=(e,t,s,i,r,o)=>{if(s===i)return;let l=n(e,t),a=t.toLowerCase();if("class"===t){const t=e.classList,n=G(s);let r=G(i);t.remove(...n.filter((e=>e&&!r.includes(e)))),t.add(...r.filter((e=>e&&!n.includes(e))))}else if("style"===t){for(const t in s)i&&null!=i[t]||(t.includes("-")?e.style.removeProperty(t):e.style[t]="");for(const t in i)s&&i[t]===s[t]||(t.includes("-")?e.style.setProperty(t,i[t]):e.style[t]=i[t])}else if("key"===t);else if("ref"===t)i&&i(e);else if(l||"o"!==t[0]||"n"!==t[1]){const n=S(i);if(l||n&&null!==i)try{if(e.tagName.includes("-"))e[t]!==i&&(e[t]=i);else{const n=null==i?"":i;"list"===t?l=!1:null!=s&&e[t]==n||("function"==typeof e.__lookupSetter__(t)?e[t]=n:e.setAttribute(t,n))}}catch(e){}let c=!1;a!==(a=a.replace(/^xlink\:?/,""))&&(t=a,c=!0),null==i||!1===i?!1===i&&""!==e.getAttribute(t)||(c?e.removeAttributeNS(u,t):e.removeAttribute(t)):(!l||4&o||r)&&!n&&1===e.nodeType&&(i=!0===i?"":i,c?e.setAttributeNS(u,t,i):e.setAttribute(t,i))}else if(t="-"===t[2]?t.slice(3):n(k,a)?a.slice(2):a[2]+t.slice(3),s||i){const n=t.endsWith(Y);t=t.replace(_,""),s&&d.rel(e,t,s,n),i&&d.ael(e,t,i,n)}},B=/\s/,G=e=>("object"==typeof e&&e&&"baseVal"in e&&(e=e.baseVal),e&&"string"==typeof e?e.split(B):[]),Y="Capture",_=RegExp(Y+"$"),J=(e,t,s)=>{const i=11===t.v.nodeType&&t.v.host?t.v.host:t.v,n=e&&e.k||{},r=t.k||{};for(const e of K(Object.keys(n)))e in r||I(i,e,n[e],void 0,s,t.i);for(const e of K(Object.keys(r)))I(i,e,n[e],r[e],s,t.i)};function K(e){return e.includes("ref")?[...e.filter((e=>"ref"!==e)),"ref"]:e}var Q=!1,X=(e,t,s)=>{const i=t.p[s];let n,r,o=0;if(null!==i.u)n=i.v=k.document.createTextNode(i.u);else{if(!k.document)throw Error("You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component.");if(n=i.v=k.document.createElement(i.m),J(null,i,Q),i.p)for(o=0;o<i.p.length;++o)r=X(e,i,o),r&&n.appendChild(r)}return n["s-hn"]=H,n},Z=(e,t,s,i,n,r)=>{let o,l=e;for(l.shadowRoot&&l.tagName===H&&(l=l.shadowRoot);n<=r;++n)i[n]&&(o=X(null,s,n),o&&(i[n].v=o,ne(l,o,t)))},ee=(e,t,s)=>{for(let i=t;i<=s;++i){const t=e[i];if(t){const e=t.v;ie(t),e&&e.remove()}}},te=(e,t,s=!1)=>e.m===t.m&&(s?(s&&!e.h&&t.h&&(e.h=t.h),!0):e.h===t.h),se=(e,t,s=!1)=>{const i=t.v=e.v,n=e.p,r=t.p,o=t.u;null===o?(J(e,t,Q),null!==n&&null!==r?((e,t,s,i,n=!1)=>{let r,o,l=0,a=0,u=0,c=0,k=t.length-1,d=t[0],p=t[k],h=i.length-1,f=i[0],m=i[h];for(;l<=k&&a<=h;)if(null==d)d=t[++l];else if(null==p)p=t[--k];else if(null==f)f=i[++a];else if(null==m)m=i[--h];else if(te(d,f,n))se(d,f,n),d=t[++l],f=i[++a];else if(te(p,m,n))se(p,m,n),p=t[--k],m=i[--h];else if(te(d,m,n))se(d,m,n),ne(e,d.v,p.v.nextSibling),d=t[++l],m=i[--h];else if(te(p,f,n))se(p,f,n),ne(e,p.v,d.v),p=t[--k],f=i[++a];else{for(u=-1,c=l;c<=k;++c)if(t[c]&&null!==t[c].h&&t[c].h===f.h){u=c;break}u>=0?(o=t[u],o.m!==f.m?r=X(t&&t[a],s,u):(se(o,f,n),t[u]=void 0,r=o.v),f=i[++a]):(r=X(t&&t[a],s,a),f=i[++a]),r&&ne(d.v.parentNode,r,d.v)}l>k?Z(e,null==i[h+1]?null:i[h+1].v,s,i,a,h):a>h&&ee(t,l,k)})(i,n,t,r,s):null!==r?(null!==e.u&&(i.textContent=""),Z(i,null,t,r,0,r.length-1)):!s&&null!==n&&ee(n,0,n.length-1)):e.u!==o&&(i.data=o)},ie=e=>{e.k&&e.k.ref&&e.k.ref(null),e.p&&e.p.map(ie)},ne=(e,t,s)=>null==e?void 0:e.insertBefore(t,s),re=(e,t)=>{if(t&&!e.$&&t["s-p"]){const s=t["s-p"].push(new Promise((i=>e.$=()=>{t["s-p"].splice(s-1,1),i()})))}},oe=(e,t)=>{if(e.i|=16,4&e.i)return void(e.i|=512);re(e,e.S);const s=()=>le(e,t);if(!t)return $(s);queueMicrotask((()=>{s()}))},le=(e,t)=>{const s=e.$hostElement$,i=e.t;if(!i)throw Error(`Can't render component <${s.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let n;return t?(e.i|=256,e.j&&(e.j.map((([e,t])=>he(i,e,t,s))),e.j=void 0),e.O.length&&e.O.forEach((e=>e(s))),n=he(i,"componentWillLoad",void 0,s)):n=he(i,"componentWillUpdate",void 0,s),n=ae(n,(()=>he(i,"componentWillRender",void 0,s))),ae(n,(()=>ce(e,i,t)))},ae=(e,t)=>ue(e)?e.then(t).catch((e=>{console.error(e),t()})):t(),ue=e=>e instanceof Promise||e&&e.then&&"function"==typeof e.then,ce=async(e,t,s)=>{var i;const n=e.$hostElement$,r=n["s-rc"];s&&(e=>{const t=e.C,s=e.$hostElement$,i=t.i,n=((e,t)=>{var s;const i=A(t),n=l.get(i);if(!k.document)return i;if(e=11===e.nodeType?e:k.document,n)if("string"==typeof n){let r,o=N.get(e=e.head||e);if(o||N.set(e,o=new Set),!o.has(i)){{r=k.document.createElement("style"),r.innerHTML=n;const i=null!=(s=d.M)?s:j(k.document);if(null!=i&&r.setAttribute("nonce",i),!(1&t.i))if("HEAD"===e.nodeName){const t=e.querySelectorAll("link[rel=preconnect]"),s=t.length>0?t[t.length-1].nextSibling:e.querySelector("style");e.insertBefore(r,(null==s?void 0:s.parentNode)===e?s:null)}else if("host"in e)if(h){const t=new CSSStyleSheet;t.replaceSync(n),f?e.adoptedStyleSheets.unshift(t):e.adoptedStyleSheets=[t,...e.adoptedStyleSheets]}else{const t=e.querySelector("style");t?t.innerHTML=n+t.innerHTML:e.prepend(r)}else e.append(r);1&t.i&&e.insertBefore(r,null)}4&t.i&&(r.innerHTML+=a),o&&o.add(i)}}else e.adoptedStyleSheets.includes(n)||(f?e.adoptedStyleSheets.push(n):e.adoptedStyleSheets=[...e.adoptedStyleSheets,n]);return i})(s.shadowRoot?s.shadowRoot:s.getRootNode(),t);10&i&&(s["s-sc"]=n,s.classList.add(n+"-h"))})(e);ke(e,t,n,s),r&&(r.map((e=>e())),n["s-rc"]=void 0);{const t=null!=(i=n["s-p"])?i:[],s=()=>de(e);0===t.length?s():(Promise.all(t).then(s),e.i|=4,t.length=0)}},ke=(e,t,s,i)=>{try{t=t.render(),e.i&=-17,e.i|=2,((e,t,s=!1)=>{const i=e.$hostElement$,n=e.C,r=e.R||U(null,null),o=(e=>e&&e.m===F)(t)?t:D(null,null,t);if(H=i.tagName,n.P&&(o.k=o.k||{},n.P.forEach((([e,t])=>{o.k[t]=i[e]}))),s&&o.k)for(const e of Object.keys(o.k))i.hasAttribute(e)&&!["key","ref","style","class"].includes(e)&&(o.k[e]=i[e]);o.m=null,o.i|=4,e.R=o,o.v=r.v=i.shadowRoot||i,se(r,o,s)})(e,t,i)}catch(t){r(t,e.$hostElement$)}return null},de=e=>{const t=e.$hostElement$,s=e.t,i=e.S;he(s,"componentDidRender",void 0,t),64&e.i?he(s,"componentDidUpdate",void 0,t):(e.i|=64,fe(t),he(s,"componentDidLoad",void 0,t),e.N(t),i||pe()),e.A(t),e.$&&(e.$(),e.$=void 0),512&e.i&&w((()=>oe(e,!1))),e.i&=-517},pe=()=>{w((()=>q(k,"appload",{detail:{namespace:"sekiui"}})))},he=(e,t,s,i)=>{if(e&&e[t])try{return e[t](s)}catch(e){r(e,i)}},fe=e=>e.classList.add("hydrated"),me=(e,t,i,n)=>{const o=s(e);if(!o)return;if(!o)throw Error(`Couldn't find host element for "${n.l}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`);const l=o.$hostElement$,a=o.D.get(t),u=o.i,c=o.t;if(i=L(i,n.U[t][0],!!(64&n.i)),(!(8&u)||void 0===a)&&i!==a&&(!Number.isNaN(a)||!Number.isNaN(i))&&(o.D.set(t,i),c)){if(n.F&&128&u){const e=n.F[t];e&&e.map((e=>{try{c[e](i,a,t)}catch(e){r(e,l)}}))}if(2==(18&u)){if(c.componentShouldUpdate&&!1===c.componentShouldUpdate(i,a,t))return;oe(o,!1)}}},be=(e,t,i)=>{var n,r;const o=e.prototype;64&t.i&&1&i&&c.forEach((e=>{Object.defineProperty(o,e,{value(...t){var i;const n=s(this),r=null==n?void 0:n.t;if(r){const s=r[e];"function"==typeof s&&s.call(r,...t)}else null==(i=null==n?void 0:n.W)||i.then((s=>{const i=s[e];"function"==typeof i&&i.call(s,...t)}))}})}));{e.watchers&&!t.F&&(t.F=e.watchers),e.deserializers&&!t.H&&(t.H=e.deserializers),e.serializers&&!t.L&&(t.L=e.serializers);const l=Object.entries(null!=(n=t.U)?n:{});if(l.map((([e,[n]])=>{if(31&n||2&i&&32&n){const{get:r,set:l}=Object.getOwnPropertyDescriptor(o,e)||{};r&&(t.U[e][0]|=2048),l&&(t.U[e][0]|=4096),(1&i||!r)&&Object.defineProperty(o,e,{get(){{if(!(2048&t.U[e][0]))return((e,t)=>s(this).D.get(t))(0,e);const i=s(this),n=i?i.t:o;if(!n)return;return n[e]}},configurable:!0,enumerable:!0}),Object.defineProperty(o,e,{set(r){const o=s(this);if(o){if(l)return void 0===(32&n?this[e]:o.$hostElement$[e])&&o.D.get(e)&&(r=o.D.get(e)),l.call(this,L(r,n,!!(64&t.i))),void me(this,e,r=32&n?this[e]:o.$hostElement$[e],t);{if(!(1&i&&4096&t.U[e][0]))return me(this,e,r,t),void(1&i&&!o.t&&o.O.push((()=>{4096&t.U[e][0]&&o.t[e]!==o.D.get(e)&&(o.t[e]=r)})));const s=()=>{const s=o.t[e];!o.D.get(e)&&s&&o.D.set(e,s),o.t[e]=L(r,n,!!(64&t.i)),me(this,e,o.t[e],t)};o.t?s():o.O.push((()=>{s()}))}}}})}else 1&i&&64&n&&Object.defineProperty(o,e,{value(...t){var i;const n=s(this);return null==(i=null==n?void 0:n.T)?void 0:i.then((()=>{var s;return null==(s=n.t)?void 0:s[e](...t)}))}})})),1&i){const i=new Map;o.attributeChangedCallback=function(e,n,r){d.jmp((()=>{var l;const a=i.get(e),u=s(this);if(this.hasOwnProperty(a)&&(r=this[a],delete this[a]),o.hasOwnProperty(a)&&"number"==typeof this[a]&&this[a]==r)return;if(null==a){const s=null==u?void 0:u.i;if(u&&s&&!(8&s)&&128&s&&r!==n){const s=u.t,i=null==(l=t.F)?void 0:l[e];null==i||i.forEach((t=>{null!=s[t]&&s[t].call(s,r,n,e)}))}return}const c=Object.getOwnPropertyDescriptor(o,a);(r=(null!==r||"boolean"!=typeof this[a])&&r)==this[a]||c.get&&!c.set||(this[a]=r)}))},e.observedAttributes=Array.from(new Set([...Object.keys(null!=(r=t.F)?r:{}),...l.filter((([e,t])=>31&t[0])).map((([e,s])=>{var n;const r=s[1]||e;return i.set(r,e),512&s[0]&&(null==(n=t.P)||n.push([e,r])),r}))]))}}return e},ve=(e,t)=>{he(e,"connectedCallback",void 0,t)},ge=(e,t)=>{he(e,"disconnectedCallback",void 0,t||e)},ye=(e,t={})=>{var i;if(!k.document)return void console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");const n=[],u=t.exclude||[],c=k.customElements,p=k.document.head,f=p.querySelector("meta[charset]"),m=k.document.createElement("style"),b=[];let v,g=!0;Object.assign(d,t),d.o=new URL(t.resourcesUrl||"./",k.document.baseURI).href;let y=!1;if(e.map((e=>{e[1].map((t=>{var i,a,k;const p={i:t[0],l:t[1],U:t[2],V:t[3]};4&p.i&&(y=!0),p.U=t[2],p.V=t[3],p.P=[],p.F=null!=(i=t[4])?i:{},p.L=null!=(a=t[5])?a:{},p.H=null!=(k=t[6])?k:{};const f=p.l,m=class extends HTMLElement{constructor(e){if(super(e),this.hasRegisteredEventListeners=!1,((e,t)=>{const s={i:0,$hostElement$:e,C:t,D:new Map,q:new Map};s.T=new Promise((e=>s.A=e)),s.W=new Promise((e=>s.N=e)),e["s-p"]=[],e["s-rc"]=[],s.O=[];const i=s;e.__stencil__getHostRef=()=>i})(e=this,p),1&p.i)if(e.shadowRoot){if("open"!==e.shadowRoot.mode)throw Error(`Unable to re-use existing shadow root for ${p.l}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else P.call(e,p)}connectedCallback(){const e=s(this);e&&(this.hasRegisteredEventListeners||(this.hasRegisteredEventListeners=!0,xe(this,e,p.V)),v&&(clearTimeout(v),v=null),g?b.push(this):d.jmp((()=>(e=>{if(!(1&d.i)){const t=s(e);if(!t)return;const i=t.C,n=()=>{};if(1&t.i)xe(e,t,i.V),(null==t?void 0:t.t)?ve(t.t,e):(null==t?void 0:t.W)&&t.W.then((()=>ve(t.t,e)));else{t.i|=1;{let s=e;for(;s=s.parentNode||s.host;)if(s["s-p"]){re(t,t.S=s);break}}i.U&&Object.entries(i.U).map((([t,[s]])=>{if(31&s&&t in e&&e[t]!==Object.prototype[t]){const s=e[t];delete e[t],e[t]=s}})),(async(e,t,s)=>{let i;if(!(32&t.i)){if(t.i|=32,s.I){const n=((e,t)=>{const s=e.l.replace(/-/g,"_"),i=e.I;if(!i)return;const n=o.get(i);return n?n[s]:import(`./${i}.entry.js`).then((e=>(o.set(i,e),e[s])),(e=>{r(e,t.$hostElement$)}))
2
- /*!__STENCIL_STATIC_IMPORT_SWITCH__*/})(s,t);if(n&&"then"in n){const e=()=>{};i=await n,e()}else i=n;if(!i)throw Error(`Constructor for "${s.l}#${t.B}" was not found`);i.isProxied||(s.F=i.watchers,s.L=i.serializers,s.H=i.deserializers,be(i,s,2),i.isProxied=!0);const l=()=>{};t.i|=8;try{new i(t)}catch(t){r(t,e)}t.i&=-9,t.i|=128,l(),ve(t.t,e)}else i=e.constructor,customElements.whenDefined(e.localName).then((()=>t.i|=128));if(i&&i.style){let e;"string"==typeof i.style&&(e=i.style);const t=A(s);if(!l.has(t)){const i=()=>{};((e,t,s)=>{let i=l.get(e);h&&s?(i=i||new CSSStyleSheet,"string"==typeof i?i=t:i.replaceSync(t)):i=t,l.set(e,i)})(t,e,!!(1&s.i)),i()}}}const n=t.S,a=()=>oe(t,!0);n&&n["s-rc"]?n["s-rc"].push(a):a()})(e,t,i)}n()}})(this))))}disconnectedCallback(){d.jmp((()=>(async e=>{if(!(1&d.i)){const t=s(e);(null==t?void 0:t.G)&&(t.G.map((e=>e())),t.G=void 0),(null==t?void 0:t.t)?ge(t.t,e):(null==t?void 0:t.W)&&t.W.then((()=>ge(t.t,e)))}N.has(e)&&N.delete(e),e.shadowRoot&&N.has(e.shadowRoot)&&N.delete(e.shadowRoot)})(this))),d.raf((()=>{var e;const t=s(this);if(!t)return;const i=b.findIndex((e=>e===this));i>-1&&b.splice(i,1),(null==(e=null==t?void 0:t.R)?void 0:e.v)instanceof Node&&!t.R.v.isConnected&&delete t.R.v}))}componentOnReady(){var e;return null==(e=s(this))?void 0:e.W}};64&p.i&&(m.formAssociated=!0),p.I=e[0],u.includes(f)||c.get(f)||(n.push(f),c.define(f,be(m,p,1)))}))})),n.length>0&&(y&&(m.textContent+=a),m.textContent+=n.sort()+"{visibility:hidden}.hydrated{visibility:inherit}",m.innerHTML.length)){m.setAttribute("data-styles","");const e=null!=(i=d.M)?i:j(k.document);null!=e&&m.setAttribute("nonce",e),p.insertBefore(m,f?f.nextSibling:p.firstChild)}g=!1,b.length?b.map((e=>e.connectedCallback())):d.jmp((()=>v=setTimeout(pe,30)))},xe=(e,t,s)=>{s&&k.document&&s.map((([s,i,n])=>{const r=e,o=we(t,n),l=$e(s);d.ael(r,i,o,l),(t.G=t.G||[]).push((()=>d.rel(r,i,o,l)))}))},we=(e,t)=>s=>{var i;try{256&e.i?null==(i=e.t)||i[t](s):(e.j=e.j||[]).push([t,s])}catch(t){r(t,e.$hostElement$)}},$e=e=>({passive:!!(1&e),capture:!!(2&e)}),Se=e=>d.M=e;export{F as H,T as a,ye as b,V as c,e as g,D as h,p,i as r,Se as s}