@sikka/hawa 0.41.0-next → 0.41.1-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.
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs.map +1 -1
- package/dist/alert/index.js +1 -1
- package/dist/alert/index.js.map +1 -1
- package/dist/alert/index.mjs +1 -1
- package/dist/alert/index.mjs.map +1 -1
- package/dist/appLayout/index.js +15 -15
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +15 -15
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/appMenubar/index.js.map +1 -1
- package/dist/appMenubar/index.mjs.map +1 -1
- package/dist/appTabs/index.js +2 -2
- package/dist/appTabs/index.js.map +1 -1
- package/dist/appTabs/index.mjs +2 -2
- package/dist/appTabs/index.mjs.map +1 -1
- package/dist/appTopbar/index.js +5 -5
- package/dist/appTopbar/index.js.map +1 -1
- package/dist/appTopbar/index.mjs +5 -5
- package/dist/appTopbar/index.mjs.map +1 -1
- package/dist/avatar/index.js +1 -1
- package/dist/avatar/index.js.map +1 -1
- package/dist/avatar/index.mjs +1 -1
- package/dist/avatar/index.mjs.map +1 -1
- package/dist/backToTop/index.js +1 -1
- package/dist/backToTop/index.js.map +1 -1
- package/dist/backToTop/index.mjs +1 -1
- package/dist/backToTop/index.mjs.map +1 -1
- package/dist/badge/index.d.mts +1 -1
- package/dist/badge/index.d.ts +1 -1
- package/dist/badge/index.js +1 -1
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +1 -1
- package/dist/badge/index.mjs.map +1 -1
- package/dist/blocks/auth/index.js +15 -15
- package/dist/blocks/auth/index.mjs +13 -13
- package/dist/blocks/feedback/index.js +19 -19
- package/dist/blocks/feedback/index.mjs +17 -17
- package/dist/blocks/index.js +62 -62
- package/dist/blocks/index.mjs +46 -46
- package/dist/blocks/misc/index.js +17 -19
- package/dist/blocks/misc/index.mjs +11 -11
- package/dist/blocks/pricing/index.js +23 -23
- package/dist/blocks/pricing/index.mjs +21 -21
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs.map +1 -1
- package/dist/calendar/index.js.map +1 -1
- package/dist/calendar/index.mjs.map +1 -1
- package/dist/card/index.js +1 -1
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +1 -1
- package/dist/card/index.mjs.map +1 -1
- package/dist/carousel/index.d.mts +1 -1
- package/dist/carousel/index.d.ts +1 -1
- package/dist/carousel/index.js +7 -7
- package/dist/carousel/index.js.map +1 -1
- package/dist/carousel/index.mjs +7 -7
- package/dist/carousel/index.mjs.map +1 -1
- package/dist/{chunk-IS73LH5Y.mjs → chunk-2GEXJLRC.mjs} +1 -1
- package/dist/{chunk-FJXDCBMQ.mjs → chunk-7R25FOBM.mjs} +15 -15
- package/dist/{chunk-4ZELUQQ7.mjs → chunk-CQYG77SY.mjs} +1 -1
- package/dist/{chunk-NSMJTT6Y.mjs → chunk-D7HDVJFT.mjs} +3 -3
- package/dist/{chunk-ZSX2KZ2D.mjs → chunk-EBZECS2Z.mjs} +4 -4
- package/dist/{chunk-FK2C6C3B.mjs → chunk-FLMCWOQQ.mjs} +1 -1
- package/dist/{chunk-JGP3PSJL.mjs → chunk-FP6763YO.mjs} +4 -4
- package/dist/{chunk-UHUOBAEP.mjs → chunk-I3AK6DXN.mjs} +3 -3
- package/dist/{chunk-F6SLF6DS.mjs → chunk-K5S7P5ZO.mjs} +4 -4
- package/dist/{chunk-55TPME67.mjs → chunk-QNLA5TSV.mjs} +2 -2
- package/dist/codeBlock/index.js +5 -5
- package/dist/codeBlock/index.js.map +1 -1
- package/dist/codeBlock/index.mjs +5 -5
- package/dist/codeBlock/index.mjs.map +1 -1
- package/dist/colorPicker/index.js.map +1 -1
- package/dist/colorPicker/index.mjs.map +1 -1
- package/dist/combobox/index.js +7 -7
- package/dist/combobox/index.js.map +1 -1
- package/dist/combobox/index.mjs +7 -7
- package/dist/combobox/index.mjs.map +1 -1
- package/dist/command/index.js +5 -5
- package/dist/command/index.js.map +1 -1
- package/dist/command/index.mjs +5 -5
- package/dist/command/index.mjs.map +1 -1
- package/dist/dataTable/index.js +6 -6
- package/dist/dataTable/index.js.map +1 -1
- package/dist/dataTable/index.mjs +6 -6
- package/dist/dataTable/index.mjs.map +1 -1
- package/dist/datePicker/index.js.map +1 -1
- package/dist/datePicker/index.mjs.map +1 -1
- package/dist/destroyableCard/index.js +1 -1
- package/dist/destroyableCard/index.js.map +1 -1
- package/dist/destroyableCard/index.mjs +1 -1
- package/dist/destroyableCard/index.mjs.map +1 -1
- package/dist/dialog/index.js +4 -4
- package/dist/dialog/index.js.map +1 -1
- package/dist/dialog/index.mjs +4 -4
- package/dist/dialog/index.mjs.map +1 -1
- package/dist/docsLayout/index.js +7 -9
- package/dist/docsLayout/index.js.map +1 -1
- package/dist/docsLayout/index.mjs +7 -9
- package/dist/docsLayout/index.mjs.map +1 -1
- package/dist/docsSidebar/index.js +1 -1
- package/dist/docsSidebar/index.js.map +1 -1
- package/dist/docsSidebar/index.mjs +1 -1
- package/dist/docsSidebar/index.mjs.map +1 -1
- package/dist/dropdownMenu/index.js +3 -3
- package/dist/dropdownMenu/index.js.map +1 -1
- package/dist/dropdownMenu/index.mjs +3 -3
- package/dist/dropdownMenu/index.mjs.map +1 -1
- package/dist/elements/index.d.mts +1 -1
- package/dist/elements/index.d.ts +1 -1
- package/dist/elements/index.js +54 -54
- package/dist/elements/index.mjs +39 -39
- package/dist/fileDropzone/index.js +5 -5
- package/dist/fileDropzone/index.js.map +1 -1
- package/dist/fileDropzone/index.mjs +5 -5
- package/dist/fileDropzone/index.mjs.map +1 -1
- package/dist/glow/index.js.map +1 -1
- package/dist/glow/index.mjs.map +1 -1
- package/dist/hooks/index.d.mts +1 -1
- package/dist/hooks/index.d.ts +1 -1
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +127 -127
- package/dist/index.mjs +127 -127
- package/dist/input/index.js +3 -3
- package/dist/input/index.js.map +1 -1
- package/dist/input/index.mjs +3 -3
- package/dist/input/index.mjs.map +1 -1
- package/dist/interfaceSettings/index.js +4 -4
- package/dist/interfaceSettings/index.js.map +1 -1
- package/dist/interfaceSettings/index.mjs +4 -4
- package/dist/interfaceSettings/index.mjs.map +1 -1
- package/dist/label/index.js.map +1 -1
- package/dist/label/index.mjs.map +1 -1
- package/dist/layout/index.js +34 -36
- package/dist/layout/index.mjs +31 -31
- package/dist/loading/index.js.map +1 -1
- package/dist/loading/index.mjs.map +1 -1
- package/dist/navbar/index.js +12 -12
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +12 -12
- package/dist/navbar/index.mjs.map +1 -1
- package/dist/navigationMenu/index.js +5 -5
- package/dist/navigationMenu/index.js.map +1 -1
- package/dist/navigationMenu/index.mjs +5 -5
- package/dist/navigationMenu/index.mjs.map +1 -1
- package/dist/pagination/index.js.map +1 -1
- package/dist/pagination/index.mjs.map +1 -1
- package/dist/passwordInput/index.js +3 -3
- package/dist/passwordInput/index.js.map +1 -1
- package/dist/passwordInput/index.mjs +3 -3
- package/dist/passwordInput/index.mjs.map +1 -1
- package/dist/phoneInput/index.js +4 -4
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +4 -4
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/progress/index.js.map +1 -1
- package/dist/progress/index.mjs.map +1 -1
- package/dist/progressCircle/index.js +1 -1
- package/dist/progressCircle/index.js.map +1 -1
- package/dist/progressCircle/index.mjs +1 -1
- package/dist/progressCircle/index.mjs.map +1 -1
- package/dist/radio/index.js +3 -3
- package/dist/radio/index.js.map +1 -1
- package/dist/radio/index.mjs +3 -3
- package/dist/radio/index.mjs.map +1 -1
- package/dist/scrollArea/index.js +2 -2
- package/dist/scrollArea/index.js.map +1 -1
- package/dist/scrollArea/index.mjs +2 -2
- package/dist/scrollArea/index.mjs.map +1 -1
- package/dist/scrollIndicator/index.js.map +1 -1
- package/dist/scrollIndicator/index.mjs.map +1 -1
- package/dist/select/index.js +2 -2
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +2 -2
- package/dist/select/index.mjs.map +1 -1
- package/dist/separator/index.js.map +1 -1
- package/dist/separator/index.mjs.map +1 -1
- package/dist/sheet/index.js +1 -1
- package/dist/sheet/index.js.map +1 -1
- package/dist/sheet/index.mjs +1 -1
- package/dist/sheet/index.mjs.map +1 -1
- package/dist/sidebar/index.js +5 -5
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +5 -5
- package/dist/sidebar/index.mjs.map +1 -1
- package/dist/signature/index.js.map +1 -1
- package/dist/signature/index.mjs.map +1 -1
- package/dist/simpleTable/index.js +1 -1
- package/dist/simpleTable/index.js.map +1 -1
- package/dist/simpleTable/index.mjs +1 -1
- package/dist/simpleTable/index.mjs.map +1 -1
- package/dist/slider/index.js.map +1 -1
- package/dist/slider/index.mjs.map +1 -1
- package/dist/sortButton/index.js.map +1 -1
- package/dist/sortButton/index.mjs.map +1 -1
- package/dist/splitButton/index.d.mts +27 -27
- package/dist/splitButton/index.d.ts +27 -27
- package/dist/splitButton/index.js +750 -750
- package/dist/splitButton/index.js.map +1 -1
- package/dist/splitButton/index.mjs +752 -752
- package/dist/splitButton/index.mjs.map +1 -1
- package/dist/stats/index.js +3 -5
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs +3 -5
- package/dist/stats/index.mjs.map +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/switch/index.js.map +1 -1
- package/dist/switch/index.mjs +1 -1
- package/dist/switch/index.mjs.map +1 -1
- package/dist/tabs/index.js +2 -2
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +2 -2
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/textarea/index.js +1 -1
- package/dist/textarea/index.js.map +1 -1
- package/dist/textarea/index.mjs +1 -1
- package/dist/textarea/index.mjs.map +1 -1
- package/dist/toaster/index.js +1 -1
- package/dist/toaster/index.js.map +1 -1
- package/dist/toaster/index.mjs +1 -1
- package/dist/toaster/index.mjs.map +1 -1
- package/dist/tooltip/index.js.map +1 -1
- package/dist/tooltip/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/card/index.mjs
CHANGED
package/dist/card/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/card/Card.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(className, !asContainer && variantStyles[variant])}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold
|
1
|
+
{"version":3,"sources":["../../elements/card/Card.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(className, !asContainer && variantStyles[variant])}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\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":";;;AAAA,YAAY,WAAW;;;ACAvB,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADUA,IAAM,OAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,GAAG;AAAA,EACL,GACA,QACG;AACH,QAAI,gBAAgB;AAAA,MAClB,SAAS;AAAA,QACP;AAAA,QACA,aACE;AAAA,MACJ;AAAA,MACA,cAAc;AAAA,QACZ;AAAA;AAAA,QAEA,aACE;AAAA,MACJ;AAAA,IACF;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,WAAW,CAAC,eAAe,cAAc,OAAO,CAAC;AAAA,QAC9D,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAKA,IAAM,aAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB,oCAAC,SAAI,WAAU,kDACb;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN,GACC,MAAM,WAAW,oCAAC,SAAI,WAAU,cAAY,MAAM,OAAQ,CAC7D;AAEJ;AACA,IAAM,YAAkB,iBAGtB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW,GAAG,oCAAoC,SAAS;AAAA,IAC1D,GAAG;AAAA;AACN,CACD;AACD,IAAM,kBAAwB,iBAG5B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW,GAAG,2CAA2C,SAAS;AAAA,IACjE,GAAG;AAAA;AACN,CACD;AACD,IAAM,cAAoB;AAAA,EACxB,CAAC,EAAE,UAAU,WAAW,WAAW,GAAG,MAAM,GAAG,QAC7C;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,YAAY,aAAa;AAAA,QACzB,WAAW,cAAc;AAAA,QACzB;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AACA,IAAM,aAAmB,iBAGvB,CAAC,EAAE,WAAW,WAAW,GAAG,MAAM,GAAG,QACrC;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT,YAAY,aAAa;AAAA,MACzB;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AAED,gBAAgB,cAAc;AAC9B,YAAY,cAAc;AAC1B,WAAW,cAAc;AACzB,WAAW,cAAc;AACzB,UAAU,cAAc;AACxB,KAAK,cAAc;","names":[]}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import React__default from 'react';
|
2
|
-
import { D as DirectionType } from '../commonTypes-D23Z4zYt.mjs';
|
3
2
|
import { EmblaOptionsType } from 'embla-carousel';
|
3
|
+
import { D as DirectionType } from '../commonTypes-D23Z4zYt.mjs';
|
4
4
|
|
5
5
|
type CarouselProps = {
|
6
6
|
items: React__default.ReactNode[];
|
package/dist/carousel/index.d.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import React__default from 'react';
|
2
|
-
import { D as DirectionType } from '../commonTypes-D23Z4zYt.js';
|
3
2
|
import { EmblaOptionsType } from 'embla-carousel';
|
3
|
+
import { D as DirectionType } from '../commonTypes-D23Z4zYt.js';
|
4
4
|
|
5
5
|
type CarouselProps = {
|
6
6
|
items: React__default.ReactNode[];
|
package/dist/carousel/index.js
CHANGED
@@ -87,11 +87,11 @@ var Carousel = ({
|
|
87
87
|
const length = import_react.default.Children.count(items);
|
88
88
|
const canScrollNext = !!(emblaApi == null ? void 0 : emblaApi.canScrollNext());
|
89
89
|
const canScrollPrev = !!(emblaApi == null ? void 0 : emblaApi.canScrollPrev());
|
90
|
-
return /* @__PURE__ */ import_react.default.createElement("div", { className: "
|
90
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-relative hawa-h-full" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-h-full hawa-overflow-hidden" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-h-full", ref: emblaRef }, /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-h-full" }, items == null ? void 0 : items.map((item, i) => /* @__PURE__ */ import_react.default.createElement(
|
91
91
|
"div",
|
92
92
|
{
|
93
93
|
key: i,
|
94
|
-
className: "hawa-flex hawa-h-full hawa-min-w-0
|
94
|
+
className: "hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center"
|
95
95
|
},
|
96
96
|
item
|
97
97
|
))))), /* @__PURE__ */ import_react.default.createElement(
|
@@ -142,13 +142,13 @@ var Dots = ({
|
|
142
142
|
);
|
143
143
|
};
|
144
144
|
var CarouselControls = (props) => {
|
145
|
-
return /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2
|
145
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2" }, /* @__PURE__ */ import_react.default.createElement(
|
146
146
|
"button",
|
147
147
|
{
|
148
148
|
onClick: () => props.canScrollPrev && props.onPrev(),
|
149
149
|
disabled: !props.canScrollPrev,
|
150
150
|
className: cn(
|
151
|
-
"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white
|
151
|
+
"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white",
|
152
152
|
!props.canScrollPrev && "hawa-bg-primary/50",
|
153
153
|
props.canScrollPrev && "hawa-bg-primary"
|
154
154
|
)
|
@@ -160,7 +160,7 @@ var CarouselControls = (props) => {
|
|
160
160
|
stroke: "currentColor",
|
161
161
|
fill: "currentColor",
|
162
162
|
viewBox: "0 0 16 16",
|
163
|
-
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200
|
163
|
+
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200"
|
164
164
|
},
|
165
165
|
/* @__PURE__ */ import_react.default.createElement("path", { d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" })
|
166
166
|
)
|
@@ -170,7 +170,7 @@ var CarouselControls = (props) => {
|
|
170
170
|
onClick: () => props.canScrollNext && props.onNext(),
|
171
171
|
disabled: !props.canScrollNext,
|
172
172
|
className: cn(
|
173
|
-
"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white
|
173
|
+
"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white",
|
174
174
|
!props.canScrollNext && "hawa-bg-primary/50",
|
175
175
|
props.canScrollNext && "hawa-bg-primary"
|
176
176
|
)
|
@@ -182,7 +182,7 @@ var CarouselControls = (props) => {
|
|
182
182
|
stroke: "currentColor",
|
183
183
|
fill: "currentColor",
|
184
184
|
viewBox: "0 0 16 16",
|
185
|
-
className: "hawa-h-2 hawa-w-2
|
185
|
+
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200"
|
186
186
|
},
|
187
187
|
/* @__PURE__ */ import_react.default.createElement("path", { d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" })
|
188
188
|
)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/carousel/index.ts","../../elements/carousel/Carousel.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Carousel\";\n","import React, { useEffect, useState } from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n// import useEmblaCarousel, { EmblaOptionsType } from \"embla-carousel-react\";\nimport { cn } from \"@util/index\";\nimport { EmblaOptionsType } from \"embla-carousel\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\ntype CarouselProps = {\n items: React.ReactNode[];\n showArrows?: boolean;\n autoplay?: boolean;\n autoplayInterval?: number;\n options?: EmblaOptionsType;\n direction?: DirectionType;\n};\ntype DotsProps = {\n itemsLength: number;\n selectedIndex: number;\n direction: DirectionType;\n onDotClick: (index: number) => void;\n};\ntype ControlsProps = {\n canScrollPrev: boolean;\n canScrollNext: boolean;\n onPrev(): void;\n onNext(): void;\n};\n\nexport const Carousel: React.FC<CarouselProps> = ({\n items,\n showArrows,\n options,\n autoplay,\n direction = \"ltr\",\n autoplayInterval = 3000,\n ...props\n}) => {\n const [emblaRef, emblaApi] = useEmblaCarousel({\n ...options,\n direction,\n loop: autoplay ? true : options?.loop || false\n });\n const [selectedIndex, setSelectedIndex] = useState(0);\n\n useEffect(() => {\n function selectHandler() {\n const index = emblaApi?.selectedScrollSnap();\n setSelectedIndex(index || 0);\n }\n\n emblaApi?.on(\"select\", selectHandler);\n return () => {\n emblaApi?.off(\"select\", selectHandler);\n };\n }, [emblaApi]);\n\n useEffect(() => {\n let autoplayTimer: ReturnType<typeof setTimeout>;\n if (autoplay && emblaApi) {\n autoplayTimer = setInterval(() => {\n emblaApi.scrollNext();\n }, autoplayInterval);\n }\n\n return () => {\n if (autoplayTimer) clearInterval(autoplayTimer);\n };\n }, [emblaApi, autoplay, autoplayInterval]);\n\n const length = React.Children.count(items);\n const canScrollNext = !!emblaApi?.canScrollNext();\n const canScrollPrev = !!emblaApi?.canScrollPrev();\n return (\n <div className=\" hawa-relative hawa-h-full\">\n <div className=\"hawa-h-full hawa-overflow-hidden\">\n <div className=\"hawa-h-full\" ref={emblaRef}>\n <div className=\"hawa-flex hawa-h-full\">\n {items?.map((item: any, i: any) => (\n <div\n key={i}\n className=\"hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n >\n {item}\n </div>\n ))}\n </div>\n </div>\n </div>\n\n <Dots\n direction={direction}\n itemsLength={length}\n selectedIndex={selectedIndex}\n onDotClick={(index) => emblaApi?.scrollTo(index)}\n />\n\n {showArrows && (\n <CarouselControls\n canScrollNext={canScrollNext}\n canScrollPrev={canScrollPrev}\n onNext={() => emblaApi?.scrollNext()}\n onPrev={() => emblaApi?.scrollPrev()}\n />\n )}\n </div>\n );\n};\n\nconst Dots = ({\n onDotClick,\n itemsLength,\n selectedIndex,\n direction\n}: DotsProps) => {\n const arr = new Array(itemsLength).fill(0);\n return (\n <div\n dir={direction}\n className=\"hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1\"\n >\n {arr.map((_, index) => {\n const selected = index === selectedIndex;\n return (\n <div\n key={index}\n onClick={() => onDotClick(index)}\n className={cn(\n \"hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer\",\n !selected\n ? \"hawa-w-2 hawa-opacity-50\"\n : \"hawa-w-6 hawa-opacity-100\"\n )}\n ></div>\n );\n })}\n </div>\n );\n};\n\nconst CarouselControls = (props: ControlsProps) => {\n return (\n <div className=\"hawa-flex hawa-justify-end hawa-gap-2 \">\n <button\n onClick={() => props.canScrollPrev && props.onPrev()}\n disabled={!props.canScrollPrev}\n className={cn(\n \"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white \",\n !props.canScrollPrev && \"hawa-bg-primary/50\",\n props.canScrollPrev && \"hawa-bg-primary\"\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200 \"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n <button\n onClick={() => props.canScrollNext && props.onNext()}\n disabled={!props.canScrollNext}\n className={cn(\n \"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white \",\n !props.canScrollNext && \"hawa-bg-primary/50\",\n props.canScrollNext && \"hawa-bg-primary\"\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200 \"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n </div>\n );\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA2C;;;ACA3C,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADCA,kCAA6B;AAuBtB,IAAM,WAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,UAAU,QAAQ,QAAI,4BAAAA,SAAiB;AAAA,IAC5C,GAAG;AAAA,IACH;AAAA,IACA,MAAM,WAAW,QAAO,mCAAS,SAAQ;AAAA,EAC3C,CAAC;AACD,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,CAAC;AAEpD,8BAAU,MAAM;AACd,aAAS,gBAAgB;AACvB,YAAM,QAAQ,qCAAU;AACxB,uBAAiB,SAAS,CAAC;AAAA,IAC7B;AAEA,yCAAU,GAAG,UAAU;AACvB,WAAO,MAAM;AACX,2CAAU,IAAI,UAAU;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,8BAAU,MAAM;AACd,QAAI;AACJ,QAAI,YAAY,UAAU;AACxB,sBAAgB,YAAY,MAAM;AAChC,iBAAS,WAAW;AAAA,MACtB,GAAG,gBAAgB;AAAA,IACrB;AAEA,WAAO,MAAM;AACX,UAAI;AAAe,sBAAc,aAAa;AAAA,IAChD;AAAA,EACF,GAAG,CAAC,UAAU,UAAU,gBAAgB,CAAC;AAEzC,QAAM,SAAS,aAAAC,QAAM,SAAS,MAAM,KAAK;AACzC,QAAM,gBAAgB,CAAC,EAAC,qCAAU;AAClC,QAAM,gBAAgB,CAAC,EAAC,qCAAU;AAClC,SACE,6BAAAA,QAAA,cAAC,SAAI,WAAU,gCACb,6BAAAA,QAAA,cAAC,SAAI,WAAU,sCACb,6BAAAA,QAAA,cAAC,SAAI,WAAU,eAAc,KAAK,YAChC,6BAAAA,QAAA,cAAC,SAAI,WAAU,2BACZ,+BAAO,IAAI,CAAC,MAAW,MACtB,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAET;AAAA,EACH,EAEJ,CACF,CACF,GAEA,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA,YAAY,CAAC,UAAU,qCAAU,SAAS;AAAA;AAAA,EAC5C,GAEC,cACC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,MAAM,qCAAU;AAAA,MACxB,QAAQ,MAAM,qCAAU;AAAA;AAAA,EAC1B,CAEJ;AAEJ;AAEA,IAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiB;AACf,QAAM,MAAM,IAAI,MAAM,WAAW,EAAE,KAAK,CAAC;AACzC,SACE,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAET,IAAI,IAAI,CAAC,GAAG,UAAU;AACrB,YAAM,WAAW,UAAU;AAC3B,aACE,6BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,SAAS,MAAM,WAAW,KAAK;AAAA,UAC/B,WAAW;AAAA,YACT;AAAA,YACA,CAAC,WACG,6BACA;AAAA,UACN;AAAA;AAAA,MACD;AAAA,IAEL,CAAC;AAAA,EACH;AAEJ;AAEA,IAAM,mBAAmB,CAAC,UAAyB;AACjD,SACE,6BAAAA,QAAA,cAAC,SAAI,WAAU,4CACb,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM,MAAM,iBAAiB,MAAM,OAAO;AAAA,MACnD,UAAU,CAAC,MAAM;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA,CAAC,MAAM,iBAAiB;AAAA,QACxB,MAAM,iBAAiB;AAAA,MACzB;AAAA;AAAA,IAEA,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,cAAW;AAAA,QACX,QAAO;AAAA,QACP,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,WAAU;AAAA;AAAA,MAEV,6BAAAA,QAAA,cAAC,UAAK,GAAE,0HAAyH;AAAA,IACnI;AAAA,EACF,GACA,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM,MAAM,iBAAiB,MAAM,OAAO;AAAA,MACnD,UAAU,CAAC,MAAM;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA,CAAC,MAAM,iBAAiB;AAAA,QACxB,MAAM,iBAAiB;AAAA,MACzB;AAAA;AAAA,IAEA,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,cAAW;AAAA,QACX,QAAO;AAAA,QACP,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,WAAU;AAAA;AAAA,MAEV,6BAAAA,QAAA,cAAC,UAAK,GAAE,0HAAyH;AAAA,IACnI;AAAA,EACF,CACF;AAEJ;","names":["useEmblaCarousel","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/carousel/index.ts","../../elements/carousel/Carousel.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Carousel\";\n","import React, { useEffect, useState } from \"react\";\n\nimport { cn } from \"@util/index\";\nimport { EmblaOptionsType } from \"embla-carousel\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\ntype CarouselProps = {\n items: React.ReactNode[];\n showArrows?: boolean;\n autoplay?: boolean;\n autoplayInterval?: number;\n options?: EmblaOptionsType;\n direction?: DirectionType;\n};\ntype DotsProps = {\n itemsLength: number;\n selectedIndex: number;\n direction: DirectionType;\n onDotClick: (index: number) => void;\n};\ntype ControlsProps = {\n canScrollPrev: boolean;\n canScrollNext: boolean;\n onPrev(): void;\n onNext(): void;\n};\n\nexport const Carousel: React.FC<CarouselProps> = ({\n items,\n showArrows,\n options,\n autoplay,\n direction = \"ltr\",\n autoplayInterval = 3000,\n ...props\n}) => {\n const [emblaRef, emblaApi] = useEmblaCarousel({\n ...options,\n direction,\n loop: autoplay ? true : options?.loop || false,\n });\n const [selectedIndex, setSelectedIndex] = useState(0);\n\n useEffect(() => {\n function selectHandler() {\n const index = emblaApi?.selectedScrollSnap();\n setSelectedIndex(index || 0);\n }\n\n emblaApi?.on(\"select\", selectHandler);\n return () => {\n emblaApi?.off(\"select\", selectHandler);\n };\n }, [emblaApi]);\n\n useEffect(() => {\n let autoplayTimer: ReturnType<typeof setTimeout>;\n if (autoplay && emblaApi) {\n autoplayTimer = setInterval(() => {\n emblaApi.scrollNext();\n }, autoplayInterval);\n }\n\n return () => {\n if (autoplayTimer) clearInterval(autoplayTimer);\n };\n }, [emblaApi, autoplay, autoplayInterval]);\n\n const length = React.Children.count(items);\n const canScrollNext = !!emblaApi?.canScrollNext();\n const canScrollPrev = !!emblaApi?.canScrollPrev();\n return (\n <div className=\"hawa-relative hawa-h-full\">\n <div className=\"hawa-h-full hawa-overflow-hidden\">\n <div className=\"hawa-h-full\" ref={emblaRef}>\n <div className=\"hawa-flex hawa-h-full\">\n {items?.map((item: any, i: any) => (\n <div\n key={i}\n className=\"hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n >\n {item}\n </div>\n ))}\n </div>\n </div>\n </div>\n\n <Dots\n direction={direction}\n itemsLength={length}\n selectedIndex={selectedIndex}\n onDotClick={(index) => emblaApi?.scrollTo(index)}\n />\n\n {showArrows && (\n <CarouselControls\n canScrollNext={canScrollNext}\n canScrollPrev={canScrollPrev}\n onNext={() => emblaApi?.scrollNext()}\n onPrev={() => emblaApi?.scrollPrev()}\n />\n )}\n </div>\n );\n};\n\nconst Dots = ({\n onDotClick,\n itemsLength,\n selectedIndex,\n direction,\n}: DotsProps) => {\n const arr = new Array(itemsLength).fill(0);\n return (\n <div\n dir={direction}\n className=\"hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1\"\n >\n {arr.map((_, index) => {\n const selected = index === selectedIndex;\n return (\n <div\n key={index}\n onClick={() => onDotClick(index)}\n className={cn(\n \"hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer\",\n !selected\n ? \"hawa-w-2 hawa-opacity-50\"\n : \"hawa-w-6 hawa-opacity-100\",\n )}\n ></div>\n );\n })}\n </div>\n );\n};\n\nconst CarouselControls = (props: ControlsProps) => {\n return (\n <div className=\"hawa-flex hawa-justify-end hawa-gap-2\">\n <button\n onClick={() => props.canScrollPrev && props.onPrev()}\n disabled={!props.canScrollPrev}\n className={cn(\n \"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white\",\n !props.canScrollPrev && \"hawa-bg-primary/50\",\n props.canScrollPrev && \"hawa-bg-primary\",\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n <button\n onClick={() => props.canScrollNext && props.onNext()}\n disabled={!props.canScrollNext}\n className={cn(\n \"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white\",\n !props.canScrollNext && \"hawa-bg-primary/50\",\n props.canScrollNext && \"hawa-bg-primary\",\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n </div>\n );\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA2C;;;ACA3C,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADDA,kCAA6B;AAyBtB,IAAM,WAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,UAAU,QAAQ,QAAI,4BAAAA,SAAiB;AAAA,IAC5C,GAAG;AAAA,IACH;AAAA,IACA,MAAM,WAAW,QAAO,mCAAS,SAAQ;AAAA,EAC3C,CAAC;AACD,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,CAAC;AAEpD,8BAAU,MAAM;AACd,aAAS,gBAAgB;AACvB,YAAM,QAAQ,qCAAU;AACxB,uBAAiB,SAAS,CAAC;AAAA,IAC7B;AAEA,yCAAU,GAAG,UAAU;AACvB,WAAO,MAAM;AACX,2CAAU,IAAI,UAAU;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,8BAAU,MAAM;AACd,QAAI;AACJ,QAAI,YAAY,UAAU;AACxB,sBAAgB,YAAY,MAAM;AAChC,iBAAS,WAAW;AAAA,MACtB,GAAG,gBAAgB;AAAA,IACrB;AAEA,WAAO,MAAM;AACX,UAAI;AAAe,sBAAc,aAAa;AAAA,IAChD;AAAA,EACF,GAAG,CAAC,UAAU,UAAU,gBAAgB,CAAC;AAEzC,QAAM,SAAS,aAAAC,QAAM,SAAS,MAAM,KAAK;AACzC,QAAM,gBAAgB,CAAC,EAAC,qCAAU;AAClC,QAAM,gBAAgB,CAAC,EAAC,qCAAU;AAClC,SACE,6BAAAA,QAAA,cAAC,SAAI,WAAU,+BACb,6BAAAA,QAAA,cAAC,SAAI,WAAU,sCACb,6BAAAA,QAAA,cAAC,SAAI,WAAU,eAAc,KAAK,YAChC,6BAAAA,QAAA,cAAC,SAAI,WAAU,2BACZ,+BAAO,IAAI,CAAC,MAAW,MACtB,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAET;AAAA,EACH,EAEJ,CACF,CACF,GAEA,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA,YAAY,CAAC,UAAU,qCAAU,SAAS;AAAA;AAAA,EAC5C,GAEC,cACC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,MAAM,qCAAU;AAAA,MACxB,QAAQ,MAAM,qCAAU;AAAA;AAAA,EAC1B,CAEJ;AAEJ;AAEA,IAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiB;AACf,QAAM,MAAM,IAAI,MAAM,WAAW,EAAE,KAAK,CAAC;AACzC,SACE,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAET,IAAI,IAAI,CAAC,GAAG,UAAU;AACrB,YAAM,WAAW,UAAU;AAC3B,aACE,6BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,SAAS,MAAM,WAAW,KAAK;AAAA,UAC/B,WAAW;AAAA,YACT;AAAA,YACA,CAAC,WACG,6BACA;AAAA,UACN;AAAA;AAAA,MACD;AAAA,IAEL,CAAC;AAAA,EACH;AAEJ;AAEA,IAAM,mBAAmB,CAAC,UAAyB;AACjD,SACE,6BAAAA,QAAA,cAAC,SAAI,WAAU,2CACb,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM,MAAM,iBAAiB,MAAM,OAAO;AAAA,MACnD,UAAU,CAAC,MAAM;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA,CAAC,MAAM,iBAAiB;AAAA,QACxB,MAAM,iBAAiB;AAAA,MACzB;AAAA;AAAA,IAEA,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,cAAW;AAAA,QACX,QAAO;AAAA,QACP,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,WAAU;AAAA;AAAA,MAEV,6BAAAA,QAAA,cAAC,UAAK,GAAE,0HAAyH;AAAA,IACnI;AAAA,EACF,GACA,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM,MAAM,iBAAiB,MAAM,OAAO;AAAA,MACnD,UAAU,CAAC,MAAM;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA,CAAC,MAAM,iBAAiB;AAAA,QACxB,MAAM,iBAAiB;AAAA,MACzB;AAAA;AAAA,IAEA,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,cAAW;AAAA,QACX,QAAO;AAAA,QACP,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,WAAU;AAAA;AAAA,MAEV,6BAAAA,QAAA,cAAC,UAAK,GAAE,0HAAyH;AAAA,IACnI;AAAA,EACF,CACF;AAEJ;","names":["useEmblaCarousel","React"]}
|
package/dist/carousel/index.mjs
CHANGED
@@ -52,11 +52,11 @@ var Carousel = ({
|
|
52
52
|
const length = React.Children.count(items);
|
53
53
|
const canScrollNext = !!(emblaApi == null ? void 0 : emblaApi.canScrollNext());
|
54
54
|
const canScrollPrev = !!(emblaApi == null ? void 0 : emblaApi.canScrollPrev());
|
55
|
-
return /* @__PURE__ */ React.createElement("div", { className: "
|
55
|
+
return /* @__PURE__ */ React.createElement("div", { className: "hawa-relative hawa-h-full" }, /* @__PURE__ */ React.createElement("div", { className: "hawa-h-full hawa-overflow-hidden" }, /* @__PURE__ */ React.createElement("div", { className: "hawa-h-full", ref: emblaRef }, /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-h-full" }, items == null ? void 0 : items.map((item, i) => /* @__PURE__ */ React.createElement(
|
56
56
|
"div",
|
57
57
|
{
|
58
58
|
key: i,
|
59
|
-
className: "hawa-flex hawa-h-full hawa-min-w-0
|
59
|
+
className: "hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center"
|
60
60
|
},
|
61
61
|
item
|
62
62
|
))))), /* @__PURE__ */ React.createElement(
|
@@ -107,13 +107,13 @@ var Dots = ({
|
|
107
107
|
);
|
108
108
|
};
|
109
109
|
var CarouselControls = (props) => {
|
110
|
-
return /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2
|
110
|
+
return /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2" }, /* @__PURE__ */ React.createElement(
|
111
111
|
"button",
|
112
112
|
{
|
113
113
|
onClick: () => props.canScrollPrev && props.onPrev(),
|
114
114
|
disabled: !props.canScrollPrev,
|
115
115
|
className: cn(
|
116
|
-
"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white
|
116
|
+
"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white",
|
117
117
|
!props.canScrollPrev && "hawa-bg-primary/50",
|
118
118
|
props.canScrollPrev && "hawa-bg-primary"
|
119
119
|
)
|
@@ -125,7 +125,7 @@ var CarouselControls = (props) => {
|
|
125
125
|
stroke: "currentColor",
|
126
126
|
fill: "currentColor",
|
127
127
|
viewBox: "0 0 16 16",
|
128
|
-
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200
|
128
|
+
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200"
|
129
129
|
},
|
130
130
|
/* @__PURE__ */ React.createElement("path", { d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" })
|
131
131
|
)
|
@@ -135,7 +135,7 @@ var CarouselControls = (props) => {
|
|
135
135
|
onClick: () => props.canScrollNext && props.onNext(),
|
136
136
|
disabled: !props.canScrollNext,
|
137
137
|
className: cn(
|
138
|
-
"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white
|
138
|
+
"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white",
|
139
139
|
!props.canScrollNext && "hawa-bg-primary/50",
|
140
140
|
props.canScrollNext && "hawa-bg-primary"
|
141
141
|
)
|
@@ -147,7 +147,7 @@ var CarouselControls = (props) => {
|
|
147
147
|
stroke: "currentColor",
|
148
148
|
fill: "currentColor",
|
149
149
|
viewBox: "0 0 16 16",
|
150
|
-
className: "hawa-h-2 hawa-w-2
|
150
|
+
className: "hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200"
|
151
151
|
},
|
152
152
|
/* @__PURE__ */ React.createElement("path", { d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" })
|
153
153
|
)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/carousel/Carousel.tsx","../../util/index.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n// import useEmblaCarousel, { EmblaOptionsType } from \"embla-carousel-react\";\nimport { cn } from \"@util/index\";\nimport { EmblaOptionsType } from \"embla-carousel\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\ntype CarouselProps = {\n items: React.ReactNode[];\n showArrows?: boolean;\n autoplay?: boolean;\n autoplayInterval?: number;\n options?: EmblaOptionsType;\n direction?: DirectionType;\n};\ntype DotsProps = {\n itemsLength: number;\n selectedIndex: number;\n direction: DirectionType;\n onDotClick: (index: number) => void;\n};\ntype ControlsProps = {\n canScrollPrev: boolean;\n canScrollNext: boolean;\n onPrev(): void;\n onNext(): void;\n};\n\nexport const Carousel: React.FC<CarouselProps> = ({\n items,\n showArrows,\n options,\n autoplay,\n direction = \"ltr\",\n autoplayInterval = 3000,\n ...props\n}) => {\n const [emblaRef, emblaApi] = useEmblaCarousel({\n ...options,\n direction,\n loop: autoplay ? true : options?.loop || false\n });\n const [selectedIndex, setSelectedIndex] = useState(0);\n\n useEffect(() => {\n function selectHandler() {\n const index = emblaApi?.selectedScrollSnap();\n setSelectedIndex(index || 0);\n }\n\n emblaApi?.on(\"select\", selectHandler);\n return () => {\n emblaApi?.off(\"select\", selectHandler);\n };\n }, [emblaApi]);\n\n useEffect(() => {\n let autoplayTimer: ReturnType<typeof setTimeout>;\n if (autoplay && emblaApi) {\n autoplayTimer = setInterval(() => {\n emblaApi.scrollNext();\n }, autoplayInterval);\n }\n\n return () => {\n if (autoplayTimer) clearInterval(autoplayTimer);\n };\n }, [emblaApi, autoplay, autoplayInterval]);\n\n const length = React.Children.count(items);\n const canScrollNext = !!emblaApi?.canScrollNext();\n const canScrollPrev = !!emblaApi?.canScrollPrev();\n return (\n <div className=\" hawa-relative hawa-h-full\">\n <div className=\"hawa-h-full hawa-overflow-hidden\">\n <div className=\"hawa-h-full\" ref={emblaRef}>\n <div className=\"hawa-flex hawa-h-full\">\n {items?.map((item: any, i: any) => (\n <div\n key={i}\n className=\"hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n >\n {item}\n </div>\n ))}\n </div>\n </div>\n </div>\n\n <Dots\n direction={direction}\n itemsLength={length}\n selectedIndex={selectedIndex}\n onDotClick={(index) => emblaApi?.scrollTo(index)}\n />\n\n {showArrows && (\n <CarouselControls\n canScrollNext={canScrollNext}\n canScrollPrev={canScrollPrev}\n onNext={() => emblaApi?.scrollNext()}\n onPrev={() => emblaApi?.scrollPrev()}\n />\n )}\n </div>\n );\n};\n\nconst Dots = ({\n onDotClick,\n itemsLength,\n selectedIndex,\n direction\n}: DotsProps) => {\n const arr = new Array(itemsLength).fill(0);\n return (\n <div\n dir={direction}\n className=\"hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1\"\n >\n {arr.map((_, index) => {\n const selected = index === selectedIndex;\n return (\n <div\n key={index}\n onClick={() => onDotClick(index)}\n className={cn(\n \"hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer\",\n !selected\n ? \"hawa-w-2 hawa-opacity-50\"\n : \"hawa-w-6 hawa-opacity-100\"\n )}\n ></div>\n );\n })}\n </div>\n );\n};\n\nconst CarouselControls = (props: ControlsProps) => {\n return (\n <div className=\"hawa-flex hawa-justify-end hawa-gap-2 \">\n <button\n onClick={() => props.canScrollPrev && props.onPrev()}\n disabled={!props.canScrollPrev}\n className={cn(\n \"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white \",\n !props.canScrollPrev && \"hawa-bg-primary/50\",\n props.canScrollPrev && \"hawa-bg-primary\"\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200 \"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n <button\n onClick={() => props.canScrollNext && props.onNext()}\n disabled={!props.canScrollNext}\n className={cn(\n \"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white \",\n !props.canScrollNext && \"hawa-bg-primary/50\",\n props.canScrollNext && \"hawa-bg-primary\"\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200 \"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n </div>\n );\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/carousel/Carousel.tsx","../../util/index.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { cn } from \"@util/index\";\nimport { EmblaOptionsType } from \"embla-carousel\";\nimport useEmblaCarousel from \"embla-carousel-react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\ntype CarouselProps = {\n items: React.ReactNode[];\n showArrows?: boolean;\n autoplay?: boolean;\n autoplayInterval?: number;\n options?: EmblaOptionsType;\n direction?: DirectionType;\n};\ntype DotsProps = {\n itemsLength: number;\n selectedIndex: number;\n direction: DirectionType;\n onDotClick: (index: number) => void;\n};\ntype ControlsProps = {\n canScrollPrev: boolean;\n canScrollNext: boolean;\n onPrev(): void;\n onNext(): void;\n};\n\nexport const Carousel: React.FC<CarouselProps> = ({\n items,\n showArrows,\n options,\n autoplay,\n direction = \"ltr\",\n autoplayInterval = 3000,\n ...props\n}) => {\n const [emblaRef, emblaApi] = useEmblaCarousel({\n ...options,\n direction,\n loop: autoplay ? true : options?.loop || false,\n });\n const [selectedIndex, setSelectedIndex] = useState(0);\n\n useEffect(() => {\n function selectHandler() {\n const index = emblaApi?.selectedScrollSnap();\n setSelectedIndex(index || 0);\n }\n\n emblaApi?.on(\"select\", selectHandler);\n return () => {\n emblaApi?.off(\"select\", selectHandler);\n };\n }, [emblaApi]);\n\n useEffect(() => {\n let autoplayTimer: ReturnType<typeof setTimeout>;\n if (autoplay && emblaApi) {\n autoplayTimer = setInterval(() => {\n emblaApi.scrollNext();\n }, autoplayInterval);\n }\n\n return () => {\n if (autoplayTimer) clearInterval(autoplayTimer);\n };\n }, [emblaApi, autoplay, autoplayInterval]);\n\n const length = React.Children.count(items);\n const canScrollNext = !!emblaApi?.canScrollNext();\n const canScrollPrev = !!emblaApi?.canScrollPrev();\n return (\n <div className=\"hawa-relative hawa-h-full\">\n <div className=\"hawa-h-full hawa-overflow-hidden\">\n <div className=\"hawa-h-full\" ref={emblaRef}>\n <div className=\"hawa-flex hawa-h-full\">\n {items?.map((item: any, i: any) => (\n <div\n key={i}\n className=\"hawa-flex hawa-h-full hawa-min-w-0 hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n >\n {item}\n </div>\n ))}\n </div>\n </div>\n </div>\n\n <Dots\n direction={direction}\n itemsLength={length}\n selectedIndex={selectedIndex}\n onDotClick={(index) => emblaApi?.scrollTo(index)}\n />\n\n {showArrows && (\n <CarouselControls\n canScrollNext={canScrollNext}\n canScrollPrev={canScrollPrev}\n onNext={() => emblaApi?.scrollNext()}\n onPrev={() => emblaApi?.scrollPrev()}\n />\n )}\n </div>\n );\n};\n\nconst Dots = ({\n onDotClick,\n itemsLength,\n selectedIndex,\n direction,\n}: DotsProps) => {\n const arr = new Array(itemsLength).fill(0);\n return (\n <div\n dir={direction}\n className=\"hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1\"\n >\n {arr.map((_, index) => {\n const selected = index === selectedIndex;\n return (\n <div\n key={index}\n onClick={() => onDotClick(index)}\n className={cn(\n \"hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer\",\n !selected\n ? \"hawa-w-2 hawa-opacity-50\"\n : \"hawa-w-6 hawa-opacity-100\",\n )}\n ></div>\n );\n })}\n </div>\n );\n};\n\nconst CarouselControls = (props: ControlsProps) => {\n return (\n <div className=\"hawa-flex hawa-justify-end hawa-gap-2\">\n <button\n onClick={() => props.canScrollPrev && props.onPrev()}\n disabled={!props.canScrollPrev}\n className={cn(\n \"hawa-absolute hawa-start-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white\",\n !props.canScrollPrev && \"hawa-bg-primary/50\",\n props.canScrollPrev && \"hawa-bg-primary\",\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-rotate-180 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n <button\n onClick={() => props.canScrollNext && props.onNext()}\n disabled={!props.canScrollNext}\n className={cn(\n \"hawa-absolute hawa-end-0 hawa-top-1/2 -hawa-translate-y-2 hawa-rounded-full hawa-p-2 hawa-text-white\",\n !props.canScrollNext && \"hawa-bg-primary/50\",\n props.canScrollNext && \"hawa-bg-primary\",\n )}\n >\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n className=\"hawa-h-2 hawa-w-2 hawa-shrink-0 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n </button>\n </div>\n );\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":[]}
|
@@ -9,7 +9,7 @@ import {
|
|
9
9
|
Label,
|
10
10
|
Skeleton,
|
11
11
|
cn
|
12
|
-
} from "./chunk-
|
12
|
+
} from "./chunk-FP6763YO.mjs";
|
13
13
|
|
14
14
|
// elements/alert/Alert.tsx
|
15
15
|
import React, { useRef, useState, useEffect } from "react";
|
@@ -112,7 +112,7 @@ var Alert = ({
|
|
112
112
|
"data-dismiss-target": "#alert-default",
|
113
113
|
"aria-label": "Close",
|
114
114
|
className: cn(
|
115
|
-
"hawa-absolute
|
115
|
+
"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-9 hawa-w-9 hawa-items-center hawa-justify-center hawa-rounded-inner hawa-p-1.5 hawa-transition-all hover:hawa-text-gray-900",
|
116
116
|
closeButtonStyle[severity],
|
117
117
|
direction === "rtl" ? "hawa-left-2" : "hawa-right-2"
|
118
118
|
),
|
@@ -213,7 +213,7 @@ var Input = forwardRef(
|
|
213
213
|
)
|
214
214
|
},
|
215
215
|
props.label && /* @__PURE__ */ React2.createElement(Label, { ...labelProps }, props.label),
|
216
|
-
/* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center
|
216
|
+
/* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center" }, props.outsidePrefix && /* @__PURE__ */ React2.createElement(
|
217
217
|
"span",
|
218
218
|
{
|
219
219
|
className: cn(
|
@@ -279,7 +279,7 @@ var Input = forwardRef(
|
|
279
279
|
...inputProps,
|
280
280
|
className: cn(
|
281
281
|
defaultInputStyle,
|
282
|
-
"
|
282
|
+
"focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 dark:hawa-text-white",
|
283
283
|
{
|
284
284
|
"hawa-pe-9": props.endIcon,
|
285
285
|
"hawa-ps-9": props.startIcon,
|
@@ -293,7 +293,7 @@ var Input = forwardRef(
|
|
293
293
|
"div",
|
294
294
|
{
|
295
295
|
className: cn(
|
296
|
-
"hawa-absolute hawa-end-0 hawa-top-[47px] hawa-z-20 hawa-translate-y-1/2 hawa-rounded hawa-bg-background hawa-text-start
|
296
|
+
"hawa-absolute hawa-end-0 hawa-top-[47px] hawa-z-20 hawa-translate-y-1/2 hawa-rounded hawa-bg-background hawa-text-start hawa-text-xs hawa-text-helper-color hawa-drop-shadow-md hawa-transition-all",
|
297
297
|
props.helperText ? "hawa-border hawa-p-1" : "hawa-border-none hawa-p-0"
|
298
298
|
)
|
299
299
|
},
|
@@ -371,9 +371,9 @@ var Select = ({
|
|
371
371
|
"div",
|
372
372
|
{
|
373
373
|
className: cn(
|
374
|
-
"dark:dark-shadow
|
374
|
+
"dark:dark-shadow hawa-absolute hawa-z-10 -hawa-mx-1 hawa-mt-1 hawa-flex hawa-flex-col hawa-justify-start hawa-rounded hawa-border hawa-bg-background hawa-shadow-md",
|
375
375
|
props.phoneCode ? "hawa-p-1.5" : "hawa-w-full hawa-p-1.5",
|
376
|
-
menuOpen && "hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95
|
376
|
+
menuOpen && "hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95"
|
377
377
|
),
|
378
378
|
ref: innerRef,
|
379
379
|
...innerProps
|
@@ -2228,7 +2228,7 @@ var PhoneInput = ({
|
|
2228
2228
|
value: countryCode == null ? void 0 : countryCode.label,
|
2229
2229
|
defaultValue: props.preferredCountry
|
2230
2230
|
}
|
2231
|
-
), /* @__PURE__ */ React4.createElement("div", { className: "hawa-relative hawa-flex hawa-h-fit hawa-w-full
|
2231
|
+
), /* @__PURE__ */ React4.createElement("div", { className: "hawa-relative hawa-flex hawa-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0" }, /* @__PURE__ */ React4.createElement(
|
2232
2232
|
"input",
|
2233
2233
|
{
|
2234
2234
|
type: "tel",
|
@@ -2238,7 +2238,7 @@ var PhoneInput = ({
|
|
2238
2238
|
onChange: handleInputChange,
|
2239
2239
|
placeholder: props.placeholder,
|
2240
2240
|
className: cn(
|
2241
|
-
"placeholder:hawa-text-muted-foreground hawa-block hawa-h-[40px] hawa-w-full hawa-rounded hawa-rounded-l-none hawa-border hawa-border-l-0 hawa-border-l-transparent
|
2241
|
+
"placeholder:hawa-text-muted-foreground hawa-block hawa-h-[40px] hawa-w-full hawa-rounded hawa-rounded-l-none hawa-border hawa-border-l-0 hawa-border-l-transparent hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all"
|
2242
2242
|
),
|
2243
2243
|
...inputProps
|
2244
2244
|
}
|
@@ -2813,11 +2813,11 @@ var Radio = forwardRef7(
|
|
2813
2813
|
{
|
2814
2814
|
htmlFor: opt.value.toString(),
|
2815
2815
|
className: cn(
|
2816
|
-
"hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all
|
2816
|
+
"hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all hawa-items-center hawa-justify-between hawa-rounded-lg hawa-border hawa-border-foreground/10 hawa-bg-background hawa-p-5 hawa-text-gray-500 peer-checked:hawa-border-primary peer-checked:hawa-text-primary dark:hawa-border-foreground/10 dark:hawa-bg-foreground/5 dark:hawa-text-gray-400 dark:peer-checked:hawa-text-primary",
|
2817
2817
|
opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hover:hawa-bg-foreground/10 hover:hawa-text-gray-600 dark:hover:hawa-bg-foreground/20 dark:hover:hawa-text-gray-300"
|
2818
2818
|
)
|
2819
2819
|
},
|
2820
|
-
/* @__PURE__ */ React9.createElement("div", { className: "hawa-block
|
2820
|
+
/* @__PURE__ */ React9.createElement("div", { className: "hawa-block hawa-h-full hawa-w-full" }, /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full hawa-text-lg hawa-font-semibold" }, opt.label), /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full" }, opt.sublabel))
|
2821
2821
|
)))
|
2822
2822
|
);
|
2823
2823
|
default:
|
@@ -2855,7 +2855,7 @@ var Radio = forwardRef7(
|
|
2855
2855
|
{
|
2856
2856
|
htmlFor: opt.value.toString(),
|
2857
2857
|
className: cn(
|
2858
|
-
"hawa-text-sm hawa-font-medium
|
2858
|
+
"hawa-text-sm hawa-font-medium dark:hawa-text-white",
|
2859
2859
|
opt.disabled ? "hawa-text-gray-400" : "hawa-cursor-pointer hawa-text-gray-900"
|
2860
2860
|
)
|
2861
2861
|
},
|
@@ -2905,7 +2905,7 @@ var Textarea = React10.forwardRef(
|
|
2905
2905
|
{
|
2906
2906
|
...textareaProps,
|
2907
2907
|
className: cn(
|
2908
|
-
"hawa-flex hawa-min-h-[40px] hawa-h-[40px]
|
2908
|
+
"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
|
2909
2909
|
classNames == null ? void 0 : classNames.textarea
|
2910
2910
|
),
|
2911
2911
|
ref
|
@@ -2987,7 +2987,7 @@ var ScrollArea = React11.forwardRef(({ className, children, orientation = "verti
|
|
2987
2987
|
"div",
|
2988
2988
|
{
|
2989
2989
|
className: cn(
|
2990
|
-
"hawa-pointer-events-none hawa-absolute hawa-bg-background
|
2990
|
+
"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",
|
2991
2991
|
showLeftFade ? "hawa-block" : "hawa-hidden"
|
2992
2992
|
)
|
2993
2993
|
}
|
@@ -2996,7 +2996,7 @@ var ScrollArea = React11.forwardRef(({ className, children, orientation = "verti
|
|
2996
2996
|
"div",
|
2997
2997
|
{
|
2998
2998
|
className: cn(
|
2999
|
-
"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
|
2999
|
+
"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",
|
3000
3000
|
showRightFade ? "hawa-block" : "hawa-hidden"
|
3001
3001
|
)
|
3002
3002
|
}
|
@@ -4,7 +4,7 @@ import {
|
|
4
4
|
Label,
|
5
5
|
Skeleton,
|
6
6
|
cn
|
7
|
-
} from "./chunk-
|
7
|
+
} from "./chunk-FLMCWOQQ.mjs";
|
8
8
|
|
9
9
|
// elements/select/Select.tsx
|
10
10
|
import React from "react";
|
@@ -59,9 +59,9 @@ var Select = ({
|
|
59
59
|
"div",
|
60
60
|
{
|
61
61
|
className: cn(
|
62
|
-
"dark:dark-shadow
|
62
|
+
"dark:dark-shadow hawa-absolute hawa-z-10 -hawa-mx-1 hawa-mt-1 hawa-flex hawa-flex-col hawa-justify-start hawa-rounded hawa-border hawa-bg-background hawa-shadow-md",
|
63
63
|
props.phoneCode ? "hawa-p-1.5" : "hawa-w-full hawa-p-1.5",
|
64
|
-
menuOpen && "hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95
|
64
|
+
menuOpen && "hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95"
|
65
65
|
),
|
66
66
|
ref: innerRef,
|
67
67
|
...innerProps
|
@@ -4,7 +4,7 @@ import {
|
|
4
4
|
Label,
|
5
5
|
Skeleton,
|
6
6
|
cn
|
7
|
-
} from "./chunk-
|
7
|
+
} from "./chunk-FLMCWOQQ.mjs";
|
8
8
|
|
9
9
|
// elements/input/Input.tsx
|
10
10
|
import React, { forwardRef } from "react";
|
@@ -64,7 +64,7 @@ var Input = forwardRef(
|
|
64
64
|
)
|
65
65
|
},
|
66
66
|
props.label && /* @__PURE__ */ React.createElement(Label, { ...labelProps }, props.label),
|
67
|
-
/* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center
|
67
|
+
/* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center" }, props.outsidePrefix && /* @__PURE__ */ React.createElement(
|
68
68
|
"span",
|
69
69
|
{
|
70
70
|
className: cn(
|
@@ -130,7 +130,7 @@ var Input = forwardRef(
|
|
130
130
|
...inputProps,
|
131
131
|
className: cn(
|
132
132
|
defaultInputStyle,
|
133
|
-
"
|
133
|
+
"focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 dark:hawa-text-white",
|
134
134
|
{
|
135
135
|
"hawa-pe-9": props.endIcon,
|
136
136
|
"hawa-ps-9": props.startIcon,
|
@@ -144,7 +144,7 @@ var Input = forwardRef(
|
|
144
144
|
"div",
|
145
145
|
{
|
146
146
|
className: cn(
|
147
|
-
"hawa-absolute hawa-end-0 hawa-top-[47px] hawa-z-20 hawa-translate-y-1/2 hawa-rounded hawa-bg-background hawa-text-start
|
147
|
+
"hawa-absolute hawa-end-0 hawa-top-[47px] hawa-z-20 hawa-translate-y-1/2 hawa-rounded hawa-bg-background hawa-text-start hawa-text-xs hawa-text-helper-color hawa-drop-shadow-md hawa-transition-all",
|
148
148
|
props.helperText ? "hawa-border hawa-p-1" : "hawa-border-none hawa-p-0"
|
149
149
|
)
|
150
150
|
},
|
@@ -499,7 +499,7 @@ var CardTitle = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__
|
|
499
499
|
"h3",
|
500
500
|
{
|
501
501
|
ref,
|
502
|
-
className: cn("hawa-text-2xl hawa-font-semibold
|
502
|
+
className: cn("hawa-text-2xl hawa-font-semibold", className),
|
503
503
|
...props
|
504
504
|
}
|
505
505
|
));
|
@@ -1033,7 +1033,7 @@ var CardTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__
|
|
1033
1033
|
"h3",
|
1034
1034
|
{
|
1035
1035
|
ref,
|
1036
|
-
className: cn("hawa-text-2xl hawa-font-semibold
|
1036
|
+
className: cn("hawa-text-2xl hawa-font-semibold", className),
|
1037
1037
|
...props
|
1038
1038
|
}
|
1039
1039
|
));
|
@@ -1258,7 +1258,7 @@ var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...pr
|
|
1258
1258
|
ref,
|
1259
1259
|
sideOffset,
|
1260
1260
|
className: cn(
|
1261
|
-
"hawa-z-50
|
1261
|
+
"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-p-1 hawa-text-popover-foreground hawa-shadow-md data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
|
1262
1262
|
className
|
1263
1263
|
),
|
1264
1264
|
...props
|
@@ -1279,7 +1279,7 @@ var DropdownMenuItem = React10.forwardRef(({ className, inset, badged, slug, Lin
|
|
1279
1279
|
),
|
1280
1280
|
...props
|
1281
1281
|
},
|
1282
|
-
/* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2
|
1282
|
+
/* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2" }, props.children),
|
1283
1283
|
props.end && props.end,
|
1284
1284
|
!props.end && props.shortcut && /* @__PURE__ */ React10.createElement(DropdownMenuShortcut, null, props.shortcut),
|
1285
1285
|
!props.end && badged && /* @__PURE__ */ React10.createElement("div", { className: "hawa-h-3 hawa-w-3 hawa-rounded-full hawa-bg-red-500" })
|
@@ -1570,7 +1570,7 @@ var DropdownMenu = ({
|
|
1570
1570
|
badged: item.badged,
|
1571
1571
|
className: cn(
|
1572
1572
|
sizeStyles[size],
|
1573
|
-
!item.icon && !item.label ? "hawa-px-0 hawa-py-0 focus:hawa-bg-transparent
|
1573
|
+
!item.icon && !item.label ? "hawa-px-0 hawa-py-0 focus:hawa-bg-transparent" : "focus:hawa-bg-accent",
|
1574
1574
|
item.presist && "focus:hawa-bg-transparent",
|
1575
1575
|
classNames == null ? void 0 : classNames.item
|
1576
1576
|
)
|
@@ -1,7 +1,7 @@
|
|
1
1
|
"use client";
|
2
2
|
import {
|
3
3
|
cn
|
4
|
-
} from "./chunk-
|
4
|
+
} from "./chunk-FLMCWOQQ.mjs";
|
5
5
|
|
6
6
|
// elements/scrollArea/ScrollArea.tsx
|
7
7
|
import * as React from "react";
|
@@ -73,7 +73,7 @@ var ScrollArea = React.forwardRef(({ className, children, orientation = "vertica
|
|
73
73
|
"div",
|
74
74
|
{
|
75
75
|
className: cn(
|
76
|
-
"hawa-pointer-events-none hawa-absolute hawa-bg-background
|
76
|
+
"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",
|
77
77
|
showLeftFade ? "hawa-block" : "hawa-hidden"
|
78
78
|
)
|
79
79
|
}
|
@@ -82,7 +82,7 @@ var ScrollArea = React.forwardRef(({ className, children, orientation = "vertica
|
|
82
82
|
"div",
|
83
83
|
{
|
84
84
|
className: cn(
|
85
|
-
"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
|
85
|
+
"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",
|
86
86
|
showRightFade ? "hawa-block" : "hawa-hidden"
|
87
87
|
)
|
88
88
|
}
|