@sekiui/elements 0.0.88 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (87) hide show
  1. package/dist/cdn/p-CQQRfw1L.js +18 -0
  2. package/dist/cdn/seki-date-picker.js +71 -36
  3. package/dist/cdn/seki-drawer.js +76 -32
  4. package/dist/cdn/seki-hover-card.js +58 -3
  5. package/dist/cdn/seki-select-content.js +21 -13
  6. package/dist/cdn/seki-select-group.js +3 -4
  7. package/dist/cdn/seki-select-option.js +33 -15
  8. package/dist/cdn/seki-select-trigger.js +6 -4
  9. package/dist/cdn/seki-sheet.js +71 -30
  10. package/dist/cdn/seki-tooltip.js +47 -2
  11. package/dist/cjs/loader.cjs.js +1 -1
  12. package/dist/cjs/option-id-wIa73qWK.js +20 -0
  13. package/dist/cjs/seki-date-picker.cjs.entry.js +64 -32
  14. package/dist/cjs/seki-drawer.cjs.entry.js +67 -27
  15. package/dist/cjs/seki-hover-card.cjs.entry.js +52 -2
  16. package/dist/cjs/seki-select-content.cjs.entry.js +20 -11
  17. package/dist/cjs/seki-select-group.cjs.entry.js +2 -2
  18. package/dist/cjs/seki-select-option.cjs.entry.js +32 -13
  19. package/dist/cjs/seki-select-trigger.cjs.entry.js +5 -2
  20. package/dist/cjs/seki-sheet.cjs.entry.js +62 -25
  21. package/dist/cjs/seki-tooltip.cjs.entry.js +43 -2
  22. package/dist/cjs/sekiui.cjs.js +1 -1
  23. package/dist/collection/components/date-picker/seki-date-picker.js +124 -36
  24. package/dist/collection/components/drawer/seki-drawer.js +132 -31
  25. package/dist/collection/components/hover-card/seki-hover-card.js +138 -2
  26. package/dist/collection/components/select-content/seki-select-content.css +8 -0
  27. package/dist/collection/components/select-content/seki-select-content.js +20 -11
  28. package/dist/collection/components/select-group/seki-select-group.js +2 -2
  29. package/dist/collection/components/select-option/seki-select-option.js +32 -13
  30. package/dist/collection/components/select-trigger/seki-select-trigger.js +5 -2
  31. package/dist/collection/components/sheet/seki-sheet.js +127 -29
  32. package/dist/collection/components/tooltip/seki-tooltip.js +92 -2
  33. package/dist/collection/utils/select/index.js +1 -0
  34. package/dist/collection/utils/select/option-id.js +16 -0
  35. package/dist/components/p-CQQRfw1L.js +18 -0
  36. package/dist/components/seki-date-picker.js +71 -36
  37. package/dist/components/seki-drawer.js +76 -32
  38. package/dist/components/seki-hover-card.js +58 -3
  39. package/dist/components/seki-select-content.js +21 -13
  40. package/dist/components/seki-select-group.js +3 -4
  41. package/dist/components/seki-select-option.js +33 -15
  42. package/dist/components/seki-select-trigger.js +6 -4
  43. package/dist/components/seki-sheet.js +71 -30
  44. package/dist/components/seki-tooltip.js +47 -2
  45. package/dist/esm/loader.js +1 -1
  46. package/dist/esm/option-id-CQQRfw1L.js +18 -0
  47. package/dist/esm/seki-date-picker.entry.js +64 -32
  48. package/dist/esm/seki-drawer.entry.js +67 -27
  49. package/dist/esm/seki-hover-card.entry.js +52 -2
  50. package/dist/esm/seki-select-content.entry.js +20 -11
  51. package/dist/esm/seki-select-group.entry.js +2 -2
  52. package/dist/esm/seki-select-option.entry.js +32 -13
  53. package/dist/esm/seki-select-trigger.entry.js +5 -2
  54. package/dist/esm/seki-sheet.entry.js +62 -25
  55. package/dist/esm/seki-tooltip.entry.js +43 -2
  56. package/dist/esm/sekiui.js +1 -1
  57. package/dist/sekiui/p-05b33a61.entry.js +1 -0
  58. package/dist/sekiui/p-1cd6b3e6.entry.js +1 -0
  59. package/dist/sekiui/p-3de5878b.entry.js +1 -0
  60. package/dist/sekiui/p-649dbdf0.entry.js +1 -0
  61. package/dist/sekiui/p-CQQRfw1L.js +1 -0
  62. package/dist/sekiui/p-a2ae6d1b.entry.js +1 -0
  63. package/dist/sekiui/p-b82c2267.entry.js +1 -0
  64. package/dist/sekiui/p-c0f21b6a.entry.js +1 -0
  65. package/dist/sekiui/p-c3ef507f.entry.js +1 -0
  66. package/dist/sekiui/p-fe3e661d.entry.js +1 -0
  67. package/dist/sekiui/sekiui.esm.js +1 -1
  68. package/dist/types/components/date-picker/seki-date-picker.d.ts +21 -5
  69. package/dist/types/components/drawer/seki-drawer.d.ts +22 -6
  70. package/dist/types/components/hover-card/seki-hover-card.d.ts +21 -0
  71. package/dist/types/components/select-content/seki-select-content.d.ts +8 -5
  72. package/dist/types/components/select-option/seki-select-option.d.ts +6 -4
  73. package/dist/types/components/sheet/seki-sheet.d.ts +22 -6
  74. package/dist/types/components/tooltip/seki-tooltip.d.ts +13 -0
  75. package/dist/types/components.d.ts +132 -9
  76. package/dist/types/utils/select/index.d.ts +1 -0
  77. package/dist/types/utils/select/option-id.d.ts +14 -0
  78. package/package.json +1 -1
  79. package/dist/sekiui/p-1866201e.entry.js +0 -1
  80. package/dist/sekiui/p-2e18933c.entry.js +0 -1
  81. package/dist/sekiui/p-779764c0.entry.js +0 -1
  82. package/dist/sekiui/p-786c153b.entry.js +0 -1
  83. package/dist/sekiui/p-87bcbb66.entry.js +0 -1
  84. package/dist/sekiui/p-9abfa3a5.entry.js +0 -1
  85. package/dist/sekiui/p-ac7bd611.entry.js +0 -1
  86. package/dist/sekiui/p-c62c4ad7.entry.js +0 -1
  87. package/dist/sekiui/p-e45e6992.entry.js +0 -1
@@ -18,10 +18,19 @@ import { EventEmitter } from '../../stencil-public-runtime';
18
18
  */
19
19
  export declare class SekiDrawer {
20
20
  el: HTMLElement;
21
+ /**
22
+ * Controlled open state. Also readable/writable as the `open` attribute, so
23
+ * `<seki-drawer open>` renders open with no script involved.
24
+ */
25
+ open: boolean;
26
+ /**
27
+ * Initial open state for uncontrolled usage
28
+ */
29
+ defaultOpen: boolean;
21
30
  /**
22
31
  * Internal state for drawer open/closed
23
32
  */
24
- isOpen: boolean;
33
+ _isOpen: boolean;
25
34
  /**
26
35
  * Current snap point (0-1)
27
36
  */
@@ -40,24 +49,31 @@ export declare class SekiDrawer {
40
49
  drawerSnap: EventEmitter<{
41
50
  point: number;
42
51
  }>;
52
+ /**
53
+ * Emitted whenever the open state changes. Matches the dialog/popover/collapsible
54
+ * event shape so a consumer can listen to one event name across every overlay.
55
+ */
56
+ sekiOpenChange: EventEmitter<boolean>;
57
+ componentWillLoad(): void;
58
+ componentDidLoad(): void;
59
+ handleOpenPropChange(newValue: boolean): void;
43
60
  /**
44
61
  * Opens the drawer
45
62
  */
46
- open(): Promise<void>;
63
+ openDrawer(): Promise<void>;
47
64
  /**
48
65
  * Closes the drawer
49
66
  */
50
- close(): Promise<void>;
51
- private updateContext;
52
- componentDidLoad(): void;
67
+ closeDrawer(): Promise<void>;
53
68
  /**
54
69
  * Toggles the drawer
55
70
  */
56
- toggle(): Promise<void>;
71
+ toggleDrawer(): Promise<void>;
57
72
  /**
58
73
  * Snaps to a specific point (0-1)
59
74
  */
60
75
  snapTo(point: number): Promise<void>;
76
+ private updateContext;
61
77
  handleTriggerClick(): void;
62
78
  handleRequestClose(): void;
63
79
  handleRequestSnap(event: CustomEvent<{
@@ -76,10 +76,23 @@ export declare class SekiHoverCard {
76
76
  * @default false
77
77
  */
78
78
  disabled: boolean;
79
+ /**
80
+ * Controlled open state. Reflects to the `open` attribute, so
81
+ * `<seki-hover-card open>` renders open with no script involved.
82
+ * @default false
83
+ */
84
+ open: boolean;
85
+ /**
86
+ * Initial open state for uncontrolled usage
87
+ * @default false
88
+ */
89
+ defaultOpen: boolean;
79
90
  /**
80
91
  * Internal open state
81
92
  */
82
93
  _isOpen: boolean;
94
+ componentWillLoad(): void;
95
+ openChanged(newValue: boolean): void;
83
96
  disabledChanged(newValue: boolean): void;
84
97
  /**
85
98
  * Emitted when open state changes
@@ -112,6 +125,14 @@ export declare class SekiHoverCard {
112
125
  * Set the open state and emit change event
113
126
  */
114
127
  private setOpen;
128
+ /**
129
+ * Open the hover card immediately, skipping `openDelay`
130
+ */
131
+ openHoverCard(): Promise<void>;
132
+ /**
133
+ * Close the hover card immediately, skipping `closeDelay`
134
+ */
135
+ closeHoverCard(): Promise<void>;
115
136
  /**
116
137
  * Close the hover card immediately and focus the trigger
117
138
  */
@@ -15,11 +15,14 @@ export declare class SekiSelectContent {
15
15
  /**
16
16
  * Accessible name for the listbox.
17
17
  *
18
- * It cannot borrow the trigger's name via aria-labelledby: the trigger's
19
- * combobox and this listbox live in separate shadow roots, and IDREFs do not
20
- * resolve across tree scopes. So the name is mirrored down as a literal
21
- * string instead. An aria-labelledby on the <seki-select> host *can* be
22
- * resolved here, because the host and its label sit in the same tree.
18
+ * As of #300, seki-select-trigger and this listbox render in the same real
19
+ * DOM tree scope (scoped, non-shadow mode), so an aria-labelledby pointing
20
+ * back at the trigger's combobox would technically resolve now. Kept as a
21
+ * mirrored literal string anyway — simpler and more robust than a live
22
+ * cross-component id reference, and it avoids coupling this component's
23
+ * accessible name to the trigger's specific DOM shape. An aria-labelledby
24
+ * on the <seki-select> host *can* still be resolved here, because the host
25
+ * and its label sit in the same tree (unchanged).
23
26
  */
24
27
  private getAccessibleName;
25
28
  render(): any;
@@ -26,15 +26,17 @@ export declare class SekiSelectOption {
26
26
  connectedCallback(): void;
27
27
  disconnectedCallback(): void;
28
28
  /**
29
- * Refresh aria-selected/data-selected/data-focused directly on the shadow
30
- * DOM whenever the parent's value/focus state changes post-mount. This is
31
- * applied imperatively rather than through a Stencil @State bump + render()
29
+ * Refresh aria-selected/data-selected/data-focused directly on the
30
+ * rendered DOM whenever the parent's value/focus state changes post-mount.
31
+ * This is applied imperatively rather than through a Stencil @State bump +
32
+ * render()
32
33
  * — a component that reads a parent's state via closest() + an
33
34
  * addEventListener callback and relies on render() re-invoking to reflect
34
35
  * it is a confirmed-unreliable shape in this codebase (#244). Mutating the
35
- * shadow DOM directly here side-steps that entirely.
36
+ * DOM directly here side-steps that entirely.
36
37
  */
37
38
  private handleParentContextChange;
39
+ private refreshOptionId;
38
40
  private registerWithParent;
39
41
  private handleOptionClick;
40
42
  private handleOptionFocus;
@@ -19,10 +19,19 @@ import { EventEmitter } from '../../stencil-public-runtime';
19
19
  */
20
20
  export declare class SekiSheet {
21
21
  el: HTMLElement;
22
+ /**
23
+ * Controlled open state. Also readable/writable as the `open` attribute, so
24
+ * `<seki-sheet open>` renders open with no script involved.
25
+ */
26
+ open: boolean;
27
+ /**
28
+ * Initial open state for uncontrolled usage
29
+ */
30
+ defaultOpen: boolean;
22
31
  /**
23
32
  * Internal state for sheet open/closed
24
33
  */
25
- isOpen: boolean;
34
+ _isOpen: boolean;
26
35
  /**
27
36
  * Emitted when the sheet opens
28
37
  */
@@ -31,20 +40,27 @@ export declare class SekiSheet {
31
40
  * Emitted when the sheet closes
32
41
  */
33
42
  sheetClose: EventEmitter<void>;
43
+ /**
44
+ * Emitted whenever the open state changes. Matches the dialog/popover/collapsible
45
+ * event shape so a consumer can listen to one event name across every overlay.
46
+ */
47
+ sekiOpenChange: EventEmitter<boolean>;
48
+ componentWillLoad(): void;
49
+ componentDidLoad(): void;
50
+ handleOpenPropChange(newValue: boolean): void;
34
51
  /**
35
52
  * Opens the sheet
36
53
  */
37
- open(): Promise<void>;
54
+ openSheet(): Promise<void>;
38
55
  /**
39
56
  * Closes the sheet
40
57
  */
41
- close(): Promise<void>;
42
- private updateContext;
43
- componentDidLoad(): void;
58
+ closeSheet(): Promise<void>;
44
59
  /**
45
60
  * Toggles the sheet
46
61
  */
47
- toggle(): Promise<void>;
62
+ toggleSheet(): Promise<void>;
63
+ private updateContext;
48
64
  handleTriggerClick(): void;
49
65
  handleCloseSheet(): void;
50
66
  handleKeydown(ev: KeyboardEvent): void;
@@ -52,6 +52,17 @@ export declare class SekiTooltip {
52
52
  * @min 0
53
53
  */
54
54
  offset: number;
55
+ /**
56
+ * Controlled open state. Reflects to the `open` attribute, so
57
+ * `<seki-tooltip open>` renders visible with no script involved.
58
+ * @default false
59
+ */
60
+ open: boolean;
61
+ /**
62
+ * Initial open state for uncontrolled usage
63
+ * @default false
64
+ */
65
+ defaultOpen: boolean;
55
66
  /**
56
67
  * Internal state: whether tooltip is currently visible
57
68
  */
@@ -142,7 +153,9 @@ export declare class SekiTooltip {
142
153
  * Remove event listeners from trigger
143
154
  */
144
155
  private detachTriggerListeners;
156
+ componentWillLoad(): void;
145
157
  componentDidLoad(): void;
158
+ openChanged(newValue: boolean): void;
146
159
  connectedCallback(): void;
147
160
  disconnectedCallback(): void;
148
161
  render(): any;
@@ -1552,7 +1552,12 @@ export namespace Components {
1552
1552
  /**
1553
1553
  * Close the date picker popover
1554
1554
  */
1555
- "close": () => Promise<void>;
1555
+ "closeDatePicker": () => Promise<void>;
1556
+ /**
1557
+ * Initial open state for uncontrolled usage
1558
+ * @default false
1559
+ */
1560
+ "defaultOpen": boolean;
1556
1561
  /**
1557
1562
  * Whether the date picker is disabled
1558
1563
  * @default false
@@ -1580,10 +1585,15 @@ export namespace Components {
1580
1585
  * Form field name
1581
1586
  */
1582
1587
  "name"?: string;
1588
+ /**
1589
+ * Controlled open state of the popover. Also readable/writable as the `open` attribute, so `<seki-date-picker open>` renders open with no script involved.
1590
+ * @default false
1591
+ */
1592
+ "open": boolean;
1583
1593
  /**
1584
1594
  * Open the date picker popover
1585
1595
  */
1586
- "open": () => Promise<void>;
1596
+ "openDatePicker": () => Promise<void>;
1587
1597
  /**
1588
1598
  * Placeholder text when no date is selected
1589
1599
  * @default 'Pick a date'
@@ -1605,7 +1615,7 @@ export namespace Components {
1605
1615
  /**
1606
1616
  * Toggle the date picker popover
1607
1617
  */
1608
- "toggle": () => Promise<void>;
1618
+ "toggleDatePicker": () => Promise<void>;
1609
1619
  /**
1610
1620
  * Currently selected date (for single mode)
1611
1621
  */
@@ -1722,11 +1732,21 @@ export namespace Components {
1722
1732
  /**
1723
1733
  * Closes the drawer
1724
1734
  */
1725
- "close": () => Promise<void>;
1735
+ "closeDrawer": () => Promise<void>;
1736
+ /**
1737
+ * Initial open state for uncontrolled usage
1738
+ * @default false
1739
+ */
1740
+ "defaultOpen": boolean;
1741
+ /**
1742
+ * Controlled open state. Also readable/writable as the `open` attribute, so `<seki-drawer open>` renders open with no script involved.
1743
+ * @default false
1744
+ */
1745
+ "open": boolean;
1726
1746
  /**
1727
1747
  * Opens the drawer
1728
1748
  */
1729
- "open": () => Promise<void>;
1749
+ "openDrawer": () => Promise<void>;
1730
1750
  /**
1731
1751
  * Snaps to a specific point (0-1)
1732
1752
  */
@@ -1734,7 +1754,7 @@ export namespace Components {
1734
1754
  /**
1735
1755
  * Toggles the drawer
1736
1756
  */
1737
- "toggle": () => Promise<void>;
1757
+ "toggleDrawer": () => Promise<void>;
1738
1758
  }
1739
1759
  /**
1740
1760
  * seki-drawer-content: Container for drawer content with gesture support
@@ -2038,16 +2058,34 @@ export namespace Components {
2038
2058
  * @default 300
2039
2059
  */
2040
2060
  "closeDelay": number;
2061
+ /**
2062
+ * Close the hover card immediately, skipping `closeDelay`
2063
+ */
2064
+ "closeHoverCard": () => Promise<void>;
2065
+ /**
2066
+ * Initial open state for uncontrolled usage
2067
+ * @default false
2068
+ */
2069
+ "defaultOpen": boolean;
2041
2070
  /**
2042
2071
  * Disable hover card interactions
2043
2072
  * @default false
2044
2073
  */
2045
2074
  "disabled": boolean;
2075
+ /**
2076
+ * Controlled open state. Reflects to the `open` attribute, so `<seki-hover-card open>` renders open with no script involved.
2077
+ * @default false
2078
+ */
2079
+ "open": boolean;
2046
2080
  /**
2047
2081
  * Milliseconds to delay before opening the hover card
2048
2082
  * @default 200
2049
2083
  */
2050
2084
  "openDelay": number;
2085
+ /**
2086
+ * Open the hover card immediately, skipping `openDelay`
2087
+ */
2088
+ "openHoverCard": () => Promise<void>;
2051
2089
  /**
2052
2090
  * Preferred side for hover card content placement
2053
2091
  * @default 'bottom'
@@ -3541,15 +3579,25 @@ export namespace Components {
3541
3579
  /**
3542
3580
  * Closes the sheet
3543
3581
  */
3544
- "close": () => Promise<void>;
3582
+ "closeSheet": () => Promise<void>;
3583
+ /**
3584
+ * Initial open state for uncontrolled usage
3585
+ * @default false
3586
+ */
3587
+ "defaultOpen": boolean;
3588
+ /**
3589
+ * Controlled open state. Also readable/writable as the `open` attribute, so `<seki-sheet open>` renders open with no script involved.
3590
+ * @default false
3591
+ */
3592
+ "open": boolean;
3545
3593
  /**
3546
3594
  * Opens the sheet
3547
3595
  */
3548
- "open": () => Promise<void>;
3596
+ "openSheet": () => Promise<void>;
3549
3597
  /**
3550
3598
  * Toggles the sheet
3551
3599
  */
3552
- "toggle": () => Promise<void>;
3600
+ "toggleSheet": () => Promise<void>;
3553
3601
  }
3554
3602
  /**
3555
3603
  * seki-sheet-close: Close button for the sheet
@@ -4244,6 +4292,11 @@ export namespace Components {
4244
4292
  * ```
4245
4293
  */
4246
4294
  interface SekiTooltip {
4295
+ /**
4296
+ * Initial open state for uncontrolled usage
4297
+ * @default false
4298
+ */
4299
+ "defaultOpen": boolean;
4247
4300
  /**
4248
4301
  * Milliseconds to delay before showing tooltip on hover
4249
4302
  * @default 0
@@ -4267,6 +4320,11 @@ export namespace Components {
4267
4320
  * @min 0
4268
4321
  */
4269
4322
  "offset": number;
4323
+ /**
4324
+ * Controlled open state. Reflects to the `open` attribute, so `<seki-tooltip open>` renders visible with no script involved.
4325
+ * @default false
4326
+ */
4327
+ "open": boolean;
4270
4328
  /**
4271
4329
  * Show tooltip programmatically
4272
4330
  * @returns Promise resolves when tooltip is visible
@@ -5693,6 +5751,7 @@ declare global {
5693
5751
  "sekiChange": Date | DateRange1;
5694
5752
  "sekiOpen": void;
5695
5753
  "sekiClose": void;
5754
+ "sekiOpenChange": boolean;
5696
5755
  }
5697
5756
  /**
5698
5757
  * seki-date-picker: A date picker component with popover calendar
@@ -5867,6 +5926,7 @@ declare global {
5867
5926
  "drawerOpen": void;
5868
5927
  "drawerClose": void;
5869
5928
  "drawerSnap": { point: number };
5929
+ "sekiOpenChange": boolean;
5870
5930
  }
5871
5931
  /**
5872
5932
  * seki-drawer: Mobile-friendly drawer component with swipe gestures
@@ -7326,6 +7386,7 @@ declare global {
7326
7386
  interface HTMLSekiSheetElementEventMap {
7327
7387
  "sheetOpen": void;
7328
7388
  "sheetClose": void;
7389
+ "sekiOpenChange": boolean;
7329
7390
  }
7330
7391
  /**
7331
7392
  * seki-sheet: Root sheet component (slide-out panel)
@@ -9687,6 +9748,11 @@ declare namespace LocalJSX {
9687
9748
  * ARIA label for accessibility
9688
9749
  */
9689
9750
  "ariaLabel"?: string;
9751
+ /**
9752
+ * Initial open state for uncontrolled usage
9753
+ * @default false
9754
+ */
9755
+ "defaultOpen"?: boolean;
9690
9756
  /**
9691
9757
  * Whether the date picker is disabled
9692
9758
  * @default false
@@ -9726,6 +9792,15 @@ declare namespace LocalJSX {
9726
9792
  * Emitted when the popover opens
9727
9793
  */
9728
9794
  "onSekiOpen"?: (event: SekiDatePickerCustomEvent<void>) => void;
9795
+ /**
9796
+ * Emitted whenever the open state changes. Matches the dialog/popover/collapsible event shape so a consumer can listen to one event name across every overlay.
9797
+ */
9798
+ "onSekiOpenChange"?: (event: SekiDatePickerCustomEvent<boolean>) => void;
9799
+ /**
9800
+ * Controlled open state of the popover. Also readable/writable as the `open` attribute, so `<seki-date-picker open>` renders open with no script involved.
9801
+ * @default false
9802
+ */
9803
+ "open"?: boolean;
9729
9804
  /**
9730
9805
  * Placeholder text when no date is selected
9731
9806
  * @default 'Pick a date'
@@ -9857,6 +9932,11 @@ declare namespace LocalJSX {
9857
9932
  * </seki-drawer>
9858
9933
  */
9859
9934
  interface SekiDrawer {
9935
+ /**
9936
+ * Initial open state for uncontrolled usage
9937
+ * @default false
9938
+ */
9939
+ "defaultOpen"?: boolean;
9860
9940
  /**
9861
9941
  * Emitted when the drawer closes
9862
9942
  */
@@ -9869,6 +9949,15 @@ declare namespace LocalJSX {
9869
9949
  * Emitted when the drawer snaps to a point
9870
9950
  */
9871
9951
  "onDrawerSnap"?: (event: SekiDrawerCustomEvent<{ point: number }>) => void;
9952
+ /**
9953
+ * Emitted whenever the open state changes. Matches the dialog/popover/collapsible event shape so a consumer can listen to one event name across every overlay.
9954
+ */
9955
+ "onSekiOpenChange"?: (event: SekiDrawerCustomEvent<boolean>) => void;
9956
+ /**
9957
+ * Controlled open state. Also readable/writable as the `open` attribute, so `<seki-drawer open>` renders open with no script involved.
9958
+ * @default false
9959
+ */
9960
+ "open"?: boolean;
9872
9961
  }
9873
9962
  /**
9874
9963
  * seki-drawer-content: Container for drawer content with gesture support
@@ -10185,6 +10274,11 @@ declare namespace LocalJSX {
10185
10274
  * @default 300
10186
10275
  */
10187
10276
  "closeDelay"?: number;
10277
+ /**
10278
+ * Initial open state for uncontrolled usage
10279
+ * @default false
10280
+ */
10281
+ "defaultOpen"?: boolean;
10188
10282
  /**
10189
10283
  * Disable hover card interactions
10190
10284
  * @default false
@@ -10194,6 +10288,11 @@ declare namespace LocalJSX {
10194
10288
  * Emitted when open state changes
10195
10289
  */
10196
10290
  "onSekiOpenChange"?: (event: SekiHoverCardCustomEvent<{ open: boolean }>) => void;
10291
+ /**
10292
+ * Controlled open state. Reflects to the `open` attribute, so `<seki-hover-card open>` renders open with no script involved.
10293
+ * @default false
10294
+ */
10295
+ "open"?: boolean;
10197
10296
  /**
10198
10297
  * Milliseconds to delay before opening the hover card
10199
10298
  * @default 200
@@ -11755,6 +11854,15 @@ declare namespace LocalJSX {
11755
11854
  * </seki-sheet>
11756
11855
  */
11757
11856
  interface SekiSheet {
11857
+ /**
11858
+ * Initial open state for uncontrolled usage
11859
+ * @default false
11860
+ */
11861
+ "defaultOpen"?: boolean;
11862
+ /**
11863
+ * Emitted whenever the open state changes. Matches the dialog/popover/collapsible event shape so a consumer can listen to one event name across every overlay.
11864
+ */
11865
+ "onSekiOpenChange"?: (event: SekiSheetCustomEvent<boolean>) => void;
11758
11866
  /**
11759
11867
  * Emitted when the sheet closes
11760
11868
  */
@@ -11763,6 +11871,11 @@ declare namespace LocalJSX {
11763
11871
  * Emitted when the sheet opens
11764
11872
  */
11765
11873
  "onSheetOpen"?: (event: SekiSheetCustomEvent<void>) => void;
11874
+ /**
11875
+ * Controlled open state. Also readable/writable as the `open` attribute, so `<seki-sheet open>` renders open with no script involved.
11876
+ * @default false
11877
+ */
11878
+ "open"?: boolean;
11766
11879
  }
11767
11880
  /**
11768
11881
  * seki-sheet-close: Close button for the sheet
@@ -12517,6 +12630,11 @@ declare namespace LocalJSX {
12517
12630
  * ```
12518
12631
  */
12519
12632
  interface SekiTooltip {
12633
+ /**
12634
+ * Initial open state for uncontrolled usage
12635
+ * @default false
12636
+ */
12637
+ "defaultOpen"?: boolean;
12520
12638
  /**
12521
12639
  * Milliseconds to delay before showing tooltip on hover
12522
12640
  * @default 0
@@ -12547,6 +12665,11 @@ declare namespace LocalJSX {
12547
12665
  * Event emitted when tooltip becomes visible
12548
12666
  */
12549
12667
  "onShowTooltip"?: (event: SekiTooltipCustomEvent<TooltipShowDetail>) => void;
12668
+ /**
12669
+ * Controlled open state. Reflects to the `open` attribute, so `<seki-tooltip open>` renders visible with no script involved.
12670
+ * @default false
12671
+ */
12672
+ "open"?: boolean;
12550
12673
  /**
12551
12674
  * Preferred positioning side for tooltip 'auto' uses intelligent repositioning based on viewport space
12552
12675
  * @default 'auto'
@@ -4,3 +4,4 @@
4
4
  */
5
5
  export * from './types';
6
6
  export * from './select-context';
7
+ export * from './option-id';
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Deterministic, per-select-instance option id.
3
+ *
4
+ * seki-select's `contentId` (see `SelectContext.contentId` in
5
+ * `src/utils/select/types.ts`) is randomized once per `<seki-select>`
6
+ * instance. Prefixing the option id with it keeps ids collision-free across
7
+ * multiple `<seki-select>` instances on the same page that happen to share
8
+ * an option `value` — this only matters now that seki-select-option renders
9
+ * in scoped (non-shadow) mode and its `id` is a real, page-scoped DOM id
10
+ * assistive tech can actually resolve (see #300). Exported so both
11
+ * seki-select-option (which sets the id) and seki-select-trigger (which
12
+ * references it via aria-activedescendant) compute the exact same string.
13
+ */
14
+ export declare function buildOptionId(contentId: string, value: string | number): string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sekiui/elements",
3
- "version": "0.0.88",
3
+ "version": "0.1.0",
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",
@@ -1 +0,0 @@
1
- import{r as e,c as i,h as s,a as t}from"./p-BwKLEihM.js";import{s as r}from"./p-QPMexJR6.js";const o=class{constructor(s){e(this,s),this.showTooltip=i(this,"showTooltip"),this.hideTooltip=i(this,"hideTooltip"),this.positioned=i(this,"positioned"),this.delay=0,this.side="auto",this.disabled=!1,this.offset=8,this.isVisible=!1,this.currentPosition="top",this.showTimer=null,this.hideTimer=null,this.triggerEl=null,this.longPressTimer=null,this.touchStartX=0,this.touchStartY=0,this.hasLoaded=!1,this.onTriggerMouseEnter=()=>{this.disabled||(this.hideTimer&&(clearTimeout(this.hideTimer),this.hideTimer=null),this.showTimer&&clearTimeout(this.showTimer),this.showTimer=window.setTimeout((()=>{this.show()}),this.delay))},this.onTriggerMouseLeave=()=>{this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null),this.hideTimer&&clearTimeout(this.hideTimer),this.hideTimer=window.setTimeout((()=>{this.hide()}),100)},this.onTriggerFocus=()=>{this.disabled||(this.showTimer&&clearTimeout(this.showTimer),this.hideTimer&&clearTimeout(this.hideTimer),this.showTimer=null,this.hideTimer=null,this.show())},this.onTriggerBlur=()=>{this.showTimer&&clearTimeout(this.showTimer),this.hideTimer&&clearTimeout(this.hideTimer),this.showTimer=null,this.hideTimer=null,this.hide()},this.onTriggerTouchStart=e=>{!this.disabled&&e.touches[0]&&(this.touchStartX=e.touches[0].clientX,this.touchStartY=e.touches[0].clientY,this.longPressTimer&&clearTimeout(this.longPressTimer),this.longPressTimer=window.setTimeout((()=>{this.show()}),500))},this.onTriggerTouchMove=e=>{if(!e.touches[0]||!this.longPressTimer)return;const i=Math.abs(e.touches[0].clientX-this.touchStartX),s=Math.abs(e.touches[0].clientY-this.touchStartY);(i>10||s>10)&&(clearTimeout(this.longPressTimer),this.longPressTimer=null)},this.onTriggerTouchEnd=()=>{this.longPressTimer&&(clearTimeout(this.longPressTimer),this.longPressTimer=null)},this.onEscapeKey=e=>{if("Escape"===e.key&&this.isVisible){e.preventDefault(),this.hide();const i=this.el.querySelector('[slot="trigger"]');i&&i.focus()}}}async show(){this.disabled||(this.hideTimer&&(clearTimeout(this.hideTimer),this.hideTimer=null),this.isVisible=!0,this.calculatePosition(),this.showTooltip.emit({triggerEl:this.triggerEl||this.el}))}async hide(){this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null),this.isVisible=!1,this.hideTooltip.emit({reason:"blur"})}async updatePosition(){this.isVisible&&this.calculatePosition()}calculatePosition(){var e;const i=this.el.querySelector('[slot="trigger"]');if(!i)return;this.triggerEl=i;const s=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".tooltip");if(!s)return;const t=i.getBoundingClientRect(),r=s.getBoundingClientRect(),o=window.innerWidth,a=window.innerHeight,n={top:{x:t.left+t.width/2-r.width/2,y:t.top-r.height-this.offset},bottom:{x:t.left+t.width/2-r.width/2,y:t.top+t.height+this.offset},left:{x:t.left-r.width-this.offset,y:t.top+t.height/2-r.height/2},right:{x:t.left+t.width+this.offset,y:t.top+t.height/2-r.height/2}};for(const[e,i]of Object.entries(n))if(i.x>=8&&i.x+r.width<=o-8&&i.y>=8&&i.y+r.height<=a-8)return this.currentPosition=e,this.applyPosition(s,i),void this.positioned.emit({side:this.currentPosition,offset:this.offset});const k="auto"===this.side?"top":this.side,l=n[k]||n.top;this.currentPosition=k,l.x=Math.max(8,Math.min(l.x,o-r.width-8)),l.y=Math.max(8,Math.min(l.y,a-r.height-8)),this.applyPosition(s,l),this.positioned.emit({side:this.currentPosition,offset:this.offset})}applyPosition(e,i){e.style.position="fixed",e.style.left=`${i.x}px`,e.style.top=`${i.y}px`,e.style.zIndex="1000"}attachTriggerListeners(){const e=this.el.querySelector('[slot="trigger"]');if(!e)return;e.addEventListener("mouseenter",this.onTriggerMouseEnter),e.addEventListener("mouseleave",this.onTriggerMouseLeave),e.addEventListener("focus",this.onTriggerFocus),e.addEventListener("blur",this.onTriggerBlur),e.addEventListener("touchstart",this.onTriggerTouchStart),e.addEventListener("touchmove",this.onTriggerTouchMove),e.addEventListener("touchend",this.onTriggerTouchEnd),document.addEventListener("keydown",this.onEscapeKey);const i=this.el.querySelector('[slot="content"]');if(i){const s=i.id||`tooltip-${Math.random().toString(36).substr(2,9)}`;i.id=s,e.setAttribute("aria-describedby",s)}}detachTriggerListeners(){const e=this.el.querySelector('[slot="trigger"]');e&&(e.removeEventListener("mouseenter",this.onTriggerMouseEnter),e.removeEventListener("mouseleave",this.onTriggerMouseLeave),e.removeEventListener("focus",this.onTriggerFocus),e.removeEventListener("blur",this.onTriggerBlur),e.removeEventListener("touchstart",this.onTriggerTouchStart),e.removeEventListener("touchmove",this.onTriggerTouchMove),e.removeEventListener("touchend",this.onTriggerTouchEnd),document.removeEventListener("keydown",this.onEscapeKey))}componentDidLoad(){this.hasLoaded=!0,this.attachTriggerListeners()}connectedCallback(){r(this.el),this.hasLoaded&&this.attachTriggerListeners()}disconnectedCallback(){this.detachTriggerListeners(),this.showTimer&&clearTimeout(this.showTimer),this.hideTimer&&clearTimeout(this.hideTimer),this.longPressTimer&&clearTimeout(this.longPressTimer)}render(){return s("div",{key:"70d4c876ab2b64a306893b555301ed08e438fff7",class:"tooltip "+(this.isVisible?"tooltip--visible":""),role:"tooltip"},s("slot",{key:"6bcde89ad0903a7859e1717c45204416554bd78f",name:"content"}),s("div",{key:"481b96927ad6431e0415fce2695fc1c13011aa72",class:"tooltip-arrow"}))}get el(){return t(this)}};o.style=":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%);--seki-chart-1:hsl(12, 76%, 61%);--seki-chart-2:hsl(173, 58%, 39%);--seki-chart-3:hsl(197, 37%, 24%);--seki-chart-4:hsl(43, 74%, 66%);--seki-chart-5:hsl(27, 87%, 67%)}: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%, 42%);--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-primary-tint:hsl(0, 0%, 9%, 0.06);--seki-primary-tint-foreground:var(--seki-foreground);--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-destructive-bg:hsl(0, 86%, 97%);--seki-destructive-soft-foreground:hsl(0, 63%, 31%);--seki-success:hsl(142, 71%, 45%);--seki-success-foreground:hsl(142, 64%, 24%);--seki-success-bg:hsl(142, 76%, 97%);--seki-warning:hsl(38, 92%, 50%);--seki-warning-foreground:hsl(21, 77%, 27%);--seki-warning-bg:hsl(48, 96%, 96%);--seki-info:hsl(217, 91%, 60%);--seki-info-foreground:hsl(224, 64%, 33%);--seki-info-bg:hsl(214, 100%, 97%);--seki-ring:hsl(0, 0%, 3.9%);--seki-ring-shadow:hsl(0, 0%, 3.9%, 0.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-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-primary-tint:hsl(0, 0%, 98%, 0.1);--seki-primary-tint-foreground:var(--seki-foreground);--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-destructive-bg:rgba(239, 68, 68, 0.1);--seki-destructive-soft-foreground:hsl(0, 91%, 71%);--seki-success:hsl(142, 69%, 58%);--seki-success-foreground:hsl(142, 69%, 58%);--seki-success-bg:rgba(34, 197, 94, 0.1);--seki-warning:hsl(43, 96%, 56%);--seki-warning-foreground:hsl(43, 96%, 56%);--seki-warning-bg:rgba(245, 158, 11, 0.1);--seki-info:hsl(217, 92%, 68%);--seki-info-foreground:hsl(217, 92%, 68%);--seki-info-bg:rgba(59, 130, 246, 0.1);--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);--seki-input-ring-offset:2px;--seki-select-trigger-bg:var(--seki-background);--seki-select-trigger-border:1px solid var(--seki-border);--seki-select-trigger-bg-hover:var(--seki-muted);--seki-select-trigger-radius:var(--seki-radius-md);--seki-select-trigger-min-height:2.5rem;--seki-select-trigger-padding:0.5rem 0.75rem;--seki-select-trigger-gap:0.5rem;--seki-select-content-bg:var(--seki-popover);--seki-select-content-border:1px solid var(--seki-border);--seki-select-content-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1);--seki-select-content-radius:var(--seki-radius-md);--seki-select-content-padding:0.5rem 0;--seki-select-option-padding:0.5rem 0.75rem;--seki-select-option-gap:0.5rem;--seki-select-option-radius:var(--seki-radius-sm);--seki-select-option-bg-hover:var(--seki-muted);--seki-select-option-bg-selected:var(--seki-muted);--seki-select-group-label-padding:0.5rem 0.75rem;--seki-select-group-label-font-size:var(--seki-font-size-xs);--seki-select-group-label-font-weight:var(--seki-font-semibold);--seki-select-group-label-color:var(--seki-muted-foreground);--seki-select-group-separator:1px solid var(--seki-border)}: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);--seki-shadow-xl:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px 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-none:1;--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;--seki-radius-full:9999px;}:host{--seki-sidebar-width:16rem;--seki-sidebar-width-icon:3rem;--seki-sidebar-width-mobile:18rem;--seki-sidebar-background:hsl(0, 0%, 98%);--seki-sidebar-foreground:hsl(240, 5.3%, 26.1%);--seki-sidebar-primary:hsl(240, 5.9%, 10%);--seki-sidebar-primary-foreground:hsl(0, 0%, 98%);--seki-sidebar-accent:hsl(240, 4.8%, 95.9%);--seki-sidebar-accent-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-border:hsl(220, 13%, 91%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 3.8%, 46.1%);--seki-sidebar-menu-button-height:2rem;--seki-sidebar-menu-button-height-lg:3rem;--seki-sidebar-menu-button-padding:0.5rem;--seki-sidebar-menu-button-gap:0.5rem;--seki-sidebar-menu-button-radius:var(--seki-radius-md, 0.375rem);--seki-sidebar-menu-sub-padding-left:1.75rem;--seki-sidebar-menu-sub-border-width:1px;--seki-sidebar-group-padding:0.5rem;--seki-sidebar-group-label-height:2rem;--seki-sidebar-group-label-padding:0.5rem;--seki-sidebar-header-height:auto;--seki-sidebar-footer-height:auto;--seki-sidebar-header-padding:0.5rem;--seki-sidebar-footer-padding:0.5rem;--seki-sidebar-content-padding:0.5rem;--seki-sidebar-rail-width:1rem;--seki-sidebar-transition-duration:200ms;--seki-sidebar-transition-timing:ease-in-out;--seki-sidebar-mobile-breakpoint:768px;--seki-sidebar-overlay-bg:hsla(0, 0%, 0%, 0.8)}:host([data-theme='dark']){--seki-sidebar-background:hsl(240, 5.9%, 10%);--seki-sidebar-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-primary:hsl(0, 0%, 98%);--seki-sidebar-primary-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-accent:hsl(240, 3.7%, 15.9%);--seki-sidebar-accent-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-border:hsl(240, 3.7%, 15.9%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 5%, 64.9%)}:host{--seki-animation-fast:150ms;--seki-animation-normal:200ms;--seki-animation-slow:300ms;--seki-ease-in:cubic-bezier(0.4, 0, 1, 1);--seki-ease-out:cubic-bezier(0, 0, 0.2, 1);--seki-ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);--seki-accordion-content-height:auto}@keyframes seki-fade-in{from{opacity:0}to{opacity:1}}@keyframes seki-fade-out{from{opacity:1}to{opacity:0}}@keyframes seki-scale-in{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@keyframes seki-scale-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.95)}}@keyframes seki-slide-in-from-top{from{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-top{from{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes seki-slide-in-from-bottom{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-bottom{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes seki-slide-in-from-left{from{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-left{from{transform:translateX(0)}to{transform:translateX(-100%)}}@keyframes seki-slide-in-from-right{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-right{from{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes seki-accordion-down{from{height:0;opacity:0}to{height:var(--seki-accordion-content-height);opacity:1}}@keyframes seki-accordion-up{from{height:var(--seki-accordion-content-height);opacity:1}to{height:0;opacity:0}}@keyframes seki-zoom-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}@keyframes seki-zoom-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.96)}}@keyframes seki-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes seki-pulse{0%,100%{opacity:1}50%{opacity:0.5}}@keyframes seki-bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}}@keyframes seki-collapsible-open{from{height:0;overflow:hidden}to{height:var(--seki-collapsible-content-height, auto)}}@keyframes seki-collapsible-close{from{height:var(--seki-collapsible-content-height, auto)}to{height:0;overflow:hidden}}@keyframes seki-toast-slide-in-right{from{transform:translateX(calc(100% + 1rem))}to{transform:translateX(0)}}@keyframes seki-toast-slide-out-right{from{transform:translateX(0)}to{transform:translateX(calc(100% + 1rem))}}@keyframes seki-toast-swipe-out{from{transform:translateX(var(--seki-toast-swipe-end-x, 0))}to{transform:translateX(calc(100% + 1rem))}}.seki-animate-fade-in{animation:seki-fade-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-fade-out{animation:seki-fade-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-scale-in{animation:seki-scale-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-scale-out{animation:seki-scale-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-spin{animation:seki-spin 1s linear infinite}.seki-animate-pulse{animation:seki-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.seki-animate-bounce{animation:seki-bounce 1s infinite}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}}:host{display:contents;--tooltip-bg:var(--seki-background);--tooltip-text:var(--seki-foreground);--tooltip-padding:var(--seki-spacing-2) var(--seki-spacing-3);--tooltip-radius:var(--seki-radius-md);--tooltip-shadow:var(--seki-shadow-md);--tooltip-font-size:var(--seki-font-size-sm, 0.875rem);--tooltip-arrow-size:8px;--tooltip-transition-duration:200ms}@media (prefers-color-scheme: dark){:host{--tooltip-bg:#1a1a1a;--tooltip-text:#ffffff}}.tooltip{position:fixed;box-sizing:border-box;background-color:var(--tooltip-bg);color:var(--tooltip-text);padding:var(--tooltip-padding);border-radius:var(--tooltip-radius);box-shadow:var(--tooltip-shadow);font-family:var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);font-size:var(--tooltip-font-size);line-height:var(--seki-line-height-normal, 1.5);max-width:280px;word-wrap:break-word;z-index:1000;pointer-events:auto;opacity:0;transform:scale(0.95) translateY(-4px);transition:opacity var(--tooltip-transition-duration) ease-out,\n transform var(--tooltip-transition-duration) ease-out;visibility:hidden}.tooltip--visible{opacity:1;transform:scale(1) translateY(0);visibility:visible}.tooltip-arrow{position:absolute;width:var(--tooltip-arrow-size);height:var(--tooltip-arrow-size);background-color:var(--tooltip-bg);transform:rotate(45deg);pointer-events:none}.tooltip[data-side='top']{margin-bottom:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='top'] .tooltip-arrow{bottom:calc(var(--tooltip-arrow-size) / -2);left:50%;transform:translateX(-50%) rotate(45deg)}.tooltip[data-side='bottom']{margin-top:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='bottom'] .tooltip-arrow{top:calc(var(--tooltip-arrow-size) / -2);left:50%;transform:translateX(-50%) rotate(45deg)}.tooltip[data-side='left']{margin-right:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='left'] .tooltip-arrow{right:calc(var(--tooltip-arrow-size) / -2);top:50%;transform:translateY(-50%) rotate(45deg)}.tooltip[data-side='right']{margin-left:calc(var(--tooltip-arrow-size) / 2 + 4px)}.tooltip[data-side='right'] .tooltip-arrow{left:calc(var(--tooltip-arrow-size) / -2);top:50%;transform:translateY(-50%) rotate(45deg)}.tooltip:focus-visible{outline:2px solid var(--seki-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){.tooltip{transition:opacity 0s, transform 0s}}::slotted([slot='content']){margin:0;line-height:inherit;font-size:inherit}::slotted([slot='trigger']){cursor:help}";export{o as seki_tooltip}
@@ -1 +0,0 @@
1
- import{r as e,c as t,h as s,a as i}from"./p-BwKLEihM.js";import{s as o}from"./p-QPMexJR6.js";const a=class{constructor(s){e(this,s),this.sheetOpen=t(this,"sheetOpen"),this.sheetClose=t(this,"sheetClose"),this.isOpen=!1}async open(){this.isOpen=!0,this.updateContext(),this.sheetOpen.emit()}async close(){this.isOpen=!1,this.updateContext(),this.sheetClose.emit()}updateContext(){this.el._sheetContext={isOpen:this.isOpen}}componentDidLoad(){this.updateContext()}async toggle(){this.isOpen?await this.close():await this.open()}handleTriggerClick(){this.toggle()}handleCloseSheet(){this.close()}handleKeydown(e){this.isOpen&&"Escape"===e.key&&this.close()}connectedCallback(){o(this.el)}render(){return s("div",{key:"2cfec9307b44b6b51ce1414392b4c2463fc24c96",class:{"seki-sheet":!0,"seki-sheet--open":this.isOpen},part:"sheet"},s("slot",{key:"a8785aaf5f121ab236840527c54aefce477197d3"}),this.isOpen&&s("div",{key:"60727f47bb3426fded9d40202811d363e082c93e",class:"seki-sheet-overlay",part:"overlay",onClick:()=>this.close()}))}get el(){return i(this)}};a.style=":host{--seki-sheet-bg:var(--seki-background, hsl(0 0% 100%));--seki-sheet-border:var(--seki-border, hsl(240 5.9% 90%));--seki-sheet-text:var(--seki-foreground, hsl(240 10% 3.9%));--seki-sheet-text-muted:var(--seki-muted-foreground, hsl(240 3.8% 46.1%));--seki-sheet-overlay-bg:rgba(0, 0, 0, 0.5);--seki-sheet-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);--seki-sheet-font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);--seki-sheet-width:24rem;--seki-sheet-height:24rem;--seki-sheet-z-index:50;--seki-sheet-animation-duration:0.3s;display:contents}:host([data-theme='dark']){--seki-sheet-overlay-bg:rgba(0, 0, 0, 0.7)}.seki-sheet{display:contents}.seki-sheet-overlay{position:fixed;inset:0;background:var(--seki-sheet-overlay-bg);z-index:var(--seki-sheet-z-index);animation:fadeIn var(--seki-sheet-animation-duration) ease}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.seki-sheet-trigger{display:inline-flex;cursor:pointer}.seki-sheet-content{position:fixed;z-index:calc(var(--seki-sheet-z-index) + 1);background:var(--seki-sheet-bg);box-shadow:var(--seki-sheet-shadow);font-family:var(--seki-sheet-font-family);display:flex;flex-direction:column;overflow:auto}.seki-sheet-content--right{top:0;right:0;height:100%;width:var(--seki-sheet-width);max-width:100%;border-left:1px solid var(--seki-sheet-border);animation:slideInRight var(--seki-sheet-animation-duration) ease}@keyframes slideInRight{from{transform:translateX(100%)}to{transform:translateX(0)}}.seki-sheet-content--left{top:0;left:0;height:100%;width:var(--seki-sheet-width);max-width:100%;border-right:1px solid var(--seki-sheet-border);animation:slideInLeft var(--seki-sheet-animation-duration) ease}@keyframes slideInLeft{from{transform:translateX(-100%)}to{transform:translateX(0)}}.seki-sheet-content--top{top:0;left:0;right:0;width:100%;height:var(--seki-sheet-height);max-height:100%;border-bottom:1px solid var(--seki-sheet-border);animation:slideInTop var(--seki-sheet-animation-duration) ease}@keyframes slideInTop{from{transform:translateY(-100%)}to{transform:translateY(0)}}.seki-sheet-content--bottom{bottom:0;left:0;right:0;width:100%;height:var(--seki-sheet-height);max-height:100%;border-top:1px solid var(--seki-sheet-border);animation:slideInBottom var(--seki-sheet-animation-duration) ease}@keyframes slideInBottom{from{transform:translateY(100%)}to{transform:translateY(0)}}.seki-sheet-close-button{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;border:none;border-radius:var(--seki-radius-sm, 4px);background:transparent;color:var(--seki-sheet-text-muted);cursor:pointer;opacity:0.7;transition:opacity 0.15s ease}.seki-sheet-close-button:hover{opacity:1}.seki-sheet-close-button:focus-visible{outline:2px solid var(--seki-ring, hsl(240 5.9% 10%));outline-offset:2px}.seki-sheet-close-button svg{width:1rem;height:1rem}.seki-sheet-header{display:flex;flex-direction:column;gap:0.375rem;padding:1.5rem;padding-right:3rem;}.seki-sheet-title{margin:0;font-size:var(--seki-font-size-lg, 18px);font-weight:var(--seki-font-weight-semibold, 600);color:var(--seki-sheet-text);line-height:var(--seki-line-height-tight, 1.25)}.seki-sheet-description{margin:0;font-size:var(--seki-font-size-sm, 14px);color:var(--seki-sheet-text-muted);line-height:var(--seki-line-height-normal, 1.5)}.seki-sheet-footer{display:flex;flex-direction:column;gap:0.5rem;padding:1.5rem;margin-top:auto}@media (min-width: 640px){.seki-sheet-footer{flex-direction:row;justify-content:flex-end}}.seki-sheet-close{display:inline-flex;cursor:pointer}@media (prefers-reduced-motion: reduce){.seki-sheet-overlay,.seki-sheet-content--right,.seki-sheet-content--left,.seki-sheet-content--top,.seki-sheet-content--bottom,.seki-sheet-close-button{animation:none;transition:none}}";export{a as seki_sheet}