@sikka/hawa 0.43.0 → 0.43.1-next
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/appLayout/index.d.mts +1 -1
- package/dist/appLayout/index.d.ts +1 -1
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/blocks/auth/index.js +2 -2
- package/dist/blocks/auth/index.mjs +4 -4
- package/dist/blocks/feedback/index.js +2 -2
- package/dist/blocks/feedback/index.mjs +5 -5
- package/dist/blocks/index.js +2 -2
- package/dist/blocks/index.mjs +2 -2
- package/dist/blocks/misc/index.js +2 -2
- package/dist/blocks/misc/index.mjs +5 -5
- package/dist/blocks/pricing/index.js +2 -2
- package/dist/blocks/pricing/index.mjs +4 -4
- package/dist/card/index.js +2 -2
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +2 -2
- package/dist/card/index.mjs.map +1 -1
- package/dist/{chunk-RE6OFIBP.mjs → chunk-3I6DTCGJ.mjs} +1 -1
- package/dist/{chunk-UP7VUUVQ.mjs → chunk-4SEU2OBJ.mjs} +1 -1
- package/dist/{chunk-2NFENSLV.mjs → chunk-5X6V6BFC.mjs} +1 -1
- package/dist/{chunk-BTIMHZXM.mjs → chunk-A7JXCQLS.mjs} +1 -1
- package/dist/{chunk-YHVUX2MP.mjs → chunk-EP42BEIJ.mjs} +1 -1
- package/dist/{chunk-GGWTBYZF.mjs → chunk-KFJSUYMZ.mjs} +2 -2
- package/dist/{chunk-DDWOF6SP.mjs → chunk-PZ6LGLUF.mjs} +1 -1
- package/dist/{chunk-FIBEENJA.mjs → chunk-REZBAB65.mjs} +1 -1
- package/dist/{chunk-O356IC37.mjs → chunk-S3F3NZSV.mjs} +1 -1
- package/dist/{chunk-5MN7WB7B.mjs → chunk-SLEEOH6M.mjs} +2 -2
- package/dist/destroyableCard/index.js +2 -2
- package/dist/destroyableCard/index.js.map +1 -1
- package/dist/destroyableCard/index.mjs +2 -2
- package/dist/destroyableCard/index.mjs.map +1 -1
- package/dist/elements/index.js +2 -2
- package/dist/elements/index.mjs +3 -3
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/index.mjs +2 -2
- package/dist/layout/index.d.mts +1 -1
- package/dist/layout/index.d.ts +1 -1
- package/dist/layout/index.js +2 -2
- package/dist/layout/index.mjs +2 -2
- package/dist/stats/index.js +2 -2
- package/dist/stats/index.js.map +1 -1
- package/dist/stats/index.mjs +2 -2
- package/dist/stats/index.mjs.map +1 -1
- package/package.json +1 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../elements/destroyableCard/DestroyableCard.tsx","../../util/index.ts","../../elements/card/Card.tsx"],"sourcesContent":["import React, { FC, useRef, useState } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Card, CardContent } from \"../card\";\n\ntype DestroyableCard = {\n position?: \"bottom-right\" | \"bottom-left\";\n direction?: DirectionType;\n fixed?: boolean;\n children?: any;\n};\nexport const DestroyableCard: FC<DestroyableCard> = ({\n position = \"bottom-right\",\n fixed,\n direction,\n ...props\n}) => {\n const [closed, setClosed] = useState(false);\n const popUpRef = useRef<HTMLDivElement>(null);\n\n const boxPosition = {\n \"bottom-right\": \"hawa-right-4 hawa-bottom-4\",\n \"bottom-left\": \"hawa-left-4 hawa-bottom-4\",\n };\n\n return (\n <div\n className={cn(\n \"hawa-transition-all\",\n closed ? \"hawa-opacity-0\" : \"hawa-opacity-100\",\n )}\n ref={popUpRef}\n >\n <Card\n className={cn(\n fixed ? \"hawa-fixed\" : \"hawa-relative\",\n fixed && position && boxPosition[position],\n )}\n dir={direction}\n >\n <button\n type=\"button\"\n className={cn(\n direction === \"rtl\" ? \"hawa-left-2\" : \"hawa-right-2\",\n \"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white\",\n )}\n data-dismiss-target=\"#destroyable-card\"\n aria-label=\"Close\"\n onClick={() => {\n setClosed(true);\n setTimeout(() => {\n if (popUpRef?.current) {\n popUpRef?.current.removeChild(popUpRef?.current.children[0]);\n }\n }, 200);\n }}\n >\n <svg\n aria-hidden=\"true\"\n className=\"hawa-h-5 hawa-w-5\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n </button>\n <CardContent headless>{props.children}</CardContent>\n </Card>\n </div>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(className, !asContainer && variantStyles[variant])}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n"],"mappings":"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","names":["React","React"]}
|
1
|
+
{"version":3,"sources":["../../elements/destroyableCard/DestroyableCard.tsx","../../util/index.ts","../../elements/card/Card.tsx"],"sourcesContent":["import React, { FC, useRef, useState } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Card, CardContent } from \"../card\";\n\ntype DestroyableCard = {\n position?: \"bottom-right\" | \"bottom-left\";\n direction?: DirectionType;\n fixed?: boolean;\n children?: any;\n};\nexport const DestroyableCard: FC<DestroyableCard> = ({\n position = \"bottom-right\",\n fixed,\n direction,\n ...props\n}) => {\n const [closed, setClosed] = useState(false);\n const popUpRef = useRef<HTMLDivElement>(null);\n\n const boxPosition = {\n \"bottom-right\": \"hawa-right-4 hawa-bottom-4\",\n \"bottom-left\": \"hawa-left-4 hawa-bottom-4\",\n };\n\n return (\n <div\n className={cn(\n \"hawa-transition-all\",\n closed ? \"hawa-opacity-0\" : \"hawa-opacity-100\",\n )}\n ref={popUpRef}\n >\n <Card\n className={cn(\n fixed ? \"hawa-fixed\" : \"hawa-relative\",\n fixed && position && boxPosition[position],\n )}\n dir={direction}\n >\n <button\n type=\"button\"\n className={cn(\n direction === \"rtl\" ? \"hawa-left-2\" : \"hawa-right-2\",\n \"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white\",\n )}\n data-dismiss-target=\"#destroyable-card\"\n aria-label=\"Close\"\n onClick={() => {\n setClosed(true);\n setTimeout(() => {\n if (popUpRef?.current) {\n popUpRef?.current.removeChild(popUpRef?.current.children[0]);\n }\n }, 200);\n }}\n >\n <svg\n aria-hidden=\"true\"\n className=\"hawa-h-5 hawa-w-5\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n </button>\n <CardContent headless>{props.children}</CardContent>\n </Card>\n </div>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(!asContainer && variantStyles[variant], className)}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n"],"mappings":"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","names":["React","React"]}
|
package/dist/elements/index.js
CHANGED
@@ -223,7 +223,7 @@ var Card = React.forwardRef(
|
|
223
223
|
}, ref) => {
|
224
224
|
let variantStyles = {
|
225
225
|
default: cn(
|
226
|
-
"hawa-rounded
|
226
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
227
227
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
228
228
|
),
|
229
229
|
neoBrutalism: cn(
|
@@ -236,7 +236,7 @@ var Card = React.forwardRef(
|
|
236
236
|
"div",
|
237
237
|
{
|
238
238
|
ref,
|
239
|
-
className: cn(
|
239
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
240
240
|
...props
|
241
241
|
}
|
242
242
|
);
|
package/dist/elements/index.mjs
CHANGED
@@ -26,7 +26,7 @@ import {
|
|
26
26
|
TabsList,
|
27
27
|
TabsTrigger,
|
28
28
|
Textarea
|
29
|
-
} from "../chunk-
|
29
|
+
} from "../chunk-3I6DTCGJ.mjs";
|
30
30
|
import {
|
31
31
|
useClipboard
|
32
32
|
} from "../chunk-WL7C2A5D.mjs";
|
@@ -41,7 +41,7 @@ import {
|
|
41
41
|
SheetPortal,
|
42
42
|
SheetTitle,
|
43
43
|
SheetTrigger
|
44
|
-
} from "../chunk-
|
44
|
+
} from "../chunk-EP42BEIJ.mjs";
|
45
45
|
import {
|
46
46
|
Button,
|
47
47
|
Card,
|
@@ -81,7 +81,7 @@ import {
|
|
81
81
|
buttonVariants,
|
82
82
|
calculateLuminance,
|
83
83
|
cn
|
84
|
-
} from "../chunk-
|
84
|
+
} from "../chunk-KFJSUYMZ.mjs";
|
85
85
|
import {
|
86
86
|
__require
|
87
87
|
} from "../chunk-2LUXOXAL.mjs";
|
package/dist/index.d.mts
CHANGED
@@ -1350,7 +1350,7 @@ type AppLayoutTypes$1 = {
|
|
1350
1350
|
/** The title of the current selected page, make sure it's the same as the drawerItem slug */
|
1351
1351
|
currentPage: string;
|
1352
1352
|
/** Specifies the title of the page. */
|
1353
|
-
pageTitle?: string;
|
1353
|
+
pageTitle?: string | React__default.ReactNode;
|
1354
1354
|
/** Specifies the symbol for the logo. */
|
1355
1355
|
logoSymbol?: any;
|
1356
1356
|
/** Specifies the link for the logo. */
|
package/dist/index.d.ts
CHANGED
@@ -1350,7 +1350,7 @@ type AppLayoutTypes$1 = {
|
|
1350
1350
|
/** The title of the current selected page, make sure it's the same as the drawerItem slug */
|
1351
1351
|
currentPage: string;
|
1352
1352
|
/** Specifies the title of the page. */
|
1353
|
-
pageTitle?: string;
|
1353
|
+
pageTitle?: string | React__default.ReactNode;
|
1354
1354
|
/** Specifies the symbol for the logo. */
|
1355
1355
|
logoSymbol?: any;
|
1356
1356
|
/** Specifies the link for the logo. */
|
package/dist/index.js
CHANGED
@@ -298,7 +298,7 @@ var Card = React.forwardRef(
|
|
298
298
|
}, ref) => {
|
299
299
|
let variantStyles = {
|
300
300
|
default: cn(
|
301
|
-
"hawa-rounded
|
301
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
302
302
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
303
303
|
),
|
304
304
|
neoBrutalism: cn(
|
@@ -311,7 +311,7 @@ var Card = React.forwardRef(
|
|
311
311
|
"div",
|
312
312
|
{
|
313
313
|
ref,
|
314
|
-
className: cn(
|
314
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
315
315
|
...props
|
316
316
|
}
|
317
317
|
);
|
package/dist/index.mjs
CHANGED
@@ -46,7 +46,7 @@ var Card = React.forwardRef(
|
|
46
46
|
}, ref) => {
|
47
47
|
let variantStyles = {
|
48
48
|
default: cn(
|
49
|
-
"hawa-rounded
|
49
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
50
50
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
51
51
|
),
|
52
52
|
neoBrutalism: cn(
|
@@ -59,7 +59,7 @@ var Card = React.forwardRef(
|
|
59
59
|
"div",
|
60
60
|
{
|
61
61
|
ref,
|
62
|
-
className: cn(
|
62
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
63
63
|
...props
|
64
64
|
}
|
65
65
|
);
|
package/dist/layout/index.d.mts
CHANGED
@@ -110,7 +110,7 @@ type AppLayoutTypes$1 = {
|
|
110
110
|
/** The title of the current selected page, make sure it's the same as the drawerItem slug */
|
111
111
|
currentPage: string;
|
112
112
|
/** Specifies the title of the page. */
|
113
|
-
pageTitle?: string;
|
113
|
+
pageTitle?: string | React__default.ReactNode;
|
114
114
|
/** Specifies the symbol for the logo. */
|
115
115
|
logoSymbol?: any;
|
116
116
|
/** Specifies the link for the logo. */
|
package/dist/layout/index.d.ts
CHANGED
@@ -110,7 +110,7 @@ type AppLayoutTypes$1 = {
|
|
110
110
|
/** The title of the current selected page, make sure it's the same as the drawerItem slug */
|
111
111
|
currentPage: string;
|
112
112
|
/** Specifies the title of the page. */
|
113
|
-
pageTitle?: string;
|
113
|
+
pageTitle?: string | React__default.ReactNode;
|
114
114
|
/** Specifies the symbol for the logo. */
|
115
115
|
logoSymbol?: any;
|
116
116
|
/** Specifies the link for the logo. */
|
package/dist/layout/index.js
CHANGED
@@ -82,7 +82,7 @@ var Card = React.forwardRef(
|
|
82
82
|
}, ref) => {
|
83
83
|
let variantStyles = {
|
84
84
|
default: cn(
|
85
|
-
"hawa-rounded
|
85
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
86
86
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
87
87
|
),
|
88
88
|
neoBrutalism: cn(
|
@@ -95,7 +95,7 @@ var Card = React.forwardRef(
|
|
95
95
|
"div",
|
96
96
|
{
|
97
97
|
ref,
|
98
|
-
className: cn(
|
98
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
99
99
|
...props
|
100
100
|
}
|
101
101
|
);
|
package/dist/layout/index.mjs
CHANGED
@@ -3,7 +3,7 @@ import {
|
|
3
3
|
Sheet,
|
4
4
|
SheetContent,
|
5
5
|
SheetTrigger
|
6
|
-
} from "../chunk-
|
6
|
+
} from "../chunk-EP42BEIJ.mjs";
|
7
7
|
import {
|
8
8
|
Button,
|
9
9
|
Card,
|
@@ -16,7 +16,7 @@ import {
|
|
16
16
|
Skeleton,
|
17
17
|
Tooltip,
|
18
18
|
cn
|
19
|
-
} from "../chunk-
|
19
|
+
} from "../chunk-KFJSUYMZ.mjs";
|
20
20
|
import {
|
21
21
|
useBreakpoint,
|
22
22
|
useClickOutside
|
package/dist/stats/index.js
CHANGED
@@ -57,7 +57,7 @@ var Card = React.forwardRef(
|
|
57
57
|
}, ref) => {
|
58
58
|
let variantStyles = {
|
59
59
|
default: cn(
|
60
|
-
"hawa-rounded
|
60
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
61
61
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
62
62
|
),
|
63
63
|
neoBrutalism: cn(
|
@@ -70,7 +70,7 @@ var Card = React.forwardRef(
|
|
70
70
|
"div",
|
71
71
|
{
|
72
72
|
ref,
|
73
|
-
className: cn(
|
73
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
74
74
|
...props
|
75
75
|
}
|
76
76
|
);
|
package/dist/stats/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/stats/index.ts","../../layout/stats/Stats.tsx","../../util/index.ts","../../elements/card/Card.tsx","../../elements/skeleton/Skeleton.tsx"],"sourcesContent":["export * from \"./Stats\";\n","import React, { FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Card, CardContent, CardTitle } from \"@elements/card\";\nimport { Skeleton } from \"@elements/skeleton\";\n\ninterface StatTypes extends React.HTMLAttributes<HTMLDivElement> {\n label?: string;\n color?: string;\n number?: string;\n helperText?: any;\n helperTextColor?: \"default\" | \"positive\" | \"negative\" | \"muted\";\n chart?: any;\n icon?: React.ReactNode;\n variant?:\n | \"default\"\n | \"plain\"\n | \"contained\"\n | \"outlined\"\n | \"brutalist\"\n | \"dropshadow\";\n width?: \"full\" | \"min\" | \"normal\";\n isLoading?: boolean;\n className?: string;\n clickable?: boolean;\n}\nexport const Stats: FC<StatTypes> = ({\n label,\n icon,\n isLoading,\n number,\n helperText,\n helperTextColor = \"default\",\n chart,\n clickable,\n variant = \"default\",\n ...props\n}) => {\n let helperTextColorStyles = {\n default: \"\",\n positive: \"hawa-text-green-600 dark:hawa-text-green-500\",\n negative: \"hawa-text-red-600 dark:hawa-text-red-500\",\n muted: \"hawa-text-muted-foreground\",\n };\n return (\n <Card {...props} clickable={clickable}>\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-justify-between hawa-p-4 hawa-px-6\">\n <CardTitle className=\"hawa-text-sm hawa-font-medium\">{label}</CardTitle>\n {icon && <span>{icon}</span>}\n </div>\n <CardContent className=\"hawa-transition-all\">\n {isLoading ? (\n <Skeleton className=\"hawa-h-8 hawa-w-3/4\" />\n ) : (\n <div className=\"hawa-text-2xl hawa-font-bold\">{number}</div>\n )}\n {helperText && (\n <div\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-transition-all\",\n helperTextColorStyles[helperTextColor],\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n helperText\n )}\n </div>\n )}\n {chart &&\n (isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n chart\n ))}\n </CardContent>\n </Card>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(className, !asContainer && variantStyles[variant])}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n","import 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}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\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 return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n"],"mappings":"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","names":["import_react","React","React"]}
|
1
|
+
{"version":3,"sources":["../../layout/stats/index.ts","../../layout/stats/Stats.tsx","../../util/index.ts","../../elements/card/Card.tsx","../../elements/skeleton/Skeleton.tsx"],"sourcesContent":["export * from \"./Stats\";\n","import React, { FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Card, CardContent, CardTitle } from \"@elements/card\";\nimport { Skeleton } from \"@elements/skeleton\";\n\ninterface StatTypes extends React.HTMLAttributes<HTMLDivElement> {\n label?: string;\n color?: string;\n number?: string;\n helperText?: any;\n helperTextColor?: \"default\" | \"positive\" | \"negative\" | \"muted\";\n chart?: any;\n icon?: React.ReactNode;\n variant?:\n | \"default\"\n | \"plain\"\n | \"contained\"\n | \"outlined\"\n | \"brutalist\"\n | \"dropshadow\";\n width?: \"full\" | \"min\" | \"normal\";\n isLoading?: boolean;\n className?: string;\n clickable?: boolean;\n}\nexport const Stats: FC<StatTypes> = ({\n label,\n icon,\n isLoading,\n number,\n helperText,\n helperTextColor = \"default\",\n chart,\n clickable,\n variant = \"default\",\n ...props\n}) => {\n let helperTextColorStyles = {\n default: \"\",\n positive: \"hawa-text-green-600 dark:hawa-text-green-500\",\n negative: \"hawa-text-red-600 dark:hawa-text-red-500\",\n muted: \"hawa-text-muted-foreground\",\n };\n return (\n <Card {...props} clickable={clickable}>\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-justify-between hawa-p-4 hawa-px-6\">\n <CardTitle className=\"hawa-text-sm hawa-font-medium\">{label}</CardTitle>\n {icon && <span>{icon}</span>}\n </div>\n <CardContent className=\"hawa-transition-all\">\n {isLoading ? (\n <Skeleton className=\"hawa-h-8 hawa-w-3/4\" />\n ) : (\n <div className=\"hawa-text-2xl hawa-font-bold\">{number}</div>\n )}\n {helperText && (\n <div\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-transition-all\",\n helperTextColorStyles[helperTextColor],\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n helperText\n )}\n </div>\n )}\n {chart &&\n (isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n chart\n ))}\n </CardContent>\n </Card>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(!asContainer && variantStyles[variant], className)}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n","import 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}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\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 return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n"],"mappings":"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","names":["import_react","React","React"]}
|
package/dist/stats/index.mjs
CHANGED
@@ -22,7 +22,7 @@ var Card = React.forwardRef(
|
|
22
22
|
}, ref) => {
|
23
23
|
let variantStyles = {
|
24
24
|
default: cn(
|
25
|
-
"hawa-rounded
|
25
|
+
"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
|
26
26
|
clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
|
27
27
|
),
|
28
28
|
neoBrutalism: cn(
|
@@ -35,7 +35,7 @@ var Card = React.forwardRef(
|
|
35
35
|
"div",
|
36
36
|
{
|
37
37
|
ref,
|
38
|
-
className: cn(
|
38
|
+
className: cn(!asContainer && variantStyles[variant], className),
|
39
39
|
...props
|
40
40
|
}
|
41
41
|
);
|
package/dist/stats/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/stats/Stats.tsx","../../util/index.ts","../../elements/card/Card.tsx","../../elements/skeleton/Skeleton.tsx"],"sourcesContent":["import React, { FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Card, CardContent, CardTitle } from \"@elements/card\";\nimport { Skeleton } from \"@elements/skeleton\";\n\ninterface StatTypes extends React.HTMLAttributes<HTMLDivElement> {\n label?: string;\n color?: string;\n number?: string;\n helperText?: any;\n helperTextColor?: \"default\" | \"positive\" | \"negative\" | \"muted\";\n chart?: any;\n icon?: React.ReactNode;\n variant?:\n | \"default\"\n | \"plain\"\n | \"contained\"\n | \"outlined\"\n | \"brutalist\"\n | \"dropshadow\";\n width?: \"full\" | \"min\" | \"normal\";\n isLoading?: boolean;\n className?: string;\n clickable?: boolean;\n}\nexport const Stats: FC<StatTypes> = ({\n label,\n icon,\n isLoading,\n number,\n helperText,\n helperTextColor = \"default\",\n chart,\n clickable,\n variant = \"default\",\n ...props\n}) => {\n let helperTextColorStyles = {\n default: \"\",\n positive: \"hawa-text-green-600 dark:hawa-text-green-500\",\n negative: \"hawa-text-red-600 dark:hawa-text-red-500\",\n muted: \"hawa-text-muted-foreground\",\n };\n return (\n <Card {...props} clickable={clickable}>\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-justify-between hawa-p-4 hawa-px-6\">\n <CardTitle className=\"hawa-text-sm hawa-font-medium\">{label}</CardTitle>\n {icon && <span>{icon}</span>}\n </div>\n <CardContent className=\"hawa-transition-all\">\n {isLoading ? (\n <Skeleton className=\"hawa-h-8 hawa-w-3/4\" />\n ) : (\n <div className=\"hawa-text-2xl hawa-font-bold\">{number}</div>\n )}\n {helperText && (\n <div\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-transition-all\",\n helperTextColorStyles[helperTextColor],\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n helperText\n )}\n </div>\n )}\n {chart &&\n (isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n chart\n ))}\n </CardContent>\n </Card>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(className, !asContainer && variantStyles[variant])}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n","import 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}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\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 return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n"],"mappings":"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","names":["React","React","React","React"]}
|
1
|
+
{"version":3,"sources":["../../layout/stats/Stats.tsx","../../util/index.ts","../../elements/card/Card.tsx","../../elements/skeleton/Skeleton.tsx"],"sourcesContent":["import React, { FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { Card, CardContent, CardTitle } from \"@elements/card\";\nimport { Skeleton } from \"@elements/skeleton\";\n\ninterface StatTypes extends React.HTMLAttributes<HTMLDivElement> {\n label?: string;\n color?: string;\n number?: string;\n helperText?: any;\n helperTextColor?: \"default\" | \"positive\" | \"negative\" | \"muted\";\n chart?: any;\n icon?: React.ReactNode;\n variant?:\n | \"default\"\n | \"plain\"\n | \"contained\"\n | \"outlined\"\n | \"brutalist\"\n | \"dropshadow\";\n width?: \"full\" | \"min\" | \"normal\";\n isLoading?: boolean;\n className?: string;\n clickable?: boolean;\n}\nexport const Stats: FC<StatTypes> = ({\n label,\n icon,\n isLoading,\n number,\n helperText,\n helperTextColor = \"default\",\n chart,\n clickable,\n variant = \"default\",\n ...props\n}) => {\n let helperTextColorStyles = {\n default: \"\",\n positive: \"hawa-text-green-600 dark:hawa-text-green-500\",\n negative: \"hawa-text-red-600 dark:hawa-text-red-500\",\n muted: \"hawa-text-muted-foreground\",\n };\n return (\n <Card {...props} clickable={clickable}>\n <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-justify-between hawa-p-4 hawa-px-6\">\n <CardTitle className=\"hawa-text-sm hawa-font-medium\">{label}</CardTitle>\n {icon && <span>{icon}</span>}\n </div>\n <CardContent className=\"hawa-transition-all\">\n {isLoading ? (\n <Skeleton className=\"hawa-h-8 hawa-w-3/4\" />\n ) : (\n <div className=\"hawa-text-2xl hawa-font-bold\">{number}</div>\n )}\n {helperText && (\n <div\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-transition-all\",\n helperTextColorStyles[helperTextColor],\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\",\n )}\n >\n {isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n helperText\n )}\n </div>\n )}\n {chart &&\n (isLoading ? (\n <Skeleton className=\"hawa-mt-2 hawa-h-4 hawa-w-1/2\" />\n ) : (\n chart\n ))}\n </CardContent>\n </Card>\n );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n clickable?: boolean;\n variant?: \"default\" | \"neoBrutalism\";\n asContainer?: boolean;\n}\n\ntype CardContentProps = {\n headless?: boolean;\n noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n (\n {\n className,\n variant = \"default\",\n clickable = false,\n asContainer = false,\n ...props\n },\n ref,\n ) => {\n let variantStyles = {\n default: cn(\n \"hawa-rounded hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n clickable &&\n \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\",\n ),\n neoBrutalism: cn(\n \"neo-brutalism\",\n // \"hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n clickable &&\n \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\",\n ),\n };\n return (\n <div\n ref={ref}\n className={cn(!asContainer && variantStyles[variant], className)}\n {...props}\n />\n );\n },\n);\n\ntype CardHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n actions?: React.ReactNode;\n};\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, ...props }, ref) => (\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n <div\n ref={ref}\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n className,\n )}\n {...props}\n />\n {props.actions && <div className=\"hawa-p-6\">{props.actions}</div>}\n </div>\n ),\n);\nconst CardTitle = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n className={cn(\"hawa-text-2xl hawa-font-semibold\", className)}\n {...props}\n />\n));\nconst CardDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n <p\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n ({ headless, noPadding, className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n className,\n )}\n {...props}\n />\n ),\n);\nconst CardFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement> & { noPadding?: boolean }\n>(({ className, noPadding, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n \"hawa-flex hawa-items-center hawa-pt-0\",\n className,\n )}\n {...props}\n />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n CardDescription,\n CardContent,\n CardHeader,\n CardFooter,\n CardTitle,\n Card,\n};\n","import 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}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\n fade,\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 return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n fade && fadeStyle[fade],\n className,\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n"],"mappings":"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","names":["React","React","React","React"]}
|