@sikka/hawa 0.48.1-next → 0.49.0-next

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 (299) hide show
  1. package/dist/accordion/index.js +3 -28
  2. package/dist/accordion/index.js.map +1 -1
  3. package/dist/accordion/index.mjs +3 -28
  4. package/dist/accordion/index.mjs.map +1 -1
  5. package/dist/alert/index.js +53 -98
  6. package/dist/alert/index.js.map +1 -1
  7. package/dist/alert/index.mjs +53 -98
  8. package/dist/alert/index.mjs.map +1 -1
  9. package/dist/appLayout/index.d.mts +2 -0
  10. package/dist/appLayout/index.d.ts +2 -0
  11. package/dist/appLayout/index.js +263 -409
  12. package/dist/appLayout/index.js.map +1 -1
  13. package/dist/appLayout/index.mjs +263 -409
  14. package/dist/appLayout/index.mjs.map +1 -1
  15. package/dist/appMenubar/index.js +15 -20
  16. package/dist/appMenubar/index.js.map +1 -1
  17. package/dist/appMenubar/index.mjs +15 -20
  18. package/dist/appMenubar/index.mjs.map +1 -1
  19. package/dist/appTabs/index.js +28 -37
  20. package/dist/appTabs/index.js.map +1 -1
  21. package/dist/appTabs/index.mjs +28 -37
  22. package/dist/appTabs/index.mjs.map +1 -1
  23. package/dist/appTopbar/index.js +125 -173
  24. package/dist/appTopbar/index.js.map +1 -1
  25. package/dist/appTopbar/index.mjs +125 -173
  26. package/dist/appTopbar/index.mjs.map +1 -1
  27. package/dist/avatar/index.js.map +1 -1
  28. package/dist/avatar/index.mjs.map +1 -1
  29. package/dist/backToTop/index.js +50 -82
  30. package/dist/backToTop/index.js.map +1 -1
  31. package/dist/backToTop/index.mjs +50 -82
  32. package/dist/backToTop/index.mjs.map +1 -1
  33. package/dist/badge/index.d.mts +1 -1
  34. package/dist/badge/index.d.ts +1 -1
  35. package/dist/badge/index.js +2 -18
  36. package/dist/badge/index.js.map +1 -1
  37. package/dist/badge/index.mjs +2 -18
  38. package/dist/badge/index.mjs.map +1 -1
  39. package/dist/blocks/auth/index.js +202 -468
  40. package/dist/blocks/auth/index.mjs +96 -280
  41. package/dist/blocks/feedback/index.js +214 -375
  42. package/dist/blocks/feedback/index.mjs +12 -25
  43. package/dist/blocks/index.js +604 -1122
  44. package/dist/blocks/index.mjs +132 -291
  45. package/dist/blocks/misc/index.js +136 -251
  46. package/dist/blocks/misc/index.mjs +29 -54
  47. package/dist/blocks/pricing/index.js +220 -397
  48. package/dist/blocks/pricing/index.mjs +63 -134
  49. package/dist/breadcrumb/index.js +1 -5
  50. package/dist/breadcrumb/index.js.map +1 -1
  51. package/dist/breadcrumb/index.mjs +1 -5
  52. package/dist/breadcrumb/index.mjs.map +1 -1
  53. package/dist/button/index.js +50 -82
  54. package/dist/button/index.js.map +1 -1
  55. package/dist/button/index.mjs +50 -82
  56. package/dist/button/index.mjs.map +1 -1
  57. package/dist/calendar/index.js +50 -82
  58. package/dist/calendar/index.js.map +1 -1
  59. package/dist/calendar/index.mjs +50 -82
  60. package/dist/calendar/index.mjs.map +1 -1
  61. package/dist/card/index.js +7 -35
  62. package/dist/card/index.js.map +1 -1
  63. package/dist/card/index.mjs +7 -35
  64. package/dist/card/index.mjs.map +1 -1
  65. package/dist/carousel/index.js +15 -27
  66. package/dist/carousel/index.js.map +1 -1
  67. package/dist/carousel/index.mjs +15 -27
  68. package/dist/carousel/index.mjs.map +1 -1
  69. package/dist/checkbox/index.js +2 -13
  70. package/dist/checkbox/index.js.map +1 -1
  71. package/dist/checkbox/index.mjs +2 -13
  72. package/dist/checkbox/index.mjs.map +1 -1
  73. package/dist/chip/index.js +2 -16
  74. package/dist/chip/index.js.map +1 -1
  75. package/dist/chip/index.mjs +2 -16
  76. package/dist/chip/index.mjs.map +1 -1
  77. package/dist/{chunk-WUMDFBEK.mjs → chunk-3CHFVHTW.mjs} +43 -54
  78. package/dist/{chunk-2LUXOXAL.mjs → chunk-5SQBJRWE.mjs} +3 -9
  79. package/dist/{chunk-C2UOOH4X.mjs → chunk-B53SP2WZ.mjs} +3 -17
  80. package/dist/chunk-GHGWQVTM.mjs +150 -0
  81. package/dist/{chunk-5S5DR7KF.mjs → chunk-I23ONEDJ.mjs} +2 -10
  82. package/dist/{chunk-JFWD2ICY.mjs → chunk-JT7R3L5O.mjs} +54 -62
  83. package/dist/{chunk-6SJUUJOV.mjs → chunk-KDGJZPWK.mjs} +295 -574
  84. package/dist/{chunk-AWJSHOYU.mjs → chunk-KSJGXQTE.mjs} +1 -1
  85. package/dist/{chunk-NMW4GM4G.mjs → chunk-SE2JMXYG.mjs} +104 -144
  86. package/dist/{chunk-GBLWUEYN.mjs → chunk-ULRL4WI6.mjs} +176 -256
  87. package/dist/{chunk-IFWYR5W2.mjs → chunk-VUELRPUL.mjs} +57 -117
  88. package/dist/{chunk-WL7C2A5D.mjs → chunk-WQR4XZGL.mjs} +8 -15
  89. package/dist/codeBlock/index.js +50 -82
  90. package/dist/codeBlock/index.js.map +1 -1
  91. package/dist/codeBlock/index.mjs +50 -82
  92. package/dist/codeBlock/index.mjs.map +1 -1
  93. package/dist/colorPicker/index.js +21 -33
  94. package/dist/colorPicker/index.js.map +1 -1
  95. package/dist/colorPicker/index.mjs +22 -37
  96. package/dist/colorPicker/index.mjs.map +1 -1
  97. package/dist/combobox/index.d.mts +1 -1
  98. package/dist/combobox/index.d.ts +1 -1
  99. package/dist/combobox/index.js +141 -223
  100. package/dist/combobox/index.js.map +1 -1
  101. package/dist/combobox/index.mjs +141 -223
  102. package/dist/combobox/index.mjs.map +1 -1
  103. package/dist/command/index.d.mts +1 -1
  104. package/dist/command/index.d.ts +1 -1
  105. package/dist/command/index.js +129 -212
  106. package/dist/command/index.js.map +1 -1
  107. package/dist/command/index.mjs +129 -212
  108. package/dist/command/index.mjs.map +1 -1
  109. package/dist/dataTable/index.js +254 -394
  110. package/dist/dataTable/index.js.map +1 -1
  111. package/dist/dataTable/index.mjs +254 -394
  112. package/dist/dataTable/index.mjs.map +1 -1
  113. package/dist/datePicker/index.js +64 -105
  114. package/dist/datePicker/index.js.map +1 -1
  115. package/dist/datePicker/index.mjs +64 -105
  116. package/dist/datePicker/index.mjs.map +1 -1
  117. package/dist/destroyableCard/index.js +8 -39
  118. package/dist/destroyableCard/index.js.map +1 -1
  119. package/dist/destroyableCard/index.mjs +8 -39
  120. package/dist/destroyableCard/index.mjs.map +1 -1
  121. package/dist/dialog/index.js +70 -122
  122. package/dist/dialog/index.js.map +1 -1
  123. package/dist/dialog/index.mjs +70 -122
  124. package/dist/dialog/index.mjs.map +1 -1
  125. package/dist/docsLayout/index.js +169 -358
  126. package/dist/docsLayout/index.js.map +1 -1
  127. package/dist/docsLayout/index.mjs +169 -358
  128. package/dist/docsLayout/index.mjs.map +1 -1
  129. package/dist/docsSidebar/index.js +9 -16
  130. package/dist/docsSidebar/index.js.map +1 -1
  131. package/dist/docsSidebar/index.mjs +9 -16
  132. package/dist/docsSidebar/index.mjs.map +1 -1
  133. package/dist/dropdownMenu/index.js +124 -164
  134. package/dist/dropdownMenu/index.js.map +1 -1
  135. package/dist/dropdownMenu/index.mjs +124 -164
  136. package/dist/dropdownMenu/index.mjs.map +1 -1
  137. package/dist/elements/index.d.mts +3 -3
  138. package/dist/elements/index.d.ts +3 -3
  139. package/dist/elements/index.js +841 -1505
  140. package/dist/elements/index.mjs +381 -718
  141. package/dist/fileDropzone/index.js +60 -159
  142. package/dist/fileDropzone/index.js.map +1 -1
  143. package/dist/fileDropzone/index.mjs +60 -159
  144. package/dist/fileDropzone/index.mjs.map +1 -1
  145. package/dist/glow/index.js +4 -16
  146. package/dist/glow/index.js.map +1 -1
  147. package/dist/glow/index.mjs +4 -16
  148. package/dist/glow/index.mjs.map +1 -1
  149. package/dist/hooks/index.d.mts +1 -5
  150. package/dist/hooks/index.d.ts +1 -5
  151. package/dist/hooks/index.js +11 -24
  152. package/dist/hooks/index.mjs +2 -2
  153. package/dist/{index-B0aJcA6d.d.ts → index-BgNycocQ.d.mts} +2 -2
  154. package/dist/{index-B0aJcA6d.d.mts → index-BgNycocQ.d.ts} +2 -2
  155. package/dist/index.css +1 -2
  156. package/dist/index.d.mts +6 -8
  157. package/dist/index.d.ts +6 -8
  158. package/dist/index.js +1194 -2170
  159. package/dist/index.mjs +1195 -2174
  160. package/dist/input/index.js +20 -29
  161. package/dist/input/index.js.map +1 -1
  162. package/dist/input/index.mjs +20 -29
  163. package/dist/input/index.mjs.map +1 -1
  164. package/dist/interfaceSettings/index.js +122 -163
  165. package/dist/interfaceSettings/index.js.map +1 -1
  166. package/dist/interfaceSettings/index.mjs +122 -163
  167. package/dist/interfaceSettings/index.mjs.map +1 -1
  168. package/dist/label/index.js +19 -26
  169. package/dist/label/index.js.map +1 -1
  170. package/dist/label/index.mjs +19 -26
  171. package/dist/label/index.mjs.map +1 -1
  172. package/dist/layout/index.d.mts +2 -0
  173. package/dist/layout/index.d.ts +2 -0
  174. package/dist/layout/index.js +434 -790
  175. package/dist/layout/index.mjs +143 -243
  176. package/dist/loading/index.js +30 -53
  177. package/dist/loading/index.js.map +1 -1
  178. package/dist/loading/index.mjs +30 -53
  179. package/dist/loading/index.mjs.map +1 -1
  180. package/dist/logos/index.js +66 -191
  181. package/dist/logos/index.js.map +1 -1
  182. package/dist/logos/index.mjs +66 -191
  183. package/dist/logos/index.mjs.map +1 -1
  184. package/dist/navbar/index.js +1 -4
  185. package/dist/navbar/index.js.map +1 -1
  186. package/dist/navbar/index.mjs +1 -4
  187. package/dist/navbar/index.mjs.map +1 -1
  188. package/dist/navigationMenu/index.js +14 -22
  189. package/dist/navigationMenu/index.js.map +1 -1
  190. package/dist/navigationMenu/index.mjs +14 -22
  191. package/dist/navigationMenu/index.mjs.map +1 -1
  192. package/dist/pagination/index.js +1 -5
  193. package/dist/pagination/index.js.map +1 -1
  194. package/dist/pagination/index.mjs +1 -5
  195. package/dist/pagination/index.mjs.map +1 -1
  196. package/dist/passwordInput/index.js +36 -65
  197. package/dist/passwordInput/index.js.map +1 -1
  198. package/dist/passwordInput/index.mjs +36 -65
  199. package/dist/passwordInput/index.mjs.map +1 -1
  200. package/dist/phoneInput/index.js +20 -29
  201. package/dist/phoneInput/index.js.map +1 -1
  202. package/dist/phoneInput/index.mjs +20 -29
  203. package/dist/phoneInput/index.mjs.map +1 -1
  204. package/dist/pinInput/index.js +14 -16
  205. package/dist/pinInput/index.js.map +1 -1
  206. package/dist/pinInput/index.mjs +14 -16
  207. package/dist/pinInput/index.mjs.map +1 -1
  208. package/dist/popover/index.js +14 -24
  209. package/dist/popover/index.js.map +1 -1
  210. package/dist/popover/index.mjs +14 -24
  211. package/dist/popover/index.mjs.map +1 -1
  212. package/dist/progress/index.js +19 -26
  213. package/dist/progress/index.js.map +1 -1
  214. package/dist/progress/index.mjs +19 -26
  215. package/dist/progress/index.mjs.map +1 -1
  216. package/dist/progressCircle/index.js +67 -71
  217. package/dist/progressCircle/index.js.map +1 -1
  218. package/dist/progressCircle/index.mjs +67 -71
  219. package/dist/progressCircle/index.mjs.map +1 -1
  220. package/dist/radio/index.js +122 -163
  221. package/dist/radio/index.js.map +1 -1
  222. package/dist/radio/index.mjs +122 -163
  223. package/dist/radio/index.mjs.map +1 -1
  224. package/dist/scrollArea/index.js.map +1 -1
  225. package/dist/scrollArea/index.mjs.map +1 -1
  226. package/dist/scrollIndicator/index.js +1 -4
  227. package/dist/scrollIndicator/index.js.map +1 -1
  228. package/dist/scrollIndicator/index.mjs +1 -4
  229. package/dist/scrollIndicator/index.mjs.map +1 -1
  230. package/dist/select/index.js +20 -29
  231. package/dist/select/index.js.map +1 -1
  232. package/dist/select/index.mjs +20 -29
  233. package/dist/select/index.mjs.map +1 -1
  234. package/dist/separator/index.js.map +1 -1
  235. package/dist/separator/index.mjs.map +1 -1
  236. package/dist/sheet/index.js +42 -53
  237. package/dist/sheet/index.js.map +1 -1
  238. package/dist/sheet/index.mjs +42 -53
  239. package/dist/sheet/index.mjs.map +1 -1
  240. package/dist/sidebar/index.js +66 -133
  241. package/dist/sidebar/index.js.map +1 -1
  242. package/dist/sidebar/index.mjs +66 -133
  243. package/dist/sidebar/index.mjs.map +1 -1
  244. package/dist/signature/index.js +19 -26
  245. package/dist/signature/index.js.map +1 -1
  246. package/dist/signature/index.mjs +19 -26
  247. package/dist/signature/index.mjs.map +1 -1
  248. package/dist/simpleTable/index.js +50 -81
  249. package/dist/simpleTable/index.js.map +1 -1
  250. package/dist/simpleTable/index.mjs +50 -81
  251. package/dist/simpleTable/index.mjs.map +1 -1
  252. package/dist/skeleton/index.js.map +1 -1
  253. package/dist/skeleton/index.mjs.map +1 -1
  254. package/dist/slider/index.js.map +1 -1
  255. package/dist/slider/index.mjs.map +1 -1
  256. package/dist/sonner/index.js.map +1 -1
  257. package/dist/sonner/index.mjs.map +1 -1
  258. package/dist/sortButton/index.js +50 -82
  259. package/dist/sortButton/index.js.map +1 -1
  260. package/dist/sortButton/index.mjs +50 -82
  261. package/dist/sortButton/index.mjs.map +1 -1
  262. package/dist/splitButton/index.js +214 -294
  263. package/dist/splitButton/index.js.map +1 -1
  264. package/dist/splitButton/index.mjs +214 -294
  265. package/dist/splitButton/index.mjs.map +1 -1
  266. package/dist/stats/index.js +7 -35
  267. package/dist/stats/index.js.map +1 -1
  268. package/dist/stats/index.mjs +7 -35
  269. package/dist/stats/index.mjs.map +1 -1
  270. package/dist/switch/index.js +24 -34
  271. package/dist/switch/index.js.map +1 -1
  272. package/dist/switch/index.mjs +24 -34
  273. package/dist/switch/index.mjs.map +1 -1
  274. package/dist/table/index.js +27 -29
  275. package/dist/table/index.js.map +1 -1
  276. package/dist/table/index.mjs +27 -29
  277. package/dist/table/index.mjs.map +1 -1
  278. package/dist/tabs/index.js +54 -76
  279. package/dist/tabs/index.js.map +1 -1
  280. package/dist/tabs/index.mjs +54 -76
  281. package/dist/tabs/index.mjs.map +1 -1
  282. package/dist/textarea/index.js +21 -38
  283. package/dist/textarea/index.js.map +1 -1
  284. package/dist/textarea/index.mjs +21 -38
  285. package/dist/textarea/index.mjs.map +1 -1
  286. package/dist/toast/index.js +2 -10
  287. package/dist/toast/index.js.map +1 -1
  288. package/dist/toast/index.mjs +2 -10
  289. package/dist/toast/index.mjs.map +1 -1
  290. package/dist/toaster/index.js +3 -16
  291. package/dist/toaster/index.js.map +1 -1
  292. package/dist/toaster/index.mjs +3 -16
  293. package/dist/toaster/index.mjs.map +1 -1
  294. package/dist/tooltip/index.js +19 -26
  295. package/dist/tooltip/index.js.map +1 -1
  296. package/dist/tooltip/index.mjs +19 -26
  297. package/dist/tooltip/index.mjs.map +1 -1
  298. package/package.json +12 -12
  299. package/dist/chunk-JP2N5WKD.mjs +0 -190
@@ -107,16 +107,7 @@ import { tv } from "tailwind-variants";
107
107
  // elements/chip/Chip.tsx
108
108
  import React9 from "react";
109
109
  var Chip = React9.forwardRef(
110
- ({
111
- label,
112
- size = "normal",
113
- icon,
114
- color,
115
- radius = "inherit",
116
- dot,
117
- dotStatus = "none",
118
- ...rest
119
- }, ref) => {
110
+ ({ label, size = "normal", icon, color, radius = "inherit", dot, dotStatus = "none", ...rest }, ref) => {
120
111
  let defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold ";
121
112
  let radiusStyles = {
122
113
  inherit: " hawa-rounded",
@@ -163,12 +154,7 @@ var Chip = React9.forwardRef(
163
154
  rest.className
164
155
  )
165
156
  },
166
- dot && /* @__PURE__ */ React9.createElement(
167
- "span",
168
- {
169
- className: cn(dotStyles[size], dotStatusStyles[dotStatus])
170
- }
171
- ),
157
+ dot && /* @__PURE__ */ React9.createElement("span", { className: cn(dotStyles[size], dotStatusStyles[dotStatus]) }),
172
158
  icon && icon,
173
159
  label
174
160
  );
@@ -385,83 +371,75 @@ var Tabs = React11.forwardRef(
385
371
  /* @__PURE__ */ React11.createElement(TabsContext.Provider, { value: { orientation, variant, scrollable } }, props.children)
386
372
  )
387
373
  );
388
- var TabsList = React11.forwardRef(({ className, classNames, ...props }, ref) => {
389
- const { orientation, variant, scrollable } = React11.useContext(TabsContext);
390
- const { width } = useViewportSize();
391
- if (scrollable && width < 768 && orientation === "horizontal") {
392
- return /* @__PURE__ */ React11.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React11.createElement(
393
- TabsPrimitive.List,
394
- {
395
- ref,
396
- className: cn(
397
- tabsListVariant({ variant, orientation }),
398
- "hawa-flex-row hawa-flex-nowrap",
399
- className
400
- ),
401
- ...props
402
- }
403
- ));
404
- } else {
405
- return /* @__PURE__ */ React11.createElement(
406
- TabsPrimitive.List,
407
- {
408
- ref,
409
- className: cn(
410
- tabsListVariant({ variant, orientation }),
411
- orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row",
412
- "hawa-flex-wrap",
413
- className
414
- ),
415
- ...props
416
- }
417
- );
418
- }
419
- });
420
- var TabsTrigger = React11.forwardRef(
421
- ({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {
422
- const { orientation, variant } = React11.useContext(TabsContext);
423
- if (withPopover) {
424
- return /* @__PURE__ */ React11.createElement(Popover.Root, { open: props.showPopover }, /* @__PURE__ */ React11.createElement(Popover.Anchor, { asChild: true }, /* @__PURE__ */ React11.createElement(
425
- TabsPrimitive.Trigger,
374
+ var TabsList = React11.forwardRef(
375
+ ({ className, classNames, ...props }, ref) => {
376
+ const { orientation, variant, scrollable } = React11.useContext(TabsContext);
377
+ const { width } = useViewportSize();
378
+ if (scrollable && width < 768 && orientation === "horizontal") {
379
+ return /* @__PURE__ */ React11.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React11.createElement(
380
+ TabsPrimitive.List,
426
381
  {
382
+ ref,
427
383
  className: cn(
428
- tabsTriggerVariant({ variant, orientation }),
429
- "hawa-relative",
384
+ tabsListVariant({ variant, orientation }),
385
+ "hawa-flex-row hawa-flex-nowrap",
430
386
  className
431
387
  ),
432
388
  ...props
433
- },
434
- props.children,
435
- chipProps && /* @__PURE__ */ React11.createElement(Chip, { ...chipProps })
436
- )), /* @__PURE__ */ React11.createElement(
437
- Popover.Content,
438
- {
439
- onClick: onPopoverClick,
440
- asChild: true,
441
- className: cn(
442
- "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
443
- "hawa-arrow-default-top hawa-mt-2"
444
- )
445
- },
446
- /* @__PURE__ */ React11.createElement("div", { className: "hawa-p-2" }, " ", props.popoverContent)
389
+ }
447
390
  ));
448
391
  } else {
449
392
  return /* @__PURE__ */ React11.createElement(
450
- TabsPrimitive.Trigger,
393
+ TabsPrimitive.List,
451
394
  {
395
+ ref,
452
396
  className: cn(
453
- tabsTriggerVariant({ variant, orientation }),
454
- "hawa-relative",
397
+ tabsListVariant({ variant, orientation }),
398
+ orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row",
399
+ "hawa-flex-wrap",
455
400
  className
456
401
  ),
457
402
  ...props
458
- },
459
- props.children,
460
- chipProps && /* @__PURE__ */ React11.createElement(Chip, { ...chipProps })
403
+ }
461
404
  );
462
405
  }
463
406
  }
464
407
  );
408
+ var TabsTrigger = React11.forwardRef(({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {
409
+ const { orientation, variant } = React11.useContext(TabsContext);
410
+ if (withPopover) {
411
+ return /* @__PURE__ */ React11.createElement(Popover.Root, { open: props.showPopover }, /* @__PURE__ */ React11.createElement(Popover.Anchor, { asChild: true }, /* @__PURE__ */ React11.createElement(
412
+ TabsPrimitive.Trigger,
413
+ {
414
+ className: cn(tabsTriggerVariant({ variant, orientation }), "hawa-relative", className),
415
+ ...props
416
+ },
417
+ props.children,
418
+ chipProps && /* @__PURE__ */ React11.createElement(Chip, { ...chipProps })
419
+ )), /* @__PURE__ */ React11.createElement(
420
+ Popover.Content,
421
+ {
422
+ onClick: onPopoverClick,
423
+ asChild: true,
424
+ className: cn(
425
+ "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
426
+ "hawa-arrow-default-top hawa-mt-2"
427
+ )
428
+ },
429
+ /* @__PURE__ */ React11.createElement("div", { className: "hawa-p-2" }, " ", props.popoverContent)
430
+ ));
431
+ } else {
432
+ return /* @__PURE__ */ React11.createElement(
433
+ TabsPrimitive.Trigger,
434
+ {
435
+ className: cn(tabsTriggerVariant({ variant, orientation }), "hawa-relative", className),
436
+ ...props
437
+ },
438
+ props.children,
439
+ chipProps && /* @__PURE__ */ React11.createElement(Chip, { ...chipProps })
440
+ );
441
+ }
442
+ });
465
443
  var TabsContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11.createElement(
466
444
  TabsPrimitive.Content,
467
445
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../elements/tabs/Tabs.tsx","../../hooks/useIsomorphicEffect.ts","../../hooks/useDiscloser.ts","../../hooks/useHover.ts","../../hooks/useToast.ts","../../hooks/useCarousel.ts","../../hooks/useDialogCarousel.ts","../../hooks/useDialogSteps.ts","../../hooks/useClipboard.ts","../../hooks/useBreakpoint.ts","../../hooks/useWindowSize.ts","../../hooks/useFocusWithin.ts","../../hooks/useMediaQuery.ts","../../hooks/useScrollPosition.ts","../../hooks/useTable.ts","../../hooks/useTabs.ts","../../hooks/useMeasureDirty.ts","../../hooks/useClickOutside.ts","../../hooks/useShortcuts.ts","../../hooks/useWindowEvent.ts","../../hooks/useViewportSize.ts","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { useMeasureDirty, useViewportSize } from \"@hooks/index\";\nimport * as Popover from \"@radix-ui/react-popover\";\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport { cn } from \"@util/index\";\nimport { tv } from \"tailwind-variants\";\n\nimport { OrientationType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipTypes } from \"../chip\";\nimport { ScrollArea } from \"../scrollArea\";\n\nconst tabsListVariant = tv({\n base: \"\",\n variants: {\n variant: {\n default:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10\",\n underlined:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10\",\n underlined_tabs:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-text-muted-foreground\",\n },\n orientation: { horizontal: \"\", vertical: \"\" },\n },\n compoundVariants: [\n {\n variant: \"underlined_tabs\",\n orientation: \"vertical\",\n class: \"hawa-border-e-2 hawa-border-e-primary\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"horizontal\",\n class: \"hawa-border-b-2 hawa-border-b-primary\",\n },\n ],\n defaultVariants: { variant: \"default\", orientation: \"horizontal\" },\n});\n\nconst tabsTriggerVariant = tv({\n base: \"\",\n variants: {\n variant: {\n default:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-border hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground data-[state=active]:hawa-shadow-sm dark:hawa-border-primary/10\",\n underlined:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-rounded-none hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n underlined_tabs:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 hawa-bg-primary/10 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground dark:hawa-border-primary/10\",\n },\n orientation: { horizontal: \"\", vertical: \"\" },\n },\n compoundVariants: [\n {\n variant: \"underlined\",\n orientation: \"horizontal\",\n class:\n \"data-[state=active]:hawa-border-b-primary hawa-border-b hawa-border-b-2\",\n },\n {\n variant: \"underlined\",\n orientation: \"vertical\",\n class:\n \"data-[state=active]:hawa-border-e-primary hawa-border-e hawa-border-e-2\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"horizontal\",\n class: \"hawa-rounded-b-none\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"vertical\",\n class: \"hawa-rounded-e-none\",\n },\n ],\n defaultVariants: { variant: \"default\", orientation: \"horizontal\" },\n});\n\ntype TabsVariants = \"default\" | \"underlined\" | \"underlined_tabs\";\n\nconst TabsContext = React.createContext<{\n orientation?: OrientationType;\n variant?: TabsVariants;\n scrollable?: boolean;\n}>({ orientation: \"horizontal\", variant: \"default\", scrollable: false });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Root\n> & { variant?: TabsVariants; scrollable?: boolean };\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n TabsRootProps\n>(\n (\n { className, orientation, scrollable, variant = \"default\", ...props },\n ref,\n ) => (\n <TabsPrimitive.Root\n ref={ref}\n className={cn(\n \"hawa-flex hawa-gap-2\",\n orientation === \"vertical\" ? \"hawa-flex-row\" : \"hawa-flex-col\",\n className,\n )}\n {...props}\n >\n <TabsContext.Provider value={{ orientation, variant, scrollable }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n ),\n);\n\ntype TabsListProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.List\n> & {\n classNames?: {\n scrollArea?: string;\n };\n};\n\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n TabsListProps\n>(({ className, classNames, ...props }, ref) => {\n const { orientation, variant, scrollable } = React.useContext(TabsContext);\n const { width } = useViewportSize();\n\n if (scrollable && width < 768 && orientation === \"horizontal\") {\n return (\n <ScrollArea orientation=\"horizontal\" className={classNames?.scrollArea}>\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n tabsListVariant({ variant, orientation }),\n \"hawa-flex-row hawa-flex-nowrap\",\n className,\n )}\n {...props}\n />\n </ScrollArea>\n );\n } else {\n return (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n tabsListVariant({ variant, orientation }),\n orientation === \"vertical\" ? \"hawa-flex-col\" : \"hawa-flex-row\",\n \"hawa-flex-wrap\",\n className,\n )}\n {...props}\n />\n );\n }\n});\n\ntype TabsTriggerProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Trigger\n> & {\n chipProps?: ChipTypes;\n className?: string;\n showPopover?: boolean;\n popoverContent?: React.ReactNode;\n withPopover?: boolean;\n onPopoverClick?: () => void;\n};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(\n (\n { className, chipProps, withPopover = false, onPopoverClick, ...props },\n ref,\n ) => {\n const { orientation, variant } = React.useContext(TabsContext);\n\n if (withPopover) {\n return (\n <Popover.Root open={props.showPopover}>\n <Popover.Anchor asChild>\n <TabsPrimitive.Trigger\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n </TabsPrimitive.Trigger>\n </Popover.Anchor>\n <Popover.Content\n onClick={onPopoverClick}\n asChild\n className={cn(\n \"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n \"hawa-arrow-default-top hawa-mt-2\",\n )}\n >\n <div className=\"hawa-p-2\"> {props.popoverContent}</div>\n </Popover.Content>\n </Popover.Root>\n );\n } else {\n return (\n <TabsPrimitive.Trigger\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n </TabsPrimitive.Trigger>\n );\n }\n },\n);\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => (\n <TabsPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-ring-offset-hawa-background hawa-w-full focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2\",\n className,\n )}\n {...props}\n />\n));\n\nTabs.displayName = TabsPrimitive.Root.displayName;\nTabsList.displayName = TabsPrimitive.List.displayName;\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent };\n","import { useEffect, useLayoutEffect } from \"react\";\n\n// useLayoutEffect will show warning if used during ssr, e.g. with Next.js\n// useIsomorphicEffect removes it by replacing useLayoutEffect with useEffect during ssr\nexport const useIsomorphicEffect =\n typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n","import React, { useState } from \"react\";\n\ntype TUseDiscloser = {\n isOpen: boolean;\n onOpen: () => void;\n onClose: () => void;\n};\n\nconst useDiscloser = (value: boolean = false): TUseDiscloser => {\n const [open, setOpen] = useState<boolean>(value);\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n return {\n isOpen: open,\n onOpen: onOpen,\n onClose: onClose,\n };\n};\n\nexport default useDiscloser;\n","import React, { useEffect, useRef, useState } from \"react\";\n\nfunction useHover() {\n const [value, setValue] = useState(false);\n const ref = useRef<any>(null);\n const handleMouseOver = () => setValue(true);\n const handleMouseOut = () => setValue(false);\n useEffect(\n () => {\n const node = ref.current;\n if (node) {\n node.addEventListener(\"mouseover\", handleMouseOver);\n node.addEventListener(\"mouseout\", handleMouseOut);\n return () => {\n node.removeEventListener(\"mouseover\", handleMouseOver);\n node.removeEventListener(\"mouseout\", handleMouseOut);\n };\n }\n },\n [ref.current], // Recall only if ref changes\n );\n return [ref, value];\n}\n\nexport default useHover;\n","import * as React from \"react\";\n\nimport type { ToasterToastProps } from \"@elements/toast\";\n\nconst TOAST_LIMIT = 5;\nconst TOAST_REMOVE_DELAY = 100000;\n\nconst actionTypes = {\n ADD_TOAST: \"ADD_TOAST\",\n UPDATE_TOAST: \"UPDATE_TOAST\",\n DISMISS_TOAST: \"DISMISS_TOAST\",\n REMOVE_TOAST: \"REMOVE_TOAST\",\n} as const;\n\nlet count = 0;\n\nfunction genId() {\n count = (count + 1) % Number.MAX_VALUE;\n return count.toString();\n}\n\ntype ActionType = typeof actionTypes;\n\ntype Action =\n | { type: ActionType[\"ADD_TOAST\"]; toast: ToasterToastProps }\n | { type: ActionType[\"UPDATE_TOAST\"]; toast: Partial<ToasterToastProps> }\n | { type: ActionType[\"DISMISS_TOAST\"]; toastId?: ToasterToastProps[\"id\"] }\n | { type: ActionType[\"REMOVE_TOAST\"]; toastId?: ToasterToastProps[\"id\"] };\n\ninterface State {\n toasts: ToasterToastProps[];\n}\n\nconst toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();\n\nconst addToRemoveQueue = (toastId: string) => {\n if (toastTimeouts.has(toastId)) {\n return;\n }\n\n const timeout = setTimeout(() => {\n toastTimeouts.delete(toastId);\n dispatch({ type: \"REMOVE_TOAST\", toastId: toastId });\n }, TOAST_REMOVE_DELAY);\n\n toastTimeouts.set(toastId, timeout);\n};\n\nexport const reducer = (state: State, action: Action): State => {\n switch (action.type) {\n case \"ADD_TOAST\":\n return {\n ...state,\n toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),\n };\n\n case \"UPDATE_TOAST\":\n return {\n ...state,\n toasts: state.toasts.map((t) =>\n t.id === action.toast.id ? { ...t, ...action.toast } : t,\n ),\n };\n\n case \"DISMISS_TOAST\": {\n const { toastId } = action;\n\n // ! Side effects ! - This could be extracted into a dismissToast() action,\n // but I'll keep it here for simplicity\n if (toastId) {\n addToRemoveQueue(toastId);\n } else {\n state.toasts.forEach((toast) => {\n addToRemoveQueue(toast.id);\n });\n }\n\n return {\n ...state,\n toasts: state.toasts.map((t) =>\n t.id === toastId || toastId === undefined ? { ...t, open: false } : t,\n ),\n };\n }\n case \"REMOVE_TOAST\":\n if (action.toastId === undefined) {\n return { ...state, toasts: [] };\n }\n return {\n ...state,\n toasts: state.toasts.filter((t) => t.id !== action.toastId),\n };\n }\n};\n\nconst listeners: Array<(state: State) => void> = [];\n\nlet memoryState: State = { toasts: [] };\n\nfunction dispatch(action: Action) {\n memoryState = reducer(memoryState, action);\n listeners.forEach((listener) => {\n listener(memoryState);\n });\n}\n\ntype Toast = Omit<ToasterToastProps, \"id\">;\n\nfunction toast({ ...props }: Toast) {\n const id = genId();\n\n const update = (props: ToasterToastProps) =>\n dispatch({ type: \"UPDATE_TOAST\", toast: { ...props, id } });\n const dismiss = () => dispatch({ type: \"DISMISS_TOAST\", toastId: id });\n\n dispatch({\n type: \"ADD_TOAST\",\n toast: {\n ...props,\n id,\n open: true,\n onOpenChange: (open) => {\n if (!open) dismiss();\n },\n },\n });\n\n return { id: id, dismiss, update };\n}\n\nfunction useToast() {\n const [state, setState] = React.useState<State>(memoryState);\n\n React.useEffect(() => {\n listeners.push(setState);\n return () => {\n const index = listeners.indexOf(setState);\n if (index > -1) {\n listeners.splice(index, 1);\n }\n };\n }, [state]);\n\n return {\n ...state,\n toast,\n dismiss: (toastId?: string) => dispatch({ type: \"DISMISS_TOAST\", toastId }),\n };\n}\n\nexport { useToast, toast };\n","import { useState, useRef } from \"react\";\n\nconst useCarousel = (imageWidth: number) => {\n const [isDragging, setIsDragging] = useState(false);\n const [startDragX, setStartDragX] = useState(0);\n const [scrollLeft, setScrollLeft] = useState(0);\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n const findClosestSnapPoint = (scrollLeft: number): number => {\n return Math.round(scrollLeft / imageWidth) * imageWidth;\n };\n\n const handleMouseDown = (e: React.MouseEvent<HTMLDivElement>) => {\n setIsDragging(true);\n setStartDragX(e.pageX - containerRef.current!.offsetLeft);\n setScrollLeft(containerRef.current!.scrollLeft);\n };\n\n const handleMouseLeave = () => {\n if (isDragging) {\n handleDragEnd();\n }\n };\n\n const handleMouseUp = () => {\n if (isDragging) {\n handleDragEnd();\n }\n };\n\n const handleDragEnd = () => {\n setIsDragging(false);\n const closestSnapPoint = findClosestSnapPoint(\n containerRef.current!.scrollLeft,\n );\n containerRef.current!.scrollTo({\n left: closestSnapPoint,\n behavior: \"smooth\",\n });\n };\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!isDragging) return;\n e.preventDefault();\n const x = e.pageX - containerRef.current!.offsetLeft;\n const walk = x - startDragX;\n containerRef.current!.scrollLeft = scrollLeft - walk;\n };\n\n return {\n containerRef,\n handleMouseDown,\n handleMouseLeave,\n handleMouseUp,\n handleMouseMove,\n };\n};\n\nexport default useCarousel;\n","import React, { useEffect, useState } from \"react\";\n\nimport AutoHeight from \"embla-carousel-auto-height\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\ntype DialogCarouselType = {\n canScrollPrev?: any;\n emblaRef?: any;\n emblaApi?: any;\n nextStep?: any;\n prevStep?: any;\n};\n\nexport const useDialogCarousel = (options?: any): DialogCarouselType => {\n const [emblaRef, emblaApi] = useEmblaCarousel(\n { loop: false, watchDrag: false, startIndex: 0, ...options },\n [AutoHeight({ active: true })],\n );\n const [canScrollPrev, setCanScrollPrev] = useState(false);\n const checkCanScrollPrev = () => {\n if (emblaApi) {\n setCanScrollPrev(emblaApi.canScrollPrev());\n }\n };\n const nextStep = () => {\n if (emblaApi) {\n console.log(\"going to NEXT 👉\");\n emblaApi.scrollNext();\n }\n };\n\n const prevStep = () => {\n if (emblaApi) {\n console.log(\"going to BACK 👈\");\n emblaApi.scrollPrev();\n }\n };\n useEffect(() => {\n checkCanScrollPrev(); // Initial check\n emblaApi && emblaApi.on(\"select\", checkCanScrollPrev); // Update on slide change\n return () => {\n emblaApi && emblaApi.off(\"select\", checkCanScrollPrev);\n };\n }, [emblaApi]);\n\n return {\n emblaRef,\n emblaApi,\n nextStep,\n prevStep,\n canScrollPrev,\n };\n};\n","import React, { useState, useEffect, useRef } from \"react\";\n\nexport const useMultiStepDialog = (\n initialStep: any,\n stepIds: any[],\n setOpenDialog: any,\n) => {\n const [currentStep, setCurrentStep] = useState(initialStep);\n const [dialogHeight, setDialogHeight] = useState(null);\n const visibleStepRef = useRef<any>(null);\n\n useEffect(() => {\n if (visibleStepRef.current) {\n setDialogHeight(visibleStepRef.current.offsetHeight);\n }\n }, [currentStep, setOpenDialog]);\n\n const handleNext = () => {\n const currentIndex = stepIds.indexOf(currentStep);\n if (currentIndex < stepIds.length - 1) {\n setTimeout(() => {\n setCurrentStep(stepIds[currentIndex + 1]);\n }, 100);\n }\n };\n const handleBack = () => {\n const currentIndex = stepIds.indexOf(currentStep);\n if (currentIndex > 0) {\n setTimeout(() => {\n setCurrentStep(stepIds[currentIndex - 1]);\n }, 100);\n }\n };\n\n return {\n currentStep,\n dialogHeight,\n visibleStepRef,\n handleNext,\n handleBack,\n };\n};\n","import { useState } from \"react\";\n\nexport function useClipboard({ timeout = 2000 } = {}): {\n copy: (value: any) => void;\n reset: () => void;\n error: Error | null;\n copied: boolean;\n} {\n const [error, setError] = useState<Error | null>(null);\n const [copied, setCopied] = useState<boolean>(false);\n const [copyTimeout, setCopyTimeout] = useState<NodeJS.Timeout | null>(null);\n\n const handleCopyResult = (value: boolean) => {\n clearTimeout(copyTimeout as NodeJS.Timeout | undefined);\n setCopyTimeout(setTimeout(() => setCopied(false), timeout));\n setCopied(value);\n };\n\n const copy = (valueToCopy: any) => {\n if (\"clipboard\" in navigator) {\n navigator.clipboard\n .writeText(valueToCopy)\n .then(() => handleCopyResult(true))\n .catch((err) => setError(err));\n } else {\n setError(new Error(\"useClipboard: navigator.clipboard is not supported\"));\n }\n };\n\n const reset = () => {\n setCopied(false);\n setError(null);\n clearTimeout(copyTimeout as NodeJS.Timeout | undefined);\n };\n\n return { copy, reset, error, copied };\n}\n","import React, { useState, useEffect } from \"react\";\n\nexport const useBreakpoint = () => {\n // Initialize breakpoint with a null value.\n const [breakpoint, setBreakpoint] = useState<any>(null);\n\n useEffect(() => {\n // Check if window is defined (i.e., if running on the client side)\n if (typeof window !== \"undefined\") {\n // Define the resize function within the effect.\n const resize = () => {\n setBreakpoint(window.innerWidth);\n };\n\n // Call resize initially to set the breakpoint based on the initial window size.\n resize();\n\n // Set up the resize event listener.\n window.addEventListener(\"resize\", resize);\n\n // Clean up the event listener when the component is unmounted.\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []); // The empty array ensures this useEffect runs once, similar to componentDidMount.\n\n return breakpoint;\n};\n\n// import React, { useState, useEffect } from \"react\";\n\n// export const useBreakpoint = () => {\n// const [breakpoint, setBreakpoint] = useState(window?.innerWidth);\n// const resize = () => {\n// setBreakpoint(window?.innerWidth);\n// };\n\n// useEffect(() => {\n// // Ensure this code is only run on the client side\n// if (typeof window !== \"undefined\") {\n// // Now it's safe to use window\n// setBreakpoint(window?.innerWidth);\n// window?.addEventListener(\"resize\", resize);\n\n// return () => {\n// window?.removeEventListener(\"resize\", resize);\n// };\n// }\n// }, []); // Empty dependency array ensures this useEffect runs once, similar to componentDidMount\n\n// return breakpoint;\n// };\n","import { useEffect, useState } from \"react\";\n\ninterface WindowSize {\n width: number | undefined;\n height: number | undefined;\n}\n\nexport const useWindowSize = () => {\n const [windowSize, setWindowSize] = useState<WindowSize>({\n width: undefined,\n height: undefined,\n });\n\n useEffect(() => {\n function handleResize() {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n }\n window.addEventListener(\"resize\", handleResize);\n handleResize();\n return () => window.removeEventListener(\"resize\", handleResize);\n }, []);\n return windowSize;\n};\n","// useFocusWithin hook detects if any element within has focus, it works the same way as :focus-within CSS selector:\nimport { useRef, useState, useEffect } from \"react\";\n\n// Define options for the useFocusWithin hook, which includes onFocus and onBlur callbacks.\nexport interface UseFocusWithinOptions {\n onFocus?(event: FocusEvent): void;\n onBlur?(event: FocusEvent): void;\n}\n\n// Function to check if the event's related target is contained within the current target.\nfunction containsRelatedTarget(event: FocusEvent) {\n if (\n event.currentTarget instanceof HTMLElement &&\n event.relatedTarget instanceof HTMLElement\n ) {\n return event.currentTarget.contains(event.relatedTarget);\n }\n\n return false;\n}\n\n// Custom React hook for handling focus events within an element.\nexport function useFocusWithin<T extends HTMLElement = any>({\n onBlur,\n onFocus,\n}: UseFocusWithinOptions = {}): {\n ref: React.MutableRefObject<T>;\n focused: boolean;\n} {\n // Create a ref to hold the target element.\n const ref = useRef<T>(null!);\n\n // State to track if the element is focused.\n const [focused, _setFocused] = useState(false);\n\n // Create a ref to store the focused state.\n const focusedRef = useRef(false);\n\n // Function to set the focused state and update the ref.\n const setFocused = (value: boolean) => {\n _setFocused(value);\n focusedRef.current = value;\n };\n\n // Handle focus-in event: when the element gains focus.\n const handleFocusIn = (event: FocusEvent) => {\n if (!focusedRef.current) {\n setFocused(true);\n onFocus?.(event); // Call the onFocus callback if provided.\n }\n };\n\n // Handle focus-out event: when the element loses focus.\n const handleFocusOut = (event: FocusEvent) => {\n if (focusedRef.current && !containsRelatedTarget(event)) {\n setFocused(false);\n onBlur?.(event); // Call the onBlur callback if provided.\n }\n };\n\n // Attach event listeners for focusin and focusout events.\n useEffect(() => {\n if (ref.current) {\n ref.current.addEventListener(\"focusin\", handleFocusIn);\n ref.current.addEventListener(\"focusout\", handleFocusOut);\n\n // Clean up event listeners when the component unmounts.\n return () => {\n ref.current?.removeEventListener(\"focusin\", handleFocusIn);\n ref.current?.removeEventListener(\"focusout\", handleFocusOut);\n };\n }\n\n return undefined;\n }, [handleFocusIn, handleFocusOut]);\n\n // Return the ref and focused state.\n return { ref, focused };\n}\n","import { useState, useEffect, useRef } from \"react\";\n\nexport interface UseMediaQueryOptions {\n getInitialValueInEffect: boolean;\n}\n\ntype MediaQueryCallback = (event: { matches: boolean; media: string }) => void;\n\n/**\n * Older versions of Safari (shipped withCatalina and before) do not support addEventListener on matchMedia\n * https://stackoverflow.com/questions/56466261/matchmedia-addlistener-marked-as-deprecated-addeventlistener-equivalent\n * */\nfunction attachMediaListener(\n query: MediaQueryList,\n callback: MediaQueryCallback,\n) {\n try {\n query.addEventListener(\"change\", callback);\n return () => query.removeEventListener(\"change\", callback);\n } catch (e) {\n query.addListener(callback);\n return () => query.removeListener(callback);\n }\n}\n\nfunction getInitialValue(query: string, initialValue?: boolean) {\n if (typeof initialValue === \"boolean\") {\n return initialValue;\n }\n\n if (typeof window !== \"undefined\" && \"matchMedia\" in window) {\n return window.matchMedia(query).matches;\n }\n\n return false;\n}\n\nexport function useMediaQuery(\n query: string,\n initialValue?: boolean,\n { getInitialValueInEffect }: UseMediaQueryOptions = {\n getInitialValueInEffect: true,\n },\n) {\n const [matches, setMatches] = useState(\n getInitialValueInEffect\n ? initialValue\n : getInitialValue(query, initialValue),\n );\n const queryRef = useRef<MediaQueryList>();\n\n useEffect(() => {\n if (\"matchMedia\" in window) {\n queryRef.current = window.matchMedia(query);\n setMatches(queryRef.current.matches);\n return attachMediaListener(queryRef.current, (event) =>\n setMatches(event.matches),\n );\n }\n\n return undefined;\n }, [query]);\n\n return matches;\n}\n","import React, { useState, useEffect, useRef } from \"react\";\n\nfunction useScrollPosition(ref: any) {\n const [scrollPosition, setScrollPosition] = useState(0);\n // const savedRef = useRef();\n\n // useEffect(() => {\n // savedRef.current = ref;\n // }, [ref]);\n\n useEffect(() => {\n function handleScroll() {\n setScrollPosition(ref.current.scrollTop);\n }\n\n if (ref.current) {\n ref.current.addEventListener(\"scroll\", handleScroll);\n }\n\n return () => {\n if (ref.current) {\n ref.current.removeEventListener(\"scroll\", handleScroll);\n }\n };\n }, [ref]);\n\n return scrollPosition;\n}\n\nexport default useScrollPosition;\n","import React, { useState, useEffect } from \"react\";\n\nconst calculateRange = (data: any, rowsPerPage: any) => {\n const range = [];\n const num = Math.ceil(data?.length / rowsPerPage);\n let i = 1;\n for (let i = 1; i <= num; i++) {\n range.push(i);\n }\n return range;\n};\n\nconst sliceData = (data: any, page: any, rowsPerPage: any) => {\n return data?.slice((page - 1) * rowsPerPage, page * rowsPerPage);\n};\n\n// useTable.js\nconst sortData = (data: any, sortColumn: any, sortDirection: any) => {\n if (sortColumn !== null) {\n return data?.sort((a: any, b: any) => {\n const aValue = a[sortColumn].value;\n const bValue = b[sortColumn].value;\n\n // Handle non-string values by using simple comparison\n if (typeof aValue === \"string\" && typeof bValue === \"string\") {\n if (sortDirection === \"asc\") {\n return aValue.localeCompare(bValue);\n } else {\n return bValue.localeCompare(aValue);\n }\n } else {\n if (sortDirection === \"asc\") {\n return aValue - bValue;\n } else {\n return bValue - aValue;\n }\n }\n });\n }\n return data;\n};\n\nconst useTable = (\n data: any,\n page: any,\n rowsPerPage: any,\n sortColumn: any,\n sortDirection: any,\n) => {\n const [tableRange, setTableRange] = useState<any>([]);\n const [slice, setSlice] = useState<any>([]);\n\n useEffect(() => {\n if (data) {\n const range = calculateRange(data, rowsPerPage);\n setTableRange([...range]);\n\n const sortedData = sortData(data, sortColumn, sortDirection);\n const slicedData = sliceData(sortedData, page, rowsPerPage);\n setSlice([...slicedData]);\n }\n }, [data, setTableRange, page, rowsPerPage, sortColumn, sortDirection]);\n\n return { slice, range: tableRange };\n};\n\nexport default useTable;\n","import { useEffect, useState } from \"react\";\n\nfunction useTabs(initialTab = \"\") {\n const [activeTab, setActiveTab] = useState(initialTab);\n\n // Listen to hash changes in the URL\n useEffect(() => {\n const handleHashChange = () => {\n const hash = window.location.hash.substring(1);\n setActiveTab(hash || initialTab);\n };\n\n window.addEventListener(\"hashchange\", handleHashChange);\n\n // Initialize the tab based on the initial hash\n handleHashChange();\n\n return () => {\n // Remove the event listener when the component unmounts\n window.removeEventListener(\"hashchange\", handleHashChange);\n };\n }, [initialTab]);\n\n const handleTabChange = (index: any) => {\n setActiveTab(index);\n\n // Update the URL hash when the tab changes\n window.location.hash = index;\n };\n\n return {\n activeTab,\n handleTabChange,\n };\n}\n\nexport { useTabs };\n","import { RefObject, useEffect, useRef, useState } from \"react\";\n\nexport interface ContentRect {\n width: number;\n height: number;\n top: number;\n right: number;\n left: number;\n bottom: number;\n}\nexport const useMeasureDirty = (ref: RefObject<HTMLElement>): ContentRect => {\n const frame = useRef(0);\n const [rect, set] = useState({\n width: 0,\n height: 0,\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n });\n\n const [observer] = useState(\n () =>\n new ResizeObserver((entries) => {\n const entry = entries[0];\n\n if (entry) {\n cancelAnimationFrame(frame.current);\n\n frame.current = requestAnimationFrame(() => {\n if (ref.current) {\n set(entry.contentRect);\n }\n });\n }\n }),\n );\n\n useEffect(() => {\n observer.disconnect();\n\n if (ref.current) {\n observer.observe(ref.current);\n }\n }, [ref]);\n\n return rect;\n};\n","import { useEffect, useRef } from \"react\";\n\nconst DEFAULT_EVENTS = [\"mousedown\", \"touchstart\"];\n\nexport function useClickOutside<T extends HTMLElement = any>(\n handler: () => void,\n events?: string[] | null,\n nodes?: (HTMLElement | null)[],\n) {\n const ref = useRef<T>();\n\n useEffect(() => {\n const listener = (event: any) => {\n const { target } = event ?? {};\n if (Array.isArray(nodes)) {\n const shouldIgnore =\n target?.hasAttribute(\"data-ignore-outside-clicks\") ||\n (!document.body.contains(target) && target.tagName !== \"HTML\");\n const shouldTrigger = nodes.every(\n (node) => !!node && !event.composedPath().includes(node),\n );\n shouldTrigger && !shouldIgnore && handler();\n } else if (ref.current && !ref.current.contains(target)) {\n handler();\n }\n };\n\n (events || DEFAULT_EVENTS).forEach((fn) =>\n document.addEventListener(fn, listener),\n );\n\n return () => {\n (events || DEFAULT_EVENTS).forEach((fn) =>\n document.removeEventListener(fn, listener),\n );\n };\n }, [ref, handler, nodes]);\n\n return ref;\n}\n","import { useEffect } from \"react\";\n\nexport type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split(\"+\")\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes(\"alt\"),\n ctrl: keys.includes(\"ctrl\"),\n meta: keys.includes(\"meta\"),\n mod: keys.includes(\"mod\"),\n shift: keys.includes(\"shift\"),\n };\n\n const reservedKeys = [\"alt\", \"ctrl\", \"meta\", \"shift\", \"mod\"];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace(\"Key\", \"\").toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\nexport interface HotkeyItemOptions {\n preventDefault?: boolean;\n}\n\n// type HotkeyItem = [string, (event: any) => void, HotkeyItemOptions?];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = \"nativeEvent\" in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(_event);\n }\n });\n };\n}\n\nexport type HotkeyItem = [\n string,\n (event: KeyboardEvent) => void,\n HotkeyItemOptions?,\n];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false,\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return (\n !event.target.isContentEditable &&\n !tagsToIgnore.includes(event.target.tagName)\n );\n }\n\n return true;\n}\n\nexport function useShortcuts(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = [\"INPUT\", \"TEXTAREA\", \"SELECT\"],\n triggerOnContentEditable = false,\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(\n ([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n },\n );\n };\n\n document.documentElement.addEventListener(\"keydown\", keydownListener);\n return () =>\n document.documentElement.removeEventListener(\"keydown\", keydownListener);\n }, [hotkeys]);\n}\n","import { useEffect } from \"react\";\n\nexport function useWindowEvent<K extends string>(\n type: K,\n listener: K extends keyof WindowEventMap\n ? (this: Window, ev: WindowEventMap[K]) => void\n : (this: Window, ev: CustomEvent) => void,\n options?: boolean | AddEventListenerOptions,\n) {\n useEffect(() => {\n window.addEventListener(type as any, listener, options);\n return () => window.removeEventListener(type as any, listener, options);\n }, [type, listener]);\n}\n","import { useCallback, useEffect, useState } from \"react\";\n\nimport { useWindowEvent } from \"./useWindowEvent\";\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({\n width: window.innerWidth || 0,\n height: window.innerHeight || 0,\n });\n }, []);\n\n useWindowEvent(\"resize\", setSize, eventListerOptions);\n useWindowEvent(\"orientationchange\", setSize, eventListerOptions);\n useEffect(setSize, []);\n\n return windowSize;\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dot,\n dotStatus = \"none\",\n ...rest\n },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n rest.className,\n )}\n >\n {dot && (\n <span\n className={cn(dotStyles[size], dotStatusStyles[dotStatus])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n","import * as React from \"react\";\n\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\nimport { cn } from \"@util/index\";\n\nimport { OrientationType } from \"@_types/commonTypes\";\n\ntype ScrollAreaProps = React.ComponentPropsWithoutRef<\n typeof ScrollAreaPrimitive.Root\n> & {\n orientation?: OrientationType;\n};\n\nconst ScrollArea = React.forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Root>,\n ScrollAreaProps\n>(({ className, children, orientation = \"vertical\", ...props }, ref) => {\n const scrollAreaRef = React.useRef<HTMLDivElement | null>(null);\n const isDragging = React.useRef(false);\n const startPos = React.useRef({ x: 0, y: 0 });\n const scrollPos = React.useRef({ top: 0, left: 0 });\n\n const [showLeftFade, setShowLeftFade] = React.useState(false);\n const [showRightFade, setShowRightFade] = React.useState(false);\n\n const checkOverflow = () => {\n if (scrollAreaRef.current) {\n const { scrollLeft, scrollWidth, clientWidth } = scrollAreaRef.current;\n setShowLeftFade(scrollLeft > 0);\n setShowRightFade(scrollLeft + clientWidth < scrollWidth);\n }\n };\n\n const onMouseDown = (e: React.MouseEvent) => {\n isDragging.current = true;\n startPos.current = { x: e.clientX, y: e.clientY };\n if (scrollAreaRef.current) {\n scrollPos.current = {\n top: scrollAreaRef.current.scrollTop,\n left: scrollAreaRef.current.scrollLeft,\n };\n }\n document.addEventListener(\"mousemove\", onMouseMove);\n document.addEventListener(\"mouseup\", onMouseUp);\n };\n\n const onMouseMove = (e: MouseEvent) => {\n if (!isDragging.current || !scrollAreaRef.current) return;\n const dx = e.clientX - startPos.current.x;\n const dy = e.clientY - startPos.current.y;\n if (orientation === \"vertical\") {\n scrollAreaRef.current.scrollTop = scrollPos.current.top - dy;\n } else {\n scrollAreaRef.current.scrollLeft = scrollPos.current.left - dx;\n checkOverflow();\n }\n };\n\n const onMouseUp = () => {\n isDragging.current = false;\n document.removeEventListener(\"mousemove\", onMouseMove);\n document.removeEventListener(\"mouseup\", onMouseUp);\n };\n\n React.useEffect(() => {\n checkOverflow();\n if (scrollAreaRef.current) {\n scrollAreaRef.current.addEventListener(\"scroll\", checkOverflow);\n window.addEventListener(\"resize\", checkOverflow);\n }\n return () => {\n if (scrollAreaRef.current) {\n scrollAreaRef.current.removeEventListener(\"scroll\", checkOverflow);\n }\n window.removeEventListener(\"resize\", checkOverflow);\n };\n }, []);\n\n return (\n <ScrollAreaPrimitive.Root\n ref={ref}\n className={cn(\"hawa-relative hawa-overflow-hidden\", className)}\n {...props}\n >\n <div\n className={cn(\n \"hawa-pointer-events-none hawa-absolute hawa-bg-background hawa-h-full hawa-w-[50px] hawa-z-10 hawa-start-0 hawa-mask-fade-right\",\n showLeftFade ? \"hawa-block\" : \"hawa-hidden\",\n )}\n />\n <div\n className={cn(\n \"hawa-pointer-events-none hawa-absolute hawa-bg-background hawa-mask-fade-left hawa-end-0 hawa-h-full hawa-w-[50px] hawa-z-10\",\n showRightFade ? \"hawa-block\" : \"hawa-hidden\",\n )}\n />\n <ScrollAreaPrimitive.Viewport\n ref={scrollAreaRef}\n className=\"hawa-h-full hawa-w-full hawa-rounded-[inherit]\"\n onMouseDown={onMouseDown}\n >\n {children}\n </ScrollAreaPrimitive.Viewport>\n <ScrollBar orientation={orientation} />\n <ScrollAreaPrimitive.Corner />\n </ScrollAreaPrimitive.Root>\n );\n});\n\nScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;\n\nconst ScrollBar = React.forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>\n>(({ className, orientation = \"vertical\", ...props }, ref) => (\n <ScrollAreaPrimitive.ScrollAreaScrollbar\n ref={ref}\n orientation={orientation}\n className={cn(\n \"hawa-flex hawa-touch-none hawa-select-none hawa-transition-colors\",\n orientation === \"vertical\" &&\n \"hawa-h-full hawa-w-2.5 hawa-border-l hawa-border-l-transparent hawa-p-[1px]\",\n orientation === \"horizontal\" &&\n \"hawa-h-2.5 hawa-border-t hawa-border-t-transparent hawa-p-[1px]\",\n className,\n )}\n {...props}\n >\n <ScrollAreaPrimitive.ScrollAreaThumb\n className={cn(\n \"hawa-relative hawa-rounded-full hawa-bg-border\",\n orientation === \"vertical\" && \"hawa-flex-1\",\n )}\n />\n </ScrollAreaPrimitive.ScrollAreaScrollbar>\n));\n\nScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":"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","names":["React","useEffect","useState","React","useState","useRef","useEffect","useState","useState","useEffect","useRef","useState","useState","useEffect","useEffect","useState","useRef","useState","useEffect","useState","useEffect","useRef","useState","useEffect","useState","useEffect","useEffect","useState","useEffect","useRef","useState","useEffect","useRef","useEffect","useEffect","useEffect","useState","useState","useEffect","React","React","React"]}
1
+ {"version":3,"sources":["../../elements/tabs/Tabs.tsx","../../hooks/useIsomorphicEffect.ts","../../hooks/useDiscloser.ts","../../hooks/useHover.ts","../../hooks/useToast.ts","../../hooks/useCarousel.ts","../../hooks/useDialogCarousel.ts","../../hooks/useDialogSteps.ts","../../hooks/useClipboard.ts","../../hooks/useBreakpoint.ts","../../hooks/useWindowSize.ts","../../hooks/useFocusWithin.ts","../../hooks/useMediaQuery.ts","../../hooks/useScrollPosition.ts","../../hooks/useTable.ts","../../hooks/useTabs.ts","../../hooks/useMeasureDirty.ts","../../hooks/useClickOutside.ts","../../hooks/useShortcuts.ts","../../hooks/useWindowEvent.ts","../../hooks/useViewportSize.ts","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { useMeasureDirty, useViewportSize } from \"@hooks/index\";\nimport * as Popover from \"@radix-ui/react-popover\";\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport { cn } from \"@util/index\";\nimport { tv } from \"tailwind-variants\";\n\nimport { OrientationType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipTypes } from \"../chip\";\nimport { ScrollArea } from \"../scrollArea\";\n\nconst tabsListVariant = tv({\n base: \"\",\n variants: {\n variant: {\n default:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10\",\n underlined:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10\",\n underlined_tabs:\n \"hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-text-muted-foreground\",\n },\n orientation: { horizontal: \"\", vertical: \"\" },\n },\n compoundVariants: [\n {\n variant: \"underlined_tabs\",\n orientation: \"vertical\",\n class: \"hawa-border-e-2 hawa-border-e-primary\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"horizontal\",\n class: \"hawa-border-b-2 hawa-border-b-primary\",\n },\n ],\n defaultVariants: { variant: \"default\", orientation: \"horizontal\" },\n});\n\nconst tabsTriggerVariant = tv({\n base: \"\",\n variants: {\n variant: {\n default:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-border hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground data-[state=active]:hawa-shadow-sm dark:hawa-border-primary/10\",\n underlined:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-rounded-none hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n underlined_tabs:\n \"hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 hawa-bg-primary/10 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground dark:hawa-border-primary/10\",\n },\n orientation: { horizontal: \"\", vertical: \"\" },\n },\n compoundVariants: [\n {\n variant: \"underlined\",\n orientation: \"horizontal\",\n class: \"data-[state=active]:hawa-border-b-primary hawa-border-b hawa-border-b-2\",\n },\n {\n variant: \"underlined\",\n orientation: \"vertical\",\n class: \"data-[state=active]:hawa-border-e-primary hawa-border-e hawa-border-e-2\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"horizontal\",\n class: \"hawa-rounded-b-none\",\n },\n {\n variant: \"underlined_tabs\",\n orientation: \"vertical\",\n class: \"hawa-rounded-e-none\",\n },\n ],\n defaultVariants: { variant: \"default\", orientation: \"horizontal\" },\n});\n\ntype TabsVariants = \"default\" | \"underlined\" | \"underlined_tabs\";\n\nconst TabsContext = React.createContext<{\n orientation?: OrientationType;\n variant?: TabsVariants;\n scrollable?: boolean;\n}>({ orientation: \"horizontal\", variant: \"default\", scrollable: false });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n variant?: TabsVariants;\n scrollable?: boolean;\n};\n\nconst Tabs = React.forwardRef<React.ElementRef<typeof TabsPrimitive.Root>, TabsRootProps>(\n ({ className, orientation, scrollable, variant = \"default\", ...props }, ref) => (\n <TabsPrimitive.Root\n ref={ref}\n className={cn(\n \"hawa-flex hawa-gap-2\",\n orientation === \"vertical\" ? \"hawa-flex-row\" : \"hawa-flex-col\",\n className,\n )}\n {...props}\n >\n <TabsContext.Provider value={{ orientation, variant, scrollable }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n ),\n);\n\ntype TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {\n classNames?: {\n scrollArea?: string;\n };\n};\n\nconst TabsList = React.forwardRef<React.ElementRef<typeof TabsPrimitive.List>, TabsListProps>(\n ({ className, classNames, ...props }, ref) => {\n const { orientation, variant, scrollable } = React.useContext(TabsContext);\n const { width } = useViewportSize();\n\n if (scrollable && width < 768 && orientation === \"horizontal\") {\n return (\n <ScrollArea orientation=\"horizontal\" className={classNames?.scrollArea}>\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n tabsListVariant({ variant, orientation }),\n \"hawa-flex-row hawa-flex-nowrap\",\n className,\n )}\n {...props}\n />\n </ScrollArea>\n );\n } else {\n return (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n tabsListVariant({ variant, orientation }),\n orientation === \"vertical\" ? \"hawa-flex-col\" : \"hawa-flex-row\",\n \"hawa-flex-wrap\",\n className,\n )}\n {...props}\n />\n );\n }\n },\n);\n\ntype TabsTriggerProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger> & {\n chipProps?: ChipTypes;\n className?: string;\n showPopover?: boolean;\n popoverContent?: React.ReactNode;\n withPopover?: boolean;\n onPopoverClick?: () => void;\n};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n\n if (withPopover) {\n return (\n <Popover.Root open={props.showPopover}>\n <Popover.Anchor asChild>\n <TabsPrimitive.Trigger\n className={cn(tabsTriggerVariant({ variant, orientation }), \"hawa-relative\", className)}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n </TabsPrimitive.Trigger>\n </Popover.Anchor>\n <Popover.Content\n onClick={onPopoverClick}\n asChild\n className={cn(\n \"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n \"hawa-arrow-default-top hawa-mt-2\",\n )}\n >\n <div className=\"hawa-p-2\"> {props.popoverContent}</div>\n </Popover.Content>\n </Popover.Root>\n );\n } else {\n return (\n <TabsPrimitive.Trigger\n className={cn(tabsTriggerVariant({ variant, orientation }), \"hawa-relative\", className)}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n </TabsPrimitive.Trigger>\n );\n }\n});\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => (\n <TabsPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-ring-offset-hawa-background hawa-w-full focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2\",\n className,\n )}\n {...props}\n />\n));\n\nTabs.displayName = TabsPrimitive.Root.displayName;\nTabsList.displayName = TabsPrimitive.List.displayName;\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent };\n","import { useEffect, useLayoutEffect } from \"react\";\n\n// useLayoutEffect will show warning if used during ssr, e.g. with Next.js\n// useIsomorphicEffect removes it by replacing useLayoutEffect with useEffect during ssr\nexport const useIsomorphicEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n","import React, { useState } from \"react\";\n\ntype TUseDiscloser = {\n isOpen: boolean;\n onOpen: () => void;\n onClose: () => void;\n};\n\nconst useDiscloser = (value: boolean = false): TUseDiscloser => {\n const [open, setOpen] = useState<boolean>(value);\n const onOpen = () => setOpen(true);\n const onClose = () => setOpen(false);\n\n return {\n isOpen: open,\n onOpen: onOpen,\n onClose: onClose,\n };\n};\n\nexport default useDiscloser;\n","import React, { useEffect, useRef, useState } from \"react\";\n\nfunction useHover() {\n const [value, setValue] = useState(false);\n const ref = useRef<any>(null);\n const handleMouseOver = () => setValue(true);\n const handleMouseOut = () => setValue(false);\n useEffect(\n () => {\n const node = ref.current;\n if (node) {\n node.addEventListener(\"mouseover\", handleMouseOver);\n node.addEventListener(\"mouseout\", handleMouseOut);\n return () => {\n node.removeEventListener(\"mouseover\", handleMouseOver);\n node.removeEventListener(\"mouseout\", handleMouseOut);\n };\n }\n },\n [ref.current], // Recall only if ref changes\n );\n return [ref, value];\n}\n\nexport default useHover;\n","import * as React from \"react\";\n\nimport type { ToasterToastProps } from \"@elements/toast\";\n\nconst TOAST_LIMIT = 5;\nconst TOAST_REMOVE_DELAY = 100000;\n\nconst actionTypes = {\n ADD_TOAST: \"ADD_TOAST\",\n UPDATE_TOAST: \"UPDATE_TOAST\",\n DISMISS_TOAST: \"DISMISS_TOAST\",\n REMOVE_TOAST: \"REMOVE_TOAST\",\n} as const;\n\nlet count = 0;\n\nfunction genId() {\n count = (count + 1) % Number.MAX_VALUE;\n return count.toString();\n}\n\ntype ActionType = typeof actionTypes;\n\ntype Action =\n | { type: ActionType[\"ADD_TOAST\"]; toast: ToasterToastProps }\n | { type: ActionType[\"UPDATE_TOAST\"]; toast: Partial<ToasterToastProps> }\n | { type: ActionType[\"DISMISS_TOAST\"]; toastId?: ToasterToastProps[\"id\"] }\n | { type: ActionType[\"REMOVE_TOAST\"]; toastId?: ToasterToastProps[\"id\"] };\n\ninterface State {\n toasts: ToasterToastProps[];\n}\n\nconst toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();\n\nconst addToRemoveQueue = (toastId: string) => {\n if (toastTimeouts.has(toastId)) {\n return;\n }\n\n const timeout = setTimeout(() => {\n toastTimeouts.delete(toastId);\n dispatch({ type: \"REMOVE_TOAST\", toastId: toastId });\n }, TOAST_REMOVE_DELAY);\n\n toastTimeouts.set(toastId, timeout);\n};\n\nexport const reducer = (state: State, action: Action): State => {\n switch (action.type) {\n case \"ADD_TOAST\":\n return {\n ...state,\n toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),\n };\n\n case \"UPDATE_TOAST\":\n return {\n ...state,\n toasts: state.toasts.map((t) => (t.id === action.toast.id ? { ...t, ...action.toast } : t)),\n };\n\n case \"DISMISS_TOAST\": {\n const { toastId } = action;\n\n // ! Side effects ! - This could be extracted into a dismissToast() action,\n // but I'll keep it here for simplicity\n if (toastId) {\n addToRemoveQueue(toastId);\n } else {\n state.toasts.forEach((toast) => {\n addToRemoveQueue(toast.id);\n });\n }\n\n return {\n ...state,\n toasts: state.toasts.map((t) =>\n t.id === toastId || toastId === undefined ? { ...t, open: false } : t,\n ),\n };\n }\n case \"REMOVE_TOAST\":\n if (action.toastId === undefined) {\n return { ...state, toasts: [] };\n }\n return {\n ...state,\n toasts: state.toasts.filter((t) => t.id !== action.toastId),\n };\n }\n};\n\nconst listeners: Array<(state: State) => void> = [];\n\nlet memoryState: State = { toasts: [] };\n\nfunction dispatch(action: Action) {\n memoryState = reducer(memoryState, action);\n listeners.forEach((listener) => {\n listener(memoryState);\n });\n}\n\ntype Toast = Omit<ToasterToastProps, \"id\">;\n\nfunction toast({ ...props }: Toast) {\n const id = genId();\n\n const update = (props: ToasterToastProps) =>\n dispatch({ type: \"UPDATE_TOAST\", toast: { ...props, id } });\n const dismiss = () => dispatch({ type: \"DISMISS_TOAST\", toastId: id });\n\n dispatch({\n type: \"ADD_TOAST\",\n toast: {\n ...props,\n id,\n open: true,\n onOpenChange: (open) => {\n if (!open) dismiss();\n },\n },\n });\n\n return { id: id, dismiss, update };\n}\n\nfunction useToast() {\n const [state, setState] = React.useState<State>(memoryState);\n\n React.useEffect(() => {\n listeners.push(setState);\n return () => {\n const index = listeners.indexOf(setState);\n if (index > -1) {\n listeners.splice(index, 1);\n }\n };\n }, [state]);\n\n return {\n ...state,\n toast,\n dismiss: (toastId?: string) => dispatch({ type: \"DISMISS_TOAST\", toastId }),\n };\n}\n\nexport { useToast, toast };\n","import { useState, useRef } from \"react\";\n\nconst useCarousel = (imageWidth: number) => {\n const [isDragging, setIsDragging] = useState(false);\n const [startDragX, setStartDragX] = useState(0);\n const [scrollLeft, setScrollLeft] = useState(0);\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n const findClosestSnapPoint = (scrollLeft: number): number => {\n return Math.round(scrollLeft / imageWidth) * imageWidth;\n };\n\n const handleMouseDown = (e: React.MouseEvent<HTMLDivElement>) => {\n setIsDragging(true);\n setStartDragX(e.pageX - containerRef.current!.offsetLeft);\n setScrollLeft(containerRef.current!.scrollLeft);\n };\n\n const handleMouseLeave = () => {\n if (isDragging) {\n handleDragEnd();\n }\n };\n\n const handleMouseUp = () => {\n if (isDragging) {\n handleDragEnd();\n }\n };\n\n const handleDragEnd = () => {\n setIsDragging(false);\n const closestSnapPoint = findClosestSnapPoint(containerRef.current!.scrollLeft);\n containerRef.current!.scrollTo({\n left: closestSnapPoint,\n behavior: \"smooth\",\n });\n };\n\n const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n if (!isDragging) return;\n e.preventDefault();\n const x = e.pageX - containerRef.current!.offsetLeft;\n const walk = x - startDragX;\n containerRef.current!.scrollLeft = scrollLeft - walk;\n };\n\n return {\n containerRef,\n handleMouseDown,\n handleMouseLeave,\n handleMouseUp,\n handleMouseMove,\n };\n};\n\nexport default useCarousel;\n","import React, { useEffect, useState } from \"react\";\n\nimport AutoHeight from \"embla-carousel-auto-height\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\ntype DialogCarouselType = {\n canScrollPrev?: any;\n emblaRef?: any;\n emblaApi?: any;\n nextStep?: any;\n prevStep?: any;\n};\n\nexport const useDialogCarousel = (options?: any): DialogCarouselType => {\n const [emblaRef, emblaApi] = useEmblaCarousel(\n { loop: false, watchDrag: false, startIndex: 0, ...options },\n [AutoHeight({ active: true })],\n );\n const [canScrollPrev, setCanScrollPrev] = useState(false);\n const checkCanScrollPrev = () => {\n if (emblaApi) {\n setCanScrollPrev(emblaApi.canScrollPrev());\n }\n };\n const nextStep = () => {\n if (emblaApi) {\n console.log(\"going to NEXT 👉\");\n emblaApi.scrollNext();\n }\n };\n\n const prevStep = () => {\n if (emblaApi) {\n console.log(\"going to BACK 👈\");\n emblaApi.scrollPrev();\n }\n };\n useEffect(() => {\n checkCanScrollPrev(); // Initial check\n emblaApi && emblaApi.on(\"select\", checkCanScrollPrev); // Update on slide change\n return () => {\n emblaApi && emblaApi.off(\"select\", checkCanScrollPrev);\n };\n }, [emblaApi]);\n\n return {\n emblaRef,\n emblaApi,\n nextStep,\n prevStep,\n canScrollPrev,\n };\n};\n","import React, { useState, useEffect, useRef } from \"react\";\n\nexport const useMultiStepDialog = (initialStep: any, stepIds: any[], setOpenDialog: any) => {\n const [currentStep, setCurrentStep] = useState(initialStep);\n const [dialogHeight, setDialogHeight] = useState(null);\n const visibleStepRef = useRef<any>(null);\n\n useEffect(() => {\n if (visibleStepRef.current) {\n setDialogHeight(visibleStepRef.current.offsetHeight);\n }\n }, [currentStep, setOpenDialog]);\n\n const handleNext = () => {\n const currentIndex = stepIds.indexOf(currentStep);\n if (currentIndex < stepIds.length - 1) {\n setTimeout(() => {\n setCurrentStep(stepIds[currentIndex + 1]);\n }, 100);\n }\n };\n const handleBack = () => {\n const currentIndex = stepIds.indexOf(currentStep);\n if (currentIndex > 0) {\n setTimeout(() => {\n setCurrentStep(stepIds[currentIndex - 1]);\n }, 100);\n }\n };\n\n return {\n currentStep,\n dialogHeight,\n visibleStepRef,\n handleNext,\n handleBack,\n };\n};\n","import { useState } from \"react\";\n\nexport function useClipboard({ timeout = 2000 } = {}): {\n copy: (value: any) => void;\n reset: () => void;\n error: Error | null;\n copied: boolean;\n} {\n const [error, setError] = useState<Error | null>(null);\n const [copied, setCopied] = useState<boolean>(false);\n const [copyTimeout, setCopyTimeout] = useState<NodeJS.Timeout | null>(null);\n\n const handleCopyResult = (value: boolean) => {\n clearTimeout(copyTimeout as NodeJS.Timeout | undefined);\n setCopyTimeout(setTimeout(() => setCopied(false), timeout));\n setCopied(value);\n };\n\n const copy = (valueToCopy: any) => {\n if (\"clipboard\" in navigator) {\n navigator.clipboard\n .writeText(valueToCopy)\n .then(() => handleCopyResult(true))\n .catch((err) => setError(err));\n } else {\n setError(new Error(\"useClipboard: navigator.clipboard is not supported\"));\n }\n };\n\n const reset = () => {\n setCopied(false);\n setError(null);\n clearTimeout(copyTimeout as NodeJS.Timeout | undefined);\n };\n\n return { copy, reset, error, copied };\n}\n","import React, { useState, useEffect } from \"react\";\n\nexport const useBreakpoint = () => {\n // Initialize breakpoint with a null value.\n const [breakpoint, setBreakpoint] = useState<any>(null);\n\n useEffect(() => {\n // Check if window is defined (i.e., if running on the client side)\n if (typeof window !== \"undefined\") {\n // Define the resize function within the effect.\n const resize = () => {\n setBreakpoint(window.innerWidth);\n };\n\n // Call resize initially to set the breakpoint based on the initial window size.\n resize();\n\n // Set up the resize event listener.\n window.addEventListener(\"resize\", resize);\n\n // Clean up the event listener when the component is unmounted.\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []); // The empty array ensures this useEffect runs once, similar to componentDidMount.\n\n return breakpoint;\n};\n\n// import React, { useState, useEffect } from \"react\";\n\n// export const useBreakpoint = () => {\n// const [breakpoint, setBreakpoint] = useState(window?.innerWidth);\n// const resize = () => {\n// setBreakpoint(window?.innerWidth);\n// };\n\n// useEffect(() => {\n// // Ensure this code is only run on the client side\n// if (typeof window !== \"undefined\") {\n// // Now it's safe to use window\n// setBreakpoint(window?.innerWidth);\n// window?.addEventListener(\"resize\", resize);\n\n// return () => {\n// window?.removeEventListener(\"resize\", resize);\n// };\n// }\n// }, []); // Empty dependency array ensures this useEffect runs once, similar to componentDidMount\n\n// return breakpoint;\n// };\n","import { useEffect, useState } from \"react\";\n\ninterface WindowSize {\n width: number | undefined;\n height: number | undefined;\n}\n\nexport const useWindowSize = () => {\n const [windowSize, setWindowSize] = useState<WindowSize>({\n width: undefined,\n height: undefined,\n });\n\n useEffect(() => {\n function handleResize() {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n }\n window.addEventListener(\"resize\", handleResize);\n handleResize();\n return () => window.removeEventListener(\"resize\", handleResize);\n }, []);\n return windowSize;\n};\n","// useFocusWithin hook detects if any element within has focus, it works the same way as :focus-within CSS selector:\nimport { useRef, useState, useEffect } from \"react\";\n\n// Define options for the useFocusWithin hook, which includes onFocus and onBlur callbacks.\nexport interface UseFocusWithinOptions {\n onFocus?(event: FocusEvent): void;\n onBlur?(event: FocusEvent): void;\n}\n\n// Function to check if the event's related target is contained within the current target.\nfunction containsRelatedTarget(event: FocusEvent) {\n if (event.currentTarget instanceof HTMLElement && event.relatedTarget instanceof HTMLElement) {\n return event.currentTarget.contains(event.relatedTarget);\n }\n\n return false;\n}\n\n// Custom React hook for handling focus events within an element.\nexport function useFocusWithin<T extends HTMLElement = any>({\n onBlur,\n onFocus,\n}: UseFocusWithinOptions = {}): {\n ref: React.MutableRefObject<T>;\n focused: boolean;\n} {\n // Create a ref to hold the target element.\n const ref = useRef<T>(null!);\n\n // State to track if the element is focused.\n const [focused, _setFocused] = useState(false);\n\n // Create a ref to store the focused state.\n const focusedRef = useRef(false);\n\n // Function to set the focused state and update the ref.\n const setFocused = (value: boolean) => {\n _setFocused(value);\n focusedRef.current = value;\n };\n\n // Handle focus-in event: when the element gains focus.\n const handleFocusIn = (event: FocusEvent) => {\n if (!focusedRef.current) {\n setFocused(true);\n onFocus?.(event); // Call the onFocus callback if provided.\n }\n };\n\n // Handle focus-out event: when the element loses focus.\n const handleFocusOut = (event: FocusEvent) => {\n if (focusedRef.current && !containsRelatedTarget(event)) {\n setFocused(false);\n onBlur?.(event); // Call the onBlur callback if provided.\n }\n };\n\n // Attach event listeners for focusin and focusout events.\n useEffect(() => {\n if (ref.current) {\n ref.current.addEventListener(\"focusin\", handleFocusIn);\n ref.current.addEventListener(\"focusout\", handleFocusOut);\n\n // Clean up event listeners when the component unmounts.\n return () => {\n ref.current?.removeEventListener(\"focusin\", handleFocusIn);\n ref.current?.removeEventListener(\"focusout\", handleFocusOut);\n };\n }\n\n return undefined;\n }, [handleFocusIn, handleFocusOut]);\n\n // Return the ref and focused state.\n return { ref, focused };\n}\n","import { useState, useEffect, useRef } from \"react\";\n\nexport interface UseMediaQueryOptions {\n getInitialValueInEffect: boolean;\n}\n\ntype MediaQueryCallback = (event: { matches: boolean; media: string }) => void;\n\n/**\n * Older versions of Safari (shipped withCatalina and before) do not support addEventListener on matchMedia\n * https://stackoverflow.com/questions/56466261/matchmedia-addlistener-marked-as-deprecated-addeventlistener-equivalent\n * */\nfunction attachMediaListener(query: MediaQueryList, callback: MediaQueryCallback) {\n try {\n query.addEventListener(\"change\", callback);\n return () => query.removeEventListener(\"change\", callback);\n } catch (e) {\n query.addListener(callback);\n return () => query.removeListener(callback);\n }\n}\n\nfunction getInitialValue(query: string, initialValue?: boolean) {\n if (typeof initialValue === \"boolean\") {\n return initialValue;\n }\n\n if (typeof window !== \"undefined\" && \"matchMedia\" in window) {\n return window.matchMedia(query).matches;\n }\n\n return false;\n}\n\nexport function useMediaQuery(\n query: string,\n initialValue?: boolean,\n { getInitialValueInEffect }: UseMediaQueryOptions = {\n getInitialValueInEffect: true,\n },\n) {\n const [matches, setMatches] = useState(\n getInitialValueInEffect ? initialValue : getInitialValue(query, initialValue),\n );\n const queryRef = useRef<MediaQueryList>();\n\n useEffect(() => {\n if (\"matchMedia\" in window) {\n queryRef.current = window.matchMedia(query);\n setMatches(queryRef.current.matches);\n return attachMediaListener(queryRef.current, (event) => setMatches(event.matches));\n }\n\n return undefined;\n }, [query]);\n\n return matches;\n}\n","import React, { useState, useEffect, useRef } from \"react\";\n\nfunction useScrollPosition(ref: any) {\n const [scrollPosition, setScrollPosition] = useState(0);\n // const savedRef = useRef();\n\n // useEffect(() => {\n // savedRef.current = ref;\n // }, [ref]);\n\n useEffect(() => {\n function handleScroll() {\n setScrollPosition(ref.current.scrollTop);\n }\n\n if (ref.current) {\n ref.current.addEventListener(\"scroll\", handleScroll);\n }\n\n return () => {\n if (ref.current) {\n ref.current.removeEventListener(\"scroll\", handleScroll);\n }\n };\n }, [ref]);\n\n return scrollPosition;\n}\n\nexport default useScrollPosition;\n","import React, { useState, useEffect } from \"react\";\n\nconst calculateRange = (data: any, rowsPerPage: any) => {\n const range = [];\n const num = Math.ceil(data?.length / rowsPerPage);\n let i = 1;\n for (let i = 1; i <= num; i++) {\n range.push(i);\n }\n return range;\n};\n\nconst sliceData = (data: any, page: any, rowsPerPage: any) => {\n return data?.slice((page - 1) * rowsPerPage, page * rowsPerPage);\n};\n\n// useTable.js\nconst sortData = (data: any, sortColumn: any, sortDirection: any) => {\n if (sortColumn !== null) {\n return data?.sort((a: any, b: any) => {\n const aValue = a[sortColumn].value;\n const bValue = b[sortColumn].value;\n\n // Handle non-string values by using simple comparison\n if (typeof aValue === \"string\" && typeof bValue === \"string\") {\n if (sortDirection === \"asc\") {\n return aValue.localeCompare(bValue);\n } else {\n return bValue.localeCompare(aValue);\n }\n } else {\n if (sortDirection === \"asc\") {\n return aValue - bValue;\n } else {\n return bValue - aValue;\n }\n }\n });\n }\n return data;\n};\n\nconst useTable = (data: any, page: any, rowsPerPage: any, sortColumn: any, sortDirection: any) => {\n const [tableRange, setTableRange] = useState<any>([]);\n const [slice, setSlice] = useState<any>([]);\n\n useEffect(() => {\n if (data) {\n const range = calculateRange(data, rowsPerPage);\n setTableRange([...range]);\n\n const sortedData = sortData(data, sortColumn, sortDirection);\n const slicedData = sliceData(sortedData, page, rowsPerPage);\n setSlice([...slicedData]);\n }\n }, [data, setTableRange, page, rowsPerPage, sortColumn, sortDirection]);\n\n return { slice, range: tableRange };\n};\n\nexport default useTable;\n","import { useEffect, useState } from \"react\";\n\nfunction useTabs(initialTab = \"\") {\n const [activeTab, setActiveTab] = useState(initialTab);\n\n // Listen to hash changes in the URL\n useEffect(() => {\n const handleHashChange = () => {\n const hash = window.location.hash.substring(1);\n setActiveTab(hash || initialTab);\n };\n\n window.addEventListener(\"hashchange\", handleHashChange);\n\n // Initialize the tab based on the initial hash\n handleHashChange();\n\n return () => {\n // Remove the event listener when the component unmounts\n window.removeEventListener(\"hashchange\", handleHashChange);\n };\n }, [initialTab]);\n\n const handleTabChange = (index: any) => {\n setActiveTab(index);\n\n // Update the URL hash when the tab changes\n window.location.hash = index;\n };\n\n return {\n activeTab,\n handleTabChange,\n };\n}\n\nexport { useTabs };\n","import { RefObject, useEffect, useRef, useState } from \"react\";\n\nexport interface ContentRect {\n width: number;\n height: number;\n top: number;\n right: number;\n left: number;\n bottom: number;\n}\nexport const useMeasureDirty = (ref: RefObject<HTMLElement>): ContentRect => {\n const frame = useRef(0);\n const [rect, set] = useState({\n width: 0,\n height: 0,\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n });\n\n const [observer] = useState(\n () =>\n new ResizeObserver((entries) => {\n const entry = entries[0];\n\n if (entry) {\n cancelAnimationFrame(frame.current);\n\n frame.current = requestAnimationFrame(() => {\n if (ref.current) {\n set(entry.contentRect);\n }\n });\n }\n }),\n );\n\n useEffect(() => {\n observer.disconnect();\n\n if (ref.current) {\n observer.observe(ref.current);\n }\n }, [ref]);\n\n return rect;\n};\n","import { useEffect, useRef } from \"react\";\n\nconst DEFAULT_EVENTS = [\"mousedown\", \"touchstart\"];\n\nexport function useClickOutside<T extends HTMLElement = any>(\n handler: () => void,\n events?: string[] | null,\n nodes?: (HTMLElement | null)[],\n) {\n const ref = useRef<T>();\n\n useEffect(() => {\n const listener = (event: any) => {\n const { target } = event ?? {};\n if (Array.isArray(nodes)) {\n const shouldIgnore =\n target?.hasAttribute(\"data-ignore-outside-clicks\") ||\n (!document.body.contains(target) && target.tagName !== \"HTML\");\n const shouldTrigger = nodes.every((node) => !!node && !event.composedPath().includes(node));\n shouldTrigger && !shouldIgnore && handler();\n } else if (ref.current && !ref.current.contains(target)) {\n handler();\n }\n };\n\n (events || DEFAULT_EVENTS).forEach((fn) => document.addEventListener(fn, listener));\n\n return () => {\n (events || DEFAULT_EVENTS).forEach((fn) => document.removeEventListener(fn, listener));\n };\n }, [ref, handler, nodes]);\n\n return ref;\n}\n","import { useEffect } from \"react\";\n\nexport type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split(\"+\")\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes(\"alt\"),\n ctrl: keys.includes(\"ctrl\"),\n meta: keys.includes(\"meta\"),\n mod: keys.includes(\"mod\"),\n shift: keys.includes(\"shift\"),\n };\n\n const reservedKeys = [\"alt\", \"ctrl\", \"meta\", \"shift\", \"mod\"];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace(\"Key\", \"\").toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\nexport interface HotkeyItemOptions {\n preventDefault?: boolean;\n}\n\n// type HotkeyItem = [string, (event: any) => void, HotkeyItemOptions?];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = \"nativeEvent\" in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(_event);\n }\n });\n };\n}\n\nexport type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false,\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);\n }\n\n return true;\n}\n\nexport function useShortcuts(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = [\"INPUT\", \"TEXTAREA\", \"SELECT\"],\n triggerOnContentEditable = false,\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n });\n };\n\n document.documentElement.addEventListener(\"keydown\", keydownListener);\n return () => document.documentElement.removeEventListener(\"keydown\", keydownListener);\n }, [hotkeys]);\n}\n","import { useEffect } from \"react\";\n\nexport function useWindowEvent<K extends string>(\n type: K,\n listener: K extends keyof WindowEventMap\n ? (this: Window, ev: WindowEventMap[K]) => void\n : (this: Window, ev: CustomEvent) => void,\n options?: boolean | AddEventListenerOptions,\n) {\n useEffect(() => {\n window.addEventListener(type as any, listener, options);\n return () => window.removeEventListener(type as any, listener, options);\n }, [type, listener]);\n}\n","import { useCallback, useEffect, useState } from \"react\";\n\nimport { useWindowEvent } from \"./useWindowEvent\";\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({\n width: window.innerWidth || 0,\n height: window.innerHeight || 0,\n });\n }, []);\n\n useWindowEvent(\"resize\", setSize, eventListerOptions);\n useWindowEvent(\"orientationchange\", setSize, eventListerOptions);\n useEffect(setSize, []);\n\n return windowSize;\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(sanitizedHex);\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16),\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\"),\n },\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49,\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n { label, size = \"normal\", icon, color, radius = \"inherit\", dot, dotStatus = \"none\", ...rest },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small: \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n rest.className,\n )}\n >\n {dot && <span className={cn(dotStyles[size], dotStatusStyles[dotStatus])}></span>}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n","import * as React from \"react\";\n\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\nimport { cn } from \"@util/index\";\n\nimport { OrientationType } from \"@_types/commonTypes\";\n\ntype ScrollAreaProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> & {\n orientation?: OrientationType;\n};\n\nconst ScrollArea = React.forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Root>,\n ScrollAreaProps\n>(({ className, children, orientation = \"vertical\", ...props }, ref) => {\n const scrollAreaRef = React.useRef<HTMLDivElement | null>(null);\n const isDragging = React.useRef(false);\n const startPos = React.useRef({ x: 0, y: 0 });\n const scrollPos = React.useRef({ top: 0, left: 0 });\n\n const [showLeftFade, setShowLeftFade] = React.useState(false);\n const [showRightFade, setShowRightFade] = React.useState(false);\n\n const checkOverflow = () => {\n if (scrollAreaRef.current) {\n const { scrollLeft, scrollWidth, clientWidth } = scrollAreaRef.current;\n setShowLeftFade(scrollLeft > 0);\n setShowRightFade(scrollLeft + clientWidth < scrollWidth);\n }\n };\n\n const onMouseDown = (e: React.MouseEvent) => {\n isDragging.current = true;\n startPos.current = { x: e.clientX, y: e.clientY };\n if (scrollAreaRef.current) {\n scrollPos.current = {\n top: scrollAreaRef.current.scrollTop,\n left: scrollAreaRef.current.scrollLeft,\n };\n }\n document.addEventListener(\"mousemove\", onMouseMove);\n document.addEventListener(\"mouseup\", onMouseUp);\n };\n\n const onMouseMove = (e: MouseEvent) => {\n if (!isDragging.current || !scrollAreaRef.current) return;\n const dx = e.clientX - startPos.current.x;\n const dy = e.clientY - startPos.current.y;\n if (orientation === \"vertical\") {\n scrollAreaRef.current.scrollTop = scrollPos.current.top - dy;\n } else {\n scrollAreaRef.current.scrollLeft = scrollPos.current.left - dx;\n checkOverflow();\n }\n };\n\n const onMouseUp = () => {\n isDragging.current = false;\n document.removeEventListener(\"mousemove\", onMouseMove);\n document.removeEventListener(\"mouseup\", onMouseUp);\n };\n\n React.useEffect(() => {\n checkOverflow();\n if (scrollAreaRef.current) {\n scrollAreaRef.current.addEventListener(\"scroll\", checkOverflow);\n window.addEventListener(\"resize\", checkOverflow);\n }\n return () => {\n if (scrollAreaRef.current) {\n scrollAreaRef.current.removeEventListener(\"scroll\", checkOverflow);\n }\n window.removeEventListener(\"resize\", checkOverflow);\n };\n }, []);\n\n return (\n <ScrollAreaPrimitive.Root\n ref={ref}\n className={cn(\"hawa-relative hawa-overflow-hidden\", className)}\n {...props}\n >\n <div\n className={cn(\n \"hawa-pointer-events-none hawa-absolute hawa-bg-background hawa-h-full hawa-w-[50px] hawa-z-10 hawa-start-0 hawa-mask-fade-right\",\n showLeftFade ? \"hawa-block\" : \"hawa-hidden\",\n )}\n />\n <div\n className={cn(\n \"hawa-pointer-events-none hawa-absolute hawa-bg-background hawa-mask-fade-left hawa-end-0 hawa-h-full hawa-w-[50px] hawa-z-10\",\n showRightFade ? \"hawa-block\" : \"hawa-hidden\",\n )}\n />\n <ScrollAreaPrimitive.Viewport\n ref={scrollAreaRef}\n className=\"hawa-h-full hawa-w-full hawa-rounded-[inherit]\"\n onMouseDown={onMouseDown}\n >\n {children}\n </ScrollAreaPrimitive.Viewport>\n <ScrollBar orientation={orientation} />\n <ScrollAreaPrimitive.Corner />\n </ScrollAreaPrimitive.Root>\n );\n});\n\nScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;\n\nconst ScrollBar = React.forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>\n>(({ className, orientation = \"vertical\", ...props }, ref) => (\n <ScrollAreaPrimitive.ScrollAreaScrollbar\n ref={ref}\n orientation={orientation}\n className={cn(\n \"hawa-flex hawa-touch-none hawa-select-none hawa-transition-colors\",\n orientation === \"vertical\" &&\n \"hawa-h-full hawa-w-2.5 hawa-border-l hawa-border-l-transparent hawa-p-[1px]\",\n orientation === \"horizontal\" &&\n \"hawa-h-2.5 hawa-border-t hawa-border-t-transparent hawa-p-[1px]\",\n className,\n )}\n {...props}\n >\n <ScrollAreaPrimitive.ScrollAreaThumb\n className={cn(\n \"hawa-relative hawa-rounded-full hawa-bg-border\",\n orientation === \"vertical\" && \"hawa-flex-1\",\n )}\n />\n </ScrollAreaPrimitive.ScrollAreaScrollbar>\n));\n\nScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":"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","names":["React","useEffect","useState","React","useState","useRef","useEffect","useState","useState","useEffect","useRef","useState","useState","useEffect","useEffect","useState","useRef","useState","useEffect","useState","useEffect","useRef","useState","useEffect","useState","useEffect","useEffect","useState","useEffect","useRef","useState","useEffect","useRef","useEffect","useEffect","useEffect","useState","useState","useEffect","React","React","React"]}
@@ -88,9 +88,7 @@ function Skeleton({
88
88
 
89
89
  // elements/helperText/HelperText.tsx
90
90
  var import_react2 = __toESM(require("react"));
91
- var HelperText = ({
92
- helperText
93
- }) => /* @__PURE__ */ import_react2.default.createElement(
91
+ var HelperText = ({ helperText }) => /* @__PURE__ */ import_react2.default.createElement(
94
92
  "p",
95
93
  {
96
94
  className: cn(
@@ -141,38 +139,31 @@ var Tooltip = ({
141
139
  delayDuration = 300,
142
140
  ...props
143
141
  }) => {
144
- return /* @__PURE__ */ import_react3.default.createElement(
145
- TooltipPrimitive.TooltipProvider,
142
+ return /* @__PURE__ */ import_react3.default.createElement(TooltipPrimitive.TooltipProvider, { delayDuration, ...providerProps }, /* @__PURE__ */ import_react3.default.createElement(
143
+ TooltipPrimitive.Root,
146
144
  {
147
- delayDuration,
148
- ...providerProps
145
+ open: !disabled && open,
146
+ defaultOpen,
147
+ onOpenChange,
148
+ ...props
149
149
  },
150
+ /* @__PURE__ */ import_react3.default.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
150
151
  /* @__PURE__ */ import_react3.default.createElement(
151
- TooltipPrimitive.Root,
152
+ TooltipContent,
152
153
  {
153
- open: !disabled && open,
154
- defaultOpen,
155
- onOpenChange,
156
- ...props
154
+ size,
155
+ side,
156
+ align: "center",
157
+ ...contentProps,
158
+ style: {
159
+ ...contentProps == null ? void 0 : contentProps.style,
160
+ maxWidth: "var(--radix-tooltip-content-available-width)",
161
+ maxHeight: "var(--radix-tooltip-content-available-height)"
162
+ }
157
163
  },
158
- /* @__PURE__ */ import_react3.default.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
159
- /* @__PURE__ */ import_react3.default.createElement(
160
- TooltipContent,
161
- {
162
- size,
163
- side,
164
- align: "center",
165
- ...contentProps,
166
- style: {
167
- ...contentProps == null ? void 0 : contentProps.style,
168
- maxWidth: "var(--radix-tooltip-content-available-width)",
169
- maxHeight: "var(--radix-tooltip-content-available-height)"
170
- }
171
- },
172
- content
173
- )
164
+ content
174
165
  )
175
- );
166
+ ));
176
167
  };
177
168
 
178
169
  // elements/label/Label.tsx
@@ -239,15 +230,7 @@ var Textarea = React5.forwardRef(
239
230
  className
240
231
  )
241
232
  },
242
- /* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React5.createElement(
243
- "div",
244
- {
245
- className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
246
- },
247
- (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
248
- "/",
249
- textareaProps == null ? void 0 : textareaProps.maxLength
250
- )),
233
+ /* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength)),
251
234
  isLoading ? /* @__PURE__ */ React5.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React5.createElement(
252
235
  "textarea",
253
236
  {