@namroodinc/liquid-editorial 0.1.6 → 0.1.7

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 (142) hide show
  1. package/AGENTS.md +2 -0
  2. package/README.md +42 -0
  3. package/UPGRADING.md +68 -11
  4. package/dist/components/AppShell/index.cjs +2 -0
  5. package/dist/components/AppShell/index.cjs.map +1 -0
  6. package/dist/components/AppShell/index.d.cts +15 -0
  7. package/dist/components/AppShell/index.d.cts.map +1 -0
  8. package/dist/components/AppShell/index.d.ts +15 -0
  9. package/dist/components/AppShell/index.d.ts.map +1 -0
  10. package/dist/components/AppShell/index.js +93 -0
  11. package/dist/components/AppShell/index.js.map +1 -0
  12. package/dist/components/AppShell/style.css +79 -0
  13. package/dist/components/AssetGrid/index.cjs +1 -1
  14. package/dist/components/AssetGrid/index.cjs.map +1 -1
  15. package/dist/components/AssetGrid/index.d.cts.map +1 -1
  16. package/dist/components/AssetGrid/index.d.ts.map +1 -1
  17. package/dist/components/AssetGrid/index.js +57 -59
  18. package/dist/components/AssetGrid/index.js.map +1 -1
  19. package/dist/components/AssetGrid/style.css +8 -16
  20. package/dist/components/Board/index.cjs +1 -1
  21. package/dist/components/Board/index.cjs.map +1 -1
  22. package/dist/components/Board/index.d.cts.map +1 -1
  23. package/dist/components/Board/index.d.ts.map +1 -1
  24. package/dist/components/Board/index.js +88 -84
  25. package/dist/components/Board/index.js.map +1 -1
  26. package/dist/components/Board/style.css +17 -28
  27. package/dist/components/Button/index.cjs +1 -1
  28. package/dist/components/Button/index.cjs.map +1 -1
  29. package/dist/components/Button/index.d.cts +3 -2
  30. package/dist/components/Button/index.d.cts.map +1 -1
  31. package/dist/components/Button/index.d.ts +3 -2
  32. package/dist/components/Button/index.d.ts.map +1 -1
  33. package/dist/components/Button/index.js +1 -1
  34. package/dist/components/Button/index.js.map +1 -1
  35. package/dist/components/Button/style.css +21 -15
  36. package/dist/components/DatePicker/index.cjs +1 -1
  37. package/dist/components/DatePicker/index.cjs.map +1 -1
  38. package/dist/components/DatePicker/index.d.cts.map +1 -1
  39. package/dist/components/DatePicker/index.d.ts.map +1 -1
  40. package/dist/components/DatePicker/index.js +46 -45
  41. package/dist/components/DatePicker/index.js.map +1 -1
  42. package/dist/components/DatePicker/style.css +4 -61
  43. package/dist/components/Drawer/index.cjs +1 -1
  44. package/dist/components/Drawer/index.cjs.map +1 -1
  45. package/dist/components/Drawer/index.d.cts +10 -1
  46. package/dist/components/Drawer/index.d.cts.map +1 -1
  47. package/dist/components/Drawer/index.d.ts +10 -1
  48. package/dist/components/Drawer/index.d.ts.map +1 -1
  49. package/dist/components/Drawer/index.js +69 -47
  50. package/dist/components/Drawer/index.js.map +1 -1
  51. package/dist/components/Drawer/style.css +106 -0
  52. package/dist/components/EntryPicker/index.cjs +1 -1
  53. package/dist/components/EntryPicker/index.cjs.map +1 -1
  54. package/dist/components/EntryPicker/index.d.cts.map +1 -1
  55. package/dist/components/EntryPicker/index.d.ts.map +1 -1
  56. package/dist/components/EntryPicker/index.js +12 -11
  57. package/dist/components/EntryPicker/index.js.map +1 -1
  58. package/dist/components/EntryPicker/style.css +3 -30
  59. package/dist/components/Field/style.css +11 -3
  60. package/dist/components/Menu/index.cjs +1 -1
  61. package/dist/components/Menu/index.cjs.map +1 -1
  62. package/dist/components/Menu/index.d.cts.map +1 -1
  63. package/dist/components/Menu/index.d.ts.map +1 -1
  64. package/dist/components/Menu/index.js +11 -16
  65. package/dist/components/Menu/index.js.map +1 -1
  66. package/dist/components/Menu/style.css +7 -41
  67. package/dist/components/Modal/index.cjs +1 -1
  68. package/dist/components/Modal/index.cjs.map +1 -1
  69. package/dist/components/Modal/index.d.cts.map +1 -1
  70. package/dist/components/Modal/index.d.ts.map +1 -1
  71. package/dist/components/Modal/index.js +12 -12
  72. package/dist/components/Modal/index.js.map +1 -1
  73. package/dist/components/NumberField/index.cjs +1 -1
  74. package/dist/components/NumberField/index.cjs.map +1 -1
  75. package/dist/components/NumberField/index.js +13 -17
  76. package/dist/components/NumberField/index.js.map +1 -1
  77. package/dist/components/NumberField/style.css +1 -41
  78. package/dist/components/Popover/index.cjs +1 -1
  79. package/dist/components/Popover/index.cjs.map +1 -1
  80. package/dist/components/Popover/index.js +4 -4
  81. package/dist/components/SearchField/index.cjs +1 -1
  82. package/dist/components/SearchField/index.cjs.map +1 -1
  83. package/dist/components/SearchField/index.d.cts.map +1 -1
  84. package/dist/components/SearchField/index.d.ts.map +1 -1
  85. package/dist/components/SearchField/index.js +26 -27
  86. package/dist/components/SearchField/index.js.map +1 -1
  87. package/dist/components/SearchField/style.css +0 -21
  88. package/dist/components/Select/index.cjs +1 -1
  89. package/dist/components/Select/index.cjs.map +1 -1
  90. package/dist/components/Select/index.d.cts.map +1 -1
  91. package/dist/components/Select/index.d.ts.map +1 -1
  92. package/dist/components/Select/index.js +82 -75
  93. package/dist/components/Select/index.js.map +1 -1
  94. package/dist/components/Select/style.css +5 -38
  95. package/dist/components/SideNav/index.cjs +1 -1
  96. package/dist/components/SideNav/index.cjs.map +1 -1
  97. package/dist/components/SideNav/index.d.cts.map +1 -1
  98. package/dist/components/SideNav/index.d.ts.map +1 -1
  99. package/dist/components/SideNav/index.js +52 -49
  100. package/dist/components/SideNav/index.js.map +1 -1
  101. package/dist/components/SideNav/style.css +2 -27
  102. package/dist/components/SortableList/index.cjs +1 -1
  103. package/dist/components/SortableList/index.cjs.map +1 -1
  104. package/dist/components/SortableList/index.d.cts.map +1 -1
  105. package/dist/components/SortableList/index.d.ts.map +1 -1
  106. package/dist/components/SortableList/index.js +42 -39
  107. package/dist/components/SortableList/index.js.map +1 -1
  108. package/dist/components/SortableList/style.css +9 -15
  109. package/dist/components/Stepper/index.cjs +1 -1
  110. package/dist/components/Stepper/index.cjs.map +1 -1
  111. package/dist/components/Stepper/index.d.cts.map +1 -1
  112. package/dist/components/Stepper/index.d.ts.map +1 -1
  113. package/dist/components/Stepper/index.js +48 -39
  114. package/dist/components/Stepper/index.js.map +1 -1
  115. package/dist/components/Stepper/style.css +24 -18
  116. package/dist/components/SubNav/index.cjs +1 -1
  117. package/dist/components/SubNav/index.cjs.map +1 -1
  118. package/dist/components/SubNav/index.d.cts.map +1 -1
  119. package/dist/components/SubNav/index.d.ts.map +1 -1
  120. package/dist/components/SubNav/index.js +27 -28
  121. package/dist/components/SubNav/index.js.map +1 -1
  122. package/dist/components/SubNav/style.css +13 -0
  123. package/dist/components/Switch/index.cjs +1 -1
  124. package/dist/components/Switch/index.cjs.map +1 -1
  125. package/dist/components/Switch/index.d.cts.map +1 -1
  126. package/dist/components/Switch/index.d.ts.map +1 -1
  127. package/dist/components/Switch/index.js +23 -21
  128. package/dist/components/Switch/index.js.map +1 -1
  129. package/dist/components/Switch/style.css +2 -28
  130. package/dist/components/TagsInput/index.cjs +1 -1
  131. package/dist/components/TagsInput/index.cjs.map +1 -1
  132. package/dist/components/TagsInput/index.js +8 -10
  133. package/dist/components/TagsInput/index.js.map +1 -1
  134. package/dist/components/TagsInput/style.css +2 -24
  135. package/dist/index.cjs +1 -1
  136. package/dist/index.d.cts +2 -0
  137. package/dist/index.d.cts.map +1 -1
  138. package/dist/index.d.ts +2 -0
  139. package/dist/index.d.ts.map +1 -1
  140. package/dist/index.js +39 -38
  141. package/dist/styles.css +1 -0
  142. package/package.json +1 -1
@@ -1,131 +1,138 @@
1
1
  import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
2
+ import { Button as t } from "../Button/index.js";
2
3
  /* empty css */
3
- import { Popover as t } from "../Popover/index.js";
4
- import { forwardRef as n, useCallback as r, useEffect as i, useId as a, useRef as o, useState as s } from "react";
5
- import { jsx as c, jsxs as l } from "react/jsx-runtime";
4
+ import { Popover as n } from "../Popover/index.js";
5
+ import { forwardRef as r, useCallback as i, useEffect as a, useId as o, useRef as s, useState as c } from "react";
6
+ import { jsx as l, jsxs as u } from "react/jsx-runtime";
6
7
  //#region src/components/Select/index.tsx
7
- function u(...e) {
8
+ function d(...e) {
8
9
  return e.filter(Boolean).join(" ");
9
10
  }
10
- var d = n(function({ options: n, value: d, defaultValue: f, onValueChange: p, placeholder: m = "Select an option", size: h = "md", isDisabled: g = !1, isInvalid: _ = !1, menuPlacement: v = "bottom", className: y, disabled: b, onClick: x, onKeyDown: S, ...C }, w) {
11
- let [T, E] = s(f ?? ""), D = d ?? T, [O, k] = s(!1), [A, j] = s(0), M = o(null), N = o(null), P = o(null), F = a(), I = g || b, L = O && !I, R = n.find((e) => e.value === D), z = n.filter((e) => !e.isDisabled), B = r((e) => {
12
- d === void 0 && E(e), p?.(e), k(!1);
13
- }, [p, d]);
14
- i(() => {
15
- if (!L) return;
16
- let e = n.findIndex((e) => e.value === D && !e.isDisabled);
17
- j(e < 0 ? n.indexOf(z[0]) : e);
11
+ var f = r(function({ options: r, value: f, defaultValue: p, onValueChange: m, placeholder: h = "Select an option", size: g = "md", isDisabled: _ = !1, isInvalid: v = !1, menuPlacement: y = "bottom", className: b, disabled: x, onClick: S, onKeyDown: C, ...w }, T) {
12
+ let [E, D] = c(p ?? ""), O = f ?? E, [k, A] = c(!1), [j, M] = c(0), N = s(null), P = s(null), F = s(null), I = o(), L = _ || x, R = k && !L, z = r.find((e) => e.value === O), B = r.filter((e) => !e.isDisabled), V = i((e) => {
13
+ f === void 0 && D(e), m?.(e), A(!1);
14
+ }, [m, f]);
15
+ a(() => {
16
+ if (!R) return;
17
+ let e = r.findIndex((e) => e.value === O && !e.isDisabled);
18
+ M(e < 0 ? r.indexOf(B[0]) : e);
18
19
  let t = (e) => {
19
20
  let t = e.target;
20
- !M.current?.contains(t) && !P.current?.contains(t) && k(!1);
21
+ !N.current?.contains(t) && !F.current?.contains(t) && A(!1);
21
22
  };
22
23
  return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
23
- }, [L]), i(() => {
24
- L && (P.current?.querySelectorAll("[role='option']")[A])?.scrollIntoView({ block: "nearest" });
25
- }, [A, L]);
26
- let V = (e) => {
27
- let t = n.map((e, t) => ({
24
+ }, [R]), a(() => {
25
+ R && (F.current?.querySelectorAll("[role='option']")[j])?.scrollIntoView({ block: "nearest" });
26
+ }, [j, R]);
27
+ let H = (e) => {
28
+ let t = r.map((e, t) => ({
28
29
  option: e,
29
30
  index: t
30
31
  })).filter((e) => !e.option.isDisabled);
31
32
  if (t.length === 0) return;
32
- let r = t[(t.findIndex((e) => e.index === A) + e + t.length) % t.length];
33
- j(r.index);
34
- }, H = (e) => {
35
- if (!I) {
36
- if (e.key === "Escape") k(!1), N.current?.focus();
37
- else if (!L && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter" || e.key === " ")) e.preventDefault(), k(!0);
38
- else if (L) {
39
- if (e.key === "Tab") k(!1);
40
- else if (e.key === "ArrowDown" || e.key === "ArrowUp") e.preventDefault(), V(e.key === "ArrowDown" ? 1 : -1);
33
+ let n = t[(t.findIndex((e) => e.index === j) + e + t.length) % t.length];
34
+ M(n.index);
35
+ }, U = (e) => {
36
+ if (!L) {
37
+ if (e.key === "Escape") {
38
+ if (!R) return;
39
+ e.preventDefault(), A(!1), P.current?.focus();
40
+ } else if (!R && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter" || e.key === " ")) e.preventDefault(), A(!0);
41
+ else if (R) {
42
+ if (e.key === "Tab") A(!1);
43
+ else if (e.key === "ArrowDown" || e.key === "ArrowUp") e.preventDefault(), H(e.key === "ArrowDown" ? 1 : -1);
41
44
  else if (e.key === "Home" || e.key === "End") {
42
45
  e.preventDefault();
43
- let t = e.key === "Home" ? z[0] : z[z.length - 1];
44
- t && j(n.indexOf(t));
46
+ let t = e.key === "Home" ? B[0] : B[B.length - 1];
47
+ t && M(r.indexOf(t));
45
48
  } else if (e.key === "Enter" || e.key === " ") {
46
49
  e.preventDefault();
47
- let t = n[A];
48
- t && !t.isDisabled && B(t.value);
50
+ let t = r[j];
51
+ t && !t.isDisabled && V(t.value);
49
52
  }
50
53
  }
51
54
  }
52
55
  };
53
- return /* @__PURE__ */ l("div", {
56
+ return /* @__PURE__ */ u("div", {
54
57
  className: "ds-select-root",
55
- ref: M,
56
- children: [/* @__PURE__ */ l("button", {
58
+ ref: N,
59
+ children: [/* @__PURE__ */ u(t, {
57
60
  ref: (e) => {
58
- N.current = e, typeof w == "function" ? w(e) : w && (w.current = e);
61
+ P.current = e, typeof T == "function" ? T(e) : T && (T.current = e);
59
62
  },
60
- type: "button",
63
+ size: g,
61
64
  role: "combobox",
62
65
  "aria-haspopup": "listbox",
63
- "aria-expanded": L,
64
- "aria-controls": L ? F : void 0,
65
- "aria-activedescendant": L && n[A] && !n[A].isDisabled ? `${F}-option-${A}` : void 0,
66
- "aria-invalid": _ || void 0,
67
- disabled: I,
68
- "data-size": h,
69
- "data-placeholder": R ? void 0 : "",
70
- className: u("ds-field-skin", "ds-select", y),
66
+ "aria-expanded": R,
67
+ "aria-controls": R ? I : void 0,
68
+ "aria-activedescendant": R && r[j] && !r[j].isDisabled ? `${I}-option-${j}` : void 0,
69
+ "aria-invalid": v || void 0,
70
+ isDisabled: L,
71
+ "data-placeholder": z ? void 0 : "",
72
+ className: d("ds-field-skin", "ds-select", b),
71
73
  onClick: (e) => {
72
- x?.(e), e.defaultPrevented || k((e) => !e);
74
+ S?.(e), e.defaultPrevented || A((e) => !e);
73
75
  },
74
76
  onKeyDown: (e) => {
75
- S?.(e), e.defaultPrevented || H(e);
77
+ C?.(e), e.defaultPrevented || U(e);
76
78
  },
77
- ...C,
78
- children: [/* @__PURE__ */ c("span", {
79
+ ...w,
80
+ children: [/* @__PURE__ */ l("span", {
79
81
  className: "ds-select__value",
80
- children: R ? R.label : m
81
- }), /* @__PURE__ */ c(e, {
82
+ children: z ? z.label : h
83
+ }), /* @__PURE__ */ l(e, {
82
84
  name: "chevron-down",
83
85
  size: 16,
84
86
  className: "ds-select__chevron"
85
87
  })]
86
- }), /* @__PURE__ */ c(t, {
87
- anchorRef: N,
88
- isOpen: L,
89
- placement: v,
88
+ }), /* @__PURE__ */ l(n, {
89
+ anchorRef: P,
90
+ isOpen: R,
91
+ placement: y,
90
92
  matchAnchorWidth: !0,
91
- panelRef: P,
92
- id: F,
93
+ panelRef: F,
94
+ id: I,
93
95
  role: "listbox",
94
- "aria-label": C["aria-labelledby"] ? void 0 : C["aria-label"] ?? m,
95
- "aria-labelledby": C["aria-labelledby"],
96
+ "aria-label": w["aria-labelledby"] ? void 0 : w["aria-label"] ?? h,
97
+ "aria-labelledby": w["aria-labelledby"],
96
98
  className: "ds-surface-raised ds-select__menu",
97
- children: /* @__PURE__ */ c("div", {
98
- onKeyDown: H,
99
- children: n.map((t, n) => /* @__PURE__ */ l("div", {
100
- id: `${F}-option-${n}`,
99
+ children: /* @__PURE__ */ l("div", {
100
+ onKeyDown: U,
101
+ onPointerDown: (e) => e.preventDefault(),
102
+ children: r.map((n, r) => /* @__PURE__ */ u(t, {
103
+ variant: r === j ? "active" : "simple",
104
+ size: "sm",
105
+ isDisabled: n.isDisabled,
106
+ tabIndex: -1,
107
+ id: `${I}-option-${r}`,
101
108
  role: "option",
102
- "aria-selected": t.value === D,
103
- "aria-disabled": t.isDisabled || void 0,
104
- "data-active": n === A || void 0,
109
+ "aria-selected": n.value === O,
110
+ "aria-disabled": n.isDisabled || void 0,
111
+ "data-active": r === j || void 0,
105
112
  className: "ds-select__option",
106
- onMouseEnter: () => !t.isDisabled && j(n),
113
+ onMouseEnter: () => !n.isDisabled && M(r),
107
114
  onClick: () => {
108
- t.isDisabled || (B(t.value), N.current?.focus());
115
+ n.isDisabled || (V(n.value), P.current?.focus());
109
116
  },
110
- children: [/* @__PURE__ */ l("span", {
117
+ children: [/* @__PURE__ */ u("span", {
111
118
  className: "ds-select__option-body",
112
- children: [/* @__PURE__ */ c("span", {
119
+ children: [/* @__PURE__ */ l("span", {
113
120
  className: "ds-select__option-label",
114
- children: t.label
115
- }), t.description && /* @__PURE__ */ c("span", {
121
+ children: n.label
122
+ }), n.description && /* @__PURE__ */ l("span", {
116
123
  className: "ds-select__option-description",
117
- children: t.description
124
+ children: n.description
118
125
  })]
119
- }), t.value === D && /* @__PURE__ */ c(e, {
126
+ }), n.value === O && /* @__PURE__ */ l(e, {
120
127
  name: "check",
121
128
  size: 16
122
129
  })]
123
- }, t.value))
130
+ }, n.value))
124
131
  })
125
132
  })]
126
133
  });
127
134
  });
128
135
  //#endregion
129
- export { d as Select };
136
+ export { f as Select };
130
137
 
131
138
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["Icon","cx","parts","Select","forwardRef","rest","internal","setInternal","useState","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","useRef","triggerRef","listRef","listId","useId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","useCallback","next","onValueChange","useEffect","index","onPointerDown","target","event","step","order","o","delta","handleKeyDown","pick","node","ref","isInvalid","size","className","onClick","open","onKeyDown","placeholder","Popover","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n value: string;\n label: string;\n /** Secondary line under the label. */\n description?: string;\n isDisabled?: boolean;\n}\n\nexport interface SelectProps\n extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n options: SelectOption[];\n /** Controlled value. Leave undefined to let the select hold its own. */\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n placeholder?: string;\n size?: FieldSize;\n isDisabled?: boolean;\n isInvalid?: boolean;\n /** Preferred side of the menu; flips when space requires it. */\n menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value,\n defaultValue,\n onValueChange,\n placeholder = \"Select an option\",\n size = \"md\",\n isDisabled = false,\n isInvalid = false,\n menuPlacement = \"bottom\",\n className,\n disabled,\n onClick,\n onKeyDown,\n ...rest\n },\n ref,\n) {\n const [internal, setInternal] = useState(defaultValue ?? \"\");\n const current = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(0);\n const rootRef = useRef<HTMLDivElement | null>(null);\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n const listRef = useRef<HTMLDivElement | null>(null);\n const listId = useId();\n const effectiveDisabled = isDisabled || disabled;\n const isVisible = isOpen && !effectiveDisabled;\n\n const selected = options.find((option) => option.value === current);\n const enabled = options.filter((option) => !option.isDisabled);\n\n const commit = useCallback(\n (next: string) => {\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n setOpen(false);\n },\n [onValueChange, value],\n );\n\n useEffect(() => {\n if (!isVisible) return;\n const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n const onPointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n };\n document.addEventListener(\"mousedown\", onPointerDown);\n return () => document.removeEventListener(\"mousedown\", onPointerDown);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n useEffect(() => {\n if (!isVisible) return;\n const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n activeOption?.scrollIntoView({ block: \"nearest\" });\n }, [activeIndex, isVisible]);\n\n const step = (delta: number) => {\n const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n if (order.length === 0) return;\n const at = order.findIndex((o) => o.index === activeIndex);\n const next = order[(at + delta + order.length) % order.length]!;\n setActiveIndex(next.index);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (effectiveDisabled) return;\n if (event.key === \"Escape\") {\n setOpen(false);\n triggerRef.current?.focus();\n return;\n }\n if (!isVisible && (event.key === \"ArrowDown\" || event.key === \"ArrowUp\" || event.key === \"Enter\" || event.key === \" \")) {\n event.preventDefault();\n setOpen(true);\n return;\n }\n if (!isVisible) return;\n if (event.key === \"Tab\") {\n setOpen(false);\n return;\n }\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n event.preventDefault();\n step(event.key === \"ArrowDown\" ? 1 : -1);\n } else if (event.key === \"Home\" || event.key === \"End\") {\n event.preventDefault();\n const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n if (pick) setActiveIndex(options.indexOf(pick));\n } else if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n const option = options[activeIndex];\n if (option && !option.isDisabled) commit(option.value);\n }\n };\n\n return (\n <div className=\"ds-select-root\" ref={rootRef}>\n <button\n ref={(node) => {\n triggerRef.current = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={isVisible}\n aria-controls={isVisible ? listId : undefined}\n aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n aria-invalid={isInvalid || undefined}\n disabled={effectiveDisabled}\n data-size={size}\n data-placeholder={selected ? undefined : \"\"}\n className={cx(\"ds-field-skin\", \"ds-select\", className)}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) setOpen((open) => !open);\n }}\n onKeyDown={(event) => {\n onKeyDown?.(event);\n if (!event.defaultPrevented) handleKeyDown(event);\n }}\n {...rest}\n >\n <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n </button>\n <Popover\n anchorRef={triggerRef}\n isOpen={isVisible}\n placement={menuPlacement}\n matchAnchorWidth\n panelRef={listRef}\n id={listId}\n role=\"listbox\"\n aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n aria-labelledby={rest[\"aria-labelledby\"]}\n className=\"ds-surface-raised ds-select__menu\"\n >\n <div onKeyDown={handleKeyDown}>\n {options.map((option, index) => (\n <div\n key={option.value}\n id={`${listId}-option-${index}`}\n role=\"option\"\n aria-selected={option.value === current}\n aria-disabled={option.isDisabled || undefined}\n data-active={index === activeIndex || undefined}\n className=\"ds-select__option\"\n onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n onClick={() => {\n if (!option.isDisabled) {\n commit(option.value);\n triggerRef.current?.focus();\n }\n }}\n >\n <span className=\"ds-select__option-body\">\n <span className=\"ds-select__option-label\">{option.label}</span>\n {option.description && (\n <span className=\"ds-select__option-description\">{option.description}</span>\n )}\n </span>\n {option.value === current && <Icon name=\"check\" size={16} />}\n </div>\n ))}\n </div>\n </Popover>\n </div>\n );\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":["Icon","cx","parts","Select","forwardRef","rest","internal","setInternal","useState","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","useRef","triggerRef","listRef","listId","useId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","useCallback","next","onValueChange","useEffect","index","onPointerDown","target","event","step","order","o","delta","handleKeyDown","pick","Button","node","ref","isInvalid","className","onClick","open","onKeyDown","placeholder","Popover","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n value: string;\n label: string;\n /** Secondary line under the label. */\n description?: string;\n isDisabled?: boolean;\n}\n\nexport interface SelectProps\n extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n options: SelectOption[];\n /** Controlled value. Leave undefined to let the select hold its own. */\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n placeholder?: string;\n size?: FieldSize;\n isDisabled?: boolean;\n isInvalid?: boolean;\n /** Preferred side of the menu; flips when space requires it. */\n menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value,\n defaultValue,\n onValueChange,\n placeholder = \"Select an option\",\n size = \"md\",\n isDisabled = false,\n isInvalid = false,\n menuPlacement = \"bottom\",\n className,\n disabled,\n onClick,\n onKeyDown,\n ...rest\n },\n ref,\n) {\n const [internal, setInternal] = useState(defaultValue ?? \"\");\n const current = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(0);\n const rootRef = useRef<HTMLDivElement | null>(null);\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n const listRef = useRef<HTMLDivElement | null>(null);\n const listId = useId();\n const effectiveDisabled = isDisabled || disabled;\n const isVisible = isOpen && !effectiveDisabled;\n\n const selected = options.find((option) => option.value === current);\n const enabled = options.filter((option) => !option.isDisabled);\n\n const commit = useCallback(\n (next: string) => {\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n setOpen(false);\n },\n [onValueChange, value],\n );\n\n useEffect(() => {\n if (!isVisible) return;\n const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n const onPointerDown = (event: MouseEvent) => {\n const target = event.target as Node;\n if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n };\n document.addEventListener(\"mousedown\", onPointerDown);\n return () => document.removeEventListener(\"mousedown\", onPointerDown);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n useEffect(() => {\n if (!isVisible) return;\n const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n activeOption?.scrollIntoView({ block: \"nearest\" });\n }, [activeIndex, isVisible]);\n\n const step = (delta: number) => {\n const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n if (order.length === 0) return;\n const at = order.findIndex((o) => o.index === activeIndex);\n const next = order[(at + delta + order.length) % order.length]!;\n setActiveIndex(next.index);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (effectiveDisabled) return;\n if (event.key === \"Escape\") {\n if (!isVisible) return;\n // Claims Escape so an enclosing Drawer stays open.\n event.preventDefault();\n setOpen(false);\n triggerRef.current?.focus();\n return;\n }\n if (!isVisible && (event.key === \"ArrowDown\" || event.key === \"ArrowUp\" || event.key === \"Enter\" || event.key === \" \")) {\n event.preventDefault();\n setOpen(true);\n return;\n }\n if (!isVisible) return;\n if (event.key === \"Tab\") {\n setOpen(false);\n return;\n }\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n event.preventDefault();\n step(event.key === \"ArrowDown\" ? 1 : -1);\n } else if (event.key === \"Home\" || event.key === \"End\") {\n event.preventDefault();\n const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n if (pick) setActiveIndex(options.indexOf(pick));\n } else if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n const option = options[activeIndex];\n if (option && !option.isDisabled) commit(option.value);\n }\n };\n\n return (\n <div className=\"ds-select-root\" ref={rootRef}>\n <Button\n ref={(node) => {\n triggerRef.current = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n size={size}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={isVisible}\n aria-controls={isVisible ? listId : undefined}\n aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n aria-invalid={isInvalid || undefined}\n isDisabled={effectiveDisabled}\n data-placeholder={selected ? undefined : \"\"}\n className={cx(\"ds-field-skin\", \"ds-select\", className)}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) setOpen((open) => !open);\n }}\n onKeyDown={(event) => {\n onKeyDown?.(event);\n if (!event.defaultPrevented) handleKeyDown(event);\n }}\n {...rest}\n >\n <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n </Button>\n <Popover\n anchorRef={triggerRef}\n isOpen={isVisible}\n placement={menuPlacement}\n matchAnchorWidth\n panelRef={listRef}\n id={listId}\n role=\"listbox\"\n aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n aria-labelledby={rest[\"aria-labelledby\"]}\n className=\"ds-surface-raised ds-select__menu\"\n >\n <div onKeyDown={handleKeyDown} onPointerDown={(event) => event.preventDefault()}>\n {options.map((option, index) => (\n <Button\n key={option.value}\n variant={index === activeIndex ? \"active\" : \"simple\"}\n size=\"sm\"\n isDisabled={option.isDisabled}\n tabIndex={-1}\n id={`${listId}-option-${index}`}\n role=\"option\"\n aria-selected={option.value === current}\n aria-disabled={option.isDisabled || undefined}\n data-active={index === activeIndex || undefined}\n className=\"ds-select__option\"\n onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n onClick={() => {\n if (!option.isDisabled) {\n commit(option.value);\n triggerRef.current?.focus();\n }\n }}\n >\n <span className=\"ds-select__option-body\">\n <span className=\"ds-select__option-label\">{option.label}</span>\n {option.description && (\n <span className=\"ds-select__option-description\">{option.description}</span>\n )}\n </span>\n {option.value === current && <Icon name=\"check\" size={16} />}\n </Button>\n ))}\n </div>\n </Popover>\n </div>\n );\n});\n"],"mappings":"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"}
@@ -9,26 +9,10 @@
9
9
  align-items: center;
10
10
  justify-content: space-between;
11
11
  gap: var(--space-2);
12
- padding: 0 10px;
13
12
  text-align: start;
14
13
  cursor: pointer;
15
14
  }
16
15
 
17
- .ds-select[data-size="sm"] {
18
- block-size: var(--field-height-sm);
19
- font-size: var(--field-font-size-sm);
20
- }
21
-
22
- .ds-select[data-size="md"] {
23
- block-size: var(--field-height-md);
24
- font-size: var(--field-font-size-md);
25
- }
26
-
27
- .ds-select[data-size="lg"] {
28
- block-size: var(--field-height-lg);
29
- font-size: var(--field-font-size-md);
30
- }
31
-
32
16
  .ds-select[data-placeholder] .ds-select__value {
33
17
  color: var(--color-text-muted);
34
18
  }
@@ -49,28 +33,11 @@
49
33
  padding: var(--space-1);
50
34
  }
51
35
 
52
- .ds-select__option {
53
- display: flex;
54
- align-items: center;
55
- gap: var(--space-2);
56
- padding: var(--space-2) var(--space-3);
57
- border-radius: var(--radius-sm);
58
- color: var(--color-text);
59
- font-size: var(--font-size-sm);
60
- cursor: pointer;
61
- }
62
-
63
- .ds-select__option[data-active] {
64
- background: var(--field-hover);
65
- }
66
-
67
- .ds-select__option[aria-selected="true"] {
68
- font-weight: var(--font-weight-semibold);
69
- }
70
-
71
- .ds-select__option[aria-disabled="true"] {
72
- opacity: 45%;
73
- cursor: not-allowed;
36
+ .ds-select__option.ds-button {
37
+ inline-size: 100%;
38
+ height: auto;
39
+ min-block-size: var(--field-height-sm);
40
+ text-align: start;
74
41
  }
75
42
 
76
43
  .ds-select__option-body {
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(0,t.createContext)({isCollapsed:!1});function i(){return(0,t.useContext)(r).isCollapsed}var a=(0,t.forwardRef)(function({isCollapsed:e,defaultCollapsed:i=!1,onCollapsedChange:a,label:s=`Main`,className:c,children:l,...u},d){let[f,p]=(0,t.useState)(i),m=e??f,h=(0,t.useCallback)(()=>{let t=!m;e===void 0&&p(t),a?.(t)},[e,m,a]),g=(0,t.useMemo)(()=>({isCollapsed:m}),[m]);return(0,n.jsx)(r.Provider,{value:g,children:(0,n.jsx)(o.Provider,{value:h,children:(0,n.jsx)(`nav`,{ref:d,"aria-label":s,"data-collapsed":m||void 0,className:[`ds-sidenav`,c].filter(Boolean).join(` `),...u,children:l})})})}),o=(0,t.createContext)(()=>{}),s=(0,t.forwardRef)(function({title:i,mark:a,isCollapsible:s=!0,className:c,children:l,...u},d){let{isCollapsed:f}=(0,t.useContext)(r),p=(0,t.useContext)(o);return(0,n.jsxs)(`div`,{ref:d,className:[`ds-sidenav__header`,c].filter(Boolean).join(` `),...u,children:[a&&(0,n.jsx)(`span`,{className:`ds-sidenav__mark`,children:a}),!f&&(i||l)&&(0,n.jsx)(`span`,{className:`ds-sidenav__title`,children:i??l}),s&&(0,n.jsx)(`button`,{type:`button`,className:`ds-sidenav__toggle`,"aria-label":f?`Expand navigation`:`Collapse navigation`,"aria-expanded":!f,title:f?`Expand navigation`:`Collapse navigation`,onClick:p,children:(0,n.jsx)(e.t,{name:f?`chevrons-right`:`chevrons-left`})})]})}),c=(0,t.forwardRef)(function({label:e,className:i,children:a,...o},s){let{isCollapsed:c}=(0,t.useContext)(r);return(0,n.jsxs)(`div`,{ref:s,className:[`ds-sidenav__section`,i].filter(Boolean).join(` `),"aria-label":e,role:e?`group`:void 0,...o,children:[e&&!c&&(0,n.jsx)(`span`,{className:`ds-sidenav__section-label`,children:e}),(0,n.jsx)(`ul`,{className:`ds-sidenav__list`,children:a})]})}),l=(0,t.forwardRef)(function({icon:i,label:a,isActive:o,badge:s,className:c,...l},u){let{isCollapsed:d}=(0,t.useContext)(r);return(0,n.jsx)(`li`,{className:`ds-sidenav__row`,children:(0,n.jsxs)(`a`,{ref:u,className:[`ds-sidenav__item`,c].filter(Boolean).join(` `),"data-active":o||void 0,"aria-current":o?`page`:void 0,title:d?a:void 0,...l,children:[(0,n.jsx)(e.t,{name:i}),!d&&(0,n.jsx)(`span`,{className:`ds-sidenav__label`,children:a}),!d&&s&&(0,n.jsx)(`span`,{className:`ds-sidenav__badge`,children:s}),d&&(0,n.jsx)(`span`,{className:`ds-sidenav__sr`,children:a})]})})}),u=(0,t.forwardRef)(function({className:e,children:t,...r},i){return(0,n.jsx)(`div`,{ref:i,className:[`ds-sidenav__footer`,e].filter(Boolean).join(` `),...r,children:t})});exports.SideNav=a,exports.SideNavFooter=u,exports.SideNavHeader=s,exports.SideNavItem=l,exports.SideNavSection=c,exports.useSideNavCollapsed=i;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.createContext)({isCollapsed:!1});function a(){return(0,n.useContext)(i).isCollapsed}var o=(0,n.forwardRef)(function({isCollapsed:e,defaultCollapsed:t=!1,onCollapsedChange:a,label:o=`Main`,className:c,children:l,...u},d){let[f,p]=(0,n.useState)(t),m=e??f,h=(0,n.useCallback)(()=>{let t=!m;e===void 0&&p(t),a?.(t)},[e,m,a]),g=(0,n.useMemo)(()=>({isCollapsed:m}),[m]);return(0,r.jsx)(i.Provider,{value:g,children:(0,r.jsx)(s.Provider,{value:h,children:(0,r.jsx)(`nav`,{ref:d,"aria-label":o,"data-collapsed":m||void 0,className:[`ds-sidenav`,c].filter(Boolean).join(` `),...u,children:l})})})}),s=(0,n.createContext)(()=>{}),c=(0,n.forwardRef)(function({title:e,mark:a,isCollapsible:o=!0,className:c,children:l,...u},d){let{isCollapsed:f}=(0,n.useContext)(i),p=(0,n.useContext)(s);return(0,r.jsxs)(`div`,{ref:d,className:[`ds-sidenav__header`,c].filter(Boolean).join(` `),...u,children:[a&&(0,r.jsx)(`span`,{className:`ds-sidenav__mark`,children:a}),!f&&(e||l)&&(0,r.jsx)(`span`,{className:`ds-sidenav__title`,children:e??l}),o&&(0,r.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:f?`chevrons-right`:`chevrons-left`,className:`ds-sidenav__toggle`,"aria-label":f?`Expand navigation`:`Collapse navigation`,"aria-expanded":!f,title:f?`Expand navigation`:`Collapse navigation`,onClick:p})]})}),l=(0,n.forwardRef)(function({label:e,className:t,children:a,...o},s){let{isCollapsed:c}=(0,n.useContext)(i);return(0,r.jsxs)(`div`,{ref:s,className:[`ds-sidenav__section`,t].filter(Boolean).join(` `),"aria-label":e,role:e?`group`:void 0,...o,children:[e&&!c&&(0,r.jsx)(`span`,{className:`ds-sidenav__section-label`,children:e}),(0,r.jsx)(`ul`,{className:`ds-sidenav__list`,children:a})]})}),u=(0,n.forwardRef)(function({icon:t,label:a,isActive:o,badge:s,className:c,...l},u){let{isCollapsed:d}=(0,n.useContext)(i);return(0,r.jsx)(`li`,{className:`ds-sidenav__row`,children:(0,r.jsxs)(`a`,{ref:u,className:[`ds-sidenav__item`,c].filter(Boolean).join(` `),"data-active":o||void 0,"aria-current":o?`page`:void 0,title:d?a:void 0,...l,children:[(0,r.jsx)(e.t,{name:t}),!d&&(0,r.jsx)(`span`,{className:`ds-sidenav__label`,children:a}),!d&&s&&(0,r.jsx)(`span`,{className:`ds-sidenav__badge`,children:s}),d&&(0,r.jsx)(`span`,{className:`ds-sidenav__sr`,children:a})]})})}),d=(0,n.forwardRef)(function({className:e,children:t,...n},i){return(0,r.jsx)(`div`,{ref:i,className:[`ds-sidenav__footer`,e].filter(Boolean).join(` `),...n,children:t})});exports.SideNav=o,exports.SideNavFooter=d,exports.SideNavHeader=c,exports.SideNavItem=u,exports.SideNavSection=l,exports.useSideNavCollapsed=a;
2
2
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","names":["createContext","useContext","forwardRef","useState","useCallback","useMemo","Icon","require_Icon","react","react_jsx_runtime","SideNavContext","useSideNavCollapsed","SideNav","controlled","rest","uncontrolled","setUncontrolled","defaultCollapsed","isCollapsed","toggle","next","onCollapsedChange","value","SideNavToggleContext","label","className","SideNavHeader","mark","title","children","isCollapsible","SideNavSection","SideNavItem","isActive","icon","badge","SideNavFooter"],"sources":["../../../src/components/SideNav/index.tsx"],"sourcesContent":["import {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useState,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\ninterface SideNavContextValue {\n isCollapsed: boolean;\n}\n\nconst SideNavContext = createContext<SideNavContextValue>({ isCollapsed: false });\n\n/** Read the rail's collapsed state from anything rendered inside it. */\nexport function useSideNavCollapsed(): boolean {\n return useContext(SideNavContext).isCollapsed;\n}\n\nexport interface SideNavProps extends HTMLAttributes<HTMLElement> {\n /** Controlled collapsed state. Omit to let the rail own it. */\n isCollapsed?: boolean;\n /** Initial state when uncontrolled. */\n defaultCollapsed?: boolean;\n /** Fired by the header's collapse toggle. */\n onCollapsedChange?: (isCollapsed: boolean) => void;\n /** Accessible name for the landmark. */\n label?: string;\n children?: ReactNode;\n}\n\n/**\n * The primary rail: one heavy edge against the page, hairline rules between\n * sections. Collapsed it keeps the icons and drops the words — the width is a\n * token, so every rail in the product collapses to the same measure.\n */\nexport const SideNav = forwardRef<HTMLElement, SideNavProps>(function SideNav(\n {\n isCollapsed: controlled,\n defaultCollapsed = false,\n onCollapsedChange,\n label = \"Main\",\n className,\n children,\n ...rest\n },\n ref,\n) {\n const [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n const isCollapsed = controlled ?? uncontrolled;\n\n const toggle = useCallback(() => {\n const next = !isCollapsed;\n if (controlled === undefined) setUncontrolled(next);\n onCollapsedChange?.(next);\n }, [controlled, isCollapsed, onCollapsedChange]);\n\n const value = useMemo(() => ({ isCollapsed }), [isCollapsed]);\n\n return (\n <SideNavContext.Provider value={value}>\n <SideNavToggleContext.Provider value={toggle}>\n <nav\n ref={ref}\n aria-label={label}\n data-collapsed={isCollapsed || undefined}\n className={[\"ds-sidenav\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {children}\n </nav>\n </SideNavToggleContext.Provider>\n </SideNavContext.Provider>\n );\n});\n\nconst SideNavToggleContext = createContext<() => void>(() => {});\n\nexport interface SideNavHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n /** Shown when the rail is open; hidden when it collapses. */\n title?: ReactNode;\n /** A mark that survives the collapse — a logo, a monogram. */\n mark?: ReactNode;\n /** Set false when the rail is permanently open. */\n isCollapsible?: boolean;\n children?: ReactNode;\n}\n\n/** Brand block plus the collapse toggle, above the first hairline rule. */\nexport const SideNavHeader = forwardRef<HTMLDivElement, SideNavHeaderProps>(\n function SideNavHeader({ title, mark, isCollapsible = true, className, children, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n const toggle = useContext(SideNavToggleContext);\n\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__header\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {mark && <span className=\"ds-sidenav__mark\">{mark}</span>}\n {!isCollapsed && (title || children) && (\n <span className=\"ds-sidenav__title\">{title ?? children}</span>\n )}\n {isCollapsible && (\n <button\n type=\"button\"\n className=\"ds-sidenav__toggle\"\n aria-label={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n aria-expanded={!isCollapsed}\n title={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n onClick={toggle}\n >\n <Icon name={isCollapsed ? \"chevrons-right\" : \"chevrons-left\"} />\n </button>\n )}\n </div>\n );\n },\n);\n\nexport interface SideNavSectionProps extends HTMLAttributes<HTMLDivElement> {\n /** Section label. Hidden — but still announced — when collapsed. */\n label?: string;\n children?: ReactNode;\n}\n\n/** A group of items under one label, separated by a hairline rule. */\nexport const SideNavSection = forwardRef<HTMLDivElement, SideNavSectionProps>(\n function SideNavSection({ label, className, children, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__section\", className].filter(Boolean).join(\" \")}\n aria-label={label}\n role={label ? \"group\" : undefined}\n {...rest}\n >\n {label && !isCollapsed && <span className=\"ds-sidenav__section-label\">{label}</span>}\n <ul className=\"ds-sidenav__list\">{children}</ul>\n </div>\n );\n },\n);\n\nexport interface SideNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n icon: IconName;\n /** The words. Kept in the accessible name even when the rail is collapsed. */\n label: string;\n isActive?: boolean;\n /** A count or status pill at the end of the row. Hidden when collapsed. */\n badge?: ReactNode;\n}\n\n/**\n * One destination. The active row carries the solid rail on its leading edge —\n * the same rail as a selected table row, so selection reads the same anywhere.\n */\nexport const SideNavItem = forwardRef<HTMLAnchorElement, SideNavItemProps>(\n function SideNavItem({ icon, label, isActive, badge, className, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n\n return (\n <li className=\"ds-sidenav__row\">\n <a\n ref={ref}\n className={[\"ds-sidenav__item\", className].filter(Boolean).join(\" \")}\n data-active={isActive || undefined}\n aria-current={isActive ? \"page\" : undefined}\n title={isCollapsed ? label : undefined}\n {...rest}\n >\n <Icon name={icon} />\n {!isCollapsed && <span className=\"ds-sidenav__label\">{label}</span>}\n {!isCollapsed && badge && <span className=\"ds-sidenav__badge\">{badge}</span>}\n {isCollapsed && <span className=\"ds-sidenav__sr\">{label}</span>}\n </a>\n </li>\n );\n },\n);\n\nexport interface SideNavFooterProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n}\n\n/** The bottom band — account, theme, help. Above the page edge, under a rule. */\nexport const SideNavFooter = forwardRef<HTMLDivElement, SideNavFooterProps>(\n function SideNavFooter({ className, children, ...rest }, ref) {\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__footer\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","names":["createContext","useContext","forwardRef","useState","useCallback","useMemo","Button","Icon","require_Icon","require_components_Button_index","react","react_jsx_runtime","SideNavContext","useSideNavCollapsed","SideNav","controlled","rest","uncontrolled","setUncontrolled","defaultCollapsed","isCollapsed","toggle","next","onCollapsedChange","value","SideNavToggleContext","label","className","SideNavHeader","mark","title","children","isCollapsible","SideNavSection","SideNavItem","isActive","icon","badge","SideNavFooter"],"sources":["../../../src/components/SideNav/index.tsx"],"sourcesContent":["import {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useState,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\ninterface SideNavContextValue {\n isCollapsed: boolean;\n}\n\nconst SideNavContext = createContext<SideNavContextValue>({ isCollapsed: false });\n\n/** Read the rail's collapsed state from anything rendered inside it. */\nexport function useSideNavCollapsed(): boolean {\n return useContext(SideNavContext).isCollapsed;\n}\n\nexport interface SideNavProps extends HTMLAttributes<HTMLElement> {\n /** Controlled collapsed state. Omit to let the rail own it. */\n isCollapsed?: boolean;\n /** Initial state when uncontrolled. */\n defaultCollapsed?: boolean;\n /** Fired by the header's collapse toggle. */\n onCollapsedChange?: (isCollapsed: boolean) => void;\n /** Accessible name for the landmark. */\n label?: string;\n children?: ReactNode;\n}\n\n/**\n * The primary rail: one heavy edge against the page, hairline rules between\n * sections. Collapsed it keeps the icons and drops the words — the width is a\n * token, so every rail in the product collapses to the same measure.\n */\nexport const SideNav = forwardRef<HTMLElement, SideNavProps>(function SideNav(\n {\n isCollapsed: controlled,\n defaultCollapsed = false,\n onCollapsedChange,\n label = \"Main\",\n className,\n children,\n ...rest\n },\n ref,\n) {\n const [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n const isCollapsed = controlled ?? uncontrolled;\n\n const toggle = useCallback(() => {\n const next = !isCollapsed;\n if (controlled === undefined) setUncontrolled(next);\n onCollapsedChange?.(next);\n }, [controlled, isCollapsed, onCollapsedChange]);\n\n const value = useMemo(() => ({ isCollapsed }), [isCollapsed]);\n\n return (\n <SideNavContext.Provider value={value}>\n <SideNavToggleContext.Provider value={toggle}>\n <nav\n ref={ref}\n aria-label={label}\n data-collapsed={isCollapsed || undefined}\n className={[\"ds-sidenav\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {children}\n </nav>\n </SideNavToggleContext.Provider>\n </SideNavContext.Provider>\n );\n});\n\nconst SideNavToggleContext = createContext<() => void>(() => {});\n\nexport interface SideNavHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n /** Shown when the rail is open; hidden when it collapses. */\n title?: ReactNode;\n /** A mark that survives the collapse — a logo, a monogram. */\n mark?: ReactNode;\n /** Set false when the rail is permanently open. */\n isCollapsible?: boolean;\n children?: ReactNode;\n}\n\n/** Brand block plus the collapse toggle, above the first hairline rule. */\nexport const SideNavHeader = forwardRef<HTMLDivElement, SideNavHeaderProps>(\n function SideNavHeader({ title, mark, isCollapsible = true, className, children, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n const toggle = useContext(SideNavToggleContext);\n\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__header\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {mark && <span className=\"ds-sidenav__mark\">{mark}</span>}\n {!isCollapsed && (title || children) && (\n <span className=\"ds-sidenav__title\">{title ?? children}</span>\n )}\n {isCollapsible && (\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart={isCollapsed ? \"chevrons-right\" : \"chevrons-left\"}\n className=\"ds-sidenav__toggle\"\n aria-label={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n aria-expanded={!isCollapsed}\n title={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n onClick={toggle}\n />\n )}\n </div>\n );\n },\n);\n\nexport interface SideNavSectionProps extends HTMLAttributes<HTMLDivElement> {\n /** Section label. Hidden — but still announced — when collapsed. */\n label?: string;\n children?: ReactNode;\n}\n\n/** A group of items under one label, separated by a hairline rule. */\nexport const SideNavSection = forwardRef<HTMLDivElement, SideNavSectionProps>(\n function SideNavSection({ label, className, children, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__section\", className].filter(Boolean).join(\" \")}\n aria-label={label}\n role={label ? \"group\" : undefined}\n {...rest}\n >\n {label && !isCollapsed && <span className=\"ds-sidenav__section-label\">{label}</span>}\n <ul className=\"ds-sidenav__list\">{children}</ul>\n </div>\n );\n },\n);\n\nexport interface SideNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n icon: IconName;\n /** The words. Kept in the accessible name even when the rail is collapsed. */\n label: string;\n isActive?: boolean;\n /** A count or status pill at the end of the row. Hidden when collapsed. */\n badge?: ReactNode;\n}\n\n/**\n * One destination. The active row carries the solid rail on its leading edge —\n * the same rail as a selected table row, so selection reads the same anywhere.\n */\nexport const SideNavItem = forwardRef<HTMLAnchorElement, SideNavItemProps>(\n function SideNavItem({ icon, label, isActive, badge, className, ...rest }, ref) {\n const { isCollapsed } = useContext(SideNavContext);\n\n return (\n <li className=\"ds-sidenav__row\">\n <a\n ref={ref}\n className={[\"ds-sidenav__item\", className].filter(Boolean).join(\" \")}\n data-active={isActive || undefined}\n aria-current={isActive ? \"page\" : undefined}\n title={isCollapsed ? label : undefined}\n {...rest}\n >\n <Icon name={icon} />\n {!isCollapsed && <span className=\"ds-sidenav__label\">{label}</span>}\n {!isCollapsed && badge && <span className=\"ds-sidenav__badge\">{badge}</span>}\n {isCollapsed && <span className=\"ds-sidenav__sr\">{label}</span>}\n </a>\n </li>\n );\n },\n);\n\nexport interface SideNavFooterProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n}\n\n/** The bottom band — account, theme, help. Above the page edge, under a rule. */\nexport const SideNavFooter = forwardRef<HTMLDivElement, SideNavFooterProps>(\n function SideNavFooter({ className, children, ...rest }, ref) {\n return (\n <div\n ref={ref}\n className={[\"ds-sidenav__footer\", className].filter(Boolean).join(\" \")}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA8BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
1
+ {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA+BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA8BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA+BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
@@ -1,106 +1,109 @@
1
1
  import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
2
- import { createContext as t, forwardRef as n, useCallback as r, useContext as i, useMemo as a, useState as o } from "react";
3
- import { jsx as s, jsxs as c } from "react/jsx-runtime";
2
+ import { Button as t } from "../Button/index.js";
3
+ import { createContext as n, forwardRef as r, useCallback as i, useContext as a, useMemo as o, useState as s } from "react";
4
+ import { jsx as c, jsxs as l } from "react/jsx-runtime";
4
5
  //#region src/components/SideNav/index.tsx
5
- var l = t({ isCollapsed: !1 });
6
- function u() {
7
- return i(l).isCollapsed;
6
+ var u = n({ isCollapsed: !1 });
7
+ function d() {
8
+ return a(u).isCollapsed;
8
9
  }
9
- var d = n(function({ isCollapsed: e, defaultCollapsed: t = !1, onCollapsedChange: n, label: i = "Main", className: c, children: u, ...d }, p) {
10
- let [m, h] = o(t), g = e ?? m, _ = r(() => {
10
+ var f = r(function({ isCollapsed: e, defaultCollapsed: t = !1, onCollapsedChange: n, label: r = "Main", className: a, children: l, ...d }, f) {
11
+ let [m, h] = s(t), g = e ?? m, _ = i(() => {
11
12
  let t = !g;
12
13
  e === void 0 && h(t), n?.(t);
13
14
  }, [
14
15
  e,
15
16
  g,
16
17
  n
17
- ]), v = a(() => ({ isCollapsed: g }), [g]);
18
- return /* @__PURE__ */ s(l.Provider, {
18
+ ]), v = o(() => ({ isCollapsed: g }), [g]);
19
+ return /* @__PURE__ */ c(u.Provider, {
19
20
  value: v,
20
- children: /* @__PURE__ */ s(f.Provider, {
21
+ children: /* @__PURE__ */ c(p.Provider, {
21
22
  value: _,
22
- children: /* @__PURE__ */ s("nav", {
23
- ref: p,
24
- "aria-label": i,
23
+ children: /* @__PURE__ */ c("nav", {
24
+ ref: f,
25
+ "aria-label": r,
25
26
  "data-collapsed": g || void 0,
26
- className: ["ds-sidenav", c].filter(Boolean).join(" "),
27
+ className: ["ds-sidenav", a].filter(Boolean).join(" "),
27
28
  ...d,
28
- children: u
29
+ children: l
29
30
  })
30
31
  })
31
32
  });
32
- }), f = t(() => {}), p = n(function({ title: t, mark: n, isCollapsible: r = !0, className: a, children: o, ...u }, d) {
33
- let { isCollapsed: p } = i(l), m = i(f);
34
- return /* @__PURE__ */ c("div", {
33
+ }), p = n(() => {}), m = r(function({ title: e, mark: n, isCollapsible: r = !0, className: i, children: o, ...s }, d) {
34
+ let { isCollapsed: f } = a(u), m = a(p);
35
+ return /* @__PURE__ */ l("div", {
35
36
  ref: d,
36
- className: ["ds-sidenav__header", a].filter(Boolean).join(" "),
37
- ...u,
37
+ className: ["ds-sidenav__header", i].filter(Boolean).join(" "),
38
+ ...s,
38
39
  children: [
39
- n && /* @__PURE__ */ s("span", {
40
+ n && /* @__PURE__ */ c("span", {
40
41
  className: "ds-sidenav__mark",
41
42
  children: n
42
43
  }),
43
- !p && (t || o) && /* @__PURE__ */ s("span", {
44
+ !f && (e || o) && /* @__PURE__ */ c("span", {
44
45
  className: "ds-sidenav__title",
45
- children: t ?? o
46
+ children: e ?? o
46
47
  }),
47
- r && /* @__PURE__ */ s("button", {
48
- type: "button",
48
+ r && /* @__PURE__ */ c(t, {
49
+ variant: "simple",
50
+ size: "sm",
51
+ isIconOnly: !0,
52
+ iconStart: f ? "chevrons-right" : "chevrons-left",
49
53
  className: "ds-sidenav__toggle",
50
- "aria-label": p ? "Expand navigation" : "Collapse navigation",
51
- "aria-expanded": !p,
52
- title: p ? "Expand navigation" : "Collapse navigation",
53
- onClick: m,
54
- children: /* @__PURE__ */ s(e, { name: p ? "chevrons-right" : "chevrons-left" })
54
+ "aria-label": f ? "Expand navigation" : "Collapse navigation",
55
+ "aria-expanded": !f,
56
+ title: f ? "Expand navigation" : "Collapse navigation",
57
+ onClick: m
55
58
  })
56
59
  ]
57
60
  });
58
- }), m = n(function({ label: e, className: t, children: n, ...r }, a) {
59
- let { isCollapsed: o } = i(l);
60
- return /* @__PURE__ */ c("div", {
61
- ref: a,
61
+ }), h = r(function({ label: e, className: t, children: n, ...r }, i) {
62
+ let { isCollapsed: o } = a(u);
63
+ return /* @__PURE__ */ l("div", {
64
+ ref: i,
62
65
  className: ["ds-sidenav__section", t].filter(Boolean).join(" "),
63
66
  "aria-label": e,
64
67
  role: e ? "group" : void 0,
65
68
  ...r,
66
- children: [e && !o && /* @__PURE__ */ s("span", {
69
+ children: [e && !o && /* @__PURE__ */ c("span", {
67
70
  className: "ds-sidenav__section-label",
68
71
  children: e
69
- }), /* @__PURE__ */ s("ul", {
72
+ }), /* @__PURE__ */ c("ul", {
70
73
  className: "ds-sidenav__list",
71
74
  children: n
72
75
  })]
73
76
  });
74
- }), h = n(function({ icon: t, label: n, isActive: r, badge: a, className: o, ...u }, d) {
75
- let { isCollapsed: f } = i(l);
76
- return /* @__PURE__ */ s("li", {
77
+ }), g = r(function({ icon: t, label: n, isActive: r, badge: i, className: o, ...s }, d) {
78
+ let { isCollapsed: f } = a(u);
79
+ return /* @__PURE__ */ c("li", {
77
80
  className: "ds-sidenav__row",
78
- children: /* @__PURE__ */ c("a", {
81
+ children: /* @__PURE__ */ l("a", {
79
82
  ref: d,
80
83
  className: ["ds-sidenav__item", o].filter(Boolean).join(" "),
81
84
  "data-active": r || void 0,
82
85
  "aria-current": r ? "page" : void 0,
83
86
  title: f ? n : void 0,
84
- ...u,
87
+ ...s,
85
88
  children: [
86
- /* @__PURE__ */ s(e, { name: t }),
87
- !f && /* @__PURE__ */ s("span", {
89
+ /* @__PURE__ */ c(e, { name: t }),
90
+ !f && /* @__PURE__ */ c("span", {
88
91
  className: "ds-sidenav__label",
89
92
  children: n
90
93
  }),
91
- !f && a && /* @__PURE__ */ s("span", {
94
+ !f && i && /* @__PURE__ */ c("span", {
92
95
  className: "ds-sidenav__badge",
93
- children: a
96
+ children: i
94
97
  }),
95
- f && /* @__PURE__ */ s("span", {
98
+ f && /* @__PURE__ */ c("span", {
96
99
  className: "ds-sidenav__sr",
97
100
  children: n
98
101
  })
99
102
  ]
100
103
  })
101
104
  });
102
- }), g = n(function({ className: e, children: t, ...n }, r) {
103
- return /* @__PURE__ */ s("div", {
105
+ }), _ = r(function({ className: e, children: t, ...n }, r) {
106
+ return /* @__PURE__ */ c("div", {
104
107
  ref: r,
105
108
  className: ["ds-sidenav__footer", e].filter(Boolean).join(" "),
106
109
  ...n,
@@ -108,6 +111,6 @@ var d = n(function({ isCollapsed: e, defaultCollapsed: t = !1, onCollapsedChange
108
111
  });
109
112
  });
110
113
  //#endregion
111
- export { d as SideNav, g as SideNavFooter, p as SideNavHeader, h as SideNavItem, m as SideNavSection, u as useSideNavCollapsed };
114
+ export { f as SideNav, _ as SideNavFooter, m as SideNavHeader, g as SideNavItem, h as SideNavSection, d as useSideNavCollapsed };
112
115
 
113
116
  //# sourceMappingURL=index.js.map