@sikka/hawa 0.26.28 → 0.26.30
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 +1 -0
- package/dist/accordion/index.js.map +1 -0
- package/dist/accordion/index.mjs +2 -1
- package/dist/accordion/index.mjs.map +1 -0
- package/dist/alert/index.js +5 -4
- package/dist/alert/index.js.map +1 -0
- package/dist/alert/index.mjs +6 -5
- package/dist/alert/index.mjs.map +1 -0
- package/dist/appLayout/index.js +2 -2
- package/dist/appLayout/index.js.map +1 -0
- package/dist/appLayout/index.mjs +3 -3
- package/dist/appLayout/index.mjs.map +1 -0
- package/dist/appMenubar/index.js +1 -0
- package/dist/appMenubar/index.js.map +1 -0
- package/dist/appMenubar/index.mjs +2 -1
- package/dist/appMenubar/index.mjs.map +1 -0
- package/dist/appStores/index.js +1 -0
- package/dist/appStores/index.js.map +1 -0
- package/dist/appStores/index.mjs +1 -0
- package/dist/appStores/index.mjs.map +1 -0
- package/dist/appTabs/index.js +1 -0
- package/dist/appTabs/index.js.map +1 -0
- package/dist/appTabs/index.mjs +2 -1
- package/dist/appTabs/index.mjs.map +1 -0
- package/dist/appTopbar/index.js +1 -0
- package/dist/appTopbar/index.js.map +1 -0
- package/dist/appTopbar/index.mjs +2 -1
- package/dist/appTopbar/index.mjs.map +1 -0
- package/dist/avatar/index.js +2 -2
- package/dist/avatar/index.js.map +1 -0
- package/dist/avatar/index.mjs +3 -3
- package/dist/avatar/index.mjs.map +1 -0
- package/dist/backToTop/index.js +4 -6
- package/dist/backToTop/index.js.map +1 -0
- package/dist/backToTop/index.mjs +5 -7
- package/dist/backToTop/index.mjs.map +1 -0
- package/dist/badge/index.js +4 -4
- package/dist/badge/index.js.map +1 -0
- package/dist/badge/index.mjs +5 -5
- package/dist/badge/index.mjs.map +1 -0
- package/dist/breadcrumb/index.js +1 -0
- package/dist/breadcrumb/index.js.map +1 -0
- package/dist/breadcrumb/index.mjs +1 -0
- package/dist/breadcrumb/index.mjs.map +1 -0
- package/dist/button/index.js +1 -0
- package/dist/button/index.js.map +1 -0
- package/dist/button/index.mjs +2 -1
- package/dist/button/index.mjs.map +1 -0
- package/dist/card/index.js +1 -0
- package/dist/card/index.js.map +1 -0
- package/dist/card/index.mjs +2 -1
- package/dist/card/index.mjs.map +1 -0
- package/dist/carousel/index.js +11 -10
- package/dist/carousel/index.js.map +1 -0
- package/dist/carousel/index.mjs +12 -11
- package/dist/carousel/index.mjs.map +1 -0
- package/dist/checkbox/index.js +1 -0
- package/dist/checkbox/index.js.map +1 -0
- package/dist/checkbox/index.mjs +2 -1
- package/dist/checkbox/index.mjs.map +1 -0
- package/dist/chip/index.js +1 -0
- package/dist/chip/index.js.map +1 -0
- package/dist/chip/index.mjs +2 -1
- package/dist/chip/index.mjs.map +1 -0
- package/dist/chunk-3ODWQVIA.mjs +12 -0
- package/dist/chunk-3ODWQVIA.mjs.map +1 -0
- package/dist/{chunk-TGZRVRLP.mjs → chunk-53OZVR57.mjs} +1 -0
- package/dist/chunk-53OZVR57.mjs.map +1 -0
- package/dist/{chunk-TWNGV3RE.mjs → chunk-CBRGWUZG.mjs} +1 -0
- package/dist/chunk-CBRGWUZG.mjs.map +1 -0
- package/dist/{chunk-65TG6EVD.mjs → chunk-HYXZRCZW.mjs} +1 -0
- package/dist/chunk-HYXZRCZW.mjs.map +1 -0
- package/dist/{chunk-SJ2Z6ZOG.mjs → chunk-JX5YLRCU.mjs} +1 -0
- package/dist/chunk-JX5YLRCU.mjs.map +1 -0
- package/dist/{chunk-2R7F2GL7.mjs → chunk-NV3KR5Y7.mjs} +2 -2
- package/dist/chunk-NV3KR5Y7.mjs.map +1 -0
- package/dist/{chunk-KMCIHW76.mjs → chunk-OQ7MNEYW.mjs} +4 -3
- package/dist/chunk-OQ7MNEYW.mjs.map +1 -0
- package/dist/codeBlock/index.js +1 -0
- package/dist/codeBlock/index.js.map +1 -0
- package/dist/codeBlock/index.mjs +3 -2
- package/dist/codeBlock/index.mjs.map +1 -0
- package/dist/collapsible/index.js +1 -0
- package/dist/collapsible/index.js.map +1 -0
- package/dist/collapsible/index.mjs +2 -1
- package/dist/collapsible/index.mjs.map +1 -0
- package/dist/colorPicker/index.js +2 -2
- package/dist/colorPicker/index.js.map +1 -0
- package/dist/colorPicker/index.mjs +3 -2
- package/dist/colorPicker/index.mjs.map +1 -0
- package/dist/combobox/index.js +4 -4
- package/dist/combobox/index.js.map +1 -0
- package/dist/combobox/index.mjs +5 -5
- package/dist/combobox/index.mjs.map +1 -0
- package/dist/command/index.js +1 -0
- package/dist/command/index.js.map +1 -0
- package/dist/command/index.mjs +2 -1
- package/dist/command/index.mjs.map +1 -0
- package/dist/copyrights/index.js +1 -0
- package/dist/copyrights/index.js.map +1 -0
- package/dist/copyrights/index.mjs +1 -0
- package/dist/copyrights/index.mjs.map +1 -0
- package/dist/count/index.js +1 -0
- package/dist/count/index.js.map +1 -0
- package/dist/count/index.mjs +1 -0
- package/dist/count/index.mjs.map +1 -0
- package/dist/dataTable/index.js +28 -36
- package/dist/dataTable/index.js.map +1 -0
- package/dist/dataTable/index.mjs +29 -37
- package/dist/dataTable/index.mjs.map +1 -0
- package/dist/destroyableCard/index.js +3 -2
- package/dist/destroyableCard/index.js.map +1 -0
- package/dist/destroyableCard/index.mjs +4 -3
- package/dist/destroyableCard/index.mjs.map +1 -0
- package/dist/dialog/index.js +1 -0
- package/dist/dialog/index.js.map +1 -0
- package/dist/dialog/index.mjs +2 -1
- package/dist/dialog/index.mjs.map +1 -0
- package/dist/docsLayout/index.js +3 -2
- package/dist/docsLayout/index.js.map +1 -0
- package/dist/docsLayout/index.mjs +4 -3
- package/dist/docsLayout/index.mjs.map +1 -0
- package/dist/docsSidebar/index.js +3 -2
- package/dist/docsSidebar/index.js.map +1 -0
- package/dist/docsSidebar/index.mjs +4 -3
- package/dist/docsSidebar/index.mjs.map +1 -0
- package/dist/dropdownMenu/index.js +1 -0
- package/dist/dropdownMenu/index.js.map +1 -0
- package/dist/dropdownMenu/index.mjs +2 -1
- package/dist/dropdownMenu/index.mjs.map +1 -0
- package/dist/elements/index.js +2 -2
- package/dist/elements/index.mjs +2 -2
- package/dist/fileDropzone/index.js +12 -12
- package/dist/fileDropzone/index.js.map +1 -0
- package/dist/fileDropzone/index.mjs +13 -13
- package/dist/fileDropzone/index.mjs.map +1 -0
- package/dist/fileUploader/index.js +2 -2
- package/dist/fileUploader/index.js.map +1 -0
- package/dist/fileUploader/index.mjs +2 -2
- package/dist/fileUploader/index.mjs.map +1 -0
- package/dist/glow/index.js +18 -24
- package/dist/glow/index.js.map +1 -0
- package/dist/glow/index.mjs +18 -24
- package/dist/glow/index.mjs.map +1 -0
- package/dist/index.js +2 -2
- package/dist/index.mjs +2 -2
- package/dist/input/index.js +3 -3
- package/dist/input/index.js.map +1 -0
- package/dist/input/index.mjs +4 -4
- package/dist/input/index.mjs.map +1 -0
- package/dist/interfaceSettings/index.js +5 -6
- package/dist/interfaceSettings/index.js.map +1 -0
- package/dist/interfaceSettings/index.mjs +6 -7
- package/dist/interfaceSettings/index.mjs.map +1 -0
- package/dist/label/index.js +1 -0
- package/dist/label/index.js.map +1 -0
- package/dist/label/index.mjs +2 -1
- package/dist/label/index.mjs.map +1 -0
- package/dist/loading/index.js +1 -0
- package/dist/loading/index.js.map +1 -0
- package/dist/loading/index.mjs +2 -1
- package/dist/loading/index.mjs.map +1 -0
- package/dist/logos/index.js +1 -0
- package/dist/logos/index.js.map +1 -0
- package/dist/logos/index.mjs +1 -0
- package/dist/logos/index.mjs.map +1 -0
- package/dist/navbar/index.js +3 -3
- package/dist/navbar/index.js.map +1 -0
- package/dist/navbar/index.mjs +4 -4
- package/dist/navbar/index.mjs.map +1 -0
- package/dist/navigationMenu/index.js +1 -0
- package/dist/navigationMenu/index.js.map +1 -0
- package/dist/navigationMenu/index.mjs +2 -1
- package/dist/navigationMenu/index.mjs.map +1 -0
- package/dist/pagination/index.js +1 -0
- package/dist/pagination/index.js.map +1 -0
- package/dist/pagination/index.mjs +2 -1
- package/dist/pagination/index.mjs.map +1 -0
- package/dist/passwordInput/index.js +3 -3
- package/dist/passwordInput/index.js.map +1 -0
- package/dist/passwordInput/index.mjs +4 -4
- package/dist/passwordInput/index.mjs.map +1 -0
- package/dist/phoneInput/index.js +6 -10
- package/dist/phoneInput/index.js.map +1 -0
- package/dist/phoneInput/index.mjs +7 -11
- package/dist/phoneInput/index.mjs.map +1 -0
- package/dist/pinInput/index.js +4 -3
- package/dist/pinInput/index.js.map +1 -0
- package/dist/pinInput/index.mjs +5 -4
- package/dist/pinInput/index.mjs.map +1 -0
- package/dist/popover/index.js +1 -0
- package/dist/popover/index.js.map +1 -0
- package/dist/popover/index.mjs +2 -1
- package/dist/popover/index.mjs.map +1 -0
- package/dist/progress/index.js +1 -0
- package/dist/progress/index.js.map +1 -0
- package/dist/progress/index.mjs +2 -1
- package/dist/progress/index.mjs.map +1 -0
- package/dist/progressCircle/index.js +3 -2
- package/dist/progressCircle/index.js.map +1 -0
- package/dist/progressCircle/index.mjs +4 -3
- package/dist/progressCircle/index.mjs.map +1 -0
- package/dist/radio/index.js +5 -6
- package/dist/radio/index.js.map +1 -0
- package/dist/radio/index.mjs +6 -7
- package/dist/radio/index.mjs.map +1 -0
- package/dist/scrollArea/index.js +1 -0
- package/dist/scrollArea/index.js.map +1 -0
- package/dist/scrollArea/index.mjs +2 -1
- package/dist/scrollArea/index.mjs.map +1 -0
- package/dist/scrollIndicator/index.js +2 -2
- package/dist/scrollIndicator/index.js.map +1 -0
- package/dist/scrollIndicator/index.mjs +2 -2
- package/dist/scrollIndicator/index.mjs.map +1 -0
- package/dist/select/index.js +3 -6
- package/dist/select/index.js.map +1 -0
- package/dist/select/index.mjs +4 -7
- package/dist/select/index.mjs.map +1 -0
- package/dist/separator/index.js +1 -0
- package/dist/separator/index.js.map +1 -0
- package/dist/separator/index.mjs +2 -1
- package/dist/separator/index.mjs.map +1 -0
- package/dist/sheet/index.js +1 -0
- package/dist/sheet/index.js.map +1 -0
- package/dist/sheet/index.mjs +2 -1
- package/dist/sheet/index.mjs.map +1 -0
- package/dist/sidebar/index.js +1 -0
- package/dist/sidebar/index.js.map +1 -0
- package/dist/sidebar/index.mjs +2 -1
- package/dist/sidebar/index.mjs.map +1 -0
- package/dist/signature/index.js +12 -31
- package/dist/signature/index.js.map +1 -0
- package/dist/signature/index.mjs +13 -32
- package/dist/signature/index.mjs.map +1 -0
- package/dist/simpleTable/index.js +15 -18
- package/dist/simpleTable/index.js.map +1 -0
- package/dist/simpleTable/index.mjs +16 -19
- package/dist/simpleTable/index.mjs.map +1 -0
- package/dist/skeleton/index.js +1 -0
- package/dist/skeleton/index.js.map +1 -0
- package/dist/skeleton/index.mjs +2 -1
- package/dist/skeleton/index.mjs.map +1 -0
- package/dist/slider/index.js +1 -0
- package/dist/slider/index.js.map +1 -0
- package/dist/slider/index.mjs +2 -1
- package/dist/slider/index.mjs.map +1 -0
- package/dist/sortButton/index.js +1 -0
- package/dist/sortButton/index.js.map +1 -0
- package/dist/sortButton/index.mjs +2 -1
- package/dist/sortButton/index.mjs.map +1 -0
- package/dist/splitButton/index.js +1 -0
- package/dist/splitButton/index.js.map +1 -0
- package/dist/splitButton/index.mjs +2 -1
- package/dist/splitButton/index.mjs.map +1 -0
- package/dist/stats/index.js +1 -0
- package/dist/stats/index.js.map +1 -0
- package/dist/stats/index.mjs +1 -0
- package/dist/stats/index.mjs.map +1 -0
- package/dist/stopPropagationWrapper/index.js +1 -0
- package/dist/stopPropagationWrapper/index.js.map +1 -0
- package/dist/stopPropagationWrapper/index.mjs +1 -0
- package/dist/stopPropagationWrapper/index.mjs.map +1 -0
- package/dist/switch/index.js +2 -2
- package/dist/switch/index.js.map +1 -0
- package/dist/switch/index.mjs +3 -3
- package/dist/switch/index.mjs.map +1 -0
- package/dist/table/index.js +1 -0
- package/dist/table/index.js.map +1 -0
- package/dist/table/index.mjs +2 -1
- package/dist/table/index.mjs.map +1 -0
- package/dist/tabs/index.js +1 -0
- package/dist/tabs/index.js.map +1 -0
- package/dist/tabs/index.mjs +2 -1
- package/dist/tabs/index.mjs.map +1 -0
- package/dist/textarea/index.js +5 -4
- package/dist/textarea/index.js.map +1 -0
- package/dist/textarea/index.mjs +6 -5
- package/dist/textarea/index.mjs.map +1 -0
- package/dist/toast/index.js +3 -2
- package/dist/toast/index.js.map +1 -0
- package/dist/toast/index.mjs +3 -2
- package/dist/toast/index.mjs.map +1 -0
- package/dist/toaster/index.js +10 -9
- package/dist/toaster/index.js.map +1 -0
- package/dist/toaster/index.mjs +3 -2
- package/dist/toaster/index.mjs.map +1 -0
- package/dist/tooltip/index.js +1 -0
- package/dist/tooltip/index.js.map +1 -0
- package/dist/tooltip/index.mjs +1 -0
- package/dist/tooltip/index.mjs.map +1 -0
- package/package.json +1 -1
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../elements/sheet/Sheet.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@util/index\";\n\nconst Sheet = SheetPrimitive.Root;\nconst SheetTrigger = SheetPrimitive.Trigger;\nconst SheetClose = SheetPrimitive.Close;\nconst SheetPortal = SheetPrimitive.Portal;\nconst SheetOverlay = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Overlay\n className={cn(\n \"hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0\",\n className\n )}\n {...props}\n ref={ref}\n />\n));\n\nconst sheetVariants = cva(\n \"hawa-fixed hawa-z-50 hawa-gap-4 hawa-bg-background hawa-p-2 hawa-shadow-lg hawa-transition hawa-ease-in-out data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-duration-300 data-[state=open]:hawa-duration-300\",\n {\n variants: {\n side: {\n top: \"hawa-inset-x-0 hawa-top-0 hawa-border-b data-[state=closed]:hawa-slide-out-to-top data-[state=open]:hawa-slide-in-from-top\",\n bottom:\n \"hawa-inset-x-0 hawa-bottom-0 hawa-border-t data-[state=closed]:hawa-slide-out-to-bottom data-[state=open]:hawa-slide-in-from-bottom\",\n left: \"hawa-inset-y-0 hawa-left-0 hawa-h-full hawa-w-3/4 hawa-border-r data-[state=closed]:hawa-slide-out-to-left data-[state=open]:hawa-slide-in-from-left sm:hawa-max-w-sm\",\n right:\n \"hawa-inset-y-0 hawa-right-0 hawa-h-full hawa-w-3/4 hawa-border-l data-[state=closed]:hawa-slide-out-to-right data-[state=open]:hawa-slide-in-from-right sm:hawa-max-w-sm\"\n }\n },\n defaultVariants: {\n side: \"right\"\n }\n }\n);\n\ninterface SheetContentProps\n extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n VariantProps<typeof sheetVariants> {\n hideCloseButton?: boolean;\n persist?: boolean;\n}\n\nconst SheetContent = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Content>,\n SheetContentProps\n>(\n (\n { side = \"right\", className, children, persist, hideCloseButton, ...props },\n ref\n ) => (\n <SheetPortal>\n <SheetOverlay />\n <SheetPrimitive.Content\n ref={ref}\n className={cn(sheetVariants({ side }), className)}\n onPointerDownOutside={(e) => {\n if (persist) {\n e.preventDefault();\n }\n }}\n {...props}\n >\n {children}\n {!hideCloseButton && (\n <SheetPrimitive.Close\n className={cn(\n \"hawa-absolute hawa-rounded-sm hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-secondary\",\n {\n \"hawa-right-4 hawa-top-4\": side === \"left\" || side === \"bottom\",\n \"hawa-left-4 hawa-top-4\": side === \"right\",\n \"hawa-bottom-4 hawa-right-4\": side === \"top\"\n }\n )}\n >\n <svg\n aria-label=\"Close Icon\"\n aria-hidden=\"true\"\n className=\"hawa-h-5 hawa-w-5\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n ></path>\n </svg>\n <span className=\"hawa-sr-only\">Close</span>\n </SheetPrimitive.Close>\n )}\n </SheetPrimitive.Content>\n </SheetPortal>\n )\n);\n\nconst SheetHeader = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col hawa-space-y-2 hawa-text-center sm:hawa-text-left\",\n className\n )}\n {...props}\n />\n);\n\nconst SheetFooter = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\n \"hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-space-x-2\",\n className\n )}\n {...props}\n />\n);\n\nconst SheetTitle = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Title\n ref={ref}\n className={cn(\n \"hawa-text-lg hawa-font-semibold hawa-text-foreground\",\n className\n )}\n {...props}\n />\n));\n\nconst SheetDescription = React.forwardRef<\n React.ElementRef<typeof SheetPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <SheetPrimitive.Description\n ref={ref}\n className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n {...props}\n />\n));\n\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\nSheetContent.displayName = SheetPrimitive.Content.displayName;\nSheetHeader.displayName = \"SheetHeader\";\nSheetFooter.displayName = \"SheetFooter\";\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nexport {\n Sheet,\n SheetPortal,\n SheetOverlay,\n SheetTrigger,\n SheetClose,\n SheetContent,\n SheetHeader,\n SheetFooter,\n SheetTitle,\n SheetDescription\n};\n"],"mappings":";;;;;AAAA,YAAY,WAAW;AAEvB,YAAY,oBAAoB;AAChC,SAAS,WAA8B;AAIvC,IAAM,QAAuB;AAC7B,IAAM,eAA8B;AACpC,IAAM,aAA4B;AAClC,IAAM,cAA6B;AACnC,IAAM,eAAqB,iBAGzB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAgB;AAAA,EAAf;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IACJ;AAAA;AACF,CACD;AAED,IAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,KAAK;AAAA,QACL,QACE;AAAA,QACF,MAAM;AAAA,QACN,OACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,IACR;AAAA,EACF;AACF;AASA,IAAM,eAAqB;AAAA,EAIzB,CACE,EAAE,OAAO,SAAS,WAAW,UAAU,SAAS,iBAAiB,GAAG,MAAM,GAC1E,QAEA,oCAAC,mBACC,oCAAC,kBAAa,GACd;AAAA,IAAgB;AAAA,IAAf;AAAA,MACC;AAAA,MACA,WAAW,GAAG,cAAc,EAAE,KAAK,CAAC,GAAG,SAAS;AAAA,MAChD,sBAAsB,CAAC,MAAM;AAC3B,YAAI,SAAS;AACX,YAAE,eAAe;AAAA,QACnB;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,IACA,CAAC,mBACA;AAAA,MAAgB;AAAA,MAAf;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,2BAA2B,SAAS,UAAU,SAAS;AAAA,YACvD,0BAA0B,SAAS;AAAA,YACnC,8BAA8B,SAAS;AAAA,UACzC;AAAA,QACF;AAAA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,cAAW;AAAA,UACX,eAAY;AAAA,UACZ,WAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA;AAAA,QAER;AAAA,UAAC;AAAA;AAAA,YACC,UAAS;AAAA,YACT,GAAE;AAAA,YACF,UAAS;AAAA;AAAA,QACV;AAAA,MACH;AAAA,MACA,oCAAC,UAAK,WAAU,kBAAe,OAAK;AAAA,IACtC;AAAA,EAEJ,CACF;AAEJ;AAEA,IAAM,cAAc,CAAC;AAAA,EACnB;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC;AAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN;AAGF,IAAM,cAAc,CAAC;AAAA,EACnB;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC;AAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN;AAGF,IAAM,aAAmB,iBAGvB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAgB;AAAA,EAAf;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AAED,IAAM,mBAAyB,iBAG7B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAgB;AAAA,EAAf;AAAA,IACC;AAAA,IACA,WAAW,GAAG,2CAA2C,SAAS;AAAA,IACjE,GAAG;AAAA;AACN,CACD;AAED,iBAAiB,cAA6B,2BAAY;AAC1D,aAAa,cAA6B,uBAAQ;AAClD,aAAa,cAA6B,uBAAQ;AAClD,YAAY,cAAc;AAC1B,YAAY,cAAc;AAC1B,WAAW,cAA6B,qBAAM;","names":[]}
|
package/dist/sidebar/index.js
CHANGED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../layout/sidebar/index.ts","../../layout/sidebar/Sidebar.tsx","../../elements/chip/Chip.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Sidebar\";\n","import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\nimport { cn } from \"@util/index\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen\n}) => {\n // console.log(\"selected item is \", selectedItem)\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip \"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\"\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\"\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all \",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n )}\n >\n {item.label}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\"\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <a\n href={subitem.slug}\n key={idx}\n onMouseDown={(e) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n // if (onItemClick) {\n // onItemClick([item.value]);\n // }\n }}\n onClick={(e) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value)\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n </a>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip \"\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </a>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import React from \"react\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotType?: \"available\" | \"unavailable\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dotType,\n ...rest\n },\n ref\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\"\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\"\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\"\n };\n let dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\"\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\"\n )}\n >\n {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\"\n )}\n ></span>\n );\n }\n }\n);\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n"],"mappings":"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","names":["React","React"]}
|
package/dist/sidebar/index.mjs
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import {
|
2
2
|
cn
|
3
|
-
} from "../chunk-
|
3
|
+
} from "../chunk-CBRGWUZG.mjs";
|
4
4
|
|
5
5
|
// layout/sidebar/Sidebar.tsx
|
6
6
|
import * as React2 from "react";
|
@@ -296,3 +296,4 @@ export {
|
|
296
296
|
SidebarGroup,
|
297
297
|
SidebarItem
|
298
298
|
};
|
299
|
+
//# sourceMappingURL=index.mjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../layout/sidebar/Sidebar.tsx","../../elements/chip/Chip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\nimport { cn } from \"@util/index\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen\n}) => {\n // console.log(\"selected item is \", selectedItem)\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip \"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\"\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\"\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all \",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n )}\n >\n {item.label}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\"\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <a\n href={subitem.slug}\n key={idx}\n onMouseDown={(e) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n // if (onItemClick) {\n // onItemClick([item.value]);\n // }\n }}\n onClick={(e) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value)\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n </a>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip \"\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </a>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import React from \"react\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotType?: \"available\" | \"unavailable\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dotType,\n ...rest\n },\n ref\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\"\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\"\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\"\n };\n let dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\"\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\"\n )}\n >\n {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\"\n )}\n ></span>\n );\n }\n }\n);\n"],"mappings":"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","names":["React"]}
|
package/dist/signature/index.js
CHANGED
@@ -164,22 +164,20 @@ var Signature = ({
|
|
164
164
|
resizeCanvas();
|
165
165
|
};
|
166
166
|
const resizeCanvas = () => {
|
167
|
-
var _a;
|
168
167
|
const canvas = canvasRef.current;
|
169
168
|
if (canvas && canvas.parentElement) {
|
170
169
|
const ratio = Math.max(window.devicePixelRatio || 1, 1);
|
171
|
-
if (typeof
|
170
|
+
if (typeof canvasProps?.width === "undefined") {
|
172
171
|
canvas.width = canvas.parentElement.offsetWidth * ratio;
|
173
172
|
} else {
|
174
173
|
canvas.width = Number(canvasProps.width) * ratio;
|
175
174
|
}
|
176
175
|
canvas.height = 150 * ratio;
|
177
|
-
|
176
|
+
canvas.getContext("2d")?.scale(ratio, ratio);
|
178
177
|
clear();
|
179
178
|
}
|
180
179
|
};
|
181
180
|
const getTrimmedCanvas = () => {
|
182
|
-
var _a;
|
183
181
|
const canvas = canvasRef.current;
|
184
182
|
if (!canvas) {
|
185
183
|
throw new Error("Canvas reference is null");
|
@@ -187,7 +185,7 @@ var Signature = ({
|
|
187
185
|
const copy = document.createElement("canvas");
|
188
186
|
copy.width = canvas.width;
|
189
187
|
copy.height = canvas.height;
|
190
|
-
|
188
|
+
copy.getContext("2d")?.drawImage(canvas, 0, 0);
|
191
189
|
return (0, import_trim_canvas.default)(copy);
|
192
190
|
};
|
193
191
|
const getSignatureImage = () => {
|
@@ -210,30 +208,12 @@ var Signature = ({
|
|
210
208
|
window.removeEventListener("resize", checkClearOnResize);
|
211
209
|
};
|
212
210
|
}, [sigPadProps]);
|
213
|
-
const clear = () =>
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
const
|
218
|
-
|
219
|
-
return !!((_a = sigPadRef.current) == null ? void 0 : _a.isEmpty());
|
220
|
-
};
|
221
|
-
const fromDataURL = (dataURL, options) => {
|
222
|
-
var _a;
|
223
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.fromDataURL(dataURL, options);
|
224
|
-
};
|
225
|
-
const toDataURL = (type, encoderOptions) => {
|
226
|
-
var _a;
|
227
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.toDataURL(type, encoderOptions);
|
228
|
-
};
|
229
|
-
const fromData = (pointGroups) => {
|
230
|
-
var _a;
|
231
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.fromData(pointGroups);
|
232
|
-
};
|
233
|
-
const toData = () => {
|
234
|
-
var _a;
|
235
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.toData();
|
236
|
-
};
|
211
|
+
const clear = () => sigPadRef.current?.clear();
|
212
|
+
const isEmpty = () => !!sigPadRef.current?.isEmpty();
|
213
|
+
const fromDataURL = (dataURL, options) => sigPadRef.current?.fromDataURL(dataURL, options);
|
214
|
+
const toDataURL = (type, encoderOptions) => sigPadRef.current?.toDataURL(type, encoderOptions);
|
215
|
+
const fromData = (pointGroups) => sigPadRef.current?.fromData(pointGroups);
|
216
|
+
const toData = () => sigPadRef.current?.toData();
|
237
217
|
return /* @__PURE__ */ import_react2.default.createElement("div", { className: "hawa-w-full" }, label && /* @__PURE__ */ import_react2.default.createElement(Label, { ...labelProps, className: "hawa-mb-2" }, label || "Signature"), /* @__PURE__ */ import_react2.default.createElement(
|
238
218
|
"canvas",
|
239
219
|
{
|
@@ -241,7 +221,7 @@ var Signature = ({
|
|
241
221
|
...canvasProps,
|
242
222
|
className: cn(
|
243
223
|
"hawa-rounded hawa-border hawa-bg-[hsl(var(--constant-background))]",
|
244
|
-
canvasProps
|
224
|
+
canvasProps?.className
|
245
225
|
)
|
246
226
|
}
|
247
227
|
), /* @__PURE__ */ import_react2.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, /* @__PURE__ */ import_react2.default.createElement(
|
@@ -253,9 +233,10 @@ var Signature = ({
|
|
253
233
|
)
|
254
234
|
},
|
255
235
|
helperText
|
256
|
-
), /* @__PURE__ */ import_react2.default.createElement("div", { className: "clickable-link hawa-w-fit", onClick: () => clear() },
|
236
|
+
), /* @__PURE__ */ import_react2.default.createElement("div", { className: "clickable-link hawa-w-fit", onClick: () => clear() }, texts?.clear || "Clear")));
|
257
237
|
};
|
258
238
|
// Annotate the CommonJS export names for ESM import in node:
|
259
239
|
0 && (module.exports = {
|
260
240
|
Signature
|
261
241
|
});
|
242
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../elements/signature/index.ts","../../elements/signature/Signature.tsx","../../util/index.ts","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["export * from \"./Signature\";\n","import React, { useRef, useEffect, FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n// @ts-ignore\nimport SignaturePad, { SignaturePadOptions } from \"signature_pad\";\n// @ts-ignore\nimport trimCanvas from \"trim-canvas\";\n\nimport { Label, LabelProps } from \"@elements/label\";\n\nexport interface SignatureCanvasProps extends SignaturePadOptions {\n canvasProps?: React.CanvasHTMLAttributes<HTMLCanvasElement>;\n clearOnResize?: boolean;\n onGetImage?: any;\n helperText?: React.ReactNode;\n texts?: { clear?: string };\n labelProps?: LabelProps;\n label?: any;\n}\n\nexport const Signature: FC<SignatureCanvasProps> = ({\n canvasProps,\n clearOnResize = false,\n onGetImage,\n texts,\n label,\n labelProps,\n helperText,\n ...sigPadProps\n}) => {\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const sigPadRef = useRef<SignaturePad | null>(null);\n\n const checkClearOnResize = () => {\n if (!clearOnResize) {\n return;\n }\n resizeCanvas();\n };\n\n const resizeCanvas = () => {\n const canvas = canvasRef.current;\n if (canvas && canvas.parentElement) {\n const ratio = Math.max(window.devicePixelRatio || 1, 1);\n if (typeof canvasProps?.width === \"undefined\") {\n // Full width of the parent element\n canvas.width = canvas.parentElement.offsetWidth * ratio;\n } else {\n // Use specified width\n canvas.width = Number(canvasProps.width) * ratio;\n }\n canvas.height = 150 * ratio;\n\n // if (typeof canvasProps?.height === \"undefined\") {\n // canvas.height = canvas.parentElement.offsetHeight * ratio;\n // } else {\n // canvas.height = Number(canvasProps.height) * ratio; // Ensure it's treated as a number\n // }\n\n canvas.getContext(\"2d\")?.scale(ratio, ratio);\n clear();\n }\n };\n const getTrimmedCanvas = (): HTMLCanvasElement => {\n const canvas = canvasRef.current;\n if (!canvas) {\n throw new Error(\"Canvas reference is null\");\n }\n const copy = document.createElement(\"canvas\");\n copy.width = canvas.width;\n copy.height = canvas.height;\n copy.getContext(\"2d\")?.drawImage(canvas, 0, 0);\n return trimCanvas(copy);\n };\n const getSignatureImage = () => {\n const trimmedCanvas = getTrimmedCanvas();\n return trimmedCanvas.toDataURL();\n };\n useEffect(() => {\n if (onGetImage) {\n onGetImage(getSignatureImage);\n }\n }, [onGetImage]);\n useEffect(() => {\n const canvas = canvasRef.current;\n if (canvas) {\n sigPadRef.current = new SignaturePad(canvas, sigPadProps);\n resizeCanvas();\n window.addEventListener(\"resize\", checkClearOnResize);\n }\n\n return () => {\n window.removeEventListener(\"resize\", checkClearOnResize);\n };\n }, [sigPadProps]);\n\n const clear = () => sigPadRef.current?.clear();\n const isEmpty = () => !!sigPadRef.current?.isEmpty();\n const fromDataURL = (dataURL: string, options?: any) =>\n sigPadRef.current?.fromDataURL(dataURL, options);\n const toDataURL = (type?: string, encoderOptions?: any) =>\n sigPadRef.current?.toDataURL(type, encoderOptions);\n const fromData = (pointGroups: any[]) =>\n sigPadRef.current?.fromData(pointGroups);\n const toData = () => sigPadRef.current?.toData();\n\n return (\n <div className=\"hawa-w-full\">\n {label && (\n <Label {...labelProps} className=\"hawa-mb-2\">\n {label || \"Signature\"}\n </Label>\n )}\n <canvas\n ref={canvasRef}\n {...canvasProps}\n className={cn(\n \"hawa-rounded hawa-border hawa-bg-[hsl(var(--constant-background))]\",\n canvasProps?.className\n )}\n />\n\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {/* {helperText && ( */}\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\"\n )}\n >\n {helperText}\n </p>\n {/* )} */}\n <div className=\"clickable-link hawa-w-fit\" onClick={() => clear()}>\n {texts?.clear || \"Clear\"}\n </div>\n </div>\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 { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...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 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 triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n open,\n content,\n children,\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={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent side={side} align=\"center\" {...contentProps}>\n {content}\n </TooltipContent>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.TooltipProvider>\n );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["import_react","React","React","trimCanvas","SignaturePad","React"]}
|
package/dist/signature/index.mjs
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import {
|
2
2
|
cn
|
3
|
-
} from "../chunk-
|
3
|
+
} from "../chunk-CBRGWUZG.mjs";
|
4
4
|
|
5
5
|
// elements/signature/Signature.tsx
|
6
6
|
import React3, { useRef, useEffect } from "react";
|
@@ -123,22 +123,20 @@ var Signature = ({
|
|
123
123
|
resizeCanvas();
|
124
124
|
};
|
125
125
|
const resizeCanvas = () => {
|
126
|
-
var _a;
|
127
126
|
const canvas = canvasRef.current;
|
128
127
|
if (canvas && canvas.parentElement) {
|
129
128
|
const ratio = Math.max(window.devicePixelRatio || 1, 1);
|
130
|
-
if (typeof
|
129
|
+
if (typeof canvasProps?.width === "undefined") {
|
131
130
|
canvas.width = canvas.parentElement.offsetWidth * ratio;
|
132
131
|
} else {
|
133
132
|
canvas.width = Number(canvasProps.width) * ratio;
|
134
133
|
}
|
135
134
|
canvas.height = 150 * ratio;
|
136
|
-
|
135
|
+
canvas.getContext("2d")?.scale(ratio, ratio);
|
137
136
|
clear();
|
138
137
|
}
|
139
138
|
};
|
140
139
|
const getTrimmedCanvas = () => {
|
141
|
-
var _a;
|
142
140
|
const canvas = canvasRef.current;
|
143
141
|
if (!canvas) {
|
144
142
|
throw new Error("Canvas reference is null");
|
@@ -146,7 +144,7 @@ var Signature = ({
|
|
146
144
|
const copy = document.createElement("canvas");
|
147
145
|
copy.width = canvas.width;
|
148
146
|
copy.height = canvas.height;
|
149
|
-
|
147
|
+
copy.getContext("2d")?.drawImage(canvas, 0, 0);
|
150
148
|
return trimCanvas(copy);
|
151
149
|
};
|
152
150
|
const getSignatureImage = () => {
|
@@ -169,30 +167,12 @@ var Signature = ({
|
|
169
167
|
window.removeEventListener("resize", checkClearOnResize);
|
170
168
|
};
|
171
169
|
}, [sigPadProps]);
|
172
|
-
const clear = () =>
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
const
|
177
|
-
|
178
|
-
return !!((_a = sigPadRef.current) == null ? void 0 : _a.isEmpty());
|
179
|
-
};
|
180
|
-
const fromDataURL = (dataURL, options) => {
|
181
|
-
var _a;
|
182
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.fromDataURL(dataURL, options);
|
183
|
-
};
|
184
|
-
const toDataURL = (type, encoderOptions) => {
|
185
|
-
var _a;
|
186
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.toDataURL(type, encoderOptions);
|
187
|
-
};
|
188
|
-
const fromData = (pointGroups) => {
|
189
|
-
var _a;
|
190
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.fromData(pointGroups);
|
191
|
-
};
|
192
|
-
const toData = () => {
|
193
|
-
var _a;
|
194
|
-
return (_a = sigPadRef.current) == null ? void 0 : _a.toData();
|
195
|
-
};
|
170
|
+
const clear = () => sigPadRef.current?.clear();
|
171
|
+
const isEmpty = () => !!sigPadRef.current?.isEmpty();
|
172
|
+
const fromDataURL = (dataURL, options) => sigPadRef.current?.fromDataURL(dataURL, options);
|
173
|
+
const toDataURL = (type, encoderOptions) => sigPadRef.current?.toDataURL(type, encoderOptions);
|
174
|
+
const fromData = (pointGroups) => sigPadRef.current?.fromData(pointGroups);
|
175
|
+
const toData = () => sigPadRef.current?.toData();
|
196
176
|
return /* @__PURE__ */ React3.createElement("div", { className: "hawa-w-full" }, label && /* @__PURE__ */ React3.createElement(Label, { ...labelProps, className: "hawa-mb-2" }, label || "Signature"), /* @__PURE__ */ React3.createElement(
|
197
177
|
"canvas",
|
198
178
|
{
|
@@ -200,7 +180,7 @@ var Signature = ({
|
|
200
180
|
...canvasProps,
|
201
181
|
className: cn(
|
202
182
|
"hawa-rounded hawa-border hawa-bg-[hsl(var(--constant-background))]",
|
203
|
-
canvasProps
|
183
|
+
canvasProps?.className
|
204
184
|
)
|
205
185
|
}
|
206
186
|
), /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, /* @__PURE__ */ React3.createElement(
|
@@ -212,8 +192,9 @@ var Signature = ({
|
|
212
192
|
)
|
213
193
|
},
|
214
194
|
helperText
|
215
|
-
), /* @__PURE__ */ React3.createElement("div", { className: "clickable-link hawa-w-fit", onClick: () => clear() },
|
195
|
+
), /* @__PURE__ */ React3.createElement("div", { className: "clickable-link hawa-w-fit", onClick: () => clear() }, texts?.clear || "Clear")));
|
216
196
|
};
|
217
197
|
export {
|
218
198
|
Signature
|
219
199
|
};
|
200
|
+
//# sourceMappingURL=index.mjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../elements/signature/Signature.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { useRef, useEffect, FC } from \"react\";\n\nimport { cn } from \"@util/index\";\n// @ts-ignore\nimport SignaturePad, { SignaturePadOptions } from \"signature_pad\";\n// @ts-ignore\nimport trimCanvas from \"trim-canvas\";\n\nimport { Label, LabelProps } from \"@elements/label\";\n\nexport interface SignatureCanvasProps extends SignaturePadOptions {\n canvasProps?: React.CanvasHTMLAttributes<HTMLCanvasElement>;\n clearOnResize?: boolean;\n onGetImage?: any;\n helperText?: React.ReactNode;\n texts?: { clear?: string };\n labelProps?: LabelProps;\n label?: any;\n}\n\nexport const Signature: FC<SignatureCanvasProps> = ({\n canvasProps,\n clearOnResize = false,\n onGetImage,\n texts,\n label,\n labelProps,\n helperText,\n ...sigPadProps\n}) => {\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const sigPadRef = useRef<SignaturePad | null>(null);\n\n const checkClearOnResize = () => {\n if (!clearOnResize) {\n return;\n }\n resizeCanvas();\n };\n\n const resizeCanvas = () => {\n const canvas = canvasRef.current;\n if (canvas && canvas.parentElement) {\n const ratio = Math.max(window.devicePixelRatio || 1, 1);\n if (typeof canvasProps?.width === \"undefined\") {\n // Full width of the parent element\n canvas.width = canvas.parentElement.offsetWidth * ratio;\n } else {\n // Use specified width\n canvas.width = Number(canvasProps.width) * ratio;\n }\n canvas.height = 150 * ratio;\n\n // if (typeof canvasProps?.height === \"undefined\") {\n // canvas.height = canvas.parentElement.offsetHeight * ratio;\n // } else {\n // canvas.height = Number(canvasProps.height) * ratio; // Ensure it's treated as a number\n // }\n\n canvas.getContext(\"2d\")?.scale(ratio, ratio);\n clear();\n }\n };\n const getTrimmedCanvas = (): HTMLCanvasElement => {\n const canvas = canvasRef.current;\n if (!canvas) {\n throw new Error(\"Canvas reference is null\");\n }\n const copy = document.createElement(\"canvas\");\n copy.width = canvas.width;\n copy.height = canvas.height;\n copy.getContext(\"2d\")?.drawImage(canvas, 0, 0);\n return trimCanvas(copy);\n };\n const getSignatureImage = () => {\n const trimmedCanvas = getTrimmedCanvas();\n return trimmedCanvas.toDataURL();\n };\n useEffect(() => {\n if (onGetImage) {\n onGetImage(getSignatureImage);\n }\n }, [onGetImage]);\n useEffect(() => {\n const canvas = canvasRef.current;\n if (canvas) {\n sigPadRef.current = new SignaturePad(canvas, sigPadProps);\n resizeCanvas();\n window.addEventListener(\"resize\", checkClearOnResize);\n }\n\n return () => {\n window.removeEventListener(\"resize\", checkClearOnResize);\n };\n }, [sigPadProps]);\n\n const clear = () => sigPadRef.current?.clear();\n const isEmpty = () => !!sigPadRef.current?.isEmpty();\n const fromDataURL = (dataURL: string, options?: any) =>\n sigPadRef.current?.fromDataURL(dataURL, options);\n const toDataURL = (type?: string, encoderOptions?: any) =>\n sigPadRef.current?.toDataURL(type, encoderOptions);\n const fromData = (pointGroups: any[]) =>\n sigPadRef.current?.fromData(pointGroups);\n const toData = () => sigPadRef.current?.toData();\n\n return (\n <div className=\"hawa-w-full\">\n {label && (\n <Label {...labelProps} className=\"hawa-mb-2\">\n {label || \"Signature\"}\n </Label>\n )}\n <canvas\n ref={canvasRef}\n {...canvasProps}\n className={cn(\n \"hawa-rounded hawa-border hawa-bg-[hsl(var(--constant-background))]\",\n canvasProps?.className\n )}\n />\n\n <div className=\"hawa-flex hawa-flex-row hawa-justify-between\">\n {/* Regular helper text */}\n {/* {helperText && ( */}\n <p\n className={cn(\n \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n helperText\n ? \"hawa-h-4 hawa-opacity-100\"\n : \"hawa-h-0 hawa-opacity-0\"\n )}\n >\n {helperText}\n </p>\n {/* )} */}\n <div className=\"clickable-link hawa-w-fit\" onClick={() => clear()}>\n {texts?.clear || \"Clear\"}\n </div>\n </div>\n </div>\n );\n};\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef<typeof TooltipPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...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 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 triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n contentProps?: TooltipPrimitive.TooltipContentProps;\n providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n side,\n open,\n content,\n children,\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={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n {...props}\n >\n <TooltipPrimitive.Trigger {...triggerProps}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipContent side={side} align=\"center\" {...contentProps}>\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"]}
|
@@ -189,7 +189,6 @@ var SimpleTable = ({
|
|
189
189
|
classNames,
|
190
190
|
...props
|
191
191
|
}) => {
|
192
|
-
var _a, _b;
|
193
192
|
const table = (0, import_react_table.useReactTable)({
|
194
193
|
data,
|
195
194
|
columns,
|
@@ -216,34 +215,31 @@ var SimpleTable = ({
|
|
216
215
|
header.getContext()
|
217
216
|
)
|
218
217
|
);
|
219
|
-
})))), /* @__PURE__ */ React3.createElement(TableBody, null,
|
218
|
+
})))), /* @__PURE__ */ React3.createElement(TableBody, null, table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ React3.createElement(
|
220
219
|
TableRow,
|
221
220
|
{
|
222
221
|
key: row.id,
|
223
222
|
"data-state": row.getIsSelected() && "selected"
|
224
223
|
},
|
225
|
-
row.getVisibleCells().map((cell) =>
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
(
|
235
|
-
|
236
|
-
|
237
|
-
)
|
238
|
-
);
|
239
|
-
})
|
224
|
+
row.getVisibleCells().map((cell) => /* @__PURE__ */ React3.createElement(
|
225
|
+
TableCell,
|
226
|
+
{
|
227
|
+
dir: props.direction,
|
228
|
+
padding: props.condensed ? "condensed" : cell.column.columnDef.meta?.padding,
|
229
|
+
key: cell.id
|
230
|
+
},
|
231
|
+
(0, import_react_table.flexRender)(
|
232
|
+
cell.column.columnDef.cell,
|
233
|
+
cell.getContext()
|
234
|
+
)
|
235
|
+
))
|
240
236
|
)) : /* @__PURE__ */ React3.createElement(TableRow, null, /* @__PURE__ */ React3.createElement(
|
241
237
|
TableCell,
|
242
238
|
{
|
243
239
|
colSpan: columns.length,
|
244
240
|
className: "hawa-h-24 hawa-text-center"
|
245
241
|
},
|
246
|
-
|
242
|
+
props.texts?.noData
|
247
243
|
)))))
|
248
244
|
);
|
249
245
|
};
|
@@ -251,3 +247,4 @@ var SimpleTable = ({
|
|
251
247
|
0 && (module.exports = {
|
252
248
|
SimpleTable
|
253
249
|
});
|
250
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../elements/simpleTable/index.ts","../../elements/simpleTable/SimpleTable.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/table/Table.tsx"],"sourcesContent":["export * from \"./SimpleTable\";\n","import * as React from \"react\";\n\nimport {\n ColumnDef,\n flexRender,\n getCoreRowModel,\n useReactTable,\n RowData\n} from \"@tanstack/react-table\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Skeleton } from \"../skeleton\";\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow\n} from \"../table\";\n\ntype DataProps = {};\n\ntype SimpleTableProps = {\n direction?: DirectionType;\n columns: ColumnDef<DataProps>[];\n data: DataProps[];\n condensed?: boolean;\n isLoading?: boolean;\n defaultSort?: string;\n classNames?: string;\n texts?: {\n searchPlaceholder?: string;\n noData?: any;\n page?: string;\n filter?: string;\n of?: string;\n total?: string;\n };\n};\n\ndeclare module \"@tanstack/table-core\" {\n interface ColumnMeta<TData extends RowData, TValue> {\n padding?: \"condensed\" | \"default\" | \"noPadding\";\n }\n}\n\nexport const SimpleTable: React.FC<SimpleTableProps> = ({\n columns,\n data,\n classNames,\n ...props\n}) => {\n const table = useReactTable({\n data,\n columns,\n getCoreRowModel: getCoreRowModel()\n });\n return (\n <div\n className={cn(\n \"hawa-flex hawa-w-full hawa-flex-col hawa-gap-4\",\n classNames\n )}\n >\n {props.isLoading ? (\n <Skeleton className=\"h-[130px] w-full\" />\n ) : (\n <div className=\"hawa-rounded\">\n <Table>\n {table.getAllColumns().length > 0 && (\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n return (\n <TableHead\n condensed={props.condensed}\n dir={props.direction}\n key={header.id}\n >\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </TableHead>\n );\n })}\n </TableRow>\n ))}\n </TableHeader>\n )}\n <TableBody>\n {table.getRowModel().rows?.length ? (\n table.getRowModel().rows.map((row) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() && \"selected\"}\n >\n {row.getVisibleCells().map((cell) => (\n <TableCell\n dir={props.direction}\n padding={\n props.condensed\n ? \"condensed\"\n : cell.column.columnDef.meta?.padding\n }\n key={cell.id}\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext()\n )}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={columns.length}\n className=\"hawa-h-24 hawa-text-center\"\n >\n {props.texts?.noData}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n </div>\n )}\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 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}\n\nfunction Skeleton({\n className,\n content,\n animation = \"pulse\",\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 return (\n <div\n className={cn(\n animationStyles[animation],\n content &&\n \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n className\n )}\n {...props}\n >\n {content && content}\n </div>\n );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nconst Table = React.forwardRef<\n HTMLTableElement,\n React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n <div className=\"hawa-relative hawa-w-full hawa-overflow-auto hawa-rounded hawa-border\">\n <table\n ref={ref}\n className={cn(\"hawa-w-full hawa-caption-bottom hawa-text-sm\", className)}\n {...props}\n />\n </div>\n));\nTable.displayName = \"Table\";\n\nconst TableHeader = React.forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <thead\n ref={ref}\n className={cn(\"[&_tr]:hawa-border-b\", \"hawa-bg-muted/50\", className)}\n {...props}\n />\n));\nTableHeader.displayName = \"TableHeader\";\n\ninterface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n clickable?: boolean;\n condensed?: boolean;\n}\n\nconst TableHead = React.forwardRef<HTMLTableCellElement, TableHeadProps>(\n ({ className, condensed, clickable, dir, ...props }, ref) => (\n <th\n ref={ref}\n className={cn(\n \"hawa-bg-muted/60 hawa-text-start hawa-align-middle hawa-font-medium hawa-text-muted-foreground dark:hawa-bg-muted/40 [&:has([role=checkbox])]:hawa-pr-0 [&:not(:last-child)&:not(:first-child)]:hawa-border-x\",\n dir === \"rtl\"\n ? \"[&:not(:last-child)]:hawa-border-l\"\n : \"[&:not(:last-child)]:hawa-border-r\",\n condensed ? \"hawa-h-8\" : \"hawa-h-12\",\n clickable ? \"hawa-px-1\" : \"hawa-px-4\", //First and last columns\n clickable\n ? \" [&:not(:last-child)&:not(:first-child)]:hawa-p-1\"\n : \"hawa-px-4\", //Columns in between\n className\n )}\n {...props}\n />\n )\n);\nTableHead.displayName = \"TableHead\";\n\nconst TableBody = React.forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <tbody ref={ref} className={cn(\"hawa-border-none\", className)} {...props} />\n));\nTableBody.displayName = \"TableBody\";\n\nconst TableFooter = React.forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <tfoot\n ref={ref}\n className={cn(\n \"hawa-bg-primary hawa-font-medium hawa-text-primary-foreground\",\n className\n )}\n {...props}\n />\n));\nTableFooter.displayName = \"TableFooter\";\n\nconst TableRow = React.forwardRef<\n HTMLTableRowElement,\n React.HTMLAttributes<HTMLTableRowElement>\n>(({ className, ...props }, ref) => (\n <tr\n ref={ref}\n className={cn(\n \"hawa-bg-background hawa-transition-colors data-[state=selected]:hawa-bg-muted\",\n \"[&:not(:last-child)&:not(:first-child)]:hawa-border-y\",\n \"[&:not(:last-child)]:hawa-border-b\",\n\n className\n )}\n {...props}\n />\n));\nTableRow.displayName = \"TableRow\";\n\ninterface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n condensed?: boolean;\n enablePadding?: boolean;\n padding?: \"condensed\" | \"default\" | \"noPadding\";\n}\n\nconst TableCell = React.forwardRef<HTMLTableCellElement, TableCellProps>(\n ({ className, enablePadding = true, padding = \"default\", ...props }, ref) => {\n let paddingStyles = {\n condensed: \"hawa-p-0 hawa-px-4\",\n default: \"hawa-p-4\",\n noPadding: \"hawa-p-0\"\n };\n\n return (\n <td\n ref={ref}\n className={cn(\n paddingStyles[padding],\n // \"border-x\",\n // enablePadding ? \"hawa-p-4\" : \"hawa-p-0\",\n // props.disablePadding ? \"hawa-p-0\" : \"hawa-p-4\",\n // props.condensed ? \"hawa-p-0 hawa-px-4\" : \"hawa-p-4\",\n \"hawa-align-middle [&:has([role=checkbox])]:hawa-pr-0 \",\n \"[&:not(:last-child)&:not(:first-child)]:hawa-border-x\",\n // \"[&:not(:last-child)]:hawa-border-r\",\n props.dir === \"rtl\"\n ? \"[&:not(:last-child)]:hawa-border-l\"\n : \"[&:not(:last-child)]:hawa-border-r\",\n className\n )}\n {...props}\n />\n );\n }\n);\nTableCell.displayName = \"TableCell\";\n\nconst TableCaption = React.forwardRef<\n HTMLTableCaptionElement,\n React.HTMLAttributes<HTMLTableCaptionElement>\n>(({ className, ...props }, ref) => (\n <caption\n ref={ref}\n className={cn(\n \"hawa-mt-4 hawa-text-sm hawa-text-muted-foreground\",\n className\n )}\n {...props}\n />\n));\nTableCaption.displayName = \"TableCaption\";\n\nexport {\n Table,\n TableHeader,\n TableHead,\n TableBody,\n TableFooter,\n TableRow,\n TableCell,\n TableCaption\n};\n"],"mappings":"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","names":["React","React","React"]}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import {
|
2
2
|
cn
|
3
|
-
} from "../chunk-
|
3
|
+
} from "../chunk-CBRGWUZG.mjs";
|
4
4
|
|
5
5
|
// elements/simpleTable/SimpleTable.tsx
|
6
6
|
import * as React3 from "react";
|
@@ -154,7 +154,6 @@ var SimpleTable = ({
|
|
154
154
|
classNames,
|
155
155
|
...props
|
156
156
|
}) => {
|
157
|
-
var _a, _b;
|
158
157
|
const table = useReactTable({
|
159
158
|
data,
|
160
159
|
columns,
|
@@ -181,37 +180,35 @@ var SimpleTable = ({
|
|
181
180
|
header.getContext()
|
182
181
|
)
|
183
182
|
);
|
184
|
-
})))), /* @__PURE__ */ React3.createElement(TableBody, null,
|
183
|
+
})))), /* @__PURE__ */ React3.createElement(TableBody, null, table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ React3.createElement(
|
185
184
|
TableRow,
|
186
185
|
{
|
187
186
|
key: row.id,
|
188
187
|
"data-state": row.getIsSelected() && "selected"
|
189
188
|
},
|
190
|
-
row.getVisibleCells().map((cell) =>
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
)
|
203
|
-
);
|
204
|
-
})
|
189
|
+
row.getVisibleCells().map((cell) => /* @__PURE__ */ React3.createElement(
|
190
|
+
TableCell,
|
191
|
+
{
|
192
|
+
dir: props.direction,
|
193
|
+
padding: props.condensed ? "condensed" : cell.column.columnDef.meta?.padding,
|
194
|
+
key: cell.id
|
195
|
+
},
|
196
|
+
flexRender(
|
197
|
+
cell.column.columnDef.cell,
|
198
|
+
cell.getContext()
|
199
|
+
)
|
200
|
+
))
|
205
201
|
)) : /* @__PURE__ */ React3.createElement(TableRow, null, /* @__PURE__ */ React3.createElement(
|
206
202
|
TableCell,
|
207
203
|
{
|
208
204
|
colSpan: columns.length,
|
209
205
|
className: "hawa-h-24 hawa-text-center"
|
210
206
|
},
|
211
|
-
|
207
|
+
props.texts?.noData
|
212
208
|
)))))
|
213
209
|
);
|
214
210
|
};
|
215
211
|
export {
|
216
212
|
SimpleTable
|
217
213
|
};
|
214
|
+
//# sourceMappingURL=index.mjs.map
|