@cascivo/react 0.13.0 → 0.13.1

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 (160) 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 +202 -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/side-nav/side-nav.js +91 -91
  112. package/dist/node/skip-nav/skip-nav.js +12 -12
  113. package/dist/node/slider/slider.js +13 -11
  114. package/dist/node/structured-list/structured-list.js +23 -23
  115. package/dist/node/tabs/tabs.js +49 -47
  116. package/dist/node/tags-input/tags-input.js +35 -35
  117. package/dist/node/textarea/textarea.js +22 -21
  118. package/dist/node/time-picker/time-picker.js +22 -21
  119. package/dist/node/toast/toast.js +15 -15
  120. package/dist/node/toc/toc.js +8 -8
  121. package/dist/node/toggle/toggle.js +15 -13
  122. package/dist/node/toggle-group/toggle-group.js +10 -10
  123. package/dist/node/toggletip/toggletip.js +9 -9
  124. package/dist/node/tooltip/tooltip.js +5 -5
  125. package/dist/node/tree-view/tree-view.js +32 -32
  126. package/dist/notification/notification.js +26 -26
  127. package/dist/number-input/number-input.js +52 -50
  128. package/dist/otp-input/otp-input.js +8 -8
  129. package/dist/password-input/password-input.js +28 -27
  130. package/dist/popover/popover.js +26 -24
  131. package/dist/pull-to-refresh/pull-to-refresh.js +13 -13
  132. package/dist/radial-progress/radial-progress.js +5 -5
  133. package/dist/radio/radio.js +23 -22
  134. package/dist/radio-card/radio-card.js +27 -26
  135. package/dist/react/src/index.js +3 -3
  136. package/dist/react/src/theme.js +30 -19
  137. package/dist/resizable/resizable.js +11 -11
  138. package/dist/scroll-area/scroll-area.js +4 -4
  139. package/dist/search/search.js +49 -49
  140. package/dist/select/select.js +27 -26
  141. package/dist/sheet/sheet.css +1 -1
  142. package/dist/sheet/sheet.js +11 -10
  143. package/dist/sheet/sheet.module.js +5 -5
  144. package/dist/side-nav/side-nav.js +91 -91
  145. package/dist/skip-nav/skip-nav.js +12 -12
  146. package/dist/slider/slider.js +13 -11
  147. package/dist/structured-list/structured-list.js +23 -23
  148. package/dist/styles.css +55 -5
  149. package/dist/tabs/tabs.js +49 -47
  150. package/dist/tags-input/tags-input.js +35 -35
  151. package/dist/textarea/textarea.js +22 -21
  152. package/dist/time-picker/time-picker.js +22 -21
  153. package/dist/toast/toast.js +15 -15
  154. package/dist/toc/toc.js +8 -8
  155. package/dist/toggle/toggle.js +15 -13
  156. package/dist/toggle-group/toggle-group.js +10 -10
  157. package/dist/toggletip/toggletip.js +9 -9
  158. package/dist/tooltip/tooltip.js +5 -5
  159. package/dist/tree-view/tree-view.js +32 -32
  160. package/package.json +10 -4
@@ -1,65 +1,65 @@
1
1
  "use client";
2
2
 
3
3
  import e from "./fab.module.js";
4
- import { DismissableLayer as t, Presence as n, cn as r, useControllableSignal as i, useRovingFocus as a, useSignalEffect as o, useSignals as s } from "@cascivo/core";
5
- import { jsx as c, jsxs as l } from "react/jsx-runtime";
6
- import { useId as u, useRef as d } from "react";
4
+ import { DismissableLayer as t, Presence as n, cn as r, focusElement as i, useControllableSignal as a, useRovingFocus as o, useSignalEffect as s, useSignals as c } from "@cascivo/core";
5
+ import { useId as l, useRef as u } from "react";
6
+ import { jsx as d, jsxs as f } from "react/jsx-runtime";
7
7
  //#region ../components/src/fab/fab.tsx
8
- function f({ children: f, label: p, onClick: m, actions: h, position: g = "bottom-end", open: _, defaultOpen: v, onOpenChange: y, className: b }) {
9
- s();
10
- let x = h != null && h.length > 0, [S, C] = i({
11
- value: _,
12
- defaultValue: v ?? !1,
13
- onChange: y
14
- }), w = a({
8
+ function p({ children: p, label: m, onClick: h, actions: g, position: _ = "bottom-end", open: v, defaultOpen: y, onOpenChange: b, className: x }) {
9
+ c();
10
+ let S = g != null && g.length > 0, [C, w] = a({
11
+ value: v,
12
+ defaultValue: y ?? !1,
13
+ onChange: b
14
+ }), T = o({
15
15
  orientation: "vertical",
16
16
  loop: !0
17
- }), T = d(null), E = d(null), D = u(), O = d(!1);
18
- o(() => {
19
- let e = x && S.value;
20
- e && !O.current ? E.current?.querySelector("[role=\"menuitem\"]:not([aria-disabled=\"true\"])")?.focus() : !e && O.current && T.current?.focus(), O.current = e;
17
+ }), E = u(null), D = u(null), O = l(), k = u(!1);
18
+ s(() => {
19
+ let e = S && C.value;
20
+ e && !k.current ? D.current?.querySelector("[role=\"menuitem\"]:not([aria-disabled=\"true\"])")?.focus() : !e && k.current && i(E.current), k.current = e;
21
21
  });
22
- let k = (e) => {
23
- e.disabled || (e.onSelect(), C(!1));
24
- }, A = /* @__PURE__ */ c("button", {
25
- ref: T,
22
+ let A = (e) => {
23
+ e.disabled || (e.onSelect(), w(!1));
24
+ }, j = /* @__PURE__ */ d("button", {
25
+ ref: E,
26
26
  type: "button",
27
- "aria-label": p,
27
+ "aria-label": m,
28
28
  className: e.fab,
29
- ...x ? {
29
+ ...S ? {
30
30
  "aria-haspopup": "menu",
31
- "aria-expanded": S.value,
32
- "aria-controls": D,
33
- "data-state": S.value ? "open" : "closed",
34
- onClick: () => C(!S.value)
35
- } : { onClick: m },
36
- children: /* @__PURE__ */ c("span", {
31
+ "aria-expanded": C.value,
32
+ "aria-controls": O,
33
+ "data-state": C.value ? "open" : "closed",
34
+ onClick: () => w(!C.value)
35
+ } : { onClick: h },
36
+ children: /* @__PURE__ */ d("span", {
37
37
  className: e.icon,
38
38
  "aria-hidden": "true",
39
- children: f
39
+ children: p
40
40
  })
41
41
  });
42
- return x ? /* @__PURE__ */ c(t, {
43
- onDismiss: () => C(!1),
44
- escapeDismisses: S.value,
45
- disableOutsidePointer: !S.value,
46
- children: /* @__PURE__ */ l("div", {
47
- className: r(e.root, b),
48
- "data-position": g,
49
- children: [/* @__PURE__ */ c(n, {
50
- present: S,
51
- children: /* @__PURE__ */ c("menu", {
52
- ref: E,
53
- id: D,
42
+ return S ? /* @__PURE__ */ d(t, {
43
+ onDismiss: () => w(!1),
44
+ escapeDismisses: C.value,
45
+ disableOutsidePointer: !C.value,
46
+ children: /* @__PURE__ */ f("div", {
47
+ className: r(e.root, x),
48
+ "data-position": _,
49
+ children: [/* @__PURE__ */ d(n, {
50
+ present: C,
51
+ children: /* @__PURE__ */ d("menu", {
52
+ ref: D,
53
+ id: O,
54
54
  role: "menu",
55
- "aria-label": p,
55
+ "aria-label": m,
56
56
  className: e.dial,
57
- children: h.map((t, n) => {
58
- let r = w.getItemProps(n);
59
- return /* @__PURE__ */ c("li", {
57
+ children: g.map((t, n) => {
58
+ let r = T.getItemProps(n);
59
+ return /* @__PURE__ */ d("li", {
60
60
  role: "presentation",
61
61
  className: e.dialItem,
62
- children: /* @__PURE__ */ l("button", {
62
+ children: /* @__PURE__ */ f("button", {
63
63
  ref: r.ref,
64
64
  type: "button",
65
65
  role: "menuitem",
@@ -68,11 +68,11 @@ function f({ children: f, label: p, onClick: m, actions: h, position: g = "botto
68
68
  className: e.action,
69
69
  onKeyDown: r.onKeyDown,
70
70
  onFocus: r.onFocus,
71
- onClick: () => k(t),
72
- children: [/* @__PURE__ */ c("span", {
71
+ onClick: () => A(t),
72
+ children: [/* @__PURE__ */ d("span", {
73
73
  className: e.actionLabel,
74
74
  children: t.label
75
- }), /* @__PURE__ */ c("span", {
75
+ }), /* @__PURE__ */ d("span", {
76
76
  className: e.actionIcon,
77
77
  "aria-hidden": "true",
78
78
  children: t.icon
@@ -81,13 +81,13 @@ function f({ children: f, label: p, onClick: m, actions: h, position: g = "botto
81
81
  }, t.id ?? n);
82
82
  })
83
83
  })
84
- }), A]
84
+ }), j]
85
85
  })
86
- }) : /* @__PURE__ */ c("div", {
87
- className: r(e.root, b),
88
- "data-position": g,
89
- children: A
86
+ }) : /* @__PURE__ */ d("div", {
87
+ className: r(e.root, x),
88
+ "data-position": _,
89
+ children: j
90
90
  });
91
91
  }
92
92
  //#endregion
93
- export { f as Fab };
93
+ export { p as Fab };
@@ -3,8 +3,8 @@
3
3
  import { Label as e } from "../label/label.js";
4
4
  import t from "./field.module.js";
5
5
  import { cn as n, useId as r } from "@cascivo/core";
6
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
7
- import { Children as o, cloneElement as s, isValidElement as c } from "react";
6
+ import { Children as i, cloneElement as a, isValidElement as o } from "react";
7
+ import { jsx as s, jsxs as c } from "react/jsx-runtime";
8
8
  //#region ../components/src/field/field.tsx
9
9
  var l = /* @__PURE__ */ new Set();
10
10
  function u() {
@@ -17,25 +17,25 @@ function d(e, t) {
17
17
  }
18
18
  function f({ label: l, description: u, error: f, required: p = !1, disabled: m = !1, id: h, children: g, className: _ }) {
19
19
  let v = r("cascade-field"), y = h ?? v, b = `${y}-description`, x = `${y}-error`, S = [u ? b : null, f ? x : null].filter(Boolean).join(" ") || void 0, C = { id: y };
20
- S && (C["aria-describedby"] = S), f && (C["aria-invalid"] = !0), (m || g.props.disabled) && (C.disabled = !0), c(g) && d(l, g);
21
- let w = c(g) ? s(o.only(g), C) : g;
22
- return /* @__PURE__ */ a("div", {
20
+ S && (C["aria-describedby"] = S), f && (C["aria-invalid"] = !0), (m || g.props.disabled) && (C.disabled = !0), o(g) && d(l, g);
21
+ let w = o(g) ? a(i.only(g), C) : g;
22
+ return /* @__PURE__ */ c("div", {
23
23
  className: n(t.field, _),
24
24
  "data-disabled": m ? "" : void 0,
25
25
  children: [
26
- l && /* @__PURE__ */ i(e, {
26
+ l && /* @__PURE__ */ s(e, {
27
27
  htmlFor: y,
28
28
  required: p,
29
29
  disabled: m,
30
30
  children: l
31
31
  }),
32
32
  w,
33
- u && /* @__PURE__ */ i("p", {
33
+ u && /* @__PURE__ */ s("p", {
34
34
  id: b,
35
35
  className: t.description,
36
36
  children: u
37
37
  }),
38
- f && /* @__PURE__ */ i("p", {
38
+ f && /* @__PURE__ */ s("p", {
39
39
  id: x,
40
40
  role: "alert",
41
41
  className: t.error,
@@ -3,9 +3,9 @@
3
3
  import { Spinner as e } from "../spinner/spinner.js";
4
4
  import t from "./file-uploader.module.js";
5
5
  import { cn as n, useSignal as r, useSignals as i } from "@cascivo/core";
6
- import { builtin as a, t as o } from "@cascivo/i18n";
7
- import { jsx as s, jsxs as c } from "react/jsx-runtime";
8
- import { useRef as l } from "react";
6
+ import { useRef as a } from "react";
7
+ import { builtin as o, t as s } from "@cascivo/i18n";
8
+ import { jsx as c, jsxs as l } from "react/jsx-runtime";
9
9
  //#region ../components/src/file-uploader/file-uploader.tsx
10
10
  function u(e, t) {
11
11
  let n = t.split(",").map((e) => e.trim()).filter(Boolean);
@@ -16,21 +16,21 @@ function d(e) {
16
16
  }
17
17
  function f({ files: f = [], onFilesAdded: p, onRemove: m, multiple: h = !1, accept: g, maxSize: _, onRejected: v, label: y, hint: b, labels: x, disabled: S = !1, className: C }) {
18
18
  i();
19
- let w = l(null), T = r(!1), E = y ?? x?.label ?? o(a.fileUploader.label), D = x?.drop ?? o(a.fileUploader.drop), O = x?.uploading ?? o(a.fileUploader.uploading), k = x?.complete ?? o(a.fileUploader.complete), A = x?.error ?? o(a.fileUploader.error), j = (e) => x?.remove ? x.remove.replace("{name}", e) : o(a.fileUploader.remove, { name: e }), M = `cascade-uploader-${E.toLowerCase().replace(/\s+/g, "-")}`, N = `${M}-label`, P = `${M}-hint`, F = (e) => {
19
+ let w = a(null), T = r(!1), E = y ?? x?.label ?? s(o.fileUploader.label), D = x?.drop ?? s(o.fileUploader.drop), O = x?.uploading ?? s(o.fileUploader.uploading), k = x?.complete ?? s(o.fileUploader.complete), A = x?.error ?? s(o.fileUploader.error), j = (e) => x?.remove ? x.remove.replace("{name}", e) : s(o.fileUploader.remove, { name: e }), M = `cascade-uploader-${E.toLowerCase().replace(/\s+/g, "-")}`, N = `${M}-label`, P = `${M}-hint`, F = (e) => {
20
20
  if (!e || e.length === 0) return;
21
21
  let t = h ? Array.from(e) : Array.from(e).slice(0, 1), n = [], r = [], i = [];
22
22
  for (let e of t) g && !u(e, g) ? r.push(e) : _ !== void 0 && e.size > _ ? i.push(e) : n.push(e);
23
23
  r.length > 0 && v?.(r, "type"), i.length > 0 && v?.(i, "size"), n.length > 0 && p?.(n);
24
24
  };
25
- return /* @__PURE__ */ c("div", {
25
+ return /* @__PURE__ */ l("div", {
26
26
  className: n(t.uploader, C),
27
27
  children: [
28
- /* @__PURE__ */ s("span", {
28
+ /* @__PURE__ */ c("span", {
29
29
  id: N,
30
30
  className: t.label,
31
31
  children: E
32
32
  }),
33
- /* @__PURE__ */ s("input", {
33
+ /* @__PURE__ */ c("input", {
34
34
  ref: w,
35
35
  type: "file",
36
36
  className: t.input,
@@ -43,7 +43,7 @@ function f({ files: f = [], onFilesAdded: p, onRemove: m, multiple: h = !1, acce
43
43
  F(e.target.files), e.target.value = "";
44
44
  }
45
45
  }),
46
- /* @__PURE__ */ s("button", {
46
+ /* @__PURE__ */ c("button", {
47
47
  type: "button",
48
48
  className: t.zone,
49
49
  "data-state": T.value ? "dragover" : "idle",
@@ -62,53 +62,53 @@ function f({ files: f = [], onFilesAdded: p, onRemove: m, multiple: h = !1, acce
62
62
  },
63
63
  children: D
64
64
  }),
65
- b && /* @__PURE__ */ s("span", {
65
+ b && /* @__PURE__ */ c("span", {
66
66
  id: P,
67
67
  className: t.hint,
68
68
  children: b
69
69
  }),
70
- f.length > 0 && /* @__PURE__ */ s("ul", {
70
+ f.length > 0 && /* @__PURE__ */ c("ul", {
71
71
  className: t.list,
72
72
  "aria-live": "polite",
73
- children: f.map((n) => /* @__PURE__ */ c("li", {
73
+ children: f.map((n) => /* @__PURE__ */ l("li", {
74
74
  className: t.file,
75
75
  "data-state": n.status,
76
76
  children: [
77
- /* @__PURE__ */ c("span", {
77
+ /* @__PURE__ */ l("span", {
78
78
  className: t.status,
79
79
  children: [
80
- n.status === "uploading" && /* @__PURE__ */ s(e, {
80
+ n.status === "uploading" && /* @__PURE__ */ c(e, {
81
81
  size: "sm",
82
82
  label: O
83
83
  }),
84
- n.status === "complete" && /* @__PURE__ */ s("span", {
84
+ n.status === "complete" && /* @__PURE__ */ c("span", {
85
85
  className: t["glyph-complete"],
86
86
  "aria-label": k,
87
87
  children: "✓"
88
88
  }),
89
- n.status === "error" && /* @__PURE__ */ s("span", {
89
+ n.status === "error" && /* @__PURE__ */ c("span", {
90
90
  className: t["glyph-error"],
91
91
  "aria-label": A,
92
92
  children: "✕"
93
93
  })
94
94
  ]
95
95
  }),
96
- /* @__PURE__ */ s("span", {
96
+ /* @__PURE__ */ c("span", {
97
97
  className: t.name,
98
98
  children: n.name
99
99
  }),
100
- n.size !== void 0 && /* @__PURE__ */ s("span", {
100
+ n.size !== void 0 && /* @__PURE__ */ c("span", {
101
101
  className: t.size,
102
102
  children: d(n.size)
103
103
  }),
104
- /* @__PURE__ */ s("button", {
104
+ /* @__PURE__ */ c("button", {
105
105
  type: "button",
106
106
  className: t.remove,
107
107
  "aria-label": j(n.name),
108
108
  onClick: () => m?.(n.id),
109
109
  children: "✕"
110
110
  }),
111
- n.status === "error" && n.errorMessage && /* @__PURE__ */ s("span", {
111
+ n.status === "error" && n.errorMessage && /* @__PURE__ */ c("span", {
112
112
  className: t["error-message"],
113
113
  children: n.errorMessage
114
114
  })
@@ -1,18 +1,18 @@
1
1
  "use client";
2
2
 
3
3
  import e from "./header-panel.module.js";
4
- import { cn as t, useEffectPropSignal as n, useSignalEffect as r, useSignals as i } from "@cascivo/core";
5
- import { builtin as a, t as o } from "@cascivo/i18n";
6
- import { jsx as s, jsxs as c } from "react/jsx-runtime";
7
- import { useRef as l } from "react";
4
+ import { cn as t, focusElement as n, useEffectPropSignal as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
5
+ import { useRef as o } from "react";
6
+ import { builtin as s, t as c } from "@cascivo/i18n";
7
+ import { jsx as l, jsxs as u } from "react/jsx-runtime";
8
8
  //#region ../components/src/header-panel/header-panel.tsx
9
- function u({ open: u, onClose: d, label: f, children: p, labels: m, className: h }) {
10
- i();
11
- let g = l(null), _ = l(null), v = n(u), y = l(d);
12
- return y.current = d, r(() => {
13
- let e = g.current;
14
- if (e) if (v.value) {
15
- _.current = document.activeElement;
9
+ function d({ open: d, onClose: f, label: p, children: m, labels: h, className: g }) {
10
+ a();
11
+ let _ = o(null), v = o(null), y = r(d), b = o(f);
12
+ return b.current = f, i(() => {
13
+ let e = _.current;
14
+ if (e) if (y.value) {
15
+ v.current = document.activeElement;
16
16
  try {
17
17
  e.showPopover();
18
18
  } catch {}
@@ -21,40 +21,40 @@ function u({ open: u, onClose: d, label: f, children: p, labels: m, className: h
21
21
  try {
22
22
  e.hidePopover();
23
23
  } catch {}
24
- _.current?.focus(), _.current = null;
24
+ n(v.current), v.current = null;
25
25
  }
26
- }), r(() => {
27
- let e = g.current;
26
+ }), i(() => {
27
+ let e = _.current;
28
28
  if (!e) return;
29
29
  let t = (e) => {
30
30
  let t = "newState" in e ? e.newState === "closed" : !0;
31
- v.peek() && t && y.current();
31
+ y.peek() && t && b.current();
32
32
  };
33
33
  return e.addEventListener("toggle", t), () => e.removeEventListener("toggle", t);
34
- }), /* @__PURE__ */ c("div", {
35
- ref: g,
34
+ }), /* @__PURE__ */ u("div", {
35
+ ref: _,
36
36
  popover: "auto",
37
37
  role: "region",
38
- "aria-label": f,
38
+ "aria-label": p,
39
39
  tabIndex: -1,
40
- "data-state": u ? "open" : "closed",
41
- className: t(e.panel, h),
42
- children: [/* @__PURE__ */ c("div", {
40
+ "data-state": d ? "open" : "closed",
41
+ className: t(e.panel, g),
42
+ children: [/* @__PURE__ */ u("div", {
43
43
  className: e.header,
44
- children: [/* @__PURE__ */ s("span", {
44
+ children: [/* @__PURE__ */ l("span", {
45
45
  className: e.title,
46
- children: f
47
- }), /* @__PURE__ */ s("button", {
46
+ children: p
47
+ }), /* @__PURE__ */ l("button", {
48
48
  type: "button",
49
- "aria-label": m?.close ?? o(a.headerPanel.close),
49
+ "aria-label": h?.close ?? c(s.headerPanel.close),
50
50
  className: e.close,
51
- onClick: () => y.current(),
52
- children: /* @__PURE__ */ s("svg", {
51
+ onClick: () => b.current(),
52
+ children: /* @__PURE__ */ l("svg", {
53
53
  viewBox: "0 0 16 16",
54
54
  width: "14",
55
55
  height: "14",
56
56
  "aria-hidden": "true",
57
- children: /* @__PURE__ */ s("path", {
57
+ children: /* @__PURE__ */ l("path", {
58
58
  d: "M4 4l8 8M12 4l-8 8",
59
59
  stroke: "currentColor",
60
60
  strokeWidth: "1.5",
@@ -62,11 +62,11 @@ function u({ open: u, onClose: d, label: f, children: p, labels: m, className: h
62
62
  })
63
63
  })
64
64
  })]
65
- }), /* @__PURE__ */ s("div", {
65
+ }), /* @__PURE__ */ l("div", {
66
66
  className: e.body,
67
- children: p
67
+ children: m
68
68
  })]
69
69
  });
70
70
  }
71
71
  //#endregion
72
- export { u as HeaderPanel };
72
+ export { d as HeaderPanel };
@@ -3,15 +3,15 @@
3
3
  import { usePopover as e } from "../popover/use-popover.js";
4
4
  import t from "./hover-card.module.js";
5
5
  import { useSignalEffect as n, useSignals as r } from "@cascivo/core";
6
- import { jsx as i } from "react/jsx-runtime";
7
- import { createContext as a, useRef as o } from "react";
6
+ import { createContext as i, useRef as a } from "react";
7
+ import { jsx as o } from "react/jsx-runtime";
8
8
  //#region ../components/src/hover-card/hover-card.tsx
9
- var s = a(null);
10
- function c({ children: t, openDelay: r = 300, closeDelay: a = 100 }) {
11
- let c = e(), l = o(void 0), u = o(void 0), d = o(r);
9
+ var s = i(null);
10
+ function c({ children: t, openDelay: r = 300, closeDelay: i = 100 }) {
11
+ let c = e(), l = a(void 0), u = a(void 0), d = a(r);
12
12
  d.current = r;
13
- let f = o(a);
14
- f.current = a;
13
+ let f = a(i);
14
+ f.current = i;
15
15
  let p = {
16
16
  ...c,
17
17
  open: () => {
@@ -27,17 +27,17 @@ function c({ children: t, openDelay: r = 300, closeDelay: a = 100 }) {
27
27
  };
28
28
  return n(() => () => {
29
29
  clearTimeout(l.current), clearTimeout(u.current);
30
- }), /* @__PURE__ */ i(s.Provider, {
30
+ }), /* @__PURE__ */ o(s.Provider, {
31
31
  value: p,
32
32
  children: t
33
33
  });
34
34
  }
35
35
  function l({ ctx: e, children: n }) {
36
36
  r();
37
- let { triggerRef: a, anchorName: o, open: s, close: c } = e;
38
- return /* @__PURE__ */ i("span", {
39
- ref: a,
40
- style: { anchorName: o },
37
+ let { triggerRef: i, anchorName: a, open: s, close: c } = e;
38
+ return /* @__PURE__ */ o("span", {
39
+ ref: i,
40
+ style: { anchorName: a },
41
41
  onMouseEnter: s,
42
42
  onMouseLeave: c,
43
43
  onFocus: s,
@@ -47,33 +47,33 @@ function l({ ctx: e, children: n }) {
47
47
  });
48
48
  }
49
49
  function u({ children: e }) {
50
- return /* @__PURE__ */ i(s.Consumer, { children: (t) => {
50
+ return /* @__PURE__ */ o(s.Consumer, { children: (t) => {
51
51
  if (!t) throw Error("HoverCardTrigger must be inside <HoverCard>");
52
- return /* @__PURE__ */ i(l, {
52
+ return /* @__PURE__ */ o(l, {
53
53
  ctx: t,
54
54
  children: e
55
55
  });
56
56
  } });
57
57
  }
58
- function d({ ctx: e, children: n, className: a }) {
58
+ function d({ ctx: e, children: n, className: i }) {
59
59
  r();
60
- let { popoverRef: o, anchorName: s, isOpen: c, open: l, close: u } = e;
61
- return /* @__PURE__ */ i("div", {
62
- ref: o,
60
+ let { popoverRef: a, anchorName: s, isOpen: c, open: l, close: u } = e;
61
+ return /* @__PURE__ */ o("div", {
62
+ ref: a,
63
63
  popover: "auto",
64
64
  role: "complementary",
65
65
  "data-state": c.value ? "open" : "closed",
66
66
  style: { positionAnchor: s },
67
67
  onMouseEnter: l,
68
68
  onMouseLeave: u,
69
- className: [t.content, a].filter(Boolean).join(" "),
69
+ className: [t.content, i].filter(Boolean).join(" "),
70
70
  children: n
71
71
  });
72
72
  }
73
73
  function f({ children: e, className: t }) {
74
- return /* @__PURE__ */ i(s.Consumer, { children: (n) => {
74
+ return /* @__PURE__ */ o(s.Consumer, { children: (n) => {
75
75
  if (!n) throw Error("HoverCardContent must be inside <HoverCard>");
76
- return /* @__PURE__ */ i(d, {
76
+ return /* @__PURE__ */ o(d, {
77
77
  ctx: n,
78
78
  ...t !== void 0 && { className: t },
79
79
  children: e
@@ -2,13 +2,13 @@
2
2
 
3
3
  import e from "./icon-button.module.js";
4
4
  import { Slot as t, cn as n } from "@cascivo/core";
5
- import { jsx as r } from "react/jsx-runtime";
6
- import { forwardRef as i } from "react";
5
+ import { forwardRef as r } from "react";
6
+ import { jsx as i } from "react/jsx-runtime";
7
7
  //#region ../components/src/icon-button/icon-button.tsx
8
- var a = i(function({ label: i, ariaLabel: a, icon: o, size: s = "md", variant: c = "ghost", asChild: l = !1, className: u, children: d, ...f }, p) {
9
- return /* @__PURE__ */ r(l ? t : "button", {
8
+ var a = r(function({ label: r, ariaLabel: a, icon: o, size: s = "md", variant: c = "ghost", asChild: l = !1, className: u, children: d, ...f }, p) {
9
+ return /* @__PURE__ */ i(l ? t : "button", {
10
10
  type: l ? void 0 : "button",
11
- "aria-label": i ?? a,
11
+ "aria-label": r ?? a,
12
12
  "data-size": s,
13
13
  "data-variant": c,
14
14
  className: n(e.iconButton, u),
@@ -2,53 +2,54 @@
2
2
 
3
3
  import e from "./input.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/input/input.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, size: l = "md", className: u, id: d, onFocus: f, onBlur: p, ...m }) {
15
- let [h, g] = r(o), _ = d ?? (n ? `cascade-input-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0);
16
- return /* @__PURE__ */ a("div", {
14
+ }), c = i(function({ label: n, hint: i, error: c, size: l = "md", className: u, id: d, onFocus: f, onBlur: p, ...m }, h) {
15
+ let [g, _] = r(s), v = d ?? (n ? `cascade-input-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0);
16
+ return /* @__PURE__ */ o("div", {
17
17
  className: t(e.wrapper, u),
18
- "data-state": c ? "error" : h.value,
18
+ "data-state": c ? "error" : g.value,
19
19
  "data-size": l,
20
20
  children: [
21
- n && /* @__PURE__ */ i("label", {
21
+ n && /* @__PURE__ */ a("label", {
22
22
  className: e.label,
23
- htmlFor: _,
23
+ htmlFor: v,
24
24
  children: n
25
25
  }),
26
- /* @__PURE__ */ i("input", {
27
- id: _,
26
+ /* @__PURE__ */ a("input", {
27
+ ref: h,
28
+ id: v,
28
29
  className: e.input,
29
30
  "aria-invalid": c ? !0 : void 0,
30
- "aria-describedby": c ? `${_}-error` : s ? `${_}-hint` : void 0,
31
+ "aria-describedby": c ? `${v}-error` : i ? `${v}-hint` : void 0,
31
32
  onFocus: (e) => {
32
- g("FOCUS"), f?.(e);
33
+ _("FOCUS"), f?.(e);
33
34
  },
34
35
  onBlur: (e) => {
35
- g("BLUR"), p?.(e);
36
+ _("BLUR"), p?.(e);
36
37
  },
37
38
  ...m
38
39
  }),
39
- c && /* @__PURE__ */ i("span", {
40
- id: `${_}-error`,
40
+ c && /* @__PURE__ */ a("span", {
41
+ id: `${v}-error`,
41
42
  className: e.error,
42
43
  role: "alert",
43
44
  children: c
44
45
  }),
45
- !c && s && /* @__PURE__ */ i("span", {
46
- id: `${_}-hint`,
46
+ !c && i && /* @__PURE__ */ a("span", {
47
+ id: `${v}-hint`,
47
48
  className: e.hint,
48
- children: s
49
+ children: i
49
50
  })
50
51
  ]
51
52
  });
52
- }
53
+ });
53
54
  //#endregion
54
- export { s as Input };
55
+ export { c as Input };
@@ -2,11 +2,12 @@
2
2
 
3
3
  import e from "./link.module.js";
4
4
  import { Slot as t, cn as n } from "@cascivo/core";
5
- import { jsx as r } from "react/jsx-runtime";
5
+ import { forwardRef as r } from "react";
6
+ import { jsx as i } from "react/jsx-runtime";
6
7
  //#region ../components/src/link/link.tsx
7
- function i({ variant: i = "standalone", size: a = "md", external: o = !1, asChild: s = !1, className: c, children: l, ...u }) {
8
- return /* @__PURE__ */ r(s ? t : "a", {
9
- "data-variant": i,
8
+ var a = r(function({ variant: r = "standalone", size: a = "md", external: o = !1, asChild: s = !1, className: c, children: l, ...u }, d) {
9
+ return /* @__PURE__ */ i(s ? t : "a", {
10
+ "data-variant": r,
10
11
  "data-size": a,
11
12
  "data-external": o || void 0,
12
13
  className: n(e.link, c),
@@ -14,9 +15,10 @@ function i({ variant: i = "standalone", size: a = "md", external: o = !1, asChil
14
15
  target: "_blank",
15
16
  rel: "noreferrer"
16
17
  } : {},
18
+ ref: d,
17
19
  ...u,
18
20
  children: l
19
21
  });
20
- }
22
+ });
21
23
  //#endregion
22
- export { i as Link };
24
+ export { a as Link };