@sikka/hawa 0.38.12-next → 0.38.14-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.
@@ -6123,7 +6123,7 @@ var Tabs = React45.forwardRef(({ className, orientation, variant = "default", ..
6123
6123
  },
6124
6124
  /* @__PURE__ */ React45.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
6125
6125
  ));
6126
- var TabsList = React45.forwardRef(({ className, ...props }, ref) => {
6126
+ var TabsList = React45.forwardRef(({ className, classNames, ...props }, ref) => {
6127
6127
  const { orientation, variant } = React45.useContext(TabsContext);
6128
6128
  const [size, setSize] = React45.useState(
6129
6129
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -6140,8 +6140,8 @@ var TabsList = React45.forwardRef(({ className, ...props }, ref) => {
6140
6140
  };
6141
6141
  }
6142
6142
  }, []);
6143
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
6144
- return /* @__PURE__ */ React45.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React45.createElement(
6143
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
6144
+ return /* @__PURE__ */ React45.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React45.createElement(
6145
6145
  TabsPrimitive.List,
6146
6146
  {
6147
6147
  ref,
@@ -17,7 +17,7 @@ import {
17
17
  TabsList,
18
18
  TabsTrigger,
19
19
  Textarea
20
- } from "../chunk-HDOYDKDV.mjs";
20
+ } from "../chunk-AONESDSB.mjs";
21
21
  import "../chunk-ZBUBNKF6.mjs";
22
22
  import {
23
23
  BadEmoji,
@@ -482,7 +482,7 @@ var Tabs = React12.forwardRef(({ className, orientation, variant = "default", ..
482
482
  },
483
483
  /* @__PURE__ */ React12.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
484
484
  ));
485
- var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
485
+ var TabsList = React12.forwardRef(({ className, classNames, ...props }, ref) => {
486
486
  const { orientation, variant } = React12.useContext(TabsContext);
487
487
  const [size, setSize] = React12.useState(
488
488
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -499,8 +499,8 @@ var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
499
499
  };
500
500
  }
501
501
  }, []);
502
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
503
- return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React12.createElement(
502
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
503
+ return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React12.createElement(
504
504
  TabsPrimitive.List,
505
505
  {
506
506
  ref,
@@ -248,7 +248,7 @@ var Tabs = React10.forwardRef(({ className, orientation, variant = "default", ..
248
248
  },
249
249
  /* @__PURE__ */ React10.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
250
250
  ));
251
- var TabsList = React10.forwardRef(({ className, ...props }, ref) => {
251
+ var TabsList = React10.forwardRef(({ className, classNames, ...props }, ref) => {
252
252
  const { orientation, variant } = React10.useContext(TabsContext);
253
253
  const [size, setSize] = React10.useState(
254
254
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -265,8 +265,8 @@ var TabsList = React10.forwardRef(({ className, ...props }, ref) => {
265
265
  };
266
266
  }
267
267
  }, []);
268
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
269
- return /* @__PURE__ */ React10.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React10.createElement(
268
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
269
+ return /* @__PURE__ */ React10.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React10.createElement(
270
270
  TabsPrimitive.List,
271
271
  {
272
272
  ref,
@@ -3130,7 +3130,7 @@ var Tabs = React13.forwardRef(({ className, orientation, variant = "default", ..
3130
3130
  },
3131
3131
  /* @__PURE__ */ React13.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
3132
3132
  ));
3133
- var TabsList = React13.forwardRef(({ className, ...props }, ref) => {
3133
+ var TabsList = React13.forwardRef(({ className, classNames, ...props }, ref) => {
3134
3134
  const { orientation, variant } = React13.useContext(TabsContext);
3135
3135
  const [size, setSize] = React13.useState(
3136
3136
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -3147,8 +3147,8 @@ var TabsList = React13.forwardRef(({ className, ...props }, ref) => {
3147
3147
  };
3148
3148
  }
3149
3149
  }, []);
3150
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
3151
- return /* @__PURE__ */ React13.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React13.createElement(
3150
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
3151
+ return /* @__PURE__ */ React13.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React13.createElement(
3152
3152
  TabsPrimitive.List,
3153
3153
  {
3154
3154
  ref,
@@ -553,6 +553,9 @@ declare const Tabs: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps
553
553
  } & React.RefAttributes<HTMLDivElement>>;
554
554
  declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
555
555
  scrollable?: boolean | undefined;
556
+ classNames?: {
557
+ scrollArea?: string | undefined;
558
+ } | undefined;
556
559
  } & React.RefAttributes<HTMLDivElement>>;
557
560
  declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
558
561
  chipProps?: ChipTypes | undefined;
@@ -553,6 +553,9 @@ declare const Tabs: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps
553
553
  } & React.RefAttributes<HTMLDivElement>>;
554
554
  declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
555
555
  scrollable?: boolean | undefined;
556
+ classNames?: {
557
+ scrollArea?: string | undefined;
558
+ } | undefined;
556
559
  } & React.RefAttributes<HTMLDivElement>>;
557
560
  declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
558
561
  chipProps?: ChipTypes | undefined;
@@ -4687,7 +4687,7 @@ var Tabs = React42.forwardRef(({ className, orientation, variant = "default", ..
4687
4687
  },
4688
4688
  /* @__PURE__ */ React42.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
4689
4689
  ));
4690
- var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
4690
+ var TabsList = React42.forwardRef(({ className, classNames, ...props }, ref) => {
4691
4691
  const { orientation, variant } = React42.useContext(TabsContext);
4692
4692
  const [size, setSize] = React42.useState(
4693
4693
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -4704,8 +4704,8 @@ var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
4704
4704
  };
4705
4705
  }
4706
4706
  }, []);
4707
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
4708
- return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React42.createElement(
4707
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
4708
+ return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React42.createElement(
4709
4709
  TabsPrimitive.List,
4710
4710
  {
4711
4711
  ref,
@@ -26,7 +26,7 @@ import {
26
26
  TabsList,
27
27
  TabsTrigger,
28
28
  Textarea
29
- } from "../chunk-HDOYDKDV.mjs";
29
+ } from "../chunk-AONESDSB.mjs";
30
30
  import {
31
31
  useClipboard
32
32
  } from "../chunk-ZBUBNKF6.mjs";
package/dist/index.d.mts CHANGED
@@ -725,6 +725,9 @@ declare const Tabs: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsPro
725
725
  } & React$1.RefAttributes<HTMLDivElement>>;
726
726
  declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
727
727
  scrollable?: boolean | undefined;
728
+ classNames?: {
729
+ scrollArea?: string | undefined;
730
+ } | undefined;
728
731
  } & React$1.RefAttributes<HTMLDivElement>>;
729
732
  declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
730
733
  chipProps?: ChipTypes | undefined;
package/dist/index.d.ts CHANGED
@@ -725,6 +725,9 @@ declare const Tabs: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsPro
725
725
  } & React$1.RefAttributes<HTMLDivElement>>;
726
726
  declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
727
727
  scrollable?: boolean | undefined;
728
+ classNames?: {
729
+ scrollArea?: string | undefined;
730
+ } | undefined;
728
731
  } & React$1.RefAttributes<HTMLDivElement>>;
729
732
  declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
730
733
  chipProps?: ChipTypes | undefined;
package/dist/index.js CHANGED
@@ -5182,7 +5182,7 @@ var Tabs = React42.forwardRef(({ className, orientation, variant = "default", ..
5182
5182
  },
5183
5183
  /* @__PURE__ */ React42.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
5184
5184
  ));
5185
- var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
5185
+ var TabsList = React42.forwardRef(({ className, classNames, ...props }, ref) => {
5186
5186
  const { orientation, variant } = React42.useContext(TabsContext);
5187
5187
  const [size, setSize] = React42.useState(
5188
5188
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -5199,8 +5199,8 @@ var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
5199
5199
  };
5200
5200
  }
5201
5201
  }, []);
5202
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
5203
- return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React42.createElement(
5202
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
5203
+ return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React42.createElement(
5204
5204
  TabsPrimitive.List,
5205
5205
  {
5206
5206
  ref,
package/dist/index.mjs CHANGED
@@ -4941,7 +4941,7 @@ var Tabs = React42.forwardRef(({ className, orientation, variant = "default", ..
4941
4941
  },
4942
4942
  /* @__PURE__ */ React42.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
4943
4943
  ));
4944
- var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
4944
+ var TabsList = React42.forwardRef(({ className, classNames, ...props }, ref) => {
4945
4945
  const { orientation, variant } = React42.useContext(TabsContext);
4946
4946
  const [size, setSize] = React42.useState(
4947
4947
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -4958,8 +4958,8 @@ var TabsList = React42.forwardRef(({ className, ...props }, ref) => {
4958
4958
  };
4959
4959
  }
4960
4960
  }, []);
4961
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
4962
- return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React42.createElement(
4961
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
4962
+ return /* @__PURE__ */ React42.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React42.createElement(
4963
4963
  TabsPrimitive.List,
4964
4964
  {
4965
4965
  ref,
@@ -26,6 +26,9 @@ declare const Tabs: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps
26
26
  } & React.RefAttributes<HTMLDivElement>>;
27
27
  declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
28
28
  scrollable?: boolean | undefined;
29
+ classNames?: {
30
+ scrollArea?: string | undefined;
31
+ } | undefined;
29
32
  } & React.RefAttributes<HTMLDivElement>>;
30
33
  declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
31
34
  chipProps?: ChipTypes | undefined;
@@ -26,6 +26,9 @@ declare const Tabs: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps
26
26
  } & React.RefAttributes<HTMLDivElement>>;
27
27
  declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
28
28
  scrollable?: boolean | undefined;
29
+ classNames?: {
30
+ scrollArea?: string | undefined;
31
+ } | undefined;
29
32
  } & React.RefAttributes<HTMLDivElement>>;
30
33
  declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
31
34
  chipProps?: ChipTypes | undefined;
@@ -475,7 +475,7 @@ var Tabs = React12.forwardRef(({ className, orientation, variant = "default", ..
475
475
  },
476
476
  /* @__PURE__ */ React12.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
477
477
  ));
478
- var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
478
+ var TabsList = React12.forwardRef(({ className, classNames, ...props }, ref) => {
479
479
  const { orientation, variant } = React12.useContext(TabsContext);
480
480
  const [size, setSize] = React12.useState(
481
481
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -492,8 +492,8 @@ var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
492
492
  };
493
493
  }
494
494
  }, []);
495
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
496
- return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React12.createElement(
495
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
496
+ return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React12.createElement(
497
497
  TabsPrimitive.List,
498
498
  {
499
499
  ref,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../elements/tabs/index.ts","../../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","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/floatBox/FloatBox.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["export * from \"./Tabs\";\n","import * as React from \"react\";\n\nimport { useMeasureDirty } from \"@hooks/index\";\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 { FloatBox } from \"../floatBox\";\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}>({ orientation: \"horizontal\", variant: \"default\" });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Root\n> & { variant?: TabsVariants };\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n TabsRootProps\n>(({ className, orientation, 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 }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n));\n\ntype TabsListProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.List\n> & { scrollable?: boolean };\n\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n TabsListProps\n>(({ className, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const [size, setSize] = React.useState(\n (typeof window !== \"undefined\" && window.innerWidth) || 1200,\n );\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n const resize = () => {\n setSize(window.innerWidth);\n };\n resize();\n window.addEventListener(\"resize\", resize);\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []);\n\n if ((props.scrollable || size < 768) && orientation === \"horizontal\") {\n return (\n <ScrollArea orientation=\"horizontal\">\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};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(({ className, chipProps, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const tabTriggerRef = React.useRef(null);\n const { width } = useMeasureDirty(tabTriggerRef);\n\n return (\n <TabsPrimitive.Trigger\n ref={tabTriggerRef}\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n\n <FloatBox\n withArrow\n align={orientation === \"vertical\" ? \"start\" : \"start\"}\n side={orientation === \"vertical\" ? \"right\" : \"bottom\"}\n sideOffset={orientation === \"vertical\" ? width + 30 : 45}\n open={props.showPopover}\n >\n {props.popoverContent}\n </FloatBox>\n </TabsPrimitive.Trigger>\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({ destroyHeight: \"fit\", 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 { 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 )}\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 { cn } from \"@util/index\";\n\nexport type FloatBoxProps = {\n className?: string;\n open?: boolean;\n children?: React.ReactNode;\n side?: \"bottom\" | \"left\" | \"right\" | \"top\";\n sideOffset?: number;\n align?: \"start\" | \"center\" | \"end\";\n alignOffset?: number;\n withArrow?: boolean;\n};\n\nconst FloatBox: React.FC<FloatBoxProps> = ({\n className,\n open,\n side = \"bottom\",\n sideOffset = 40,\n align = \"center\",\n withArrow = false,\n ...props\n}) => {\n let stylesMap = {\n bottom: {\n start: { top: sideOffset, insetInlineStart: 0 },\n center: { top: sideOffset },\n end: { top: sideOffset, insetInlineEnd: 0 },\n },\n top: {\n start: { bottom: sideOffset, insetInlineStart: 0 },\n center: { bottom: sideOffset },\n end: { bottom: sideOffset, insetInlineEnd: 0 },\n },\n right: {\n start: { left: sideOffset, top: -5 },\n center: { left: sideOffset },\n end: { left: sideOffset, bottom: 0 },\n },\n left: {\n start: { right: sideOffset, top: 0 },\n center: { right: sideOffset },\n end: { right: sideOffset, bottom: 0 },\n },\n };\n const arrowDirection = {\n top: \"hawa-arrow-default-bottom\",\n bottom: \"hawa-arrow-default-top\",\n right: \"hawa-arrow-default-left\",\n left: \"hawa-arrow-default-right\",\n };\n\n return (\n <div\n className={cn(\n \"data-[floatbox-state=closed]:hawa-invisible data-[floatbox-state=open]:hawa-visible hawa-absolute dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[floatbox-state=open]:hawa-animate-in data-[floatbox-state=closed]:hawa-animate-out data-[floatbox-state=closed]:hawa-fade-out-0 data-[floatbox-state=open]:hawa-fade-in-0 data-[floatbox-state=closed]:hawa-zoom-out-95 data-[floatbox-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 hawa-bg-popover\",\n className,\n )}\n style={{ ...stylesMap[side][align] }}\n data-side={side}\n data-floatbox-state={open ? \"open\" : \"closed\"}\n >\n {withArrow && <div className={cn(arrowDirection[side])} />}\n <span>{props.children}</span>\n </div>\n );\n};\n\nexport { FloatBox };\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","import_react","import_react","React","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","React","React","React"]}
1
+ {"version":3,"sources":["../../elements/tabs/index.ts","../../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","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/floatBox/FloatBox.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["export * from \"./Tabs\";\n","import * as React from \"react\";\n\nimport { useMeasureDirty } from \"@hooks/index\";\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 { FloatBox } from \"../floatBox\";\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}>({ orientation: \"horizontal\", variant: \"default\" });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Root\n> & { variant?: TabsVariants };\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n TabsRootProps\n>(({ className, orientation, 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 }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n));\n\ntype TabsListProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.List\n> & {\n scrollable?: boolean;\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 } = React.useContext(TabsContext);\n const [size, setSize] = React.useState(\n (typeof window !== \"undefined\" && window.innerWidth) || 1200,\n );\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n const resize = () => {\n setSize(window.innerWidth);\n };\n resize();\n window.addEventListener(\"resize\", resize);\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []);\n\n if (props.scrollable && size < 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};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(({ className, chipProps, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const tabTriggerRef = React.useRef(null);\n const { width } = useMeasureDirty(tabTriggerRef);\n\n return (\n <TabsPrimitive.Trigger\n ref={tabTriggerRef}\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n\n <FloatBox\n withArrow\n align={orientation === \"vertical\" ? \"start\" : \"start\"}\n side={orientation === \"vertical\" ? \"right\" : \"bottom\"}\n sideOffset={orientation === \"vertical\" ? width + 30 : 45}\n open={props.showPopover}\n >\n {props.popoverContent}\n </FloatBox>\n </TabsPrimitive.Trigger>\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({ destroyHeight: \"fit\", 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 { 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 )}\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 { cn } from \"@util/index\";\n\nexport type FloatBoxProps = {\n className?: string;\n open?: boolean;\n children?: React.ReactNode;\n side?: \"bottom\" | \"left\" | \"right\" | \"top\";\n sideOffset?: number;\n align?: \"start\" | \"center\" | \"end\";\n alignOffset?: number;\n withArrow?: boolean;\n};\n\nconst FloatBox: React.FC<FloatBoxProps> = ({\n className,\n open,\n side = \"bottom\",\n sideOffset = 40,\n align = \"center\",\n withArrow = false,\n ...props\n}) => {\n let stylesMap = {\n bottom: {\n start: { top: sideOffset, insetInlineStart: 0 },\n center: { top: sideOffset },\n end: { top: sideOffset, insetInlineEnd: 0 },\n },\n top: {\n start: { bottom: sideOffset, insetInlineStart: 0 },\n center: { bottom: sideOffset },\n end: { bottom: sideOffset, insetInlineEnd: 0 },\n },\n right: {\n start: { left: sideOffset, top: -5 },\n center: { left: sideOffset },\n end: { left: sideOffset, bottom: 0 },\n },\n left: {\n start: { right: sideOffset, top: 0 },\n center: { right: sideOffset },\n end: { right: sideOffset, bottom: 0 },\n },\n };\n const arrowDirection = {\n top: \"hawa-arrow-default-bottom\",\n bottom: \"hawa-arrow-default-top\",\n right: \"hawa-arrow-default-left\",\n left: \"hawa-arrow-default-right\",\n };\n\n return (\n <div\n className={cn(\n \"data-[floatbox-state=closed]:hawa-invisible data-[floatbox-state=open]:hawa-visible hawa-absolute dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[floatbox-state=open]:hawa-animate-in data-[floatbox-state=closed]:hawa-animate-out data-[floatbox-state=closed]:hawa-fade-out-0 data-[floatbox-state=open]:hawa-fade-in-0 data-[floatbox-state=closed]:hawa-zoom-out-95 data-[floatbox-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 hawa-bg-popover\",\n className,\n )}\n style={{ ...stylesMap[side][align] }}\n data-side={side}\n data-floatbox-state={open ? \"open\" : \"closed\"}\n >\n {withArrow && <div className={cn(arrowDirection[side])} />}\n <span>{props.children}</span>\n </div>\n );\n};\n\nexport { FloatBox };\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","import_react","import_react","React","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","import_react","React","React","React"]}
@@ -437,7 +437,7 @@ var Tabs = React12.forwardRef(({ className, orientation, variant = "default", ..
437
437
  },
438
438
  /* @__PURE__ */ React12.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
439
439
  ));
440
- var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
440
+ var TabsList = React12.forwardRef(({ className, classNames, ...props }, ref) => {
441
441
  const { orientation, variant } = React12.useContext(TabsContext);
442
442
  const [size, setSize] = React12.useState(
443
443
  typeof window !== "undefined" && window.innerWidth || 1200
@@ -454,8 +454,8 @@ var TabsList = React12.forwardRef(({ className, ...props }, ref) => {
454
454
  };
455
455
  }
456
456
  }, []);
457
- if ((props.scrollable || size < 768) && orientation === "horizontal") {
458
- return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal" }, /* @__PURE__ */ React12.createElement(
457
+ if (props.scrollable && size < 768 && orientation === "horizontal") {
458
+ return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React12.createElement(
459
459
  TabsPrimitive.List,
460
460
  {
461
461
  ref,
@@ -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","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/floatBox/FloatBox.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { useMeasureDirty } from \"@hooks/index\";\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 { FloatBox } from \"../floatBox\";\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}>({ orientation: \"horizontal\", variant: \"default\" });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Root\n> & { variant?: TabsVariants };\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n TabsRootProps\n>(({ className, orientation, 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 }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n));\n\ntype TabsListProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.List\n> & { scrollable?: boolean };\n\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n TabsListProps\n>(({ className, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const [size, setSize] = React.useState(\n (typeof window !== \"undefined\" && window.innerWidth) || 1200,\n );\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n const resize = () => {\n setSize(window.innerWidth);\n };\n resize();\n window.addEventListener(\"resize\", resize);\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []);\n\n if ((props.scrollable || size < 768) && orientation === \"horizontal\") {\n return (\n <ScrollArea orientation=\"horizontal\">\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};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(({ className, chipProps, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const tabTriggerRef = React.useRef(null);\n const { width } = useMeasureDirty(tabTriggerRef);\n\n return (\n <TabsPrimitive.Trigger\n ref={tabTriggerRef}\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n\n <FloatBox\n withArrow\n align={orientation === \"vertical\" ? \"start\" : \"start\"}\n side={orientation === \"vertical\" ? \"right\" : \"bottom\"}\n sideOffset={orientation === \"vertical\" ? width + 30 : 45}\n open={props.showPopover}\n >\n {props.popoverContent}\n </FloatBox>\n </TabsPrimitive.Trigger>\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({ destroyHeight: \"fit\", 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 { 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 )}\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 { cn } from \"@util/index\";\n\nexport type FloatBoxProps = {\n className?: string;\n open?: boolean;\n children?: React.ReactNode;\n side?: \"bottom\" | \"left\" | \"right\" | \"top\";\n sideOffset?: number;\n align?: \"start\" | \"center\" | \"end\";\n alignOffset?: number;\n withArrow?: boolean;\n};\n\nconst FloatBox: React.FC<FloatBoxProps> = ({\n className,\n open,\n side = \"bottom\",\n sideOffset = 40,\n align = \"center\",\n withArrow = false,\n ...props\n}) => {\n let stylesMap = {\n bottom: {\n start: { top: sideOffset, insetInlineStart: 0 },\n center: { top: sideOffset },\n end: { top: sideOffset, insetInlineEnd: 0 },\n },\n top: {\n start: { bottom: sideOffset, insetInlineStart: 0 },\n center: { bottom: sideOffset },\n end: { bottom: sideOffset, insetInlineEnd: 0 },\n },\n right: {\n start: { left: sideOffset, top: -5 },\n center: { left: sideOffset },\n end: { left: sideOffset, bottom: 0 },\n },\n left: {\n start: { right: sideOffset, top: 0 },\n center: { right: sideOffset },\n end: { right: sideOffset, bottom: 0 },\n },\n };\n const arrowDirection = {\n top: \"hawa-arrow-default-bottom\",\n bottom: \"hawa-arrow-default-top\",\n right: \"hawa-arrow-default-left\",\n left: \"hawa-arrow-default-right\",\n };\n\n return (\n <div\n className={cn(\n \"data-[floatbox-state=closed]:hawa-invisible data-[floatbox-state=open]:hawa-visible hawa-absolute dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[floatbox-state=open]:hawa-animate-in data-[floatbox-state=closed]:hawa-animate-out data-[floatbox-state=closed]:hawa-fade-out-0 data-[floatbox-state=open]:hawa-fade-in-0 data-[floatbox-state=closed]:hawa-zoom-out-95 data-[floatbox-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 hawa-bg-popover\",\n className,\n )}\n style={{ ...stylesMap[side][align] }}\n data-side={side}\n data-floatbox-state={open ? \"open\" : \"closed\"}\n >\n {withArrow && <div className={cn(arrowDirection[side])} />}\n <span>{props.children}</span>\n </div>\n );\n};\n\nexport { FloatBox };\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","React","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","../../util/index.ts","../../elements/chip/Chip.tsx","../../elements/floatBox/FloatBox.tsx","../../elements/scrollArea/ScrollArea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { useMeasureDirty } from \"@hooks/index\";\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 { FloatBox } from \"../floatBox\";\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}>({ orientation: \"horizontal\", variant: \"default\" });\n\ntype TabsRootProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.Root\n> & { variant?: TabsVariants };\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n TabsRootProps\n>(({ className, orientation, 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 }}>\n {props.children}\n </TabsContext.Provider>\n </TabsPrimitive.Root>\n));\n\ntype TabsListProps = React.ComponentPropsWithoutRef<\n typeof TabsPrimitive.List\n> & {\n scrollable?: boolean;\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 } = React.useContext(TabsContext);\n const [size, setSize] = React.useState(\n (typeof window !== \"undefined\" && window.innerWidth) || 1200,\n );\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n const resize = () => {\n setSize(window.innerWidth);\n };\n resize();\n window.addEventListener(\"resize\", resize);\n return () => {\n window.removeEventListener(\"resize\", resize);\n };\n }\n }, []);\n\n if (props.scrollable && size < 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};\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(({ className, chipProps, ...props }, ref) => {\n const { orientation, variant } = React.useContext(TabsContext);\n const tabTriggerRef = React.useRef(null);\n const { width } = useMeasureDirty(tabTriggerRef);\n\n return (\n <TabsPrimitive.Trigger\n ref={tabTriggerRef}\n className={cn(\n tabsTriggerVariant({ variant, orientation }),\n \"hawa-relative\",\n className,\n )}\n {...props}\n >\n {props.children}\n {chipProps && <Chip {...chipProps} />}\n\n <FloatBox\n withArrow\n align={orientation === \"vertical\" ? \"start\" : \"start\"}\n side={orientation === \"vertical\" ? \"right\" : \"bottom\"}\n sideOffset={orientation === \"vertical\" ? width + 30 : 45}\n open={props.showPopover}\n >\n {props.popoverContent}\n </FloatBox>\n </TabsPrimitive.Trigger>\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({ destroyHeight: \"fit\", 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 { 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 )}\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 { cn } from \"@util/index\";\n\nexport type FloatBoxProps = {\n className?: string;\n open?: boolean;\n children?: React.ReactNode;\n side?: \"bottom\" | \"left\" | \"right\" | \"top\";\n sideOffset?: number;\n align?: \"start\" | \"center\" | \"end\";\n alignOffset?: number;\n withArrow?: boolean;\n};\n\nconst FloatBox: React.FC<FloatBoxProps> = ({\n className,\n open,\n side = \"bottom\",\n sideOffset = 40,\n align = \"center\",\n withArrow = false,\n ...props\n}) => {\n let stylesMap = {\n bottom: {\n start: { top: sideOffset, insetInlineStart: 0 },\n center: { top: sideOffset },\n end: { top: sideOffset, insetInlineEnd: 0 },\n },\n top: {\n start: { bottom: sideOffset, insetInlineStart: 0 },\n center: { bottom: sideOffset },\n end: { bottom: sideOffset, insetInlineEnd: 0 },\n },\n right: {\n start: { left: sideOffset, top: -5 },\n center: { left: sideOffset },\n end: { left: sideOffset, bottom: 0 },\n },\n left: {\n start: { right: sideOffset, top: 0 },\n center: { right: sideOffset },\n end: { right: sideOffset, bottom: 0 },\n },\n };\n const arrowDirection = {\n top: \"hawa-arrow-default-bottom\",\n bottom: \"hawa-arrow-default-top\",\n right: \"hawa-arrow-default-left\",\n left: \"hawa-arrow-default-right\",\n };\n\n return (\n <div\n className={cn(\n \"data-[floatbox-state=closed]:hawa-invisible data-[floatbox-state=open]:hawa-visible hawa-absolute dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[floatbox-state=open]:hawa-animate-in data-[floatbox-state=closed]:hawa-animate-out data-[floatbox-state=closed]:hawa-fade-out-0 data-[floatbox-state=open]:hawa-fade-in-0 data-[floatbox-state=closed]:hawa-zoom-out-95 data-[floatbox-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 hawa-bg-popover\",\n className,\n )}\n style={{ ...stylesMap[side][align] }}\n data-side={side}\n data-floatbox-state={open ? \"open\" : \"closed\"}\n >\n {withArrow && <div className={cn(arrowDirection[side])} />}\n <span>{props.children}</span>\n </div>\n );\n};\n\nexport { FloatBox };\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","React","React","React","React"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sikka/hawa",
3
- "version": "0.38.12-next",
3
+ "version": "0.38.14-next",
4
4
  "description": "Modern UI Kit made with Tailwind",
5
5
  "author": {
6
6
  "name": "Sikka Software",