@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,35 +1,35 @@
1
- import { Menu } from '@base-ui/react/menu';
2
- import * as React from 'react';
3
- import { ComponentSize } from './size-context.js';
4
-
1
+ import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
2
+ import * as React from "react";
3
+ import { Menu } from "@base-ui/react/menu";
4
+ //#region src/dropdown-menu.d.ts
5
5
  type DropdownMenuSize = ComponentSize;
6
6
  declare function DropdownMenu({ children, size, ...props }: Menu.Root.Props & {
7
- size?: DropdownMenuSize;
7
+ size?: DropdownMenuSize;
8
8
  }): React.JSX.Element;
9
9
  declare function DropdownMenuPortal({ ...props }: Menu.Portal.Props): React.JSX.Element;
10
10
  declare function DropdownMenuTrigger({ ...props }: Menu.Trigger.Props): React.JSX.Element;
11
- declare function DropdownMenuContent({ align, alignOffset, side, sideOffset, className, ...props }: Menu.Popup.Props & Pick<Menu.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): React.JSX.Element;
11
+ declare function DropdownMenuContent({ align, alignOffset, side, sideOffset, className, container, ...props }: Menu.Popup.Props & Pick<Menu.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset"> & Pick<Menu.Portal.Props, "container">): React.JSX.Element;
12
12
  declare function DropdownMenuGroup({ className, ...props }: Menu.Group.Props): React.JSX.Element;
13
13
  declare function DropdownMenuLabel({ className, inset, ...props }: Menu.GroupLabel.Props & {
14
- inset?: boolean;
14
+ inset?: boolean;
15
15
  }): React.JSX.Element;
16
16
  declare function DropdownMenuItem({ className, inset, variant, ...props }: Menu.Item.Props & {
17
- inset?: boolean;
18
- variant?: "default" | "destructive";
17
+ inset?: boolean;
18
+ variant?: "default" | "destructive";
19
19
  }): React.JSX.Element;
20
20
  declare function DropdownMenuSub({ ...props }: Menu.SubmenuRoot.Props): React.JSX.Element;
21
21
  declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: Menu.SubmenuTrigger.Props & {
22
- inset?: boolean;
22
+ inset?: boolean;
23
23
  }): React.JSX.Element;
24
24
  declare function DropdownMenuSubContent({ align, alignOffset, side, sideOffset, className, ...props }: React.ComponentProps<typeof DropdownMenuContent>): React.JSX.Element;
25
25
  declare function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }: Menu.CheckboxItem.Props & {
26
- inset?: boolean;
26
+ inset?: boolean;
27
27
  }): React.JSX.Element;
28
28
  declare function DropdownMenuRadioGroup({ ...props }: Menu.RadioGroup.Props): React.JSX.Element;
29
29
  declare function DropdownMenuRadioItem({ className, children, inset, ...props }: Menu.RadioItem.Props & {
30
- inset?: boolean;
30
+ inset?: boolean;
31
31
  }): React.JSX.Element;
32
32
  declare function DropdownMenuSeparator({ className, ...props }: Menu.Separator.Props): React.JSX.Element;
33
33
  declare function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
34
-
35
- export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, type DropdownMenuSize, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
34
+ //#endregion
35
+ export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, type DropdownMenuSize, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
@@ -1,376 +1,181 @@
1
- // src/components/ui/dropdown-menu.tsx
2
- import { Menu as MenuPrimitive } from "@base-ui/react/menu";
3
- import { cva } from "class-variance-authority";
1
+ "use client";
2
+ import { t as cn } from "./cn-BI_4DMBf.js";
3
+ import { SizeProvider, useComponentSize } from "./size-context.js";
4
4
  import { CheckIcon, ChevronRightIcon } from "lucide-react";
5
-
6
- // src/lib/cn.ts
7
- import { clsx } from "clsx";
8
- import { extendTailwindMerge } from "tailwind-merge";
9
- var twMerge = extendTailwindMerge({
10
- extend: {
11
- classGroups: {
12
- "font-size": [
13
- {
14
- text: [
15
- "gdt-display",
16
- "gdt-h1",
17
- "gdt-h2",
18
- "gdt-h3",
19
- "gdt-h4",
20
- "gdt-h5",
21
- "gdt-xl",
22
- "gdt-lg",
23
- "gdt-md",
24
- "gdt-sm",
25
- "gdt-xs",
26
- "gdt-subtext",
27
- "gdt-capitalized"
28
- ]
29
- }
30
- ]
31
- }
32
- }
33
- });
34
- function cn(...inputs) {
35
- return twMerge(clsx(inputs));
36
- }
37
-
38
- // src/components/ui/size-context.tsx
39
- import { createContext, useContext } from "react";
40
- import { Fragment, jsx } from "react/jsx-runtime";
41
- var SizeContext = createContext(void 0);
42
- function SizeProvider({
43
- children,
44
- size
45
- }) {
46
- if (!size) {
47
- return /* @__PURE__ */ jsx(Fragment, { children });
48
- }
49
- return /* @__PURE__ */ jsx(SizeContext.Provider, { value: size, children });
50
- }
51
- function useComponentSize(size, fallback = "md") {
52
- const inheritedSize = useContext(SizeContext);
53
- return size ?? inheritedSize ?? fallback;
54
- }
55
-
56
- // src/components/ui/dropdown-menu.tsx
57
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
58
- function DropdownMenu({
59
- children,
60
- size,
61
- ...props
62
- }) {
63
- return /* @__PURE__ */ jsx2(SizeProvider, { size, children: /* @__PURE__ */ jsx2(MenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props, children }) });
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+ import { cva } from "class-variance-authority";
7
+ import { Menu as Menu$1 } from "@base-ui/react/menu";
8
+ //#region src/dropdown-menu.tsx
9
+ function DropdownMenu({ children, size, ...props }) {
10
+ return /* @__PURE__ */ jsx(SizeProvider, {
11
+ size,
12
+ children: /* @__PURE__ */ jsx(Menu$1.Root, {
13
+ "data-slot": "dropdown-menu",
14
+ ...props,
15
+ children
16
+ })
17
+ });
64
18
  }
65
19
  function DropdownMenuPortal({ ...props }) {
66
- return /* @__PURE__ */ jsx2(MenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
20
+ return /* @__PURE__ */ jsx(Menu$1.Portal, {
21
+ "data-slot": "dropdown-menu-portal",
22
+ ...props
23
+ });
67
24
  }
68
25
  function DropdownMenuTrigger({ ...props }) {
69
- return /* @__PURE__ */ jsx2(MenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
70
- }
71
- var dropdownMenuContentVariants = cva(
72
- "relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto border border-line-subtle bg-canvas text-fg-primary shadow-(--elevation-e1-shadow) duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95",
73
- {
74
- variants: {
75
- size: {
76
- sm: "rounded-lg p-1",
77
- md: "rounded-xl p-1.5",
78
- lg: "rounded-[18px] p-2"
79
- }
80
- },
81
- defaultVariants: {
82
- size: "md"
83
- }
84
- }
85
- );
86
- var dropdownMenuItemVariants = cva(
87
- "group/dropdown-menu-item relative flex w-full cursor-pointer items-center font-normal text-fg-primary outline-none transition-colors select-none focus:bg-surface focus:text-fg-primary data-highlighted:bg-surface data-highlighted:text-fg-primary data-[variant=destructive]:text-fg-danger data-[variant=destructive]:focus:bg-surface-danger-subtle data-[variant=destructive]:focus:text-fg-danger data-[variant=destructive]:data-highlighted:bg-surface-danger-subtle data-[variant=destructive]:data-highlighted:text-fg-danger data-disabled:pointer-events-none data-disabled:text-fg-caption-placeholder data-disabled:opacity-100 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-[variant=destructive]:[&_svg]:text-fg-danger",
88
- {
89
- variants: {
90
- size: {
91
- sm: "gap-1.5 rounded-md px-3 py-1.5 text-gdt-xs [&_svg:not([class*='size-'])]:size-3.5",
92
- md: "gap-2 rounded-md px-4 py-2 text-gdt-sm [&_svg:not([class*='size-'])]:size-4",
93
- lg: "gap-2.5 rounded-md px-4 py-2.5 text-gdt-md [&_svg:not([class*='size-'])]:size-4.5"
94
- }
95
- },
96
- defaultVariants: {
97
- size: "md"
98
- }
99
- }
100
- );
101
- var dropdownMenuLabelVariants = cva(
102
- "font-medium text-fg-secondary data-inset:pl-8",
103
- {
104
- variants: {
105
- size: {
106
- sm: "px-3 py-1 text-gdt-xs",
107
- md: "px-3 py-1 text-gdt-xs",
108
- lg: "px-4 py-1.5 text-gdt-sm"
109
- }
110
- },
111
- defaultVariants: {
112
- size: "md"
113
- }
114
- }
115
- );
116
- function DropdownMenuContent({
117
- align = "start",
118
- alignOffset = 0,
119
- side = "bottom",
120
- sideOffset = 6,
121
- className,
122
- ...props
123
- }) {
124
- const resolvedSize = useComponentSize();
125
- return /* @__PURE__ */ jsx2(MenuPrimitive.Portal, { children: /* @__PURE__ */ jsx2(
126
- MenuPrimitive.Positioner,
127
- {
128
- className: "isolate z-50 outline-none",
129
- align,
130
- alignOffset,
131
- side,
132
- sideOffset,
133
- children: /* @__PURE__ */ jsx2(
134
- MenuPrimitive.Popup,
135
- {
136
- "data-slot": "dropdown-menu-content",
137
- "data-size": resolvedSize,
138
- className: cn(
139
- dropdownMenuContentVariants({ size: resolvedSize }),
140
- className
141
- ),
142
- ...props
143
- }
144
- )
145
- }
146
- ) });
26
+ return /* @__PURE__ */ jsx(Menu$1.Trigger, {
27
+ "data-slot": "dropdown-menu-trigger",
28
+ ...props
29
+ });
30
+ }
31
+ const dropdownMenuContentVariants = cva("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto border border-line-subtle bg-canvas text-fg-primary shadow-(--elevation-e1-shadow) duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95", {
32
+ variants: { size: {
33
+ sm: "rounded-lg p-1",
34
+ md: "rounded-xl p-1.5",
35
+ lg: "rounded-[18px] p-2"
36
+ } },
37
+ defaultVariants: { size: "md" }
38
+ });
39
+ const dropdownMenuItemVariants = cva("group/dropdown-menu-item relative flex w-full cursor-pointer items-center font-normal text-fg-primary outline-none transition-colors select-none focus:bg-surface focus:text-fg-primary data-highlighted:bg-surface data-highlighted:text-fg-primary data-[variant=destructive]:text-fg-danger data-[variant=destructive]:focus:bg-surface-danger-subtle data-[variant=destructive]:focus:text-fg-danger data-[variant=destructive]:data-highlighted:bg-surface-danger-subtle data-[variant=destructive]:data-highlighted:text-fg-danger data-disabled:pointer-events-none data-disabled:text-fg-caption-placeholder data-disabled:opacity-100 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-[variant=destructive]:[&_svg]:text-fg-danger", {
40
+ variants: { size: {
41
+ sm: "gap-1.5 rounded-md px-3 py-1.5 text-gdt-xs [&_svg:not([class*='size-'])]:size-3.5",
42
+ md: "gap-2 rounded-md px-4 py-2 text-gdt-sm [&_svg:not([class*='size-'])]:size-4",
43
+ lg: "gap-2.5 rounded-md px-4 py-2.5 text-gdt-md [&_svg:not([class*='size-'])]:size-4.5"
44
+ } },
45
+ defaultVariants: { size: "md" }
46
+ });
47
+ const dropdownMenuLabelVariants = cva("font-medium text-fg-secondary data-inset:pl-8", {
48
+ variants: { size: {
49
+ sm: "px-3 py-1 text-gdt-xs",
50
+ md: "px-3 py-1 text-gdt-xs",
51
+ lg: "px-4 py-1.5 text-gdt-sm"
52
+ } },
53
+ defaultVariants: { size: "md" }
54
+ });
55
+ function DropdownMenuContent({ align = "start", alignOffset = 0, side = "bottom", sideOffset = 6, className, container, ...props }) {
56
+ const resolvedSize = useComponentSize();
57
+ return /* @__PURE__ */ jsx(Menu$1.Portal, {
58
+ container,
59
+ children: /* @__PURE__ */ jsx(Menu$1.Positioner, {
60
+ className: "isolate z-50 outline-none",
61
+ align,
62
+ alignOffset,
63
+ side,
64
+ sideOffset,
65
+ children: /* @__PURE__ */ jsx(Menu$1.Popup, {
66
+ "data-slot": "dropdown-menu-content",
67
+ "data-size": resolvedSize,
68
+ className: cn(dropdownMenuContentVariants({ size: resolvedSize }), className),
69
+ ...props
70
+ })
71
+ })
72
+ });
147
73
  }
148
74
  function DropdownMenuGroup({ className, ...props }) {
149
- return /* @__PURE__ */ jsx2(
150
- MenuPrimitive.Group,
151
- {
152
- "data-slot": "dropdown-menu-group",
153
- className: cn("scroll-my-1 space-y-0.5", className),
154
- ...props
155
- }
156
- );
157
- }
158
- function DropdownMenuLabel({
159
- className,
160
- inset,
161
- ...props
162
- }) {
163
- const resolvedSize = useComponentSize();
164
- return /* @__PURE__ */ jsx2(
165
- MenuPrimitive.GroupLabel,
166
- {
167
- "data-slot": "dropdown-menu-label",
168
- "data-inset": inset,
169
- className: cn(
170
- dropdownMenuLabelVariants({ size: resolvedSize }),
171
- className
172
- ),
173
- ...props
174
- }
175
- );
176
- }
177
- function DropdownMenuItem({
178
- className,
179
- inset,
180
- variant = "default",
181
- ...props
182
- }) {
183
- const resolvedSize = useComponentSize();
184
- return /* @__PURE__ */ jsx2(
185
- MenuPrimitive.Item,
186
- {
187
- "data-slot": "dropdown-menu-item",
188
- "data-inset": inset,
189
- "data-size": resolvedSize,
190
- "data-variant": variant,
191
- className: cn(
192
- dropdownMenuItemVariants({ size: resolvedSize }),
193
- "data-inset:pl-8",
194
- className
195
- ),
196
- ...props
197
- }
198
- );
75
+ return /* @__PURE__ */ jsx(Menu$1.Group, {
76
+ "data-slot": "dropdown-menu-group",
77
+ className: cn("scroll-my-1 space-y-0.5", className),
78
+ ...props
79
+ });
80
+ }
81
+ function DropdownMenuLabel({ className, inset, ...props }) {
82
+ const resolvedSize = useComponentSize();
83
+ return /* @__PURE__ */ jsx(Menu$1.GroupLabel, {
84
+ "data-slot": "dropdown-menu-label",
85
+ "data-inset": inset,
86
+ className: cn(dropdownMenuLabelVariants({ size: resolvedSize }), className),
87
+ ...props
88
+ });
89
+ }
90
+ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
91
+ const resolvedSize = useComponentSize();
92
+ return /* @__PURE__ */ jsx(Menu$1.Item, {
93
+ "data-slot": "dropdown-menu-item",
94
+ "data-inset": inset,
95
+ "data-size": resolvedSize,
96
+ "data-variant": variant,
97
+ className: cn(dropdownMenuItemVariants({ size: resolvedSize }), "data-inset:pl-8", className),
98
+ ...props
99
+ });
199
100
  }
200
101
  function DropdownMenuSub({ ...props }) {
201
- return /* @__PURE__ */ jsx2(MenuPrimitive.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
202
- }
203
- function DropdownMenuSubTrigger({
204
- className,
205
- inset,
206
- children,
207
- ...props
208
- }) {
209
- const resolvedSize = useComponentSize();
210
- return /* @__PURE__ */ jsxs(
211
- MenuPrimitive.SubmenuTrigger,
212
- {
213
- "data-slot": "dropdown-menu-sub-trigger",
214
- "data-inset": inset,
215
- "data-size": resolvedSize,
216
- className: cn(
217
- dropdownMenuItemVariants({ size: resolvedSize }),
218
- "data-inset:pl-8 data-open:bg-surface data-open:text-fg-primary data-popup-open:bg-surface data-popup-open:text-fg-primary",
219
- className
220
- ),
221
- ...props,
222
- children: [
223
- children,
224
- /* @__PURE__ */ jsx2(ChevronRightIcon, { className: "cn-rtl-flip ml-auto" })
225
- ]
226
- }
227
- );
228
- }
229
- function DropdownMenuSubContent({
230
- align = "start",
231
- alignOffset = -3,
232
- side = "right",
233
- sideOffset = 4,
234
- className,
235
- ...props
236
- }) {
237
- return /* @__PURE__ */ jsx2(
238
- DropdownMenuContent,
239
- {
240
- "data-slot": "dropdown-menu-sub-content",
241
- className: cn(
242
- "w-auto min-w-28 shadow-(--elevation-e2-shadow)",
243
- className
244
- ),
245
- align,
246
- alignOffset,
247
- side,
248
- sideOffset,
249
- ...props
250
- }
251
- );
252
- }
253
- function DropdownMenuCheckboxItem({
254
- className,
255
- children,
256
- checked,
257
- inset,
258
- ...props
259
- }) {
260
- const resolvedSize = useComponentSize();
261
- return /* @__PURE__ */ jsxs(
262
- MenuPrimitive.CheckboxItem,
263
- {
264
- "data-slot": "dropdown-menu-checkbox-item",
265
- "data-inset": inset,
266
- "data-size": resolvedSize,
267
- className: cn(
268
- dropdownMenuItemVariants({ size: resolvedSize }),
269
- "pr-10 data-inset:pl-8",
270
- className
271
- ),
272
- checked,
273
- ...props,
274
- children: [
275
- /* @__PURE__ */ jsx2(
276
- "span",
277
- {
278
- className: "pointer-events-none absolute right-3 flex items-center justify-center text-fg-brand",
279
- "data-slot": "dropdown-menu-checkbox-item-indicator",
280
- children: /* @__PURE__ */ jsx2(MenuPrimitive.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx2(CheckIcon, {}) })
281
- }
282
- ),
283
- children
284
- ]
285
- }
286
- );
102
+ return /* @__PURE__ */ jsx(Menu$1.SubmenuRoot, {
103
+ "data-slot": "dropdown-menu-sub",
104
+ ...props
105
+ });
106
+ }
107
+ function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
108
+ const resolvedSize = useComponentSize();
109
+ return /* @__PURE__ */ jsxs(Menu$1.SubmenuTrigger, {
110
+ "data-slot": "dropdown-menu-sub-trigger",
111
+ "data-inset": inset,
112
+ "data-size": resolvedSize,
113
+ className: cn(dropdownMenuItemVariants({ size: resolvedSize }), "data-inset:pl-8 data-open:bg-surface data-open:text-fg-primary data-popup-open:bg-surface data-popup-open:text-fg-primary", className),
114
+ ...props,
115
+ children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "cn-rtl-flip ml-auto" })]
116
+ });
117
+ }
118
+ function DropdownMenuSubContent({ align = "start", alignOffset = -3, side = "right", sideOffset = 4, className, ...props }) {
119
+ return /* @__PURE__ */ jsx(DropdownMenuContent, {
120
+ "data-slot": "dropdown-menu-sub-content",
121
+ className: cn("w-auto min-w-28 shadow-(--elevation-e2-shadow)", className),
122
+ align,
123
+ alignOffset,
124
+ side,
125
+ sideOffset,
126
+ ...props
127
+ });
128
+ }
129
+ function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }) {
130
+ const resolvedSize = useComponentSize();
131
+ return /* @__PURE__ */ jsxs(Menu$1.CheckboxItem, {
132
+ "data-slot": "dropdown-menu-checkbox-item",
133
+ "data-inset": inset,
134
+ "data-size": resolvedSize,
135
+ className: cn(dropdownMenuItemVariants({ size: resolvedSize }), "pr-10 data-inset:pl-8", className),
136
+ checked,
137
+ ...props,
138
+ children: [/* @__PURE__ */ jsx("span", {
139
+ className: "pointer-events-none absolute right-3 flex items-center justify-center text-fg-brand",
140
+ "data-slot": "dropdown-menu-checkbox-item-indicator",
141
+ children: /* @__PURE__ */ jsx(Menu$1.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
142
+ }), children]
143
+ });
287
144
  }
288
145
  function DropdownMenuRadioGroup({ ...props }) {
289
- return /* @__PURE__ */ jsx2(
290
- MenuPrimitive.RadioGroup,
291
- {
292
- "data-slot": "dropdown-menu-radio-group",
293
- ...props
294
- }
295
- );
296
- }
297
- function DropdownMenuRadioItem({
298
- className,
299
- children,
300
- inset,
301
- ...props
302
- }) {
303
- const resolvedSize = useComponentSize();
304
- return /* @__PURE__ */ jsxs(
305
- MenuPrimitive.RadioItem,
306
- {
307
- "data-slot": "dropdown-menu-radio-item",
308
- "data-inset": inset,
309
- "data-size": resolvedSize,
310
- className: cn(
311
- dropdownMenuItemVariants({ size: resolvedSize }),
312
- "pr-10 data-inset:pl-8",
313
- className
314
- ),
315
- ...props,
316
- children: [
317
- /* @__PURE__ */ jsx2(
318
- "span",
319
- {
320
- className: "pointer-events-none absolute right-3 flex items-center justify-center text-fg-brand",
321
- "data-slot": "dropdown-menu-radio-item-indicator",
322
- children: /* @__PURE__ */ jsx2(MenuPrimitive.RadioItemIndicator, { children: /* @__PURE__ */ jsx2(CheckIcon, {}) })
323
- }
324
- ),
325
- children
326
- ]
327
- }
328
- );
329
- }
330
- function DropdownMenuSeparator({
331
- className,
332
- ...props
333
- }) {
334
- return /* @__PURE__ */ jsx2(
335
- MenuPrimitive.Separator,
336
- {
337
- "data-slot": "dropdown-menu-separator",
338
- className: cn("pointer-events-none my-1 h-px bg-line-subtle", className),
339
- ...props
340
- }
341
- );
342
- }
343
- function DropdownMenuShortcut({
344
- className,
345
- ...props
346
- }) {
347
- return /* @__PURE__ */ jsx2(
348
- "span",
349
- {
350
- "data-slot": "dropdown-menu-shortcut",
351
- className: cn(
352
- "ml-auto text-gdt-xs tracking-widest text-fg-secondary group-focus/dropdown-menu-item:text-fg-primary group-data-highlighted/dropdown-menu-item:text-fg-primary",
353
- className
354
- ),
355
- ...props
356
- }
357
- );
358
- }
359
- export {
360
- DropdownMenu,
361
- DropdownMenuCheckboxItem,
362
- DropdownMenuContent,
363
- DropdownMenuGroup,
364
- DropdownMenuItem,
365
- DropdownMenuLabel,
366
- DropdownMenuPortal,
367
- DropdownMenuRadioGroup,
368
- DropdownMenuRadioItem,
369
- DropdownMenuSeparator,
370
- DropdownMenuShortcut,
371
- DropdownMenuSub,
372
- DropdownMenuSubContent,
373
- DropdownMenuSubTrigger,
374
- DropdownMenuTrigger
375
- };
376
- //# sourceMappingURL=dropdown-menu.js.map
146
+ return /* @__PURE__ */ jsx(Menu$1.RadioGroup, {
147
+ "data-slot": "dropdown-menu-radio-group",
148
+ ...props
149
+ });
150
+ }
151
+ function DropdownMenuRadioItem({ className, children, inset, ...props }) {
152
+ const resolvedSize = useComponentSize();
153
+ return /* @__PURE__ */ jsxs(Menu$1.RadioItem, {
154
+ "data-slot": "dropdown-menu-radio-item",
155
+ "data-inset": inset,
156
+ "data-size": resolvedSize,
157
+ className: cn(dropdownMenuItemVariants({ size: resolvedSize }), "pr-10 data-inset:pl-8", className),
158
+ ...props,
159
+ children: [/* @__PURE__ */ jsx("span", {
160
+ className: "pointer-events-none absolute right-3 flex items-center justify-center text-fg-brand",
161
+ "data-slot": "dropdown-menu-radio-item-indicator",
162
+ children: /* @__PURE__ */ jsx(Menu$1.RadioItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
163
+ }), children]
164
+ });
165
+ }
166
+ function DropdownMenuSeparator({ className, ...props }) {
167
+ return /* @__PURE__ */ jsx(Menu$1.Separator, {
168
+ "data-slot": "dropdown-menu-separator",
169
+ className: cn("pointer-events-none my-1 h-px bg-line-subtle", className),
170
+ ...props
171
+ });
172
+ }
173
+ function DropdownMenuShortcut({ className, ...props }) {
174
+ return /* @__PURE__ */ jsx("span", {
175
+ "data-slot": "dropdown-menu-shortcut",
176
+ className: cn("ml-auto text-gdt-xs tracking-widest text-fg-secondary group-focus/dropdown-menu-item:text-fg-primary group-data-highlighted/dropdown-menu-item:text-fg-primary", className),
177
+ ...props
178
+ });
179
+ }
180
+ //#endregion
181
+ export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };