@sikka/hawa 0.27.10-next → 0.27.12-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/README.md +88 -0
- package/dist/accordion/index.d.mts +5 -2
- package/dist/accordion/index.d.ts +5 -2
- package/dist/accordion/index.js +1 -0
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs +2 -0
- package/dist/accordion/index.mjs.map +1 -1
- package/dist/alert/index.js +1 -0
- package/dist/alert/index.js.map +1 -1
- package/dist/alert/index.mjs +2 -0
- package/dist/alert/index.mjs.map +1 -1
- package/dist/appLayout/index.js +1 -0
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +2 -0
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/appMenubar/index.js +1 -0
- package/dist/appMenubar/index.js.map +1 -1
- package/dist/appMenubar/index.mjs +2 -0
- package/dist/appMenubar/index.mjs.map +1 -1
- package/dist/appStores/index.js +1 -0
- package/dist/appStores/index.js.map +1 -1
- package/dist/appStores/index.mjs +2 -0
- package/dist/appStores/index.mjs.map +1 -1
- package/dist/appTabs/index.js +1 -0
- package/dist/appTabs/index.js.map +1 -1
- package/dist/appTabs/index.mjs +2 -0
- package/dist/appTabs/index.mjs.map +1 -1
- package/dist/appTopbar/index.js +1 -0
- package/dist/appTopbar/index.js.map +1 -1
- package/dist/appTopbar/index.mjs +2 -0
- package/dist/appTopbar/index.mjs.map +1 -1
- package/dist/avatar/index.js +1 -0
- package/dist/avatar/index.js.map +1 -1
- package/dist/avatar/index.mjs +2 -0
- package/dist/avatar/index.mjs.map +1 -1
- package/dist/backToTop/index.js +1 -0
- package/dist/backToTop/index.js.map +1 -1
- package/dist/backToTop/index.mjs +2 -0
- package/dist/backToTop/index.mjs.map +1 -1
- package/dist/badge/index.js +1 -0
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +2 -0
- package/dist/badge/index.mjs.map +1 -1
- package/dist/blocks/auth/index.js +1 -0
- package/dist/blocks/auth/index.mjs +6 -5
- package/dist/blocks/feedback/index.js +1 -0
- package/dist/blocks/feedback/index.mjs +6 -5
- package/dist/blocks/index.js +1 -0
- package/dist/blocks/index.mjs +4 -3
- package/dist/blocks/misc/index.js +1 -0
- package/dist/blocks/misc/index.mjs +6 -5
- package/dist/blocks/pricing/index.js +1 -0
- package/dist/blocks/pricing/index.mjs +6 -5
- package/dist/breadcrumb/index.js +1 -0
- package/dist/breadcrumb/index.js.map +1 -1
- package/dist/breadcrumb/index.mjs +2 -0
- package/dist/breadcrumb/index.mjs.map +1 -1
- package/dist/button/index.js +1 -0
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs +2 -0
- package/dist/button/index.mjs.map +1 -1
- package/dist/card/index.js +1 -0
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +2 -0
- package/dist/card/index.mjs.map +1 -1
- package/dist/carousel/index.js +1 -0
- package/dist/carousel/index.js.map +1 -1
- package/dist/carousel/index.mjs +2 -0
- package/dist/carousel/index.mjs.map +1 -1
- package/dist/checkbox/index.js +1 -0
- package/dist/checkbox/index.js.map +1 -1
- package/dist/checkbox/index.mjs +2 -0
- package/dist/checkbox/index.mjs.map +1 -1
- package/dist/chip/index.js +1 -0
- package/dist/chip/index.js.map +1 -1
- package/dist/chip/index.mjs +2 -0
- package/dist/chip/index.mjs.map +1 -1
- package/dist/{chunk-ZS3FB3PO.mjs → chunk-47APBDKK.mjs} +2 -0
- package/dist/{chunk-EZKMFH4D.mjs → chunk-47JBRNHV.mjs} +2 -1
- package/dist/{chunk-ZFXKCRJC.mjs → chunk-4OOSUQZG.mjs} +1 -0
- package/dist/{chunk-A3ERTYS4.mjs → chunk-57SB6MBG.mjs} +2 -0
- package/dist/{chunk-H6RXLCDX.mjs → chunk-AOS5F2JU.mjs} +2 -0
- package/dist/{chunk-YHED4XVA.mjs → chunk-BWWRORXM.mjs} +2 -1
- package/dist/{chunk-D22AALLE.mjs → chunk-H7ZADF2Z.mjs} +2 -0
- package/dist/{chunk-PPOMNW7H.mjs → chunk-M76J5JHP.mjs} +2 -1
- package/dist/{chunk-QDNT7A7D.mjs → chunk-NKJ56AFS.mjs} +2 -1
- package/dist/{chunk-O3Y6K3YE.mjs → chunk-PEV5RH2A.mjs} +2 -0
- package/dist/{chunk-77PYXYCP.mjs → chunk-SFXAOGDN.mjs} +2 -1
- package/dist/{chunk-YVH4TWNC.mjs → chunk-TWCAKKEP.mjs} +2 -1
- package/dist/{chunk-3QADSQDZ.mjs → chunk-ZNAH5EOY.mjs} +2 -1
- package/dist/{chunk-TZT5E6NW.mjs → chunk-ZPUA6IU3.mjs} +2 -1
- package/dist/codeBlock/index.js +1 -0
- package/dist/codeBlock/index.js.map +1 -1
- package/dist/codeBlock/index.mjs +1 -0
- package/dist/codeBlock/index.mjs.map +1 -1
- package/dist/collapsible/index.js +1 -0
- package/dist/collapsible/index.js.map +1 -1
- package/dist/collapsible/index.mjs +2 -0
- package/dist/collapsible/index.mjs.map +1 -1
- package/dist/colorPicker/index.js +1 -0
- package/dist/colorPicker/index.js.map +1 -1
- package/dist/colorPicker/index.mjs +2 -0
- package/dist/colorPicker/index.mjs.map +1 -1
- package/dist/combobox/index.js +1 -0
- package/dist/combobox/index.js.map +1 -1
- package/dist/combobox/index.mjs +2 -0
- package/dist/combobox/index.mjs.map +1 -1
- package/dist/command/index.js +1 -0
- package/dist/command/index.js.map +1 -1
- package/dist/command/index.mjs +2 -0
- package/dist/command/index.mjs.map +1 -1
- package/dist/copyrights/index.js +1 -0
- package/dist/copyrights/index.js.map +1 -1
- package/dist/copyrights/index.mjs +2 -0
- package/dist/copyrights/index.mjs.map +1 -1
- package/dist/count/index.js +1 -0
- package/dist/count/index.js.map +1 -1
- package/dist/count/index.mjs +2 -0
- package/dist/count/index.mjs.map +1 -1
- package/dist/dataTable/index.js +1 -0
- package/dist/dataTable/index.js.map +1 -1
- package/dist/dataTable/index.mjs +2 -0
- package/dist/dataTable/index.mjs.map +1 -1
- package/dist/destroyableCard/index.js +1 -0
- package/dist/destroyableCard/index.js.map +1 -1
- package/dist/destroyableCard/index.mjs +2 -0
- package/dist/destroyableCard/index.mjs.map +1 -1
- package/dist/dialog/index.js +1 -0
- package/dist/dialog/index.js.map +1 -1
- package/dist/dialog/index.mjs +2 -0
- package/dist/dialog/index.mjs.map +1 -1
- package/dist/docsLayout/index.js +1 -0
- package/dist/docsLayout/index.js.map +1 -1
- package/dist/docsLayout/index.mjs +2 -0
- package/dist/docsLayout/index.mjs.map +1 -1
- package/dist/docsSidebar/index.js +1 -0
- package/dist/docsSidebar/index.js.map +1 -1
- package/dist/docsSidebar/index.mjs +2 -0
- package/dist/docsSidebar/index.mjs.map +1 -1
- package/dist/dropdownMenu/index.js +1 -0
- package/dist/dropdownMenu/index.js.map +1 -1
- package/dist/dropdownMenu/index.mjs +2 -0
- package/dist/dropdownMenu/index.mjs.map +1 -1
- package/dist/elements/index.d.mts +5 -2
- package/dist/elements/index.d.ts +5 -2
- package/dist/elements/index.js +1 -0
- package/dist/elements/index.mjs +6 -5
- package/dist/fileDropzone/index.js +1 -0
- package/dist/fileDropzone/index.js.map +1 -1
- package/dist/fileDropzone/index.mjs +2 -0
- package/dist/fileDropzone/index.mjs.map +1 -1
- package/dist/fileUploader/index.js +1 -0
- package/dist/fileUploader/index.js.map +1 -1
- package/dist/fileUploader/index.mjs +2 -0
- package/dist/fileUploader/index.mjs.map +1 -1
- package/dist/glow/index.js +1 -0
- package/dist/glow/index.js.map +1 -1
- package/dist/glow/index.mjs +2 -0
- package/dist/glow/index.mjs.map +1 -1
- package/dist/hooks/index.js +1 -0
- package/dist/hooks/index.mjs +4 -3
- package/dist/index.d.mts +4 -1
- package/dist/index.d.ts +4 -1
- package/dist/index.js +1 -0
- package/dist/index.mjs +1 -0
- package/dist/input/index.js +1 -0
- package/dist/input/index.js.map +1 -1
- package/dist/input/index.mjs +2 -0
- package/dist/input/index.mjs.map +1 -1
- package/dist/interfaceSettings/index.js +1 -0
- package/dist/interfaceSettings/index.js.map +1 -1
- package/dist/interfaceSettings/index.mjs +2 -0
- package/dist/interfaceSettings/index.mjs.map +1 -1
- package/dist/label/index.js +1 -0
- package/dist/label/index.js.map +1 -1
- package/dist/label/index.mjs +2 -0
- package/dist/label/index.mjs.map +1 -1
- package/dist/layout/index.js +1 -0
- package/dist/layout/index.mjs +5 -4
- package/dist/loading/index.js +1 -0
- package/dist/loading/index.js.map +1 -1
- package/dist/loading/index.mjs +2 -0
- package/dist/loading/index.mjs.map +1 -1
- package/dist/logos/index.js +1 -0
- package/dist/logos/index.js.map +1 -1
- package/dist/logos/index.mjs +2 -0
- package/dist/logos/index.mjs.map +1 -1
- package/dist/navbar/index.js +1 -0
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +2 -0
- package/dist/navbar/index.mjs.map +1 -1
- package/dist/navigationMenu/index.js +1 -0
- package/dist/navigationMenu/index.js.map +1 -1
- package/dist/navigationMenu/index.mjs +2 -0
- package/dist/navigationMenu/index.mjs.map +1 -1
- package/dist/pagination/index.js +1 -0
- package/dist/pagination/index.js.map +1 -1
- package/dist/pagination/index.mjs +2 -0
- package/dist/pagination/index.mjs.map +1 -1
- package/dist/passwordInput/index.js +1 -0
- package/dist/passwordInput/index.js.map +1 -1
- package/dist/passwordInput/index.mjs +2 -0
- package/dist/passwordInput/index.mjs.map +1 -1
- package/dist/phoneInput/index.js +1 -0
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +2 -0
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/pinInput/index.js +1 -0
- package/dist/pinInput/index.js.map +1 -1
- package/dist/pinInput/index.mjs +2 -0
- package/dist/pinInput/index.mjs.map +1 -1
- package/dist/popover/index.js +1 -0
- package/dist/popover/index.js.map +1 -1
- package/dist/popover/index.mjs +2 -0
- package/dist/popover/index.mjs.map +1 -1
- package/dist/progress/index.js +1 -0
- package/dist/progress/index.js.map +1 -1
- package/dist/progress/index.mjs +2 -0
- package/dist/progress/index.mjs.map +1 -1
- package/dist/progressCircle/index.js +1 -0
- package/dist/progressCircle/index.js.map +1 -1
- package/dist/progressCircle/index.mjs +2 -0
- package/dist/progressCircle/index.mjs.map +1 -1
- package/dist/radio/index.js +1 -0
- package/dist/radio/index.js.map +1 -1
- package/dist/radio/index.mjs +2 -0
- package/dist/radio/index.mjs.map +1 -1
- package/dist/scrollArea/index.js +1 -0
- package/dist/scrollArea/index.js.map +1 -1
- package/dist/scrollArea/index.mjs +2 -0
- package/dist/scrollArea/index.mjs.map +1 -1
- package/dist/scrollIndicator/index.js +1 -0
- package/dist/scrollIndicator/index.js.map +1 -1
- package/dist/scrollIndicator/index.mjs +2 -0
- package/dist/scrollIndicator/index.mjs.map +1 -1
- package/dist/select/index.js +1 -0
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +2 -0
- package/dist/select/index.mjs.map +1 -1
- package/dist/separator/index.js +1 -0
- package/dist/separator/index.js.map +1 -1
- package/dist/separator/index.mjs +2 -0
- package/dist/separator/index.mjs.map +1 -1
- package/dist/sheet/index.js +1 -0
- package/dist/sheet/index.js.map +1 -1
- package/dist/sheet/index.mjs +2 -0
- package/dist/sheet/index.mjs.map +1 -1
- package/dist/sidebar/index.js +1 -0
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +2 -0
- package/dist/sidebar/index.mjs.map +1 -1
- package/dist/signature/index.js +1 -0
- package/dist/signature/index.js.map +1 -1
- package/dist/signature/index.mjs +2 -0
- package/dist/signature/index.mjs.map +1 -1
- package/dist/simpleTable/index.js +1 -0
- package/dist/simpleTable/index.js.map +1 -1
- package/dist/simpleTable/index.mjs +2 -0
- package/dist/simpleTable/index.mjs.map +1 -1
- package/dist/skeleton/index.js +1 -0
- package/dist/skeleton/index.js.map +1 -1
- package/dist/skeleton/index.mjs +2 -0
- package/dist/skeleton/index.mjs.map +1 -1
- package/dist/slider/index.js +1 -0
- package/dist/slider/index.js.map +1 -1
- package/dist/slider/index.mjs +2 -0
- package/dist/slider/index.mjs.map +1 -1
- package/dist/sortButton/index.js +1 -0
- package/dist/sortButton/index.js.map +1 -1
- package/dist/sortButton/index.mjs +2 -0
- package/dist/sortButton/index.mjs.map +1 -1
- package/dist/splitButton/index.js +1 -0
- package/dist/splitButton/index.js.map +1 -1
- package/dist/splitButton/index.mjs +2 -0
- package/dist/splitButton/index.mjs.map +1 -1
- package/dist/stats/index.js +1 -0
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs +2 -0
- package/dist/stats/index.mjs.map +1 -1
- package/dist/stopPropagationWrapper/index.js +1 -0
- package/dist/stopPropagationWrapper/index.js.map +1 -1
- package/dist/stopPropagationWrapper/index.mjs +2 -0
- package/dist/stopPropagationWrapper/index.mjs.map +1 -1
- package/dist/switch/index.js +1 -0
- package/dist/switch/index.js.map +1 -1
- package/dist/switch/index.mjs +2 -0
- package/dist/switch/index.mjs.map +1 -1
- package/dist/table/index.js +1 -0
- package/dist/table/index.js.map +1 -1
- package/dist/table/index.mjs +2 -0
- package/dist/table/index.mjs.map +1 -1
- package/dist/tabs/index.js +1 -0
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +2 -0
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/textarea/index.js +1 -0
- package/dist/textarea/index.js.map +1 -1
- package/dist/textarea/index.mjs +2 -0
- package/dist/textarea/index.mjs.map +1 -1
- package/dist/toast/index.js +1 -0
- package/dist/toast/index.js.map +1 -1
- package/dist/toast/index.mjs +2 -0
- package/dist/toast/index.mjs.map +1 -1
- package/dist/toaster/index.js +1 -0
- package/dist/toaster/index.js.map +1 -1
- package/dist/toaster/index.mjs +2 -0
- package/dist/toaster/index.mjs.map +1 -1
- package/dist/tooltip/index.js +1 -0
- package/dist/tooltip/index.js.map +1 -1
- package/dist/tooltip/index.mjs +2 -0
- package/dist/tooltip/index.mjs.map +1 -1
- package/dist/types/index.js +1 -0
- package/dist/types/index.mjs +1 -0
- package/package.json +1 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/destroyableCard/DestroyableCard.tsx","../../util/index.ts","../../elements/card/Card.tsx"],"sourcesContent":["import React, { FC, useRef, useState } from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Card, CardContent } from \"../card\";\n\ntype DestroyableCard = {\n position?: \"bottom-right\" | \"bottom-left\";\n direction?: DirectionType;\n fixed?: boolean;\n children?: any;\n};\nexport const DestroyableCard: FC<DestroyableCard> = ({\n position = \"bottom-right\",\n fixed,\n direction,\n ...props\n}) => {\n const [closed, setClosed] = useState(false);\n const popUpRef = useRef<HTMLDivElement>(null);\n\n const boxPosition = {\n \"bottom-right\": \"hawa-right-4 hawa-bottom-4\",\n \"bottom-left\": \"hawa-left-4 hawa-bottom-4\"\n };\n\n return (\n <div\n className={cn(\n \"hawa-transition-all\",\n closed ? \"hawa-opacity-0\" : \"hawa-opacity-100\"\n )}\n ref={popUpRef}\n >\n <Card\n className={cn(\n fixed ? \"hawa-fixed\" : \"hawa-relative\",\n fixed && position && boxPosition[position]\n )}\n dir={direction}\n >\n <button\n type=\"button\"\n className={cn(\n direction === \"rtl\" ? \"hawa-left-2\" : \"hawa-right-2\",\n \"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white\"\n )}\n data-dismiss-target=\"#destroyable-card\"\n aria-label=\"Close\"\n onClick={() => {\n setClosed(true);\n setTimeout(() => {\n if (popUpRef?.current) {\n popUpRef?.current.removeChild(popUpRef?.current.children[0]);\n }\n }, 200);\n }}\n >\n <svg\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 </button>\n <CardContent headless>{props.children}</CardContent>\n </Card>\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","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}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n ({ className, variant = \"default\", clickable = false, ...props }, ref) => {\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, variantStyles[variant])}\n {...props}\n />\n );\n }\n);\nconst CardHeader = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\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));\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>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\"hawa-flex hawa-items-center hawa-p-6 hawa-pt-0\", className)}\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"],"mappings":"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","names":["React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/destroyableCard/DestroyableCard.tsx","../../util/index.ts","../../elements/card/Card.tsx"],"sourcesContent":["import React, { FC, useRef, useState } from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Card, CardContent } from \"../card\";\n\ntype DestroyableCard = {\n position?: \"bottom-right\" | \"bottom-left\";\n direction?: DirectionType;\n fixed?: boolean;\n children?: any;\n};\nexport const DestroyableCard: FC<DestroyableCard> = ({\n position = \"bottom-right\",\n fixed,\n direction,\n ...props\n}) => {\n const [closed, setClosed] = useState(false);\n const popUpRef = useRef<HTMLDivElement>(null);\n\n const boxPosition = {\n \"bottom-right\": \"hawa-right-4 hawa-bottom-4\",\n \"bottom-left\": \"hawa-left-4 hawa-bottom-4\"\n };\n\n return (\n <div\n className={cn(\n \"hawa-transition-all\",\n closed ? \"hawa-opacity-0\" : \"hawa-opacity-100\"\n )}\n ref={popUpRef}\n >\n <Card\n className={cn(\n fixed ? \"hawa-fixed\" : \"hawa-relative\",\n fixed && position && boxPosition[position]\n )}\n dir={direction}\n >\n <button\n type=\"button\"\n className={cn(\n direction === \"rtl\" ? \"hawa-left-2\" : \"hawa-right-2\",\n \"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white\"\n )}\n data-dismiss-target=\"#destroyable-card\"\n aria-label=\"Close\"\n onClick={() => {\n setClosed(true);\n setTimeout(() => {\n if (popUpRef?.current) {\n popUpRef?.current.removeChild(popUpRef?.current.children[0]);\n }\n }, 200);\n }}\n >\n <svg\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 </button>\n <CardContent headless>{props.children}</CardContent>\n </Card>\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","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}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n ({ className, variant = \"default\", clickable = false, ...props }, ref) => {\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, variantStyles[variant])}\n {...props}\n />\n );\n }\n);\nconst CardHeader = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\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));\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>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\"hawa-flex hawa-items-center hawa-p-6 hawa-pt-0\", className)}\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"],"mappings":"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","names":["React","React"]}
|
package/dist/dialog/index.js
CHANGED
package/dist/dialog/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/dialog/index.ts","../../elements/dialog/Dialog.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Dialog\";\n","import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\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-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 {!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/index.ts","../../elements/dialog/Dialog.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Dialog\";\n","import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\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-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 {!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":[]}
|
package/dist/dialog/index.mjs
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\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\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-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 {!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\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\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-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 {!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":[]}
|
package/dist/docsLayout/index.js
CHANGED