@sikka/hawa 0.48.1-next → 0.49.0-next
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/accordion/index.js +3 -28
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs +3 -28
- package/dist/accordion/index.mjs.map +1 -1
- package/dist/alert/index.js +53 -98
- package/dist/alert/index.js.map +1 -1
- package/dist/alert/index.mjs +53 -98
- package/dist/alert/index.mjs.map +1 -1
- package/dist/appLayout/index.d.mts +2 -0
- package/dist/appLayout/index.d.ts +2 -0
- package/dist/appLayout/index.js +263 -409
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +263 -409
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/appMenubar/index.js +15 -20
- package/dist/appMenubar/index.js.map +1 -1
- package/dist/appMenubar/index.mjs +15 -20
- package/dist/appMenubar/index.mjs.map +1 -1
- package/dist/appTabs/index.js +28 -37
- package/dist/appTabs/index.js.map +1 -1
- package/dist/appTabs/index.mjs +28 -37
- package/dist/appTabs/index.mjs.map +1 -1
- package/dist/appTopbar/index.js +125 -173
- package/dist/appTopbar/index.js.map +1 -1
- package/dist/appTopbar/index.mjs +125 -173
- package/dist/appTopbar/index.mjs.map +1 -1
- package/dist/avatar/index.js.map +1 -1
- package/dist/avatar/index.mjs.map +1 -1
- package/dist/backToTop/index.js +50 -82
- package/dist/backToTop/index.js.map +1 -1
- package/dist/backToTop/index.mjs +50 -82
- package/dist/backToTop/index.mjs.map +1 -1
- package/dist/badge/index.d.mts +1 -1
- package/dist/badge/index.d.ts +1 -1
- package/dist/badge/index.js +2 -18
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +2 -18
- package/dist/badge/index.mjs.map +1 -1
- package/dist/blocks/auth/index.js +202 -468
- package/dist/blocks/auth/index.mjs +96 -280
- package/dist/blocks/feedback/index.js +214 -375
- package/dist/blocks/feedback/index.mjs +12 -25
- package/dist/blocks/index.js +604 -1122
- package/dist/blocks/index.mjs +132 -291
- package/dist/blocks/misc/index.js +136 -251
- package/dist/blocks/misc/index.mjs +29 -54
- package/dist/blocks/pricing/index.js +220 -397
- package/dist/blocks/pricing/index.mjs +63 -134
- package/dist/breadcrumb/index.js +1 -5
- package/dist/breadcrumb/index.js.map +1 -1
- package/dist/breadcrumb/index.mjs +1 -5
- package/dist/breadcrumb/index.mjs.map +1 -1
- package/dist/button/index.js +50 -82
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs +50 -82
- package/dist/button/index.mjs.map +1 -1
- package/dist/calendar/index.js +50 -82
- package/dist/calendar/index.js.map +1 -1
- package/dist/calendar/index.mjs +50 -82
- package/dist/calendar/index.mjs.map +1 -1
- package/dist/card/index.js +7 -35
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +7 -35
- package/dist/card/index.mjs.map +1 -1
- package/dist/carousel/index.js +15 -27
- package/dist/carousel/index.js.map +1 -1
- package/dist/carousel/index.mjs +15 -27
- package/dist/carousel/index.mjs.map +1 -1
- package/dist/checkbox/index.js +2 -13
- package/dist/checkbox/index.js.map +1 -1
- package/dist/checkbox/index.mjs +2 -13
- package/dist/checkbox/index.mjs.map +1 -1
- package/dist/chip/index.js +2 -16
- package/dist/chip/index.js.map +1 -1
- package/dist/chip/index.mjs +2 -16
- package/dist/chip/index.mjs.map +1 -1
- package/dist/{chunk-WUMDFBEK.mjs → chunk-3CHFVHTW.mjs} +43 -54
- package/dist/{chunk-2LUXOXAL.mjs → chunk-5SQBJRWE.mjs} +3 -9
- package/dist/{chunk-C2UOOH4X.mjs → chunk-B53SP2WZ.mjs} +3 -17
- package/dist/chunk-GHGWQVTM.mjs +150 -0
- package/dist/{chunk-5S5DR7KF.mjs → chunk-I23ONEDJ.mjs} +2 -10
- package/dist/{chunk-JFWD2ICY.mjs → chunk-JT7R3L5O.mjs} +54 -62
- package/dist/{chunk-6SJUUJOV.mjs → chunk-KDGJZPWK.mjs} +295 -574
- package/dist/{chunk-AWJSHOYU.mjs → chunk-KSJGXQTE.mjs} +1 -1
- package/dist/{chunk-NMW4GM4G.mjs → chunk-SE2JMXYG.mjs} +104 -144
- package/dist/{chunk-GBLWUEYN.mjs → chunk-ULRL4WI6.mjs} +176 -256
- package/dist/{chunk-IFWYR5W2.mjs → chunk-VUELRPUL.mjs} +57 -117
- package/dist/{chunk-WL7C2A5D.mjs → chunk-WQR4XZGL.mjs} +8 -15
- package/dist/codeBlock/index.js +50 -82
- package/dist/codeBlock/index.js.map +1 -1
- package/dist/codeBlock/index.mjs +50 -82
- package/dist/codeBlock/index.mjs.map +1 -1
- package/dist/colorPicker/index.js +21 -33
- package/dist/colorPicker/index.js.map +1 -1
- package/dist/colorPicker/index.mjs +22 -37
- package/dist/colorPicker/index.mjs.map +1 -1
- package/dist/combobox/index.d.mts +1 -1
- package/dist/combobox/index.d.ts +1 -1
- package/dist/combobox/index.js +141 -223
- package/dist/combobox/index.js.map +1 -1
- package/dist/combobox/index.mjs +141 -223
- package/dist/combobox/index.mjs.map +1 -1
- package/dist/command/index.d.mts +1 -1
- package/dist/command/index.d.ts +1 -1
- package/dist/command/index.js +129 -212
- package/dist/command/index.js.map +1 -1
- package/dist/command/index.mjs +129 -212
- package/dist/command/index.mjs.map +1 -1
- package/dist/dataTable/index.js +254 -394
- package/dist/dataTable/index.js.map +1 -1
- package/dist/dataTable/index.mjs +254 -394
- package/dist/dataTable/index.mjs.map +1 -1
- package/dist/datePicker/index.js +64 -105
- package/dist/datePicker/index.js.map +1 -1
- package/dist/datePicker/index.mjs +64 -105
- package/dist/datePicker/index.mjs.map +1 -1
- package/dist/destroyableCard/index.js +8 -39
- package/dist/destroyableCard/index.js.map +1 -1
- package/dist/destroyableCard/index.mjs +8 -39
- package/dist/destroyableCard/index.mjs.map +1 -1
- package/dist/dialog/index.js +70 -122
- package/dist/dialog/index.js.map +1 -1
- package/dist/dialog/index.mjs +70 -122
- package/dist/dialog/index.mjs.map +1 -1
- package/dist/docsLayout/index.js +169 -358
- package/dist/docsLayout/index.js.map +1 -1
- package/dist/docsLayout/index.mjs +169 -358
- package/dist/docsLayout/index.mjs.map +1 -1
- package/dist/docsSidebar/index.js +9 -16
- package/dist/docsSidebar/index.js.map +1 -1
- package/dist/docsSidebar/index.mjs +9 -16
- package/dist/docsSidebar/index.mjs.map +1 -1
- package/dist/dropdownMenu/index.js +124 -164
- package/dist/dropdownMenu/index.js.map +1 -1
- package/dist/dropdownMenu/index.mjs +124 -164
- package/dist/dropdownMenu/index.mjs.map +1 -1
- package/dist/elements/index.d.mts +3 -3
- package/dist/elements/index.d.ts +3 -3
- package/dist/elements/index.js +841 -1505
- package/dist/elements/index.mjs +381 -718
- package/dist/fileDropzone/index.js +60 -159
- package/dist/fileDropzone/index.js.map +1 -1
- package/dist/fileDropzone/index.mjs +60 -159
- package/dist/fileDropzone/index.mjs.map +1 -1
- package/dist/glow/index.js +4 -16
- package/dist/glow/index.js.map +1 -1
- package/dist/glow/index.mjs +4 -16
- package/dist/glow/index.mjs.map +1 -1
- package/dist/hooks/index.d.mts +1 -5
- package/dist/hooks/index.d.ts +1 -5
- package/dist/hooks/index.js +11 -24
- package/dist/hooks/index.mjs +2 -2
- package/dist/{index-B0aJcA6d.d.ts → index-BgNycocQ.d.mts} +2 -2
- package/dist/{index-B0aJcA6d.d.mts → index-BgNycocQ.d.ts} +2 -2
- package/dist/index.css +1 -2
- package/dist/index.d.mts +6 -8
- package/dist/index.d.ts +6 -8
- package/dist/index.js +1194 -2170
- package/dist/index.mjs +1195 -2174
- package/dist/input/index.js +20 -29
- package/dist/input/index.js.map +1 -1
- package/dist/input/index.mjs +20 -29
- package/dist/input/index.mjs.map +1 -1
- package/dist/interfaceSettings/index.js +122 -163
- package/dist/interfaceSettings/index.js.map +1 -1
- package/dist/interfaceSettings/index.mjs +122 -163
- package/dist/interfaceSettings/index.mjs.map +1 -1
- package/dist/label/index.js +19 -26
- package/dist/label/index.js.map +1 -1
- package/dist/label/index.mjs +19 -26
- package/dist/label/index.mjs.map +1 -1
- package/dist/layout/index.d.mts +2 -0
- package/dist/layout/index.d.ts +2 -0
- package/dist/layout/index.js +434 -790
- package/dist/layout/index.mjs +143 -243
- package/dist/loading/index.js +30 -53
- package/dist/loading/index.js.map +1 -1
- package/dist/loading/index.mjs +30 -53
- package/dist/loading/index.mjs.map +1 -1
- package/dist/logos/index.js +66 -191
- package/dist/logos/index.js.map +1 -1
- package/dist/logos/index.mjs +66 -191
- package/dist/logos/index.mjs.map +1 -1
- package/dist/navbar/index.js +1 -4
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +1 -4
- package/dist/navbar/index.mjs.map +1 -1
- package/dist/navigationMenu/index.js +14 -22
- package/dist/navigationMenu/index.js.map +1 -1
- package/dist/navigationMenu/index.mjs +14 -22
- package/dist/navigationMenu/index.mjs.map +1 -1
- package/dist/pagination/index.js +1 -5
- package/dist/pagination/index.js.map +1 -1
- package/dist/pagination/index.mjs +1 -5
- package/dist/pagination/index.mjs.map +1 -1
- package/dist/passwordInput/index.js +36 -65
- package/dist/passwordInput/index.js.map +1 -1
- package/dist/passwordInput/index.mjs +36 -65
- package/dist/passwordInput/index.mjs.map +1 -1
- package/dist/phoneInput/index.js +20 -29
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +20 -29
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/pinInput/index.js +14 -16
- package/dist/pinInput/index.js.map +1 -1
- package/dist/pinInput/index.mjs +14 -16
- package/dist/pinInput/index.mjs.map +1 -1
- package/dist/popover/index.js +14 -24
- package/dist/popover/index.js.map +1 -1
- package/dist/popover/index.mjs +14 -24
- package/dist/popover/index.mjs.map +1 -1
- package/dist/progress/index.js +19 -26
- package/dist/progress/index.js.map +1 -1
- package/dist/progress/index.mjs +19 -26
- package/dist/progress/index.mjs.map +1 -1
- package/dist/progressCircle/index.js +67 -71
- package/dist/progressCircle/index.js.map +1 -1
- package/dist/progressCircle/index.mjs +67 -71
- package/dist/progressCircle/index.mjs.map +1 -1
- package/dist/radio/index.js +122 -163
- package/dist/radio/index.js.map +1 -1
- package/dist/radio/index.mjs +122 -163
- package/dist/radio/index.mjs.map +1 -1
- package/dist/scrollArea/index.js.map +1 -1
- package/dist/scrollArea/index.mjs.map +1 -1
- package/dist/scrollIndicator/index.js +1 -4
- package/dist/scrollIndicator/index.js.map +1 -1
- package/dist/scrollIndicator/index.mjs +1 -4
- package/dist/scrollIndicator/index.mjs.map +1 -1
- package/dist/select/index.js +20 -29
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +20 -29
- package/dist/select/index.mjs.map +1 -1
- package/dist/separator/index.js.map +1 -1
- package/dist/separator/index.mjs.map +1 -1
- package/dist/sheet/index.js +42 -53
- package/dist/sheet/index.js.map +1 -1
- package/dist/sheet/index.mjs +42 -53
- package/dist/sheet/index.mjs.map +1 -1
- package/dist/sidebar/index.js +66 -133
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +66 -133
- package/dist/sidebar/index.mjs.map +1 -1
- package/dist/signature/index.js +19 -26
- package/dist/signature/index.js.map +1 -1
- package/dist/signature/index.mjs +19 -26
- package/dist/signature/index.mjs.map +1 -1
- package/dist/simpleTable/index.js +50 -81
- package/dist/simpleTable/index.js.map +1 -1
- package/dist/simpleTable/index.mjs +50 -81
- package/dist/simpleTable/index.mjs.map +1 -1
- package/dist/skeleton/index.js.map +1 -1
- package/dist/skeleton/index.mjs.map +1 -1
- package/dist/slider/index.js.map +1 -1
- package/dist/slider/index.mjs.map +1 -1
- package/dist/sonner/index.js.map +1 -1
- package/dist/sonner/index.mjs.map +1 -1
- package/dist/sortButton/index.js +50 -82
- package/dist/sortButton/index.js.map +1 -1
- package/dist/sortButton/index.mjs +50 -82
- package/dist/sortButton/index.mjs.map +1 -1
- package/dist/splitButton/index.js +214 -294
- package/dist/splitButton/index.js.map +1 -1
- package/dist/splitButton/index.mjs +214 -294
- package/dist/splitButton/index.mjs.map +1 -1
- package/dist/stats/index.js +7 -35
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs +7 -35
- package/dist/stats/index.mjs.map +1 -1
- package/dist/switch/index.js +24 -34
- package/dist/switch/index.js.map +1 -1
- package/dist/switch/index.mjs +24 -34
- package/dist/switch/index.mjs.map +1 -1
- package/dist/table/index.js +27 -29
- package/dist/table/index.js.map +1 -1
- package/dist/table/index.mjs +27 -29
- package/dist/table/index.mjs.map +1 -1
- package/dist/tabs/index.js +54 -76
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +54 -76
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/textarea/index.js +21 -38
- package/dist/textarea/index.js.map +1 -1
- package/dist/textarea/index.mjs +21 -38
- package/dist/textarea/index.mjs.map +1 -1
- package/dist/toast/index.js +2 -10
- package/dist/toast/index.js.map +1 -1
- package/dist/toast/index.mjs +2 -10
- package/dist/toast/index.mjs.map +1 -1
- package/dist/toaster/index.js +3 -16
- package/dist/toaster/index.js.map +1 -1
- package/dist/toaster/index.mjs +3 -16
- package/dist/toaster/index.mjs.map +1 -1
- package/dist/tooltip/index.js +19 -26
- package/dist/tooltip/index.js.map +1 -1
- package/dist/tooltip/index.mjs +19 -26
- package/dist/tooltip/index.mjs.map +1 -1
- package/package.json +12 -12
- package/dist/chunk-JP2N5WKD.mjs +0 -190
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/textarea/index.ts","../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["export * from \"./Textarea\";\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: any;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className,\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div\n className={\n \"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"\n }\n >\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea,\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nexport const HelperText = ({\n helperText,\n}: {\n helperText?: string | React.ReactNode;\n}) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault(),\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\",\n },\n className,\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider\n delayDuration={delayDuration}\n {...providerProps}\n >\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\",\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","import_react","React","React","import_react","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/textarea/index.ts","../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["export * from \"./Textarea\";\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: any;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className,\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea,\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(sanitizedHex);\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16),\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\"),\n },\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49,\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nexport const HelperText = ({ helperText }: { helperText?: string | React.ReactNode }) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault(),\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\",\n },\n className,\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider delayDuration={delayDuration} {...providerProps}>\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>{children}</TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\",\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","import_react","React","React","import_react","React"]}
|
package/dist/textarea/index.mjs
CHANGED
@@ -53,9 +53,7 @@ function Skeleton({
|
|
53
53
|
|
54
54
|
// elements/helperText/HelperText.tsx
|
55
55
|
import React2 from "react";
|
56
|
-
var HelperText = ({
|
57
|
-
helperText
|
58
|
-
}) => /* @__PURE__ */ React2.createElement(
|
56
|
+
var HelperText = ({ helperText }) => /* @__PURE__ */ React2.createElement(
|
59
57
|
"p",
|
60
58
|
{
|
61
59
|
className: cn(
|
@@ -106,38 +104,31 @@ var Tooltip = ({
|
|
106
104
|
delayDuration = 300,
|
107
105
|
...props
|
108
106
|
}) => {
|
109
|
-
return /* @__PURE__ */ React3.createElement(
|
110
|
-
TooltipPrimitive.
|
107
|
+
return /* @__PURE__ */ React3.createElement(TooltipPrimitive.TooltipProvider, { delayDuration, ...providerProps }, /* @__PURE__ */ React3.createElement(
|
108
|
+
TooltipPrimitive.Root,
|
111
109
|
{
|
112
|
-
|
113
|
-
|
110
|
+
open: !disabled && open,
|
111
|
+
defaultOpen,
|
112
|
+
onOpenChange,
|
113
|
+
...props
|
114
114
|
},
|
115
|
+
/* @__PURE__ */ React3.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
|
115
116
|
/* @__PURE__ */ React3.createElement(
|
116
|
-
|
117
|
+
TooltipContent,
|
117
118
|
{
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
...
|
119
|
+
size,
|
120
|
+
side,
|
121
|
+
align: "center",
|
122
|
+
...contentProps,
|
123
|
+
style: {
|
124
|
+
...contentProps == null ? void 0 : contentProps.style,
|
125
|
+
maxWidth: "var(--radix-tooltip-content-available-width)",
|
126
|
+
maxHeight: "var(--radix-tooltip-content-available-height)"
|
127
|
+
}
|
122
128
|
},
|
123
|
-
|
124
|
-
/* @__PURE__ */ React3.createElement(
|
125
|
-
TooltipContent,
|
126
|
-
{
|
127
|
-
size,
|
128
|
-
side,
|
129
|
-
align: "center",
|
130
|
-
...contentProps,
|
131
|
-
style: {
|
132
|
-
...contentProps == null ? void 0 : contentProps.style,
|
133
|
-
maxWidth: "var(--radix-tooltip-content-available-width)",
|
134
|
-
maxHeight: "var(--radix-tooltip-content-available-height)"
|
135
|
-
}
|
136
|
-
},
|
137
|
-
content
|
138
|
-
)
|
129
|
+
content
|
139
130
|
)
|
140
|
-
);
|
131
|
+
));
|
141
132
|
};
|
142
133
|
|
143
134
|
// elements/label/Label.tsx
|
@@ -204,15 +195,7 @@ var Textarea = React5.forwardRef(
|
|
204
195
|
className
|
205
196
|
)
|
206
197
|
},
|
207
|
-
/* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React5.createElement(
|
208
|
-
"div",
|
209
|
-
{
|
210
|
-
className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
|
211
|
-
},
|
212
|
-
(textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
|
213
|
-
"/",
|
214
|
-
textareaProps == null ? void 0 : textareaProps.maxLength
|
215
|
-
)),
|
198
|
+
/* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength)),
|
216
199
|
isLoading ? /* @__PURE__ */ React5.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React5.createElement(
|
217
200
|
"textarea",
|
218
201
|
{
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: any;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className,\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div\n className={\n \"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"\n }\n >\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea,\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nexport const HelperText = ({\n helperText,\n}: {\n helperText?: string | React.ReactNode;\n}) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault(),\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\",\n },\n className,\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider\n delayDuration={delayDuration}\n {...providerProps}\n >\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\",\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","React","React","React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/textarea/Textarea.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/helperText/HelperText.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { HelperText } from \"../helperText\";\nimport { Label, LabelProps } from \"../label\";\n\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n helperText?: any;\n isLoading?: boolean;\n /** The label of the input field */\n label?: any;\n labelProps?: LabelProps;\n forceHideHelperText?: boolean;\n textareaProps?: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n showCount?: boolean;\n countPosition?: \"top\" | \"bottom\";\n classNames?: {\n textarea?: string;\n };\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n classNames,\n labelProps,\n showCount,\n forceHideHelperText,\n textareaProps,\n countPosition = \"bottom\",\n isLoading,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n className={cn(\n \"textarea-main hawa-relative hawa-flex hawa-h-full hawa-w-full hawa-flex-col\",\n !forceHideHelperText && \"hawa-gap-2\",\n className,\n )}\n >\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {props.label && <Label {...labelProps}>{props.label}</Label>}\n {showCount && countPosition === \"top\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n {isLoading ? (\n <Skeleton style={{ height: 40 }} />\n ) : (\n <textarea\n {...textareaProps}\n className={cn(\n \"hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n classNames?.textarea,\n )}\n ref={ref}\n />\n )}\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {!forceHideHelperText && <HelperText helperText={props.helperText} />}\n\n {/* Character Counter */}\n {showCount && countPosition === \"bottom\" && (\n <div className={\"hawa-text-start hawa-text-xs hawa-transition-all\"}>\n {textareaProps?.value ? String(textareaProps?.value).length : 0}/\n {textareaProps?.maxLength}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(sanitizedHex);\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16),\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\"),\n },\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49,\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n className?: string;\n animation?: \"none\" | \"pulse\" | \"shimmer\";\n content?: any;\n fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n as?: \"div\" | \"input\";\n}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\n as = \"div\",\n ...props\n}: SkeletonProps) {\n const animationStyles = {\n none: \"hawa-rounded hawa-bg-muted\",\n pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n shimmer:\n \"hawa-space-y-5 hawa-rounded hawa-bg-muted hawa-p-4 hawa-relative before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden before:hawa-border-t before:hawa-border-rose-100/10\",\n };\n const fadeStyle = {\n bottom: \"hawa-mask-fade-bottom\",\n top: \"hawa-mask-fade-top\",\n right: \"hawa-mask-fade-right\",\n left: \"hawa-mask-fade-left \",\n };\n\n const styledAs = {\n div: \"\",\n input: \"hawa-h-[40px] hawa-w-full\",\n };\n\n return (\n <div\n className={cn(\n animationStyles[animation],\n content && \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n styledAs[as],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nexport const HelperText = ({ helperText }: { helperText?: string | React.ReactNode }) => (\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-helper-color hawa-transition-all hawa-text-xs\",\n helperText ? \"hawa-opacity-100 hawa-h-4\" : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {helperText}\n </p>\n);\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n hint?: React.ReactNode;\n hintSide?: PositionType;\n htmlFor?: string;\n required?: boolean;\n};\n\nconst Label = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n <label\n ref={ref}\n className={cn(\n \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n </label>\n {hint && (\n <Tooltip\n content={hint}\n side={hintSide}\n triggerProps={{\n tabIndex: -1,\n onClick: (event) => event.preventDefault(),\n }}\n >\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n <path d=\"M12 17h.01\" />\n </svg>\n </div>\n </Tooltip>\n )}\n </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n size?: \"default\" | \"small\" | \"large\";\n }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n <TooltipPrimitive.Content\n ref={ref}\n sideOffset={sideOffset}\n className={cn(\n \"hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2\",\n {\n \"hawa-text-xs\": size === \"small\",\n \"hawa-text-xl\": size === \"large\",\n },\n className,\n )}\n {...props}\n />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n /** Controls the open state of the tooltip. */\n open?: any;\n /** Specifies the side where the tooltip will appear. */\n side?: PositionType;\n /** Content to be displayed within the tooltip. */\n content?: any;\n /** Elements to which the tooltip is anchored. */\n children?: any;\n /** Sets the default open state of the tooltip. */\n defaultOpen?: any;\n /** Event handler for open state changes. */\n onOpenChange?: any;\n /** Duration of the delay before the tooltip appears. */\n delayDuration?: any;\n /** Size of the tooltip. */\n size?: \"default\" | \"small\" | \"large\";\n /** Disables the tooltip. */\n disabled?: boolean;\n triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n size,\n open,\n content,\n children,\n disabled,\n defaultOpen,\n onOpenChange,\n triggerProps,\n contentProps,\n providerProps,\n delayDuration = 300,\n ...props\n}) => {\n return (\n <TooltipPrimitive.TooltipProvider delayDuration={delayDuration} {...providerProps}>\n <TooltipPrimitive.Root\n open={!disabled && open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>{children}</TooltipPrimitive.Trigger>\n <TooltipContent\n size={size}\n side={side}\n align=\"center\"\n {...contentProps}\n style={{\n ...contentProps?.style,\n maxWidth: \"var(--radix-tooltip-content-available-width)\",\n maxHeight: \"var(--radix-tooltip-content-available-height)\",\n }}\n >\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":";;;AAAA,YAAYA,YAAW;;;ACAvB,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACLA,OAAO,WAAW;AAYlB,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,KAAK;AAAA,EACL,GAAG;AACL,GAAkB;AAChB,QAAM,kBAAkB;AAAA,IACtB,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SACE;AAAA,EACJ;AACA,QAAM,YAAY;AAAA,IAChB,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAEA,QAAM,WAAW;AAAA,IACf,KAAK;AAAA,IACL,OAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,gBAAgB,SAAS;AAAA,QACzB,WAAW;AAAA,QACX,QAAQ,UAAU,IAAI;AAAA,QACtB,SAAS,EAAE;AAAA,QACX;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,IAEH,WAAW;AAAA,EACd;AAEJ;;;ACpDA,OAAOC,YAAW;AAIX,IAAM,aAAa,CAAC,EAAE,WAAW,MACtC,gBAAAC,OAAA;AAAA,EAAC;AAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA,aAAa,8BAA8B;AAAA,IAC7C;AAAA;AAAA,EAEC;AACH;;;ACZF,YAAYC,YAAW;;;ACAvB,OAAOC,YAAW;AAElB,YAAY,sBAAsB;AAKlC,IAAM,iBAAiBC,OAAM,WAK3B,CAAC,EAAE,WAAW,aAAa,GAAG,OAAO,WAAW,GAAG,MAAM,GAAG,QAC5D,gBAAAA,OAAA;AAAA,EAAkB;AAAA,EAAjB;AAAA,IACC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,QACE,gBAAgB,SAAS;AAAA,QACzB,gBAAgB,SAAS;AAAA,MAC3B;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,eAAe,cAA+B,yBAAQ;AAEtD,IAAM,eAAeA,OAAM,WAGzB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B,gBAAAA,OAAA,cAAkB,wBAAjB,EAAuB,KAAU,WAAW,GAAG,SAAS,GAAI,GAAG,OAAO,CACxE;AACD,aAAa,cAA+B,uBAAM;AA0BlD,IAAM,UAAiD,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,GAAG;AACL,MAAM;AACJ,SACE,gBAAAA,OAAA,cAAkB,kCAAjB,EAAiC,eAA+B,GAAG,iBAClE,gBAAAA,OAAA;AAAA,IAAkB;AAAA,IAAjB;AAAA,MACC,MAAM,CAAC,YAAY;AAAA,MACnB;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,IAEJ,gBAAAA,OAAA,cAAkB,0BAAjB,EAA0B,GAAG,gBAAe,QAAS;AAAA,IACtD,gBAAAA,OAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,OAAM;AAAA,QACL,GAAG;AAAA,QACJ,OAAO;AAAA,UACL,GAAG,6CAAc;AAAA,UACjB,UAAU;AAAA,UACV,WAAW;AAAA,QACb;AAAA;AAAA,MAEC;AAAA,IACH;AAAA,EACF,CACF;AAEJ;;;ADtFA,IAAM,QAAc,kBAGlB,CAAC,EAAE,WAAW,MAAM,UAAU,UAAU,UAAU,GAAG,MAAM,GAAG,QAC9D,qCAAC,SAAI,WAAU,8EACb;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AAAA,EAEH;AAAA,EACA,YAAY,qCAAC,UAAK,WAAU,mCAAgC,GAAC;AAChE,GACC,QACC;AAAA,EAAC;AAAA;AAAA,IACC,SAAS;AAAA,IACT,MAAM;AAAA,IACN,cAAc;AAAA,MACZ,UAAU;AAAA,MACV,SAAS,CAAC,UAAU,MAAM,eAAe;AAAA,IAC3C;AAAA;AAAA,EAEA,qCAAC,aACC;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA;AAAA,IAEf,qCAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,qCAAC,UAAK,GAAE,wCAAuC;AAAA,IAC/C,qCAAC,UAAK,GAAE,cAAa;AAAA,EACvB,CACF;AACF,CAEJ,CACD;AAED,MAAM,cAAc;;;AJrCpB,IAAM,WAAiB;AAAA,EACrB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,CAAC,uBAAuB;AAAA,UACxB;AAAA,QACF;AAAA;AAAA,MAEA,qCAAC,SAAI,WAAU,kDACZ,MAAM,SAAS,qCAAC,SAAO,GAAG,cAAa,MAAM,KAAM,GACnD,aAAa,kBAAkB,SAC9B,qCAAC,SAAI,WAAW,yEACb,+CAAe,SAAQ,OAAO,+CAAe,KAAK,EAAE,SAAS,GAAE,KAC/D,+CAAe,SAClB,CAEJ;AAAA,MACC,YACC,qCAAC,YAAS,OAAO,EAAE,QAAQ,GAAG,GAAG,IAEjC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ,WAAW;AAAA,YACT;AAAA,YACA,yCAAY;AAAA,UACd;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF,qCAAC,SAAI,WAAU,kDAEZ,CAAC,uBAAuB,qCAAC,cAAW,YAAY,MAAM,YAAY,GAGlE,aAAa,kBAAkB,YAC9B,qCAAC,SAAI,WAAW,uDACb,+CAAe,SAAQ,OAAO,+CAAe,KAAK,EAAE,SAAS,GAAE,KAC/D,+CAAe,SAClB,CAEJ;AAAA,IACF;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":["React","React","React","React","React","React"]}
|
package/dist/toast/index.js
CHANGED
@@ -164,11 +164,7 @@ var ToastTitle = React.forwardRef(({ className, size = "default", ...props }, re
|
|
164
164
|
ToastPrimitives.Title,
|
165
165
|
{
|
166
166
|
ref,
|
167
|
-
className: cn(
|
168
|
-
"hawa-select-text hawa-text-sm hawa-font-semibold",
|
169
|
-
sizeStyles[size],
|
170
|
-
className
|
171
|
-
),
|
167
|
+
className: cn("hawa-select-text hawa-text-sm hawa-font-semibold", sizeStyles[size], className),
|
172
168
|
...props
|
173
169
|
}
|
174
170
|
));
|
@@ -177,11 +173,7 @@ var ToastDescription = React.forwardRef(({ className, size = "default", ...props
|
|
177
173
|
ToastPrimitives.Description,
|
178
174
|
{
|
179
175
|
ref,
|
180
|
-
className: cn(
|
181
|
-
"hawa-select-text hawa-opacity-90",
|
182
|
-
sizeStyles[size],
|
183
|
-
className
|
184
|
-
),
|
176
|
+
className: cn("hawa-select-text hawa-opacity-90", sizeStyles[size], className),
|
185
177
|
...props
|
186
178
|
}
|
187
179
|
));
|
package/dist/toast/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/toast/index.ts","../../elements/toast/Toast.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Toast\";\n","import * as React from \"react\";\n\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { cn } from \"@util/index\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst toastVariants = cva(\n \"hawa-group hawa-z-[900] hawa-pointer-events-auto hawa-relative hawa-flex hawa-w-full hawa-items-center hawa-justify-between hawa-overflow-hidden hawa-rounded-md hawa-border hawa-shadow-lg hawa-transition-all data-[swipe=cancel]:hawa-translate-x-0 data-[swipe=end]:hawa-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:hawa-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:hawa-transition-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[swipe=end]:hawa-animate-out data-[state=closed]:hawa-fade-out-80 data-[state=open]:hawa-slide-in-from-top-full data-[state=open]:sm:hawa-slide-in-from-bottom-full\",\n {\n variants: {\n variant: {\n default: \"hawa-border hawa-bg-background hawa-text-foreground\",\n destructive:\n \"hawa-destructive hawa-group hawa-border-destructive hawa-bg-destructive hawa-text-destructive-foreground\",\n },\n severity: {\n info: \"hawa-info hawa-group hawa-text-info-foreground hawa-bg-info\",\n warning:\n \"hawa-warning hawa-group hawa-text-warning-foreground hawa-bg-warning\",\n error:\n \"hawa-error hawa-group hawa-border-error hawa-bg-error hawa-text-white\",\n success:\n \"hawa-success hawa-group hawa-text-success-foreground hawa-bg-success\",\n none: \"\",\n },\n },\n\n defaultVariants: { variant: \"default\" },\n },\n);\n\nlet sizeStyles = {\n default: \"hawa-text-sm\", // Update this based on the desired padding for rtl\n sm: \"hawa-text-xs\",\n};\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Viewport>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Viewport\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-top-0 hawa-z-[100] hawa-flex hawa-max-h-screen hawa-w-full hawa-flex-col-reverse hawa-p-4 sm:hawa-bottom-0 sm:hawa-right-0 sm:hawa-top-auto sm:hawa-flex-col md:hawa-max-w-[420px]\",\n className,\n )}\n {...props}\n />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst Toast = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Root>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &\n VariantProps<typeof toastVariants> & {\n direction?: DirectionType;\n }\n>(({ className, variant, severity = \"none\", direction, ...props }, ref) => {\n return (\n <ToastPrimitives.Root\n ref={ref}\n className={cn(\n toastVariants({ variant, severity }),\n className,\n direction === \"rtl\"\n ? \"data-[state=closed]:hawa-slide-out-to-left-full\"\n : \"data-[state=closed]:hawa-slide-out-to-right-full\",\n )}\n dir={direction}\n {...props}\n />\n );\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Action>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>\n>(({ className, ...props }, ref) => {\n return (\n <ToastPrimitives.Action\n ref={ref}\n className={cn(\n \"hawa-inline-flex hawa-h-8 hawa-shrink-0 hawa-items-center hawa-justify-center hawa-rounded-md hawa-border hawa-bg-transparent hawa-px-3 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-colors hover:hawa-bg-secondary hover:hawa-text-secondary-foreground focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n \"group-[.info]:hawa-border-muted/40 group-[.info]:hover:hawa-border-info/30 group-[.info]:hover:hawa-bg-info group-[.info]:hover:hawa-text-info-foreground group-[.info]:focus:hawa-ring-info\",\n \"group-[.error]:hawa-border-muted/40 group-[.error]:hover:hawa-border-error/30 group-[.error]:hover:hawa-bg-error group-[.error]:hover:hawa-text-error-foreground group-[.error]:focus:hawa-ring-error\",\n \"group-[.success]:hawa-border-muted/40 group-[.success]:hover:hawa-border-success/30 group-[.success]:hover:hawa-bg-success group-[.success]:hover:hawa-text-success-foreground group-[.success]:focus:hawa-ring-success\",\n \"group-[.warning]:hawa-border-muted/40 group-[.warning]:hover:hawa-border-warning/30 group-[.warning]:hover:hawa-bg-warning group-[.warning]:hover:hawa-text-warning-foreground group-[.warning]:focus:hawa-ring-warning\",\n \"hawa-whitespace-nowrap\",\n className,\n )}\n {...props}\n />\n );\n});\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Close>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Close\n ref={ref}\n className={cn(\n // \"hawa-absolute hawa-start-2 hawa-top-2\",\n // \"group-hover:hawa-opacity-100\",\n \"hawa-opacity-100\",\n \"hawa-rounded-md hawa-p-1 hawa-text-foreground/50 hawa-transition-opacity hover:hawa-text-foreground focus:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 group-[.destructive]:hawa-text-red-300 group-[.destructive]:hover:hawa-text-red-50 group-[.destructive]:focus:hawa-ring-red-400 group-[.destructive]:focus:hawa-ring-offset-red-600\",\n className,\n )}\n toast-close=\"\"\n {...props}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-icon\"\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 </ToastPrimitives.Close>\n));\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Title>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Title\n ref={ref}\n className={cn(\n \"hawa-select-text hawa-text-sm hawa-font-semibold\",\n sizeStyles[size],\n className,\n )}\n {...props}\n />\n));\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Description>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Description\n ref={ref}\n className={cn(\n \"hawa-select-text hawa-opacity-90\",\n sizeStyles[size],\n className,\n )}\n {...props}\n />\n));\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\nexport type ToasterToastProps = ToastProps & {\n id: string;\n title?: React.ReactNode;\n description?: React.ReactNode;\n severity?: \"info\" | \"warning\" | \"error\" | \"success\" | \"none\";\n action?: ToastActionElement;\n size?: \"default\" | \"sm\";\n};\nexport {\n type ToastProps,\n type ToastActionElement,\n ToastProvider,\n ToastViewport,\n Toast,\n ToastTitle,\n ToastDescription,\n ToastClose,\n ToastAction,\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/toast/index.ts","../../elements/toast/Toast.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Toast\";\n","import * as React from \"react\";\n\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { cn } from \"@util/index\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst toastVariants = cva(\n \"hawa-group hawa-z-[900] hawa-pointer-events-auto hawa-relative hawa-flex hawa-w-full hawa-items-center hawa-justify-between hawa-overflow-hidden hawa-rounded-md hawa-border hawa-shadow-lg hawa-transition-all data-[swipe=cancel]:hawa-translate-x-0 data-[swipe=end]:hawa-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:hawa-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:hawa-transition-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[swipe=end]:hawa-animate-out data-[state=closed]:hawa-fade-out-80 data-[state=open]:hawa-slide-in-from-top-full data-[state=open]:sm:hawa-slide-in-from-bottom-full\",\n {\n variants: {\n variant: {\n default: \"hawa-border hawa-bg-background hawa-text-foreground\",\n destructive:\n \"hawa-destructive hawa-group hawa-border-destructive hawa-bg-destructive hawa-text-destructive-foreground\",\n },\n severity: {\n info: \"hawa-info hawa-group hawa-text-info-foreground hawa-bg-info\",\n warning: \"hawa-warning hawa-group hawa-text-warning-foreground hawa-bg-warning\",\n error: \"hawa-error hawa-group hawa-border-error hawa-bg-error hawa-text-white\",\n success: \"hawa-success hawa-group hawa-text-success-foreground hawa-bg-success\",\n none: \"\",\n },\n },\n\n defaultVariants: { variant: \"default\" },\n },\n);\n\nlet sizeStyles = {\n default: \"hawa-text-sm\", // Update this based on the desired padding for rtl\n sm: \"hawa-text-xs\",\n};\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Viewport>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Viewport\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-top-0 hawa-z-[100] hawa-flex hawa-max-h-screen hawa-w-full hawa-flex-col-reverse hawa-p-4 sm:hawa-bottom-0 sm:hawa-right-0 sm:hawa-top-auto sm:hawa-flex-col md:hawa-max-w-[420px]\",\n className,\n )}\n {...props}\n />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst Toast = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Root>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &\n VariantProps<typeof toastVariants> & {\n direction?: DirectionType;\n }\n>(({ className, variant, severity = \"none\", direction, ...props }, ref) => {\n return (\n <ToastPrimitives.Root\n ref={ref}\n className={cn(\n toastVariants({ variant, severity }),\n className,\n direction === \"rtl\"\n ? \"data-[state=closed]:hawa-slide-out-to-left-full\"\n : \"data-[state=closed]:hawa-slide-out-to-right-full\",\n )}\n dir={direction}\n {...props}\n />\n );\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Action>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>\n>(({ className, ...props }, ref) => {\n return (\n <ToastPrimitives.Action\n ref={ref}\n className={cn(\n \"hawa-inline-flex hawa-h-8 hawa-shrink-0 hawa-items-center hawa-justify-center hawa-rounded-md hawa-border hawa-bg-transparent hawa-px-3 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-colors hover:hawa-bg-secondary hover:hawa-text-secondary-foreground focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n \"group-[.info]:hawa-border-muted/40 group-[.info]:hover:hawa-border-info/30 group-[.info]:hover:hawa-bg-info group-[.info]:hover:hawa-text-info-foreground group-[.info]:focus:hawa-ring-info\",\n \"group-[.error]:hawa-border-muted/40 group-[.error]:hover:hawa-border-error/30 group-[.error]:hover:hawa-bg-error group-[.error]:hover:hawa-text-error-foreground group-[.error]:focus:hawa-ring-error\",\n \"group-[.success]:hawa-border-muted/40 group-[.success]:hover:hawa-border-success/30 group-[.success]:hover:hawa-bg-success group-[.success]:hover:hawa-text-success-foreground group-[.success]:focus:hawa-ring-success\",\n \"group-[.warning]:hawa-border-muted/40 group-[.warning]:hover:hawa-border-warning/30 group-[.warning]:hover:hawa-bg-warning group-[.warning]:hover:hawa-text-warning-foreground group-[.warning]:focus:hawa-ring-warning\",\n \"hawa-whitespace-nowrap\",\n className,\n )}\n {...props}\n />\n );\n});\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Close>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Close\n ref={ref}\n className={cn(\n // \"hawa-absolute hawa-start-2 hawa-top-2\",\n // \"group-hover:hawa-opacity-100\",\n \"hawa-opacity-100\",\n \"hawa-rounded-md hawa-p-1 hawa-text-foreground/50 hawa-transition-opacity hover:hawa-text-foreground focus:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 group-[.destructive]:hawa-text-red-300 group-[.destructive]:hover:hawa-text-red-50 group-[.destructive]:focus:hawa-ring-red-400 group-[.destructive]:focus:hawa-ring-offset-red-600\",\n className,\n )}\n toast-close=\"\"\n {...props}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-icon\"\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 </ToastPrimitives.Close>\n));\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Title>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Title\n ref={ref}\n className={cn(\"hawa-select-text hawa-text-sm hawa-font-semibold\", sizeStyles[size], className)}\n {...props}\n />\n));\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Description>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Description\n ref={ref}\n className={cn(\"hawa-select-text hawa-opacity-90\", sizeStyles[size], className)}\n {...props}\n />\n));\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\nexport type ToasterToastProps = ToastProps & {\n id: string;\n title?: React.ReactNode;\n description?: React.ReactNode;\n severity?: \"info\" | \"warning\" | \"error\" | \"success\" | \"none\";\n action?: ToastActionElement;\n size?: \"default\" | \"sm\";\n};\nexport {\n type ToastProps,\n type ToastActionElement,\n ToastProvider,\n ToastViewport,\n Toast,\n ToastTitle,\n ToastDescription,\n ToastClose,\n ToastAction,\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(sanitizedHex);\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16),\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\"),\n },\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49,\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;AAEvB,sBAAiC;;;ACFjC,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADDA,sCAAuC;AAIvC,IAAM,oBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,aACE;AAAA,MACJ;AAAA,MACA,UAAU;AAAA,QACR,MAAM;AAAA,QACN,SAAS;AAAA,QACT,OAAO;AAAA,QACP,SAAS;AAAA,QACT,MAAM;AAAA,MACR;AAAA,IACF;AAAA,IAEA,iBAAiB,EAAE,SAAS,UAAU;AAAA,EACxC;AACF;AAEA,IAAI,aAAa;AAAA,EACf,SAAS;AAAA;AAAA,EACT,IAAI;AACN;AACA,IAAM,gBAAgC;AAEtC,IAAM,gBAAsB,iBAG1B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAiB;AAAA,EAAhB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,cAAc,cAA8B,yBAAS;AAErD,IAAM,QAAc,iBAMlB,CAAC,EAAE,WAAW,SAAS,WAAW,QAAQ,WAAW,GAAG,MAAM,GAAG,QAAQ;AACzE,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,cAAc,EAAE,SAAS,SAAS,CAAC;AAAA,QACnC;AAAA,QACA,cAAc,QACV,oDACA;AAAA,MACN;AAAA,MACA,KAAK;AAAA,MACJ,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AACD,MAAM,cAA8B,qBAAK;AAEzC,IAAM,cAAoB,iBAGxB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ;AAClC,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AACD,YAAY,cAA8B,uBAAO;AAEjD,IAAM,aAAmB,iBAGvB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAiB;AAAA,EAAhB;AAAA,IACC;AAAA,IACA,WAAW;AAAA;AAAA;AAAA,MAGT;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,eAAY;AAAA,IACX,GAAG;AAAA;AAAA,EAEJ;AAAA,IAAC;AAAA;AAAA,MACC,cAAW;AAAA,MACX,eAAY;AAAA,MACZ,WAAU;AAAA,MACV,MAAK;AAAA,MACL,SAAQ;AAAA;AAAA,IAER;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,GAAE;AAAA,QACF,UAAS;AAAA;AAAA,IACV;AAAA,EACH;AACF,CACD;AACD,WAAW,cAA8B,sBAAM;AAE/C,IAAM,aAAmB,iBAKvB,CAAC,EAAE,WAAW,OAAO,WAAW,GAAG,MAAM,GAAG,QAC5C;AAAA,EAAiB;AAAA,EAAhB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,oDAAoD,WAAW,IAAI,GAAG,SAAS;AAAA,IAC5F,GAAG;AAAA;AACN,CACD;AACD,WAAW,cAA8B,sBAAM;AAE/C,IAAM,mBAAyB,iBAK7B,CAAC,EAAE,WAAW,OAAO,WAAW,GAAG,MAAM,GAAG,QAC5C;AAAA,EAAiB;AAAA,EAAhB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,oCAAoC,WAAW,IAAI,GAAG,SAAS;AAAA,IAC5E,GAAG;AAAA;AACN,CACD;AACD,iBAAiB,cAA8B,4BAAY;","names":[]}
|
package/dist/toast/index.mjs
CHANGED
@@ -123,11 +123,7 @@ var ToastTitle = React.forwardRef(({ className, size = "default", ...props }, re
|
|
123
123
|
ToastPrimitives.Title,
|
124
124
|
{
|
125
125
|
ref,
|
126
|
-
className: cn(
|
127
|
-
"hawa-select-text hawa-text-sm hawa-font-semibold",
|
128
|
-
sizeStyles[size],
|
129
|
-
className
|
130
|
-
),
|
126
|
+
className: cn("hawa-select-text hawa-text-sm hawa-font-semibold", sizeStyles[size], className),
|
131
127
|
...props
|
132
128
|
}
|
133
129
|
));
|
@@ -136,11 +132,7 @@ var ToastDescription = React.forwardRef(({ className, size = "default", ...props
|
|
136
132
|
ToastPrimitives.Description,
|
137
133
|
{
|
138
134
|
ref,
|
139
|
-
className: cn(
|
140
|
-
"hawa-select-text hawa-opacity-90",
|
141
|
-
sizeStyles[size],
|
142
|
-
className
|
143
|
-
),
|
135
|
+
className: cn("hawa-select-text hawa-opacity-90", sizeStyles[size], className),
|
144
136
|
...props
|
145
137
|
}
|
146
138
|
));
|
package/dist/toast/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/toast/Toast.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { cn } from \"@util/index\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst toastVariants = cva(\n \"hawa-group hawa-z-[900] hawa-pointer-events-auto hawa-relative hawa-flex hawa-w-full hawa-items-center hawa-justify-between hawa-overflow-hidden hawa-rounded-md hawa-border hawa-shadow-lg hawa-transition-all data-[swipe=cancel]:hawa-translate-x-0 data-[swipe=end]:hawa-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:hawa-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:hawa-transition-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[swipe=end]:hawa-animate-out data-[state=closed]:hawa-fade-out-80 data-[state=open]:hawa-slide-in-from-top-full data-[state=open]:sm:hawa-slide-in-from-bottom-full\",\n {\n variants: {\n variant: {\n default: \"hawa-border hawa-bg-background hawa-text-foreground\",\n destructive:\n \"hawa-destructive hawa-group hawa-border-destructive hawa-bg-destructive hawa-text-destructive-foreground\",\n },\n severity: {\n info: \"hawa-info hawa-group hawa-text-info-foreground hawa-bg-info\",\n warning:\n \"hawa-warning hawa-group hawa-text-warning-foreground hawa-bg-warning\",\n error:\n \"hawa-error hawa-group hawa-border-error hawa-bg-error hawa-text-white\",\n success:\n \"hawa-success hawa-group hawa-text-success-foreground hawa-bg-success\",\n none: \"\",\n },\n },\n\n defaultVariants: { variant: \"default\" },\n },\n);\n\nlet sizeStyles = {\n default: \"hawa-text-sm\", // Update this based on the desired padding for rtl\n sm: \"hawa-text-xs\",\n};\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Viewport>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Viewport\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-top-0 hawa-z-[100] hawa-flex hawa-max-h-screen hawa-w-full hawa-flex-col-reverse hawa-p-4 sm:hawa-bottom-0 sm:hawa-right-0 sm:hawa-top-auto sm:hawa-flex-col md:hawa-max-w-[420px]\",\n className,\n )}\n {...props}\n />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst Toast = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Root>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &\n VariantProps<typeof toastVariants> & {\n direction?: DirectionType;\n }\n>(({ className, variant, severity = \"none\", direction, ...props }, ref) => {\n return (\n <ToastPrimitives.Root\n ref={ref}\n className={cn(\n toastVariants({ variant, severity }),\n className,\n direction === \"rtl\"\n ? \"data-[state=closed]:hawa-slide-out-to-left-full\"\n : \"data-[state=closed]:hawa-slide-out-to-right-full\",\n )}\n dir={direction}\n {...props}\n />\n );\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Action>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>\n>(({ className, ...props }, ref) => {\n return (\n <ToastPrimitives.Action\n ref={ref}\n className={cn(\n \"hawa-inline-flex hawa-h-8 hawa-shrink-0 hawa-items-center hawa-justify-center hawa-rounded-md hawa-border hawa-bg-transparent hawa-px-3 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-colors hover:hawa-bg-secondary hover:hawa-text-secondary-foreground focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n \"group-[.info]:hawa-border-muted/40 group-[.info]:hover:hawa-border-info/30 group-[.info]:hover:hawa-bg-info group-[.info]:hover:hawa-text-info-foreground group-[.info]:focus:hawa-ring-info\",\n \"group-[.error]:hawa-border-muted/40 group-[.error]:hover:hawa-border-error/30 group-[.error]:hover:hawa-bg-error group-[.error]:hover:hawa-text-error-foreground group-[.error]:focus:hawa-ring-error\",\n \"group-[.success]:hawa-border-muted/40 group-[.success]:hover:hawa-border-success/30 group-[.success]:hover:hawa-bg-success group-[.success]:hover:hawa-text-success-foreground group-[.success]:focus:hawa-ring-success\",\n \"group-[.warning]:hawa-border-muted/40 group-[.warning]:hover:hawa-border-warning/30 group-[.warning]:hover:hawa-bg-warning group-[.warning]:hover:hawa-text-warning-foreground group-[.warning]:focus:hawa-ring-warning\",\n \"hawa-whitespace-nowrap\",\n className,\n )}\n {...props}\n />\n );\n});\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Close>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Close\n ref={ref}\n className={cn(\n // \"hawa-absolute hawa-start-2 hawa-top-2\",\n // \"group-hover:hawa-opacity-100\",\n \"hawa-opacity-100\",\n \"hawa-rounded-md hawa-p-1 hawa-text-foreground/50 hawa-transition-opacity hover:hawa-text-foreground focus:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 group-[.destructive]:hawa-text-red-300 group-[.destructive]:hover:hawa-text-red-50 group-[.destructive]:focus:hawa-ring-red-400 group-[.destructive]:focus:hawa-ring-offset-red-600\",\n className,\n )}\n toast-close=\"\"\n {...props}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-icon\"\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 </ToastPrimitives.Close>\n));\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Title>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Title\n ref={ref}\n className={cn(\n \"hawa-select-text hawa-text-sm hawa-font-semibold\",\n sizeStyles[size],\n className,\n )}\n {...props}\n />\n));\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Description>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Description\n ref={ref}\n className={cn(\n \"hawa-select-text hawa-opacity-90\",\n sizeStyles[size],\n className,\n )}\n {...props}\n />\n));\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\nexport type ToasterToastProps = ToastProps & {\n id: string;\n title?: React.ReactNode;\n description?: React.ReactNode;\n severity?: \"info\" | \"warning\" | \"error\" | \"success\" | \"none\";\n action?: ToastActionElement;\n size?: \"default\" | \"sm\";\n};\nexport {\n type ToastProps,\n type ToastActionElement,\n ToastProvider,\n ToastViewport,\n Toast,\n ToastTitle,\n ToastDescription,\n ToastClose,\n ToastAction,\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/toast/Toast.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { cn } from \"@util/index\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nconst toastVariants = cva(\n \"hawa-group hawa-z-[900] hawa-pointer-events-auto hawa-relative hawa-flex hawa-w-full hawa-items-center hawa-justify-between hawa-overflow-hidden hawa-rounded-md hawa-border hawa-shadow-lg hawa-transition-all data-[swipe=cancel]:hawa-translate-x-0 data-[swipe=end]:hawa-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:hawa-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:hawa-transition-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[swipe=end]:hawa-animate-out data-[state=closed]:hawa-fade-out-80 data-[state=open]:hawa-slide-in-from-top-full data-[state=open]:sm:hawa-slide-in-from-bottom-full\",\n {\n variants: {\n variant: {\n default: \"hawa-border hawa-bg-background hawa-text-foreground\",\n destructive:\n \"hawa-destructive hawa-group hawa-border-destructive hawa-bg-destructive hawa-text-destructive-foreground\",\n },\n severity: {\n info: \"hawa-info hawa-group hawa-text-info-foreground hawa-bg-info\",\n warning: \"hawa-warning hawa-group hawa-text-warning-foreground hawa-bg-warning\",\n error: \"hawa-error hawa-group hawa-border-error hawa-bg-error hawa-text-white\",\n success: \"hawa-success hawa-group hawa-text-success-foreground hawa-bg-success\",\n none: \"\",\n },\n },\n\n defaultVariants: { variant: \"default\" },\n },\n);\n\nlet sizeStyles = {\n default: \"hawa-text-sm\", // Update this based on the desired padding for rtl\n sm: \"hawa-text-xs\",\n};\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Viewport>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Viewport\n ref={ref}\n className={cn(\n \"hawa-fixed hawa-top-0 hawa-z-[100] hawa-flex hawa-max-h-screen hawa-w-full hawa-flex-col-reverse hawa-p-4 sm:hawa-bottom-0 sm:hawa-right-0 sm:hawa-top-auto sm:hawa-flex-col md:hawa-max-w-[420px]\",\n className,\n )}\n {...props}\n />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst Toast = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Root>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &\n VariantProps<typeof toastVariants> & {\n direction?: DirectionType;\n }\n>(({ className, variant, severity = \"none\", direction, ...props }, ref) => {\n return (\n <ToastPrimitives.Root\n ref={ref}\n className={cn(\n toastVariants({ variant, severity }),\n className,\n direction === \"rtl\"\n ? \"data-[state=closed]:hawa-slide-out-to-left-full\"\n : \"data-[state=closed]:hawa-slide-out-to-right-full\",\n )}\n dir={direction}\n {...props}\n />\n );\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Action>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>\n>(({ className, ...props }, ref) => {\n return (\n <ToastPrimitives.Action\n ref={ref}\n className={cn(\n \"hawa-inline-flex hawa-h-8 hawa-shrink-0 hawa-items-center hawa-justify-center hawa-rounded-md hawa-border hawa-bg-transparent hawa-px-3 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-colors hover:hawa-bg-secondary hover:hawa-text-secondary-foreground focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50\",\n \"group-[.info]:hawa-border-muted/40 group-[.info]:hover:hawa-border-info/30 group-[.info]:hover:hawa-bg-info group-[.info]:hover:hawa-text-info-foreground group-[.info]:focus:hawa-ring-info\",\n \"group-[.error]:hawa-border-muted/40 group-[.error]:hover:hawa-border-error/30 group-[.error]:hover:hawa-bg-error group-[.error]:hover:hawa-text-error-foreground group-[.error]:focus:hawa-ring-error\",\n \"group-[.success]:hawa-border-muted/40 group-[.success]:hover:hawa-border-success/30 group-[.success]:hover:hawa-bg-success group-[.success]:hover:hawa-text-success-foreground group-[.success]:focus:hawa-ring-success\",\n \"group-[.warning]:hawa-border-muted/40 group-[.warning]:hover:hawa-border-warning/30 group-[.warning]:hover:hawa-bg-warning group-[.warning]:hover:hawa-text-warning-foreground group-[.warning]:focus:hawa-ring-warning\",\n \"hawa-whitespace-nowrap\",\n className,\n )}\n {...props}\n />\n );\n});\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Close>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>\n>(({ className, ...props }, ref) => (\n <ToastPrimitives.Close\n ref={ref}\n className={cn(\n // \"hawa-absolute hawa-start-2 hawa-top-2\",\n // \"group-hover:hawa-opacity-100\",\n \"hawa-opacity-100\",\n \"hawa-rounded-md hawa-p-1 hawa-text-foreground/50 hawa-transition-opacity hover:hawa-text-foreground focus:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 group-[.destructive]:hawa-text-red-300 group-[.destructive]:hover:hawa-text-red-50 group-[.destructive]:focus:hawa-ring-red-400 group-[.destructive]:focus:hawa-ring-offset-red-600\",\n className,\n )}\n toast-close=\"\"\n {...props}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-icon\"\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 </ToastPrimitives.Close>\n));\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Title>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Title\n ref={ref}\n className={cn(\"hawa-select-text hawa-text-sm hawa-font-semibold\", sizeStyles[size], className)}\n {...props}\n />\n));\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n React.ElementRef<typeof ToastPrimitives.Description>,\n React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description> & {\n size: \"default\" | \"sm\";\n }\n>(({ className, size = \"default\", ...props }, ref) => (\n <ToastPrimitives.Description\n ref={ref}\n className={cn(\"hawa-select-text hawa-opacity-90\", sizeStyles[size], className)}\n {...props}\n />\n));\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\nexport type ToasterToastProps = ToastProps & {\n id: string;\n title?: React.ReactNode;\n description?: React.ReactNode;\n severity?: \"info\" | \"warning\" | \"error\" | \"success\" | \"none\";\n action?: ToastActionElement;\n size?: \"default\" | \"sm\";\n};\nexport {\n type ToastProps,\n type ToastActionElement,\n ToastProvider,\n ToastViewport,\n Toast,\n ToastTitle,\n ToastDescription,\n ToastClose,\n ToastAction,\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(sanitizedHex);\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16),\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\"),\n },\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49,\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n"],"mappings":"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","names":[]}
|
package/dist/toaster/index.js
CHANGED
@@ -159,11 +159,7 @@ var ToastTitle = React.forwardRef(({ className, size = "default", ...props }, re
|
|
159
159
|
ToastPrimitives.Title,
|
160
160
|
{
|
161
161
|
ref,
|
162
|
-
className: cn(
|
163
|
-
"hawa-select-text hawa-text-sm hawa-font-semibold",
|
164
|
-
sizeStyles[size],
|
165
|
-
className
|
166
|
-
),
|
162
|
+
className: cn("hawa-select-text hawa-text-sm hawa-font-semibold", sizeStyles[size], className),
|
167
163
|
...props
|
168
164
|
}
|
169
165
|
));
|
@@ -172,11 +168,7 @@ var ToastDescription = React.forwardRef(({ className, size = "default", ...props
|
|
172
168
|
ToastPrimitives.Description,
|
173
169
|
{
|
174
170
|
ref,
|
175
|
-
className: cn(
|
176
|
-
"hawa-select-text hawa-opacity-90",
|
177
|
-
sizeStyles[size],
|
178
|
-
className
|
179
|
-
),
|
171
|
+
className: cn("hawa-select-text hawa-opacity-90", sizeStyles[size], className),
|
180
172
|
...props
|
181
173
|
}
|
182
174
|
));
|
@@ -216,12 +208,7 @@ function Toaster(props) {
|
|
216
208
|
action && /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-flex-col hawa-justify-center" }, action)
|
217
209
|
)
|
218
210
|
));
|
219
|
-
}), /* @__PURE__ */ import_react.default.createElement(
|
220
|
-
ToastViewport,
|
221
|
-
{
|
222
|
-
className: cn("hawa-gap-2", isRTL && "hawa-fixed hawa-left-0")
|
223
|
-
}
|
224
|
-
));
|
211
|
+
}), /* @__PURE__ */ import_react.default.createElement(ToastViewport, { className: cn("hawa-gap-2", isRTL && "hawa-fixed hawa-left-0") }));
|
225
212
|
}
|
226
213
|
// Annotate the CommonJS export names for ESM import in node:
|
227
214
|
0 && (module.exports = {
|