@cascivo/react 0.13.0 → 0.14.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 (170) hide show
  1. package/dist/accordion/accordion.js +46 -44
  2. package/dist/action-sheet/action-sheet.js +16 -16
  3. package/dist/alert-dialog/alert-dialog.js +34 -34
  4. package/dist/app-shell/app-shell.css +1 -1
  5. package/dist/app-shell/app-shell.js +14 -12
  6. package/dist/app-shell/app-shell.module.js +8 -8
  7. package/dist/avatar-group/avatar-group.js +6 -6
  8. package/dist/bottom-sheet/bottom-sheet.js +18 -18
  9. package/dist/button/button.js +15 -12
  10. package/dist/button-group/button-group.js +8 -8
  11. package/dist/carousel/carousel.js +20 -20
  12. package/dist/checkbox/checkbox.js +21 -21
  13. package/dist/checkbox-card/checkbox-card.js +15 -13
  14. package/dist/collapsible/collapsible.js +7 -7
  15. package/dist/color-picker/color-picker.js +26 -26
  16. package/dist/combobox/combobox.js +86 -86
  17. package/dist/command-menu/command-menu.js +111 -111
  18. package/dist/comparison/comparison.js +10 -10
  19. package/dist/context-menu/context-menu.js +9 -9
  20. package/dist/copy-button/copy-button.js +18 -16
  21. package/dist/data-table/data-table.js +1 -1
  22. package/dist/date-picker/date-picker.js +25 -25
  23. package/dist/date-range-picker/date-range-picker.js +26 -26
  24. package/dist/drawer/drawer.css +1 -1
  25. package/dist/drawer/drawer.js +18 -17
  26. package/dist/drawer/drawer.module.js +9 -9
  27. package/dist/dropdown/dropdown.js +48 -48
  28. package/dist/editable/editable.js +11 -11
  29. package/dist/fab/fab.js +53 -53
  30. package/dist/field/field.js +8 -8
  31. package/dist/file-uploader/file-uploader.js +19 -19
  32. package/dist/header-panel/header-panel.js +31 -31
  33. package/dist/hover-card/hover-card.js +21 -21
  34. package/dist/icon-button/icon-button.js +5 -5
  35. package/dist/index.d.ts +233 -194
  36. package/dist/input/input.js +22 -21
  37. package/dist/link/link.js +8 -6
  38. package/dist/log-viewer/log-viewer.js +26 -26
  39. package/dist/menu/menu.js +20 -20
  40. package/dist/menu-button/menu-button.js +48 -48
  41. package/dist/menubar/menubar.js +42 -42
  42. package/dist/modal/modal.css +1 -1
  43. package/dist/modal/modal.js +41 -35
  44. package/dist/modal/modal.module.js +8 -7
  45. package/dist/multi-select/multi-select.css +1 -1
  46. package/dist/multi-select/multi-select.js +57 -57
  47. package/dist/multi-select/multi-select.module.js +11 -11
  48. package/dist/native-select/native-select.js +13 -11
  49. package/dist/navigation-menu/navigation-menu.js +46 -46
  50. package/dist/node/accordion/accordion.js +46 -44
  51. package/dist/node/action-sheet/action-sheet.js +16 -16
  52. package/dist/node/alert-dialog/alert-dialog.js +34 -34
  53. package/dist/node/app-shell/app-shell.js +14 -12
  54. package/dist/node/app-shell/app-shell.module.js +8 -8
  55. package/dist/node/avatar-group/avatar-group.js +6 -6
  56. package/dist/node/bottom-sheet/bottom-sheet.js +18 -18
  57. package/dist/node/button/button.js +15 -12
  58. package/dist/node/button-group/button-group.js +8 -8
  59. package/dist/node/carousel/carousel.js +20 -20
  60. package/dist/node/checkbox/checkbox.js +21 -21
  61. package/dist/node/checkbox-card/checkbox-card.js +15 -13
  62. package/dist/node/collapsible/collapsible.js +7 -7
  63. package/dist/node/color-picker/color-picker.js +26 -26
  64. package/dist/node/combobox/combobox.js +86 -86
  65. package/dist/node/command-menu/command-menu.js +111 -111
  66. package/dist/node/comparison/comparison.js +10 -10
  67. package/dist/node/context-menu/context-menu.js +9 -9
  68. package/dist/node/copy-button/copy-button.js +18 -16
  69. package/dist/node/data-table/data-table.js +1 -1
  70. package/dist/node/date-picker/date-picker.js +25 -25
  71. package/dist/node/date-range-picker/date-range-picker.js +26 -26
  72. package/dist/node/drawer/drawer.js +18 -17
  73. package/dist/node/drawer/drawer.module.js +9 -9
  74. package/dist/node/dropdown/dropdown.js +48 -48
  75. package/dist/node/editable/editable.js +11 -11
  76. package/dist/node/fab/fab.js +53 -53
  77. package/dist/node/field/field.js +8 -8
  78. package/dist/node/file-uploader/file-uploader.js +19 -19
  79. package/dist/node/header-panel/header-panel.js +31 -31
  80. package/dist/node/hover-card/hover-card.js +21 -21
  81. package/dist/node/icon-button/icon-button.js +5 -5
  82. package/dist/node/input/input.js +22 -21
  83. package/dist/node/link/link.js +8 -6
  84. package/dist/node/log-viewer/log-viewer.js +26 -26
  85. package/dist/node/menu/menu.js +20 -20
  86. package/dist/node/menu-button/menu-button.js +48 -48
  87. package/dist/node/menubar/menubar.js +42 -42
  88. package/dist/node/modal/modal.js +41 -35
  89. package/dist/node/modal/modal.module.js +8 -7
  90. package/dist/node/multi-select/multi-select.js +57 -57
  91. package/dist/node/multi-select/multi-select.module.js +11 -11
  92. package/dist/node/native-select/native-select.js +13 -11
  93. package/dist/node/navigation-menu/navigation-menu.js +46 -46
  94. package/dist/node/notification/notification.js +26 -26
  95. package/dist/node/number-input/number-input.js +52 -50
  96. package/dist/node/otp-input/otp-input.js +8 -8
  97. package/dist/node/password-input/password-input.js +28 -27
  98. package/dist/node/popover/popover.js +26 -24
  99. package/dist/node/pull-to-refresh/pull-to-refresh.js +13 -13
  100. package/dist/node/radial-progress/radial-progress.js +5 -5
  101. package/dist/node/radio/radio.js +23 -22
  102. package/dist/node/radio-card/radio-card.js +27 -26
  103. package/dist/node/react/src/index.js +3 -3
  104. package/dist/node/react/src/theme.js +30 -19
  105. package/dist/node/resizable/resizable.js +11 -11
  106. package/dist/node/scroll-area/scroll-area.js +4 -4
  107. package/dist/node/search/search.js +49 -49
  108. package/dist/node/select/select.js +27 -26
  109. package/dist/node/sheet/sheet.js +11 -10
  110. package/dist/node/sheet/sheet.module.js +5 -5
  111. package/dist/node/shell-header/shell-header.js +21 -18
  112. package/dist/node/shell-header/shell-header.module.js +20 -19
  113. package/dist/node/side-nav/side-nav.js +91 -91
  114. package/dist/node/skip-nav/skip-nav.js +12 -12
  115. package/dist/node/slider/slider.js +13 -11
  116. package/dist/node/structured-list/structured-list.js +23 -23
  117. package/dist/node/tabs/tabs.js +49 -47
  118. package/dist/node/tags-input/tags-input.js +35 -35
  119. package/dist/node/textarea/textarea.js +22 -21
  120. package/dist/node/time-picker/time-picker.js +22 -21
  121. package/dist/node/timeline/timeline.js +23 -16
  122. package/dist/node/timeline/timeline.module.js +7 -7
  123. package/dist/node/toast/toast.js +15 -15
  124. package/dist/node/toc/toc.js +8 -8
  125. package/dist/node/toggle/toggle.js +15 -13
  126. package/dist/node/toggle-group/toggle-group.js +10 -10
  127. package/dist/node/toggletip/toggletip.js +9 -9
  128. package/dist/node/tooltip/tooltip.js +5 -5
  129. package/dist/node/tree-view/tree-view.js +32 -32
  130. package/dist/notification/notification.js +26 -26
  131. package/dist/number-input/number-input.js +52 -50
  132. package/dist/otp-input/otp-input.js +8 -8
  133. package/dist/password-input/password-input.js +28 -27
  134. package/dist/popover/popover.js +26 -24
  135. package/dist/pull-to-refresh/pull-to-refresh.js +13 -13
  136. package/dist/radial-progress/radial-progress.js +5 -5
  137. package/dist/radio/radio.js +23 -22
  138. package/dist/radio-card/radio-card.js +27 -26
  139. package/dist/react/src/index.js +3 -3
  140. package/dist/react/src/theme.js +30 -19
  141. package/dist/resizable/resizable.js +11 -11
  142. package/dist/scroll-area/scroll-area.js +4 -4
  143. package/dist/search/search.js +49 -49
  144. package/dist/select/select.js +27 -26
  145. package/dist/sheet/sheet.css +1 -1
  146. package/dist/sheet/sheet.js +11 -10
  147. package/dist/sheet/sheet.module.js +5 -5
  148. package/dist/shell-header/shell-header.css +1 -1
  149. package/dist/shell-header/shell-header.js +21 -18
  150. package/dist/shell-header/shell-header.module.js +20 -19
  151. package/dist/side-nav/side-nav.js +91 -91
  152. package/dist/skip-nav/skip-nav.js +12 -12
  153. package/dist/slider/slider.js +13 -11
  154. package/dist/structured-list/structured-list.js +23 -23
  155. package/dist/styles.css +57 -7
  156. package/dist/tabs/tabs.js +49 -47
  157. package/dist/tags-input/tags-input.js +35 -35
  158. package/dist/textarea/textarea.js +22 -21
  159. package/dist/time-picker/time-picker.js +22 -21
  160. package/dist/timeline/timeline.css +1 -1
  161. package/dist/timeline/timeline.js +23 -16
  162. package/dist/timeline/timeline.module.js +7 -7
  163. package/dist/toast/toast.js +15 -15
  164. package/dist/toc/toc.js +8 -8
  165. package/dist/toggle/toggle.js +15 -13
  166. package/dist/toggle-group/toggle-group.js +10 -10
  167. package/dist/toggletip/toggletip.js +9 -9
  168. package/dist/tooltip/tooltip.js +5 -5
  169. package/dist/tree-view/tree-view.js +32 -32
  170. package/package.json +10 -4
@@ -2,30 +2,30 @@
2
2
 
3
3
  import e from "./structured-list.module.js";
4
4
  import { cn as t, useControllableSignal as n, useRovingFocus as r, useSignals as i } from "@cascivo/core";
5
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
6
- import { useId as s } from "react";
5
+ import { useId as a } from "react";
6
+ import { jsx as o, jsxs as s } from "react/jsx-runtime";
7
7
  //#region ../components/src/structured-list/structured-list.tsx
8
8
  function c(n) {
9
- let { items: r, headers: i, selectable: s = !1, className: c, ariaLabel: u, "aria-label": d } = n;
10
- return s ? /* @__PURE__ */ a(l, { ...n }) : /* @__PURE__ */ o("div", {
9
+ let { items: r, headers: i, selectable: a = !1, className: c, ariaLabel: u, "aria-label": d } = n;
10
+ return a ? /* @__PURE__ */ o(l, { ...n }) : /* @__PURE__ */ s("div", {
11
11
  role: "table",
12
12
  "aria-label": d ?? u,
13
13
  className: t(e.list, c),
14
- children: [i && /* @__PURE__ */ a("div", {
14
+ children: [i && /* @__PURE__ */ o("div", {
15
15
  role: "row",
16
16
  className: e.headerRow,
17
- children: i.map((t, n) => /* @__PURE__ */ a("div", {
17
+ children: i.map((t, n) => /* @__PURE__ */ o("div", {
18
18
  role: "columnheader",
19
19
  className: e.headerCell,
20
20
  children: t
21
21
  }, n))
22
- }), /* @__PURE__ */ a("div", {
22
+ }), /* @__PURE__ */ o("div", {
23
23
  role: "rowgroup",
24
24
  className: e.body,
25
- children: r.map((t) => /* @__PURE__ */ a("div", {
25
+ children: r.map((t) => /* @__PURE__ */ o("div", {
26
26
  role: "row",
27
27
  className: e.row,
28
- children: t.cells.map((t, n) => /* @__PURE__ */ a("div", {
28
+ children: t.cells.map((t, n) => /* @__PURE__ */ o("div", {
29
29
  role: "cell",
30
30
  className: e.cell,
31
31
  children: t
@@ -37,7 +37,7 @@ function c(n) {
37
37
  function l({ items: c, headers: l, value: u, defaultValue: d, onSelect: f, className: p, ariaLabel: m, "aria-label": h }) {
38
38
  let g = h ?? m;
39
39
  i();
40
- let _ = s(), [v, y] = n({
40
+ let _ = a(), [v, y] = n({
41
41
  value: u,
42
42
  defaultValue: d ?? c.find((e) => e.selected)?.id ?? "",
43
43
  onChange: f
@@ -47,47 +47,47 @@ function l({ items: c, headers: l, value: u, defaultValue: d, onSelect: f, class
47
47
  }), x = (e) => {
48
48
  y(e);
49
49
  };
50
- return /* @__PURE__ */ o("div", {
50
+ return /* @__PURE__ */ s("div", {
51
51
  role: "radiogroup",
52
52
  "aria-label": g,
53
53
  className: t(e.list, e.selectable, p),
54
- children: [l && /* @__PURE__ */ o("div", {
54
+ children: [l && /* @__PURE__ */ s("div", {
55
55
  className: e.headerRow,
56
- children: [/* @__PURE__ */ a("div", {
56
+ children: [/* @__PURE__ */ o("div", {
57
57
  className: e.headerCell,
58
58
  "aria-hidden": "true"
59
- }), l.map((t, n) => /* @__PURE__ */ a("div", {
59
+ }), l.map((t, n) => /* @__PURE__ */ o("div", {
60
60
  className: e.headerCell,
61
61
  children: t
62
62
  }, n))]
63
- }), /* @__PURE__ */ a("div", {
63
+ }), /* @__PURE__ */ o("div", {
64
64
  className: e.body,
65
65
  children: c.map((t, n) => {
66
- let r = v.value === t.id, { ref: i, ...s } = b.getItemProps(n);
67
- return /* @__PURE__ */ o("div", {
66
+ let r = v.value === t.id, { ref: i, ...a } = b.getItemProps(n);
67
+ return /* @__PURE__ */ s("div", {
68
68
  role: "radio",
69
69
  "aria-checked": r,
70
70
  "aria-labelledby": `${_}-${t.id}-label`,
71
71
  "data-selected": r || void 0,
72
72
  className: e.row,
73
73
  ref: i,
74
- ...s,
74
+ ...a,
75
75
  onClick: () => x(t.id),
76
76
  onKeyDown: (e) => {
77
- s.onKeyDown(e), (e.key === "Enter" || e.key === " ") && (e.preventDefault(), x(t.id));
77
+ a.onKeyDown(e), (e.key === "Enter" || e.key === " ") && (e.preventDefault(), x(t.id));
78
78
  },
79
79
  children: [
80
- /* @__PURE__ */ a("div", {
80
+ /* @__PURE__ */ o("div", {
81
81
  className: e.cell,
82
82
  "aria-hidden": "true",
83
- children: /* @__PURE__ */ a("span", { className: e.indicator })
83
+ children: /* @__PURE__ */ o("span", { className: e.indicator })
84
84
  }),
85
- /* @__PURE__ */ a("div", {
85
+ /* @__PURE__ */ o("div", {
86
86
  className: e.cell,
87
87
  id: `${_}-${t.id}-label`,
88
88
  children: t.cells[0]
89
89
  }),
90
- t.cells.slice(1).map((t, n) => /* @__PURE__ */ a("div", {
90
+ t.cells.slice(1).map((t, n) => /* @__PURE__ */ o("div", {
91
91
  role: "cell",
92
92
  className: e.cell,
93
93
  children: t
@@ -2,94 +2,96 @@
2
2
 
3
3
  import e from "./tabs.module.js";
4
4
  import { cn as t, useSignal as n, useSignals as r } from "@cascivo/core";
5
- import { jsx as i } from "react/jsx-runtime";
6
- import { createContext as a, useId as o, useRef as s } from "react";
5
+ import { createContext as i, forwardRef as a, useId as o, useRef as s } from "react";
6
+ import { jsx as c } from "react/jsx-runtime";
7
7
  //#region ../components/src/tabs/tabs.tsx
8
- var c = a(null);
9
- function l({ defaultValue: r, value: a, onValueChange: s, className: l, children: u }) {
10
- let d = o(), f = n(a ?? r ?? "");
11
- a !== void 0 && (f.value = a);
8
+ var l = i(null);
9
+ function u({ defaultValue: r, value: i, onValueChange: a, className: s, children: u }) {
10
+ let d = o(), f = n(i ?? r ?? "");
11
+ i !== void 0 && (f.value = i);
12
12
  let p = {
13
13
  active: f,
14
14
  baseId: d,
15
15
  setValue: (e) => {
16
- a === void 0 && (f.value = e), s?.(e);
16
+ i === void 0 && (f.value = e), a?.(e);
17
17
  }
18
18
  };
19
- return /* @__PURE__ */ i(c.Provider, {
19
+ return /* @__PURE__ */ c(l.Provider, {
20
20
  value: p,
21
- children: /* @__PURE__ */ i("div", {
22
- className: t(e.tabs, l),
21
+ children: /* @__PURE__ */ c("div", {
22
+ className: t(e.tabs, s),
23
23
  children: u
24
24
  })
25
25
  });
26
26
  }
27
- function u({ className: n, children: r, ...a }) {
28
- let o = s(null);
29
- return /* @__PURE__ */ i(c.Consumer, { children: (s) => /* @__PURE__ */ i("div", {
30
- ref: o,
27
+ function d({ className: n, children: r, ...i }) {
28
+ let a = s(null);
29
+ return /* @__PURE__ */ c(l.Consumer, { children: (o) => /* @__PURE__ */ c("div", {
30
+ ref: a,
31
31
  role: "tablist",
32
32
  className: t(e.list, n),
33
33
  onKeyDown: (e) => {
34
- if (!s || ![
34
+ if (!o || ![
35
35
  "ArrowRight",
36
36
  "ArrowLeft",
37
37
  "Home",
38
38
  "End"
39
39
  ].includes(e.key)) return;
40
- let t = Array.from(o.current?.querySelectorAll("[role=\"tab\"]:not([disabled])") ?? []);
40
+ let t = Array.from(a.current?.querySelectorAll("[role=\"tab\"]:not([disabled])") ?? []);
41
41
  if (t.length === 0) return;
42
42
  e.preventDefault();
43
- let n = t.findIndex((e) => e.dataset.value === s.active.value), r = n;
43
+ let n = t.findIndex((e) => e.dataset.value === o.active.value), r = n;
44
44
  e.key === "ArrowRight" ? r = (n + 1) % t.length : e.key === "ArrowLeft" ? r = (n - 1 + t.length) % t.length : e.key === "Home" ? r = 0 : e.key === "End" && (r = t.length - 1);
45
45
  let i = t[r];
46
- i?.focus(), i?.dataset.value && s.setValue(i.dataset.value);
46
+ i?.focus(), i?.dataset.value && o.setValue(i.dataset.value);
47
47
  },
48
- ...a,
48
+ ...i,
49
49
  children: r
50
50
  }) });
51
51
  }
52
- function d(e) {
53
- return /* @__PURE__ */ i(c.Consumer, { children: (t) => t ? /* @__PURE__ */ i(f, {
54
- store: t,
52
+ var f = a(function(e, t) {
53
+ return /* @__PURE__ */ c(l.Consumer, { children: (n) => n ? /* @__PURE__ */ c(p, {
54
+ store: n,
55
+ buttonRef: t,
55
56
  ...e
56
57
  }) : null });
57
- }
58
- function f({ store: n, value: a, className: o, children: s, disabled: c, ...l }) {
58
+ });
59
+ function p({ store: n, value: i, className: a, children: o, disabled: s, buttonRef: l, ...u }) {
59
60
  r();
60
- let u = n.active.value === a;
61
- return /* @__PURE__ */ i("button", {
61
+ let d = n.active.value === i;
62
+ return /* @__PURE__ */ c("button", {
62
63
  type: "button",
63
64
  role: "tab",
64
- id: `${n.baseId}-trigger-${a}`,
65
- "aria-selected": u,
66
- "aria-controls": `${n.baseId}-content-${a}`,
67
- tabIndex: u ? 0 : -1,
68
- "data-state": u ? "active" : "inactive",
69
- "data-value": a,
70
- disabled: c,
71
- className: t(e.trigger, o),
72
- onClick: () => n.setValue(a),
73
- ...l,
74
- children: s
65
+ id: `${n.baseId}-trigger-${i}`,
66
+ "aria-selected": d,
67
+ "aria-controls": `${n.baseId}-content-${i}`,
68
+ tabIndex: d ? 0 : -1,
69
+ "data-state": d ? "active" : "inactive",
70
+ "data-value": i,
71
+ disabled: s,
72
+ className: t(e.trigger, a),
73
+ onClick: () => n.setValue(i),
74
+ ref: l,
75
+ ...u,
76
+ children: o
75
77
  });
76
78
  }
77
- function p(e) {
78
- return /* @__PURE__ */ i(c.Consumer, { children: (t) => t ? /* @__PURE__ */ i(m, {
79
+ function m(e) {
80
+ return /* @__PURE__ */ c(l.Consumer, { children: (t) => t ? /* @__PURE__ */ c(h, {
79
81
  store: t,
80
82
  ...e
81
83
  }) : null });
82
84
  }
83
- function m({ store: n, value: a, className: o, children: s, ...c }) {
84
- return r(), n.active.value === a ? /* @__PURE__ */ i("div", {
85
+ function h({ store: n, value: i, className: a, children: o, ...s }) {
86
+ return r(), n.active.value === i ? /* @__PURE__ */ c("div", {
85
87
  role: "tabpanel",
86
- id: `${n.baseId}-content-${a}`,
87
- "aria-labelledby": `${n.baseId}-trigger-${a}`,
88
+ id: `${n.baseId}-content-${i}`,
89
+ "aria-labelledby": `${n.baseId}-trigger-${i}`,
88
90
  tabIndex: 0,
89
- className: t(e.content, o),
90
- ...c,
91
- children: s
91
+ className: t(e.content, a),
92
+ ...s,
93
+ children: o
92
94
  }) : null;
93
95
  }
94
96
  //#endregion
95
- export { l as Tabs, p as TabsContent, u as TabsList, d as TabsTrigger };
97
+ export { u as Tabs, m as TabsContent, d as TabsList, f as TabsTrigger };
@@ -1,64 +1,64 @@
1
1
  "use client";
2
2
 
3
3
  import e from "./tags-input.module.js";
4
- import { cn as t, useSignal as n, useSignals as r } from "@cascivo/core";
5
- import { builtin as i, t as a } from "@cascivo/i18n";
6
- import { jsx as o, jsxs as s } from "react/jsx-runtime";
7
- import { useRef as c } from "react";
4
+ import { cn as t, focusElement as n, useSignal as r, useSignals as i } from "@cascivo/core";
5
+ import { useRef as a } from "react";
6
+ import { builtin as o, t as s } from "@cascivo/i18n";
7
+ import { jsx as c, jsxs as l } from "react/jsx-runtime";
8
8
  //#region ../components/src/tags-input/tags-input.tsx
9
- function l({ value: l, onValueChange: u, placeholder: d, validate: f, max: p, disabled: m = !1, className: h, ...g }) {
10
- r();
11
- let _ = n(""), v = c(null);
12
- function y(e) {
9
+ function u({ value: u, onValueChange: d, placeholder: f, validate: p, max: m, disabled: h = !1, className: g, ..._ }) {
10
+ i();
11
+ let v = r(""), y = a(null);
12
+ function b(e) {
13
13
  let t = e.trim();
14
- t && (p !== void 0 && l.length >= p || l.includes(t) || f && !f(t) || (u([...l, t]), _.value = ""));
14
+ t && (m !== void 0 && u.length >= m || u.includes(t) || p && !p(t) || (d([...u, t]), v.value = ""));
15
15
  }
16
- function b(e) {
17
- u(l.filter((t, n) => n !== e));
16
+ function x(e) {
17
+ d(u.filter((t, n) => n !== e));
18
18
  }
19
- let x = d ?? a(i.tagsInput.placeholder);
20
- return /* @__PURE__ */ s("div", {
21
- className: t(e.wrapper, h),
22
- "data-disabled": m ? "" : void 0,
23
- onClick: () => v.current?.focus(),
24
- ...g,
25
- children: [l.map((t, n) => {
26
- let r = f ? !f(t) : !1;
27
- return /* @__PURE__ */ s("span", {
19
+ let S = f ?? s(o.tagsInput.placeholder);
20
+ return /* @__PURE__ */ l("div", {
21
+ className: t(e.wrapper, g),
22
+ "data-disabled": h ? "" : void 0,
23
+ onClick: () => n(y.current),
24
+ ..._,
25
+ children: [u.map((t, n) => {
26
+ let r = p ? !p(t) : !1;
27
+ return /* @__PURE__ */ l("span", {
28
28
  className: e.tag,
29
29
  "data-state": r ? "invalid" : void 0,
30
- children: [t, /* @__PURE__ */ o("button", {
30
+ children: [t, /* @__PURE__ */ c("button", {
31
31
  type: "button",
32
32
  className: e.dismiss,
33
- "aria-label": a(i.tagsInput.remove, { tag: t }),
34
- disabled: m,
33
+ "aria-label": s(o.tagsInput.remove, { tag: t }),
34
+ disabled: h,
35
35
  onClick: (e) => {
36
- e.stopPropagation(), b(n);
36
+ e.stopPropagation(), x(n);
37
37
  },
38
- children: /* @__PURE__ */ o("span", {
38
+ children: /* @__PURE__ */ c("span", {
39
39
  "aria-hidden": "true",
40
40
  children: "×"
41
41
  })
42
42
  })]
43
43
  }, n);
44
- }), /* @__PURE__ */ o("input", {
45
- ref: v,
44
+ }), /* @__PURE__ */ c("input", {
45
+ ref: y,
46
46
  className: e.input,
47
- value: _.value,
48
- "aria-label": a(i.tagsInput.label),
49
- placeholder: l.length === 0 ? x : void 0,
50
- disabled: m,
47
+ value: v.value,
48
+ "aria-label": s(o.tagsInput.label),
49
+ placeholder: u.length === 0 ? S : void 0,
50
+ disabled: h,
51
51
  onChange: (e) => {
52
- _.value = e.currentTarget.value;
52
+ v.value = e.currentTarget.value;
53
53
  },
54
54
  onKeyDown: (e) => {
55
- e.key === "Enter" || e.key === "," ? (e.preventDefault(), y(_.value)) : e.key === "Backspace" && !_.value && b(l.length - 1);
55
+ e.key === "Enter" || e.key === "," ? (e.preventDefault(), b(v.value)) : e.key === "Backspace" && !v.value && x(u.length - 1);
56
56
  },
57
57
  onBlur: () => {
58
- _.value && y(_.value);
58
+ v.value && b(v.value);
59
59
  }
60
60
  })]
61
61
  });
62
62
  }
63
63
  //#endregion
64
- export { l as TagsInput };
64
+ export { u as TagsInput };
@@ -2,55 +2,56 @@
2
2
 
3
3
  import e from "./textarea.module.js";
4
4
  import { cn as t, createMachine as n, useMachine as r } from "@cascivo/core";
5
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
5
+ import { forwardRef as i } from "react";
6
+ import { jsx as a, jsxs as o } from "react/jsx-runtime";
6
7
  //#region ../components/src/textarea/textarea.tsx
7
- var o = n({
8
+ var s = n({
8
9
  initial: "idle",
9
10
  states: {
10
11
  idle: { on: { FOCUS: "focused" } },
11
12
  focused: { on: { BLUR: "idle" } }
12
13
  }
13
- });
14
- function s({ label: n, hint: s, error: c, resize: l = "vertical", rows: u = 4, className: d, id: f, onFocus: p, onBlur: m, ...h }) {
15
- let [g, _] = r(o), v = f ?? (n ? `cascade-textarea-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0);
16
- return /* @__PURE__ */ a("div", {
14
+ }), c = i(function({ label: n, hint: i, error: c, resize: l = "vertical", rows: u = 4, className: d, id: f, onFocus: p, onBlur: m, ...h }, g) {
15
+ let [_, v] = r(s), y = f ?? (n ? `cascade-textarea-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0);
16
+ return /* @__PURE__ */ o("div", {
17
17
  className: t(e.wrapper, d),
18
- "data-state": c ? "error" : g.value,
18
+ "data-state": c ? "error" : _.value,
19
19
  "data-resize": l,
20
20
  children: [
21
- n && /* @__PURE__ */ i("label", {
21
+ n && /* @__PURE__ */ a("label", {
22
22
  className: e.label,
23
- htmlFor: v,
23
+ htmlFor: y,
24
24
  children: n
25
25
  }),
26
- /* @__PURE__ */ i("textarea", {
27
- id: v,
26
+ /* @__PURE__ */ a("textarea", {
27
+ ref: g,
28
+ id: y,
28
29
  rows: u,
29
30
  "aria-multiline": "true",
30
31
  className: e.textarea,
31
32
  "aria-invalid": c ? !0 : void 0,
32
- "aria-describedby": c ? `${v}-error` : s ? `${v}-hint` : void 0,
33
+ "aria-describedby": c ? `${y}-error` : i ? `${y}-hint` : void 0,
33
34
  onFocus: (e) => {
34
- _("FOCUS"), p?.(e);
35
+ v("FOCUS"), p?.(e);
35
36
  },
36
37
  onBlur: (e) => {
37
- _("BLUR"), m?.(e);
38
+ v("BLUR"), m?.(e);
38
39
  },
39
40
  ...h
40
41
  }),
41
- c && /* @__PURE__ */ i("span", {
42
- id: `${v}-error`,
42
+ c && /* @__PURE__ */ a("span", {
43
+ id: `${y}-error`,
43
44
  className: e.error,
44
45
  role: "alert",
45
46
  children: c
46
47
  }),
47
- !c && s && /* @__PURE__ */ i("span", {
48
- id: `${v}-hint`,
48
+ !c && i && /* @__PURE__ */ a("span", {
49
+ id: `${y}-hint`,
49
50
  className: e.hint,
50
- children: s
51
+ children: i
51
52
  })
52
53
  ]
53
54
  });
54
- }
55
+ });
55
56
  //#endregion
56
- export { s as Textarea };
57
+ export { c as Textarea };
@@ -2,61 +2,62 @@
2
2
 
3
3
  import e from "./time-picker.module.js";
4
4
  import { cn as t, createMachine as n, useMachine as r, useSignals as i } from "@cascivo/core";
5
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
5
+ import { forwardRef as a } from "react";
6
+ import { jsx as o, jsxs as s } from "react/jsx-runtime";
6
7
  //#region ../components/src/time-picker/time-picker.tsx
7
- var s = n({
8
+ var c = n({
8
9
  initial: "idle",
9
10
  states: {
10
11
  idle: { on: { FOCUS: "focused" } },
11
12
  focused: { on: { BLUR: "idle" } }
12
13
  }
13
- });
14
- function c({ value: n, defaultValue: c, onValueChange: l, onChange: u, min: d, max: f, step: p, label: m, hint: h, error: g, size: _ = "md", className: v, id: y, onFocus: b, onBlur: x, ...S }) {
14
+ }), l = a(function({ value: n, defaultValue: a, onValueChange: l, onChange: u, min: d, max: f, step: p, label: m, hint: h, error: g, size: _ = "md", className: v, id: y, onFocus: b, onBlur: x, ...S }, C) {
15
15
  i();
16
- let [C, w] = r(s), T = y ?? (m ? `cascade-time-picker-${m.toLowerCase().replace(/\s+/g, "-")}` : void 0);
17
- return /* @__PURE__ */ o("div", {
16
+ let [w, T] = r(c), E = y ?? (m ? `cascade-time-picker-${m.toLowerCase().replace(/\s+/g, "-")}` : void 0);
17
+ return /* @__PURE__ */ s("div", {
18
18
  className: t(e.wrapper, v),
19
- "data-state": g ? "error" : C.value,
19
+ "data-state": g ? "error" : w.value,
20
20
  "data-size": _,
21
21
  children: [
22
- m && /* @__PURE__ */ a("label", {
22
+ m && /* @__PURE__ */ o("label", {
23
23
  className: e.label,
24
- htmlFor: T,
24
+ htmlFor: E,
25
25
  children: m
26
26
  }),
27
- /* @__PURE__ */ a("input", {
28
- id: T,
27
+ /* @__PURE__ */ o("input", {
28
+ id: E,
29
29
  type: "time",
30
30
  className: e.input,
31
31
  value: n,
32
- defaultValue: c,
32
+ defaultValue: a,
33
33
  min: d,
34
34
  max: f,
35
35
  step: p,
36
36
  "aria-invalid": g ? !0 : void 0,
37
- "aria-describedby": g ? `${T}-error` : h ? `${T}-hint` : void 0,
37
+ "aria-describedby": g ? `${E}-error` : h ? `${E}-hint` : void 0,
38
38
  onChange: (e) => (l ?? u)?.(e.target.value),
39
39
  onFocus: (e) => {
40
- w("FOCUS"), b?.(e);
40
+ T("FOCUS"), b?.(e);
41
41
  },
42
42
  onBlur: (e) => {
43
- w("BLUR"), x?.(e);
43
+ T("BLUR"), x?.(e);
44
44
  },
45
+ ref: C,
45
46
  ...S
46
47
  }),
47
- g && /* @__PURE__ */ a("span", {
48
- id: `${T}-error`,
48
+ g && /* @__PURE__ */ o("span", {
49
+ id: `${E}-error`,
49
50
  className: e.error,
50
51
  role: "alert",
51
52
  children: g
52
53
  }),
53
- !g && h && /* @__PURE__ */ a("span", {
54
- id: `${T}-hint`,
54
+ !g && h && /* @__PURE__ */ o("span", {
55
+ id: `${E}-hint`,
55
56
  className: e.hint,
56
57
  children: h
57
58
  })
58
59
  ]
59
60
  });
60
- }
61
+ });
61
62
  //#endregion
62
- export { c as TimePicker };
63
+ export { l as TimePicker };
@@ -1,40 +1,47 @@
1
1
  "use client";
2
2
 
3
3
  import e from "./timeline.module.js";
4
- import { cn as t, normalizeProgress as n } from "@cascivo/core";
5
- import { jsx as r, jsxs as i } from "react/jsx-runtime";
4
+ import { cn as t, normalizeProgress as n, normalizeTone as r } from "@cascivo/core";
5
+ import { jsx as i, jsxs as a } from "react/jsx-runtime";
6
6
  //#region ../components/src/timeline/timeline.tsx
7
- var a = {
7
+ var o = {
8
8
  pending: "upcoming",
9
9
  active: "current",
10
10
  complete: "complete",
11
11
  error: "current"
12
+ }, s = {
13
+ neutral: "neutral",
14
+ info: "info",
15
+ success: "success",
16
+ warning: "warning",
17
+ danger: "danger"
12
18
  };
13
- function o({ items: o, orientation: s = "vertical", className: c, ...l }) {
14
- return /* @__PURE__ */ r("ol", {
15
- "data-orientation": s,
16
- className: t(e.list, c),
17
- ...l,
18
- children: o.map((t) => /* @__PURE__ */ i("li", {
19
- "data-status": a[n(t.status ?? "pending")] ?? "upcoming",
19
+ function c({ items: c, orientation: l = "vertical", className: u, ...d }) {
20
+ return /* @__PURE__ */ i("ol", {
21
+ "data-orientation": l,
22
+ className: t(e.list, u),
23
+ ...d,
24
+ children: c.map((t) => /* @__PURE__ */ a("li", {
25
+ "data-status": o[n(t.status ?? "pending")] ?? "upcoming",
26
+ "data-tone": t.tone ? s[r(t.tone)] ?? t.tone : void 0,
20
27
  "aria-current": n(t.status ?? "pending") === "active" ? "step" : void 0,
21
28
  className: e.item,
22
- children: [/* @__PURE__ */ r("span", {
29
+ children: [/* @__PURE__ */ i("span", {
23
30
  className: e.marker,
24
31
  "aria-hidden": "true",
25
32
  children: t.icon
26
- }), /* @__PURE__ */ i("div", {
33
+ }), /* @__PURE__ */ a("div", {
27
34
  className: e.content,
28
35
  children: [
29
- /* @__PURE__ */ r("div", {
36
+ /* @__PURE__ */ i("div", {
30
37
  className: e.title,
31
38
  children: t.title
32
39
  }),
33
- t.time ? /* @__PURE__ */ r("time", {
40
+ t.time ? /* @__PURE__ */ i("time", {
34
41
  className: e.time,
35
42
  children: t.time
36
43
  }) : null,
37
- t.description ? /* @__PURE__ */ r("div", {
44
+ t.description ? /* @__PURE__ */ i("div", {
38
45
  className: e.description,
39
46
  children: t.description
40
47
  }) : null
@@ -44,4 +51,4 @@ function o({ items: o, orientation: s = "vertical", className: c, ...l }) {
44
51
  });
45
52
  }
46
53
  //#endregion
47
- export { o as Timeline };
54
+ export { c as Timeline };
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
 
3
3
  var e = {
4
- list: "_list_1f4du_2",
5
- item: "_item_1f4du_21",
6
- marker: "_marker_1f4du_63",
7
- content: "_content_1f4du_96",
8
- title: "_title_1f4du_103",
9
- time: "_time_1f4du_110",
10
- description: "_description_1f4du_115"
4
+ list: "_list_xfuv2_2",
5
+ item: "_item_xfuv2_21",
6
+ marker: "_marker_xfuv2_63",
7
+ content: "_content_xfuv2_129",
8
+ title: "_title_xfuv2_136",
9
+ time: "_time_xfuv2_143",
10
+ description: "_description_xfuv2_148"
11
11
  };
12
12
  //#endregion
13
13
  export { e as default };