asheeui 0.6.15 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (183) hide show
  1. package/dist/AsheeUIProvider.js +22 -24
  2. package/dist/components/accordion/Accordion.js +79 -173
  3. package/dist/components/accordion/accordion-config.js +12 -13
  4. package/dist/components/accordion/accordion-styles.js +21 -24
  5. package/dist/components/autocomplete/Autocomplete.js +78 -136
  6. package/dist/components/autocomplete/autocomplete-config.js +7 -12
  7. package/dist/components/button/Button.d.ts +29 -1
  8. package/dist/components/button/Button.d.ts.map +1 -1
  9. package/dist/components/button/Button.js +47 -108
  10. package/dist/components/button/button-config.js +16 -17
  11. package/dist/components/button/button-styles.js +10 -11
  12. package/dist/components/card/Card.d.ts +36 -16
  13. package/dist/components/card/Card.d.ts.map +1 -1
  14. package/dist/components/card/Card.js +115 -205
  15. package/dist/components/card/card-config.js +24 -21
  16. package/dist/components/card/card-styles.js +19 -22
  17. package/dist/components/carousel/Carousel.js +123 -248
  18. package/dist/components/carousel/carousel-config.js +24 -25
  19. package/dist/components/carousel/carousel-styles.js +14 -16
  20. package/dist/components/chip/Chip.js +84 -191
  21. package/dist/components/chip/chip-config.js +13 -14
  22. package/dist/components/chip/chip-styles.js +22 -26
  23. package/dist/components/date-picker/Calendar.d.ts +3 -3
  24. package/dist/components/date-picker/Calendar.d.ts.map +1 -1
  25. package/dist/components/date-picker/Calendar.js +141 -222
  26. package/dist/components/date-picker/DatePicker.d.ts +5 -5
  27. package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
  28. package/dist/components/date-picker/DatePicker.js +122 -220
  29. package/dist/components/date-picker/TimeSpinner.js +58 -82
  30. package/dist/components/date-picker/date-picker-config.d.ts +4 -4
  31. package/dist/components/date-picker/date-picker-config.d.ts.map +1 -1
  32. package/dist/components/date-picker/date-picker-config.js +10 -11
  33. package/dist/components/date-picker/date-picker-styles.js +44 -45
  34. package/dist/components/date-picker/date-picker.helpers.d.ts +4 -4
  35. package/dist/components/date-picker/date-picker.helpers.d.ts.map +1 -1
  36. package/dist/components/date-picker/date-picker.helpers.js +74 -102
  37. package/dist/components/drawer/Drawer.d.ts +26 -8
  38. package/dist/components/drawer/Drawer.d.ts.map +1 -1
  39. package/dist/components/drawer/Drawer.js +54 -131
  40. package/dist/components/drawer/drawer-config.js +14 -15
  41. package/dist/components/drawer/drawer-styles.js +38 -42
  42. package/dist/components/field/FieldShell.js +49 -56
  43. package/dist/components/field/field-config.js +17 -18
  44. package/dist/components/field/field-styles.js +8 -8
  45. package/dist/components/image/Image.d.ts +7 -7
  46. package/dist/components/image/Image.d.ts.map +1 -1
  47. package/dist/components/image/Image.js +65 -132
  48. package/dist/components/image/image-config.js +17 -18
  49. package/dist/components/image/image-styles.js +14 -15
  50. package/dist/components/input/Input.js +65 -150
  51. package/dist/components/input/PasswordInput.js +30 -49
  52. package/dist/components/input/input-config.js +7 -7
  53. package/dist/components/input/input-styles.js +9 -10
  54. package/dist/components/keyboard/KeyboardContext.js +10 -11
  55. package/dist/components/keyboard/KeyboardProvider.js +100 -181
  56. package/dist/components/keyboard/OnScreenKeyboard.d.ts.map +1 -1
  57. package/dist/components/keyboard/OnScreenKeyboard.js +159 -166
  58. package/dist/components/keyboard/keyboard-config.js +59 -57
  59. package/dist/components/keyboard/keyboard-styles.js +10 -11
  60. package/dist/components/keyboard/use-keyboard-field.js +29 -21
  61. package/dist/components/link/Link.js +47 -137
  62. package/dist/components/link/link-config.js +14 -15
  63. package/dist/components/link/link-styles.js +25 -29
  64. package/dist/components/marquee/Marquee.js +55 -144
  65. package/dist/components/marquee/marquee-config.js +18 -19
  66. package/dist/components/marquee/marquee-styles.js +13 -15
  67. package/dist/components/modal/Modal.d.ts +26 -10
  68. package/dist/components/modal/Modal.d.ts.map +1 -1
  69. package/dist/components/modal/Modal.js +56 -136
  70. package/dist/components/modal/modal-config.js +15 -16
  71. package/dist/components/modal/modal-styles.js +13 -14
  72. package/dist/components/multi-select/MultiSelect.d.ts +18 -2
  73. package/dist/components/multi-select/MultiSelect.d.ts.map +1 -1
  74. package/dist/components/multi-select/MultiSelect.js +149 -283
  75. package/dist/components/multi-select/multi-select-config.d.ts +23 -18
  76. package/dist/components/multi-select/multi-select-config.d.ts.map +1 -1
  77. package/dist/components/multi-select/multi-select-config.js +18 -21
  78. package/dist/components/multi-select/multi-select-styles.js +17 -20
  79. package/dist/components/radio/Radio.js +43 -80
  80. package/dist/components/radio/RadioGroup.js +57 -155
  81. package/dist/components/radio/radio-config.js +15 -16
  82. package/dist/components/radio/radio-context.js +6 -6
  83. package/dist/components/radio/radio-styles.js +55 -60
  84. package/dist/components/resizable-screen/ResizableScreen.js +87 -177
  85. package/dist/components/resizable-screen/resizable-screen-config.js +16 -17
  86. package/dist/components/select/Select.d.ts +3 -2
  87. package/dist/components/select/Select.d.ts.map +1 -1
  88. package/dist/components/select/Select.js +97 -195
  89. package/dist/components/select/select-config.js +8 -9
  90. package/dist/components/select/select-styles.js +5 -5
  91. package/dist/components/select-menu/SelectMenu.d.ts.map +1 -1
  92. package/dist/components/select-menu/SelectMenu.js +102 -196
  93. package/dist/components/select-menu/select-menu-config.js +12 -12
  94. package/dist/components/select-menu/use-select-floating.d.ts +11 -1
  95. package/dist/components/select-menu/use-select-floating.d.ts.map +1 -1
  96. package/dist/components/select-menu/use-select-floating.js +41 -48
  97. package/dist/components/sidebar/Sidebar.d.ts +43 -22
  98. package/dist/components/sidebar/Sidebar.d.ts.map +1 -1
  99. package/dist/components/sidebar/Sidebar.js +146 -331
  100. package/dist/components/sidebar/sidebar-config.d.ts +98 -31
  101. package/dist/components/sidebar/sidebar-config.d.ts.map +1 -1
  102. package/dist/components/sidebar/sidebar-config.js +47 -33
  103. package/dist/components/sidebar/sidebar-styles.js +27 -32
  104. package/dist/components/spinner/spinner-config.js +12 -13
  105. package/dist/components/spinner/spinner-styles.js +13 -14
  106. package/dist/components/spinner/spinner.js +39 -82
  107. package/dist/components/switch/Switch.js +62 -154
  108. package/dist/components/switch/switch-config.js +11 -12
  109. package/dist/components/switch/switch-styles.js +14 -16
  110. package/dist/components/table/Table.js +64 -186
  111. package/dist/components/table/table-config.js +17 -18
  112. package/dist/components/table/table-styles.js +48 -52
  113. package/dist/components/tabs/Tabs.d.ts +16 -8
  114. package/dist/components/tabs/Tabs.d.ts.map +1 -1
  115. package/dist/components/tabs/Tabs.js +93 -208
  116. package/dist/components/tabs/tabs-config.d.ts +42 -20
  117. package/dist/components/tabs/tabs-config.d.ts.map +1 -1
  118. package/dist/components/tabs/tabs-config.js +26 -18
  119. package/dist/components/tabs/tabs-styles.js +15 -17
  120. package/dist/components/textarea/Textarea.js +52 -138
  121. package/dist/components/textarea/textarea-config.js +10 -11
  122. package/dist/components/textarea/textarea-styles.js +9 -10
  123. package/dist/components/toast/ToastContext.js +22 -26
  124. package/dist/components/toast/ToastItem.js +82 -144
  125. package/dist/components/toast/ToastProvider.d.ts.map +1 -1
  126. package/dist/components/toast/ToastProvider.js +128 -190
  127. package/dist/components/toast/toast-config.js +23 -24
  128. package/dist/components/toast/toast-styles.js +50 -55
  129. package/dist/components/toast/use-pausable-timeout.js +17 -13
  130. package/dist/components/tooltip/Tooltip.d.ts +5 -0
  131. package/dist/components/tooltip/Tooltip.d.ts.map +1 -1
  132. package/dist/components/tooltip/Tooltip.js +68 -158
  133. package/dist/components/tooltip/tooltip-config.d.ts +25 -0
  134. package/dist/components/tooltip/tooltip-config.d.ts.map +1 -1
  135. package/dist/components/tooltip/tooltip-config.js +26 -22
  136. package/dist/components/tooltip/tooltip-styles.js +15 -17
  137. package/dist/config/default-config.js +11 -34
  138. package/dist/config/resolve-color.js +23 -23
  139. package/dist/config/resolve-config.d.ts.map +1 -1
  140. package/dist/config/resolve-config.js +14 -12
  141. package/dist/icons/ArrowLeftIcon.js +16 -19
  142. package/dist/icons/CalendarIcon.js +43 -24
  143. package/dist/icons/CheckIcon.js +16 -19
  144. package/dist/icons/ChevronDownIcon.js +15 -21
  145. package/dist/icons/ChevronLeftIcon.js +16 -19
  146. package/dist/icons/ChevronRightIcon.js +16 -19
  147. package/dist/icons/ChevronUpIcon.js +16 -19
  148. package/dist/icons/ClearIcon.js +26 -22
  149. package/dist/icons/ClockIcon.js +20 -22
  150. package/dist/icons/CloseIcon.js +26 -22
  151. package/dist/icons/ErrorIcon.js +16 -19
  152. package/dist/icons/ExternalLinkIcon.js +25 -23
  153. package/dist/icons/EyeIcon.js +20 -22
  154. package/dist/icons/EyeOffIcon.js +21 -22
  155. package/dist/icons/InfoIcon.js +16 -19
  156. package/dist/icons/SearchIcon.js +25 -22
  157. package/dist/icons/WarningIcon.js +16 -19
  158. package/dist/index.js +65 -163
  159. package/dist/libs/context.js +10 -13
  160. package/dist/libs/index.js +1 -0
  161. package/dist/libs/registry.js +10 -12
  162. package/dist/libs/use-floating-z-index.d.ts +32 -0
  163. package/dist/libs/use-floating-z-index.d.ts.map +1 -0
  164. package/dist/libs/use-floating-z-index.js +16 -0
  165. package/dist/libs/use-isomorphic-layout-effect.js +5 -5
  166. package/dist/scripts/AsheeThemeScript.js +35 -44
  167. package/dist/shared/radius.d.ts.map +1 -1
  168. package/dist/shared/radius.js +12 -13
  169. package/dist/shared/variant.js +46 -134
  170. package/dist/theme/color.js +28 -28
  171. package/dist/theme/controller.d.ts.map +1 -1
  172. package/dist/theme/controller.js +65 -178
  173. package/dist/theme/useTheme.js +13 -44
  174. package/dist/utils/cn.js +7 -7
  175. package/dist/utils/index.d.ts +1 -0
  176. package/dist/utils/index.d.ts.map +1 -1
  177. package/dist/utils/index.js +1 -0
  178. package/dist/utils/merge-object.js +13 -14
  179. package/dist/utils/resolve-token.js +11 -14
  180. package/dist/utils/stacking.d.ts +76 -0
  181. package/dist/utils/stacking.d.ts.map +1 -0
  182. package/dist/utils/stacking.js +34 -0
  183. package/package.json +12 -11
@@ -1,334 +1,149 @@
1
1
  "use client";
2
- import { jsxs as d, jsx as t, Fragment as V } from "react/jsx-runtime";
3
- import { useState as De, useEffect as Le, useCallback as C, useMemo as B } from "react";
4
- import { ArrowLeftIcon as Re } from "../../icons/ArrowLeftIcon.js";
5
- import { ChevronLeftIcon as Ve } from "../../icons/ChevronLeftIcon.js";
6
- import { ChevronRightIcon as Ce } from "../../icons/ChevronRightIcon.js";
7
- import { useAsheeConfig as Be } from "../../libs/context.js";
8
- import { resolveCascade as s, resolveRadiusKey as T, resolveClassKey as j } from "../../utils/resolve-token.js";
9
- import { Button as z } from "../button/Button.js";
10
- import { Tooltip as Te } from "../tooltip/Tooltip.js";
11
- import { FALLBACK_SIDEBAR_CONFIG as a } from "./sidebar-config.js";
12
- import { SIDEBAR_VARIANT_CLASS as je, SIDEBAR_SECTION_LABEL_CLASS as ze, SIDEBAR_COLLAPSED_WIDTH_CLASS as Ke, SIDEBAR_EXPANDED_WIDTH_CLASS as Fe, SIDEBAR_ITEM_CLASS as He, SIDEBAR_HEADER_CLASS as Oe } from "./sidebar-styles.js";
13
- import { resolveVariantClass as K } from "../../shared/variant.js";
14
- import { cn as i } from "../../utils/cn.js";
15
- import { RADIUS_CLASS as F } from "../../shared/radius.js";
16
- function Pe(v) {
17
- return "items" in v && Array.isArray(v.items);
2
+ "use client";
3
+ import { cn as e } from "../../utils/cn.js";
4
+ import { useAsheeConfig as t } from "../../libs/context.js";
5
+ import { RADIUS_CLASS as n } from "../../shared/radius.js";
6
+ import { resolveVariantClass as r } from "../../shared/variant.js";
7
+ import { resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
8
+ import { Button as s } from "../button/Button.js";
9
+ import { ChevronLeftIcon as c } from "../../icons/ChevronLeftIcon.js";
10
+ import { ChevronRightIcon as l } from "../../icons/ChevronRightIcon.js";
11
+ import { ArrowLeftIcon as u } from "../../icons/ArrowLeftIcon.js";
12
+ import { Tooltip as ee } from "../tooltip/Tooltip.js";
13
+ import { FALLBACK_SIDEBAR_CONFIG as d } from "./sidebar-config.js";
14
+ import { SIDEBAR_COLLAPSED_WIDTH_CLASS as te, SIDEBAR_EXPANDED_WIDTH_CLASS as ne, SIDEBAR_HEADER_CLASS as f, SIDEBAR_ITEM_CLASS as re, SIDEBAR_SECTION_LABEL_CLASS as ie, SIDEBAR_VARIANT_CLASS as p } from "./sidebar-styles.js";
15
+ import { useCallback as m, useEffect as ae, useMemo as h, useState as oe } from "react";
16
+ import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
17
+ //#region src/components/sidebar/Sidebar.tsx
18
+ function y(e) {
19
+ return "items" in e && Array.isArray(e.items);
18
20
  }
19
- function Ge({
20
- items: v,
21
- activeKey: H,
22
- onSelect: h,
23
- isCollapsed: m,
24
- onCollapseChange: x,
25
- title: N,
26
- onBack: y,
27
- backIcon: O,
28
- userRole: u,
29
- footer: b,
30
- variant: P,
31
- size: G,
32
- radius: M,
33
- itemRadius: W,
34
- itemVariant: U,
35
- activeItemVariant: X,
36
- activeItemColor: q,
37
- showCollapseButton: J,
38
- collapsible: Q,
39
- defaultCollapsed: Y,
40
- showTooltips: Z,
41
- tooltipPlacement: $,
42
- headerClassName: g,
43
- bodyClassName: ee,
44
- itemClassName: re,
45
- sectionLabelClassName: te,
46
- footerClassName: E,
47
- anchorProps: ae,
48
- linkComponent: le,
49
- linkProps: se,
50
- className: ie,
51
- style: ne,
52
- ...oe
53
- }) {
54
- var L;
55
- const c = Be(), r = (L = c.components) == null ? void 0 : L.sidebar, _ = s(
56
- Q,
57
- r == null ? void 0 : r.collapsible,
58
- void 0,
59
- a.collapsible
60
- ), k = s(
61
- J,
62
- r == null ? void 0 : r.showCollapseButton,
63
- void 0,
64
- a.showCollapseButton
65
- ), de = s(
66
- Y,
67
- r == null ? void 0 : r.defaultCollapsed,
68
- void 0,
69
- a.defaultCollapsed
70
- ), [ce, w] = De(
71
- m ?? de
72
- );
73
- Le(() => {
74
- m !== void 0 && w(m);
75
- }, [m]);
76
- const l = m ?? ce, me = C(() => {
77
- if (!_) return;
78
- const e = !l;
79
- x ? x(e) : w(e);
80
- }, [l, x, _]), o = s(
81
- G,
82
- r == null ? void 0 : r.size,
83
- void 0,
84
- a.size
85
- ), ue = s(
86
- P,
87
- r == null ? void 0 : r.variant,
88
- void 0,
89
- a.variant
90
- ), S = (e) => e === "full" ? "xl" : e, pe = T(
91
- S(M),
92
- S(r == null ? void 0 : r.radius),
93
- c.defaultRadius,
94
- a.radius
95
- ), I = T(
96
- S(W),
97
- S(r == null ? void 0 : r.itemRadius),
98
- c.defaultRadius,
99
- a.itemRadius
100
- ), A = s(
101
- U,
102
- r == null ? void 0 : r.itemVariant,
103
- c.defaultVariant,
104
- a.itemVariant
105
- ), fe = s(
106
- X,
107
- r == null ? void 0 : r.activeItemVariant,
108
- c.defaultVariant,
109
- a.activeItemVariant
110
- ), ve = s(
111
- q,
112
- r == null ? void 0 : r.activeItemColor,
113
- c.defaultColor,
114
- a.activeItemColor
115
- ), he = K(
116
- fe,
117
- ve
118
- ), be = K(
119
- A,
120
- "none"
121
- ), Se = s(
122
- Z,
123
- r == null ? void 0 : r.showTooltips,
124
- void 0,
125
- a.showTooltips
126
- ), Ie = s(
127
- $,
128
- r == null ? void 0 : r.tooltipPlacement,
129
- void 0,
130
- a.tooltipPlacement
131
- ), p = v, D = B(() => {
132
- if (!p) return [];
133
- const e = p[0];
134
- return e ? Pe(e) ? p : [
135
- {
136
- id: "__root",
137
- label: void 0,
138
- items: p
139
- }
140
- ] : [];
141
- }, [p]), Ae = B(() => D.filter((e) => !e.roles || e.roles.length === 0 ? !0 : u ? e.roles.includes(u) : !1).map((e) => {
142
- var n;
143
- return {
144
- ...e,
145
- items: (n = e.items) == null ? void 0 : n.filter((f) => !f.roles || f.roles.length === 0 ? !0 : u ? f.roles.includes(u) : !1)
146
- };
147
- }).filter((e) => e.items && e.items.length > 0), [D, u]), xe = C(
148
- (e, n) => {
149
- if (n.disabled) {
150
- e.preventDefault();
151
- return;
152
- }
153
- h == null || h(n);
154
- },
155
- [h]
156
- ), Ne = l ? Ke[o] : Fe[o], ye = (e) => {
157
- const n = e.id === H, f = i(
158
- "w-full flex items-center gap-3 transition-all truncate no-underline",
159
- He[o],
160
- l ? "justify-center px-0" : "justify-start",
161
- n && "font-medium",
162
- // Use resolved variant classes - active items use activeItemVariant
163
- n ? he : be,
164
- e.disabled && "opacity-50 cursor-not-allowed pointer-events-none",
165
- j(
166
- A === "underlined" ? "none" : I,
167
- F,
168
- a.itemRadius
169
- ),
170
- re
171
- ), Ee = le || "a", ke = {
172
- href: e.disabled ? void 0 : e.href,
173
- target: e.target,
174
- rel: e.rel,
175
- onClick: (we) => xe(we, e),
176
- className: f,
177
- ...ae,
178
- ...se || {}
179
- }, R = /* @__PURE__ */ d(Ee, { ...ke, children: [
180
- e.icon && /* @__PURE__ */ t(
181
- "span",
182
- {
183
- className: i(
184
- "shrink-0 flex items-center justify-center",
185
- l && "w-full"
186
- ),
187
- children: e.icon
188
- }
189
- ),
190
- !l && /* @__PURE__ */ d(V, { children: [
191
- /* @__PURE__ */ t("span", { className: "truncate flex-1 text-left", children: e.label }),
192
- e.badge && /* @__PURE__ */ t("span", { className: "shrink-0", children: e.badge })
193
- ] })
194
- ] }, String(e.id));
195
- return l && Se ? /* @__PURE__ */ t(
196
- Te,
197
- {
198
- content: e.label,
199
- placement: Ie,
200
- variant: (r == null ? void 0 : r.tooltipVariant) ?? a.tooltipVariant,
201
- color: (r == null ? void 0 : r.tooltipColor) ?? a.tooltipColor,
202
- radius: I,
203
- children: R
204
- },
205
- String(e.id)
206
- ) : R;
207
- }, _e = (e) => !e.items || e.items.length === 0 ? null : /* @__PURE__ */ d("div", { className: "flex flex-col gap-0.5", children: [
208
- !l && e.label && /* @__PURE__ */ t(
209
- "div",
210
- {
211
- className: i(
212
- "text-foreground/70 font-medium uppercase tracking-wider truncate",
213
- ze[o],
214
- te
215
- ),
216
- children: e.label
217
- }
218
- ),
219
- e.items.map(ye)
220
- ] }, String(e.id));
221
- return /* @__PURE__ */ d(
222
- "aside",
223
- {
224
- className: i(
225
- "h-full flex flex-col transition-all duration-200 select-none shrink-0",
226
- Ne,
227
- je[ue],
228
- j(
229
- pe,
230
- F,
231
- a.radius
232
- ),
233
- ie
234
- ),
235
- style: ne,
236
- ...oe,
237
- children: [
238
- (y || N) && /* @__PURE__ */ d(
239
- "div",
240
- {
241
- className: i(
242
- "flex items-center gap-3 border-b border-border border-dashed shrink-0",
243
- Oe[o],
244
- l && "justify-center px-0",
245
- g
246
- ),
247
- children: [
248
- y && /* @__PURE__ */ t(
249
- z,
250
- {
251
- icon: !0,
252
- "aria-label": "Go back",
253
- variant: A,
254
- color: "secondary",
255
- size: o,
256
- radius: I,
257
- onClick: y,
258
- className: "shrink-0",
259
- children: /* @__PURE__ */ t(
260
- "span",
261
- {
262
- className: i(
263
- "flex items-center justify-center transition-transform duration-200"
264
- ),
265
- children: O ?? /* @__PURE__ */ t(Re, { className: "size-4" })
266
- }
267
- )
268
- }
269
- ),
270
- !l && N && /* @__PURE__ */ t("span", { className: "font-semibold text-foreground truncate tracking-tight transition-opacity duration-200", children: N })
271
- ]
272
- }
273
- ),
274
- /* @__PURE__ */ t(
275
- "nav",
276
- {
277
- className: i(
278
- "flex-1 overflow-y-auto py-3 px-2 flex flex-col gap-3 scrollable-hidden",
279
- ee
280
- ),
281
- children: Ae.map(_e)
282
- }
283
- ),
284
- k && _ && /* @__PURE__ */ d(
285
- "div",
286
- {
287
- className: i(
288
- "border-t border-border shrink-0",
289
- l ? "p-2" : "p-3",
290
- E
291
- ),
292
- children: [
293
- !l && b && /* @__PURE__ */ t("div", { className: "mb-2", children: b }),
294
- /* @__PURE__ */ t(
295
- z,
296
- {
297
- icon: !0,
298
- "aria-label": l ? "Expand sidebar" : "Collapse sidebar",
299
- variant: A,
300
- color: "secondary",
301
- size: o,
302
- radius: I,
303
- onClick: me,
304
- className: i(
305
- "w-full",
306
- l ? "justify-center px-0" : "justify-start"
307
- ),
308
- children: /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: l ? /* @__PURE__ */ t(Ce, { className: "size-4" }) : /* @__PURE__ */ d(V, { children: [
309
- /* @__PURE__ */ t(Ve, { className: "size-4" }),
310
- /* @__PURE__ */ t("span", { className: "text-sm", children: "Collapse" })
311
- ] }) })
312
- }
313
- )
314
- ]
315
- }
316
- ),
317
- !k && b && /* @__PURE__ */ t(
318
- "div",
319
- {
320
- className: i(
321
- "border-t border-border shrink-0 p-3",
322
- E
323
- ),
324
- children: b
325
- }
326
- )
327
- ]
328
- }
329
- );
21
+ function b({ items: b, activeKey: se, onSelect: x, isCollapsed: S, onCollapseChange: C, title: w, onBack: T, backIcon: ce, userRole: E, footer: D, variant: le, size: ue, radius: de, options: O, showCollapseButton: k, collapsible: A, defaultCollapsed: j, tooltip: M, headerClassName: N, bodyClassName: P, sectionLabelClassName: F, footerClassName: I, anchorProps: L, link: R, className: z, style: B, ...V }) {
22
+ let H = t(), U = H.components?.sidebar, W = i(A, U?.collapsible, void 0, d.collapsible), G = i(k, U?.showCollapseButton, void 0, d.showCollapseButton), fe = i(j, U?.defaultCollapsed, void 0, d.defaultCollapsed), [pe, K] = oe(S ?? fe);
23
+ ae(() => {
24
+ S !== void 0 && K(S);
25
+ }, [S]);
26
+ let q = S ?? pe, me = m(() => {
27
+ if (!W) return;
28
+ let e = !q;
29
+ C ? C(e) : K(e);
30
+ }, [
31
+ q,
32
+ C,
33
+ W
34
+ ]), J = i(ue, U?.size, void 0, d.size), he = i(le, U?.variant, void 0, d.variant), Y = (e) => e === "full" ? "xl" : e, ge = o(Y(de), Y(U?.radius), H.defaultRadius, d.radius), X = o(Y(O?.radius), Y(U?.options?.radius), H.defaultRadius, d.options.radius), Z = i(O?.inactive?.variant, U?.options?.inactive?.variant, H.defaultVariant, d.options.inactive.variant), _e = i(O?.inactive?.color, U?.options?.inactive?.color, void 0, d.options.inactive.color), ve = i(O?.active?.variant, U?.options?.active?.variant, H.defaultVariant, d.options.active.variant), ye = i(O?.active?.color, U?.options?.active?.color, H.defaultColor, d.options.active.color), be = r(ve, ye), xe = r(Z, _e), Se = i(M?.show, U?.tooltip?.show, void 0, d.tooltip.show), Ce = i(M?.placement, U?.tooltip?.placement, void 0, d.tooltip.placement), we = i(M?.variant, U?.tooltip?.variant, void 0, d.tooltip.variant), Te = i(M?.color, U?.tooltip?.color, void 0, d.tooltip.color), Q = b, $ = h(() => {
35
+ if (!Q) return [];
36
+ let e = Q[0];
37
+ return e ? y(e) ? Q : [{
38
+ id: "__root",
39
+ label: void 0,
40
+ items: Q
41
+ }] : [];
42
+ }, [Q]), Ee = h(() => $.filter((e) => !e.roles || e.roles.length === 0 ? !0 : E ? e.roles.includes(E) : !1).map((e) => ({
43
+ ...e,
44
+ items: e.items?.filter((e) => !e.roles || e.roles.length === 0 ? !0 : E ? e.roles.includes(E) : !1)
45
+ })).filter((e) => e.items && e.items.length > 0), [$, E]), De = m((e, t) => {
46
+ if (t.disabled) {
47
+ e.preventDefault();
48
+ return;
49
+ }
50
+ x?.(t);
51
+ }, [x]), Oe = q ? te[J] : ne[J], ke = (t) => {
52
+ let r = t.id === se, i = e("w-full flex items-center gap-3 transition-all truncate no-underline", re[J], q ? "justify-center px-0" : "justify-start", r && "font-medium", r ? be : xe, t.disabled && "opacity-50 cursor-not-allowed pointer-events-none", a(Z === "underlined" ? "none" : X, n, d.options.radius), O?.itemClassName), o = R?.component || "a", s = {
53
+ href: t.disabled ? void 0 : t.href,
54
+ target: t.target,
55
+ rel: t.rel,
56
+ onClick: (e) => De(e, t),
57
+ className: i,
58
+ ...L,
59
+ ...R?.props ?? {}
60
+ }, c = /* @__PURE__ */ v(o, {
61
+ ...s,
62
+ children: [t.icon && /* @__PURE__ */ _("span", {
63
+ className: e("shrink-0 flex items-center justify-center", q && "w-full"),
64
+ children: t.icon
65
+ }), !q && /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _("span", {
66
+ className: "truncate flex-1 text-left",
67
+ children: t.label
68
+ }), t.badge && /* @__PURE__ */ _("span", {
69
+ className: "shrink-0",
70
+ children: t.badge
71
+ })] })]
72
+ }, String(t.id));
73
+ return q && Se ? /* @__PURE__ */ _(ee, {
74
+ content: t.label,
75
+ placement: Ce,
76
+ variant: we,
77
+ color: Te,
78
+ radius: X,
79
+ children: c
80
+ }, String(t.id)) : c;
81
+ }, Ae = (t) => !t.items || t.items.length === 0 ? null : /* @__PURE__ */ v("div", {
82
+ className: "flex flex-col gap-0.5",
83
+ children: [!q && t.label && /* @__PURE__ */ _("div", {
84
+ className: e("text-foreground/70 font-medium uppercase tracking-wider truncate", ie[J], F),
85
+ children: t.label
86
+ }), t.items.map(ke)]
87
+ }, String(t.id));
88
+ return /* @__PURE__ */ v("aside", {
89
+ className: e("h-full flex flex-col transition-all duration-200 select-none shrink-0", Oe, p[he], a(ge, n, d.radius), z),
90
+ style: B,
91
+ ...V,
92
+ children: [
93
+ (T || w) && /* @__PURE__ */ v("div", {
94
+ className: e("flex items-center gap-3 border-b border-border border-dashed shrink-0", f[J], q && "justify-center px-0", N),
95
+ children: [T && /* @__PURE__ */ _(s, {
96
+ icon: !0,
97
+ "aria-label": "Go back",
98
+ variant: Z,
99
+ color: "secondary",
100
+ size: J,
101
+ radius: X,
102
+ onClick: T,
103
+ className: "shrink-0",
104
+ children: /* @__PURE__ */ _("span", {
105
+ className: e("flex items-center justify-center transition-transform duration-200"),
106
+ children: ce ?? /* @__PURE__ */ _(u, { className: "size-4" })
107
+ })
108
+ }), !q && w && /* @__PURE__ */ _("span", {
109
+ className: "font-semibold text-foreground truncate tracking-tight transition-opacity duration-200",
110
+ children: w
111
+ })]
112
+ }),
113
+ /* @__PURE__ */ _("nav", {
114
+ className: e("flex-1 overflow-y-auto py-3 px-2 flex flex-col gap-3 scrollable-hidden", P),
115
+ children: Ee.map(Ae)
116
+ }),
117
+ G && W && /* @__PURE__ */ v("div", {
118
+ className: e("border-t border-border shrink-0", q ? "p-2" : "p-3", I),
119
+ children: [!q && D && /* @__PURE__ */ _("div", {
120
+ className: "mb-2",
121
+ children: D
122
+ }), /* @__PURE__ */ _(s, {
123
+ icon: !0,
124
+ "aria-label": q ? "Expand sidebar" : "Collapse sidebar",
125
+ variant: Z,
126
+ color: "secondary",
127
+ size: J,
128
+ radius: X,
129
+ onClick: me,
130
+ className: e("w-full", q ? "justify-center px-0" : "justify-start"),
131
+ children: /* @__PURE__ */ _("span", {
132
+ className: "flex items-center gap-2",
133
+ children: q ? /* @__PURE__ */ _(l, { className: "size-4" }) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(c, { className: "size-4" }), /* @__PURE__ */ _("span", {
134
+ className: "text-sm",
135
+ children: "Collapse"
136
+ })] })
137
+ })
138
+ })]
139
+ }),
140
+ !G && D && /* @__PURE__ */ _("div", {
141
+ className: e("border-t border-border shrink-0 p-3", I),
142
+ children: D
143
+ })
144
+ ]
145
+ });
330
146
  }
331
- Ge.displayName = "Sidebar";
332
- export {
333
- Ge as Sidebar
334
- };
147
+ b.displayName = "Sidebar";
148
+ //#endregion
149
+ export { b as Sidebar };
@@ -91,6 +91,74 @@ export interface SidebarSection<T = string> {
91
91
  * Can be either a flat array of items or an array of sections.
92
92
  */
93
93
  export type SidebarItems<T = string> = SidebarItem<T>[] | SidebarSection<T>[];
94
+ /**
95
+ * Visual styling of the active navigation item.
96
+ */
97
+ export interface SidebarActiveOptionConfig {
98
+ /**
99
+ * Visual variant of the active item.
100
+ */
101
+ variant?: Variant;
102
+ /**
103
+ * Theme color of the active item.
104
+ */
105
+ color?: Color;
106
+ }
107
+ /**
108
+ * Visual styling of inactive navigation items.
109
+ */
110
+ export interface SidebarInactiveOptionConfig {
111
+ /**
112
+ * Visual variant of inactive items.
113
+ */
114
+ variant?: Variant;
115
+ /**
116
+ * Theme color of inactive items.
117
+ */
118
+ color?: Color;
119
+ }
120
+ /**
121
+ * Options configuration for the sidebar's navigation items.
122
+ */
123
+ export interface SidebarOptionsConfig {
124
+ /**
125
+ * Corner rounding of individual navigation items.
126
+ */
127
+ radius?: Radius;
128
+ /**
129
+ * Styling of the active navigation item.
130
+ */
131
+ active?: SidebarActiveOptionConfig;
132
+ /**
133
+ * Styling of inactive navigation items.
134
+ */
135
+ inactive?: SidebarInactiveOptionConfig;
136
+ }
137
+ /**
138
+ * Tooltip configuration for collapsed sidebar items.
139
+ */
140
+ export interface SidebarTooltipConfig {
141
+ /**
142
+ * Whether tooltips are shown for collapsed items.
143
+ *
144
+ * @default true
145
+ */
146
+ show?: boolean;
147
+ /**
148
+ * Placement of tooltips relative to the item.
149
+ *
150
+ * @default "right"
151
+ */
152
+ placement?: TooltipPlacement;
153
+ /**
154
+ * Visual variant for tooltips.
155
+ */
156
+ variant?: Variant;
157
+ /**
158
+ * Theme color for tooltips.
159
+ */
160
+ color?: Color;
161
+ }
94
162
  /**
95
163
  * Theme configuration options for the Sidebar component.
96
164
  *
@@ -115,44 +183,18 @@ export interface SidebarConfig {
115
183
  */
116
184
  radius?: Radius;
117
185
  /**
118
- * Corner rounding of individual navigation items.
119
- */
120
- itemRadius?: Radius;
121
- /**
122
- * Visual variant for inactive navigation items.
186
+ * Options configuration for the sidebar's navigation items.
123
187
  */
124
- itemVariant?: Variant;
188
+ options?: SidebarOptionsConfig;
125
189
  /**
126
- * Visual variant for the active navigation item.
190
+ * Tooltip configuration for collapsed sidebar items.
127
191
  */
128
- activeItemVariant?: Variant;
129
- /**
130
- * Theme color for the active navigation item.
131
- */
132
- activeItemColor?: Color;
192
+ tooltip?: SidebarTooltipConfig;
133
193
  /**
134
194
  * Whether the collapse button is shown.
135
195
  * @default true
136
196
  */
137
197
  showCollapseButton?: boolean;
138
- /**
139
- * Whether tooltips are shown for collapsed items.
140
- * @default true
141
- */
142
- showTooltips?: boolean;
143
- /**
144
- * Placement of tooltips relative to the item.
145
- * @default "right"
146
- */
147
- tooltipPlacement?: TooltipPlacement;
148
- /**
149
- * Visual variant for tooltips.
150
- */
151
- tooltipVariant?: Variant;
152
- /**
153
- * Theme color for tooltips.
154
- */
155
- tooltipColor?: Color;
156
198
  /**
157
199
  * Whether the sidebar has animations.
158
200
  * @default true
@@ -178,7 +220,32 @@ export declare const defaultSidebarConfig: SidebarConfig;
178
220
  * These values are used when instance props, component config,
179
221
  * and global defaults are all undefined.
180
222
  */
181
- export declare const FALLBACK_SIDEBAR_CONFIG: Required<SidebarConfig>;
223
+ export declare const FALLBACK_SIDEBAR_CONFIG: {
224
+ readonly size: "md";
225
+ readonly variant: "default";
226
+ readonly radius: "none";
227
+ readonly options: {
228
+ readonly radius: "md";
229
+ readonly active: {
230
+ readonly variant: "solid";
231
+ readonly color: "primary";
232
+ };
233
+ readonly inactive: {
234
+ readonly variant: "ghost";
235
+ readonly color: "none";
236
+ };
237
+ };
238
+ readonly tooltip: {
239
+ readonly show: true;
240
+ readonly placement: "right";
241
+ readonly variant: "solid";
242
+ readonly color: "secondary";
243
+ };
244
+ readonly animated: true;
245
+ readonly defaultCollapsed: false;
246
+ readonly collapsible: true;
247
+ readonly showCollapseButton: true;
248
+ };
182
249
  declare module "../../libs/registry" {
183
250
  interface ComponentTypeConfigRegistry {
184
251
  sidebar: SidebarConfig;
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar-config.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/sidebar-config.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sidebar-config.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/sidebar-config.ts"],"names":[],"mappings":"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"}