@codbex/harmonia 1.1.0 → 1.1.2

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 (8) hide show
  1. package/dist/harmonia.css +1 -1
  2. package/dist/harmonia.esm.js +283 -17343
  3. package/dist/harmonia.esm.min.js +2 -15
  4. package/dist/harmonia.esm.min.js.map +4 -4
  5. package/dist/harmonia.js +283 -262
  6. package/dist/harmonia.min.js +2 -23
  7. package/dist/harmonia.min.js.map +4 -4
  8. package/package.json +1 -2
package/dist/harmonia.js CHANGED
@@ -1,84 +1,4 @@
1
1
  (() => {
2
- // node_modules/lucide/dist/esm/defaultAttributes.js
3
- var defaultAttributes = {
4
- xmlns: "http://www.w3.org/2000/svg",
5
- width: 24,
6
- height: 24,
7
- viewBox: "0 0 24 24",
8
- fill: "none",
9
- stroke: "currentColor",
10
- "stroke-width": 2,
11
- "stroke-linecap": "round",
12
- "stroke-linejoin": "round"
13
- };
14
-
15
- // node_modules/lucide/dist/esm/createElement.js
16
- var createSVGElement = ([tag, attrs, children]) => {
17
- const element = document.createElementNS("http://www.w3.org/2000/svg", tag);
18
- Object.keys(attrs).forEach((name) => {
19
- element.setAttribute(name, String(attrs[name]));
20
- });
21
- if (children?.length) {
22
- children.forEach((child) => {
23
- const childElement = createSVGElement(child);
24
- element.appendChild(childElement);
25
- });
26
- }
27
- return element;
28
- };
29
- var createElement = (iconNode, customAttrs = {}) => {
30
- const tag = "svg";
31
- const attrs = {
32
- ...defaultAttributes,
33
- ...customAttrs
34
- };
35
- return createSVGElement([tag, attrs, iconNode]);
36
- };
37
-
38
- // node_modules/lucide/dist/esm/icons/calendar.js
39
- var Calendar = [
40
- ["path", { d: "M8 2v4" }],
41
- ["path", { d: "M16 2v4" }],
42
- ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2" }],
43
- ["path", { d: "M3 10h18" }]
44
- ];
45
-
46
- // node_modules/lucide/dist/esm/icons/check.js
47
- var Check = [["path", { d: "M20 6 9 17l-5-5" }]];
48
-
49
- // node_modules/lucide/dist/esm/icons/chevron-down.js
50
- var ChevronDown = [["path", { d: "m6 9 6 6 6-6" }]];
51
-
52
- // node_modules/lucide/dist/esm/icons/chevron-left.js
53
- var ChevronLeft = [["path", { d: "m15 18-6-6 6-6" }]];
54
-
55
- // node_modules/lucide/dist/esm/icons/chevron-right.js
56
- var ChevronRight = [["path", { d: "m9 18 6-6-6-6" }]];
57
-
58
- // node_modules/lucide/dist/esm/icons/chevrons-left.js
59
- var ChevronsLeft = [
60
- ["path", { d: "m11 17-5-5 5-5" }],
61
- ["path", { d: "m18 17-5-5 5-5" }]
62
- ];
63
-
64
- // node_modules/lucide/dist/esm/icons/chevrons-right.js
65
- var ChevronsRight = [
66
- ["path", { d: "m6 17 5-5-5-5" }],
67
- ["path", { d: "m13 17 5-5-5-5" }]
68
- ];
69
-
70
- // node_modules/lucide/dist/esm/icons/clock.js
71
- var Clock = [
72
- ["path", { d: "M12 6v6l4 2" }],
73
- ["circle", { cx: "12", cy: "12", r: "10" }]
74
- ];
75
-
76
- // node_modules/lucide/dist/esm/icons/search.js
77
- var Search = [
78
- ["path", { d: "m21 21-4.34-4.34" }],
79
- ["circle", { cx: "11", cy: "11", r: "8" }]
80
- ];
81
-
82
2
  // node_modules/uuid/dist/stringify.js
83
3
  var byteToHex = [];
84
4
  for (let i = 0; i < 256; ++i) {
@@ -134,6 +54,176 @@
134
54
  }
135
55
  var v4_default = v4;
136
56
 
57
+ // src/common/icons.js
58
+ var Calendar = 0;
59
+ var Check = 1;
60
+ var ChevronDown = 2;
61
+ var ChevronLeft = 3;
62
+ var ChevronRight = 4;
63
+ var ChevronsLeft = 5;
64
+ var ChevronsRight = 6;
65
+ var Clock = 7;
66
+ var Search = 8;
67
+ var Ellipsis = 9;
68
+ function setCalendarContent(svg) {
69
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
70
+ path.setAttributeNS(
71
+ null,
72
+ "d",
73
+ "m5.4512 0.8252c-0.3601 0-0.65039 0.29029-0.65039 0.65039v0.69922h-1.3008c-1.108 0-2 0.892-2 2v9c0 1.108 0.892 2 2 2h9c1.108 0 2-0.892 2-2v-9c0-1.108-0.892-2-2-2h-1.2988v-0.69922c0-0.3601-0.29029-0.65039-0.65039-0.65039s-0.64844 0.29029-0.64844 0.65039v0.69922h-3.8027v-0.69922c0-0.3601-0.28834-0.65039-0.64844-0.65039zm-1.6504 2.6504h1v0.69922c1e-6 0.3601 0.29029 0.65039 0.65039 0.65039s0.64844-0.29029 0.64844-0.65039v-0.69922h3.8027v0.69922c0 0.3601 0.28834 0.65039 0.64844 0.65039s0.65039-0.29029 0.65039-0.65039v-0.69922h1c0.554 0 1 0.446 1 1v1.5h-10.4v-1.5c0-0.554 0.446-1 1-1zm-1 3.8008h10.4v5.5996c0 0.554-0.446 1-1 1h-8.4004c-0.554 0-1-0.446-1-1z"
74
+ );
75
+ svg.appendChild(path);
76
+ }
77
+ function setCheckContent(svg) {
78
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
79
+ path.setAttributeNS(
80
+ null,
81
+ "d",
82
+ "m12.937 4.049-6.5829 6.5829-3.2935-3.2914c-0.23947-0.23959-0.63055-0.24761-0.87815 0-0.24358 0.2437-0.24358 0.63448 0 0.87815l3.7315 3.7337c0.24646 0.24634 0.64298 0.23729 0.88026 0l7.0228-7.0251c0.24358-0.2437 0.24358-0.63448 0-0.87815-0.2433-0.24342-0.63667-0.24364-0.88026-1.5e-6z"
83
+ );
84
+ svg.appendChild(path);
85
+ }
86
+ function setChevronDownContent(svg) {
87
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
88
+ path.setAttributeNS(
89
+ null,
90
+ "d",
91
+ "m3.2098 5.353c-0.2797 0.27984-0.2797 0.72853 0 1.0083l4.2848 4.2872c0.283 0.28286 0.73831 0.27246 1.0108 0l4.2848-4.2872c0.2797-0.27984 0.2797-0.72853 0-1.0083-0.2797-0.27984-0.73098-0.27984-1.0108 0l-3.7795 3.7795-3.7818-3.7795c-0.27497-0.27511-0.72404-0.28432-1.0083 0z"
92
+ );
93
+ svg.appendChild(path);
94
+ }
95
+ function setChevronLeftContent(svg) {
96
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
97
+ path.setAttributeNS(
98
+ null,
99
+ "d",
100
+ "m10.647 12.79c-0.27984 0.2797-0.72853 0.2797-1.0083 0l-4.2872-4.2848c-0.28286-0.283-0.27246-0.73831 0-1.0108l4.2872-4.2848c0.27984-0.2797 0.72853-0.2797 1.0083 0 0.27984 0.2797 0.27984 0.73098 0 1.0108l-3.7795 3.7795 3.7795 3.7818c0.27511 0.27497 0.28432 0.72404 0 1.0083z"
101
+ );
102
+ svg.appendChild(path);
103
+ }
104
+ function setChevronRightContent(svg) {
105
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
106
+ path.setAttributeNS(
107
+ null,
108
+ "d",
109
+ "m5.353 12.79c0.27984 0.2797 0.72853 0.2797 1.0083 0l4.2872-4.2848c0.28286-0.283 0.27246-0.73831 0-1.0108l-4.2872-4.2848c-0.27984-0.2797-0.72853-0.2797-1.0083 0-0.27984 0.2797-0.27984 0.73098 0 1.0108l3.7795 3.7795-3.7795 3.7818c-0.27511 0.27497-0.28432 0.72404 0 1.0083z"
110
+ );
111
+ svg.appendChild(path);
112
+ }
113
+ function setChevronsLeftContent(svg) {
114
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
115
+ path.setAttributeNS(
116
+ null,
117
+ "d",
118
+ "m13 3c0.18212 0 0.36302 0.070121 0.50292 0.20996 0.27982 0.27969 0.27982 0.73097 0 1.0108l-3.7794 3.7794 3.7794 3.7819c0.27511 0.27496 0.28432 0.72402 0 1.0083-0.27984 0.27969-0.72852 0.27969-1.0083 0l-4.2872-4.2847c-0.28285-0.283-0.27246-0.7383 0-1.0108l4.2872-4.2847c0.13991-0.13985 0.32325-0.20996 0.50537-0.20996zm-5.7152 0c0.18212 0 0.36547 0.070121 0.50537 0.20996 0.27984 0.27969 0.27984 0.73097 0 1.0108l-3.7794 3.7794 3.7794 3.7819c0.27511 0.27496 0.28432 0.72402 0 1.0083-0.27984 0.27969-0.72852 0.27969-1.0083 0l-4.2872-4.2847c-0.28286-0.283-0.27246-0.7383 0-1.0108l4.2872-4.2847c0.13991-0.13985 0.32081-0.20996 0.50292-0.20996z"
119
+ );
120
+ svg.appendChild(path);
121
+ }
122
+ function setChevronsRightContent(svg) {
123
+ const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
124
+ path.setAttributeNS(
125
+ null,
126
+ "d",
127
+ "m2.9996 3c-0.18212 0-0.36302 0.070121-0.50292 0.20996-0.27984 0.27969-0.27984 0.73097 0 1.0108l3.7794 3.7794-3.7794 3.7819c-0.27511 0.27496-0.28432 0.72402 0 1.0083 0.27984 0.27969 0.72852 0.27969 1.0083 0l4.2872-4.2847c0.28286-0.283 0.27246-0.7383 0-1.0108l-4.2872-4.2847c-0.13991-0.13985-0.32325-0.20996-0.50537-0.20996zm5.7152 0c-0.18212 0-0.36547 0.070121-0.50537 0.20996-0.27984 0.27969-0.27984 0.73097 0 1.0108l3.7794 3.7794-3.7794 3.7819c-0.27511 0.27496-0.28432 0.72402 0 1.0083 0.27984 0.27969 0.72852 0.27969 1.0083 0l4.2872-4.2847c0.28285-0.283 0.27246-0.7383 0-1.0108l-4.2872-4.2847c-0.13991-0.13985-0.32081-0.20996-0.50292-0.20996z"
128
+ );
129
+ svg.appendChild(path);
130
+ }
131
+ function setClockContent(svg) {
132
+ const path1 = document.createElementNS("http://www.w3.org/2000/svg", "path");
133
+ path1.setAttributeNS(
134
+ null,
135
+ "d",
136
+ "m8 0.75a7.25 7.25 0 0 0-7.25 7.25 7.25 7.25 0 0 0 7.25 7.25 7.25 7.25 0 0 0 7.25-7.25 7.25 7.25 0 0 0-7.25-7.25zm0 1.3008a5.95 5.95 0 0 1 5.9492 5.9492 5.95 5.95 0 0 1-5.9492 5.9512 5.95 5.95 0 0 1-5.9492-5.9512 5.95 5.95 0 0 1 5.9492-5.9492z"
137
+ );
138
+ svg.appendChild(path1);
139
+ const path2 = document.createElementNS("http://www.w3.org/2000/svg", "path");
140
+ path2.setAttributeNS(
141
+ null,
142
+ "d",
143
+ "m8 3.25c-0.3601 0-0.65039 0.29029-0.65039 0.65039v4.0996c-4.82e-5 0.2464 0.13303 0.40256 0.20508 0.47461l2.6035 2.6016c0.25463 0.25463 0.66334 0.25463 0.91797 0s0.25463-0.66334 0-0.91797l-2.4258-2.4277v-3.8301c0-0.3601-0.29029-0.65039-0.65039-0.65039z"
144
+ );
145
+ svg.appendChild(path2);
146
+ }
147
+ function setSearchContent(svg) {
148
+ const path1 = document.createElementNS("http://www.w3.org/2000/svg", "path");
149
+ path1.setAttributeNS(
150
+ null,
151
+ "d",
152
+ "m7.31 1.31a5.9999 5.9999 0 0 0-5.9999 5.9999 5.9999 5.9999 0 0 0 5.9999 5.9999 5.9999 5.9999 0 0 0 5.9999-5.9999 5.9999 5.9999 0 0 0-5.9999-5.9999zm0 1.1992a4.7999 4.7999 0 0 1 4.8007 4.8007 4.7999 4.7999 0 0 1-4.8007 4.8007 4.7999 4.7999 0 0 1-4.8007-4.8007 4.7999 4.7999 0 0 1 4.8007-4.8007z"
153
+ );
154
+ svg.appendChild(path1);
155
+ const path2 = document.createElementNS("http://www.w3.org/2000/svg", "path");
156
+ path2.setAttributeNS(
157
+ null,
158
+ "d",
159
+ "m10.705 10.705c0.23504-0.23504 0.6286-0.2199 0.88247 0.03394l2.9019 2.9019c0.25384 0.25384 0.26898 0.64742 0.03394 0.88247-0.23504 0.23504-0.6286 0.2199-0.88247-0.03394l-2.9019-2.9019c-0.25384-0.25384-0.26898-0.64742-0.03394-0.88247z"
160
+ );
161
+ svg.appendChild(path2);
162
+ }
163
+ function setEllipsisContent(svg) {
164
+ const circle1 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
165
+ circle1.setAttributeNS(null, "cx", "2");
166
+ circle1.setAttributeNS(null, "cy", "8");
167
+ circle1.setAttributeNS(null, "r", "1.5");
168
+ svg.appendChild(circle1);
169
+ const circle2 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
170
+ circle2.setAttributeNS(null, "cx", "8");
171
+ circle2.setAttributeNS(null, "cy", "8");
172
+ circle2.setAttributeNS(null, "r", "1.5");
173
+ svg.appendChild(circle2);
174
+ const circle3 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
175
+ circle3.setAttributeNS(null, "cx", "14");
176
+ circle3.setAttributeNS(null, "cy", "8");
177
+ circle3.setAttributeNS(null, "r", "1.5");
178
+ svg.appendChild(circle3);
179
+ }
180
+ function createSvg({ icon, classes = "size-4", attrs } = {}) {
181
+ const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
182
+ svg.setAttributeNS(null, "width", "16");
183
+ svg.setAttributeNS(null, "height", "16");
184
+ svg.setAttributeNS(null, "viewBox", "0 0 16 16");
185
+ svg.setAttributeNS(null, "fill", "currentColor");
186
+ svg.setAttributeNS(null, "class", classes);
187
+ if (attrs) {
188
+ for (const [key, value] of Object.entries(attrs)) {
189
+ svg.setAttributeNS(null, key, value);
190
+ }
191
+ }
192
+ switch (icon) {
193
+ case Calendar:
194
+ setCalendarContent(svg);
195
+ break;
196
+ case Check:
197
+ setCheckContent(svg);
198
+ break;
199
+ case ChevronDown:
200
+ setChevronDownContent(svg);
201
+ break;
202
+ case ChevronLeft:
203
+ setChevronLeftContent(svg);
204
+ break;
205
+ case ChevronRight:
206
+ setChevronRightContent(svg);
207
+ break;
208
+ case ChevronsLeft:
209
+ setChevronsLeftContent(svg);
210
+ break;
211
+ case ChevronsRight:
212
+ setChevronsRightContent(svg);
213
+ break;
214
+ case Clock:
215
+ setClockContent(svg);
216
+ break;
217
+ case Search:
218
+ setSearchContent(svg);
219
+ break;
220
+ case Ellipsis:
221
+ setEllipsisContent(svg);
222
+ break;
223
+ }
224
+ return svg;
225
+ }
226
+
137
227
  // src/components/accordion.js
138
228
  function accordion_default(Alpine) {
139
229
  Alpine.directive("h-accordion", (el, { expression, modifiers }, { Alpine: Alpine2 }) => {
@@ -197,12 +287,13 @@
197
287
  );
198
288
  el.setAttribute("tabIndex", "-1");
199
289
  const getLabel = evaluateLater(expression);
200
- const chevronDown = createElement(ChevronDown, {
201
- class: ["text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200"],
202
- width: "16",
203
- height: "16",
204
- "aria-hidden": true,
205
- role: "presentation"
290
+ const chevronDown = createSvg({
291
+ icon: ChevronDown,
292
+ classes: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200",
293
+ attrs: {
294
+ "aria-hidden": true,
295
+ role: "presentation"
296
+ }
206
297
  });
207
298
  const button = document.createElement("button");
208
299
  button.setAttribute("type", "button");
@@ -2301,12 +2392,13 @@
2301
2392
  previousYearBtn.setAttribute("aria-label", el.hasAttribute("data-aria-prev-year") ? el.hasAttribute("data-aria-prev-year") : "previous year");
2302
2393
  previousYearBtn.setAttribute("type", "button");
2303
2394
  previousYearBtn.appendChild(
2304
- createElement(ChevronsLeft, {
2305
- class: ["opacity-70 size-4 shrink-0 pointer-events-none"],
2306
- width: "16",
2307
- height: "16",
2308
- "aria-hidden": true,
2309
- role: "presentation"
2395
+ createSvg({
2396
+ icon: ChevronsLeft,
2397
+ classes: "opacity-70 size-4 shrink-0 pointer-events-none",
2398
+ attrs: {
2399
+ "aria-hidden": true,
2400
+ role: "presentation"
2401
+ }
2310
2402
  })
2311
2403
  );
2312
2404
  previousYearBtn.addEventListener("click", () => {
@@ -2319,12 +2411,13 @@
2319
2411
  previousMonthBtn.setAttribute("aria-label", el.hasAttribute("data-aria-prev-month") ? el.hasAttribute("data-aria-prev-month") : "previous month");
2320
2412
  previousMonthBtn.setAttribute("type", "button");
2321
2413
  previousMonthBtn.appendChild(
2322
- createElement(ChevronLeft, {
2323
- class: ["opacity-70 size-4 shrink-0 pointer-events-none"],
2324
- width: "16",
2325
- height: "16",
2326
- "aria-hidden": true,
2327
- role: "presentation"
2414
+ createSvg({
2415
+ icon: ChevronLeft,
2416
+ classes: "opacity-70 size-4 shrink-0 pointer-events-none",
2417
+ attrs: {
2418
+ "aria-hidden": true,
2419
+ role: "presentation"
2420
+ }
2328
2421
  })
2329
2422
  );
2330
2423
  previousMonthBtn.addEventListener("click", () => {
@@ -2342,12 +2435,13 @@
2342
2435
  nextMonthBtn.setAttribute("aria-label", el.hasAttribute("data-aria-next-month") ? el.hasAttribute("data-aria-next-month") : "next month");
2343
2436
  nextMonthBtn.setAttribute("type", "button");
2344
2437
  nextMonthBtn.appendChild(
2345
- createElement(ChevronRight, {
2346
- class: ["opacity-70 size-4 shrink-0 pointer-events-none"],
2347
- width: "16",
2348
- height: "16",
2349
- "aria-hidden": true,
2350
- role: "presentation"
2438
+ createSvg({
2439
+ icon: ChevronRight,
2440
+ classes: "opacity-70 size-4 shrink-0 pointer-events-none",
2441
+ attrs: {
2442
+ "aria-hidden": true,
2443
+ role: "presentation"
2444
+ }
2351
2445
  })
2352
2446
  );
2353
2447
  nextMonthBtn.addEventListener("click", () => {
@@ -2360,12 +2454,13 @@
2360
2454
  nextYearBtn.setAttribute("aria-label", el.hasAttribute("data-aria-next-year") ? el.hasAttribute("data-aria-next-year") : "next year");
2361
2455
  nextYearBtn.setAttribute("type", "button");
2362
2456
  nextYearBtn.appendChild(
2363
- createElement(ChevronsRight, {
2364
- class: ["opacity-70 size-4 shrink-0 pointer-events-none"],
2365
- width: "16",
2366
- height: "16",
2367
- "aria-hidden": true,
2368
- role: "presentation"
2457
+ createSvg({
2458
+ icon: ChevronsRight,
2459
+ classes: "opacity-70 size-4 shrink-0 pointer-events-none",
2460
+ attrs: {
2461
+ "aria-hidden": true,
2462
+ role: "presentation"
2463
+ }
2369
2464
  })
2370
2465
  );
2371
2466
  nextYearBtn.addEventListener("click", () => {
@@ -2694,18 +2789,6 @@
2694
2789
  "[&>input]:size-full",
2695
2790
  "[&>input]:top-0",
2696
2791
  "aspect-square",
2697
- "before:bg-transparent",
2698
- "before:block",
2699
- "before:border-b-2",
2700
- "before:border-l-2",
2701
- "before:border-primary-foreground",
2702
- "before:h-2",
2703
- "before:invisible",
2704
- "before:pointer-events-none",
2705
- "before:-rotate-45",
2706
- "before:translate-x-0.5",
2707
- "before:translate-y-0.75",
2708
- "before:w-3.5",
2709
2792
  "bg-input-inner",
2710
2793
  "border",
2711
2794
  "border-input",
@@ -2714,7 +2797,6 @@
2714
2797
  "duration-200",
2715
2798
  "has-[aria-invalid=true]:border-negative",
2716
2799
  "has-[aria-invalid=true]:ring-negative/20",
2717
- "has-[input:checked]:before:visible",
2718
2800
  "has-[input:checked]:bg-primary",
2719
2801
  "has-[input:checked]:border-primary",
2720
2802
  "has-[input:disabled]:cursor-not-allowed",
@@ -2730,6 +2812,8 @@
2730
2812
  );
2731
2813
  el.setAttribute("tabindex", "-1");
2732
2814
  el.setAttribute("data-slot", "checkbox");
2815
+ const check = createSvg({ icon: Check, classes: "size-full [input:checked~&]:visible invisible fill-primary-foreground", attrs: { "aria-hidden": true, role: "presentation" } });
2816
+ el.appendChild(check);
2733
2817
  });
2734
2818
  }
2735
2819
 
@@ -2910,12 +2994,13 @@
2910
2994
  el.setAttribute("type", "button");
2911
2995
  el.setAttribute("data-slot", "date-picker-trigger");
2912
2996
  el.appendChild(
2913
- createElement(Calendar, {
2914
- class: ["opacity-70 text-foreground size-4"],
2915
- width: "16",
2916
- height: "16",
2917
- "aria-hidden": true,
2918
- role: "presentation"
2997
+ createSvg({
2998
+ icon: Calendar,
2999
+ classes: "opacity-70 text-foreground size-4",
3000
+ attrs: {
3001
+ "aria-hidden": true,
3002
+ role: "presentation"
3003
+ }
2919
3004
  })
2920
3005
  );
2921
3006
  effect(() => {
@@ -4007,25 +4092,15 @@
4007
4092
  "data-[inset=true]:pl-8",
4008
4093
  "[&_svg]:pointer-events-none",
4009
4094
  "[&_svg]:shrink-0",
4010
- "[&_svg:not([class*='size-'])]:size-4",
4011
- "after:block",
4012
- "after:bg-transparent",
4013
- "after:border-t-[calc(var(--spacing)*0.25)]",
4014
- "after:border-r-[calc(var(--spacing)*0.25)]",
4015
- "after:border-muted-foreground",
4016
- "after:pointer-events-none",
4017
- "after:min-w-1.75",
4018
- "after:size-1.75",
4019
- "after:rounded-[calc(var(--spacing)*0.25)]",
4020
- "after:rotate-45",
4021
- "after:ml-auto",
4022
- "after:-translate-x-0.75"
4095
+ "[&_svg:not([class*='size-'])]:size-4"
4023
4096
  );
4024
4097
  el.setAttribute("role", "menuitem");
4025
4098
  el.setAttribute("aria-haspopup", "true");
4026
4099
  el.setAttribute("aria-expanded", "false");
4027
4100
  el.setAttribute("tabindex", "-1");
4028
4101
  el.setAttribute("data-slot", "menu-sub");
4102
+ const chevronRight = createSvg({ icon: ChevronRight, classes: "size-4 ml-auto", attrs: { "aria-hidden": true, role: "presentation" } });
4103
+ el.appendChild(chevronRight);
4029
4104
  const parentMenu = Alpine2.findClosest(el.parentElement, (parent) => parent.getAttribute("role") === "menu");
4030
4105
  if (!parentMenu) throw new Error(`${original} must have a parent`);
4031
4106
  el._menu_sub = {
@@ -4131,8 +4206,7 @@
4131
4206
  "items-center",
4132
4207
  "gap-2",
4133
4208
  "rounded-sm",
4134
- "pr-2",
4135
- "pl-3.5",
4209
+ "px-2",
4136
4210
  "py-1.5",
4137
4211
  "text-sm",
4138
4212
  "outline-hidden",
@@ -4142,21 +4216,13 @@
4142
4216
  "aria-[disabled=true]:opacity-50",
4143
4217
  "transition-all",
4144
4218
  "overflow-hidden",
4145
- "before:invisible",
4146
- "before:bg-transparent",
4147
- "before:border-l-2",
4148
- "before:border-b-2",
4149
- "before:border-foreground",
4150
- "before:pointer-events-none",
4151
- "before:w-2.5",
4152
- "before:h-1.5",
4153
- "before:-rotate-45",
4154
- "before:-translate-x-0.75",
4155
- "aria-[checked=true]:before:visible"
4219
+ "aria-[checked=true]:[&>svg]:visible"
4156
4220
  );
4157
4221
  el.setAttribute("tabindex", "-1");
4158
4222
  el.setAttribute("role", "menuitemcheckbox");
4159
4223
  el.setAttribute("data-slot", "menu-checkbox-item");
4224
+ const check = createSvg({ icon: Check, classes: "size-4 invisible", attrs: { "aria-hidden": true, role: "presentation" } });
4225
+ el.prepend(check);
4160
4226
  function setState(checked, dispatch = true) {
4161
4227
  if (dispatch)
4162
4228
  Alpine2.nextTick(() => {
@@ -4348,28 +4414,15 @@
4348
4414
  });
4349
4415
  Alpine.directive("h-pagination-ellipsis", (el) => {
4350
4416
  el.classList.add("flex", "size-9", "items-center", "justify-center");
4351
- const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
4352
- svg.setAttributeNS(null, "width", "16");
4353
- svg.setAttributeNS(null, "height", "16");
4354
- svg.setAttributeNS(null, "viewBox", "0 0 16 16");
4355
- svg.setAttributeNS(null, "fill", "currentColor");
4356
- svg.setAttributeNS(null, "class", "size-4");
4357
- const circle1 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
4358
- circle1.setAttributeNS(null, "cx", "2");
4359
- circle1.setAttributeNS(null, "cy", "8");
4360
- circle1.setAttributeNS(null, "r", "1.5");
4361
- svg.appendChild(circle1);
4362
- const circle2 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
4363
- circle2.setAttributeNS(null, "cx", "8");
4364
- circle2.setAttributeNS(null, "cy", "8");
4365
- circle2.setAttributeNS(null, "r", "1.5");
4366
- svg.appendChild(circle2);
4367
- const circle3 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
4368
- circle3.setAttributeNS(null, "cx", "14");
4369
- circle3.setAttributeNS(null, "cy", "8");
4370
- circle3.setAttributeNS(null, "r", "1.5");
4371
- svg.appendChild(circle3);
4372
- el.appendChild(svg);
4417
+ el.appendChild(
4418
+ createSvg({
4419
+ icon: Ellipsis,
4420
+ attrs: {
4421
+ "aria-hidden": true,
4422
+ role: "presentation"
4423
+ }
4424
+ })
4425
+ );
4373
4426
  el.setAttribute("data-slot", "pagination-ellipsis");
4374
4427
  });
4375
4428
  }
@@ -6735,12 +6788,13 @@
6735
6788
  };
6736
6789
  fakeTrigger.addEventListener("keydown", onPress);
6737
6790
  fakeTrigger.addEventListener("click", onClick2);
6738
- const chevronDown = createElement(ChevronDown, {
6739
- class: ["opacity-70 text-foreground size-4 shrink-0 pointer-events-none transition-transform duration-200"],
6740
- width: "16",
6741
- height: "16",
6742
- "aria-hidden": true,
6743
- role: "presentation"
6791
+ const chevronDown = createSvg({
6792
+ icon: ChevronDown,
6793
+ classes: "opacity-70 text-foreground size-4 shrink-0 pointer-events-none transition-transform duration-200",
6794
+ attrs: {
6795
+ "aria-hidden": true,
6796
+ role: "presentation"
6797
+ }
6744
6798
  });
6745
6799
  el.parentElement.appendChild(fakeTrigger);
6746
6800
  fakeTrigger.appendChild(chevronDown);
@@ -6836,7 +6890,7 @@
6836
6890
  el.setAttribute("autocomplete", "off");
6837
6891
  el.setAttribute("autocorrect", "off");
6838
6892
  el.setAttribute("spellcheck", "false");
6839
- const searchIcon = createElement(Search, { class: ["size-4 shrink-0 opacity-50"], width: "16", height: "16", "aria-hidden": true, role: "presentation" });
6893
+ const searchIcon = createSvg({ icon: Search, classes: "size-4 shrink-0 opacity-50", attrs: { "aria-hidden": true, role: "presentation" } });
6840
6894
  const searchInput = document.createElement("input");
6841
6895
  searchInput.setAttribute("type", "text");
6842
6896
  searchInput.setAttribute("data-slot", "select-input");
@@ -6940,7 +6994,7 @@
6940
6994
  labelEl.setAttribute("id", id);
6941
6995
  indicatorEl.classList.add("absolute", "right-2", "flex", "size-3.5", "items-center", "justify-center", "invisible");
6942
6996
  indicatorEl.setAttribute("aria-hidden", "true");
6943
- const check = createElement(Check, { class: ["size-4"], width: "16", height: "16", "aria-hidden": true, role: "presentation" });
6997
+ const check = createSvg({ icon: Check, attrs: { "aria-hidden": true, role: "presentation" } });
6944
6998
  indicatorEl.appendChild(check);
6945
6999
  el.appendChild(indicatorEl);
6946
7000
  el.appendChild(labelEl);
@@ -7448,11 +7502,12 @@
7448
7502
  // src/components/split.js
7449
7503
  function split_default(Alpine) {
7450
7504
  Alpine.directive("h-split", (el) => {
7451
- el.classList.add("group/split", "flex", "data-[orientation=horizontal]:flex-row", "data-[orientation=vertical]:flex-col");
7505
+ el.classList.add("flex", "data-[orientation=horizontal]:flex-row", "data-[orientation=vertical]:flex-col");
7452
7506
  el.setAttribute("tabindex", "-1");
7453
7507
  el.setAttribute("data-slot", "split");
7454
7508
  });
7455
7509
  Alpine.directive("h-split-panel", (el) => {
7510
+ el.classList.add('[&.hidden+[data-slot="split-gutter"]]:hidden');
7456
7511
  el.setAttribute("tabindex", "-1");
7457
7512
  el.setAttribute("data-slot", "split-panel");
7458
7513
  });
@@ -7473,9 +7528,9 @@
7473
7528
  "before:block",
7474
7529
  "before:bg-transparent",
7475
7530
  "hover:before:bg-primary-hover",
7476
- "group-data-[locked=true]/split:pointer-events-none",
7477
- "group-data-[orientation=horizontal]/split:cursor-col-resize",
7478
- "group-data-[orientation=vertical]/split:cursor-row-resize"
7531
+ "[[data-locked=true]>&]:pointer-events-none",
7532
+ "[[data-orientation=horizontal]>&]:cursor-col-resize",
7533
+ "[[data-orientation=vertical]>&]:cursor-row-resize"
7479
7534
  );
7480
7535
  const borderClasses = [
7481
7536
  "bg-border",
@@ -7490,12 +7545,12 @@
7490
7545
  "before:block",
7491
7546
  "before:bg-transparent",
7492
7547
  "hover:before:bg-primary-hover",
7493
- "group-data-[orientation=horizontal]/split:!w-px",
7494
- "group-data-[orientation=horizontal]/split:before:h-full",
7495
- "group-data-[orientation=horizontal]/split:before:w-[calc(var(--spacing)*1.25)]",
7496
- "group-data-[orientation=vertical]/split:!h-px",
7497
- "group-data-[orientation=vertical]/split:before:w-full",
7498
- "group-data-[orientation=vertical]/split:before:h-[calc(var(--spacing)*1.25)]"
7548
+ "[[data-orientation=horizontal]>&]:!w-px",
7549
+ "[[data-orientation=horizontal]>&]:before:h-full",
7550
+ "[[data-orientation=horizontal]>&]:before:w-[calc(var(--spacing)*1.25)]",
7551
+ "[[data-orientation=vertical]>&]:!h-px",
7552
+ "[[data-orientation=vertical]>&]:before:w-full",
7553
+ "[[data-orientation=vertical]>&]:before:h-[calc(var(--spacing)*1.25)]"
7499
7554
  ];
7500
7555
  const handleClasses = [
7501
7556
  "bg-transparent",
@@ -7530,19 +7585,19 @@
7530
7585
  "active:before:bg-primary-active",
7531
7586
  "active:before:via-transparent",
7532
7587
  // Orientation classes
7533
- "group-data-[orientation=horizontal]/split:before:h-full",
7534
- "group-data-[orientation=horizontal]/split:before:w-0.5",
7535
- "group-data-[orientation=horizontal]/split:before:bg-gradient-to-b",
7536
- "group-data-[orientation=vertical]/split:before:h-0.5",
7537
- "group-data-[orientation=vertical]/split:before:w-full",
7538
- "group-data-[orientation=vertical]/split:before:bg-gradient-to-r",
7588
+ "[[data-orientation=horizontal]>&]:before:h-full",
7589
+ "[[data-orientation=horizontal]>&]:before:w-0.5",
7590
+ "[[data-orientation=horizontal]>&]:before:bg-gradient-to-b",
7591
+ "[[data-orientation=vertical]>&]:before:h-0.5",
7592
+ "[[data-orientation=vertical]>&]:before:w-full",
7593
+ "[[data-orientation=vertical]>&]:before:bg-gradient-to-r",
7539
7594
  // Size classes
7540
- "group-data-[orientation=horizontal]/split:!w-4",
7541
- "group-data-[orientation=horizontal]/split:after:w-2.5",
7542
- "group-data-[orientation=horizontal]/split:after:h-5",
7543
- "group-data-[orientation=vertical]/split:!h-4",
7544
- "group-data-[orientation=vertical]/split:after:w-5",
7545
- "group-data-[orientation=vertical]/split:after:h-2.5"
7595
+ "[[data-orientation=horizontal]>&]:!w-4",
7596
+ "[[data-orientation=horizontal]>&]:after:w-2.5",
7597
+ "[[data-orientation=horizontal]>&]:after:h-5",
7598
+ "[[data-orientation=vertical]>&]:!h-4",
7599
+ "[[data-orientation=vertical]>&]:after:w-5",
7600
+ "[[data-orientation=vertical]>&]:after:h-2.5"
7546
7601
  ];
7547
7602
  el.setAttribute("data-slot", "split-gutter");
7548
7603
  el.setAttribute("tabindex", "-1");
@@ -8184,12 +8239,13 @@
8184
8239
  el.setAttribute("data-slot", "time-picker");
8185
8240
  el.setAttribute("tabindex", "-1");
8186
8241
  el.appendChild(
8187
- createElement(Clock, {
8188
- class: ["opacity-70 text-foreground size-4 shrink-0 pointer-events-none"],
8189
- width: "16",
8190
- height: "16",
8191
- "aria-hidden": true,
8192
- role: "presentation"
8242
+ createSvg({
8243
+ icon: Clock,
8244
+ classes: "opacity-70 text-foreground size-4 shrink-0 pointer-events-none",
8245
+ attrs: {
8246
+ "aria-hidden": true,
8247
+ role: "presentation"
8248
+ }
8193
8249
  })
8194
8250
  );
8195
8251
  if (expression) {
@@ -8939,7 +8995,7 @@
8939
8995
  "py-0.5",
8940
8996
  "pl-4",
8941
8997
  "data-[border=true]:before:absolute",
8942
- "data-[border=true]:before:left-[calc(var(--spacing)*2.5)]",
8998
+ "data-[border=true]:before:left-[calc(var(--spacing)*3)]",
8943
8999
  "data-[border=true]:before:block",
8944
9000
  "data-[border=true]:before:top-0.5",
8945
9001
  "data-[border=true]:before:bottom-0.5",
@@ -9129,37 +9185,23 @@
9129
9185
  "data-[indicator=positive]:after:bg-positive",
9130
9186
  "data-[indicator=negative]:after:bg-negative",
9131
9187
  "data-[indicator=warning]:after:bg-warning",
9132
- "data-[indicator=information]:after:bg-information",
9133
- "before:mr-1",
9134
- "before:bg-transparent",
9135
- "before:min-w-1.5",
9136
- "before:size-1.5",
9137
- "before:pointer-events-none"
9188
+ "data-[indicator=information]:after:bg-information"
9138
9189
  );
9139
9190
  el.setAttribute("data-slot", "tree-button");
9140
9191
  el.setAttribute("tabindex", "-1");
9141
9192
  el.setAttribute("role", "presentation");
9142
9193
  if (treeItem._h_tree_item.hasSubtree) {
9143
- el.classList.add(
9144
- "before:block",
9145
- "before:mr-1",
9146
- "before:bg-transparent",
9147
- "before:border-t-[calc(var(--spacing)*0.25)]",
9148
- "before:border-r-[calc(var(--spacing)*0.25)]",
9149
- "before:border-foreground",
9150
- "active:before:border-primary-foreground",
9151
- "before:pointer-events-none",
9152
- "before:min-w-1.5",
9153
- "before:size-1.5",
9154
- "before:rounded-[calc(var(--spacing)*0.25)]",
9155
- "before:rotate-135",
9156
- "before:translate-x-1/2",
9157
- "before:-translate-y-0.25",
9158
- "data-[expanded=false]:before:rotate-45",
9159
- "data-[expanded=false]:before:translate-x-1/2",
9160
- "data-[expanded=false]:before:-translate-y-0",
9161
- "aria-selected:before:border-primary-foreground"
9162
- );
9194
+ const chevronDown = createSvg({
9195
+ icon: ChevronRight,
9196
+ classes: "size-4 shrink-0 transition-transform duration-200 [[data-expanded=true]>&]:rotate-90",
9197
+ attrs: {
9198
+ "aria-hidden": true,
9199
+ role: "presentation"
9200
+ }
9201
+ });
9202
+ el.prepend(chevronDown);
9203
+ } else {
9204
+ el.classList.add("before:size-4");
9163
9205
  }
9164
9206
  effect(() => {
9165
9207
  el.setAttribute("data-expanded", treeItem._h_tree_item.expanded);
@@ -9291,7 +9333,7 @@
9291
9333
  }
9292
9334
 
9293
9335
  // package.json
9294
- var version = "1.1.0";
9336
+ var version = "1.1.2";
9295
9337
 
9296
9338
  // src/index.js
9297
9339
  window.Harmonia = { getBreakpointListener, addColorSchemeListener, getColorScheme, removeColorSchemeListener, setColorScheme, version };
@@ -9341,24 +9383,3 @@
9341
9383
  window.Alpine.plugin(template_default);
9342
9384
  });
9343
9385
  })();
9344
- /*! Bundled license information:
9345
-
9346
- lucide/dist/esm/defaultAttributes.js:
9347
- lucide/dist/esm/createElement.js:
9348
- lucide/dist/esm/icons/calendar.js:
9349
- lucide/dist/esm/icons/check.js:
9350
- lucide/dist/esm/icons/chevron-down.js:
9351
- lucide/dist/esm/icons/chevron-left.js:
9352
- lucide/dist/esm/icons/chevron-right.js:
9353
- lucide/dist/esm/icons/chevrons-left.js:
9354
- lucide/dist/esm/icons/chevrons-right.js:
9355
- lucide/dist/esm/icons/clock.js:
9356
- lucide/dist/esm/icons/search.js:
9357
- lucide/dist/esm/lucide.js:
9358
- (**
9359
- * @license lucide v0.562.0 - ISC
9360
- *
9361
- * This source code is licensed under the ISC license.
9362
- * See the LICENSE file in the root directory of this source tree.
9363
- *)
9364
- */