@giddaa-housing/ui 0.1.0 → 1.1.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 (315) hide show
  1. package/README.md +18 -6
  2. package/css/base.css +37 -0
  3. package/css/components.css +135 -0
  4. package/css/generated/shared.css +1 -0
  5. package/css/giddaa.css +402 -0
  6. package/css/preset.css +77 -0
  7. package/css/styles.css +2 -0
  8. package/css/theme.css +255 -0
  9. package/dist/accordion.d.ts +9 -10
  10. package/dist/accordion.js +41 -117
  11. package/dist/activity-timeline.d.ts +29 -0
  12. package/dist/activity-timeline.js +97 -0
  13. package/dist/alert.d.ts +8 -9
  14. package/dist/alert.js +53 -141
  15. package/dist/auth-layout.d.ts +23 -0
  16. package/dist/auth-layout.js +153 -0
  17. package/dist/avatar.d.ts +6 -6
  18. package/dist/avatar.js +40 -142
  19. package/dist/badge.d.ts +12 -13
  20. package/dist/badge.js +66 -114
  21. package/dist/bar-chart.d.ts +136 -114
  22. package/dist/bar-chart.js +244 -297
  23. package/dist/breadcrumb.d.ts +5 -5
  24. package/dist/breadcrumb.js +56 -148
  25. package/dist/bullet-chart.d.ts +33 -33
  26. package/dist/bullet-chart.js +123 -183
  27. package/dist/button-BZIeyUw6.d.ts +17 -0
  28. package/dist/button-group.d.ts +13 -16
  29. package/dist/button-group.js +38 -163
  30. package/dist/button.d.ts +2 -19
  31. package/dist/button.js +90 -142
  32. package/dist/calendar.d.ts +6 -6
  33. package/dist/calendar.js +134 -288
  34. package/dist/card.d.ts +14 -16
  35. package/dist/card.js +58 -174
  36. package/dist/carousel.d.ts +34 -35
  37. package/dist/carousel.js +319 -378
  38. package/dist/chart.d.ts +58 -59
  39. package/dist/chart.js +350 -466
  40. package/dist/checkbox.d.ts +10 -12
  41. package/dist/checkbox.js +84 -84
  42. package/dist/cn-BI_4DMBf.js +23 -0
  43. package/dist/collapsible.d.ts +7 -8
  44. package/dist/collapsible.js +23 -77
  45. package/dist/combobox.d.ts +10 -10
  46. package/dist/combobox.js +220 -696
  47. package/dist/cta.d.ts +64 -0
  48. package/dist/cta.js +192 -0
  49. package/dist/currency-selector.d.ts +41 -0
  50. package/dist/currency-selector.js +114 -0
  51. package/dist/data-table.d.ts +164 -0
  52. package/dist/data-table.js +673 -0
  53. package/dist/date-picker.d.ts +27 -20
  54. package/dist/date-picker.js +122 -520
  55. package/dist/details-card.d.ts +19 -0
  56. package/dist/details-card.js +118 -0
  57. package/dist/dialog.d.ts +13 -14
  58. package/dist/dialog.js +117 -320
  59. package/dist/dropdown-menu.d.ts +14 -14
  60. package/dist/dropdown-menu.js +170 -365
  61. package/dist/dropzone.d.ts +55 -55
  62. package/dist/dropzone.js +328 -467
  63. package/dist/editorial-card.d.ts +27 -0
  64. package/dist/editorial-card.js +144 -0
  65. package/dist/empty-state.d.ts +8 -9
  66. package/dist/empty-state.js +48 -135
  67. package/dist/field.d.ts +23 -25
  68. package/dist/field.js +111 -327
  69. package/dist/filter.d.ts +118 -0
  70. package/dist/filter.js +775 -0
  71. package/dist/footer.d.ts +40 -0
  72. package/dist/footer.js +227 -0
  73. package/dist/funnel-chart.d.ts +38 -41
  74. package/dist/funnel-chart.js +168 -563
  75. package/dist/gallery-indicator.d.ts +17 -0
  76. package/dist/gallery-indicator.js +75 -0
  77. package/dist/heatmap-chart.d.ts +95 -0
  78. package/dist/heatmap-chart.js +197 -0
  79. package/dist/infotip.d.ts +10 -0
  80. package/dist/infotip.js +40 -0
  81. package/dist/input-CfoEJ8A6.d.ts +12 -0
  82. package/dist/input-group.d.ts +16 -19
  83. package/dist/input-group.js +92 -372
  84. package/dist/input-size-context-C-SFx9sx.d.ts +10 -0
  85. package/dist/input-size-context.d.ts +2 -11
  86. package/dist/input-size-context.js +14 -20
  87. package/dist/input.d.ts +2 -13
  88. package/dist/input.js +23 -79
  89. package/dist/item.d.ts +7 -8
  90. package/dist/item.js +22 -89
  91. package/dist/kpi-card.d.ts +18 -20
  92. package/dist/kpi-card.js +84 -232
  93. package/dist/label.d.ts +6 -6
  94. package/dist/label.js +39 -66
  95. package/dist/line-chart.d.ts +88 -89
  96. package/dist/line-chart.js +143 -262
  97. package/dist/logo.d.ts +4 -4
  98. package/dist/logo.js +87 -141
  99. package/dist/map-indicator.d.ts +13 -0
  100. package/dist/map-indicator.js +83 -0
  101. package/dist/match.d.ts +15 -0
  102. package/dist/match.js +68 -0
  103. package/dist/media-gallery-hero.d.ts +58 -0
  104. package/dist/media-gallery-hero.js +201 -0
  105. package/dist/media-player.d.ts +60 -0
  106. package/dist/media-player.js +919 -0
  107. package/dist/multi-step-form.d.ts +56 -0
  108. package/dist/multi-step-form.js +342 -0
  109. package/dist/number-input.d.ts +34 -34
  110. package/dist/number-input.js +62 -413
  111. package/dist/page-header.d.ts +10 -11
  112. package/dist/page-header.js +34 -107
  113. package/dist/pagination.d.ts +17 -20
  114. package/dist/pagination.js +132 -341
  115. package/dist/password-input.d.ts +5 -12
  116. package/dist/password-input.js +32 -354
  117. package/dist/phone-input.d.ts +19 -19
  118. package/dist/phone-input.js +232 -561
  119. package/dist/photo-gallery.d.ts +20 -20
  120. package/dist/photo-gallery.js +314 -746
  121. package/dist/picker-lzgmsNfG.js +32 -0
  122. package/dist/pie-chart.d.ts +60 -60
  123. package/dist/pie-chart.js +141 -184
  124. package/dist/popover.d.ts +9 -9
  125. package/dist/popover.js +60 -156
  126. package/dist/price-tag.d.ts +34 -0
  127. package/dist/price-tag.js +118 -0
  128. package/dist/progress.d.ts +18 -16
  129. package/dist/progress.js +156 -300
  130. package/dist/property-listing-card.d.ts +29 -0
  131. package/dist/property-listing-card.js +117 -0
  132. package/dist/radar-chart.d.ts +108 -0
  133. package/dist/radar-chart.js +172 -0
  134. package/dist/radio-group.d.ts +11 -13
  135. package/dist/radio-group.js +47 -96
  136. package/dist/review-block.d.ts +18 -0
  137. package/dist/review-block.js +154 -0
  138. package/dist/rich-text-editor.d.ts +30 -14
  139. package/dist/rich-text-editor.js +594 -979
  140. package/dist/scatter-chart.d.ts +140 -0
  141. package/dist/scatter-chart.js +248 -0
  142. package/dist/search-input.d.ts +8 -15
  143. package/dist/search-input.js +58 -408
  144. package/dist/select.d.ts +8 -8
  145. package/dist/select.js +131 -291
  146. package/dist/separator.d.ts +8 -9
  147. package/dist/separator.js +31 -70
  148. package/dist/sheet.d.ts +11 -11
  149. package/dist/sheet.js +84 -262
  150. package/dist/sidebar.d.ts +32 -37
  151. package/dist/sidebar.js +380 -1055
  152. package/dist/size-context-D4mYvcg8.d.ts +10 -0
  153. package/dist/size-context.d.ts +2 -11
  154. package/dist/size-context.js +14 -18
  155. package/dist/skeleton.d.ts +4 -5
  156. package/dist/skeleton.js +9 -45
  157. package/dist/slider.d.ts +27 -0
  158. package/dist/slider.js +81 -0
  159. package/dist/sparkline.d.ts +43 -46
  160. package/dist/sparkline.js +223 -561
  161. package/dist/stepper.d.ts +23 -24
  162. package/dist/stepper.js +149 -276
  163. package/dist/styles.css +9995 -2
  164. package/dist/switch.d.ts +10 -12
  165. package/dist/switch.js +49 -106
  166. package/dist/table-card.d.ts +35 -0
  167. package/dist/table-card.js +125 -0
  168. package/dist/table.d.ts +18 -14
  169. package/dist/table.js +114 -182
  170. package/dist/tabs.d.ts +23 -15
  171. package/dist/tabs.js +62 -149
  172. package/dist/tag.d.ts +22 -23
  173. package/dist/tag.js +104 -156
  174. package/dist/testimonial-block.d.ts +33 -0
  175. package/dist/testimonial-block.js +208 -0
  176. package/dist/textarea-IS_D8pXf.d.ts +11 -0
  177. package/dist/textarea.d.ts +2 -12
  178. package/dist/textarea.js +20 -74
  179. package/dist/time-picker.d.ts +11 -11
  180. package/dist/time-picker.js +247 -464
  181. package/dist/toast.d.ts +16 -18
  182. package/dist/toast.js +154 -310
  183. package/dist/tooltip.d.ts +9 -10
  184. package/dist/tooltip.js +33 -91
  185. package/dist/tree-map.d.ts +54 -57
  186. package/dist/tree-map.js +231 -646
  187. package/dist/use-uncontrolled-CLfM1XbB.js +21 -0
  188. package/dist/waterfall-chart.d.ts +126 -0
  189. package/dist/waterfall-chart.js +480 -0
  190. package/package.json +123 -34
  191. package/dist/accordion.js.map +0 -1
  192. package/dist/alert.js.map +0 -1
  193. package/dist/avatar.js.map +0 -1
  194. package/dist/badge.js.map +0 -1
  195. package/dist/bar-chart.js.map +0 -1
  196. package/dist/base.css +0 -32
  197. package/dist/breadcrumb.js.map +0 -1
  198. package/dist/bullet-chart.js.map +0 -1
  199. package/dist/button-group.js.map +0 -1
  200. package/dist/button.js.map +0 -1
  201. package/dist/calendar.js.map +0 -1
  202. package/dist/card.js.map +0 -1
  203. package/dist/carousel.js.map +0 -1
  204. package/dist/chart.js.map +0 -1
  205. package/dist/checkbox.js.map +0 -1
  206. package/dist/collapsible.js.map +0 -1
  207. package/dist/combobox.js.map +0 -1
  208. package/dist/date-picker.js.map +0 -1
  209. package/dist/dialog.js.map +0 -1
  210. package/dist/dropdown-menu.js.map +0 -1
  211. package/dist/dropzone.js.map +0 -1
  212. package/dist/empty-state.js.map +0 -1
  213. package/dist/field.js.map +0 -1
  214. package/dist/files/red-hat-display-latin-300-italic.woff +0 -0
  215. package/dist/files/red-hat-display-latin-300-italic.woff2 +0 -0
  216. package/dist/files/red-hat-display-latin-300-normal.woff +0 -0
  217. package/dist/files/red-hat-display-latin-300-normal.woff2 +0 -0
  218. package/dist/files/red-hat-display-latin-400-italic.woff +0 -0
  219. package/dist/files/red-hat-display-latin-400-italic.woff2 +0 -0
  220. package/dist/files/red-hat-display-latin-400-normal.woff +0 -0
  221. package/dist/files/red-hat-display-latin-400-normal.woff2 +0 -0
  222. package/dist/files/red-hat-display-latin-500-italic.woff +0 -0
  223. package/dist/files/red-hat-display-latin-500-italic.woff2 +0 -0
  224. package/dist/files/red-hat-display-latin-500-normal.woff +0 -0
  225. package/dist/files/red-hat-display-latin-500-normal.woff2 +0 -0
  226. package/dist/files/red-hat-display-latin-600-italic.woff +0 -0
  227. package/dist/files/red-hat-display-latin-600-italic.woff2 +0 -0
  228. package/dist/files/red-hat-display-latin-600-normal.woff +0 -0
  229. package/dist/files/red-hat-display-latin-600-normal.woff2 +0 -0
  230. package/dist/files/red-hat-display-latin-700-italic.woff +0 -0
  231. package/dist/files/red-hat-display-latin-700-italic.woff2 +0 -0
  232. package/dist/files/red-hat-display-latin-700-normal.woff +0 -0
  233. package/dist/files/red-hat-display-latin-700-normal.woff2 +0 -0
  234. package/dist/files/red-hat-display-latin-800-italic.woff +0 -0
  235. package/dist/files/red-hat-display-latin-800-italic.woff2 +0 -0
  236. package/dist/files/red-hat-display-latin-800-normal.woff +0 -0
  237. package/dist/files/red-hat-display-latin-800-normal.woff2 +0 -0
  238. package/dist/files/red-hat-display-latin-900-italic.woff +0 -0
  239. package/dist/files/red-hat-display-latin-900-italic.woff2 +0 -0
  240. package/dist/files/red-hat-display-latin-900-normal.woff +0 -0
  241. package/dist/files/red-hat-display-latin-900-normal.woff2 +0 -0
  242. package/dist/files/red-hat-display-latin-ext-300-italic.woff +0 -0
  243. package/dist/files/red-hat-display-latin-ext-300-italic.woff2 +0 -0
  244. package/dist/files/red-hat-display-latin-ext-300-normal.woff +0 -0
  245. package/dist/files/red-hat-display-latin-ext-300-normal.woff2 +0 -0
  246. package/dist/files/red-hat-display-latin-ext-400-italic.woff +0 -0
  247. package/dist/files/red-hat-display-latin-ext-400-italic.woff2 +0 -0
  248. package/dist/files/red-hat-display-latin-ext-400-normal.woff +0 -0
  249. package/dist/files/red-hat-display-latin-ext-400-normal.woff2 +0 -0
  250. package/dist/files/red-hat-display-latin-ext-500-italic.woff +0 -0
  251. package/dist/files/red-hat-display-latin-ext-500-italic.woff2 +0 -0
  252. package/dist/files/red-hat-display-latin-ext-500-normal.woff +0 -0
  253. package/dist/files/red-hat-display-latin-ext-500-normal.woff2 +0 -0
  254. package/dist/files/red-hat-display-latin-ext-600-italic.woff +0 -0
  255. package/dist/files/red-hat-display-latin-ext-600-italic.woff2 +0 -0
  256. package/dist/files/red-hat-display-latin-ext-600-normal.woff +0 -0
  257. package/dist/files/red-hat-display-latin-ext-600-normal.woff2 +0 -0
  258. package/dist/files/red-hat-display-latin-ext-700-italic.woff +0 -0
  259. package/dist/files/red-hat-display-latin-ext-700-italic.woff2 +0 -0
  260. package/dist/files/red-hat-display-latin-ext-700-normal.woff +0 -0
  261. package/dist/files/red-hat-display-latin-ext-700-normal.woff2 +0 -0
  262. package/dist/files/red-hat-display-latin-ext-800-italic.woff +0 -0
  263. package/dist/files/red-hat-display-latin-ext-800-italic.woff2 +0 -0
  264. package/dist/files/red-hat-display-latin-ext-800-normal.woff +0 -0
  265. package/dist/files/red-hat-display-latin-ext-800-normal.woff2 +0 -0
  266. package/dist/files/red-hat-display-latin-ext-900-italic.woff +0 -0
  267. package/dist/files/red-hat-display-latin-ext-900-italic.woff2 +0 -0
  268. package/dist/files/red-hat-display-latin-ext-900-normal.woff +0 -0
  269. package/dist/files/red-hat-display-latin-ext-900-normal.woff2 +0 -0
  270. package/dist/funnel-chart.js.map +0 -1
  271. package/dist/index.d.ts +0 -87
  272. package/dist/index.js +0 -10448
  273. package/dist/index.js.map +0 -1
  274. package/dist/input-group.js.map +0 -1
  275. package/dist/input-size-context.js.map +0 -1
  276. package/dist/input.js.map +0 -1
  277. package/dist/item.js.map +0 -1
  278. package/dist/kpi-card.js.map +0 -1
  279. package/dist/label.js.map +0 -1
  280. package/dist/line-chart.js.map +0 -1
  281. package/dist/logo.js.map +0 -1
  282. package/dist/number-input.js.map +0 -1
  283. package/dist/page-header.js.map +0 -1
  284. package/dist/pagination.js.map +0 -1
  285. package/dist/password-input.js.map +0 -1
  286. package/dist/phone-input.js.map +0 -1
  287. package/dist/photo-gallery.js.map +0 -1
  288. package/dist/pie-chart.js.map +0 -1
  289. package/dist/popover.js.map +0 -1
  290. package/dist/progress.js.map +0 -1
  291. package/dist/radio-group.js.map +0 -1
  292. package/dist/red-hat-display.css +0 -2
  293. package/dist/rich-text-editor.js.map +0 -1
  294. package/dist/search-input.js.map +0 -1
  295. package/dist/select.js.map +0 -1
  296. package/dist/separator.js.map +0 -1
  297. package/dist/sheet.js.map +0 -1
  298. package/dist/sidebar.js.map +0 -1
  299. package/dist/size-context.js.map +0 -1
  300. package/dist/skeleton.js.map +0 -1
  301. package/dist/sparkline.js.map +0 -1
  302. package/dist/stepper.js.map +0 -1
  303. package/dist/switch.js.map +0 -1
  304. package/dist/tab-list.d.ts +0 -38
  305. package/dist/tab-list.js +0 -394
  306. package/dist/tab-list.js.map +0 -1
  307. package/dist/table.js.map +0 -1
  308. package/dist/tabs.js.map +0 -1
  309. package/dist/tag.js.map +0 -1
  310. package/dist/textarea.js.map +0 -1
  311. package/dist/theme/giddaa.css +0 -2
  312. package/dist/time-picker.js.map +0 -1
  313. package/dist/toast.js.map +0 -1
  314. package/dist/tooltip.js.map +0 -1
  315. package/dist/tree-map.js.map +0 -1
@@ -1,418 +1,67 @@
1
- // src/components/ui/number-input.tsx
2
- import {
3
- NumberField
4
- } from "@base-ui/react/number-field";
1
+ import { t as cn } from "./cn-BI_4DMBf.js";
2
+ import { SizeProvider, useComponentSize } from "./size-context.js";
3
+ import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from "./input-group.js";
5
4
  import { MinusIcon, PlusIcon } from "lucide-react";
6
-
7
- // src/lib/cn.ts
8
- import { clsx } from "clsx";
9
- import { extendTailwindMerge } from "tailwind-merge";
10
- var twMerge = extendTailwindMerge({
11
- extend: {
12
- classGroups: {
13
- "font-size": [
14
- {
15
- text: [
16
- "gdt-display",
17
- "gdt-h1",
18
- "gdt-h2",
19
- "gdt-h3",
20
- "gdt-h4",
21
- "gdt-h5",
22
- "gdt-xl",
23
- "gdt-lg",
24
- "gdt-md",
25
- "gdt-sm",
26
- "gdt-xs",
27
- "gdt-subtext",
28
- "gdt-capitalized"
29
- ]
30
- }
31
- ]
32
- }
33
- }
34
- });
35
- function cn(...inputs) {
36
- return twMerge(clsx(inputs));
37
- }
38
-
39
- // src/components/ui/input-group.tsx
40
- import { cva as cva3 } from "class-variance-authority";
41
-
42
- // src/components/ui/button.tsx
43
- import { Button as ButtonPrimitive } from "@base-ui/react/button";
44
- import { cva } from "class-variance-authority";
45
- import { Loader } from "lucide-react";
46
-
47
- // src/components/ui/size-context.tsx
48
- import { createContext, useContext } from "react";
49
- import { Fragment, jsx } from "react/jsx-runtime";
50
- var SizeContext = createContext(void 0);
51
- function SizeProvider({
52
- children,
53
- size
54
- }) {
55
- if (!size) {
56
- return /* @__PURE__ */ jsx(Fragment, { children });
57
- }
58
- return /* @__PURE__ */ jsx(SizeContext.Provider, { value: size, children });
59
- }
60
- function useComponentSize(size, fallback = "md") {
61
- const inheritedSize = useContext(SizeContext);
62
- return size ?? inheritedSize ?? fallback;
63
- }
64
-
65
- // src/components/ui/button.tsx
66
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
67
- var buttonVariants = cva(
68
- "group/button inline-flex shrink-0 items-center justify-center rounded-full bg-clip-padding whitespace-nowrap font-bold transition-[background-color,color,border-color,box-shadow,transform] outline-none select-none focus-visible:border-line-focus focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)] active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-invalid:border-line-danger aria-invalid:ring-3 aria-invalid:ring-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
69
- {
70
- variants: {
71
- variant: {
72
- primary: "bg-action-primary text-fg-on-brand hover:bg-action-primary-hover active:bg-action-primary-pressed",
73
- "primary-outline": "border-2 border-action-primary bg-transparent text-fg-brand hover:bg-surface-brand-subtle active:bg-surface-brand-subtle data-focused:bg-surface-brand-subtle data-pressed:bg-surface-brand-subtle",
74
- secondary: "bg-surface-brand-subtle text-fg-brand hover:bg-action-primary-hover hover:text-fg-on-brand active:bg-action-primary-pressed active:text-fg-on-brand data-focused:bg-action-primary-hover data-pressed:bg-action-primary-pressed data-focused:text-fg-on-brand data-pressed:text-fg-on-brand",
75
- "secondary-outline": "border-2 border-action-secondary bg-transparent text-fg-brand hover:bg-surface-brand-subtle active:bg-surface-brand-subtle data-focused:bg-surface-brand-subtle data-pressed:bg-surface-brand-subtle",
76
- tertiary: "bg-action-tertiary text-fg-primary hover:bg-action-tertiary-hover active:bg-action-tertiary-pressed data-focused:bg-action-tertiary-hover data-pressed:bg-action-tertiary-pressed",
77
- "tertiary-outline": "border border-line-strong bg-transparent text-fg-primary hover:bg-surface active:bg-surface-raised data-focused:bg-surface data-pressed:bg-surface-raised",
78
- ghost: "bg-transparent text-fg-primary hover:bg-surface active:bg-surface-raised data-focused:bg-surface data-pressed:bg-surface-raised",
79
- danger: "bg-action-danger text-fg-on-brand hover:bg-action-danger-hover active:bg-action-danger-pressed data-focused:bg-action-danger-hover data-pressed:bg-action-danger-pressed",
80
- "glass-overlay": "bg-surface-glass-overlay-button text-fg-on-brand",
81
- "link-brand": "border-transparent bg-transparent px-0 text-fg-brand hover:underline active:underline active:opacity-70",
82
- "link-neutral": "border-transparent bg-transparent px-0 text-fg-secondary hover:underline active:underline active:opacity-70"
83
- },
84
- size: {
85
- sm: "h-8 gap-2 px-3.5 text-gdt-xs has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3 [&_svg:not([class*='size-'])]:size-3.5",
86
- md: "h-10 gap-2 px-4.5 text-gdt-sm has-data-[icon=inline-end]:pr-4 has-data-[icon=inline-start]:pl-4",
87
- lg: "h-12.5 gap-2.5 px-5.5 text-gdt-md has-data-[icon=inline-end]:pr-5 has-data-[icon=inline-start]:pl-5 [&_svg:not([class*='size-'])]:size-4.5",
88
- xl: "h-14 gap-3 px-6.5 text-gdt-lg has-data-[icon=inline-end]:pr-6 has-data-[icon=inline-start]:pl-6 [&_svg:not([class*='size-'])]:size-5",
89
- icon: "size-10",
90
- "icon-xs": "size-6 text-gdt-xs [&_svg:not([class*='size-'])]:size-3",
91
- "icon-sm": "size-8 text-gdt-sm [&_svg:not([class*='size-'])]:size-3.5",
92
- "icon-lg": "size-12.5 text-gdt-md [&_svg:not([class*='size-'])]:size-4.5",
93
- "icon-xl": "size-14 text-gdt-lg [&_svg:not([class*='size-'])]:size-5"
94
- }
95
- },
96
- defaultVariants: {
97
- variant: "primary",
98
- size: "md"
99
- }
100
- }
101
- );
102
- function Button({
103
- className,
104
- variant = "primary",
105
- size,
106
- isLoading = false,
107
- children,
108
- disabled = false,
109
- ...props
110
- }) {
111
- const inheritedSize = useComponentSize();
112
- const resolvedSize = size ?? inheritedSize;
113
- const _disabled = disabled || isLoading;
114
- return /* @__PURE__ */ jsxs(
115
- ButtonPrimitive,
116
- {
117
- "data-slot": "button",
118
- className: cn(buttonVariants({ variant, size: resolvedSize, className })),
119
- disabled: _disabled,
120
- ...props,
121
- children: [
122
- isLoading && /* @__PURE__ */ jsx2(Loader, { className: "size-4 animate-spin" }),
123
- " ",
124
- children
125
- ]
126
- }
127
- );
128
- }
129
-
130
- // src/components/ui/input.tsx
131
- import { Input as InputPrimitive } from "@base-ui/react/input";
132
- import { cva as cva2 } from "class-variance-authority";
133
-
134
- // src/components/ui/input-size-context.tsx
135
- import { createContext as createContext2, useContext as useContext2 } from "react";
136
- import { Fragment as Fragment2, jsx as jsx3 } from "react/jsx-runtime";
137
- var InputSizeContext = createContext2(
138
- void 0
139
- );
140
- function InputSizeProvider({
141
- children,
142
- size
143
- }) {
144
- if (!size) {
145
- return /* @__PURE__ */ jsx3(Fragment2, { children });
146
- }
147
- return /* @__PURE__ */ jsx3(InputSizeContext.Provider, { value: size, children });
148
- }
149
- function useInputComponentSize(size, fallback = "md") {
150
- const inheritedSize = useContext2(InputSizeContext);
151
- return size ?? inheritedSize ?? fallback;
152
- }
153
-
154
- // src/components/ui/input.tsx
155
- import { jsx as jsx4 } from "react/jsx-runtime";
156
- var inputVariants = cva2(
157
- "flex w-full min-w-0 rounded-full border border-line bg-canvas text-fg-primary transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:border-0 file:bg-transparent file:font-normal file:text-fg-primary placeholder:text-fg-muted hover:border-line-strong focus-visible:border-line-focus focus-visible:inset-ring-1 inset-ring-line-focus disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-line-subtle disabled:bg-surface disabled:text-fg-muted disabled:placeholder:text-fg-muted aria-invalid:border-line-danger aria-invalid:text-fg-danger aria-invalid:placeholder:text-fg-danger aria-invalid:shadow-none",
158
- {
159
- variants: {
160
- size: {
161
- sm: "h-8 px-3 text-gdt-xs font-normal file:text-gdt-xs",
162
- md: "h-10 px-3.5 text-gdt-sm font-normal file:text-gdt-sm",
163
- lg: "h-12 px-4 text-gdt-md font-normal file:text-gdt-md",
164
- xl: "h-14 px-4.5 text-gdt-lg font-normal file:text-gdt-lg"
165
- }
166
- },
167
- defaultVariants: {
168
- size: "md"
169
- }
170
- }
171
- );
172
- function Input({ className, size, type, ...props }) {
173
- const resolvedSize = useInputComponentSize(size);
174
- return /* @__PURE__ */ jsx4(
175
- InputPrimitive,
176
- {
177
- type,
178
- "data-slot": "input",
179
- "data-size": resolvedSize,
180
- className: cn(inputVariants({ size: resolvedSize }), className),
181
- ...props
182
- }
183
- );
184
- }
185
-
186
- // src/components/ui/input-group.tsx
187
- import { jsx as jsx5 } from "react/jsx-runtime";
188
- var inputGroupVariants = cva3(
189
- "group/input-group relative flex w-full min-w-0 items-center rounded-full has-[textarea]:rounded-xl has-data-[align=block-end]:rounded-xl has-data-[align=block-start]:rounded-xl border border-line bg-canvas transition-[background-color,border-color,box-shadow,color] outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:border-line-subtle has-disabled:bg-surface has-disabled:text-fg-muted focus-within:border-line-focus focus-within:inset-ring-1 inset-ring-line-focus has-[[data-slot][aria-invalid=true]]:border-line-danger has-[[data-slot][aria-invalid=true]]:inset-shadow-none has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pl-2 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pl-2.5 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pl-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pl-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pr-2 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pr-2.5 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pr-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pr-3",
190
- {
191
- variants: {
192
- size: {
193
- sm: "h-8",
194
- md: "h-10",
195
- lg: "h-12",
196
- xl: "h-14"
197
- }
198
- },
199
- defaultVariants: {
200
- size: "md"
201
- }
202
- }
203
- );
204
- function InputGroup({
205
- className,
206
- size,
207
- ...props
208
- }) {
209
- const inheritedSize = useComponentSize();
210
- const resolvedSize = size ?? inheritedSize;
211
- const componentSize = resolvedSize === "xl" ? void 0 : resolvedSize;
212
- return /* @__PURE__ */ jsx5(SizeProvider, { size: componentSize, children: /* @__PURE__ */ jsx5(InputSizeProvider, { size: resolvedSize, children: /* @__PURE__ */ jsx5(
213
- "div",
214
- {
215
- "data-slot": "input-group",
216
- "data-size": resolvedSize,
217
- role: "group",
218
- className: cn(inputGroupVariants({ size: resolvedSize }), className),
219
- ...props
220
- }
221
- ) }) });
222
- }
223
- var inputGroupAddonVariants = cva3(
224
- "flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-gdt-sm font-normal text-fg-secondary select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[size=lg]/input-group:[&>svg:not([class*='size-'])]:size-4.5 group-data-[size=xl]/input-group:[&>svg:not([class*='size-'])]:size-5 [&>svg:not([class*='size-'])]:size-4",
225
- {
226
- variants: {
227
- align: {
228
- "inline-start": "order-first group-data-[size=sm]/input-group:pl-3 group-data-[size=md]/input-group:pl-3.5 group-data-[size=lg]/input-group:pl-4 group-data-[size=xl]/input-group:pl-4.5 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
229
- "inline-end": "order-last group-data-[size=sm]/input-group:pr-3 group-data-[size=md]/input-group:pr-3.5 group-data-[size=lg]/input-group:pr-4 group-data-[size=xl]/input-group:pr-4.5 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
230
- "block-start": "order-first w-full justify-start px-3 group-data-[size=md]/input-group:px-3.5 group-data-[size=lg]/input-group:px-4 group-data-[size=xl]/input-group:px-4.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
231
- "block-end": "order-last w-full justify-start px-3 group-data-[size=md]/input-group:px-3.5 group-data-[size=lg]/input-group:px-4 group-data-[size=xl]/input-group:px-4.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2"
232
- }
233
- },
234
- defaultVariants: {
235
- align: "inline-start"
236
- }
237
- }
238
- );
239
- function InputGroupAddon({
240
- className,
241
- align = "inline-start",
242
- ...props
243
- }) {
244
- return (
245
- // biome-ignore lint/a11y/useSemanticElements: addon is a structural wrapper for grouped input affordances.
246
- // biome-ignore lint/a11y/useKeyWithClickEvents: click only forwards focus to the sibling input and is not a standalone action target.
247
- /* @__PURE__ */ jsx5(
248
- "div",
249
- {
250
- role: "group",
251
- "data-slot": "input-group-addon",
252
- "data-align": align,
253
- className: cn(inputGroupAddonVariants({ align }), className),
254
- onClick: (e) => {
255
- if (e.target.closest("button")) {
256
- return;
257
- }
258
- e.currentTarget.parentElement?.querySelector("input")?.focus();
259
- },
260
- ...props
261
- }
262
- )
263
- );
264
- }
265
- var inputGroupButtonVariants = cva3(
266
- "flex items-center gap-2 text-sm shadow-none rounded-full",
267
- {
268
- variants: {
269
- size: {
270
- xs: "h-6 gap-1 px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
271
- sm: "",
272
- "icon-xs": "size-6 p-0 has-[>svg]:p-0",
273
- "icon-sm": "size-8 p-0 has-[>svg]:p-0"
274
- }
275
- },
276
- defaultVariants: {
277
- size: "xs"
278
- }
279
- }
280
- );
281
- function InputGroupButton({
282
- className,
283
- type = "button",
284
- variant = "ghost",
285
- size = "xs",
286
- ...props
287
- }) {
288
- return /* @__PURE__ */ jsx5(
289
- Button,
290
- {
291
- type,
292
- "data-size": size,
293
- variant,
294
- className: cn(inputGroupButtonVariants({ size }), className),
295
- ...props
296
- }
297
- );
298
- }
299
- function InputGroupInput({
300
- className,
301
- size,
302
- ...props
303
- }) {
304
- return /* @__PURE__ */ jsx5(
305
- Input,
306
- {
307
- "data-slot": "input-group-control",
308
- size,
309
- className: cn(
310
- "flex-1 rounded-none border-0 bg-transparent shadow-none inset-shadow-none inset-ring-0 focus:border-transparent focus:shadow-none focus:inset-shadow-none focus-visible:border-transparent focus-visible:shadow-none focus-visible:ring-0 focus-visible:inset-ring-0 focus-visible:inset-shadow-none disabled:bg-transparent aria-invalid:ring-0 aria-invalid:inset-ring-0 dark:bg-transparent dark:disabled:bg-transparent",
311
- className
312
- ),
313
- ...props
314
- }
315
- );
316
- }
317
-
318
- // src/components/ui/number-input.tsx
319
- import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
320
- var numberInputFormatPresets = {
321
- compact: {
322
- compactDisplay: "short",
323
- notation: "compact"
324
- },
325
- currencyNgn: {
326
- currency: "NGN",
327
- currencyDisplay: "narrowSymbol",
328
- style: "currency"
329
- },
330
- decimal: {
331
- useGrouping: true
332
- },
333
- integer: {
334
- maximumFractionDigits: 0,
335
- useGrouping: true
336
- },
337
- percent: {
338
- style: "percent"
339
- },
340
- plain: {
341
- useGrouping: false
342
- }
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+ import { NumberField } from "@base-ui/react/number-field";
7
+ //#region src/number-input.tsx
8
+ const numberInputFormatPresets = {
9
+ compact: {
10
+ compactDisplay: "short",
11
+ notation: "compact"
12
+ },
13
+ currencyNgn: {
14
+ currency: "NGN",
15
+ currencyDisplay: "narrowSymbol",
16
+ style: "currency"
17
+ },
18
+ decimal: { useGrouping: true },
19
+ integer: {
20
+ maximumFractionDigits: 0,
21
+ useGrouping: true
22
+ },
23
+ percent: { style: "percent" },
24
+ plain: { useGrouping: false }
343
25
  };
344
- function NumberInput({
345
- children,
346
- format,
347
- formatPreset,
348
- placeholder,
349
- size,
350
- thousandSeparator,
351
- ...props
352
- }) {
353
- const resolvedSize = useComponentSize(size);
354
- const resolvedFormat = format ?? (formatPreset ? numberInputFormatPresets[formatPreset] : void 0) ?? (thousandSeparator ? numberInputFormatPresets.decimal : void 0);
355
- return /* @__PURE__ */ jsx6(SizeProvider, { size: resolvedSize, children: /* @__PURE__ */ jsx6(NumberField.Root, { format: resolvedFormat, ...props, children: /* @__PURE__ */ jsxs2(NumberField.Group, { render: /* @__PURE__ */ jsx6(InputGroup, {}), children: [
356
- /* @__PURE__ */ jsx6(
357
- NumberField.Input,
358
- {
359
- placeholder,
360
- render: /* @__PURE__ */ jsx6(InputGroupInput, {})
361
- }
362
- ),
363
- children
364
- ] }) }) });
26
+ function NumberInput({ children, format, formatPreset, placeholder, size, thousandSeparator, ...props }) {
27
+ const resolvedSize = useComponentSize(size);
28
+ const resolvedFormat = format ?? (formatPreset ? numberInputFormatPresets[formatPreset] : void 0) ?? (thousandSeparator ? numberInputFormatPresets.decimal : void 0);
29
+ return /* @__PURE__ */ jsx(SizeProvider, {
30
+ size: resolvedSize,
31
+ children: /* @__PURE__ */ jsx(NumberField.Root, {
32
+ format: resolvedFormat,
33
+ ...props,
34
+ children: /* @__PURE__ */ jsxs(NumberField.Group, {
35
+ render: /* @__PURE__ */ jsx(InputGroup, {}),
36
+ children: [/* @__PURE__ */ jsx(NumberField.Input, {
37
+ placeholder,
38
+ render: /* @__PURE__ */ jsx(InputGroupInput, {})
39
+ }), children]
40
+ })
41
+ })
42
+ });
365
43
  }
366
44
  function NumberInputControl() {
367
- const size = useComponentSize();
368
- return /* @__PURE__ */ jsxs2(
369
- InputGroupAddon,
370
- {
371
- align: "inline-end",
372
- className: cn(
373
- "flex gap-0 flex-col h-[calc(100%-2px)] w-10 overflow-hidden rounded-r-full p-0! pr-1.5!",
374
- size === "lg" && "w-12"
375
- ),
376
- children: [
377
- /* @__PURE__ */ jsx6(
378
- NumberField.Increment,
379
- {
380
- className: "w-full flex-1 rounded-none rounded-tr-full",
381
- render: /* @__PURE__ */ jsx6(InputGroupButton, { variant: "tertiary" }),
382
- children: /* @__PURE__ */ jsx6(
383
- PlusIcon,
384
- {
385
- className: cn("size-1.5", {
386
- "size-3": size === "md",
387
- "size-3.5": size === "lg"
388
- })
389
- }
390
- )
391
- }
392
- ),
393
- /* @__PURE__ */ jsx6(
394
- NumberField.Decrement,
395
- {
396
- className: "w-full flex-1 rounded-none rounded-br-full",
397
- render: /* @__PURE__ */ jsx6(InputGroupButton, { variant: "tertiary" }),
398
- children: /* @__PURE__ */ jsx6(
399
- MinusIcon,
400
- {
401
- className: cn("size-1.5", {
402
- "size-3": size === "md",
403
- "size-3.5": size === "lg"
404
- })
405
- }
406
- )
407
- }
408
- )
409
- ]
410
- }
411
- );
45
+ const size = useComponentSize();
46
+ return /* @__PURE__ */ jsxs(InputGroupAddon, {
47
+ align: "inline-end",
48
+ className: cn("flex gap-0 flex-col h-[calc(100%-2px)] w-10 overflow-hidden rounded-r-full p-0! pr-1.5!", size === "lg" && "w-12"),
49
+ children: [/* @__PURE__ */ jsx(NumberField.Increment, {
50
+ className: "w-full flex-1 rounded-none rounded-tr-full",
51
+ render: /* @__PURE__ */ jsx(InputGroupButton, { variant: "tertiary" }),
52
+ children: /* @__PURE__ */ jsx(PlusIcon, { className: cn("size-1.5", {
53
+ "size-3": size === "md",
54
+ "size-3.5": size === "lg"
55
+ }) })
56
+ }), /* @__PURE__ */ jsx(NumberField.Decrement, {
57
+ className: "w-full flex-1 rounded-none rounded-br-full",
58
+ render: /* @__PURE__ */ jsx(InputGroupButton, { variant: "tertiary" }),
59
+ children: /* @__PURE__ */ jsx(MinusIcon, { className: cn("size-1.5", {
60
+ "size-3": size === "md",
61
+ "size-3.5": size === "lg"
62
+ }) })
63
+ })]
64
+ });
412
65
  }
413
- export {
414
- NumberInput,
415
- NumberInputControl,
416
- numberInputFormatPresets
417
- };
418
- //# sourceMappingURL=number-input.js.map
66
+ //#endregion
67
+ export { NumberInput, NumberInputControl, numberInputFormatPresets };
@@ -1,13 +1,12 @@
1
- import * as React$1 from 'react';
2
-
1
+ //#region src/page-header.d.ts
3
2
  declare function DashboardHeader({ border, className, ...props }: React.ComponentProps<"div"> & {
4
- border?: boolean;
5
- }): React$1.JSX.Element;
3
+ border?: boolean;
4
+ }): import("react").JSX.Element;
6
5
  declare function DashboardHeaderGroup({ className, orientation, ...props }: React.ComponentProps<"div"> & {
7
- orientation?: "horizontal" | "vertical";
8
- }): React$1.JSX.Element;
9
- declare function DashboardHeaderTitle({ className, ...props }: React.ComponentProps<"h1">): React$1.JSX.Element;
10
- declare function DashboardHeaderDescription({ className, ...props }: React.ComponentProps<"p">): React$1.JSX.Element;
11
- declare function DashboardHeaderActions({ className, ...props }: React.ComponentProps<"div">): React$1.JSX.Element;
12
-
13
- export { DashboardHeader, DashboardHeaderActions, DashboardHeaderDescription, DashboardHeaderGroup, DashboardHeaderTitle };
6
+ orientation?: "horizontal" | "vertical";
7
+ }): import("react").JSX.Element;
8
+ declare function DashboardHeaderTitle({ className, ...props }: React.ComponentProps<"h1">): import("react").JSX.Element;
9
+ declare function DashboardHeaderDescription({ className, ...props }: React.ComponentProps<"p">): import("react").JSX.Element;
10
+ declare function DashboardHeaderActions({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
11
+ //#endregion
12
+ export { DashboardHeader, DashboardHeaderActions, DashboardHeaderDescription, DashboardHeaderGroup, DashboardHeaderTitle };
@@ -1,113 +1,40 @@
1
- // src/lib/cn.ts
2
- import { clsx } from "clsx";
3
- import { extendTailwindMerge } from "tailwind-merge";
4
- var twMerge = extendTailwindMerge({
5
- extend: {
6
- classGroups: {
7
- "font-size": [
8
- {
9
- text: [
10
- "gdt-display",
11
- "gdt-h1",
12
- "gdt-h2",
13
- "gdt-h3",
14
- "gdt-h4",
15
- "gdt-h5",
16
- "gdt-xl",
17
- "gdt-lg",
18
- "gdt-md",
19
- "gdt-sm",
20
- "gdt-xs",
21
- "gdt-subtext",
22
- "gdt-capitalized"
23
- ]
24
- }
25
- ]
26
- }
27
- }
28
- });
29
- function cn(...inputs) {
30
- return twMerge(clsx(inputs));
31
- }
32
-
33
- // src/components/ui/page-header.tsx
1
+ import { t as cn } from "./cn-BI_4DMBf.js";
34
2
  import { jsx } from "react/jsx-runtime";
35
- function DashboardHeader({
36
- border,
37
- className,
38
- ...props
39
- }) {
40
- return /* @__PURE__ */ jsx(
41
- "div",
42
- {
43
- "data-slot": "dashboard-header",
44
- className: cn("flex flex-col gap-4", className),
45
- ...props
46
- }
47
- );
3
+ //#region src/page-header.tsx
4
+ function DashboardHeader({ border, className, ...props }) {
5
+ return /* @__PURE__ */ jsx("div", {
6
+ "data-slot": "dashboard-header",
7
+ className: cn("flex flex-col gap-4", className),
8
+ ...props
9
+ });
48
10
  }
49
- function DashboardHeaderGroup({
50
- className,
51
- orientation = "vertical",
52
- ...props
53
- }) {
54
- return /* @__PURE__ */ jsx(
55
- "div",
56
- {
57
- "data-slot": "dashboard-header-group",
58
- className: cn(
59
- "flex",
60
- orientation === "horizontal" ? "gap-4 md:gap-6 md:flex-row md:items-center" : "flex-col gap-2",
61
- className
62
- ),
63
- ...props
64
- }
65
- );
11
+ function DashboardHeaderGroup({ className, orientation = "vertical", ...props }) {
12
+ return /* @__PURE__ */ jsx("div", {
13
+ "data-slot": "dashboard-header-group",
14
+ className: cn("flex", orientation === "horizontal" ? "gap-4 md:gap-6 md:flex-row md:items-center" : "flex-col gap-2", className),
15
+ ...props
16
+ });
66
17
  }
67
- function DashboardHeaderTitle({
68
- className,
69
- ...props
70
- }) {
71
- return /* @__PURE__ */ jsx(
72
- "h1",
73
- {
74
- "data-slot": "dashboard-header-title",
75
- className: cn("text-gdt-h3", className),
76
- ...props
77
- }
78
- );
18
+ function DashboardHeaderTitle({ className, ...props }) {
19
+ return /* @__PURE__ */ jsx("h1", {
20
+ "data-slot": "dashboard-header-title",
21
+ className: cn("text-gdt-h3", className),
22
+ ...props
23
+ });
79
24
  }
80
- function DashboardHeaderDescription({
81
- className,
82
- ...props
83
- }) {
84
- return /* @__PURE__ */ jsx(
85
- "p",
86
- {
87
- "data-slot": "dashboard-header-description",
88
- className: cn("text-gdt-sm text-fg-secondary", className),
89
- ...props
90
- }
91
- );
25
+ function DashboardHeaderDescription({ className, ...props }) {
26
+ return /* @__PURE__ */ jsx("p", {
27
+ "data-slot": "dashboard-header-description",
28
+ className: cn("text-gdt-sm text-fg-secondary", className),
29
+ ...props
30
+ });
92
31
  }
93
- function DashboardHeaderActions({
94
- className,
95
- ...props
96
- }) {
97
- return /* @__PURE__ */ jsx(
98
- "div",
99
- {
100
- "data-slot": "dashboard-header-actions",
101
- className: cn("flex flex-wrap items-center gap-2 md:gap-3", className),
102
- ...props
103
- }
104
- );
32
+ function DashboardHeaderActions({ className, ...props }) {
33
+ return /* @__PURE__ */ jsx("div", {
34
+ "data-slot": "dashboard-header-actions",
35
+ className: cn("flex flex-wrap items-center gap-2 md:gap-3", className),
36
+ ...props
37
+ });
105
38
  }
106
- export {
107
- DashboardHeader,
108
- DashboardHeaderActions,
109
- DashboardHeaderDescription,
110
- DashboardHeaderGroup,
111
- DashboardHeaderTitle
112
- };
113
- //# sourceMappingURL=page-header.js.map
39
+ //#endregion
40
+ export { DashboardHeader, DashboardHeaderActions, DashboardHeaderDescription, DashboardHeaderGroup, DashboardHeaderTitle };