pillardash-ui-react 0.1.131 → 0.1.138

package/dist/esm/components/Alert/ConfirmationAlert.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationAlert.mjs","sources":["../../../../src/components/Alert/ConfirmationAlert.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\n\nimport { AlertTriangle, CheckCircle, Info, X, XCircle } from \"lucide-react\";\nimport { Button } from \"../Button\";\n\nexport type ConfirmationType = \"default\" | \"danger\" | \"warning\" | \"success\" | \"info\";\n\nexport interface ConfirmationPopupProps {\n    isOpen: boolean;\n    onConfirm: () => void;\n    onCancel: () => void;\n    title?: string;\n    message?: string;\n    confirmText?: string;\n    cancelText?: string;\n    type?: ConfirmationType;\n    showIcon?: boolean;\n    showCloseButton?: boolean;\n    closeOnOverlayClick?: boolean;\n    closeOnEscape?: boolean;\n    isLoading?: boolean;\n    className?: string;\n    overlayClassName?: string;\n    maxWidth?: \"sm\" | \"md\" | \"lg\";\n}\n\nconst ConfirmationAlert: React.FC<ConfirmationPopupProps> = ({\n    isOpen,\n    onConfirm,\n    onCancel,\n    title,\n    message,\n    confirmText = \"Confirm\",\n    cancelText = \"Cancel\",\n    type = \"default\",\n    showIcon = true,\n    showCloseButton = true,\n    closeOnOverlayClick = true,\n    closeOnEscape = true,\n    isLoading = false,\n    className = \"\",\n    overlayClassName = \"\",\n    maxWidth = \"sm\",\n}) => {\n    const popupRef = useRef<HTMLDivElement>(null);\n    const confirmButtonRef = useRef<HTMLButtonElement>(null);\n    const previousFocusRef = useRef<HTMLElement | null>(null);\n\n    useEffect(() => {\n        if (isOpen) {\n            // Store the previously focused element\n            previousFocusRef.current = document.activeElement as HTMLElement;\n\n            // Focus the confirm button for keyboard navigation\n            setTimeout(() => {\n                if (type === \"danger\") {\n                    // For danger actions, focus cancel button first for safety\n                    popupRef.current\n                        ?.querySelector<HTMLButtonElement>(\"[data-cancel-button]\")\n                        ?.focus();\n                } else {\n                    confirmButtonRef.current?.focus();\n                }\n            }, 100);\n\n            // Prevent body scroll\n            document.body.style.overflow = \"hidden\";\n        } else {\n            // Restore body scroll\n            document.body.style.overflow = \"unset\";\n\n            // Restore focus to previously focused element\n            if (previousFocusRef.current) {\n                previousFocusRef.current.focus();\n            }\n        }\n\n        return () => {\n            document.body.style.overflow = \"unset\";\n        };\n    }, [isOpen, type]);\n\n    useEffect(() => {\n        const handleEscape = (event: KeyboardEvent) => {\n            if (event.key === \"Escape\" && closeOnEscape && !isLoading) {\n                onCancel();\n            }\n        };\n\n        if (isOpen) {\n            document.addEventListener(\"keydown\", handleEscape);\n        }\n\n        return () => {\n            document.removeEventListener(\"keydown\", handleEscape);\n        };\n    }, [isOpen, closeOnEscape, onCancel, isLoading]);\n\n    const handleOverlayClick = (event: React.MouseEvent) => {\n        if (event.target === event.currentTarget && closeOnOverlayClick && !isLoading) {\n            onCancel();\n        }\n    };\n\n    const handleConfirm = () => {\n        if (!isLoading) {\n            onConfirm();\n        }\n    };\n\n    const handleCancel = () => {\n        if (!isLoading) {\n            onCancel();\n        }\n    };\n\n    const getTypeStyles = () => {\n        const typeMap = {\n            default: {\n                icon: Info,\n                iconColor: \"text-blue-600\",\n                iconBg: \"bg-blue-100\",\n                confirmButton: \"bg-blue-600 hover:bg-blue-700 focus:ring-blue-500\",\n            },\n            danger: {\n                icon: XCircle,\n                iconColor: \"text-red-600\",\n                iconBg: \"bg-red-100\",\n                confirmButton: \"bg-red-600 hover:bg-red-700 focus:ring-red-500\",\n            },\n            warning: {\n                icon: AlertTriangle,\n                iconColor: \"text-yellow-600\",\n                iconBg: \"bg-yellow-100\",\n                confirmButton: \"bg-yellow-600 hover:bg-yellow-700 focus:ring-yellow-500\",\n            },\n            success: {\n                icon: CheckCircle,\n                iconColor: \"text-green-600\",\n                iconBg: \"bg-green-100\",\n                confirmButton: \"bg-green-600 hover:bg-green-700 focus:ring-green-500\",\n            },\n            info: {\n                icon: Info,\n                iconColor: \"text-blue-600\",\n                iconBg: \"bg-blue-100\",\n                confirmButton: \"bg-blue-600 hover:bg-blue-700 focus:ring-blue-500\",\n            },\n        };\n        return typeMap[type];\n    };\n\n    const getMaxWidthClass = () => {\n        const widthMap = {\n            sm: \"max-w-sm\",\n            md: \"max-w-md\",\n            lg: \"max-w-lg\",\n        };\n        return widthMap[maxWidth];\n    };\n\n    const typeStyles = getTypeStyles();\n    const IconComponent = typeStyles.icon;\n\n    if (!isOpen) return null;\n\n    return (\n        <div\n            className={`fixed inset-0 z-50 ${overlayClassName}`}\n            role='dialog'\n            aria-modal='true'\n            aria-labelledby={title ? \"confirmation-title\" : undefined}\n            aria-describedby='confirmation-message'\n        >\n            {/* Backdrop */}\n            <div\n                className='fixed inset-0 bg-black/50 backdrop-blur-sm transition-opacity duration-300'\n                onClick={handleOverlayClick}\n            />\n\n            {/* Popup Container */}\n            <div className='fixed inset-0 flex items-center justify-center p-4'>\n                {/* Popup Content */}\n                <div\n                    ref={popupRef}\n                    className={`relative w-full ${getMaxWidthClass()} animate-in fade-in-0 zoom-in-95 slide-in-from-bottom-4 transform rounded-2xl bg-white shadow-2xl transition-all duration-300 ease-out ${className} `}\n                    onClick={(e) => e.stopPropagation()}\n                >\n                    {/* Close Button */}\n                    {showCloseButton && (\n                        <button\n                            onClick={handleCancel}\n                            disabled={isLoading}\n                            className='absolute right-4 top-4 flex h-8 w-8 items-center justify-center rounded-full text-gray-400 transition-colors duration-200 hover:bg-gray-100 hover:text-gray-600 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50'\n                            aria-label='Close'\n                        >\n                            <X size={20} />\n                        </button>\n                    )}\n\n                    {/* Content */}\n                    <div className='p-6'>\n                        <div className='flex flex-col items-center justify-center space-y-4'>\n                            {/* Icon */}\n                            {showIcon && (\n                                <div\n                                    className={`h-12 w-12 flex-shrink-0 rounded-full ${typeStyles.iconBg} flex items-center justify-center`}\n                                >\n                                    <IconComponent size={24} className={typeStyles.iconColor} />\n                                </div>\n                            )}\n\n                            {/* Text Content */}\n                            <div className='min-w-0 flex-1 justify-center'>\n                                {title && (\n                                    <h3\n                                        id='confirmation-title'\n                                        className='mb-1 text-center text-lg font-semibold text-gray-900'\n                                    >\n                                        {title}\n                                    </h3>\n                                )}\n                                <p\n                                    id='confirmation-message'\n                                    className='leading-relaxed text-gray-600'\n                                >\n                                    {message}\n                                </p>\n                            </div>\n                        </div>\n\n                        {/* Action Buttons */}\n                        <div\n                            className={`flex ${showIcon ? \"justify-center\" : \"justify-center\"} mt-6 space-x-3`}\n                        >\n                            <Button\n                                variant='neutral'\n                                outline\n                                size='sm'\n                                data-cancel-button=''\n                                onClick={handleCancel}\n                                disabled={isLoading}\n                            >\n                                {cancelText}\n                            </Button>\n\n                            <button\n                                ref={confirmButtonRef}\n                                onClick={handleConfirm}\n                                disabled={isLoading}\n                                className={`flex min-w-[80px] items-center justify-center rounded-xl px-4 py-2 text-sm font-medium text-white transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 ${typeStyles.confirmButton} `}\n                            >\n                                {isLoading ? (\n                                    <div className='h-4 w-4 animate-spin rounded-full border-2 border-white border-t-transparent' />\n                                ) : (\n                                    confirmText\n                                )}\n                            </button>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default ConfirmationAlert;\n\n// Hook for easier usage\nexport const useConfirmation = () => {\n    const [confirmationState, setConfirmationState] = React.useState<{\n        isOpen: boolean;\n        config: Partial<ConfirmationPopupProps>;\n        resolve?: (value: boolean) => void;\n    }>({\n        isOpen: false,\n        config: {},\n    });\n\n    const confirm = (\n        config: Omit<ConfirmationPopupProps, \"isOpen\" | \"onConfirm\" | \"onCancel\">\n    ): Promise<boolean> => {\n        return new Promise((resolve) => {\n            setConfirmationState({\n                isOpen: true,\n                config,\n                resolve,\n            });\n        });\n    };\n\n    const handleConfirm = () => {\n        setConfirmationState((prev) => ({ ...prev, isOpen: false }));\n        confirmationState.resolve?.(true);\n    };\n\n    const handleCancel = () => {\n        setConfirmationState((prev) => ({ ...prev, isOpen: false }));\n        confirmationState.resolve?.(false);\n    };\n\n    const ConfirmationDialog = () => (\n        <ConfirmationAlert\n            {...confirmationState.config}\n            isOpen={confirmationState.isOpen}\n            onConfirm={handleConfirm}\n            onCancel={handleCancel}\n        />\n    );\n\n    return { confirm, ConfirmationDialog };\n};\n\n// Example usage component\nexport const ConfirmationExample: React.FC = () => {\n    const [isOpen, setIsOpen] = React.useState(false);\n    const [type, setType] = React.useState<ConfirmationType>(\"default\");\n    const [isLoading, setIsLoading] = React.useState(false);\n    const { confirm, ConfirmationDialog } = useConfirmation();\n\n    const handleDirectConfirmation = async (confirmationType: ConfirmationType) => {\n        setType(confirmationType);\n        setIsOpen(true);\n    };\n\n    const handleHookConfirmation = async (confirmationType: ConfirmationType) => {\n        const configs: Record<ConfirmationType, Partial<ConfirmationPopupProps>> = {\n            default: {\n                title: \"Confirm Action\",\n                message: \"Are you sure you want to continue with this action?\",\n                type: \"default\",\n            },\n            danger: {\n                title: \"Delete Item\",\n                message:\n                    \"This action cannot be undone. Are you sure you want to delete this item permanently?\",\n                confirmText: \"Delete\",\n                type: \"danger\",\n            },\n            warning: {\n                title: \"Warning\",\n                message: \"This action may have unintended consequences. Do you want to proceed?\",\n                confirmText: \"Proceed\",\n                type: \"warning\",\n            },\n            success: {\n                title: \"Success Action\",\n                message: \"Everything looks good! Would you like to save these changes?\",\n                confirmText: \"Save\",\n                type: \"success\",\n            },\n            info: {\n                title: \"Information\",\n                message: \"This will update your preferences. Continue?\",\n                confirmText: \"Update\",\n                type: \"info\",\n            },\n        };\n\n        const result = await confirm(configs[confirmationType]);\n        alert(`User ${result ? \"confirmed\" : \"cancelled\"} the action`);\n    };\n\n    const handleConfirm = async () => {\n        setIsLoading(true);\n        // Simulate API call\n        await new Promise((resolve) => setTimeout(resolve, 2000));\n        setIsLoading(false);\n        setIsOpen(false);\n        alert(\"Action confirmed!\");\n    };\n\n    const handleCancel = () => {\n        setIsOpen(false);\n        alert(\"Action cancelled!\");\n    };\n\n    return (\n        <div className='space-y-6 p-8'>\n            <div>\n                <h2 className='mb-4 text-2xl font-bold text-gray-900'>\n                    Confirmation Popup Examples\n                </h2>\n\n                <div className='space-y-4'>\n                    <div>\n                        <h3 className='mb-3 text-lg font-semibold text-gray-800'>\n                            Direct Component Usage\n                        </h3>\n                        <div className='flex flex-wrap gap-3'>\n                            {(\n                                [\n                                    \"default\",\n                                    \"danger\",\n                                    \"warning\",\n                                    \"success\",\n                                    \"info\",\n                                ] as ConfirmationType[]\n                            ).map((confirmationType) => (\n                                <button\n                                    key={confirmationType}\n                                    onClick={() => handleDirectConfirmation(confirmationType)}\n                                    className={`rounded-lg px-4 py-2 font-medium capitalize text-white transition-colors duration-200 ${\n                                        confirmationType === \"default\"\n                                            ? \"bg-blue-600 hover:bg-blue-700\"\n                                            : confirmationType === \"danger\"\n                                              ? \"bg-red-600 hover:bg-red-700\"\n                                              : confirmationType === \"warning\"\n                                                ? \"bg-yellow-600 hover:bg-yellow-700\"\n                                                : confirmationType === \"success\"\n                                                  ? \"bg-green-600 hover:bg-green-700\"\n                                                  : \"bg-blue-600 hover:bg-blue-700\"\n                                    }`}\n                                >\n                                    {confirmationType} Popup\n                                </button>\n                            ))}\n                        </div>\n                    </div>\n\n                    <div>\n                        <h3 className='mb-3 text-lg font-semibold text-gray-800'>\n                            Hook Usage (Recommended)\n                        </h3>\n                        <div className='flex flex-wrap gap-3'>\n                            {(\n                                [\n                                    \"default\",\n                                    \"danger\",\n                                    \"warning\",\n                                    \"success\",\n                                    \"info\",\n                                ] as ConfirmationType[]\n                            ).map((confirmationType) => (\n                                <button\n                                    key={`hook-${confirmationType}`}\n                                    onClick={() => handleHookConfirmation(confirmationType)}\n                                    className={`rounded-lg px-4 py-2 font-medium capitalize text-white transition-colors duration-200 ${\n                                        confirmationType === \"default\"\n                                            ? \"bg-blue-500 hover:bg-blue-600\"\n                                            : confirmationType === \"danger\"\n                                              ? \"bg-red-500 hover:bg-red-600\"\n                                              : confirmationType === \"warning\"\n                                                ? \"bg-yellow-500 hover:bg-yellow-600\"\n                                                : confirmationType === \"success\"\n                                                  ? \"bg-green-500 hover:bg-green-600\"\n                                                  : \"bg-blue-500 hover:bg-blue-600\"\n                                    }`}\n                                >\n                                    Hook {confirmationType}\n                                </button>\n                            ))}\n                        </div>\n                    </div>\n                </div>\n            </div>\n\n            {/* Direct Component */}\n            <ConfirmationAlert\n                isOpen={isOpen}\n                onConfirm={handleConfirm}\n                onCancel={handleCancel}\n                title='Confirm Action'\n                message='Are you sure you want to continue? This action cannot be undone.'\n                confirmText='Yes, Continue'\n                cancelText='Cancel'\n                type={type}\n                isLoading={isLoading}\n            />\n\n            {/* Hook Component */}\n            <ConfirmationDialog />\n        </div>\n    );\n};\n"],"names":["ConfirmationAlert","_a","isOpen","onConfirm","onCancel","title","message","_b","confirmText","_c","cancelText","_d","type","_e","showIcon","_f","showCloseButton","_g","closeOnOverlayClick","_h","closeOnEscape","_j","isLoading","_k","className","_l","overlayClassName","_m","maxWidth","popupRef","useRef","confirmButtonRef","previousFocusRef","useEffect","current","document","activeElement","setTimeout","querySelector","focus","body","style","overflow","handleEscape","event","key","addEventListener","removeEventListener","handleCancel","typeStyles","default","icon","Info","iconColor","iconBg","confirmButton","danger","XCircle","warning","AlertTriangle","success","CheckCircle","info","IconComponent","_jsxs","concat","role","undefined","children","_jsx","onClick","target","currentTarget","ref","sm","md","lg","e","stopPropagation","disabled","X","size","id","Button","variant","outline"],"mappings":"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"}

package/dist/esm/components/Badge/Badge.mjs

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";var r=function(r){var t=r.children,o=r.variant,n=void 0===o?"default":o,a=r.size,i=void 0===a?"md":a,l=r.className,d=void 0===l?"":l,g=r.onClick,s=["inline-flex items-center font-medium rounded-full transition-colors duration-200",{default:"bg-gray-100 text-gray-800 hover:bg-gray-200",secondary:"bg-blue-100 text-blue-800 hover:bg-blue-200",success:"bg-green-100 text-green-800 hover:bg-green-200",warning:"bg-yellow-100 text-yellow-800 hover:bg-yellow-200",error:"bg-red-100 text-red-800 hover:bg-red-200",info:"bg-cyan-100 text-cyan-800 hover:bg-cyan-200"}[n],{sm:"px-2 py-0.5 text-xs",md:"px-2.5 py-1 text-sm",lg:"px-3 py-1.5 text-base"}[i],g?"cursor-pointer":"",d].filter(Boolean).join(" ");return e("span",{className:s,onClick:g,role:g?"button":void 0,tabIndex:g?0:void 0,onKeyDown:g?function(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),g())}:void 0,children:t})};export{r as default};
+//# sourceMappingURL=Badge.mjs.map

package/dist/esm/components/Badge/Badge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.mjs","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from \"react\";\n\nexport type BadgeVariant = \"default\" | \"secondary\" | \"success\" | \"warning\" | \"error\" | \"info\";\nexport interface BadgeProps {\n    children: React.ReactNode;\n    variant?: BadgeVariant;\n    size?: \"sm\" | \"md\" | \"lg\";\n    className?: string;\n    onClick?: () => void;\n}\n\nconst Badge: React.FC<BadgeProps> = ({\n    children,\n    variant = \"default\",\n    size = \"md\",\n    className = \"\",\n    onClick,\n}) => {\n    const baseClasses =\n        \"inline-flex items-center font-medium rounded-full transition-colors duration-200\";\n\n    const variantClasses = {\n        default: \"bg-gray-100 text-gray-800 hover:bg-gray-200\",\n        secondary: \"bg-blue-100 text-blue-800 hover:bg-blue-200\",\n        success: \"bg-green-100 text-green-800 hover:bg-green-200\",\n        warning: \"bg-yellow-100 text-yellow-800 hover:bg-yellow-200\",\n        error: \"bg-red-100 text-red-800 hover:bg-red-200\",\n        info: \"bg-cyan-100 text-cyan-800 hover:bg-cyan-200\",\n    };\n\n    const sizeClasses = {\n        sm: \"px-2 py-0.5 text-xs\",\n        md: \"px-2.5 py-1 text-sm\",\n        lg: \"px-3 py-1.5 text-base\",\n    };\n\n    const classes = [\n        baseClasses,\n        variantClasses[variant],\n        sizeClasses[size],\n        onClick ? \"cursor-pointer\" : \"\",\n        className,\n    ]\n        .filter(Boolean)\n        .join(\" \");\n\n    return (\n        <span\n            className={classes}\n            onClick={onClick}\n            role={onClick ? \"button\" : undefined}\n            tabIndex={onClick ? 0 : undefined}\n            onKeyDown={\n                onClick\n                    ? (e) => {\n                          if (e.key === \"Enter\" || e.key === \" \") {\n                              e.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {children}\n        </span>\n    );\n};\n\nexport default Badge;\n"],"names":["Badge","_a","children","_b","variant","_c","size","_d","className","onClick","classes","default","secondary","success","warning","error","info","sm","md","lg","filter","Boolean","join","_jsx","role","undefined","tabIndex","onKeyDown","e","key","preventDefault"],"mappings":"wCAWA,IAAMA,EAA8B,SAACC,OACjCC,EAAQD,EAAAC,SACRC,EAAAF,EAAAG,QAAAA,aAAU,UAASD,EACnBE,EAAAJ,EAAAK,KAAAA,aAAO,KAAID,EACXE,EAAAN,EAAAO,UAAAA,aAAY,GAAED,EACdE,EAAOR,EAAAQ,QAoBDC,EAAU,CAjBZ,mFAEmB,CACnBC,QAAS,8CACTC,UAAW,8CACXC,QAAS,iDACTC,QAAS,oDACTC,MAAO,2CACPC,KAAM,+CAWSZ,GARC,CAChBa,GAAI,sBACJC,GAAI,sBACJC,GAAI,yBAMQb,GACZG,EAAU,iBAAmB,GAC7BD,GAECY,OAAOC,SACPC,KAAK,KAEV,OACIC,EAAA,OAAA,CACIf,UAAWE,EACXD,QAASA,EACTe,KAAMf,EAAU,cAAWgB,EAC3BC,SAAUjB,EAAU,OAAIgB,EACxBE,UACIlB,EACM,SAACmB,GACiB,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACvBD,EAAEE,iBACFrB,IAER,OACAgB,EAASvB,SAGlBA,GAGb"}

package/dist/esm/components/Breadcrumb/Breadcrumb.mjs

@@ -0,0 +1,2 @@
+import{jsxs as r,jsx as a}from"react/jsx-runtime";import{ChevronLeft as e}from"lucide-react";var t=function(t){var i=t.items,c=void 0===i?[]:i,o=t.onBackClick,n=t.showBackButton,s=void 0===n||n,l=t.separator,m=void 0===l?" / ":l,d=t.className;return r("div",{className:"flex gap-2 ".concat(void 0===d?"":d),children:[s&&a("div",{onClick:o,className:"cursor-pointer",children:a(e,{className:"text-gray-500 transition-colors hover:text-gray-700"})}),a("p",{className:"text-gray-400",children:c.map((function(e,t){return r("span",{children:[e.isActive?a("span",{className:"text-primary",children:e.label}):a("span",{className:e.onClick?"cursor-pointer transition-colors hover:text-gray-600":"",onClick:e.onClick,children:e.label}),t<c.length-1&&m]},t)}))})]})};export{t as default};
+//# sourceMappingURL=Breadcrumb.mjs.map

package/dist/esm/components/Breadcrumb/Breadcrumb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.mjs","sources":["../../../../src/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, { FC } from \"react\";\n\nimport { ChevronLeft } from \"lucide-react\";\n\nexport type BreadcrumbItem = {\n    label: string;\n    href?: string;\n    isActive?: boolean;\n    onClick?: () => void;\n};\n\nexport interface BreadcrumbProps {\n    items: BreadcrumbItem[];\n    showBackButton?: boolean;\n    onBackClick?: () => void;\n    separator?: string;\n    backButtonLabel?: string;\n    className?: string;\n}\n\nconst Breadcrumb: FC<BreadcrumbProps> = ({\n    items = [],\n    onBackClick,\n    showBackButton = true,\n    separator = \" / \",\n    className = \"\",\n}) => {\n    return (\n        <div className={`flex gap-2 ${className}`}>\n            {showBackButton && (\n                <div onClick={onBackClick} className='cursor-pointer'>\n                    <ChevronLeft className='text-gray-500 transition-colors hover:text-gray-700' />\n                </div>\n            )}\n            <p className='text-gray-400'>\n                {items.map((item, index) => (\n                    <span key={index}>\n                        {item.isActive ? (\n                            <span className='text-primary'>{item.label}</span>\n                        ) : (\n                            <span\n                                className={\n                                    item.onClick\n                                        ? \"cursor-pointer transition-colors hover:text-gray-600\"\n                                        : \"\"\n                                }\n                                onClick={item.onClick}\n                            >\n                                {item.label}\n                            </span>\n                        )}\n                        {index < items.length - 1 && separator}\n                    </span>\n                ))}\n            </p>\n        </div>\n    );\n};\n\nexport default Breadcrumb;\n"],"names":["Breadcrumb","_a","_b","items","onBackClick","_c","showBackButton","_d","separator","_e","className","_jsxs","children","_jsx","onClick","ChevronLeft","map","item","index","isActive","label","length"],"mappings":"6FAoBA,IAAMA,EAAkC,SAACC,GACrC,IAAAC,EAAAD,EAAAE,MAAAA,OAAK,IAAAD,EAAG,GAAEA,EACVE,EAAWH,EAAAG,YACXC,EAAAJ,EAAAK,eAAAA,OAAc,IAAAD,GAAOA,EACrBE,EAAAN,EAAAO,UAAAA,OAAS,IAAAD,EAAG,MAAKA,EACjBE,EAAAR,EAAAS,UAEA,OACIC,EAAA,MAAA,CAAKD,UAAW,0BAHX,IAAAD,EAAG,GAAEA,GAG+BG,SAAA,CACpCN,GACGO,EAAA,MAAA,CAAKC,QAASV,EAAaM,UAAU,iBAAgBE,SACjDC,EAACE,EAAW,CAACL,UAAU,0DAG/BG,EAAA,IAAA,CAAGH,UAAU,gBAAeE,SACvBT,EAAMa,KAAI,SAACC,EAAMC,GAAU,OACxBP,EAAA,OAAA,CAAAC,SAAA,CACKK,EAAKE,SACFN,EAAA,OAAA,CAAMH,UAAU,eAAcE,SAAEK,EAAKG,QAErCP,EAAA,OAAA,CACIH,UACIO,EAAKH,QACC,uDACA,GAEVA,QAASG,EAAKH,QAAOF,SAEpBK,EAAKG,QAGbF,EAAQf,EAAMkB,OAAS,GAAKb,IAftBU,EADa,QAsB5C"}

package/dist/esm/components/Button/Button.mjs

@@ -0,0 +1,2 @@
+import{jsx as r,jsxs as e,Fragment as t}from"react/jsx-runtime";import o from"../../_virtual/index.mjs";var i=function(i){var a=i.children,d=i.onClick,n=i.type,l=void 0===n?"button":n,s=i.size,b=void 0===s?"md":s,h=i.variant,g=void 0===h?"primary":h,m=i.disabled,y=void 0!==m&&m,x=i.className,c=i.icon,p=i.loading,v=void 0!==p&&p,w=i.outline,u=void 0!==w&&w,f=i.iconPosition,k=void 0===f?"left":f,N=o("animate-spin -ml-1 mr-3",{"h-4 w-4":"xs"===b||"sm"===b,"h-5 w-5":"md"===b,"h-6 w-6":"lg"===b},"primary"===g?"text-white":"text-primary"),C=o("rounded-xl text-sm transition-all font-semibold duration-300 inline-flex items-center justify-center ease-in-out",{xs:"px-3 py-1 text-sm",sm:"px-5 py-2 text-sm",md:"px-6 py-3 text-md",lg:"px-8 py-4 text-lg"}[b],{primary:{solid:"bg-primary text-white hover:bg-primary-700 border border-primary",outline:"bg-transparent text-primary hover:bg-primary hover:text-white border border-primary"},secondary:{solid:"bg-secondary text-white hover:bg-white hover:text-secondary border border-secondary",outline:"bg-transparent text-secondary hover:bg-secondary hover:text-white border border-secondary"},dark:{solid:"bg-dark text-white hover:bg-primary hover:border-primary border border-dark",outline:"bg-transparent text-dark hover:bg-dark hover:text-white border border-dark"},neutral:{solid:"bg-white text-gray-700 hover:bg-gray-300 hover:text-white border border-gray-300",outline:"bg-transparent text-gray-700 hover:bg-gray-200 border border-gray-300"},danger:{solid:"bg-red-600 text-white hover:bg-red-200 hover:text-white border border-red-300",outline:"bg-transparent text-red-600 hover:bg-red-200 border border-red-300"},default:{solid:"bg-white text-gray-700 hover:bg-gray-300 hover:text-white border border-gray-300",outline:"bg-transparent text-gray-700 hover:bg-gray-200 border border-gray-300"}}[g][u?"outline":"solid"],y?"opacity-50 cursor-not-allowed":"hover:shadow-lg",x,{"flex-row-reverse":"right"===k}),j="left"===k?"mr-2":"ml-2";return r("button",{type:l,onClick:d,disabled:y,className:C,children:e(t,v?{children:[e("svg",{className:N,xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[r("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),r("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),a]}:{children:[c&&r("span",{className:j,children:c}),a]})})};export{i as default};
+//# sourceMappingURL=Button.mjs.map

package/dist/esm/components/Button/Button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.mjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { FC, ReactNode } from \"react\";\nimport classNames from \"classnames\";\n\nexport interface ButtonProps {\n  /** The content of the button */\n  children: ReactNode;\n\n  /** Click handler function */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** HTML button type attribute */\n  type?: \"button\" | \"submit\" | \"reset\";\n\n  /** Size of the button */\n  size?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n\n  /** Visual style variant */\n  variant?: \"primary\" | \"secondary\" | \"dark\" | \"neutral\" | \"danger\" | \"default\";\n\n  /** Disabled state of the button */\n  disabled?: boolean;\n\n  /** Additional CSS classes */\n  className?: string;\n\n  /** Optional icon to display before text */\n  icon?: ReactNode;\n\n  /** Loading state - shows spinner */\n  loading?: boolean;\n\n  /** Outline style instead of solid */\n  outline?: boolean;\n\n  /** Position of the icon relative to text */\n  iconPosition?: \"left\" | \"right\";\n}\n\nconst Button: FC<ButtonProps> = ({\n  children,\n  onClick,\n  type = \"button\",\n  size = \"md\",\n  variant = \"primary\",\n  disabled = false,\n  className,\n  icon,\n  loading = false,\n  outline = false,\n  iconPosition = \"left\",\n}) => {\n  const baseClasses =\n    \"rounded-xl text-sm transition-all font-semibold duration-300 inline-flex items-center justify-center ease-in-out\";\n  const sizeClasses = {\n    xs: \"px-3 py-1 text-sm\",\n    sm: \"px-5 py-2 text-sm\",\n    md: \"px-6 py-3 text-md\",\n    lg: \"px-8 py-4 text-lg\",\n  };\n\n  const variantClasses = {\n    primary: {\n      solid: \"bg-primary text-white hover:bg-primary-700 border border-primary\",\n      outline:\n        \"bg-transparent text-primary hover:bg-primary hover:text-white border border-primary\",\n    },\n    secondary: {\n      solid:\n        \"bg-secondary text-white hover:bg-white hover:text-secondary border border-secondary\",\n      outline:\n        \"bg-transparent text-secondary hover:bg-secondary hover:text-white border border-secondary\",\n    },\n    dark: {\n      solid:\n        \"bg-dark text-white hover:bg-primary hover:border-primary border border-dark\",\n      outline:\n        \"bg-transparent text-dark hover:bg-dark hover:text-white border border-dark\",\n    },\n    neutral: {\n      solid:\n        \"bg-white text-gray-700 hover:bg-gray-300 hover:text-white border border-gray-300\",\n      outline:\n        \"bg-transparent text-gray-700 hover:bg-gray-200 border border-gray-300\",\n    },\n    danger: {\n      solid:\n        \"bg-red-600 text-white hover:bg-red-200 hover:text-white border border-red-300\",\n      outline:\n        \"bg-transparent text-red-600 hover:bg-red-200 border border-red-300\",\n    },\n    default: {\n      solid:\n        \"bg-white text-gray-700 hover:bg-gray-300 hover:text-white border border-gray-300\",\n      outline:\n        \"bg-transparent text-gray-700 hover:bg-gray-200 border border-gray-300\",\n    },\n  };\n\n  const spinnerClasses = classNames(\n    \"animate-spin -ml-1 mr-3\",\n    {\n      \"h-4 w-4\": size === \"xs\" || size === \"sm\",\n      \"h-5 w-5\": size === \"md\",\n      \"h-6 w-6\": size === \"lg\",\n    },\n    variant === \"primary\" ? \"text-white\" : \"text-primary\",\n  );\n\n  const classes = classNames(\n    baseClasses,\n    sizeClasses[size],\n    variantClasses[variant][outline ? \"outline\" : \"solid\"],\n    disabled ? \"opacity-50 cursor-not-allowed\" : \"hover:shadow-lg\",\n    className,\n    {\n      \"flex-row-reverse\": iconPosition === \"right\",\n    },\n  );\n\n  const iconSpacingClass = iconPosition === \"left\" ? \"mr-2\" : \"ml-2\";\n\n  return (\n    <button\n      type={type}\n      onClick={onClick}\n      disabled={disabled}\n      className={classes}\n    >\n      {loading ? (\n        <>\n          <svg\n            className={spinnerClasses}\n            xmlns=\"http://www.w3.org/2000/svg\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n          >\n            <circle\n              className=\"opacity-25\"\n              cx=\"12\"\n              cy=\"12\"\n              r=\"10\"\n              stroke=\"currentColor\"\n              strokeWidth=\"4\"\n            ></circle>\n            <path\n              className=\"opacity-75\"\n              fill=\"currentColor\"\n              d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n            ></path>\n          </svg>\n          {children}\n        </>\n      ) : (\n        <>\n          {icon && <span className={iconSpacingClass}>{icon}</span>}\n          {children}\n        </>\n      )}\n    </button>\n  );\n};\n\n/**\n * A customizable button component with multiple variants, sizes, and states.\n *\n * @example\n * <Button\n *   variant=\"primary\"\n *   size=\"large\"\n *   onClick={() => console.log('Clicked!')}\n * >\n *   Click Me\n * </Button>\n *\n * @param {ButtonProps} props - The component props\n * @returns {JSX.Element} A styled button element\n */\nexport default Button;\n"],"names":["Button","_a","children","onClick","_b","type","_c","size","_d","variant","_e","disabled","className","icon","_f","loading","_g","outline","_h","iconPosition","spinnerClasses","classNames","classes","xs","sm","md","lg","primary","solid","secondary","dark","neutral","danger","default","iconSpacingClass","_jsx","_jsxs","_Fragment","xmlns","fill","viewBox","cx","cy","r","stroke","strokeWidth","d"],"mappings":"wGAsCA,IAAMA,EAA0B,SAACC,OAC/BC,EAAQD,EAAAC,SACRC,EAAOF,EAAAE,QACPC,EAAAH,EAAAI,KAAAA,OAAI,IAAAD,EAAG,SAAQA,EACfE,EAAAL,EAAAM,KAAAA,OAAI,IAAAD,EAAG,KAAIA,EACXE,EAAAP,EAAAQ,QAAAA,OAAO,IAAAD,EAAG,UAASA,EACnBE,EAAAT,EAAAU,SAAAA,cAAgBD,EAChBE,EAASX,EAAAW,UACTC,EAAIZ,EAAAY,KACJC,EAAAb,EAAAc,QAAAA,OAAO,IAAAD,GAAQA,EACfE,EAAAf,EAAAgB,QAAAA,OAAO,IAAAD,GAAQA,EACfE,EAAAjB,EAAAkB,aAAAA,OAAY,IAAAD,EAAG,OAAMA,EAiDfE,EAAiBC,EACrB,0BACA,CACE,UAAoB,OAATd,GAA0B,OAATA,EAC5B,UAAoB,OAATA,EACX,UAAoB,OAATA,GAED,YAAZE,EAAwB,aAAe,gBAGnCa,EAAUD,EAxDd,mHACkB,CAClBE,GAAI,oBACJC,GAAI,oBACJC,GAAI,oBACJC,GAAI,qBAqDQnB,GAlDS,CACrBoB,QAAS,CACPC,MAAO,mEACPX,QACE,uFAEJY,UAAW,CACTD,MACE,sFACFX,QACE,6FAEJa,KAAM,CACJF,MACE,8EACFX,QACE,8EAEJc,QAAS,CACPH,MACE,mFACFX,QACE,yEAEJe,OAAQ,CACNJ,MACE,gFACFX,QACE,sEAEJgB,QAAS,CACPL,MACE,mFACFX,QACE,0EAiBWR,GAASQ,EAAU,UAAY,SAC9CN,EAAW,gCAAkC,kBAC7CC,EACA,CACE,mBAAqC,UAAjBO,IAIlBe,EAAoC,SAAjBf,EAA0B,OAAS,OAE5D,OACEgB,YACE9B,KAAMA,EACNF,QAASA,EACTQ,SAAUA,EACVC,UAAWU,EAAOpB,SAGhBkC,EAAAC,EADDtB,EACC,CAAAb,SAAA,CACEkC,EAAA,MAAA,CACExB,UAAWQ,EACXkB,MAAM,6BACNC,KAAK,OACLC,QAAQ,YAAWtC,SAAA,CAEnBiC,EAAA,SAAA,CACEvB,UAAU,aACV6B,GAAG,KACHC,GAAG,KACHC,EAAE,KACFC,OAAO,eACPC,YAAY,MAEdV,EAAA,OAAA,CACEvB,UAAU,aACV2B,KAAK,eACLO,EAAE,uHAGL5C,IAGH,CAAAA,SAAA,CACGW,GAAQsB,EAAA,OAAA,CAAMvB,UAAWsB,EAAgBhC,SAAGW,IAC5CX,MAKX"}

package/dist/esm/components/Button/ExportButton.mjs

@@ -0,0 +1,2 @@
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r,useRef as n,useEffect as o}from"react";import{Download as c,ChevronDown as i,FileText as a,FileSpreadsheet as l}from"lucide-react";var s;function m(){var m=r(!1),u=m[0],d=m[1],f=n(null),g=function(e){d(!1)};return o((function(){var e=function(e){f.current&&!f.current.contains(e.target)&&d(!1)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[]),e("div",{className:"relative inline-block",ref:f,children:[e("div",{className:"flex",children:[e("button",{className:"flex items-center rounded-l-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none",onClick:function(){return g(s.PDF)},children:[t(c,{className:"mr-2 h-4 w-4"}),"Export"]}),t("button",{className:"rounded-r-md border border-l-0 border-gray-300 bg-white px-2 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none",onClick:function(){d(!u)},children:t(i,{className:"h-4 w-4"})})]}),u&&t("div",{className:"absolute right-0 z-10 mt-1 w-48 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none",children:e("div",{className:"py-1",children:[e("button",{onClick:function(){return g(s.PDF)},className:"flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100",children:[t(a,{className:"mr-2 h-4 w-4"}),"PDF Document"]}),e("button",{onClick:function(){return g(s.CSV)},className:"flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100",children:[t(l,{className:"mr-2 h-4 w-4"}),"CSV Spreadsheet"]}),e("button",{onClick:function(){return g(s.EXCEL)},className:"flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100",children:[t(l,{className:"mr-2 h-4 w-4"}),"Excel Spreadsheet"]})]})})]})}!function(e){e[e.PDF=0]="PDF",e[e.CSV=1]="CSV",e[e.EXCEL=2]="EXCEL",e[e.JSON=3]="JSON"}(s||(s={}));export{s as ExportFormatEnum,m as default};
+//# sourceMappingURL=ExportButton.mjs.map

package/dist/esm/components/Button/ExportButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportButton.mjs","sources":["../../../../src/components/Button/ExportButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { ChevronDown, Download, FileSpreadsheet, FileText } from \"lucide-react\";\n\nexport enum ExportFormatEnum {\n    PDF,\n    CSV,\n    EXCEL,\n    JSON,\n}\nexport default function ExportButton() {\n    const [isOpen, setIsOpen] = useState(false);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    const toggleDropdown = () => {\n        setIsOpen(!isOpen);\n    };\n\n    const handleExport = (format: ExportFormatEnum) => {\n        setIsOpen(false);\n    };\n\n    // Close dropdown when clicking outside\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {\n                setIsOpen(false);\n            }\n        };\n\n        document.addEventListener(\"mousedown\", handleClickOutside);\n        return () => {\n            document.removeEventListener(\"mousedown\", handleClickOutside);\n        };\n    }, []);\n\n    return (\n        <div className='relative inline-block' ref={dropdownRef}>\n            <div className='flex'>\n                <button\n                    className='flex items-center rounded-l-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none'\n                    onClick={() => handleExport(ExportFormatEnum.PDF)}\n                >\n                    <Download className='mr-2 h-4 w-4' />\n                    Export\n                </button>\n                <button\n                    className='rounded-r-md border border-l-0 border-gray-300 bg-white px-2 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none'\n                    onClick={toggleDropdown}\n                >\n                    <ChevronDown className='h-4 w-4' />\n                </button>\n            </div>\n\n            {isOpen && (\n                <div className='absolute right-0 z-10 mt-1 w-48 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none'>\n                    <div className='py-1'>\n                        <button\n                            onClick={() => handleExport(ExportFormatEnum.PDF)}\n                            className='flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100'\n                        >\n                            <FileText className='mr-2 h-4 w-4' />\n                            PDF Document\n                        </button>\n                        <button\n                            onClick={() => handleExport(ExportFormatEnum.CSV)}\n                            className='flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100'\n                        >\n                            <FileSpreadsheet className='mr-2 h-4 w-4' />\n                            CSV Spreadsheet\n                        </button>\n                        <button\n                            onClick={() => handleExport(ExportFormatEnum.EXCEL)}\n                            className='flex w-full items-center px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100'\n                        >\n                            <FileSpreadsheet className='mr-2 h-4 w-4' />\n                            Excel Spreadsheet\n                        </button>\n                        {/*<button*/}\n                        {/*    onClick={() => handleExport(ExportFormatEnum.JSON)}*/}\n                        {/*    className=\"flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left\"*/}\n                        {/*>*/}\n                        {/*    <File className=\"w-4 h-4 mr-2\" />*/}\n                        {/*    JSON File*/}\n                        {/*</button>*/}\n                    </div>\n                </div>\n            )}\n        </div>\n    );\n}\n"],"names":["ExportFormatEnum","ExportButton","_a","useState","isOpen","setIsOpen","dropdownRef","useRef","handleExport","format","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","_jsxs","className","ref","children","onClick","PDF","_jsx","Download","ChevronDown","FileText","CSV","FileSpreadsheet","EXCEL"],"mappings":"8MAIYA,EAME,SAAUC,IACd,IAAAC,EAAsBC,GAAS,GAA9BC,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAClBI,EAAcC,EAAuB,MAMrCC,EAAe,SAACC,GAClBJ,GAAU,EACd,EAgBA,OAbAK,GAAU,WACN,IAAMC,EAAqB,SAACC,GACpBN,EAAYO,UAAYP,EAAYO,QAAQC,SAASF,EAAMG,SAC3DV,GAAU,EAElB,EAGA,OADAW,SAASC,iBAAiB,YAAaN,GAChC,WACHK,SAASE,oBAAoB,YAAaP,EAC9C,CACJ,GAAG,IAGCQ,EAAA,MAAA,CAAKC,UAAU,wBAAwBC,IAAKf,EAAWgB,SAAA,CACnDH,SAAKC,UAAU,OAAME,SAAA,CACjBH,YACIC,UAAU,iJACVG,QAAS,WAAM,OAAAf,EAAaR,EAAiBwB,IAA9B,EAAkCF,SAAA,CAEjDG,EAACC,GAASN,UAAU,6BAGxBK,EAAA,SAAA,CACIL,UAAU,0IACVG,QAlCO,WACnBlB,GAAWD,EACf,WAkCgBqB,EAACE,EAAW,CAACP,UAAU,iBAI9BhB,GACGqB,EAAA,MAAA,CAAKL,UAAU,qIAAoIE,SAC/IH,EAAA,MAAA,CAAKC,UAAU,iBACXD,EAAA,SAAA,CACII,QAAS,WAAM,OAAAf,EAAaR,EAAiBwB,IAA9B,EACfJ,UAAU,iGAEVK,EAACG,EAAQ,CAACR,UAAU,iBAAiB,kBAGzCD,YACII,QAAS,WAAM,OAAAf,EAAaR,EAAiB6B,IAA9B,EACfT,UAAU,uFAAsFE,SAAA,CAEhGG,EAACK,EAAe,CAACV,UAAU,iBAAiB,qBAGhDD,EAAA,SAAA,CACII,QAAS,WAAM,OAAAf,EAAaR,EAAiB+B,MAA9B,EACfX,UAAU,uFAAsFE,SAAA,CAEhGG,EAACK,EAAe,CAACV,UAAU,iBAAiB,8BAexE,EAtFA,SAAYpB,GACRA,EAAAA,EAAA,IAAA,GAAA,MACAA,EAAAA,EAAA,IAAA,GAAA,MACAA,EAAAA,EAAA,MAAA,GAAA,QACAA,EAAAA,EAAA,KAAA,GAAA,MACH,CALD,CAAYA,IAAAA,EAAgB,CAAA"}

package/dist/esm/components/Cards/Card.mjs

@@ -0,0 +1,2 @@
+import{jsx as n}from"react/jsx-runtime";var e=function(e){var r=e.children,o=e.className,t=void 0===o?"":o,a=e.glass,l=void 0!==a&&a,i="".concat("\n        w-full\n        rounded-2xl\n        shadow-xl\n        transition-all\n        duration-300\n        ease-out\n        hover:-translate-y-0.5\n        p-5\n        relative\n        z-0\n    "," ").concat(l?"\n        backdrop-blur-xl\n        bg-white/20\n        border\n        border-white/30\n        shadow-lg\n        hover:shadow-xl\n        hover:bg-white/30\n        before:absolute\n        before:inset-0\n        before:rounded-2xl\n        before:bg-gradient-to-br\n        before:from-white/10\n        before:to-transparent\n        before:pointer-events-none\n    ":"\n        backdrop-blur-2xl\n        bg-white\n    "," ").concat(t);return n("div",{className:i,children:r})};export{e as default};
+//# sourceMappingURL=Card.mjs.map

package/dist/esm/components/Cards/Card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.mjs","sources":["../../../../src/components/Cards/Card.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\n\ninterface CardProps {\n    children: ReactNode;\n    className?: string;\n    glass?: boolean;\n}\n\nconst Card = ({ children, className = \"\", glass = false }: CardProps) => {\n    const baseClasses = `\n        w-full\n        rounded-2xl\n        shadow-xl\n        transition-all\n        duration-300\n        ease-out\n        hover:-translate-y-0.5\n        p-5\n        relative\n        z-0\n    `;\n\n    const glassClasses = `\n        backdrop-blur-xl\n        bg-white/20\n        border\n        border-white/30\n        shadow-lg\n        hover:shadow-xl\n        hover:bg-white/30\n        before:absolute\n        before:inset-0\n        before:rounded-2xl\n        before:bg-gradient-to-br\n        before:from-white/10\n        before:to-transparent\n        before:pointer-events-none\n    `;\n\n    const solidClasses = `\n        backdrop-blur-2xl\n        bg-white\n    `;\n\n    const combinedClasses = `${baseClasses} ${glass ? glassClasses : solidClasses} ${className}`;\n\n    return (\n        <div className={combinedClasses}>\n            {children}\n        </div>\n    );\n};\n\nexport default Card;\n"],"names":["Card","_a","children","_b","className","_c","glass","combinedClasses","concat","_jsx"],"mappings":"wCAQA,IAAMA,EAAO,SAACC,GAAE,IAAAC,EAAQD,EAAAC,SAAEC,EAAAF,EAAAG,UAAAA,OAAS,IAAAD,EAAG,GAAEA,EAAEE,EAAAJ,EAAAK,MAAAA,OAAK,IAAAD,GAAQA,EAoC7CE,EAAkB,GAAAC,OAnCJ,6MAmCkB,KAAAA,OAAIF,EAtBrB,wXAiBA,sDAKwD,KAAAE,OAAIJ,GAEjF,OACIK,SAAKL,UAAWG,EAAeL,SAC1BA,GAGb"}

package/dist/esm/components/Cards/EmptyStateCard.mjs

@@ -0,0 +1,2 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import i from"../Button/Button.mjs";import"../Button/ExportButton.mjs";function r(r){var a=r.title,c=void 0===a?"No Record Found":a,n=r.onClick,o=r.btnText,l=r.description,m=void 0===l?"":l,d=r.className,s=void 0===d?"":d,x=r.icon;return e("div",{className:"my-2 flex min-h-[320px] w-full flex-col items-center justify-center rounded-lg bg-gray-50 p-8 text-center ".concat(s," "),"aria-live":"polite",children:t("div",{className:"max-w-md space-y-4",children:[x&&e("div",{className:"mx-auto h-16 w-16 text-gray-300",children:x}),e("h2",{className:"text-xl font-medium text-gray-900",children:c}),m&&e("p",{className:"text-gray-500",children:m}),o&&n&&e("div",{className:"mt-6",children:e(i,{onClick:n,size:"md",children:o})})]})})}export{r as default};
+//# sourceMappingURL=EmptyStateCard.mjs.map

package/dist/esm/components/Cards/EmptyStateCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyStateCard.mjs","sources":["../../../../src/components/Cards/EmptyStateCard.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {Button} from \"../Button\";\n\nexport interface EmptyStateProps {\n    title?: string;\n    description?: string;\n    btnText?: string;\n    onClick?: () => void;\n    icon?: ReactNode;\n    className?: string;\n}\nexport default function EmptyStateCard({\n    title = \"No Record Found\",\n    onClick,\n    btnText,\n    description = \"\",\n    className = \"\",\n    icon,\n}: EmptyStateProps) {\n    return (\n        <div\n            className={`my-2 flex min-h-[320px] w-full flex-col items-center justify-center rounded-lg bg-gray-50 p-8 text-center ${className} `}\n            aria-live='polite' // For screen readers\n        >\n            <div className={`max-w-md space-y-4`}>\n                {icon && <div className='mx-auto h-16 w-16 text-gray-300'>{icon}</div>}\n\n                <h2 className='text-xl font-medium text-gray-900'>{title}</h2>\n\n                {description && <p className='text-gray-500'>{description}</p>}\n\n                {btnText && onClick && (\n                    <div className='mt-6'>\n                        <Button onClick={onClick} size='md'>\n                            {btnText}\n                        </Button>\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n}\n"],"names":["EmptyStateCard","_a","_b","title","onClick","btnText","_c","description","_d","className","icon","_jsx","concat","children","_jsxs","Button","size"],"mappings":"yHAWc,SAAUA,EAAeC,OACnCC,EAAAD,EAAAE,MAAAA,OAAK,IAAAD,EAAG,kBAAiBA,EACzBE,EAAOH,EAAAG,QACPC,EAAOJ,EAAAI,QACPC,EAAAL,EAAAM,YAAAA,OAAW,IAAAD,EAAG,GAAEA,EAChBE,EAAAP,EAAAQ,UAAAA,OAAS,IAAAD,EAAG,GAAEA,EACdE,EAAIT,EAAAS,KAEJ,OACIC,EAAA,MAAA,CACIF,UAAW,6GAAAG,OAA6GH,EAAS,KAAG,YAC1H,SAEVI,SAAAC,EAAA,MAAA,CAAKL,UAAW,qBAAoBI,SAAA,CAC/BH,GAAQC,EAAA,MAAA,CAAKF,UAAU,kCAAiCI,SAAEH,IAE3DC,EAAA,KAAA,CAAIF,UAAU,oCAAmCI,SAAEV,IAElDI,GAAeI,EAAA,IAAA,CAAGF,UAAU,gBAAeI,SAAEN,IAE7CF,GAAWD,GACRO,EAAA,MAAA,CAAKF,UAAU,OAAMI,SACjBF,EAACI,EAAM,CAACX,QAASA,EAASY,KAAK,KAAIH,SAC9BR,UAO7B"}

package/dist/esm/components/Document/FileView.mjs

@@ -0,0 +1,2 @@
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r}from"react";import{File as a,Eye as i,Download as l,Edit3 as s,Trash2 as o,FileText as n,FileImage as d,Video as c,Music as u,Archive as h}from"lucide-react";var m=function(m){var g=m.file,p=m.onDelete,f=m.onUpdate,v=m.onView,x=m.onDownload,b=m.showActions,y=void 0===b||b,N=m.showDelete,w=void 0===N||N,z=m.showUpdate,k=void 0===z||z,P=m.showView,D=void 0===P||P,M=m.showDownload,j=void 0!==M&&M,C=m.layout,U=void 0===C?"grid":C,B=m.maxPreviewSize,W=void 0===B?200:B,L=m.className,V=void 0===L?"":L,F=r(!1),E=F[0],R=F[1],q=function(e){if(0===e)return"0 Bytes";var t=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,t)).toFixed(2))+" "+["Bytes","KB","MB","GB"][t]},A=function(e){return e.startsWith("image/")?d:e.startsWith("video/")?c:e.startsWith("audio/")?u:"application/pdf"===e?n:e.includes("zip")||e.includes("rar")?h:a},G=function(r){var a=r.url||(r.file?URL.createObjectURL(r.file):null);if(!a){var i=A(r.type);return t(i,{size:32,className:"text-gray-400"})}if(r.type.startsWith("image/"))return t("img",{src:a,alt:r.name,className:"w-full h-full object-cover",style:{maxWidth:W,maxHeight:W}});if("application/pdf"===r.type)return t("div",{className:"w-full h-full flex items-center justify-center bg-red-50",children:e("div",{className:"text-center",children:[t(n,{size:32,className:"text-red-600 mx-auto mb-1"}),t("span",{className:"text-xs text-red-600 font-medium",children:"PDF"})]})});var l=A(r.type);return t("div",{className:"w-full h-full flex items-center justify-center bg-gray-50",children:t(l,{size:32,className:"text-gray-400"})})};return g?t("div","list"===U?{className:"".concat(V),children:e("div",{className:"flex items-center p-3 bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition-shadow",onMouseEnter:function(){return R(!0)},onMouseLeave:function(){return R(!1)},children:[t("div",{className:"flex-shrink-0 w-12 h-12 rounded-lg overflow-hidden bg-gray-100 mr-3",children:G(g)}),e("div",{className:"flex-1 min-w-0",children:[t("p",{className:"text-sm font-medium text-gray-900 truncate",children:g.name}),t("p",{className:"text-xs text-gray-500",children:q(g.size)}),void 0!==g.uploadProgress&&g.uploadProgress<100&&e("div",{className:"mt-2",children:[t("div",{className:"h-1.5 w-full rounded-full bg-gray-200",children:t("div",{className:"h-1.5 rounded-full bg-blue-600 transition-all duration-300",style:{width:"".concat(g.uploadProgress,"%")}})}),e("p",{className:"text-xs text-gray-500 mt-1",children:[g.uploadProgress,"%"]})]})]}),y&&(E||void 0===g.uploadProgress)&&e("div",{className:"flex items-center space-x-2",children:[D&&v&&t("button",{onClick:v,className:"p-2 text-gray-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors",title:"View",children:t(i,{size:16})}),j&&x&&t("button",{onClick:x,className:"p-2 text-gray-400 hover:text-green-600 hover:bg-green-50 rounded-full transition-colors",title:"Download",children:t(l,{size:16})}),k&&f&&t("button",{onClick:f,className:"p-2 text-gray-400 hover:text-amber-600 hover:bg-amber-50 rounded-full transition-colors",title:"Update",children:t(s,{size:16})}),w&&p&&t("button",{onClick:p,className:"p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-full transition-colors",title:"Delete",children:t(o,{size:16})})]})]})}:{className:"flex justify-center ".concat(V),children:e("div",{className:"group relative bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition-shadow overflow-hidden max-w-xs",onMouseEnter:function(){return R(!0)},onMouseLeave:function(){return R(!1)},children:[e("div",{className:"aspect-square w-full bg-gray-50 overflow-hidden",children:[G(g),void 0!==g.uploadProgress&&g.uploadProgress<100&&t("div",{className:"absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center",children:e("div",{className:"text-center text-white",children:[t("div",{className:"w-16 h-16 rounded-full border-4 border-white border-t-transparent animate-spin mb-2"}),e("p",{className:"text-sm",children:[g.uploadProgress,"%"]})]})}),y&&(E||void 0===g.uploadProgress)&&t("div",{className:"absolute inset-0 bg-black bg-opacity-40 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center",children:e("div",{className:"flex space-x-2",children:[D&&v&&t("button",{onClick:v,className:"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all",title:"View",children:t(i,{size:16})}),j&&x&&t("button",{onClick:x,className:"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all",title:"Download",children:t(l,{size:16})}),k&&f&&t("button",{onClick:f,className:"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all",title:"Update",children:t(s,{size:16})}),w&&p&&t("button",{onClick:p,className:"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-red-600 rounded-full transition-all",title:"Delete",children:t(o,{size:16})})]})})]}),e("div",{className:"p-3",children:[t("p",{className:"text-sm font-medium text-gray-900 truncate",title:g.name,children:g.name}),t("p",{className:"text-xs text-gray-500",children:q(g.size)})]})]})}):e("div",{className:"text-center py-8 text-gray-500 ".concat(V),children:[t(a,{size:48,className:"mx-auto mb-2 text-gray-300"}),t("p",{children:"No file to display"})]})};export{m as default};
+//# sourceMappingURL=FileView.mjs.map

package/dist/esm/components/Document/FileView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileView.mjs","sources":["../../../../src/components/Document/FileView.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport {\n    File,\n    Edit3,\n    Trash2,\n    Eye,\n    Download,\n    FileText,\n    FileImage,\n    Video,\n    Music,\n    Archive,\n} from \"lucide-react\";\nimport FileUpload from \"../Form/FileUpload/FileUpload\";\n\n// Types\nexport interface FileItem {\n    id?: string;\n    name: string;\n    size: number;\n    type: string;\n    url?: string;\n    file?: File;\n    uploadProgress?: number;\n}\n\nexport interface FileViewProps {\n    file: FileItem | null;\n    onDelete?: () => void;\n    onUpdate?: () => void;\n    onView?: () => void;\n    onDownload?: () => void;\n    showActions?: boolean;\n    showDelete?: boolean;\n    showUpdate?: boolean;\n    showView?: boolean;\n    showDownload?: boolean;\n    layout?: \"grid\" | \"list\";\n    maxPreviewSize?: number;\n    className?: string;\n}\n\nconst FileView: React.FC<FileViewProps> = ({\n                                               file,\n                                               onDelete,\n                                               onUpdate,\n                                               onView,\n                                               onDownload,\n                                               showActions = true,\n                                               showDelete = true,\n                                               showUpdate = true,\n                                               showView = true,\n                                               showDownload = false,\n                                               layout = \"grid\",\n                                               maxPreviewSize = 200,\n                                               className = \"\"\n                                           }) => {\n    const [isHovered, setIsHovered] = useState(false);\n\n    const formatFileSize = (bytes: number) => {\n        if (bytes === 0) return '0 Bytes';\n        const k = 1024;\n        const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n        const i = Math.floor(Math.log(bytes) / Math.log(k));\n        return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\n    };\n\n    const getFileIcon = (fileType: string) => {\n        if (fileType.startsWith('image/')) return FileImage;\n        if (fileType.startsWith('video/')) return Video;\n        if (fileType.startsWith('audio/')) return Music;\n        if (fileType === 'application/pdf') return FileText;\n        if (fileType.includes('zip') || fileType.includes('rar')) return Archive;\n        return File;\n    };\n\n    const getFilePreview = (file: FileItem) => {\n        const previewUrl = file.url || (file.file ? URL.createObjectURL(file.file) : null);\n\n        if (!previewUrl) {\n            const IconComponent = getFileIcon(file.type);\n            return <IconComponent size={32} className=\"text-gray-400\" />;\n        }\n\n        if (file.type.startsWith('image/')) {\n            return (\n                <img\n                    src={previewUrl}\n                    alt={file.name}\n                    className=\"w-full h-full object-cover\"\n                    style={{ maxWidth: maxPreviewSize, maxHeight: maxPreviewSize }}\n                />\n            );\n        }\n\n        if (file.type === 'application/pdf') {\n            return (\n                <div className=\"w-full h-full flex items-center justify-center bg-red-50\">\n                    <div className=\"text-center\">\n                        <FileText size={32} className=\"text-red-600 mx-auto mb-1\" />\n                        <span className=\"text-xs text-red-600 font-medium\">PDF</span>\n                    </div>\n                </div>\n            );\n        }\n\n        const IconComponent = getFileIcon(file.type);\n        return (\n            <div className=\"w-full h-full flex items-center justify-center bg-gray-50\">\n                <IconComponent size={32} className=\"text-gray-400\" />\n            </div>\n        );\n    };\n\n    if (!file) {\n        return (\n            <div className={`text-center py-8 text-gray-500 ${className}`}>\n                <File size={48} className=\"mx-auto mb-2 text-gray-300\" />\n                <p>No file to display</p>\n            </div>\n        );\n    }\n\n    if (layout === \"list\") {\n        return (\n            <div className={`${className}`}>\n                <div\n                    className=\"flex items-center p-3 bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition-shadow\"\n                    onMouseEnter={() => setIsHovered(true)}\n                    onMouseLeave={() => setIsHovered(false)}\n                >\n                    <div className=\"flex-shrink-0 w-12 h-12 rounded-lg overflow-hidden bg-gray-100 mr-3\">\n                        {getFilePreview(file)}\n                    </div>\n\n                    <div className=\"flex-1 min-w-0\">\n                        <p className=\"text-sm font-medium text-gray-900 truncate\">{file.name}</p>\n                        <p className=\"text-xs text-gray-500\">{formatFileSize(file.size)}</p>\n\n                        {/* Upload Progress */}\n                        {file.uploadProgress !== undefined && file.uploadProgress < 100 && (\n                            <div className=\"mt-2\">\n                                <div className=\"h-1.5 w-full rounded-full bg-gray-200\">\n                                    <div\n                                        className=\"h-1.5 rounded-full bg-blue-600 transition-all duration-300\"\n                                        style={{ width: `${file.uploadProgress}%` }}\n                                    />\n                                </div>\n                                <p className=\"text-xs text-gray-500 mt-1\">{file.uploadProgress}%</p>\n                            </div>\n                        )}\n                    </div>\n\n                    {/* Actions */}\n                    {showActions && (isHovered || file.uploadProgress === undefined) && (\n                        <div className=\"flex items-center space-x-2\">\n                            {showView && onView && (\n                                <button\n                                    onClick={onView}\n                                    className=\"p-2 text-gray-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors\"\n                                    title=\"View\"\n                                >\n                                    <Eye size={16} />\n                                </button>\n                            )}\n                            {showDownload && onDownload && (\n                                <button\n                                    onClick={onDownload}\n                                    className=\"p-2 text-gray-400 hover:text-green-600 hover:bg-green-50 rounded-full transition-colors\"\n                                    title=\"Download\"\n                                >\n                                    <Download size={16} />\n                                </button>\n                            )}\n                            {showUpdate && onUpdate && (\n                                <button\n                                    onClick={onUpdate}\n                                    className=\"p-2 text-gray-400 hover:text-amber-600 hover:bg-amber-50 rounded-full transition-colors\"\n                                    title=\"Update\"\n                                >\n                                    <Edit3 size={16} />\n                                </button>\n                            )}\n                            {showDelete && onDelete && (\n                                <button\n                                    onClick={onDelete}\n                                    className=\"p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-full transition-colors\"\n                                    title=\"Delete\"\n                                >\n                                    <Trash2 size={16} />\n                                </button>\n                            )}\n                        </div>\n                    )}\n                </div>\n            </div>\n        );\n    }\n\n    // Grid Layout (Single File)\n    return (\n        <div className={`flex justify-center ${className}`}>\n            <div\n                className=\"group relative bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition-shadow overflow-hidden max-w-xs\"\n                onMouseEnter={() => setIsHovered(true)}\n                onMouseLeave={() => setIsHovered(false)}\n            >\n                {/* File Preview */}\n                <div className=\"aspect-square w-full bg-gray-50 overflow-hidden\">\n                    {getFilePreview(file)}\n\n                    {/* Upload Progress Overlay */}\n                    {file.uploadProgress !== undefined && file.uploadProgress < 100 && (\n                        <div className=\"absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center\">\n                            <div className=\"text-center text-white\">\n                                <div className=\"w-16 h-16 rounded-full border-4 border-white border-t-transparent animate-spin mb-2\"></div>\n                                <p className=\"text-sm\">{file.uploadProgress}%</p>\n                            </div>\n                        </div>\n                    )}\n\n                    {/* Actions Overlay */}\n                    {showActions && (isHovered || file.uploadProgress === undefined) && (\n                        <div className=\"absolute inset-0 bg-black bg-opacity-40 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center\">\n                            <div className=\"flex space-x-2\">\n                                {showView && onView && (\n                                    <button\n                                        onClick={onView}\n                                        className=\"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all\"\n                                        title=\"View\"\n                                    >\n                                        <Eye size={16} />\n                                    </button>\n                                )}\n                                {showDownload && onDownload && (\n                                    <button\n                                        onClick={onDownload}\n                                        className=\"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all\"\n                                        title=\"Download\"\n                                    >\n                                        <Download size={16} />\n                                    </button>\n                                )}\n                                {showUpdate && onUpdate && (\n                                    <button\n                                        onClick={onUpdate}\n                                        className=\"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-gray-700 rounded-full transition-all\"\n                                        title=\"Update\"\n                                    >\n                                        <Edit3 size={16} />\n                                    </button>\n                                )}\n                                {showDelete && onDelete && (\n                                    <button\n                                        onClick={onDelete}\n                                        className=\"p-2 bg-white bg-opacity-90 hover:bg-opacity-100 text-red-600 rounded-full transition-all\"\n                                        title=\"Delete\"\n                                    >\n                                        <Trash2 size={16} />\n                                    </button>\n                                )}\n                            </div>\n                        </div>\n                    )}\n                </div>\n\n                {/* File Info */}\n                <div className=\"p-3\">\n                    <p className=\"text-sm font-medium text-gray-900 truncate\" title={file.name}>\n                        {file.name}\n                    </p>\n                    <p className=\"text-xs text-gray-500\">{formatFileSize(file.size)}</p>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default FileView;"],"names":["FileView","_a","file","onDelete","onUpdate","onView","onDownload","_b","showActions","_c","showDelete","_d","showUpdate","_e","showView","_f","showDownload","_g","layout","_h","maxPreviewSize","_j","className","_k","useState","isHovered","setIsHovered","formatFileSize","bytes","i","Math","floor","log","parseFloat","pow","toFixed","getFileIcon","fileType","startsWith","FileImage","Video","Music","FileText","includes","Archive","File","getFilePreview","previewUrl","url","URL","createObjectURL","IconComponent_1","type","_jsx","size","src","alt","name","style","maxWidth","maxHeight","children","_jsxs","IconComponent","concat","onMouseEnter","onMouseLeave","undefined","uploadProgress","width","onClick","title","Eye","Download","Edit3","Trash2"],"mappings":"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"}

package/dist/esm/components/Form/CheckBox/CheckBox.mjs

@@ -0,0 +1,2 @@
+import{__assign as e}from"../../../node_modules/tslib/tslib.es6.mjs";import{jsxs as a,jsx as t}from"react/jsx-runtime";import{useState as l,useEffect as r}from"react";var i=function(e){var i=e.variant,n=void 0===i?"check":i,c=e.size,o=void 0===c?"md":c,s=e.checked,d=void 0!==s&&s,m=e.disabled,h=void 0!==m&&m,u=e.onChange,v=e.label,g=e.labelPosition,p=void 0===g?"right":g,b=e.name,x=e.value,f=e.id,N=e.className,w=void 0===N?"":N,y=e.error,k=e.helpText,C=e.required,z=void 0!==C&&C,S=e.indeterminate,q=void 0!==S&&S,M=l(d),D=M[0],L=M[1],R=l(q),T=R[0],V=R[1];r((function(){L(d)}),[d]),r((function(){V(q)}),[q]);var j=function(){if(!h){var e=!D;L(e),V(!1),null==u||u(e)}},B={sm:{container:"h-4 w-4",toggle:"w-7 h-4",toggleCircle:"h-3 w-3",text:"text-sm"},md:{container:"h-5 w-5",toggle:"w-9 h-5",toggleCircle:"h-4 w-4",text:"text-base"},lg:{container:"h-6 w-6",toggle:"w-12 h-6",toggleCircle:"h-5 w-5",text:"text-lg"}},O=f||"checkbox-".concat(Math.random().toString(36).substr(2,9));return a("div",{children:[a("div",{className:"flex items-start gap-2 ".concat(w),children:[v&&"left"===p&&a("label",{htmlFor:O,className:"".concat(B[o].text," ").concat(h?"text-gray-400":y?"text-red-600":"text-gray-700"," cursor-pointer select-none"),children:[v,z&&t("span",{className:"text-red-500 ml-1",children:"*"})]}),a("div",{className:"flex flex-col",children:[a("div","toggle"===n?{className:"relative rounded-full transition-colors duration-200 ".concat(B[o].toggle," ").concat(D?"bg-primary":"bg-gray-300"," ").concat(h?"cursor-not-allowed opacity-50":"cursor-pointer","\n                    ").concat(y?"ring-2 ring-red-300":""),onClick:j,children:[t("div",{className:"absolute top-0.5 transform rounded-full bg-white shadow-sm transition-transform duration-200 ".concat(B[o].toggleCircle," ").concat(D?"translate-x-full":"translate-x-0.5")}),t("input",{type:"checkbox",id:O,name:b,value:x,checked:D,onChange:j,disabled:h,className:"sr-only",required:z})]}:{className:"relative",children:[t("input",{type:"dot"===n?"radio":"checkbox",id:O,name:b,value:x,checked:D,onChange:j,disabled:h,required:z,className:"sr-only"}),a("div",{className:"".concat(B[o].container," ").concat("check"===n?"rounded-md":"rounded-full"," flex items-center justify-center border-2 transition-all duration-200 ").concat(D||T?"border-primary bg-primary":y?"border-red-300 bg-red-50":"border-gray-300 bg-white hover:border-gray-400"," ").concat(h?"cursor-not-allowed opacity-50":"cursor-pointer","\n                    focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2"),onClick:j,children:[D&&"check"===n&&t("svg",{className:"h-3 w-3 text-white",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:3,children:t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 13l4 4L19 7"})}),T&&"check"===n&&t("div",{className:"h-0.5 w-2.5 bg-white rounded-full"}),D&&"dot"===n&&t("div",{className:"h-1.5 w-1.5 rounded-full bg-white"})]})]}),y&&a("p",{className:"mt-1 text-xs text-red-600 flex items-center",children:[t("svg",{className:"w-3 h-3 mr-1",fill:"currentColor",viewBox:"0 0 20 20",children:t("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z",clipRule:"evenodd"})}),y]})]}),v&&"right"===p&&a("label",{htmlFor:O,className:"".concat(B[o].text," ").concat(h?"text-gray-400":y?"text-red-600":"text-gray-700"," cursor-pointer select-none"),children:[v,z&&t("span",{className:"text-red-500 ml-1",children:"*"})]})]}),k&&!y&&t("p",{className:"mt-1 text-xs text-gray-500",children:k})]})},n=function(e){var l=e.name,r=e.value,n=e.onChange,c=e.options,o=e.size,s=void 0===o?"md":o,d=e.className,m=void 0===d?"":d,h=e.error,u=e.helpText,v=e.required,g=void 0!==v&&v,p=e.label,b=e.direction,x=void 0===b?"vertical":b;return a("div",{className:"space-y-2 ".concat(m),children:[p&&a("label",{className:"block text-sm font-medium text-gray-700",children:[p,g&&t("span",{className:"text-red-500 ml-1",children:"*"})]}),t("div",{className:"flex ".concat("horizontal"===x?"flex-row gap-6":"flex-col gap-2"),children:c.map((function(e){return t(i,{variant:"dot",size:s,name:l,value:e.value,checked:r===e.value,onChange:function(){return a=e.value,void(null==n||n(a));var a},label:e.label,disabled:e.disabled,error:h,required:g},e.value)}))}),h&&a("p",{className:"text-xs text-red-600 flex items-center",children:[t("svg",{className:"w-3 h-3 mr-1",fill:"currentColor",viewBox:"0 0 20 20",children:t("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z",clipRule:"evenodd"})}),h]}),u&&!h&&t("p",{className:"text-xs text-gray-500",children:u})]})};function c(){var r=l("option1"),c=r[0],o=r[1],s=l({terms:!1,newsletter:!0,notifications:!1}),d=s[0],m=s[1];return t("div",{className:"min-h-screen bg-gray-50 p-8",children:t("div",{className:"mx-auto max-w-2xl space-y-8",children:a("div",{className:"rounded-lg bg-white p-6 shadow",children:[t("h2",{className:"mb-6 text-xl font-semibold",children:"CheckBox Component Demo"}),a("div",{className:"space-y-8",children:[a("div",{className:"space-y-4",children:[t("h3",{className:"font-medium",children:"Check Variant"}),a("div",{className:"flex flex-wrap items-center gap-6",children:[t(i,{variant:"check",size:"sm",label:"Small"}),t(i,{variant:"check",size:"md",checked:!0,label:"Medium"}),t(i,{variant:"check",size:"lg",label:"Large"}),t(i,{variant:"check",disabled:!0,label:"Disabled"}),t(i,{variant:"check",indeterminate:!0,label:"Indeterminate"})]})]}),a("div",{className:"space-y-4",children:[t("h3",{className:"font-medium",children:"Radio Group (Dot Variant)"}),t(n,{name:"demo-radio",value:c,onChange:o,label:"Choose an option",options:[{value:"option1",label:"Option 1"},{value:"option2",label:"Option 2"},{value:"option3",label:"Option 3"},{value:"option4",label:"Option 4 (Disabled)",disabled:!0}],helpText:"Select one option from the list"})]}),a("div",{className:"space-y-4",children:[t("h3",{className:"font-medium",children:"Toggle Variant"}),a("div",{className:"flex flex-wrap items-center gap-6",children:[t(i,{variant:"toggle",size:"sm",label:"Small"}),t(i,{variant:"toggle",size:"md",checked:!0,label:"Medium"}),t(i,{variant:"toggle",size:"lg",label:"Large"}),t(i,{variant:"toggle",disabled:!0,label:"Disabled"})]})]}),a("div",{className:"space-y-4 border-t pt-6",children:[t("h3",{className:"font-medium",children:"Sample Form"}),a("div",{className:"space-y-4",children:[t(i,{variant:"check",checked:d.terms,onChange:function(a){return m(e(e({},d),{terms:a}))},label:"I accept the terms and conditions",required:!0,error:d.terms?"":"Please accept terms to continue"}),t(i,{variant:"toggle",checked:d.newsletter,onChange:function(a){return m(e(e({},d),{newsletter:a}))},label:"Subscribe to newsletter",helpText:"Get updates about new features and releases"}),t(i,{variant:"check",checked:d.notifications,onChange:function(a){return m(e(e({},d),{notifications:a}))},label:"Enable push notifications"}),t("div",{className:"pt-4",children:t("button",{className:"rounded-md bg-primary px-4 py-2 text-white transition-colors hover:bg-primary/90 disabled:opacity-50",disabled:!d.terms,children:"Submit"})})]})]})]})]})})})}export{c as CheckBoxDemo,n as RadioGroup,i as default};
+//# sourceMappingURL=CheckBox.mjs.map

package/dist/esm/components/Form/CheckBox/CheckBox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckBox.mjs","sources":["../../../../../src/components/Form/CheckBox/CheckBox.tsx"],"sourcesContent":["import { ReactNode, useEffect, useState } from \"react\";\n\nexport type CheckBoxProps = {\n  variant?: \"check\" | \"dot\" | \"toggle\";\n  size?: \"sm\" | \"md\" | \"lg\";\n  checked?: boolean;\n  disabled?: boolean;\n  onChange?: (checked: boolean) => void;\n  label?: string | ReactNode;\n  labelPosition?: \"left\" | \"right\";\n  name?: string; // For radio grouping\n  value?: string; // For radio value\n  id?: string;\n  className?: string;\n  error?: string;\n  helpText?: string;\n  required?: boolean;\n  indeterminate?: boolean; // For partially checked state\n};\n\nexport type RadioGroupProps = {\n  name: string;\n  value?: string;\n  onChange?: (value: string) => void;\n  options: Array<{\n    value: string;\n    label: string | ReactNode;\n    disabled?: boolean;\n  }>;\n  size?: \"sm\" | \"md\" | \"lg\";\n  className?: string;\n  error?: string;\n  helpText?: string;\n  required?: boolean;\n  label?: string;\n  direction?: \"horizontal\" | \"vertical\";\n};\n\nconst CheckBox = ({\n  variant = \"check\",\n  size = \"md\",\n  checked = false,\n  disabled = false,\n  onChange,\n  label,\n  labelPosition = \"right\",\n  name,\n  value,\n  id,\n  className = \"\",\n  error,\n  helpText,\n  required = false,\n  indeterminate = false,\n}: CheckBoxProps) => {\n  const [isChecked, setIsChecked] = useState(checked);\n  const [isIndeterminate, setIsIndeterminate] = useState(indeterminate);\n\n  // Sync internal state with props\n  useEffect(() => {\n    setIsChecked(checked);\n  }, [checked]);\n\n  useEffect(() => {\n    setIsIndeterminate(indeterminate);\n  }, [indeterminate]);\n\n  const handleChange = () => {\n    if (disabled) return;\n\n    const newValue = !isChecked;\n    setIsChecked(newValue);\n    setIsIndeterminate(false);\n    onChange?.(newValue);\n  };\n\n  // Size classes\n  const sizeClasses = {\n    sm: {\n      container: \"h-4 w-4\",\n      toggle: \"w-7 h-4\",\n      toggleCircle: \"h-3 w-3\",\n      text: \"text-sm\",\n    },\n    md: {\n      container: \"h-5 w-5\",\n      toggle: \"w-9 h-5\",\n      toggleCircle: \"h-4 w-4\",\n      text: \"text-base\",\n    },\n    lg: {\n      container: \"h-6 w-6\",\n      toggle: \"w-12 h-6\",\n      toggleCircle: \"h-5 w-5\",\n      text: \"text-lg\",\n    },\n  };\n\n  const checkboxId =\n    id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;\n\n  // Render different variants\n  const renderCheckBox = () => {\n    if (variant === \"toggle\") {\n      return (\n        <div\n          className={`relative rounded-full transition-colors duration-200 ${sizeClasses[size].toggle} ${\n            isChecked ? \"bg-primary\" : \"bg-gray-300\"\n          } ${disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\"}\n                    ${error ? \"ring-2 ring-red-300\" : \"\"}`}\n          onClick={handleChange}\n        >\n          <div\n            className={`absolute top-0.5 transform rounded-full bg-white shadow-sm transition-transform duration-200 ${sizeClasses[size].toggleCircle} ${\n              isChecked ? \"translate-x-full\" : \"translate-x-0.5\"\n            }`}\n          />\n          <input\n            type=\"checkbox\"\n            id={checkboxId}\n            name={name}\n            value={value}\n            checked={isChecked}\n            onChange={handleChange}\n            disabled={disabled}\n            className=\"sr-only\"\n            required={required}\n          />\n        </div>\n      );\n    }\n\n    return (\n      <div className=\"relative\">\n        <input\n          type={variant === \"dot\" ? \"radio\" : \"checkbox\"}\n          id={checkboxId}\n          name={name}\n          value={value}\n          checked={isChecked}\n          onChange={handleChange}\n          disabled={disabled}\n          required={required}\n          className=\"sr-only\"\n        />\n        <div\n          className={`${sizeClasses[size].container} ${\n            variant === \"check\" ? \"rounded-md\" : \"rounded-full\"\n          } flex items-center justify-center border-2 transition-all duration-200 ${\n            isChecked || isIndeterminate\n              ? \"border-primary bg-primary\"\n              : error\n                ? \"border-red-300 bg-red-50\"\n                : \"border-gray-300 bg-white hover:border-gray-400\"\n          } ${disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\"}\n                    focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2`}\n          onClick={handleChange}\n        >\n          {/* Check mark */}\n          {isChecked && variant === \"check\" && (\n            <svg\n              className=\"h-3 w-3 text-white\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n              strokeWidth={3}\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                d=\"M5 13l4 4L19 7\"\n              />\n            </svg>\n          )}\n\n          {/* Indeterminate state */}\n          {isIndeterminate && variant === \"check\" && (\n            <div className=\"h-0.5 w-2.5 bg-white rounded-full\" />\n          )}\n\n          {/* Radio dot */}\n          {isChecked && variant === \"dot\" && (\n            <div className=\"h-1.5 w-1.5 rounded-full bg-white\" />\n          )}\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <div>\n      <div className={`flex items-start gap-2 ${className}`}>\n        {label && labelPosition === \"left\" && (\n          <label\n            htmlFor={checkboxId}\n            className={`${sizeClasses[size].text} ${\n              disabled\n                ? \"text-gray-400\"\n                : error\n                  ? \"text-red-600\"\n                  : \"text-gray-700\"\n            } cursor-pointer select-none`}\n          >\n            {label}\n            {required && <span className=\"text-red-500 ml-1\">*</span>}\n          </label>\n        )}\n\n        <div className=\"flex flex-col\">\n          {renderCheckBox()}\n\n          {/* Error message */}\n          {error && (\n            <p className=\"mt-1 text-xs text-red-600 flex items-center\">\n              <svg\n                className=\"w-3 h-3 mr-1\"\n                fill=\"currentColor\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fillRule=\"evenodd\"\n                  d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z\"\n                  clipRule=\"evenodd\"\n                />\n              </svg>\n              {error}\n            </p>\n          )}\n        </div>\n\n        {label && labelPosition === \"right\" && (\n          <label\n            htmlFor={checkboxId}\n            className={`${sizeClasses[size].text} ${\n              disabled\n                ? \"text-gray-400\"\n                : error\n                  ? \"text-red-600\"\n                  : \"text-gray-700\"\n            } cursor-pointer select-none`}\n          >\n            {label}\n            {required && <span className=\"text-red-500 ml-1\">*</span>}\n          </label>\n        )}\n      </div>\n      {/* Helper text */}\n      {helpText && !error && (\n        <p className=\"mt-1 text-xs text-gray-500\">{helpText}</p>\n      )}\n    </div>\n  );\n};\n\n// RadioGroup component for managing radio buttons\nconst RadioGroup = ({\n  name,\n  value,\n  onChange,\n  options,\n  size = \"md\",\n  className = \"\",\n  error,\n  helpText,\n  required = false,\n  label,\n  direction = \"vertical\",\n}: RadioGroupProps) => {\n  const handleChange = (optionValue: string) => {\n    onChange?.(optionValue);\n  };\n\n  return (\n    <div className={`space-y-2 ${className}`}>\n      {label && (\n        <label className=\"block text-sm font-medium text-gray-700\">\n          {label}\n          {required && <span className=\"text-red-500 ml-1\">*</span>}\n        </label>\n      )}\n\n      <div\n        className={`flex ${direction === \"horizontal\" ? \"flex-row gap-6\" : \"flex-col gap-2\"}`}\n      >\n        {options.map((option) => (\n          <CheckBox\n            key={option.value}\n            variant=\"dot\"\n            size={size}\n            name={name}\n            value={option.value}\n            checked={value === option.value}\n            onChange={() => handleChange(option.value)}\n            label={option.label}\n            disabled={option.disabled}\n            error={error}\n            required={required}\n          />\n        ))}\n      </div>\n\n      {/* Error message */}\n      {error && (\n        <p className=\"text-xs text-red-600 flex items-center\">\n          <svg className=\"w-3 h-3 mr-1\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n            <path\n              fillRule=\"evenodd\"\n              d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z\"\n              clipRule=\"evenodd\"\n            />\n          </svg>\n          {error}\n        </p>\n      )}\n\n      {/* Helper text */}\n      {helpText && !error && (\n        <p className=\"text-xs text-gray-500\">{helpText}</p>\n      )}\n    </div>\n  );\n};\n\nfunction CheckBoxDemo() {\n  const [selectedValue, setSelectedValue] = useState(\"option1\");\n  const [formData, setFormData] = useState({\n    terms: false,\n    newsletter: true,\n    notifications: false,\n  });\n\n  return (\n    <div className=\"min-h-screen bg-gray-50 p-8\">\n      <div className=\"mx-auto max-w-2xl space-y-8\">\n        <div className=\"rounded-lg bg-white p-6 shadow\">\n          <h2 className=\"mb-6 text-xl font-semibold\">\n            CheckBox Component Demo\n          </h2>\n\n          <div className=\"space-y-8\">\n            {/* Check variant */}\n            <div className=\"space-y-4\">\n              <h3 className=\"font-medium\">Check Variant</h3>\n              <div className=\"flex flex-wrap items-center gap-6\">\n                <CheckBox variant=\"check\" size=\"sm\" label=\"Small\" />\n                <CheckBox variant=\"check\" size=\"md\" checked label=\"Medium\" />\n                <CheckBox variant=\"check\" size=\"lg\" label=\"Large\" />\n                <CheckBox variant=\"check\" disabled label=\"Disabled\" />\n                <CheckBox variant=\"check\" indeterminate label=\"Indeterminate\" />\n              </div>\n            </div>\n\n            {/* Radio Group */}\n            <div className=\"space-y-4\">\n              <h3 className=\"font-medium\">Radio Group (Dot Variant)</h3>\n              <RadioGroup\n                name=\"demo-radio\"\n                value={selectedValue}\n                onChange={setSelectedValue}\n                label=\"Choose an option\"\n                options={[\n                  { value: \"option1\", label: \"Option 1\" },\n                  { value: \"option2\", label: \"Option 2\" },\n                  { value: \"option3\", label: \"Option 3\" },\n                  {\n                    value: \"option4\",\n                    label: \"Option 4 (Disabled)\",\n                    disabled: true,\n                  },\n                ]}\n                helpText=\"Select one option from the list\"\n              />\n            </div>\n\n            {/* Toggle variant */}\n            <div className=\"space-y-4\">\n              <h3 className=\"font-medium\">Toggle Variant</h3>\n              <div className=\"flex flex-wrap items-center gap-6\">\n                <CheckBox variant=\"toggle\" size=\"sm\" label=\"Small\" />\n                <CheckBox variant=\"toggle\" size=\"md\" checked label=\"Medium\" />\n                <CheckBox variant=\"toggle\" size=\"lg\" label=\"Large\" />\n                <CheckBox variant=\"toggle\" disabled label=\"Disabled\" />\n              </div>\n            </div>\n\n            {/* Form sample */}\n            <div className=\"space-y-4 border-t pt-6\">\n              <h3 className=\"font-medium\">Sample Form</h3>\n              <div className=\"space-y-4\">\n                <CheckBox\n                  variant=\"check\"\n                  checked={formData.terms}\n                  onChange={(checked) =>\n                    setFormData({ ...formData, terms: checked })\n                  }\n                  label=\"I accept the terms and conditions\"\n                  required\n                  error={\n                    !formData.terms ? \"Please accept terms to continue\" : \"\"\n                  }\n                />\n\n                <CheckBox\n                  variant=\"toggle\"\n                  checked={formData.newsletter}\n                  onChange={(checked) =>\n                    setFormData({ ...formData, newsletter: checked })\n                  }\n                  label=\"Subscribe to newsletter\"\n                  helpText=\"Get updates about new features and releases\"\n                />\n\n                <CheckBox\n                  variant=\"check\"\n                  checked={formData.notifications}\n                  onChange={(checked) =>\n                    setFormData({ ...formData, notifications: checked })\n                  }\n                  label=\"Enable push notifications\"\n                />\n\n                <div className=\"pt-4\">\n                  <button\n                    className=\"rounded-md bg-primary px-4 py-2 text-white transition-colors hover:bg-primary/90 disabled:opacity-50\"\n                    disabled={!formData.terms}\n                  >\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default CheckBox;\nexport { CheckBoxDemo, RadioGroup };\n"],"names":["CheckBox","_a","_b","variant","_c","size","_d","checked","_e","disabled","onChange","label","_f","labelPosition","name","value","id","_g","className","error","helpText","_h","required","_j","indeterminate","_k","useState","isChecked","setIsChecked","_l","isIndeterminate","setIsIndeterminate","useEffect","handleChange","newValue","sizeClasses","sm","container","toggle","toggleCircle","text","md","lg","checkboxId","Math","random","toString","substr","_jsxs","children","concat","htmlFor","_jsx","onClick","type","fill","viewBox","stroke","strokeWidth","strokeLinecap","strokeLinejoin","d","fillRule","clipRule","RadioGroup","options","direction","map","option","optionValue","CheckBoxDemo","selectedValue","setSelectedValue","terms","newsletter","notifications","formData","setFormData","__assign"],"mappings":"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"}

package/dist/esm/components/Form/FileUpload/FileUpload.mjs

@@ -0,0 +1,2 @@
+import{__rest as e,__assign as t,__spreadArray as r}from"../../../node_modules/tslib/tslib.es6.mjs";import{jsxs as n,jsx as a}from"react/jsx-runtime";import{useState as l}from"react";import{Upload as i,AlertCircle as c,CheckCircle as s}from"lucide-react";import o from"../../Document/FileView.mjs";var d=function(d){var m=d.label,u=d.description,f=d.helperText,h=d.error,g=d.success,p=d.disabled,x=void 0!==p&&p,v=d.required,b=void 0!==v&&v,y=d.accept,N=d.multiple,w=void 0!==N&&N,z=d.placeholder,F=d.showProgress,D=void 0===F||F,C=d.className,M=void 0===C?"":C,k=d.id,j=d.maxFileSize,I=d.onFileChange,q=d.existingFiles,A=void 0===q?[]:q,B=d.direction,E=void 0===B?"col":B,T=d.replaceMode,P=e(d,["label","description","helperText","error","success","disabled","required","accept","multiple","placeholder","showProgress","className","id","maxFileSize","onFileChange","existingFiles","direction","replaceMode"]),S=l([]),U=S[0],R=S[1],V=l({}),L=V[0],O=V[1],_=l(!1),G=_[0],H=_[1];null!=T||!w&&A.length;var J=function(e){if(e.target.files&&e.target.files.length>0){var n=Array.from(e.target.files),a=void 0;a=w?r(r([],U,!0),n,!0):[n[0]],R(a),D&&n.forEach((function(e){var r="".concat(e.name,"-").concat(e.size);O((function(e){var n;return t(t({},e),((n={})[r]=10,n))}));var n=setInterval((function(){O((function(e){var a,l=e[r]||0;return l>=100?(clearInterval(n),e):t(t({},e),((a={})[r]=Math.min(l+10,100),a))}))}),300)})),I(a)}},K=function(e){e.preventDefault(),x||H(!0)},Q=function(e){e.preventDefault(),H(!1)},W=function(e){if(e.preventDefault(),H(!1),!x&&e.dataTransfer.files&&e.dataTransfer.files.length>0){var n=Array.from(e.dataTransfer.files),a=void 0;a=w?r(r([],U,!0),n,!0):[n[0]],R(a),D&&n.forEach((function(e){var r="".concat(e.name,"-").concat(e.size);O((function(e){var n;return t(t({},e),((n={})[r]=10,n))}));var n=setInterval((function(){O((function(e){var a,l=e[r]||0;return l>=100?(clearInterval(n),e):t(t({},e),((a={})[r]=Math.min(l+10,100),a))}))}),300)})),I(a)}},X=k||"file-upload-".concat(Math.random().toString(36).substr(2,9)),Y=function(){if(!w){if(U.length>0){var e=U[0];return{name:e.name,size:e.size,type:e.type,file:e,uploadProgress:L["".concat(e.name,"-").concat(e.size)]||100}}if(A.length>0)return A[0]}return null}();return n("div",{className:"space-y-4 ".concat(M),children:[m&&n("label",{htmlFor:X,className:"block text-sm font-medium text-gray-700",children:[m,b&&a("span",{className:"text-red-500 ml-1",children:"*"})]}),u&&a("p",{className:"text-sm text-gray-600",children:u}),!w&&Y?n("div",{className:"space-y-2",children:[n("div",{className:"flex items-center justify-between",children:[a("h4",{className:"text-sm font-medium text-gray-700",children:U.length>0?"New File":"Current File"}),a("button",{onClick:function(){var e;null===(e=document.getElementById(X))||void 0===e||e.click()},className:"text-sm text-blue-600 hover:text-blue-800 font-medium",disabled:x,children:"Replace"})]}),a(o,{file:Y,onDelete:function(){R([]),O({}),I(null)},showUpdate:!1,showView:!0,showDelete:!0,layout:"list",className:"max-w-md"}),a("input",{id:X,type:"file",className:"hidden",onChange:J,accept:y,disabled:x,required:b})]}):w&&A.length>0?n("div",{className:"space-y-4",children:[n("div",{className:"mb-4",children:[n("h4",{className:"text-sm font-medium text-gray-700 mb-2",children:["Current Files (",A.length,")"]}),A.map((function(e,t){return a("div",{className:"mb-2",children:a(o,{file:e,showDelete:!1,showUpdate:!1,layout:"list"})},e.id||t)}))]}),n("div",{className:"\n              flex flex-".concat(E," gap-2 rounded-lg border-2 border-dashed p-8 text-center items-center\n              ").concat("row"===E?"justify-center":"","\n              ").concat(G?"border-blue-400 bg-blue-50":"border-gray-300","\n              ").concat(h?"border-red-300 bg-red-50":"","\n              ").concat(g?"border-green-300 bg-green-50":"","\n              ").concat(x?"opacity-50 cursor-not-allowed bg-gray-50":"cursor-pointer hover:border-gray-400","\n            "),onDragOver:K,onDragLeave:Q,onDrop:W,onClick:function(){var e;return!x&&(null===(e=document.getElementById(X))||void 0===e?void 0:e.click())},children:[a(i,{size:24,className:"text-gray-400"}),n("div",{children:[a("p",{className:"text-sm font-medium ".concat(x?"text-gray-400":"text-blue-600 hover:underline"),children:z||"Add more files"}),a("p",{className:"text-gray-500 text-sm",children:"or drag and drop"}),n("p",{className:"text-sm text-gray-500",children:["(Max. File size: ",j||"25"," MB)"]}),a("p",{className:"text-xs text-gray-400 mt-1",children:"Multiple files allowed"})]}),a("input",t({id:X,type:"file",className:"hidden",onChange:J,accept:y,multiple:w,disabled:x,required:b},P))]}),U.length>0&&n("div",{className:"mt-4",children:[n("div",{className:"flex items-center justify-between mb-2",children:[n("h4",{className:"text-sm font-medium text-gray-700",children:["New Files (",U.length,")"]}),a("button",{onClick:function(){R([]),O({}),I(null)},className:"text-xs text-red-500 hover:text-red-700",disabled:x,children:"Remove All New Files"})]}),U.map((function(e,t){return a("div",{className:"mb-2",children:a(o,{file:{name:e.name,size:e.size,type:e.type,file:e,uploadProgress:L["".concat(e.name,"-").concat(e.size)]||100},onDelete:function(){var e=U.filter((function(e,r){return r!==t}));R(e),I(e.length>0?e:null)},showUpdate:!1,showView:!1,layout:"list"})},"".concat(e.name,"-").concat(e.size))}))]})]}):n("div",{className:"\n              flex flex-".concat(E," gap-2 rounded-lg border-2 border-dashed p-8 text-center items-center\n              ").concat("row"===E?"justify-center":"","\n              ").concat(G?"border-blue-400 bg-blue-50":"border-gray-300","\n              ").concat(h?"border-red-300 bg-red-50":"","\n              ").concat(g?"border-green-300 bg-green-50":"","\n              ").concat(x?"opacity-50 cursor-not-allowed bg-gray-50":"cursor-pointer hover:border-gray-400","\n            "),onDragOver:K,onDragLeave:Q,onDrop:W,onClick:function(){var e;return!x&&(null===(e=document.getElementById(X))||void 0===e?void 0:e.click())},children:[a(i,{size:24,className:"text-gray-400"}),n("div",{children:[a("p",{className:"text-sm font-medium ".concat(x?"text-gray-400":"text-blue-600 hover:underline"),children:z||(!w&&A.length>0?"Replace file":A.length>0?"Add more files":"Click to Upload")}),a("p",{className:"text-gray-500 text-sm",children:"or drag and drop"}),n("p",{className:"text-sm text-gray-500",children:["(Max. File size: ",j||"25"," MB)"]}),a("p",w?{className:"text-xs text-gray-400 mt-1",children:"Multiple files allowed"}:{className:"text-xs text-gray-400 mt-1",children:"Single file only"})]}),a("input",{id:X,type:"file",className:"hidden",onChange:J,accept:y,multiple:w,disabled:x,required:b})]}),f&&!h&&!g&&a("p",{className:"text-sm text-gray-500",children:f}),h&&n("div",{className:"flex items-center text-red-600 text-sm",children:[a(c,{size:16,className:"mr-1"}),h]}),g&&n("div",{className:"flex items-center text-green-600 text-sm",children:[a(s,{size:16,className:"mr-1"}),g]})]})};export{d as default};
+//# sourceMappingURL=FileUpload.mjs.map

package/dist/esm/components/Form/FileUpload/FileUpload.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload.mjs","sources":["../../../../../src/components/Form/FileUpload/FileUpload.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { AlertCircle, CheckCircle, Upload } from \"lucide-react\";\nimport { FileItem, FileView } from \"../../Document\";\n\nexport interface FileUploadProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"onChange\"> {\n  onFileChange: (files: File[] | null) => void;\n  existingFiles?: FileItem[];\n  direction?: \"row\" | \"col\";\n  maxFileSize?: string;\n  label?: string;\n  description?: string;\n  helperText?: string;\n  error?: string;\n  success?: string;\n  disabled?: boolean;\n  required?: boolean;\n  accept?: string;\n  multiple?: boolean;\n  placeholder?: string;\n  showProgress?: boolean;\n  className?: string;\n  id?: string;\n  replaceMode?: boolean; // When true, single file replaces existing\n}\n\nconst FileUpload: React.FC<FileUploadProps> = ({\n  label,\n  description,\n  helperText,\n  error,\n  success,\n  disabled = false,\n  required = false,\n  accept,\n  multiple = false,\n  placeholder,\n  showProgress = true,\n  className = \"\",\n  id,\n  maxFileSize,\n  onFileChange,\n  existingFiles = [],\n  direction = \"col\",\n  replaceMode,\n  ...props\n}) => {\n  const [uploadedFiles, setUploadedFiles] = useState<File[]>([]);\n  const [uploadProgress, setUploadProgress] = useState<{\n    [key: string]: number;\n  }>({});\n  const [isDragOver, setIsDragOver] = useState(false);\n\n  // Determine if we're in replace mode (single file replacement)\n  const isReplaceMode = replaceMode ?? (!multiple && existingFiles.length > 0);\n\n  // Get the current file to display (for single file mode)\n  const getCurrentFile = (): FileItem | null => {\n    if (!multiple) {\n      // Single file mode - prioritize uploaded file, then existing\n      if (uploadedFiles.length > 0) {\n        const file = uploadedFiles[0];\n        return {\n          name: file.name,\n          size: file.size,\n          type: file.type,\n          file,\n          uploadProgress: uploadProgress[`${file.name}-${file.size}`] || 100,\n        };\n      } else if (existingFiles.length > 0) {\n        return existingFiles[0];\n      }\n    }\n    return null;\n  };\n\n  const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (e.target.files && e.target.files.length > 0) {\n      const newFiles = Array.from(e.target.files);\n\n      let updatedFiles: File[];\n      if (!multiple) {\n        // Single file mode - replace existing\n        updatedFiles = [newFiles[0]];\n      } else {\n        // Multiple file mode - add to existing\n        updatedFiles = [...uploadedFiles, ...newFiles];\n      }\n\n      setUploadedFiles(updatedFiles);\n\n      if (showProgress) {\n        newFiles.forEach((file) => {\n          const fileKey = `${file.name}-${file.size}`;\n          setUploadProgress((prev) => ({ ...prev, [fileKey]: 10 }));\n\n          const interval = setInterval(() => {\n            setUploadProgress((prev) => {\n              const currentProgress = prev[fileKey] || 0;\n              if (currentProgress >= 100) {\n                clearInterval(interval);\n                return prev;\n              }\n              return {\n                ...prev,\n                [fileKey]: Math.min(currentProgress + 10, 100),\n              };\n            });\n          }, 300);\n        });\n      }\n\n      onFileChange(updatedFiles);\n    }\n  };\n\n  const handleDragOver = (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    if (!disabled) {\n      setIsDragOver(true);\n    }\n  };\n\n  const handleDragLeave = (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    setIsDragOver(false);\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    setIsDragOver(false);\n\n    if (disabled) return;\n\n    if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n      const newFiles = Array.from(e.dataTransfer.files);\n\n      let updatedFiles: File[];\n      if (!multiple) {\n        // Single file mode - replace existing\n        updatedFiles = [newFiles[0]];\n      } else {\n        // Multiple file mode - add to existing\n        updatedFiles = [...uploadedFiles, ...newFiles];\n      }\n\n      setUploadedFiles(updatedFiles);\n\n      if (showProgress) {\n        newFiles.forEach((file) => {\n          const fileKey = `${file.name}-${file.size}`;\n          setUploadProgress((prev) => ({ ...prev, [fileKey]: 10 }));\n\n          const interval = setInterval(() => {\n            setUploadProgress((prev) => {\n              const currentProgress = prev[fileKey] || 0;\n              if (currentProgress >= 100) {\n                clearInterval(interval);\n                return prev;\n              }\n              return {\n                ...prev,\n                [fileKey]: Math.min(currentProgress + 10, 100),\n              };\n            });\n          }, 300);\n        });\n      }\n\n      onFileChange(updatedFiles);\n    }\n  };\n\n  const handleDeleteFile = () => {\n    // Remove the uploaded file\n    setUploadedFiles([]);\n    setUploadProgress({});\n    onFileChange(null);\n  };\n\n  const handleReplaceFile = () => {\n    // Trigger file input for replacement\n    document.getElementById(inputId)?.click();\n  };\n\n  const inputId =\n    id || `file-upload-${Math.random().toString(36).substr(2, 9)}`;\n  const currentFile = getCurrentFile();\n\n  return (\n    <div className={`space-y-4 ${className}`}>\n      {/* Label */}\n      {label && (\n        <label\n          htmlFor={inputId}\n          className=\"block text-sm font-medium text-gray-700\"\n        >\n          {label}\n          {required && <span className=\"text-red-500 ml-1\">*</span>}\n        </label>\n      )}\n\n      {/* Description */}\n      {description && <p className=\"text-sm text-gray-600\">{description}</p>}\n\n      {/* Single File Display */}\n      {!multiple && currentFile ? (\n        <div className=\"space-y-2\">\n          <div className=\"flex items-center justify-between\">\n            <h4 className=\"text-sm font-medium text-gray-700\">\n              {uploadedFiles.length > 0 ? \"New File\" : \"Current File\"}\n            </h4>\n            <button\n              onClick={handleReplaceFile}\n              className=\"text-sm text-blue-600 hover:text-blue-800 font-medium\"\n              disabled={disabled}\n            >\n              Replace\n            </button>\n          </div>\n\n          <FileView\n            file={currentFile}\n            onDelete={handleDeleteFile}\n            showUpdate={false}\n            showView={true}\n            showDelete={true}\n            layout=\"list\"\n            className=\"max-w-md\"\n          />\n\n          {/* Hidden file input for replacement */}\n          <input\n            id={inputId}\n            type=\"file\"\n            className=\"hidden\"\n            onChange={handleFileUpload}\n            accept={accept}\n            disabled={disabled}\n            required={required}\n          />\n        </div>\n      ) : multiple && existingFiles.length > 0 ? (\n        /* Multiple File Mode with Existing Files */\n        <div className=\"space-y-4\">\n          <div className=\"mb-4\">\n            <h4 className=\"text-sm font-medium text-gray-700 mb-2\">\n              Current Files ({existingFiles.length})\n            </h4>\n            {existingFiles.map((file, index) => (\n              <div key={file.id || index} className=\"mb-2\">\n                <FileView\n                  file={file}\n                  showDelete={false}\n                  showUpdate={false}\n                  layout=\"list\"\n                />\n              </div>\n            ))}\n          </div>\n\n          {/* File Upload Area for Multiple Mode */}\n          <div\n            className={`\n              flex flex-${direction} gap-2 rounded-lg border-2 border-dashed p-8 text-center items-center\n              ${direction === \"row\" ? \"justify-center\" : \"\"}\n              ${isDragOver ? \"border-blue-400 bg-blue-50\" : \"border-gray-300\"}\n              ${error ? \"border-red-300 bg-red-50\" : \"\"}\n              ${success ? \"border-green-300 bg-green-50\" : \"\"}\n              ${disabled ? \"opacity-50 cursor-not-allowed bg-gray-50\" : \"cursor-pointer hover:border-gray-400\"}\n            `}\n            onDragOver={handleDragOver}\n            onDragLeave={handleDragLeave}\n            onDrop={handleDrop}\n            onClick={() =>\n              !disabled && document.getElementById(inputId)?.click()\n            }\n          >\n            <Upload size={24} className=\"text-gray-400\" />\n            <div>\n              <p\n                className={`text-sm font-medium ${disabled ? \"text-gray-400\" : \"text-blue-600 hover:underline\"}`}\n              >\n                {placeholder || \"Add more files\"}\n              </p>\n              <p className=\"text-gray-500 text-sm\">or drag and drop</p>\n              <p className=\"text-sm text-gray-500\">\n                (Max. File size: {maxFileSize || \"25\"} MB)\n              </p>\n              <p className=\"text-xs text-gray-400 mt-1\">\n                Multiple files allowed\n              </p>\n            </div>\n            <input\n              id={inputId}\n              type=\"file\"\n              className=\"hidden\"\n              onChange={handleFileUpload}\n              accept={accept}\n              multiple={multiple}\n              disabled={disabled}\n              required={required}\n              {...props}\n            />\n          </div>\n\n          {/* New Uploaded Files */}\n          {uploadedFiles.length > 0 && (\n            <div className=\"mt-4\">\n              <div className=\"flex items-center justify-between mb-2\">\n                <h4 className=\"text-sm font-medium text-gray-700\">\n                  New Files ({uploadedFiles.length})\n                </h4>\n                <button\n                  onClick={() => {\n                    setUploadedFiles([]);\n                    setUploadProgress({});\n                    onFileChange(null);\n                  }}\n                  className=\"text-xs text-red-500 hover:text-red-700\"\n                  disabled={disabled}\n                >\n                  Remove All New Files\n                </button>\n              </div>\n\n              {uploadedFiles.map((file, index) => (\n                <div key={`${file.name}-${file.size}`} className=\"mb-2\">\n                  <FileView\n                    file={{\n                      name: file.name,\n                      size: file.size,\n                      type: file.type,\n                      file,\n                      uploadProgress:\n                        uploadProgress[`${file.name}-${file.size}`] || 100,\n                    }}\n                    onDelete={() => {\n                      const updatedFiles = uploadedFiles.filter(\n                        (_, i) => i !== index,\n                      );\n                      setUploadedFiles(updatedFiles);\n                      onFileChange(\n                        updatedFiles.length > 0 ? updatedFiles : null,\n                      );\n                    }}\n                    showUpdate={false}\n                    showView={false}\n                    layout=\"list\"\n                  />\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n      ) : (\n        /* File Upload Area - No Files */\n        <div\n          className={`\n              flex flex-${direction} gap-2 rounded-lg border-2 border-dashed p-8 text-center items-center\n              ${direction === \"row\" ? \"justify-center\" : \"\"}\n              ${isDragOver ? \"border-blue-400 bg-blue-50\" : \"border-gray-300\"}\n              ${error ? \"border-red-300 bg-red-50\" : \"\"}\n              ${success ? \"border-green-300 bg-green-50\" : \"\"}\n              ${disabled ? \"opacity-50 cursor-not-allowed bg-gray-50\" : \"cursor-pointer hover:border-gray-400\"}\n            `}\n          onDragOver={handleDragOver}\n          onDragLeave={handleDragLeave}\n          onDrop={handleDrop}\n          onClick={() => !disabled && document.getElementById(inputId)?.click()}\n        >\n          <Upload size={24} className=\"text-gray-400\" />\n          <div>\n            <p\n              className={`text-sm font-medium ${disabled ? \"text-gray-400\" : \"text-blue-600 hover:underline\"}`}\n            >\n              {placeholder ||\n                (!multiple && existingFiles.length > 0\n                  ? \"Replace file\"\n                  : existingFiles.length > 0\n                    ? \"Add more files\"\n                    : \"Click to Upload\")}\n            </p>\n            <p className=\"text-gray-500 text-sm\">or drag and drop</p>\n            <p className=\"text-sm text-gray-500\">\n              (Max. File size: {maxFileSize || \"25\"} MB)\n            </p>\n            {multiple ? (\n              <p className=\"text-xs text-gray-400 mt-1\">\n                Multiple files allowed\n              </p>\n            ) : (\n              <p className=\"text-xs text-gray-400 mt-1\">Single file only</p>\n            )}\n          </div>\n          <input\n            id={inputId}\n            type=\"file\"\n            className=\"hidden\"\n            onChange={handleFileUpload}\n            accept={accept}\n            multiple={multiple}\n            disabled={disabled}\n            required={required}\n          />\n        </div>\n      )}\n\n      {/* Helper Text */}\n      {helperText && !error && !success && (\n        <p className=\"text-sm text-gray-500\">{helperText}</p>\n      )}\n\n      {/* Error Message */}\n      {error && (\n        <div className=\"flex items-center text-red-600 text-sm\">\n          <AlertCircle size={16} className=\"mr-1\" />\n          {error}\n        </div>\n      )}\n\n      {/* Success Message */}\n      {success && (\n        <div className=\"flex items-center text-green-600 text-sm\">\n          <CheckCircle size={16} className=\"mr-1\" />\n          {success}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default FileUpload;\n\nexport function FileUploadDemo() {\n  const [singleFile, setSingleFile] = useState<File[] | null>(null);\n  const [multipleFiles, setMultipleFiles] = useState<File[] | null>(null);\n  const [imageFiles, setImageFiles] = useState<File[] | null>(null);\n\n  return (\n    <div className=\"max-w-2xl mx-auto p-6 space-y-8\">\n      <h1 className=\"text-2xl font-bold text-gray-800\">\n        File Upload Component Demo\n      </h1>\n\n      {/* Single File Upload */}\n      <div>\n        <h2 className=\"text-lg font-semibold mb-4\">Single File Upload</h2>\n        <FileUpload\n          label=\"Upload Document\"\n          description=\"Upload a single document file\"\n          helperText=\"Supported formats: PDF, DOC, DOCX\"\n          accept=\".pdf,.doc,.docx\"\n          multiple={false}\n          onFileChange={setSingleFile}\n          maxFileSize=\"10\"\n        />\n        {singleFile && (\n          <div className=\"mt-4 p-3 bg-gray-50 rounded\">\n            <p className=\"text-sm\">\n              <strong>Selected:</strong> {singleFile[0]?.name}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Multiple File Upload */}\n      <div>\n        <h2 className=\"text-lg font-semibold mb-4\">Multiple File Upload</h2>\n        <FileUpload\n          label=\"Upload Multiple Files\"\n          description=\"You can upload multiple files at once\"\n          helperText=\"Hold Ctrl/Cmd to select multiple files\"\n          multiple={true}\n          onFileChange={setMultipleFiles}\n          placeholder=\"Choose multiple files\"\n        />\n        {multipleFiles && (\n          <div className=\"mt-4 p-3 bg-gray-50 rounded\">\n            <p className=\"text-sm\">\n              <strong>Selected {multipleFiles.length} files:</strong>\n            </p>\n            <ul className=\"text-xs mt-1\">\n              {multipleFiles.map((file, i) => (\n                <li key={i}>• {file.name}</li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </div>\n\n      {/* Image Upload */}\n      <div>\n        <h2 className=\"text-lg font-semibold mb-4\">Image Upload</h2>\n        <FileUpload\n          label=\"Upload Images\"\n          description=\"Upload one or more image files\"\n          accept=\"image/*\"\n          multiple={true}\n          onFileChange={setImageFiles}\n          placeholder=\"Choose images\"\n          direction=\"row\"\n        />\n        {imageFiles && (\n          <div className=\"mt-4 p-3 bg-gray-50 rounded\">\n            <p className=\"text-sm\">\n              <strong>Selected {imageFiles.length} image(s):</strong>\n            </p>\n            <ul className=\"text-xs mt-1\">\n              {imageFiles.map((file, i) => (\n                <li key={i}>\n                  • {file.name} ({(file.size / 1024 / 1024).toFixed(2)} MB)\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </div>\n\n      {/* With Error State */}\n      <div>\n        <h2 className=\"text-lg font-semibold mb-4\">With Error State</h2>\n        <FileUpload\n          label=\"Upload with Error\"\n          error=\"File size too large. Please select a file smaller than 5MB.\"\n          onFileChange={() => {}}\n        />\n      </div>\n\n      {/* With Success State */}\n      <div>\n        <h2 className=\"text-lg font-semibold mb-4\">With Success State</h2>\n        <FileUpload\n          label=\"Upload with Success\"\n          success=\"Files uploaded successfully!\"\n          onFileChange={() => {}}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["FileUpload","_a","label","description","helperText","error","success","_b","disabled","_c","required","accept","_d","multiple","placeholder","_e","showProgress","_f","className","id","maxFileSize","onFileChange","_g","existingFiles","_h","direction","replaceMode","props","__rest","_j","useState","uploadedFiles","setUploadedFiles","_k","uploadProgress","setUploadProgress","_l","isDragOver","setIsDragOver","length","handleFileUpload","e","target","files","newFiles","Array","from","updatedFiles","__spreadArray","forEach","file","fileKey","concat","name","size","prev","interval","setInterval","currentProgress","clearInterval","__assign","Math","min","handleDragOver","preventDefault","handleDragLeave","handleDrop","dataTransfer","inputId","random","toString","substr","currentFile","type","getCurrentFile","_jsxs","children","htmlFor","_jsx","onClick","document","getElementById","click","FileView","onDelete","showUpdate","showView","showDelete","layout","onChange","map","index","onDragOver","onDragLeave","onDrop","Upload","filter","_","i","AlertCircle","CheckCircle"],"mappings":"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"}

package/dist/esm/components/Form/Input/DateTimePicker.mjs

@@ -0,0 +1,2 @@
+import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.mjs";import{jsxs as r,jsx as n,Fragment as a}from"react/jsx-runtime";import{useState as o,useRef as l,useEffect as i}from"react";import{ChevronLeft as c,ChevronRight as d}from"lucide-react";var s=function(s){var u=s.id,m=s.label,g=s.value,h=void 0===g?{}:g,p=s.size,f=void 0===p?"md":p,b=s.onChange,x=s.placeholder,y=s.error,v=s.required,N=void 0!==v&&v,w=s.helpText,D=s.className,M=void 0===D?"":D,C=s.disabled,k=void 0!==C&&C,S=s.mode,F=void 0===S?"date":S;s.minDate,s.maxDate,s.showWeekNumbers;var T=s.firstDayOfWeek,Y=void 0===T?1:T;e(s,["id","label","value","size","onChange","placeholder","error","required","helpText","className","disabled","mode","minDate","maxDate","showWeekNumbers","firstDayOfWeek"]);var J=o(!1),j=J[0],z=J[1],L=o(new Date),O=L[0],W=L[1],A=o(h.startDate||null),R=A[0],P=A[1],V=o(h.endDate||null),q=V[0],B=V[1],E=o(h.time||"12:00 PM"),H=E[0],I=E[1],U=o(!1),_=U[0],G=U[1],K=o(!1),Q=K[0],X=K[1],Z=o(O.getFullYear()),$=Z[0],ee=Z[1],te=o(O.getMonth()),re=te[0],ne=te[1],ae=l(null),oe=l(null),le=0===Y?["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]:["Mon","Tue","Wed","Thu","Fri","Sat","Sun"];i((function(){h.startDate&&(P(h.startDate),W(new Date(h.startDate.getFullYear(),h.startDate.getMonth()))),h.endDate&&B(h.endDate),h.time&&I(h.time)}),[h]),i((function(){var e=function(e){ae.current&&!ae.current.contains(e.target)&&oe.current&&!oe.current.contains(e.target)&&(z(!1),X(!1))};return document.addEventListener("mousedown",e),function(){return document.removeEventListener("mousedown",e)}}),[]);var ie=function(e){return e.toLocaleDateString("en-US",{year:"numeric",month:"short",day:"numeric"})},ce=function(e,t){var r=ie(e);return t?"".concat(r," ").concat(t):r},de=function(){if(!R&&!q)return"";switch(F){case"date":return R?ie(R):"";case"datetime":return R?ce(R,H):"";case"daterange":return R&&q?"".concat(ie(R)," - ").concat(ie(q)):R?ie(R):"";case"datetimerange":return R&&q?"".concat(ce(R,H)," - ").concat(ce(q,H)):R?ce(R,H):"";default:return""}},se=function(e,t){return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()},ue=function(e){W(new Date(O.getFullYear(),O.getMonth()+e,1))};return r("div",{className:"mb-4",children:[m&&r("label",{htmlFor:u,className:"mb-1 block text-sm font-medium text-gray-600",children:[m,N&&n("span",{className:"ml-1 text-red-500",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:oe,onClick:function(){return!k&&z(!j)},className:"w-full rounded-[12px] border ".concat(y?"border-red-500":"border-gray-200"," ").concat(k?"bg-gray-100 text-gray-500 cursor-not-allowed":"bg-gray-100 text-dark cursor-pointer hover:bg-gray-50"," focus:outline-none focus:ring-1 focus:ring-primary ").concat(M," ").concat({sm:"text-xs px-3 py-1.5 text-sm min-h-[32px]",md:"text-sm px-4 py-2 text-base min-h-[40px]",lg:"text-base px-4 py-3 text-lg min-h-[48px]"}[f]," flex items-center justify-between"),children:[n("span",{className:de()?"text-gray-900":"text-gray-400",children:de()||x||"Select date..."}),n("svg",{className:"w-5 h-5 text-gray-400 transition-transform ".concat(j?"rotate-180":""),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:n("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"})})]}),j&&!k&&n("div",{ref:ae,className:"absolute z-[1000] mt-1 bg-white border border-gray-200 rounded-[12px] shadow-lg backdrop-blur-sm bg-white/95 p-4 min-w-[320px] max-h-[600px] overflow-y-auto",children:Q?r("div",{className:"space-y-4",children:[r("div",{className:"flex items-center justify-between",children:[n("h3",{className:"text-sm font-semibold text-gray-900",children:"Select Month & Year"}),n("button",{type:"button",onClick:function(){return X(!1)},className:"text-gray-400 hover:text-gray-600",children:n("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:n("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),r("div",{children:[n("label",{className:"block text-xs font-medium text-gray-700 mb-2",children:"Year"}),n("select",{value:$,onChange:function(e){return ee(parseInt(e.target.value))},className:"w-full px-3 py-2 border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 bg-white font-medium",children:function(){for(var e=(new Date).getFullYear(),t=[],r=e-100;r<=e+10;r++)t.push(r);return t}().map((function(e){return n("option",{value:e,children:e},e)}))})]}),r("div",{children:[n("label",{className:"block text-xs font-medium text-gray-700 mb-2",children:"Month"}),n("div",{className:"grid grid-cols-3 gap-2",children:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"].map((function(e,t){return n("button",{type:"button",onClick:function(){return ne(t)},className:"\n                          px-3 py-2 text-sm font-medium rounded-lg transition-colors\n                          ".concat(re===t?"bg-primary-500 text-white":"bg-gray-100 text-gray-700 hover:bg-gray-200","\n                        "),children:e},e)}))})]}),n("button",{type:"button",onClick:function(){W(new Date($,re,1)),X(!1)},className:"w-full px-4 py-2 text-sm bg-primary-500 text-white rounded-lg hover:bg-primary-600 transition-colors font-medium",children:"Apply"})]}):r(a,{children:[r("div",{className:"flex items-center justify-between mb-4",children:[n("button",{type:"button",onClick:function(){return ue(-1)},className:"p-2 hover:bg-gray-100 rounded-lg transition-colors",children:n(c,{className:"w-5 h-5 text-gray-600"})}),r("button",{type:"button",onClick:function(){X(!0),ee(O.getFullYear()),ne(O.getMonth())},className:"px-4 py-2 font-semibold text-gray-900 hover:bg-gray-100 rounded-lg transition-colors",children:[["January","February","March","April","May","June","July","August","September","October","November","December"][O.getMonth()]," ",O.getFullYear()]}),n("button",{type:"button",onClick:function(){return ue(1)},className:"p-2 hover:bg-gray-100 rounded-lg transition-colors",children:n(d,{className:"w-5 h-5 text-gray-600"})})]}),n("div",{className:"grid grid-cols-7 gap-1 mb-2",children:le.map((function(e){return n("div",{className:"text-center text-xs font-semibold text-gray-600 py-2",children:e},e)}))}),n("div",{className:"grid grid-cols-7 gap-1 mb-4",children:function(){var e=O.getFullYear(),t=O.getMonth(),r=new Date(e,t,1),n=new Date(e,t+1,0).getDate(),a=r.getDay();1===Y&&(a=0===a?6:a-1);for(var o=[],l=0;l<a;l++){var i=new Date(e,t,-(a-1-l));o.push({date:i,isCurrentMonth:!1})}for(l=1;l<=n;l++)o.push({date:new Date(e,t,l),isCurrentMonth:!0});var c=42-o.length;for(l=1;l<=c;l++)o.push({date:new Date(e,t+1,l),isCurrentMonth:!1});return o}().map((function(e,r){var a=e.date,o=e.isCurrentMonth,l=function(e){return!(!R||!se(e,R))||!(!q||!se(e,q))}(a),i=function(e){if(!R||!q)return!1;var t=new Date(e.getFullYear(),e.getMonth(),e.getDate()),r=new Date(R.getFullYear(),R.getMonth(),R.getDate()),n=new Date(q.getFullYear(),q.getMonth(),q.getDate());return t>=r&&t<=n}(a),c=se(a,new Date),d=R&&se(a,R),s=q&&se(a,q);return n("button",{type:"button",onClick:function(){return function(e){var r=new Date(e.getFullYear(),e.getMonth(),e.getDate(),12,0,0);if("daterange"===F||"datetimerange"===F){if(!R||R&&q||_)if(_){r<R?(P(r),B(R)):B(r),G(!1);var n=t({startDate:R,endDate:r<R?R||void 0:r},"datetimerange"===F&&{time:H});null==b||b(n)}else P(r),B(null),G(!0)}else P(r),n=t({startDate:r},"datetime"===F&&{time:H}),null==b||b(n),"date"===F&&z(!1)}(a)},disabled:!o,className:"\n                          w-9 h-9 text-sm transition-all duration-200 relative flex items-center justify-center font-medium\n                          ".concat(o?"text-gray-900":"text-gray-300 cursor-not-allowed","\n                          ").concat(l?"bg-primary-500 text-white font-semibold rounded-full shadow-md":i?"bg-primary-100 text-primary-700":"hover:bg-gray-100 rounded-lg","\n                          ").concat(c&&!l?"ring-2 ring-primary-400":"","\n                          ").concat(d||s?"rounded-full":"","\n                          ").concat(o?"":"opacity-40","\n                        "),children:a.getDate()},r)}))}),("datetime"===F||"datetimerange"===F)&&r("div",{className:"border-t border-gray-100 pt-4",children:[n("label",{className:"block text-sm font-medium text-gray-700 mb-2",children:"Time"}),n("select",{value:H,onChange:function(e){return function(e){I(e);var r=t(t({startDate:R},q&&{endDate:q}),{time:e});null==b||b(r)}(e.target.value)},className:"w-full px-3 py-2 border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 bg-white",children:function(){for(var e=[],t=1;t<=12;t++)for(var r=0;r<60;r+=15){var n=r.toString().padStart(2,"0");e.push("".concat(t,":").concat(n," AM")),e.push("".concat(t,":").concat(n," PM"))}return e}().map((function(e){return n("option",{value:e,children:e},e)}))})]}),r("div",{className:"flex justify-end space-x-2 mt-4 pt-4 border-t border-gray-100",children:[n("button",{type:"button",onClick:function(){z(!1),P(null),B(null),G(!1),null==b||b({})},className:"px-4 py-2 text-sm text-gray-600 hover:bg-gray-100 rounded-lg transition-colors font-medium",children:"Clear"}),n("button",{type:"button",onClick:function(){return z(!1)},className:"px-4 py-2 text-sm bg-primary-500 text-white rounded-lg hover:bg-primary-600 transition-colors font-medium",children:"Done"})]})]})})]}),w&&!y&&n("p",{id:"".concat(u,"-help"),className:"mt-1 text-sm text-gray-500",children:w}),y&&n("p",{id:"".concat(u,"-error"),className:"mt-1 text-sm text-red-500",children:y})]})},u=function(){var e=o({}),t=e[0],a=e[1],l=o({}),i=l[0],c=l[1],d=o({}),u=d[0],m=d[1],g=o({}),h=g[0],p=g[1];return r("div",{className:"max-w-4xl mx-auto p-6 bg-gray-50 min-h-screen",children:[n("h1",{className:"text-3xl font-bold mb-8 text-gray-900",children:"DateTime Picker Component"}),r("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-8",children:[r("div",{className:"space-y-6",children:[n(s,{id:"single-date",label:"Single Date",value:t,onChange:a,placeholder:"Select a date",mode:"date",helpText:"Choose any single date",size:"md"}),n(s,{id:"datetime",label:"Date & Time",value:i,onChange:c,placeholder:"Select date and time",mode:"datetime",helpText:"Choose date with specific time",size:"md"})]}),r("div",{className:"space-y-6",children:[n(s,{id:"date-range",label:"Date Range",value:u,onChange:m,placeholder:"Select date range",mode:"daterange",helpText:"Choose start and end dates",size:"md"}),n(s,{id:"datetime-range",label:"Date & Time Range",value:h,onChange:p,placeholder:"Select date and time range",mode:"datetimerange",helpText:"Choose date range with time",size:"md"})]})]}),r("div",{className:"mt-12 grid grid-cols-1 md:grid-cols-2 gap-8",children:[r("div",{className:"space-y-4",children:[n("h3",{className:"text-lg font-semibold text-gray-800",children:"Single Date:"}),n("pre",{className:"bg-white p-4 rounded-lg border text-sm overflow-x-auto",children:JSON.stringify(t,null,2)}),n("h3",{className:"text-lg font-semibold text-gray-800",children:"DateTime:"}),n("pre",{className:"bg-white p-4 rounded-lg border text-sm overflow-x-auto",children:JSON.stringify(i,null,2)})]}),r("div",{className:"space-y-4",children:[n("h3",{className:"text-lg font-semibold text-gray-800",children:"Date Range:"}),n("pre",{className:"bg-white p-4 rounded-lg border text-sm overflow-x-auto",children:JSON.stringify(u,null,2)}),n("h3",{className:"text-lg font-semibold text-gray-800",children:"DateTime Range:"}),n("pre",{className:"bg-white p-4 rounded-lg border text-sm overflow-x-auto",children:JSON.stringify(h,null,2)})]})]})]})};export{u as DateTimePickerDemo,s as default};
+//# sourceMappingURL=DateTimePicker.mjs.map

package/dist/esm/components/Form/Input/DateTimePicker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.mjs","sources":["../../../../../src/components/Form/Input/DateTimePicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from \"react\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nexport interface DateTimeValue {\n  startDate?: Date;\n  endDate?: Date;\n  time?: string;\n}\n\nexport interface DateTimePickerProps {\n  id?: string;\n  label?: string;\n  value?: DateTimeValue;\n  onChange?: (value: DateTimeValue) => void;\n  placeholder?: string;\n  error?: string;\n  required?: boolean;\n  helpText?: string;\n  className?: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  disabled?: boolean;\n  mode?: \"date\" | \"datetime\" | \"daterange\" | \"datetimerange\";\n  minDate?: Date;\n  maxDate?: Date;\n  format?: string;\n  showWeekNumbers?: boolean;\n  firstDayOfWeek?: 0 | 1;\n}\n\nconst DateTimePicker: React.FC<DateTimePickerProps> = ({\n  id,\n  label,\n  value = {},\n  size = \"md\",\n  onChange,\n  placeholder,\n  error,\n  required = false,\n  helpText,\n  className = \"\",\n  disabled = false,\n  mode = \"date\",\n  minDate,\n  maxDate,\n  showWeekNumbers = false,\n  firstDayOfWeek = 1,\n  ...restProps\n}) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [currentMonth, setCurrentMonth] = useState(new Date());\n  const [selectedStartDate, setSelectedStartDate] = useState<Date | null>(\n    value.startDate || null,\n  );\n  const [selectedEndDate, setSelectedEndDate] = useState<Date | null>(\n    value.endDate || null,\n  );\n  const [selectedTime, setSelectedTime] = useState(value.time || \"12:00 PM\");\n  const [isSelectingEnd, setIsSelectingEnd] = useState(false);\n  const [showYearMonthPicker, setShowYearMonthPicker] = useState(false);\n  const [tempYear, setTempYear] = useState(currentMonth.getFullYear());\n  const [tempMonth, setTempMonth] = useState(currentMonth.getMonth());\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLDivElement>(null);\n\n  const sizeClasses = {\n    sm: \"text-xs px-3 py-1.5 text-sm min-h-[32px]\",\n    md: \"text-sm px-4 py-2 text-base min-h-[40px]\",\n    lg: \"text-base px-4 py-3 text-lg min-h-[48px]\",\n  };\n\n  const weekDays =\n    firstDayOfWeek === 0\n      ? [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\"]\n      : [\"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\", \"Sun\"];\n\n  const months = [\n    \"January\",\n    \"February\",\n    \"March\",\n    \"April\",\n    \"May\",\n    \"June\",\n    \"July\",\n    \"August\",\n    \"September\",\n    \"October\",\n    \"November\",\n    \"December\",\n  ];\n\n  const monthsShort = [\n    \"Jan\",\n    \"Feb\",\n    \"Mar\",\n    \"Apr\",\n    \"May\",\n    \"Jun\",\n    \"Jul\",\n    \"Aug\",\n    \"Sep\",\n    \"Oct\",\n    \"Nov\",\n    \"Dec\",\n  ];\n\n  useEffect(() => {\n    if (value.startDate) {\n      setSelectedStartDate(value.startDate);\n      setCurrentMonth(\n        new Date(value.startDate.getFullYear(), value.startDate.getMonth()),\n      );\n    }\n    if (value.endDate) {\n      setSelectedEndDate(value.endDate);\n    }\n    if (value.time) {\n      setSelectedTime(value.time);\n    }\n  }, [value]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        dropdownRef.current &&\n        !dropdownRef.current.contains(event.target as Node) &&\n        inputRef.current &&\n        !inputRef.current.contains(event.target as Node)\n      ) {\n        setIsOpen(false);\n        setShowYearMonthPicker(false);\n      }\n    };\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    return () => document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, []);\n\n  const formatDate = (date: Date) => {\n    return date.toLocaleDateString(\"en-US\", {\n      year: \"numeric\",\n      month: \"short\",\n      day: \"numeric\",\n    });\n  };\n\n  const formatDateTime = (date: Date, time?: string) => {\n    const dateStr = formatDate(date);\n    return time ? `${dateStr} ${time}` : dateStr;\n  };\n\n  const getDisplayValue = () => {\n    if (!selectedStartDate && !selectedEndDate) return \"\";\n\n    switch (mode) {\n      case \"date\":\n        return selectedStartDate ? formatDate(selectedStartDate) : \"\";\n      case \"datetime\":\n        return selectedStartDate\n          ? formatDateTime(selectedStartDate, selectedTime)\n          : \"\";\n      case \"daterange\":\n        if (selectedStartDate && selectedEndDate) {\n          return `${formatDate(selectedStartDate)} - ${formatDate(selectedEndDate)}`;\n        } else if (selectedStartDate) {\n          return formatDate(selectedStartDate);\n        }\n        return \"\";\n      case \"datetimerange\":\n        if (selectedStartDate && selectedEndDate) {\n          return `${formatDateTime(selectedStartDate, selectedTime)} - ${formatDateTime(selectedEndDate, selectedTime)}`;\n        } else if (selectedStartDate) {\n          return formatDateTime(selectedStartDate, selectedTime);\n        }\n        return \"\";\n      default:\n        return \"\";\n    }\n  };\n\n  const handleDateClick = (date: Date) => {\n    // Create date at noon to avoid timezone issues\n    const selectedDate = new Date(\n      date.getFullYear(),\n      date.getMonth(),\n      date.getDate(),\n      12,\n      0,\n      0,\n    );\n\n    if (mode === \"daterange\" || mode === \"datetimerange\") {\n      if (\n        !selectedStartDate ||\n        (selectedStartDate && selectedEndDate) ||\n        isSelectingEnd\n      ) {\n        if (!isSelectingEnd) {\n          setSelectedStartDate(selectedDate);\n          setSelectedEndDate(null);\n          setIsSelectingEnd(true);\n        } else {\n          if (selectedDate < selectedStartDate!) {\n            setSelectedStartDate(selectedDate);\n            setSelectedEndDate(selectedStartDate);\n          } else {\n            setSelectedEndDate(selectedDate);\n          }\n          setIsSelectingEnd(false);\n\n          const newValue: DateTimeValue = {\n            startDate: selectedStartDate!,\n            endDate:\n              selectedDate < selectedStartDate!\n                ? selectedStartDate || undefined\n                : selectedDate,\n            ...(mode === \"datetimerange\" && { time: selectedTime }),\n          };\n          onChange?.(newValue);\n        }\n      }\n    } else {\n      setSelectedStartDate(selectedDate);\n      const newValue: DateTimeValue = {\n        startDate: selectedDate,\n        ...(mode === \"datetime\" && { time: selectedTime }),\n      };\n      onChange?.(newValue);\n      if (mode === \"date\") {\n        setIsOpen(false);\n      }\n    }\n  };\n\n  const handleTimeChange = (time: string) => {\n    setSelectedTime(time);\n    const newValue: DateTimeValue = {\n      startDate: selectedStartDate!,\n      ...(selectedEndDate && { endDate: selectedEndDate }),\n      time,\n    };\n    onChange?.(newValue);\n  };\n\n  const isDateInRange = (date: Date) => {\n    if (!selectedStartDate || !selectedEndDate) return false;\n    const checkDate = new Date(\n      date.getFullYear(),\n      date.getMonth(),\n      date.getDate(),\n    );\n    const start = new Date(\n      selectedStartDate.getFullYear(),\n      selectedStartDate.getMonth(),\n      selectedStartDate.getDate(),\n    );\n    const end = new Date(\n      selectedEndDate.getFullYear(),\n      selectedEndDate.getMonth(),\n      selectedEndDate.getDate(),\n    );\n    return checkDate >= start && checkDate <= end;\n  };\n\n  const isDateSelected = (date: Date) => {\n    if (selectedStartDate && isSameDay(date, selectedStartDate)) return true;\n    if (selectedEndDate && isSameDay(date, selectedEndDate)) return true;\n    return false;\n  };\n\n  const isSameDay = (date1: Date, date2: Date) => {\n    return (\n      date1.getFullYear() === date2.getFullYear() &&\n      date1.getMonth() === date2.getMonth() &&\n      date1.getDate() === date2.getDate()\n    );\n  };\n\n  const getDaysInMonth = () => {\n    const year = currentMonth.getFullYear();\n    const month = currentMonth.getMonth();\n    const firstDay = new Date(year, month, 1);\n    const lastDay = new Date(year, month + 1, 0);\n    const daysInMonth = lastDay.getDate();\n\n    let startDay = firstDay.getDay();\n    if (firstDayOfWeek === 1) {\n      startDay = startDay === 0 ? 6 : startDay - 1;\n    }\n\n    const days = [];\n\n    for (let i = 0; i < startDay; i++) {\n      const prevDate = new Date(year, month, -(startDay - 1 - i));\n      days.push({ date: prevDate, isCurrentMonth: false });\n    }\n\n    for (let i = 1; i <= daysInMonth; i++) {\n      days.push({ date: new Date(year, month, i), isCurrentMonth: true });\n    }\n\n    const remainingDays = 42 - days.length;\n    for (let i = 1; i <= remainingDays; i++) {\n      days.push({ date: new Date(year, month + 1, i), isCurrentMonth: false });\n    }\n\n    return days;\n  };\n\n  const navigateMonth = (direction: number) => {\n    setCurrentMonth(\n      new Date(\n        currentMonth.getFullYear(),\n        currentMonth.getMonth() + direction,\n        1,\n      ),\n    );\n  };\n\n  const generateTimeOptions = () => {\n    const times = [];\n    for (let hour = 1; hour <= 12; hour++) {\n      for (let minute = 0; minute < 60; minute += 15) {\n        const minuteStr = minute.toString().padStart(2, \"0\");\n        times.push(`${hour}:${minuteStr} AM`);\n        times.push(`${hour}:${minuteStr} PM`);\n      }\n    }\n    return times;\n  };\n\n  const generateYears = () => {\n    const currentYear = new Date().getFullYear();\n    const years = [];\n    for (let i = currentYear - 100; i <= currentYear + 10; i++) {\n      years.push(i);\n    }\n    return years;\n  };\n\n  const handleYearMonthSelect = () => {\n    setCurrentMonth(new Date(tempYear, tempMonth, 1));\n    setShowYearMonthPicker(false);\n  };\n\n  return (\n    <div className=\"mb-4\">\n      {label && (\n        <label\n          htmlFor={id}\n          className=\"mb-1 block text-sm font-medium text-gray-600\"\n        >\n          {label}\n          {required && <span className=\"ml-1 text-red-500\">*</span>}\n        </label>\n      )}\n\n      <div className=\"relative\">\n        <div\n          ref={inputRef}\n          onClick={() => !disabled && setIsOpen(!isOpen)}\n          className={`w-full rounded-[12px] border ${\n            error ? \"border-red-500\" : \"border-gray-200\"\n          } ${\n            disabled\n              ? \"bg-gray-100 text-gray-500 cursor-not-allowed\"\n              : \"bg-gray-100 text-dark cursor-pointer hover:bg-gray-50\"\n          } focus:outline-none focus:ring-1 focus:ring-primary ${className} ${sizeClasses[size]} flex items-center justify-between`}\n        >\n          <span\n            className={getDisplayValue() ? \"text-gray-900\" : \"text-gray-400\"}\n          >\n            {getDisplayValue() || placeholder || \"Select date...\"}\n          </span>\n          <svg\n            className={`w-5 h-5 text-gray-400 transition-transform ${isOpen ? \"rotate-180\" : \"\"}`}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            viewBox=\"0 0 24 24\"\n          >\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"\n            />\n          </svg>\n        </div>\n\n        {isOpen && !disabled && (\n          // <div\n          //   ref={dropdownRef}\n          //   className=\"absolute z-[1000] mt-1 bg-white border border-gray-200 rounded-[12px] shadow-lg backdrop-blur-sm bg-white/95 p-4 min-w-[320px]\"\n          // >\n          <div\n            ref={dropdownRef}\n            className=\"absolute z-[1000] mt-1 bg-white border border-gray-200 rounded-[12px] shadow-lg backdrop-blur-sm bg-white/95 p-4 min-w-[320px] max-h-[600px] overflow-y-auto\"\n          >\n            {!showYearMonthPicker ? (\n              <>\n                {/* Month/Year Navigation */}\n                <div className=\"flex items-center justify-between mb-4\">\n                  <button\n                    type=\"button\"\n                    onClick={() => navigateMonth(-1)}\n                    className=\"p-2 hover:bg-gray-100 rounded-lg transition-colors\"\n                  >\n                    <ChevronLeft className=\"w-5 h-5 text-gray-600\" />\n                  </button>\n\n                  <button\n                    type=\"button\"\n                    onClick={() => {\n                      setShowYearMonthPicker(true);\n                      setTempYear(currentMonth.getFullYear());\n                      setTempMonth(currentMonth.getMonth());\n                    }}\n                    className=\"px-4 py-2 font-semibold text-gray-900 hover:bg-gray-100 rounded-lg transition-colors\"\n                  >\n                    {months[currentMonth.getMonth()]}{\" \"}\n                    {currentMonth.getFullYear()}\n                  </button>\n\n                  <button\n                    type=\"button\"\n                    onClick={() => navigateMonth(1)}\n                    className=\"p-2 hover:bg-gray-100 rounded-lg transition-colors\"\n                  >\n                    <ChevronRight className=\"w-5 h-5 text-gray-600\" />\n                  </button>\n                </div>\n\n                {/* Week Days Header */}\n                <div className=\"grid grid-cols-7 gap-1 mb-2\">\n                  {weekDays.map((day) => (\n                    <div\n                      key={day}\n                      className=\"text-center text-xs font-semibold text-gray-600 py-2\"\n                    >\n                      {day}\n                    </div>\n                  ))}\n                </div>\n\n                {/* Calendar Grid */}\n                <div className=\"grid grid-cols-7 gap-1 mb-4\">\n                  {getDaysInMonth().map((dayObj, index) => {\n                    const { date, isCurrentMonth } = dayObj;\n                    const isSelected = isDateSelected(date);\n                    const isInRange = isDateInRange(date);\n                    const isToday = isSameDay(date, new Date());\n                    const isStartDate =\n                      selectedStartDate && isSameDay(date, selectedStartDate);\n                    const isEndDate =\n                      selectedEndDate && isSameDay(date, selectedEndDate);\n\n                    return (\n                      <button\n                        key={index}\n                        type=\"button\"\n                        onClick={() => handleDateClick(date)}\n                        disabled={!isCurrentMonth}\n                        className={`\n                          w-9 h-9 text-sm transition-all duration-200 relative flex items-center justify-center font-medium\n                          ${isCurrentMonth ? \"text-gray-900\" : \"text-gray-300 cursor-not-allowed\"}\n                          ${\n                            isSelected\n                              ? \"bg-primary-500 text-white font-semibold rounded-full shadow-md\"\n                              : isInRange\n                                ? \"bg-primary-100 text-primary-700\"\n                                : \"hover:bg-gray-100 rounded-lg\"\n                          }\n                          ${isToday && !isSelected ? \"ring-2 ring-primary-400\" : \"\"}\n                          ${isStartDate || isEndDate ? \"rounded-full\" : \"\"}\n                          ${!isCurrentMonth ? \"opacity-40\" : \"\"}\n                        `}\n                      >\n                        {date.getDate()}\n                      </button>\n                    );\n                  })}\n                </div>\n\n                {/* Time Picker */}\n                {(mode === \"datetime\" || mode === \"datetimerange\") && (\n                  <div className=\"border-t border-gray-100 pt-4\">\n                    <label className=\"block text-sm font-medium text-gray-700 mb-2\">\n                      Time\n                    </label>\n                    <select\n                      value={selectedTime}\n                      onChange={(e) => handleTimeChange(e.target.value)}\n                      className=\"w-full px-3 py-2 border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 bg-white\"\n                    >\n                      {generateTimeOptions().map((time) => (\n                        <option key={time} value={time}>\n                          {time}\n                        </option>\n                      ))}\n                    </select>\n                  </div>\n                )}\n\n                {/* Action Buttons */}\n                <div className=\"flex justify-end space-x-2 mt-4 pt-4 border-t border-gray-100\">\n                  <button\n                    type=\"button\"\n                    onClick={() => {\n                      setIsOpen(false);\n                      setSelectedStartDate(null);\n                      setSelectedEndDate(null);\n                      setIsSelectingEnd(false);\n                      onChange?.({});\n                    }}\n                    className=\"px-4 py-2 text-sm text-gray-600 hover:bg-gray-100 rounded-lg transition-colors font-medium\"\n                  >\n                    Clear\n                  </button>\n                  <button\n                    type=\"button\"\n                    onClick={() => setIsOpen(false)}\n                    className=\"px-4 py-2 text-sm bg-primary-500 text-white rounded-lg hover:bg-primary-600 transition-colors font-medium\"\n                  >\n                    Done\n                  </button>\n                </div>\n              </>\n            ) : (\n              /* Year & Month Picker */\n              <div className=\"space-y-4\">\n                <div className=\"flex items-center justify-between\">\n                  <h3 className=\"text-sm font-semibold text-gray-900\">\n                    Select Month & Year\n                  </h3>\n                  <button\n                    type=\"button\"\n                    onClick={() => setShowYearMonthPicker(false)}\n                    className=\"text-gray-400 hover:text-gray-600\"\n                  >\n                    <svg\n                      className=\"w-5 h-5\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      viewBox=\"0 0 24 24\"\n                    >\n                      <path\n                        strokeLinecap=\"round\"\n                        strokeLinejoin=\"round\"\n                        strokeWidth={2}\n                        d=\"M6 18L18 6M6 6l12 12\"\n                      />\n                    </svg>\n                  </button>\n                </div>\n\n                {/* Year Selector */}\n                <div>\n                  <label className=\"block text-xs font-medium text-gray-700 mb-2\">\n                    Year\n                  </label>\n                  <select\n                    value={tempYear}\n                    onChange={(e) => setTempYear(parseInt(e.target.value))}\n                    className=\"w-full px-3 py-2 border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 bg-white font-medium\"\n                  >\n                    {generateYears().map((year) => (\n                      <option key={year} value={year}>\n                        {year}\n                      </option>\n                    ))}\n                  </select>\n                </div>\n\n                {/* Month Grid */}\n                <div>\n                  <label className=\"block text-xs font-medium text-gray-700 mb-2\">\n                    Month\n                  </label>\n                  <div className=\"grid grid-cols-3 gap-2\">\n                    {monthsShort.map((month, index) => (\n                      <button\n                        key={month}\n                        type=\"button\"\n                        onClick={() => setTempMonth(index)}\n                        className={`\n                          px-3 py-2 text-sm font-medium rounded-lg transition-colors\n                          ${\n                            tempMonth === index\n                              ? \"bg-primary-500 text-white\"\n                              : \"bg-gray-100 text-gray-700 hover:bg-gray-200\"\n                          }\n                        `}\n                      >\n                        {month}\n                      </button>\n                    ))}\n                  </div>\n                </div>\n\n                {/* Confirm Button */}\n                <button\n                  type=\"button\"\n                  onClick={handleYearMonthSelect}\n                  className=\"w-full px-4 py-2 text-sm bg-primary-500 text-white rounded-lg hover:bg-primary-600 transition-colors font-medium\"\n                >\n                  Apply\n                </button>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n\n      {helpText && !error && (\n        <p id={`${id}-help`} className=\"mt-1 text-sm text-gray-500\">\n          {helpText}\n        </p>\n      )}\n\n      {error && (\n        <p id={`${id}-error`} className=\"mt-1 text-sm text-red-500\">\n          {error}\n        </p>\n      )}\n    </div>\n  );\n};\n\nexport default DateTimePicker;\n\n// Demo component\nexport const DateTimePickerDemo = () => {\n  const [singleDate, setSingleDate] = useState<DateTimeValue>({});\n  const [dateTime, setDateTime] = useState<DateTimeValue>({});\n  const [dateRange, setDateRange] = useState<DateTimeValue>({});\n  const [dateTimeRange, setDateTimeRange] = useState<DateTimeValue>({});\n\n  return (\n    <div className=\"max-w-4xl mx-auto p-6 bg-gray-50 min-h-screen\">\n      <h1 className=\"text-3xl font-bold mb-8 text-gray-900\">\n        DateTime Picker Component\n      </h1>\n\n      <div className=\"grid grid-cols-1 md:grid-cols-2 gap-8\">\n        <div className=\"space-y-6\">\n          <DateTimePicker\n            id=\"single-date\"\n            label=\"Single Date\"\n            value={singleDate}\n            onChange={setSingleDate}\n            placeholder=\"Select a date\"\n            mode=\"date\"\n            helpText=\"Choose any single date\"\n            size=\"md\"\n          />\n\n          <DateTimePicker\n            id=\"datetime\"\n            label=\"Date & Time\"\n            value={dateTime}\n            onChange={setDateTime}\n            placeholder=\"Select date and time\"\n            mode=\"datetime\"\n            helpText=\"Choose date with specific time\"\n            size=\"md\"\n          />\n        </div>\n\n        <div className=\"space-y-6\">\n          <DateTimePicker\n            id=\"date-range\"\n            label=\"Date Range\"\n            value={dateRange}\n            onChange={setDateRange}\n            placeholder=\"Select date range\"\n            mode=\"daterange\"\n            helpText=\"Choose start and end dates\"\n            size=\"md\"\n          />\n\n          <DateTimePicker\n            id=\"datetime-range\"\n            label=\"Date & Time Range\"\n            value={dateTimeRange}\n            onChange={setDateTimeRange}\n            placeholder=\"Select date and time range\"\n            mode=\"datetimerange\"\n            helpText=\"Choose date range with time\"\n            size=\"md\"\n          />\n        </div>\n      </div>\n\n      <div className=\"mt-12 grid grid-cols-1 md:grid-cols-2 gap-8\">\n        <div className=\"space-y-4\">\n          <h3 className=\"text-lg font-semibold text-gray-800\">Single Date:</h3>\n          <pre className=\"bg-white p-4 rounded-lg border text-sm overflow-x-auto\">\n            {JSON.stringify(singleDate, null, 2)}\n          </pre>\n\n          <h3 className=\"text-lg font-semibold text-gray-800\">DateTime:</h3>\n          <pre className=\"bg-white p-4 rounded-lg border text-sm overflow-x-auto\">\n            {JSON.stringify(dateTime, null, 2)}\n          </pre>\n        </div>\n\n        <div className=\"space-y-4\">\n          <h3 className=\"text-lg font-semibold text-gray-800\">Date Range:</h3>\n          <pre className=\"bg-white p-4 rounded-lg border text-sm overflow-x-auto\">\n            {JSON.stringify(dateRange, null, 2)}\n          </pre>\n\n          <h3 className=\"text-lg font-semibold text-gray-800\">\n            DateTime Range:\n          </h3>\n          <pre className=\"bg-white p-4 rounded-lg border text-sm overflow-x-auto\">\n            {JSON.stringify(dateTimeRange, null, 2)}\n          </pre>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["DateTimePicker","_a","id","label","_b","value","_c","size","onChange","placeholder","error","_d","required","helpText","_e","className","_f","disabled","_g","mode","minDate","maxDate","showWeekNumbers","_j","firstDayOfWeek","__rest","_k","useState","isOpen","setIsOpen","_l","Date","currentMonth","setCurrentMonth","_m","startDate","selectedStartDate","setSelectedStartDate","_o","endDate","selectedEndDate","setSelectedEndDate","_p","time","selectedTime","setSelectedTime","_q","isSelectingEnd","setIsSelectingEnd","_r","showYearMonthPicker","setShowYearMonthPicker","_s","getFullYear","tempYear","setTempYear","_t","getMonth","tempMonth","setTempMonth","dropdownRef","useRef","inputRef","weekDays","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","formatDate","date","toLocaleDateString","year","month","day","formatDateTime","dateStr","concat","getDisplayValue","isSameDay","date1","date2","getDate","navigateMonth","direction","_jsxs","children","htmlFor","_jsx","ref","onClick","sm","md","lg","fill","stroke","viewBox","strokeLinecap","strokeLinejoin","strokeWidth","d","type","e","parseInt","currentYear","years","i","push","generateYears","map","index","_Fragment","ChevronLeft","ChevronRight","firstDay","daysInMonth","startDay","getDay","days","prevDate","isCurrentMonth","remainingDays","length","getDaysInMonth","dayObj","isSelected","isDateSelected","isInRange","checkDate","start","end","isDateInRange","isToday","isStartDate","isEndDate","selectedDate","newValue","__assign","undefined","handleDateClick","handleTimeChange","times","hour","minute","minuteStr","toString","padStart","generateTimeOptions","DateTimePickerDemo","singleDate","setSingleDate","dateTime","setDateTime","dateRange","setDateRange","dateTimeRange","setDateTimeRange","JSON","stringify"],"mappings":"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"}

package/dist/esm/components/Form/Input/Input.mjs

@@ -0,0 +1,2 @@
+import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.mjs";import{jsxs as a,jsx as r}from"react/jsx-runtime";var l=function(l){var i=l.id,o=l.label,c=l.value,n=l.size,s=void 0===n?"md":n,d=l.onChange,m=l.placeholder,p=l.error,x=l.required,h=void 0!==x&&x,b=l.helpText,u=l.type,g=void 0===u?"text":u,v=l.className,y=void 0===v?"":v,f=l.disabled,N=void 0!==f&&f,k=l.icon,w=l.iconPosition,z=void 0===w?"left":w,C=l.rightIcon,j=l.block,q=e(l,["id","label","value","size","onChange","placeholder","error","required","helpText","type","className","disabled","icon","iconPosition","rightIcon","block"]),I={id:i,value:c,onChange:function(e){d&&d(e)},placeholder:m,disabled:N,className:"w-full rounded-[12px] border ".concat({sm:"text-xs px-3 py-1.5 text-sm min-h-[32px]",md:"text-sm px-4 py-2 text-base min-h-[40px]",lg:"text-base px-4 py-3 text-lg min-h-[48px]"}[s]," ").concat(p?"border-red-500":"border-gray-200"," ").concat(N?"bg-gray-100 text-gray-500 placeholder-gray-300":"bg-gray-100 placeholder-gray-400 text-dark"," focus:outline-none focus:ring-1 focus:ring-primary ").concat(y," ").concat(k&&"left"===z?"pl-10":""," ").concat(k&&"right"===z?"pr-10":""),"aria-invalid":!!p,"aria-describedby":p?"".concat(i,"-error"):b?"".concat(i,"-help"):void 0};return a("div",{className:"mb-4 ".concat(j&&"w-full"),children:[o&&a("label",{htmlFor:i,className:"mb-1 block text-sm font-medium text-gray-600",children:[o,h&&r("span",{className:"ml-1 text-red-500",children:"*"})]}),a("div",{className:"relative",children:[k&&"left"===z&&r("div",{className:"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3",children:k}),"textarea"==g?r("textarea",t({},I,{rows:4,className:"".concat(I.className," resize-none")},q)):r("input",t({},I,{type:g},q)),k&&"right"===z&&r("div",{className:"pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3",children:k}),C&&r("div",{className:"absolute right-3 top-1/2 -translate-y-1/2 cursor-pointer",children:C})]}),b&&!p&&r("p",{id:"".concat(i,"-help"),className:"mt-1 text-sm text-gray-500",children:b}),p&&r("p",{id:"".concat(i,"-error"),className:"mt-1 text-sm text-red-500",children:p})]})};export{l as default};
+//# sourceMappingURL=Input.mjs.map