@vertz/ui-primitives 0.2.23 → 0.2.24

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 (188) hide show
  1. package/dist/shared/{chunk-pzx0vpq1.js → chunk-00fqgnq1.js} +6 -11
  2. package/dist/shared/chunk-1hm0mbke.js +258 -0
  3. package/dist/shared/{chunk-ww7k2azn.js → chunk-20kwns82.js} +5 -9
  4. package/dist/shared/chunk-3jack97k.js +509 -0
  5. package/dist/shared/{chunk-xs6gp369.js → chunk-455p0jbk.js} +3 -7
  6. package/dist/shared/chunk-4gyg71bn.js +178 -0
  7. package/dist/shared/chunk-4z006v1j.js +467 -0
  8. package/dist/shared/{chunk-b25npqer.js → chunk-585ysr70.js} +1 -1
  9. package/dist/shared/chunk-75pegjs7.js +26 -0
  10. package/dist/shared/{chunk-mr1tb0dp.js → chunk-7a2nqmeh.js} +1 -1
  11. package/dist/shared/chunk-7wem1bhb.js +252 -0
  12. package/dist/shared/{chunk-7cb3z0s8.js → chunk-8evj43jn.js} +5 -8
  13. package/dist/shared/chunk-8t0nm721.js +152 -0
  14. package/dist/shared/chunk-94twh4s4.js +28 -0
  15. package/dist/shared/chunk-98y1sw9y.js +398 -0
  16. package/dist/shared/chunk-9eedsnnk.js +164 -0
  17. package/dist/shared/{chunk-8c01c8mb.js → chunk-9hv3vc72.js} +0 -2
  18. package/dist/shared/chunk-aa3w85hn.js +321 -0
  19. package/dist/shared/chunk-axpbdpgx.js +177 -0
  20. package/dist/shared/chunk-b4zzg457.js +410 -0
  21. package/dist/shared/chunk-brk0drrk.js +202 -0
  22. package/dist/shared/chunk-czv0kqj4.js +107 -0
  23. package/dist/shared/chunk-d83ag07h.js +189 -0
  24. package/dist/shared/{chunk-3kwh27dv.js → chunk-de18ashk.js} +0 -1
  25. package/dist/shared/{chunk-cgb2j94g.js → chunk-dvk4h36t.js} +0 -1
  26. package/dist/shared/chunk-e6660g7e.js +179 -0
  27. package/dist/shared/{chunk-3h1mxp95.js → chunk-eq4d9b0w.js} +0 -1
  28. package/dist/shared/chunk-ev367pq3.js +102 -0
  29. package/dist/shared/{chunk-4894pmy6.js → chunk-f0wy7k56.js} +0 -1
  30. package/dist/shared/chunk-fjykbv0v.js +214 -0
  31. package/dist/shared/chunk-ghkw5bjq.js +55 -0
  32. package/dist/shared/chunk-gqb1n1hj.js +60 -0
  33. package/dist/shared/chunk-hfjtkytb.js +310 -0
  34. package/dist/shared/chunk-hpvjfj0j.js +31 -0
  35. package/dist/shared/chunk-hxmxvp56.js +67 -0
  36. package/dist/shared/chunk-j9m2f0rd.js +162 -0
  37. package/dist/shared/chunk-jpyjk616.js +52 -0
  38. package/dist/shared/{chunk-ttb2tt03.js → chunk-jsa3byag.js} +1 -1
  39. package/dist/shared/{chunk-9gfp3ffv.js → chunk-jzy1bkdk.js} +0 -1
  40. package/dist/shared/{chunk-f2vx4tpw.js → chunk-knzg86am.js} +5 -5
  41. package/dist/shared/chunk-kskxxc2q.js +228 -0
  42. package/dist/shared/chunk-metxdt5x.js +28 -0
  43. package/dist/shared/chunk-mhn2aazf.js +353 -0
  44. package/dist/shared/chunk-mtx2cfbx.js +175 -0
  45. package/dist/shared/chunk-nsmvdxgp.js +213 -0
  46. package/dist/shared/{chunk-pn6shbcs.js → chunk-pdzmg245.js} +1 -5
  47. package/dist/shared/chunk-pzknpa1y.js +327 -0
  48. package/dist/shared/chunk-q1ff3xp3.js +95 -0
  49. package/dist/shared/chunk-q7xbcj9q.js +7 -0
  50. package/dist/shared/{chunk-p0x7hgv6.js → chunk-qhnany7w.js} +0 -2
  51. package/dist/shared/chunk-qrm43tr3.js +357 -0
  52. package/dist/shared/{chunk-xa1b96mb.js → chunk-qsp7sfhp.js} +2 -2
  53. package/dist/shared/{chunk-j902w020.js → chunk-qwqnjjg8.js} +1 -1
  54. package/dist/shared/{chunk-h3v10x04.js → chunk-r0rz7z03.js} +6 -11
  55. package/dist/shared/chunk-r3ngaa64.js +418 -0
  56. package/dist/shared/chunk-r3pffzss.js +13 -0
  57. package/dist/shared/chunk-rrt62bp0.js +353 -0
  58. package/dist/shared/chunk-s24gkmna.js +131 -0
  59. package/dist/shared/chunk-s62e7jf4.js +30 -0
  60. package/dist/shared/chunk-spng4yb9.js +73 -0
  61. package/dist/shared/chunk-v0b5pkcq.js +30 -0
  62. package/dist/shared/chunk-v11kd39k.js +162 -0
  63. package/dist/shared/{chunk-0mcr52hc.js → chunk-vef3sepw.js} +17 -1
  64. package/dist/shared/chunk-vkscwzpr.js +294 -0
  65. package/dist/shared/chunk-vv187snj.js +112 -0
  66. package/dist/shared/chunk-wqsek87j.js +311 -0
  67. package/dist/shared/chunk-wtkxz2te.js +157 -0
  68. package/dist/shared/chunk-y1hpsqzy.js +185 -0
  69. package/dist/shared/chunk-yfzddvxc.js +71 -0
  70. package/dist/src/accordion/accordion-composed.d.ts +30 -0
  71. package/dist/src/accordion/accordion-composed.js +6 -0
  72. package/dist/src/accordion/accordion.js +1 -1
  73. package/dist/src/alert/alert-composed.d.ts +26 -0
  74. package/dist/src/alert/alert-composed.js +6 -0
  75. package/dist/src/alert-dialog/alert-dialog-composed.d.ts +40 -0
  76. package/dist/src/alert-dialog/alert-dialog-composed.js +6 -0
  77. package/dist/src/avatar/avatar-composed.d.ts +33 -0
  78. package/dist/src/avatar/avatar-composed.js +6 -0
  79. package/dist/src/badge/badge-composed.d.ts +33 -0
  80. package/dist/src/badge/badge-composed.js +6 -0
  81. package/dist/src/breadcrumb/breadcrumb-composed.d.ts +34 -0
  82. package/dist/src/breadcrumb/breadcrumb-composed.js +6 -0
  83. package/dist/src/button/button-composed.d.ts +34 -0
  84. package/dist/src/button/button-composed.js +6 -0
  85. package/dist/src/calendar/calendar-composed.d.ts +42 -0
  86. package/dist/src/calendar/calendar-composed.js +6 -0
  87. package/dist/src/calendar/calendar.js +1 -1
  88. package/dist/src/card/card-composed.d.ts +34 -0
  89. package/dist/src/card/card-composed.js +6 -0
  90. package/dist/src/carousel/carousel-composed.d.ts +32 -0
  91. package/dist/src/carousel/carousel-composed.js +6 -0
  92. package/dist/src/carousel/carousel.js +1 -1
  93. package/dist/src/checkbox/checkbox-composed.d.ts +18 -0
  94. package/dist/src/checkbox/checkbox-composed.js +6 -0
  95. package/dist/src/collapsible/collapsible-composed.d.ts +26 -0
  96. package/dist/src/collapsible/collapsible-composed.js +6 -0
  97. package/dist/src/combobox/combobox-composed.d.ts +30 -0
  98. package/dist/src/combobox/combobox-composed.js +6 -0
  99. package/dist/src/combobox/combobox.js +1 -1
  100. package/dist/src/command/command-composed.d.ts +67 -0
  101. package/dist/src/command/command-composed.js +6 -0
  102. package/dist/src/command/command.js +1 -1
  103. package/dist/src/composed/with-styles.d.ts +38 -0
  104. package/dist/src/composed/with-styles.js +6 -0
  105. package/dist/src/context-menu/context-menu-composed.d.ts +51 -0
  106. package/dist/src/context-menu/context-menu-composed.js +6 -0
  107. package/dist/src/context-menu/context-menu.js +1 -1
  108. package/dist/src/date-picker/date-picker-composed.d.ts +77 -0
  109. package/dist/src/date-picker/date-picker-composed.js +6 -0
  110. package/dist/src/date-picker/date-picker.js +1 -1
  111. package/dist/src/dialog/dialog-composed.d.ts +36 -0
  112. package/dist/src/dialog/dialog-composed.js +6 -0
  113. package/dist/src/dialog/dialog-stack-parts.d.ts +16 -0
  114. package/dist/src/dialog/dialog-stack-parts.js +18 -0
  115. package/dist/src/dropdown-menu/dropdown-menu-composed.d.ts +51 -0
  116. package/dist/src/dropdown-menu/dropdown-menu-composed.js +6 -0
  117. package/dist/src/dropdown-menu/dropdown-menu.js +1 -1
  118. package/dist/src/empty-state/empty-state-composed.d.ts +30 -0
  119. package/dist/src/empty-state/empty-state-composed.js +6 -0
  120. package/dist/src/form-group/form-group-composed.d.ts +24 -0
  121. package/dist/src/form-group/form-group-composed.js +6 -0
  122. package/dist/src/hover-card/hover-card-composed.d.ts +38 -0
  123. package/dist/src/hover-card/hover-card-composed.js +6 -0
  124. package/dist/src/hover-card/hover-card.js +1 -1
  125. package/dist/src/index.d.ts +1284 -817
  126. package/dist/src/index.js +78 -6566
  127. package/dist/src/input/input-composed.d.ts +35 -0
  128. package/dist/src/input/input-composed.js +6 -0
  129. package/dist/src/label/label-composed.d.ts +32 -0
  130. package/dist/src/label/label-composed.js +6 -0
  131. package/dist/src/menu/menu-composed.d.ts +51 -0
  132. package/dist/src/menu/menu-composed.js +6 -0
  133. package/dist/src/menu/menu.js +1 -1
  134. package/dist/src/menubar/menubar-composed.d.ts +56 -0
  135. package/dist/src/menubar/menubar-composed.js +6 -0
  136. package/dist/src/menubar/menubar.js +1 -1
  137. package/dist/src/navigation-menu/navigation-menu-composed.d.ts +56 -0
  138. package/dist/src/navigation-menu/navigation-menu-composed.js +6 -0
  139. package/dist/src/navigation-menu/navigation-menu.js +1 -1
  140. package/dist/src/pagination/pagination-composed.d.ts +30 -0
  141. package/dist/src/pagination/pagination-composed.js +6 -0
  142. package/dist/src/popover/popover-composed.d.ts +36 -0
  143. package/dist/src/popover/popover-composed.js +6 -0
  144. package/dist/src/popover/popover.js +1 -1
  145. package/dist/src/progress/progress-composed.d.ts +17 -0
  146. package/dist/src/progress/progress-composed.js +6 -0
  147. package/dist/src/radio/radio-composed.d.ts +24 -0
  148. package/dist/src/radio/radio-composed.js +6 -0
  149. package/dist/src/radio/radio.js +1 -1
  150. package/dist/src/resizable-panel/resizable-panel-composed.d.ts +33 -0
  151. package/dist/src/resizable-panel/resizable-panel-composed.js +6 -0
  152. package/dist/src/resizable-panel/resizable-panel.js +1 -1
  153. package/dist/src/scroll-area/scroll-area-composed.d.ts +17 -0
  154. package/dist/src/scroll-area/scroll-area-composed.js +6 -0
  155. package/dist/src/scroll-area/scroll-area.js +1 -1
  156. package/dist/src/select/select-composed.d.ts +53 -0
  157. package/dist/src/select/select-composed.js +6 -0
  158. package/dist/src/select/select.js +1 -1
  159. package/dist/src/separator/separator-composed.d.ts +32 -0
  160. package/dist/src/separator/separator-composed.js +6 -0
  161. package/dist/src/sheet/sheet-composed.d.ts +34 -0
  162. package/dist/src/sheet/sheet-composed.js +6 -0
  163. package/dist/src/skeleton/skeleton-composed.d.ts +65 -0
  164. package/dist/src/skeleton/skeleton-composed.js +6 -0
  165. package/dist/src/slider/slider-composed.d.ts +22 -0
  166. package/dist/src/slider/slider-composed.js +6 -0
  167. package/dist/src/switch/switch-composed.d.ts +17 -0
  168. package/dist/src/switch/switch-composed.js +6 -0
  169. package/dist/src/table/table-composed.d.ts +34 -0
  170. package/dist/src/table/table-composed.js +6 -0
  171. package/dist/src/tabs/tabs-composed.d.ts +33 -0
  172. package/dist/src/tabs/tabs-composed.js +6 -0
  173. package/dist/src/tabs/tabs.js +1 -1
  174. package/dist/src/textarea/textarea-composed.d.ts +35 -0
  175. package/dist/src/textarea/textarea-composed.js +6 -0
  176. package/dist/src/toast/toast.js +1 -1
  177. package/dist/src/toggle/toggle-composed.d.ts +16 -0
  178. package/dist/src/toggle/toggle-composed.js +6 -0
  179. package/dist/src/toggle-group/toggle-group-composed.d.ts +24 -0
  180. package/dist/src/toggle-group/toggle-group-composed.js +6 -0
  181. package/dist/src/toggle-group/toggle-group.js +1 -1
  182. package/dist/src/tooltip/tooltip-composed.d.ts +36 -0
  183. package/dist/src/tooltip/tooltip-composed.js +6 -0
  184. package/dist/src/tooltip/tooltip.js +1 -1
  185. package/dist/src/utils.js +1 -1
  186. package/package.json +3 -3
  187. package/dist/shared/chunk-56reyd5r.js +0 -64
  188. package/dist/shared/chunk-mgr904ap.js +0 -370
@@ -0,0 +1,214 @@
1
+ import {
2
+ cn
3
+ } from "./chunk-q7xbcj9q.js";
4
+
5
+ // src/scroll-area/scroll-area-composed.tsx
6
+ import { computed } from "@vertz/ui";
7
+ import { __append, __attr, __child, __conditional, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
8
+ import { ref } from "@vertz/ui";
9
+ function ComposedScrollAreaRoot(__props) {
10
+ const __mfDepth = __pushMountFrame();
11
+ try {
12
+ let syncThumbY = function() {
13
+ const vp = viewportRef.current;
14
+ const thumb = thumbYRef.current;
15
+ if (!vp || !thumb)
16
+ return;
17
+ const { scrollTop, scrollHeight, clientHeight } = vp;
18
+ if (scrollHeight <= clientHeight) {
19
+ thumb.style.height = "0";
20
+ return;
21
+ }
22
+ const ratio = clientHeight / scrollHeight;
23
+ thumb.style.height = `${ratio * 100}%`;
24
+ const scrollRatio = scrollTop / (scrollHeight - clientHeight);
25
+ thumb.style.transform = `translateY(${scrollRatio * (1 / ratio - 1) * 100}%)`;
26
+ }, syncThumbX = function() {
27
+ const vp = viewportRef.current;
28
+ const thumb = thumbXRef.current;
29
+ if (!vp || !thumb)
30
+ return;
31
+ const { scrollLeft, scrollWidth, clientWidth } = vp;
32
+ if (scrollWidth <= clientWidth) {
33
+ thumb.style.width = "0";
34
+ return;
35
+ }
36
+ const ratio = clientWidth / scrollWidth;
37
+ thumb.style.width = `${ratio * 100}%`;
38
+ const scrollRatio = scrollLeft / (scrollWidth - clientWidth);
39
+ thumb.style.transform = `translateX(${scrollRatio * (1 / ratio - 1) * 100}%)`;
40
+ }, handleViewportScroll = function() {
41
+ if ((__props.orientation ?? "vertical") === "vertical" || (__props.orientation ?? "vertical") === "both")
42
+ syncThumbY();
43
+ if ((__props.orientation ?? "vertical") === "horizontal" || (__props.orientation ?? "vertical") === "both")
44
+ syncThumbX();
45
+ }, handleThumbYDown = function(e) {
46
+ const vp = viewportRef.current;
47
+ const thumb = thumbYRef.current;
48
+ if (!vp || !thumb)
49
+ return;
50
+ isDraggingY = true;
51
+ startY = e.clientY;
52
+ startScrollTop = vp.scrollTop;
53
+ thumb.setPointerCapture(e.pointerId);
54
+ e.preventDefault();
55
+ }, handleThumbYMove = function(e) {
56
+ if (!isDraggingY)
57
+ return;
58
+ const vp = viewportRef.current;
59
+ const scrollbar = scrollbarYRef.current;
60
+ if (!vp || !scrollbar)
61
+ return;
62
+ const delta = e.clientY - startY;
63
+ const scrollbarHeight = scrollbar.clientHeight;
64
+ const scrollRange = vp.scrollHeight - vp.clientHeight;
65
+ if (scrollbarHeight > 0) {
66
+ vp.scrollTop = startScrollTop + delta / scrollbarHeight * scrollRange;
67
+ }
68
+ }, handleThumbYUp = function(e) {
69
+ isDraggingY = false;
70
+ const thumb = thumbYRef.current;
71
+ if (thumb)
72
+ thumb.releasePointerCapture(e.pointerId);
73
+ }, handleThumbXDown = function(e) {
74
+ const vp = viewportRef.current;
75
+ const thumb = thumbXRef.current;
76
+ if (!vp || !thumb)
77
+ return;
78
+ isDraggingX = true;
79
+ startX = e.clientX;
80
+ startScrollLeft = vp.scrollLeft;
81
+ thumb.setPointerCapture(e.pointerId);
82
+ e.preventDefault();
83
+ }, handleThumbXMove = function(e) {
84
+ if (!isDraggingX)
85
+ return;
86
+ const vp = viewportRef.current;
87
+ const scrollbar = scrollbarXRef.current;
88
+ if (!vp || !scrollbar)
89
+ return;
90
+ const delta = e.clientX - startX;
91
+ const scrollbarWidth = scrollbar.clientWidth;
92
+ const scrollRange = vp.scrollWidth - vp.clientWidth;
93
+ if (scrollbarWidth > 0) {
94
+ vp.scrollLeft = startScrollLeft + delta / scrollbarWidth * scrollRange;
95
+ }
96
+ }, handleThumbXUp = function(e) {
97
+ isDraggingX = false;
98
+ const thumb = thumbXRef.current;
99
+ if (thumb)
100
+ thumb.releasePointerCapture(e.pointerId);
101
+ };
102
+ const viewportRef = ref();
103
+ const scrollbarYRef = ref();
104
+ const scrollbarXRef = ref();
105
+ const thumbYRef = ref();
106
+ const thumbXRef = ref();
107
+ let isDraggingY = false;
108
+ let startY = 0;
109
+ let startScrollTop = 0;
110
+ let isDraggingX = false;
111
+ let startX = 0;
112
+ let startScrollLeft = 0;
113
+ const showY = computed(() => (__props.orientation ?? "vertical") === "vertical" || (__props.orientation ?? "vertical") === "both");
114
+ const showX = computed(() => (__props.orientation ?? "vertical") === "horizontal" || (__props.orientation ?? "vertical") === "both");
115
+ queueMicrotask(() => handleViewportScroll());
116
+ const __mfResult0 = (() => {
117
+ const __el0 = __element("div");
118
+ __el0.setAttribute("data-v-id", "ComposedScrollAreaRoot");
119
+ __el0.setAttribute("data-part", "scroll-area");
120
+ {
121
+ const __v = { position: "relative", overflow: "hidden" };
122
+ if (__v != null && __v !== false)
123
+ __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
124
+ }
125
+ __attr(__el0, "class", () => cn(__props.classes?.root));
126
+ __enterChildren(__el0);
127
+ __append(__el0, (() => {
128
+ const __el1 = __element("div");
129
+ viewportRef.current = __el1;
130
+ __el1.setAttribute("data-part", "scroll-area-viewport");
131
+ {
132
+ const __v = { overflow: "scroll", scrollbarWidth: "none" };
133
+ if (__v != null && __v !== false)
134
+ __el1.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
135
+ }
136
+ __attr(__el1, "class", () => cn(__props.classes?.viewport));
137
+ __on(__el1, "scroll", handleViewportScroll);
138
+ __enterChildren(__el1);
139
+ __append(__el1, (() => {
140
+ const __el2 = __element("div");
141
+ __el2.setAttribute("data-part", "scroll-area-content");
142
+ __enterChildren(__el2);
143
+ __append(__el2, __child(() => __props.children));
144
+ __exitChildren();
145
+ return __el2;
146
+ })());
147
+ __exitChildren();
148
+ return __el1;
149
+ })());
150
+ __append(__el0, __conditional(() => showY.value, () => (() => {
151
+ const __el3 = __element("div");
152
+ scrollbarYRef.current = __el3;
153
+ __el3.setAttribute("data-part", "scroll-area-scrollbar");
154
+ __el3.setAttribute("aria-hidden", "true");
155
+ __el3.setAttribute("data-orientation", "vertical");
156
+ {
157
+ const __v = { position: "absolute", top: "0", right: "0", bottom: "0" };
158
+ if (__v != null && __v !== false)
159
+ __el3.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
160
+ }
161
+ __attr(__el3, "class", () => cn(__props.classes?.scrollbar));
162
+ __enterChildren(__el3);
163
+ __append(__el3, (() => {
164
+ const __el4 = __element("div");
165
+ thumbYRef.current = __el4;
166
+ __el4.setAttribute("data-part", "scroll-area-thumb");
167
+ __attr(__el4, "class", () => cn(__props.classes?.thumb));
168
+ __on(__el4, "pointerdown", handleThumbYDown);
169
+ __on(__el4, "pointermove", handleThumbYMove);
170
+ __on(__el4, "pointerup", handleThumbYUp);
171
+ return __el4;
172
+ })());
173
+ __exitChildren();
174
+ return __el3;
175
+ })(), () => null));
176
+ __append(__el0, __conditional(() => showX.value, () => (() => {
177
+ const __el5 = __element("div");
178
+ scrollbarXRef.current = __el5;
179
+ __el5.setAttribute("data-part", "scroll-area-scrollbar");
180
+ __el5.setAttribute("aria-hidden", "true");
181
+ __el5.setAttribute("data-orientation", "horizontal");
182
+ {
183
+ const __v = { position: "absolute", bottom: "0", left: "0", right: "0" };
184
+ if (__v != null && __v !== false)
185
+ __el5.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
186
+ }
187
+ __attr(__el5, "class", () => cn(__props.classes?.scrollbar));
188
+ __enterChildren(__el5);
189
+ __append(__el5, (() => {
190
+ const __el6 = __element("div");
191
+ thumbXRef.current = __el6;
192
+ __el6.setAttribute("data-part", "scroll-area-thumb");
193
+ __attr(__el6, "class", () => cn(__props.classes?.thumb));
194
+ __on(__el6, "pointerdown", handleThumbXDown);
195
+ __on(__el6, "pointermove", handleThumbXMove);
196
+ __on(__el6, "pointerup", handleThumbXUp);
197
+ return __el6;
198
+ })());
199
+ __exitChildren();
200
+ return __el5;
201
+ })(), () => null));
202
+ __exitChildren();
203
+ return __el0;
204
+ })();
205
+ __flushMountFrame();
206
+ return __mfResult0;
207
+ } catch (__mfErr) {
208
+ __discardMountFrame(__mfDepth);
209
+ throw __mfErr;
210
+ }
211
+ }
212
+ var ComposedScrollArea = ComposedScrollAreaRoot;
213
+
214
+ export { ComposedScrollArea };
@@ -0,0 +1,55 @@
1
+ import {
2
+ cn
3
+ } from "./chunk-q7xbcj9q.js";
4
+ import {
5
+ uniqueId
6
+ } from "./chunk-8y1jf6xr.js";
7
+
8
+ // src/progress/progress-composed.tsx
9
+ import { computed } from "@vertz/ui";
10
+ import { __append, __attr, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __pushMountFrame } from "@vertz/ui/internals";
11
+ function dataStateFor(pct) {
12
+ if (pct >= 100)
13
+ return "complete";
14
+ if (pct > 0)
15
+ return "loading";
16
+ return "idle";
17
+ }
18
+ function ComposedProgressRoot(__props) {
19
+ const __mfDepth = __pushMountFrame();
20
+ try {
21
+ const pct = computed(() => ((__props.defaultValue ?? 0) - (__props.min ?? 0)) / ((__props.max ?? 100) - (__props.min ?? 0)) * 100);
22
+ const __mfResult0 = (() => {
23
+ const __el0 = __element("div");
24
+ __el0.setAttribute("role", "progressbar");
25
+ {
26
+ const __v = uniqueId("progress");
27
+ if (__v != null && __v !== false)
28
+ __el0.setAttribute("id", __v === true ? "" : __v);
29
+ }
30
+ __attr(__el0, "aria-valuenow", () => String(__props.defaultValue ?? 0));
31
+ __attr(__el0, "aria-valuemin", () => String(__props.min ?? 0));
32
+ __attr(__el0, "aria-valuemax", () => String(__props.max ?? 100));
33
+ __attr(__el0, "data-state", () => dataStateFor(pct.value));
34
+ __attr(__el0, "class", () => cn(__props.classes?.root));
35
+ __enterChildren(__el0);
36
+ __append(__el0, (() => {
37
+ const __el1 = __element("div");
38
+ __el1.setAttribute("data-part", "indicator");
39
+ __attr(__el1, "style", () => ({ width: `${pct.value}%` }));
40
+ __attr(__el1, "class", () => cn(__props.classes?.indicator));
41
+ return __el1;
42
+ })());
43
+ __exitChildren();
44
+ return __el0;
45
+ })();
46
+ __flushMountFrame();
47
+ return __mfResult0;
48
+ } catch (__mfErr) {
49
+ __discardMountFrame(__mfDepth);
50
+ throw __mfErr;
51
+ }
52
+ }
53
+ var ComposedProgress = ComposedProgressRoot;
54
+
55
+ export { ComposedProgress };
@@ -0,0 +1,60 @@
1
+ import {
2
+ cn
3
+ } from "./chunk-q7xbcj9q.js";
4
+ import {
5
+ Keys,
6
+ isKey
7
+ } from "./chunk-7867pr13.js";
8
+ import {
9
+ uniqueId
10
+ } from "./chunk-8y1jf6xr.js";
11
+
12
+ // src/toggle/toggle-composed.tsx
13
+ import { signal } from "@vertz/ui";
14
+ import { __append, __attr, __child, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __on, __pushMountFrame } from "@vertz/ui/internals";
15
+ function ComposedToggleRoot(__props) {
16
+ const __mfDepth = __pushMountFrame();
17
+ try {
18
+ let toggle = function() {
19
+ if (__props.disabled ?? false)
20
+ return;
21
+ pressed.value = !pressed.value;
22
+ __props.onPressedChange?.(pressed.value);
23
+ };
24
+ const pressed = signal(__props.defaultPressed ?? false, "pressed");
25
+ const __mfResult0 = (() => {
26
+ const __el0 = __element("button");
27
+ __el0.setAttribute("data-v-id", "ComposedToggleRoot");
28
+ __el0.setAttribute("type", "button");
29
+ {
30
+ const __v = uniqueId("toggle");
31
+ if (__v != null && __v !== false)
32
+ __el0.setAttribute("id", __v === true ? "" : __v);
33
+ }
34
+ __attr(__el0, "aria-pressed", () => pressed.value ? "true" : "false");
35
+ __attr(__el0, "data-state", () => pressed.value ? "on" : "off");
36
+ __attr(__el0, "disabled", () => __props.disabled ?? false);
37
+ __attr(__el0, "aria-disabled", () => __props.disabled ?? false ? "true" : undefined);
38
+ __attr(__el0, "class", () => cn(__props.classes?.root));
39
+ __on(__el0, "click", toggle);
40
+ __on(__el0, "keydown", (e) => {
41
+ if (isKey(e, Keys.Space)) {
42
+ e.preventDefault();
43
+ toggle();
44
+ }
45
+ });
46
+ __enterChildren(__el0);
47
+ __append(__el0, __child(() => __props.children));
48
+ __exitChildren();
49
+ return __el0;
50
+ })();
51
+ __flushMountFrame();
52
+ return __mfResult0;
53
+ } catch (__mfErr) {
54
+ __discardMountFrame(__mfDepth);
55
+ throw __mfErr;
56
+ }
57
+ }
58
+ var ComposedToggle = ComposedToggleRoot;
59
+
60
+ export { ComposedToggle };
@@ -0,0 +1,310 @@
1
+ import {
2
+ cn
3
+ } from "./chunk-q7xbcj9q.js";
4
+ import {
5
+ linkedIds
6
+ } from "./chunk-8y1jf6xr.js";
7
+
8
+ // src/alert-dialog/alert-dialog-composed.tsx
9
+ import { signal } from "@vertz/ui";
10
+ import { __append, __attr, __child, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
11
+ import { createContext, ref, useContext } from "@vertz/ui";
12
+ var AlertDialogContext = createContext(undefined, "@vertz/ui-primitives::AlertDialogContext");
13
+ function useAlertDialogContext(componentName) {
14
+ const ctx = useContext(AlertDialogContext);
15
+ if (!ctx) {
16
+ throw new Error(`<AlertDialog.${componentName}> must be used inside <AlertDialog>. ` + "Ensure it is a direct or nested child of the AlertDialog root component.");
17
+ }
18
+ return ctx;
19
+ }
20
+ function AlertDialogTrigger(__props) {
21
+ const __mfDepth = __pushMountFrame();
22
+ try {
23
+ const ctx = useAlertDialogContext("Trigger");
24
+ const __mfResult0 = (() => {
25
+ const __el0 = __element("span");
26
+ {
27
+ const __v = { display: "contents" };
28
+ if (__v != null && __v !== false)
29
+ __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
30
+ }
31
+ __el0.setAttribute("data-alertdialog-trigger", "");
32
+ __el0.setAttribute("data-state", "closed");
33
+ __on(__el0, "click", () => {
34
+ if (!ctx.isOpen)
35
+ ctx.open();
36
+ });
37
+ __enterChildren(__el0);
38
+ __append(__el0, __child(() => __props.children));
39
+ __exitChildren();
40
+ return __el0;
41
+ })();
42
+ __flushMountFrame();
43
+ return __mfResult0;
44
+ } catch (__mfErr) {
45
+ __discardMountFrame(__mfDepth);
46
+ throw __mfErr;
47
+ }
48
+ }
49
+ function AlertDialogContent(__props) {
50
+ const __mfDepth = __pushMountFrame();
51
+ try {
52
+ const ctx = useAlertDialogContext("Content");
53
+ const __mfResult0 = (() => {
54
+ const __el0 = __element("dialog");
55
+ ctx.dialogRef.current = __el0;
56
+ {
57
+ const __v = ctx.contentId;
58
+ if (__v != null && __v !== false)
59
+ __el0.setAttribute("id", __v === true ? "" : __v);
60
+ }
61
+ __el0.setAttribute("role", "alertdialog");
62
+ {
63
+ const __v = ctx.titleId;
64
+ if (__v != null && __v !== false)
65
+ __el0.setAttribute("aria-labelledby", __v === true ? "" : __v);
66
+ }
67
+ {
68
+ const __v = ctx.descriptionId;
69
+ if (__v != null && __v !== false)
70
+ __el0.setAttribute("aria-describedby", __v === true ? "" : __v);
71
+ }
72
+ __el0.setAttribute("data-state", "closed");
73
+ __attr(__el0, "class", () => cn(ctx.classes?.content, __props.className ?? __props.class));
74
+ __on(__el0, "cancel", (e) => {
75
+ e.preventDefault();
76
+ });
77
+ __enterChildren(__el0);
78
+ __append(__el0, __child(() => __props.children));
79
+ __exitChildren();
80
+ return __el0;
81
+ })();
82
+ __flushMountFrame();
83
+ return __mfResult0;
84
+ } catch (__mfErr) {
85
+ __discardMountFrame(__mfDepth);
86
+ throw __mfErr;
87
+ }
88
+ }
89
+ function AlertDialogTitle(__props) {
90
+ const __mfDepth = __pushMountFrame();
91
+ try {
92
+ const ctx = useAlertDialogContext("Title");
93
+ const __mfResult0 = (() => {
94
+ const __el0 = __element("h2");
95
+ {
96
+ const __v = ctx.titleId;
97
+ if (__v != null && __v !== false)
98
+ __el0.setAttribute("id", __v === true ? "" : __v);
99
+ }
100
+ __el0.setAttribute("data-slot", "alertdialog-title");
101
+ __attr(__el0, "class", () => cn(ctx.classes?.title, __props.className ?? __props.class));
102
+ __enterChildren(__el0);
103
+ __append(__el0, __child(() => __props.children));
104
+ __exitChildren();
105
+ return __el0;
106
+ })();
107
+ __flushMountFrame();
108
+ return __mfResult0;
109
+ } catch (__mfErr) {
110
+ __discardMountFrame(__mfDepth);
111
+ throw __mfErr;
112
+ }
113
+ }
114
+ function AlertDialogDescription(__props) {
115
+ const __mfDepth = __pushMountFrame();
116
+ try {
117
+ const ctx = useAlertDialogContext("Description");
118
+ const __mfResult0 = (() => {
119
+ const __el0 = __element("p");
120
+ {
121
+ const __v = ctx.descriptionId;
122
+ if (__v != null && __v !== false)
123
+ __el0.setAttribute("id", __v === true ? "" : __v);
124
+ }
125
+ __el0.setAttribute("data-slot", "alertdialog-description");
126
+ __attr(__el0, "class", () => cn(ctx.classes?.description, __props.className ?? __props.class));
127
+ __enterChildren(__el0);
128
+ __append(__el0, __child(() => __props.children));
129
+ __exitChildren();
130
+ return __el0;
131
+ })();
132
+ __flushMountFrame();
133
+ return __mfResult0;
134
+ } catch (__mfErr) {
135
+ __discardMountFrame(__mfDepth);
136
+ throw __mfErr;
137
+ }
138
+ }
139
+ function AlertDialogHeader(__props) {
140
+ const __mfDepth = __pushMountFrame();
141
+ try {
142
+ const { classes } = useAlertDialogContext("Header");
143
+ const __mfResult0 = (() => {
144
+ const __el0 = __element("div");
145
+ __attr(__el0, "class", () => cn(classes?.header, __props.className ?? __props.class));
146
+ __enterChildren(__el0);
147
+ __append(__el0, __child(() => __props.children));
148
+ __exitChildren();
149
+ return __el0;
150
+ })();
151
+ __flushMountFrame();
152
+ return __mfResult0;
153
+ } catch (__mfErr) {
154
+ __discardMountFrame(__mfDepth);
155
+ throw __mfErr;
156
+ }
157
+ }
158
+ function AlertDialogFooter(__props) {
159
+ const __mfDepth = __pushMountFrame();
160
+ try {
161
+ const { classes } = useAlertDialogContext("Footer");
162
+ const __mfResult0 = (() => {
163
+ const __el0 = __element("div");
164
+ __attr(__el0, "class", () => cn(classes?.footer, __props.className ?? __props.class));
165
+ __enterChildren(__el0);
166
+ __append(__el0, __child(() => __props.children));
167
+ __exitChildren();
168
+ return __el0;
169
+ })();
170
+ __flushMountFrame();
171
+ return __mfResult0;
172
+ } catch (__mfErr) {
173
+ __discardMountFrame(__mfDepth);
174
+ throw __mfErr;
175
+ }
176
+ }
177
+ function AlertDialogCancel(__props) {
178
+ const __mfDepth = __pushMountFrame();
179
+ try {
180
+ const ctx = useAlertDialogContext("Cancel");
181
+ const __mfResult0 = (() => {
182
+ const __el0 = __element("button");
183
+ __el0.setAttribute("type", "button");
184
+ __el0.setAttribute("data-slot", "alertdialog-cancel");
185
+ __attr(__el0, "class", () => cn(ctx.classes?.cancel, __props.className ?? __props.class));
186
+ __on(__el0, "click", () => {
187
+ __props.onClick?.();
188
+ ctx.close();
189
+ });
190
+ __attr(__el0, "disabled", () => __props.disabled);
191
+ __enterChildren(__el0);
192
+ __append(__el0, __child(() => __props.children));
193
+ __exitChildren();
194
+ return __el0;
195
+ })();
196
+ __flushMountFrame();
197
+ return __mfResult0;
198
+ } catch (__mfErr) {
199
+ __discardMountFrame(__mfDepth);
200
+ throw __mfErr;
201
+ }
202
+ }
203
+ function AlertDialogAction(__props) {
204
+ const __mfDepth = __pushMountFrame();
205
+ try {
206
+ const ctx = useAlertDialogContext("Action");
207
+ const __mfResult0 = (() => {
208
+ const __el0 = __element("button");
209
+ __el0.setAttribute("type", "button");
210
+ __el0.setAttribute("data-slot", "alertdialog-action");
211
+ __attr(__el0, "class", () => cn(ctx.classes?.action, __props.className ?? __props.class));
212
+ __on(__el0, "click", () => {
213
+ __props.onClick?.();
214
+ ctx.onAction?.();
215
+ ctx.close();
216
+ });
217
+ __attr(__el0, "disabled", () => __props.disabled);
218
+ __enterChildren(__el0);
219
+ __append(__el0, __child(() => __props.children));
220
+ __exitChildren();
221
+ return __el0;
222
+ })();
223
+ __flushMountFrame();
224
+ return __mfResult0;
225
+ } catch (__mfErr) {
226
+ __discardMountFrame(__mfDepth);
227
+ throw __mfErr;
228
+ }
229
+ }
230
+ function ComposedAlertDialogRoot(__props) {
231
+ const __mfDepth = __pushMountFrame();
232
+ try {
233
+ let showDialog = function() {
234
+ const el = dialogRef.current;
235
+ if (!el || el.open)
236
+ return;
237
+ el.setAttribute("data-state", "open");
238
+ el.showModal();
239
+ }, hideDialog = function() {
240
+ const el = dialogRef.current;
241
+ if (!el || !el.open)
242
+ return;
243
+ el.setAttribute("data-state", "closed");
244
+ el.offsetHeight;
245
+ const onEnd = () => {
246
+ el.removeEventListener("animationend", onEnd);
247
+ if (el.open)
248
+ el.close();
249
+ };
250
+ el.addEventListener("animationend", onEnd);
251
+ setTimeout(onEnd, 200);
252
+ }, open = function() {
253
+ isOpen.value = true;
254
+ showDialog();
255
+ __props.onOpenChange?.(true);
256
+ }, close = function() {
257
+ hideDialog();
258
+ isOpen.value = false;
259
+ __props.onOpenChange?.(false);
260
+ };
261
+ const ids = linkedIds("alertdialog");
262
+ const titleId = `${ids.contentId}-title`;
263
+ const descriptionId = `${ids.contentId}-description`;
264
+ const dialogRef = ref();
265
+ const isOpen = signal(false, "isOpen");
266
+ const ctx = {
267
+ isOpen,
268
+ titleId,
269
+ descriptionId,
270
+ contentId: ids.contentId,
271
+ dialogRef,
272
+ classes: __props.classes,
273
+ onAction: __props.onAction,
274
+ open,
275
+ close
276
+ };
277
+ const __mfResult0 = AlertDialogContext.Provider({ get value() {
278
+ return ctx;
279
+ }, children: () => (() => {
280
+ const __el0 = __element("span");
281
+ {
282
+ const __v = { display: "contents" };
283
+ if (__v != null && __v !== false)
284
+ __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
285
+ }
286
+ __el0.setAttribute("data-alertdialog-root", "");
287
+ __enterChildren(__el0);
288
+ __append(__el0, __child(() => __props.children));
289
+ __exitChildren();
290
+ return __el0;
291
+ })() });
292
+ __flushMountFrame();
293
+ return __mfResult0;
294
+ } catch (__mfErr) {
295
+ __discardMountFrame(__mfDepth);
296
+ throw __mfErr;
297
+ }
298
+ }
299
+ var ComposedAlertDialog = Object.assign(ComposedAlertDialogRoot, {
300
+ Trigger: AlertDialogTrigger,
301
+ Content: AlertDialogContent,
302
+ Title: AlertDialogTitle,
303
+ Description: AlertDialogDescription,
304
+ Header: AlertDialogHeader,
305
+ Footer: AlertDialogFooter,
306
+ Cancel: AlertDialogCancel,
307
+ Action: AlertDialogAction
308
+ });
309
+
310
+ export { ComposedAlertDialog };
@@ -0,0 +1,31 @@
1
+ import {
2
+ cn
3
+ } from "./chunk-q7xbcj9q.js";
4
+
5
+ // src/button/button-composed.tsx
6
+ import { __append, __attr, __child, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __pushMountFrame, __spread } from "@vertz/ui/internals";
7
+ function ComposedButtonRoot(__props) {
8
+ const { classes: __$drop_0, className: __$drop_1, class: __$drop_2, children: __$drop_3, disabled: __$drop_4, type: __$drop_5, ...rest } = __props;
9
+ const __mfDepth = __pushMountFrame();
10
+ try {
11
+ const __mfResult0 = (() => {
12
+ const __el0 = __element("button");
13
+ __attr(__el0, "type", () => __props.type ?? "button");
14
+ __attr(__el0, "class", () => cn(__props.classes?.base, __props.className ?? __props.class));
15
+ __attr(__el0, "disabled", () => __props.disabled || undefined);
16
+ __spread(__el0, rest);
17
+ __enterChildren(__el0);
18
+ __append(__el0, __child(() => __props.children));
19
+ __exitChildren();
20
+ return __el0;
21
+ })();
22
+ __flushMountFrame();
23
+ return __mfResult0;
24
+ } catch (__mfErr) {
25
+ __discardMountFrame(__mfDepth);
26
+ throw __mfErr;
27
+ }
28
+ }
29
+ var ComposedButton = ComposedButtonRoot;
30
+
31
+ export { ComposedButton };