@sikka/hawa 0.38.5-next → 0.38.7-next

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/combobox/index.js +50 -37
  2. package/dist/combobox/index.js.map +1 -1
  3. package/dist/combobox/index.mjs +50 -37
  4. package/dist/combobox/index.mjs.map +1 -1
  5. package/dist/command/index.js +50 -37
  6. package/dist/command/index.js.map +1 -1
  7. package/dist/command/index.mjs +50 -37
  8. package/dist/command/index.mjs.map +1 -1
  9. package/dist/dialog/index.d.mts +10 -0
  10. package/dist/dialog/index.d.ts +10 -0
  11. package/dist/dialog/index.js +50 -37
  12. package/dist/dialog/index.js.map +1 -1
  13. package/dist/dialog/index.mjs +50 -37
  14. package/dist/dialog/index.mjs.map +1 -1
  15. package/dist/elements/index.d.mts +10 -0
  16. package/dist/elements/index.d.ts +10 -0
  17. package/dist/elements/index.js +50 -37
  18. package/dist/elements/index.mjs +50 -37
  19. package/dist/index.d.mts +10 -0
  20. package/dist/index.d.ts +10 -0
  21. package/dist/index.js +50 -37
  22. package/dist/index.mjs +50 -37
  23. package/package.json +1 -1
package/dist/dialog/index.mjs CHANGED
@@ -26,51 +26,64 @@ var DialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PUR
26
26
  ...props
27
27
  }
28
28
  ));
29
- var DialogContent = React.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React.createElement(DialogOverlay, null), /* @__PURE__ */ React.createElement(
30
- DialogPrimitive.Content,
31
- {
32
- onPointerDownOutside: (e) => {
33
- if (persist) {
34
- e.preventDefault();
35
- }
36
- },
37
- ref,
38
- className: cn(
39
- "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
40
- className
41
- ),
29
+ var DialogContent = React.forwardRef(
30
+ ({
31
+ ids,
32
+ className,
33
+ classNames,
34
+ children,
35
+ persist,
36
+ hideCloseButton,
42
37
  ...props
43
- },
44
- children,
45
- !hideCloseButton && /* @__PURE__ */ React.createElement(
46
- DialogPrimitive.Close,
38
+ }, ref) => /* @__PURE__ */ React.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React.createElement(DialogOverlay, { className: classNames == null ? void 0 : classNames.overlay, id: ids == null ? void 0 : ids.overlay }), /* @__PURE__ */ React.createElement(
39
+ DialogPrimitive.Content,
47
40
  {
41
+ onPointerDownOutside: (e) => {
42
+ if (persist) {
43
+ e.preventDefault();
44
+ }
45
+ },
46
+ ref,
48
47
  className: cn(
49
- "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
50
- props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
51
- )
48
+ "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
49
+ className
50
+ ),
51
+ ...props
52
52
  },
53
- /* @__PURE__ */ React.createElement(
54
- "svg",
53
+ children,
54
+ !hideCloseButton && /* @__PURE__ */ React.createElement(
55
+ DialogPrimitive.Close,
55
56
  {
56
- "aria-label": "Close Icon",
57
- "aria-hidden": "true",
58
- className: "hawa-h-5 hawa-w-5",
59
- fill: "currentColor",
60
- viewBox: "0 0 20 20"
57
+ className: cn(
58
+ "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
59
+ props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4",
60
+ classNames == null ? void 0 : classNames.closeButton
61
+ ),
62
+ id: ids == null ? void 0 : ids.closeButton
61
63
  },
62
64
  /* @__PURE__ */ React.createElement(
63
- "path",
65
+ "svg",
64
66
  {
65
- fillRule: "evenodd",
66
- d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
67
- clipRule: "evenodd"
68
- }
69
- )
70
- ),
71
- /* @__PURE__ */ React.createElement("span", { className: "hawa-sr-only" }, "Close")
72
- )
73
- )));
67
+ id: ids == null ? void 0 : ids.closeIcon,
68
+ "aria-label": "Close Icon",
69
+ "aria-hidden": "true",
70
+ className: "hawa-h-5 hawa-w-5",
71
+ fill: "currentColor",
72
+ viewBox: "0 0 20 20"
73
+ },
74
+ /* @__PURE__ */ React.createElement(
75
+ "path",
76
+ {
77
+ fillRule: "evenodd",
78
+ d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
79
+ clipRule: "evenodd"
80
+ }
81
+ )
82
+ ),
83
+ /* @__PURE__ */ React.createElement("span", { className: "hawa-sr-only" }, "Close")
84
+ )
85
+ ))
86
+ );
74
87
  var DialogCarouselContent = React.forwardRef(
75
88
  ({
76
89
  className,
package/dist/dialog/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../elements/dialog/Dialog.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = ({ ...props }: DialogPrimitive.DialogPortalProps) => (\n <DialogPrimitive.Portal {...props} />\n);\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Overlay\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0\",\n className,\n )}\n {...props}\n />\n));\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n persist?: boolean;\n hideCloseButton?: boolean;\n container?: HTMLElement;\n }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\n <DialogPortal container={props.container}>\n <DialogOverlay />\n <DialogPrimitive.Content\n onPointerDownOutside={(e) => {\n if (persist) {\n e.preventDefault();\n }\n }}\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full\",\n className,\n )}\n {...props}\n >\n {children}\n {!hideCloseButton && (\n <DialogPrimitive.Close\n className={cn(\n \"hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\",\n )}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-h-5 hawa-w-5\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n <span className=\"hawa-sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogPortal>\n));\n\nconst DialogCarouselContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n hideCloseButton?: boolean;\n hidePrevButton?: boolean;\n persist?: boolean;\n onPrev?: () => void;\n }\n>(\n (\n {\n className,\n children,\n onPrev,\n persist,\n hideCloseButton,\n hidePrevButton,\n ...props\n },\n ref,\n ) => (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Content\n onPointerDownOutside={(e) => {\n if (persist) {\n e.preventDefault();\n }\n }}\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-pt-14 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n className,\n )}\n {...props}\n >\n {children}\n <div\n className={cn(\n \"hawa-absolute hawa-top-0 hawa-flex hawa-w-full hawa-flex-row hawa-p-4\",\n onPrev ? \"hawa-justify-between\" : \"hawa-justify-end\",\n )}\n >\n {hidePrevButton ? (\n <div />\n ) : (\n <div\n onClick={onPrev}\n className={cn(\n \"hawa-end-0 hawa-cursor-pointer hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n props.dir === \"rtl\" && \"hawa-rotate-180\",\n )}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n className=\"hawa-h-6 hawa-w-6\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"m15 18-6-6 6-6\" />\n </svg>\n </div>\n )}\n {!hideCloseButton && (\n <DialogPrimitive.Close\n className={cn(\n \"hawa-end-0 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground \",\n props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\",\n )}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-h-6 hawa-w-6\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n <span className=\"hawa-sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </div>\n </DialogPrimitive.Content>\n </DialogPortal>\n ),\n);\n\nconst DialogHeader = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-text-center sm:hawa-text-left\",\n className,\n )}\n {...props}\n />\n);\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn(\n \"hawa-text-start hawa-text-lg hawa-font-semibold hawa-leading-none hawa-tracking-tight\",\n className,\n )}\n {...props}\n />\n));\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn(\n \"hawa-text-start hawa-text-sm hawa-text-muted-foreground\",\n className,\n )}\n {...props}\n />\n));\nconst DialogFooter = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-gap-2\",\n className,\n )}\n {...props}\n />\n);\ninterface DialogCarouselProps {\n children: React.ReactNode;\n stepsApi?: any;\n stepsRef?: any;\n direction?: DirectionType;\n}\nconst DialogCarousel: React.FC<DialogCarouselProps> = ({\n stepsApi,\n stepsRef,\n children,\n direction,\n}) => {\n React.useEffect(() => {\n if (stepsApi) {\n stepsApi.reInit();\n }\n }, [stepsApi, children]);\n return (\n <div className=\"hawa-overflow-hidden\">\n <div ref={stepsRef} dir={direction}>\n <div\n className=\"hawa-flex\"\n style={{\n transition: \"height 0.2s\",\n }}\n >\n {React.Children.map(children, (child, index) => (\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\",\n )}\n key={index}\n >\n {child}\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};\ninterface DialogStepsProps {\n currentStep: string;\n // TODO: update this name\n visibleStepRef: React.RefObject<HTMLDivElement>;\n children: React.ReactNode;\n}\nconst DialogSteps: React.FC<DialogStepsProps> = ({\n currentStep,\n visibleStepRef,\n children,\n}) => {\n const [dialogHeight, setDialogHeight] = React.useState<any>(null);\n React.useEffect(() => {\n if (visibleStepRef.current) {\n setDialogHeight(visibleStepRef.current.offsetHeight);\n console.log(\"height is \", visibleStepRef.current.offsetHeight);\n }\n }, [currentStep, visibleStepRef]);\n\n return (\n <div\n className=\"hawa-relative hawa-overflow-clip\"\n style={{\n height: dialogHeight || \"fit-content\",\n transition: \"height 0.2s\",\n }}\n >\n {React.Children.map(children, (child, index) => (\n <div\n ref={currentStep === `step-${index + 1}` ? visibleStepRef : null}\n className={cn(\n currentStep === `step-${index + 1}`\n ? \"hawa-visible hawa-block\"\n : \"hawa-invisible hawa-hidden\",\n )}\n >\n {child}\n </div>\n ))}\n </div>\n );\n};\ninterface DialogStepProps {\n id: string;\n children: React.ReactNode;\n className?: string;\n stepRef?: any;\n}\nconst DialogStep: React.FC<DialogStepProps> = ({\n id,\n children,\n className,\n stepRef,\n}) => {\n return (\n <div\n id={id}\n ref={stepRef}\n className={cn(\"hawa-w-full hawa-px-1\", className)}\n >\n {children}\n </div>\n );\n};\ninterface DialogBodyProps {\n children: React.ReactNode;\n className?: string;\n}\nconst DialogBody: React.FC<DialogBodyProps> = ({ children, className }) => {\n return <div className={cn(\"hawa-py-6\", className)}>{children}</div>;\n};\n\nDialogBody.displayName = \"DialogBody\";\nDialogStep.displayName = \"DialogStep\";\nDialogSteps.displayName = \"DialogSteps\";\nDialogCarousel.displayName = \"DialogCarousel\";\nDialogCarouselContent.displayName = \"DialogCarouselContent\";\nDialogHeader.displayName = \"DialogHeader\";\nDialogFooter.displayName = \"DialogFooter\";\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\nDialogPortal.displayName = DialogPrimitive.Portal.displayName;\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\nDialogContent.displayName = DialogPrimitive.Content.displayName;\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n Dialog,\n DialogPortal,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogFooter,\n DialogTitle,\n DialogCarousel,\n DialogCarouselContent,\n DialogSteps,\n DialogStep,\n DialogBody,\n DialogDescription,\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"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../elements/dialog/Dialog.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = ({ ...props }: DialogPrimitive.DialogPortalProps) => (\n <DialogPrimitive.Portal {...props} />\n);\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Overlay\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0\",\n className,\n )}\n {...props}\n />\n));\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n persist?: boolean;\n hideCloseButton?: boolean;\n container?: HTMLElement;\n classNames?: {\n content?: string;\n overlay?: string;\n closeButton?: string;\n };\n ids?: {\n overlay?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n }\n>(\n (\n {\n ids,\n className,\n classNames,\n children,\n persist,\n hideCloseButton,\n ...props\n },\n ref,\n ) => (\n <DialogPortal container={props.container}>\n <DialogOverlay className={classNames?.overlay} id={ids?.overlay} />\n <DialogPrimitive.Content\n onPointerDownOutside={(e) => {\n if (persist) {\n e.preventDefault();\n }\n }}\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full\",\n className,\n )}\n {...props}\n >\n {children}\n {!hideCloseButton && (\n <DialogPrimitive.Close\n className={cn(\n \"hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\",\n classNames?.closeButton,\n )}\n id={ids?.closeButton}\n >\n <svg\n id={ids?.closeIcon}\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-h-5 hawa-w-5\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n <span className=\"hawa-sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogPortal>\n ),\n);\n\nconst DialogCarouselContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n hideCloseButton?: boolean;\n hidePrevButton?: boolean;\n persist?: boolean;\n onPrev?: () => void;\n }\n>(\n (\n {\n className,\n children,\n onPrev,\n persist,\n hideCloseButton,\n hidePrevButton,\n ...props\n },\n ref,\n ) => (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Content\n onPointerDownOutside={(e) => {\n if (persist) {\n e.preventDefault();\n }\n }}\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-pt-14 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n className,\n )}\n {...props}\n >\n {children}\n <div\n className={cn(\n \"hawa-absolute hawa-top-0 hawa-flex hawa-w-full hawa-flex-row hawa-p-4\",\n onPrev ? \"hawa-justify-between\" : \"hawa-justify-end\",\n )}\n >\n {hidePrevButton ? (\n <div />\n ) : (\n <div\n onClick={onPrev}\n className={cn(\n \"hawa-end-0 hawa-cursor-pointer hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n props.dir === \"rtl\" && \"hawa-rotate-180\",\n )}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n className=\"hawa-h-6 hawa-w-6\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"m15 18-6-6 6-6\" />\n </svg>\n </div>\n )}\n {!hideCloseButton && (\n <DialogPrimitive.Close\n className={cn(\n \"hawa-end-0 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground \",\n props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\",\n )}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-h-6 hawa-w-6\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n <span className=\"hawa-sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </div>\n </DialogPrimitive.Content>\n </DialogPortal>\n ),\n);\n\nconst DialogHeader = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-text-center sm:hawa-text-left\",\n className,\n )}\n {...props}\n />\n);\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn(\n \"hawa-text-start hawa-text-lg hawa-font-semibold hawa-leading-none hawa-tracking-tight\",\n className,\n )}\n {...props}\n />\n));\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn(\n \"hawa-text-start hawa-text-sm hawa-text-muted-foreground\",\n className,\n )}\n {...props}\n />\n));\nconst DialogFooter = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-gap-2\",\n className,\n )}\n {...props}\n />\n);\ninterface DialogCarouselProps {\n children: React.ReactNode;\n stepsApi?: any;\n stepsRef?: any;\n direction?: DirectionType;\n}\nconst DialogCarousel: React.FC<DialogCarouselProps> = ({\n stepsApi,\n stepsRef,\n children,\n direction,\n}) => {\n React.useEffect(() => {\n if (stepsApi) {\n stepsApi.reInit();\n }\n }, [stepsApi, children]);\n return (\n <div className=\"hawa-overflow-hidden\">\n <div ref={stepsRef} dir={direction}>\n <div\n className=\"hawa-flex\"\n style={{\n transition: \"height 0.2s\",\n }}\n >\n {React.Children.map(children, (child, index) => (\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\",\n )}\n key={index}\n >\n {child}\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};\ninterface DialogStepsProps {\n currentStep: string;\n // TODO: update this name\n visibleStepRef: React.RefObject<HTMLDivElement>;\n children: React.ReactNode;\n}\nconst DialogSteps: React.FC<DialogStepsProps> = ({\n currentStep,\n visibleStepRef,\n children,\n}) => {\n const [dialogHeight, setDialogHeight] = React.useState<any>(null);\n React.useEffect(() => {\n if (visibleStepRef.current) {\n setDialogHeight(visibleStepRef.current.offsetHeight);\n console.log(\"height is \", visibleStepRef.current.offsetHeight);\n }\n }, [currentStep, visibleStepRef]);\n\n return (\n <div\n className=\"hawa-relative hawa-overflow-clip\"\n style={{\n height: dialogHeight || \"fit-content\",\n transition: \"height 0.2s\",\n }}\n >\n {React.Children.map(children, (child, index) => (\n <div\n ref={currentStep === `step-${index + 1}` ? visibleStepRef : null}\n className={cn(\n currentStep === `step-${index + 1}`\n ? \"hawa-visible hawa-block\"\n : \"hawa-invisible hawa-hidden\",\n )}\n >\n {child}\n </div>\n ))}\n </div>\n );\n};\ninterface DialogStepProps {\n id: string;\n children: React.ReactNode;\n className?: string;\n stepRef?: any;\n}\nconst DialogStep: React.FC<DialogStepProps> = ({\n id,\n children,\n className,\n stepRef,\n}) => {\n return (\n <div\n id={id}\n ref={stepRef}\n className={cn(\"hawa-w-full hawa-px-1\", className)}\n >\n {children}\n </div>\n );\n};\ninterface DialogBodyProps {\n children: React.ReactNode;\n className?: string;\n}\nconst DialogBody: React.FC<DialogBodyProps> = ({ children, className }) => {\n return <div className={cn(\"hawa-py-6\", className)}>{children}</div>;\n};\n\nDialogBody.displayName = \"DialogBody\";\nDialogStep.displayName = \"DialogStep\";\nDialogSteps.displayName = \"DialogSteps\";\nDialogCarousel.displayName = \"DialogCarousel\";\nDialogCarouselContent.displayName = \"DialogCarouselContent\";\nDialogHeader.displayName = \"DialogHeader\";\nDialogFooter.displayName = \"DialogFooter\";\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\nDialogPortal.displayName = DialogPrimitive.Portal.displayName;\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\nDialogContent.displayName = DialogPrimitive.Content.displayName;\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n Dialog,\n DialogPortal,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogFooter,\n DialogTitle,\n DialogCarousel,\n DialogCarouselContent,\n DialogSteps,\n DialogStep,\n DialogBody,\n DialogDescription,\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"],"mappings":"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","names":[]}
package/dist/elements/index.d.mts CHANGED
@@ -225,6 +225,16 @@ declare const DialogContent: React.ForwardRefExoticComponent<Omit<SheetPrimitive
225
225
  persist?: boolean | undefined;
226
226
  hideCloseButton?: boolean | undefined;
227
227
  container?: HTMLElement | undefined;
228
+ classNames?: {
229
+ content?: string | undefined;
230
+ overlay?: string | undefined;
231
+ closeButton?: string | undefined;
232
+ } | undefined;
233
+ ids?: {
234
+ overlay?: string | undefined;
235
+ closeButton?: string | undefined;
236
+ closeIcon?: string | undefined;
237
+ } | undefined;
228
238
  } & React.RefAttributes<HTMLDivElement>>;
229
239
  declare const DialogCarouselContent: React.ForwardRefExoticComponent<Omit<SheetPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
230
240
  hideCloseButton?: boolean | undefined;
package/dist/elements/index.d.ts CHANGED
@@ -225,6 +225,16 @@ declare const DialogContent: React.ForwardRefExoticComponent<Omit<SheetPrimitive
225
225
  persist?: boolean | undefined;
226
226
  hideCloseButton?: boolean | undefined;
227
227
  container?: HTMLElement | undefined;
228
+ classNames?: {
229
+ content?: string | undefined;
230
+ overlay?: string | undefined;
231
+ closeButton?: string | undefined;
232
+ } | undefined;
233
+ ids?: {
234
+ overlay?: string | undefined;
235
+ closeButton?: string | undefined;
236
+ closeIcon?: string | undefined;
237
+ } | undefined;
228
238
  } & React.RefAttributes<HTMLDivElement>>;
229
239
  declare const DialogCarouselContent: React.ForwardRefExoticComponent<Omit<SheetPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
230
240
  hideCloseButton?: boolean | undefined;
package/dist/elements/index.js CHANGED
@@ -1903,51 +1903,64 @@ var DialogOverlay = React14.forwardRef(({ className, ...props }, ref) => /* @__P
1903
1903
  ...props
1904
1904
  }
1905
1905
  ));
1906
- var DialogContent = React14.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React14.createElement(DialogOverlay, null), /* @__PURE__ */ React14.createElement(
1907
- DialogPrimitive.Content,
1908
- {
1909
- onPointerDownOutside: (e) => {
1910
- if (persist) {
1911
- e.preventDefault();
1912
- }
1913
- },
1914
- ref,
1915
- className: cn(
1916
- "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
1917
- className
1918
- ),
1906
+ var DialogContent = React14.forwardRef(
1907
+ ({
1908
+ ids,
1909
+ className,
1910
+ classNames,
1911
+ children,
1912
+ persist,
1913
+ hideCloseButton,
1919
1914
  ...props
1920
- },
1921
- children,
1922
- !hideCloseButton && /* @__PURE__ */ React14.createElement(
1923
- DialogPrimitive.Close,
1915
+ }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React14.createElement(DialogOverlay, { className: classNames == null ? void 0 : classNames.overlay, id: ids == null ? void 0 : ids.overlay }), /* @__PURE__ */ React14.createElement(
1916
+ DialogPrimitive.Content,
1924
1917
  {
1918
+ onPointerDownOutside: (e) => {
1919
+ if (persist) {
1920
+ e.preventDefault();
1921
+ }
1922
+ },
1923
+ ref,
1925
1924
  className: cn(
1926
- "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
1927
- props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
1928
- )
1925
+ "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
1926
+ className
1927
+ ),
1928
+ ...props
1929
1929
  },
1930
- /* @__PURE__ */ React14.createElement(
1931
- "svg",
1930
+ children,
1931
+ !hideCloseButton && /* @__PURE__ */ React14.createElement(
1932
+ DialogPrimitive.Close,
1932
1933
  {
1933
- "aria-label": "Close Icon",
1934
- "aria-hidden": "true",
1935
- className: "hawa-h-5 hawa-w-5",
1936
- fill: "currentColor",
1937
- viewBox: "0 0 20 20"
1934
+ className: cn(
1935
+ "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
1936
+ props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4",
1937
+ classNames == null ? void 0 : classNames.closeButton
1938
+ ),
1939
+ id: ids == null ? void 0 : ids.closeButton
1938
1940
  },
1939
1941
  /* @__PURE__ */ React14.createElement(
1940
- "path",
1942
+ "svg",
1941
1943
  {
1942
- fillRule: "evenodd",
1943
- d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
1944
- clipRule: "evenodd"
1945
- }
1946
- )
1947
- ),
1948
- /* @__PURE__ */ React14.createElement("span", { className: "hawa-sr-only" }, "Close")
1949
- )
1950
- )));
1944
+ id: ids == null ? void 0 : ids.closeIcon,
1945
+ "aria-label": "Close Icon",
1946
+ "aria-hidden": "true",
1947
+ className: "hawa-h-5 hawa-w-5",
1948
+ fill: "currentColor",
1949
+ viewBox: "0 0 20 20"
1950
+ },
1951
+ /* @__PURE__ */ React14.createElement(
1952
+ "path",
1953
+ {
1954
+ fillRule: "evenodd",
1955
+ d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
1956
+ clipRule: "evenodd"
1957
+ }
1958
+ )
1959
+ ),
1960
+ /* @__PURE__ */ React14.createElement("span", { className: "hawa-sr-only" }, "Close")
1961
+ )
1962
+ ))
1963
+ );
1951
1964
  var DialogCarouselContent = React14.forwardRef(
1952
1965
  ({
1953
1966
  className,
package/dist/elements/index.mjs CHANGED
@@ -392,51 +392,64 @@ var DialogOverlay = React6.forwardRef(({ className, ...props }, ref) => /* @__PU
392
392
  ...props
393
393
  }
394
394
  ));
395
- var DialogContent = React6.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React6.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React6.createElement(DialogOverlay, null), /* @__PURE__ */ React6.createElement(
396
- DialogPrimitive.Content,
397
- {
398
- onPointerDownOutside: (e) => {
399
- if (persist) {
400
- e.preventDefault();
401
- }
402
- },
403
- ref,
404
- className: cn(
405
- "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
406
- className
407
- ),
395
+ var DialogContent = React6.forwardRef(
396
+ ({
397
+ ids,
398
+ className,
399
+ classNames,
400
+ children,
401
+ persist,
402
+ hideCloseButton,
408
403
  ...props
409
- },
410
- children,
411
- !hideCloseButton && /* @__PURE__ */ React6.createElement(
412
- DialogPrimitive.Close,
404
+ }, ref) => /* @__PURE__ */ React6.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React6.createElement(DialogOverlay, { className: classNames == null ? void 0 : classNames.overlay, id: ids == null ? void 0 : ids.overlay }), /* @__PURE__ */ React6.createElement(
405
+ DialogPrimitive.Content,
413
406
  {
407
+ onPointerDownOutside: (e) => {
408
+ if (persist) {
409
+ e.preventDefault();
410
+ }
411
+ },
412
+ ref,
414
413
  className: cn(
415
- "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
416
- props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
417
- )
414
+ "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
415
+ className
416
+ ),
417
+ ...props
418
418
  },
419
- /* @__PURE__ */ React6.createElement(
420
- "svg",
419
+ children,
420
+ !hideCloseButton && /* @__PURE__ */ React6.createElement(
421
+ DialogPrimitive.Close,
421
422
  {
422
- "aria-label": "Close Icon",
423
- "aria-hidden": "true",
424
- className: "hawa-h-5 hawa-w-5",
425
- fill: "currentColor",
426
- viewBox: "0 0 20 20"
423
+ className: cn(
424
+ "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
425
+ props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4",
426
+ classNames == null ? void 0 : classNames.closeButton
427
+ ),
428
+ id: ids == null ? void 0 : ids.closeButton
427
429
  },
428
430
  /* @__PURE__ */ React6.createElement(
429
- "path",
431
+ "svg",
430
432
  {
431
- fillRule: "evenodd",
432
- d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
433
- clipRule: "evenodd"
434
- }
435
- )
436
- ),
437
- /* @__PURE__ */ React6.createElement("span", { className: "hawa-sr-only" }, "Close")
438
- )
439
- )));
433
+ id: ids == null ? void 0 : ids.closeIcon,
434
+ "aria-label": "Close Icon",
435
+ "aria-hidden": "true",
436
+ className: "hawa-h-5 hawa-w-5",
437
+ fill: "currentColor",
438
+ viewBox: "0 0 20 20"
439
+ },
440
+ /* @__PURE__ */ React6.createElement(
441
+ "path",
442
+ {
443
+ fillRule: "evenodd",
444
+ d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
445
+ clipRule: "evenodd"
446
+ }
447
+ )
448
+ ),
449
+ /* @__PURE__ */ React6.createElement("span", { className: "hawa-sr-only" }, "Close")
450
+ )
451
+ ))
452
+ );
440
453
  var DialogCarouselContent = React6.forwardRef(
441
454
  ({
442
455
  className,
package/dist/index.d.mts CHANGED
@@ -359,6 +359,16 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<SheetPrimiti
359
359
  persist?: boolean | undefined;
360
360
  hideCloseButton?: boolean | undefined;
361
361
  container?: HTMLElement | undefined;
362
+ classNames?: {
363
+ content?: string | undefined;
364
+ overlay?: string | undefined;
365
+ closeButton?: string | undefined;
366
+ } | undefined;
367
+ ids?: {
368
+ overlay?: string | undefined;
369
+ closeButton?: string | undefined;
370
+ closeIcon?: string | undefined;
371
+ } | undefined;
362
372
  } & React$1.RefAttributes<HTMLDivElement>>;
363
373
  declare const DialogCarouselContent: React$1.ForwardRefExoticComponent<Omit<SheetPrimitive.DialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
364
374
  hideCloseButton?: boolean | undefined;
package/dist/index.d.ts CHANGED
@@ -359,6 +359,16 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<SheetPrimiti
359
359
  persist?: boolean | undefined;
360
360
  hideCloseButton?: boolean | undefined;
361
361
  container?: HTMLElement | undefined;
362
+ classNames?: {
363
+ content?: string | undefined;
364
+ overlay?: string | undefined;
365
+ closeButton?: string | undefined;
366
+ } | undefined;
367
+ ids?: {
368
+ overlay?: string | undefined;
369
+ closeButton?: string | undefined;
370
+ closeIcon?: string | undefined;
371
+ } | undefined;
362
372
  } & React$1.RefAttributes<HTMLDivElement>>;
363
373
  declare const DialogCarouselContent: React$1.ForwardRefExoticComponent<Omit<SheetPrimitive.DialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
364
374
  hideCloseButton?: boolean | undefined;
package/dist/index.js CHANGED
@@ -1976,51 +1976,64 @@ var DialogOverlay = React14.forwardRef(({ className, ...props }, ref) => /* @__P
1976
1976
  ...props
1977
1977
  }
1978
1978
  ));
1979
- var DialogContent = React14.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React14.createElement(DialogOverlay, null), /* @__PURE__ */ React14.createElement(
1980
- DialogPrimitive.Content,
1981
- {
1982
- onPointerDownOutside: (e) => {
1983
- if (persist) {
1984
- e.preventDefault();
1985
- }
1986
- },
1987
- ref,
1988
- className: cn(
1989
- "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
1990
- className
1991
- ),
1979
+ var DialogContent = React14.forwardRef(
1980
+ ({
1981
+ ids,
1982
+ className,
1983
+ classNames,
1984
+ children,
1985
+ persist,
1986
+ hideCloseButton,
1992
1987
  ...props
1993
- },
1994
- children,
1995
- !hideCloseButton && /* @__PURE__ */ React14.createElement(
1996
- DialogPrimitive.Close,
1988
+ }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React14.createElement(DialogOverlay, { className: classNames == null ? void 0 : classNames.overlay, id: ids == null ? void 0 : ids.overlay }), /* @__PURE__ */ React14.createElement(
1989
+ DialogPrimitive.Content,
1997
1990
  {
1991
+ onPointerDownOutside: (e) => {
1992
+ if (persist) {
1993
+ e.preventDefault();
1994
+ }
1995
+ },
1996
+ ref,
1998
1997
  className: cn(
1999
- "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
2000
- props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
2001
- )
1998
+ "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-[90%] hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] hawa-rounded md:hawa-w-full",
1999
+ className
2000
+ ),
2001
+ ...props
2002
2002
  },
2003
- /* @__PURE__ */ React14.createElement(
2004
- "svg",
2003
+ children,
2004
+ !hideCloseButton && /* @__PURE__ */ React14.createElement(
2005
+ DialogPrimitive.Close,
2005
2006
  {
2006
- "aria-label": "Close Icon",
2007
- "aria-hidden": "true",
2008
- className: "hawa-h-5 hawa-w-5",
2009
- fill: "currentColor",
2010
- viewBox: "0 0 20 20"
2007
+ className: cn(
2008
+ "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
2009
+ props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4",
2010
+ classNames == null ? void 0 : classNames.closeButton
2011
+ ),
2012
+ id: ids == null ? void 0 : ids.closeButton
2011
2013
  },
2012
2014
  /* @__PURE__ */ React14.createElement(
2013
- "path",
2015
+ "svg",
2014
2016
  {
2015
- fillRule: "evenodd",
2016
- d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
2017
- clipRule: "evenodd"
2018
- }
2019
- )
2020
- ),
2021
- /* @__PURE__ */ React14.createElement("span", { className: "hawa-sr-only" }, "Close")
2022
- )
2023
- )));
2017
+ id: ids == null ? void 0 : ids.closeIcon,
2018
+ "aria-label": "Close Icon",
2019
+ "aria-hidden": "true",
2020
+ className: "hawa-h-5 hawa-w-5",
2021
+ fill: "currentColor",
2022
+ viewBox: "0 0 20 20"
2023
+ },
2024
+ /* @__PURE__ */ React14.createElement(
2025
+ "path",
2026
+ {
2027
+ fillRule: "evenodd",
2028
+ d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
2029
+ clipRule: "evenodd"
2030
+ }
2031
+ )
2032
+ ),
2033
+ /* @__PURE__ */ React14.createElement("span", { className: "hawa-sr-only" }, "Close")
2034
+ )
2035
+ ))
2036
+ );
2024
2037
  var DialogCarouselContent = React14.forwardRef(
2025
2038
  ({
2026
2039
  className,