pixelize-design-library 2.1.19 → 2.1.20

package/dist/Components/DatePicker/TimePicker.js

@@ -1,101 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var TimePicker = function (_a) {
-    var date = _a.date, onChange = _a.onChange, dateFormat = _a.dateFormat;
-    var is12HourFormat = /(hh|h).*a/i.test(dateFormat);
-    var _b = (0, react_1.useState)(date.getHours()), hour = _b[0], setHour = _b[1];
-    var _c = (0, react_1.useState)(date.getMinutes()), minute = _c[0], setMinute = _c[1];
-    var _d = (0, react_1.useState)(is12HourFormat ? (date.getHours() >= 12 ? "PM" : "AM") : ""), ampm = _d[0], setAmpm = _d[1];
-    (0, react_1.useEffect)(function () {
-        var newHour = date.getHours();
-        setHour(newHour);
-        setMinute(date.getMinutes());
-        if (is12HourFormat) {
-            setAmpm(newHour >= 12 ? "PM" : "AM");
-        }
-    }, [date, is12HourFormat]);
-    var convertTo24Hour = function (hr, meridiem) {
-        if (meridiem === "AM")
-            return hr === 12 ? 0 : hr;
-        return hr === 12 ? 12 : hr + 12;
-    };
-    var updateTime = function (hrInput, min, meridiem) {
-        var newHour = is12HourFormat ? convertTo24Hour(hrInput, meridiem || ampm) : hrInput;
-        var newDate = new Date(date);
-        newDate.setHours(newHour);
-        newDate.setMinutes(min);
-        newDate.setSeconds(0);
-        newDate.setMilliseconds(0);
-        onChange(newDate);
-    };
-    var handleHourChange = function (e) {
-        var hr = parseInt(e.target.value || "1", 10);
-        if (is12HourFormat) {
-            hr = Math.max(1, Math.min(12, hr));
-            setHour(hr);
-            updateTime(hr, minute, ampm);
-        }
-        else {
-            hr = Math.max(0, Math.min(23, hr));
-            setHour(hr);
-            updateTime(hr, minute);
-        }
-    };
-    var handleMinuteChange = function (e) {
-        var min = parseInt(e.target.value || "0", 10);
-        min = Math.max(0, Math.min(59, min));
-        setMinute(min);
-        updateTime(hour, min, ampm);
-    };
-    var handleAmpmToggle = function () {
-        var newMeridiem = ampm === "AM" ? "PM" : "AM";
-        var displayHr = hour % 12 === 0 ? 12 : hour % 12;
-        var newHr = convertTo24Hour(displayHr, newMeridiem);
-        setAmpm(newMeridiem);
-        setHour(displayHr);
-        updateTime(displayHr, minute, newMeridiem);
-    };
-    var displayHour = is12HourFormat ? (hour % 12 === 0 ? 12 : hour % 12) : hour;
-    return (react_1.default.createElement("div", { style: {
-            display: "flex",
-            alignItems: "center",
-            gap: "0.5rem",
-            fontSize: "1.25rem",
-            marginTop: "1rem",
-        } },
-        react_1.default.createElement("input", { type: "number", value: displayHour, onChange: handleHourChange, min: is12HourFormat ? 1 : 0, max: is12HourFormat ? 12 : 23, style: { width: "3rem", textAlign: "center" } }),
-        ":",
-        react_1.default.createElement("input", { type: "number", value: minute.toString().padStart(2, "0"), onChange: handleMinuteChange, min: 0, max: 59, style: { width: "3rem", textAlign: "center" } }),
-        is12HourFormat && (react_1.default.createElement("button", { type: "button", onClick: handleAmpmToggle, style: {
-                fontWeight: "bold",
-                padding: "0.25rem 0.5rem",
-                border: "none",
-                background: "transparent",
-                cursor: "pointer",
-            } }, ampm))));
-};
-exports.default = TimePicker;

package/dist/Components/Divider/Divider.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const VeritcalDivider: () => React.JSX.Element;
-export default VeritcalDivider;

package/dist/Components/Divider/Divider.js

@@ -1,14 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@chakra-ui/react");
-var useCustomTheme_1 = require("../../Theme/useCustomTheme");
-var VeritcalDivider = function () {
-    var _a;
-    var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
-    return (react_1.default.createElement(react_2.Divider, { orientation: "vertical", height: 5, borderWidth: 1.2, borderColor: (_a = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _a === void 0 ? void 0 : _a[500] }));
-};
-exports.default = VeritcalDivider;

package/dist/Components/Drawer/Drawer.d.ts

@@ -1,12 +0,0 @@
-import React from "react";
-import { DrawerProps } from "./DrawerProps";
-export declare const DrawerHeader: React.FC<{
-    children: React.ReactNode;
-}>;
-export declare const DrawerBody: React.FC<{
-    children: React.ReactNode;
-}>;
-export declare const DrawerFooter: React.FC<{
-    children: React.ReactNode;
-}>;
-export default function Drawer({ isOpen, onClose, placement, size, id, variant, children, }: DrawerProps): React.JSX.Element;

package/dist/Components/Drawer/Drawer.js

@@ -1,40 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = void 0;
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@chakra-ui/react");
-var DrawerHeader = function (_a) {
-    var children = _a.children;
-    return react_1.default.createElement(react_1.default.Fragment, null, children);
-};
-exports.DrawerHeader = DrawerHeader;
-var DrawerBody = function (_a) {
-    var children = _a.children;
-    return react_1.default.createElement(react_1.default.Fragment, null, children);
-};
-exports.DrawerBody = DrawerBody;
-var DrawerFooter = function (_a) {
-    var children = _a.children;
-    return react_1.default.createElement(react_1.default.Fragment, null, children);
-};
-exports.DrawerFooter = DrawerFooter;
-function Drawer(_a) {
-    var isOpen = _a.isOpen, onClose = _a.onClose, _b = _a.placement, placement = _b === void 0 ? "right" : _b, _c = _a.size, size = _c === void 0 ? "xl" : _c, id = _a.id, _d = _a.variant, variant = _d === void 0 ? "solid" : _d, children = _a.children;
-    var isReactElement = function (child) {
-        return child !== null && typeof child === "object" && "type" in child;
-    };
-    var header = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === exports.DrawerHeader; });
-    var body = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === exports.DrawerBody; });
-    var footer = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === exports.DrawerFooter; });
-    return (react_1.default.createElement(react_2.Drawer, { isOpen: isOpen, placement: placement, onClose: onClose, size: size, variant: variant, id: id },
-        react_1.default.createElement(react_2.DrawerOverlay, null),
-        react_1.default.createElement(react_2.DrawerContent, null,
-            react_1.default.createElement(react_2.DrawerCloseButton, null),
-            header && (react_1.default.createElement(react_2.DrawerHeader, { borderBottomWidth: "1px" }, header)),
-            react_1.default.createElement(react_2.DrawerBody, null, body && body),
-            footer && react_1.default.createElement(react_2.DrawerFooter, { borderTopWidth: "1px" }, footer))));
-}
-exports.default = Drawer;

package/dist/Components/Drawer/DrawerProps.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { DrawerProps as ChakraDrawerProps } from "@chakra-ui/react";
-export type DrawerProps = Pick<ChakraDrawerProps, "isOpen" | "onClose" | "placement" | "size" | "id" | "variant"> & {
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | "full";
-    placement?: "top" | "right" | "bottom" | "left";
-    vaiant?: "solid" | "outline" | "ghost" | "link";
-    children?: React.ReactNode;
-};

package/dist/Components/Drawer/DrawerProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/Dropdown/DropDown.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { DropdownProps } from "./DropdownProps";
-declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
-export default Dropdown;

package/dist/Components/Dropdown/DropDown.js

@@ -1,97 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var framer_motion_1 = require("framer-motion");
-var useCustomTheme_1 = require("../../Theme/useCustomTheme");
-var lucide_react_1 = require("lucide-react");
-var MotionBox = (0, framer_motion_1.motion)((0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(react_2.Box, __assign({ ref: ref }, props))); }));
-var Dropdown = (0, react_1.forwardRef)(function (_a, ref) {
-    var dropDownButtonStyle = _a.dropDownButtonStyle, ButtonText = _a.ButtonText, options = _a.options, handleOptionSelect = _a.handleOptionSelect, _b = _a.dropdownType, dropdownType = _b === void 0 ? "button" : _b, text = _a.text, DropdownIcon = _a.DropdownIcon, _c = _a.isVisibleIconShow, isVisibleIconShow = _c === void 0 ? true : _c, buttonProps = _a.buttonProps, headStyle = _a.headStyle, ListStyle = _a.ListStyle, ItemStyle = _a.ItemStyle, LabelStyle = _a.LabelStyle, ImageStyle = _a.ImageStyle, _d = _a.optionsSize, optionsSize = _d === void 0 ? "lg" : _d, _e = _a.divider, divider = _e === void 0 ? false : _e;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var _f = (0, react_2.useDisclosure)(), isOpen = _f.isOpen, onToggle = _f.onToggle, onClose = _f.onClose;
-    var dropdownRef = (0, react_1.useRef)(null);
-    var handleListItemClick = function (optionId, optionLabel) {
-        onClose();
-        handleOptionSelect(optionId, optionLabel);
-    };
-    (0, react_1.useEffect)(function () {
-        var handleClickOutside = function (event) {
-            if (dropdownRef.current &&
-                !dropdownRef.current.contains(event.target)) {
-                onClose();
-            }
-        };
-        document.addEventListener("mousedown", handleClickOutside);
-        return function () {
-            document.removeEventListener("mousedown", handleClickOutside);
-        };
-    }, [dropdownRef, onClose]);
-    var dropDownToggleOption = function () {
-        var ButtonToggle = (react_1.default.createElement(react_2.Button, __assign({ onClick: onToggle, style: __assign({ backgroundColor: theme.colors.primary[500] }, dropDownButtonStyle), rightIcon: isVisibleIconShow ? (react_1.default.createElement(react_2.Icon, { as: lucide_react_1.ChevronDown, transform: isOpen ? "rotate(180deg)" : "rotate(0deg)" })) : undefined }, buttonProps),
-            DropdownIcon,
-            " \u00A0 ",
-            ButtonText));
-        var TextToggle = (react_1.default.createElement(react_2.Flex, { onClick: onToggle, align: "center", style: dropDownButtonStyle, cursor: "pointer" },
-            DropdownIcon,
-            " ",
-            text,
-            isVisibleIconShow && react_1.default.createElement(react_2.Icon, { as: lucide_react_1.ChevronDown })));
-        return dropdownType === "button" ? ButtonToggle : TextToggle;
-    };
-    var DropdownContentRender = function () {
-        var _a, _b, _c;
-        return (react_1.default.createElement(react_2.List, { bg: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.backgroundColor) === null || _b === void 0 ? void 0 : _b.light, border: "1px solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]), borderRadius: theme.radii.md, shadow: theme.shadows.lg, py: 2, mt: "0.2rem", minWidth: "200px", style: ListStyle }, options.map(function (option) {
-            var _a;
-            return (react_1.default.createElement(react_2.ListItem, { key: option.id, onClick: function () { return handleListItemClick(option.id, option.label); }, p: optionsSize === "sm" ? 1 : 2, px: 2, _hover: {
-                    bg: theme.colors.gray[100],
-                    color: theme.colors.blue[500],
-                }, display: "flex", alignItems: "center", cursor: "pointer", style: ItemStyle, borderBottom: divider ? "1px solid ".concat((_a = theme.colors) === null || _a === void 0 ? void 0 : _a.gray[300]) : undefined, sx: {
-                    "&:last-child": {
-                        borderBottom: "none",
-                    },
-                } },
-                (option === null || option === void 0 ? void 0 : option.image) && (react_1.default.createElement(react_2.Icon, { as: option.image, boxSize: optionsSize === "sm" ? "1.1rem" : "1.5rem", mr: 2, style: ImageStyle })),
-                react_1.default.createElement(react_2.Box, { as: "span", fontSize: optionsSize === "sm" ? "14px" : "16px", isTruncated: true, style: LabelStyle }, option.label)));
-        })));
-    };
-    return (react_1.default.createElement(react_2.Box, { ref: dropdownRef, position: "relative", display: "inline-block" },
-        dropDownToggleOption(),
-        isOpen && (react_1.default.createElement(MotionBox, { ref: ref, position: "absolute", zIndex: 5, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, style: headStyle }, DropdownContentRender()))));
-});
-Dropdown.displayName = "Dropdown";
-exports.default = Dropdown;

package/dist/Components/Dropdown/DropdownProps.d.ts

@@ -1,26 +0,0 @@
-/// <reference types="react" />
-import { ButtonProps } from "@chakra-ui/react";
-export type DropdownProps = {
-    ButtonText?: string;
-    options: Option[];
-    handleOptionSelect: (id: string | number, label: string) => void;
-    dropdownType?: "button" | "text";
-    text?: string;
-    DropdownIcon?: JSX.Element;
-    dropDownButtonStyle?: React.CSSProperties;
-    isVisibleIconShow?: boolean;
-    buttonProps?: ButtonProps;
-    headStyle?: React.CSSProperties;
-    ListStyle?: React.CSSProperties;
-    ItemStyle?: React.CSSProperties;
-    LabelStyle?: React.CSSProperties;
-    ImageStyle?: React.CSSProperties;
-    optionsSize?: "sm" | "md";
-    divider?: boolean;
-};
-type Option = {
-    id: string | number;
-    label: string;
-    image?: React.ElementType;
-};
-export {};

package/dist/Components/Dropdown/DropdownProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/Editor/Editor.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { EditorProps } from "./EditorProps";
-export default function Editor({ value, config, editorRef, className, onChange, onBlur, }: EditorProps): React.JSX.Element;

package/dist/Components/Editor/Editor.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var jodit_react_1 = __importDefault(require("jodit-react"));
-function Editor(_a) {
-    var value = _a.value, config = _a.config, editorRef = _a.editorRef, className = _a.className, onChange = _a.onChange, onBlur = _a.onBlur;
-    return (react_1.default.createElement(jodit_react_1.default, { config: config, value: value, ref: editorRef, className: className, onChange: onChange, onBlur: onBlur }));
-}
-exports.default = Editor;

package/dist/Components/Editor/EditorProps.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { IJoditEditorProps } from "jodit-react";
-export type EditorProps = Pick<IJoditEditorProps, "value" | "config" | "className" | "onChange" | "onBlur"> & {
-    editorRef?: React.RefObject<any>;
-};

package/dist/Components/Editor/EditorProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { VerifyEmailOtpProps } from "./VerifyEmailOtpProps";
-export default function VerifyEmailOtp({ resendMail, onChange, onComplete, placeholder, pins, description, title, isDisabled, isInvalid, styles, }: VerifyEmailOtpProps): React.JSX.Element;

package/dist/Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp.js

@@ -1,44 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@chakra-ui/react");
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var lucide_react_1 = require("lucide-react");
-function VerifyEmailOtp(_a) {
-    var resendMail = _a.resendMail, onChange = _a.onChange, onComplete = _a.onComplete, _b = _a.placeholder, placeholder = _b === void 0 ? "" : _b, _c = _a.pins, pins = _c === void 0 ? 5 : _c, description = _a.description, title = _a.title, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isInvalid, isInvalid = _e === void 0 ? false : _e, styles = _a.styles;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    return (react_1.default.createElement("div", { style: styles },
-        react_1.default.createElement("div", { style: {
-                display: "flex",
-                flexDirection: "column",
-                alignItems: "center",
-                justifyContent: "center",
-                padding: "3%",
-            } },
-            react_1.default.createElement("div", { style: { padding: "3%" } },
-                react_1.default.createElement(lucide_react_1.MailCheck, { size: "100", color: theme.colors.primary[500] })),
-            react_1.default.createElement("h1", { style: { fontSize: "2rem", fontWeight: "bold", marginBottom: "2%" } }, title),
-            react_1.default.createElement("p", { style: { textAlign: "center", marginBottom: "2%" } },
-                description,
-                react_1.default.createElement("br", null),
-                " your new Pixel Account"),
-            react_1.default.createElement("div", { style: { marginBottom: "2%" } },
-                react_1.default.createElement(react_2.HStack, null,
-                    react_1.default.createElement(react_2.PinInput, { placeholder: placeholder, onChange: onChange, onComplete: onComplete, isDisabled: isDisabled, isInvalid: isInvalid }, Array.from({ length: pins }).map(function (_, index) { return (react_1.default.createElement(react_2.PinInputField, { key: index })); })))),
-            react_1.default.createElement("p", { style: { textAlign: "center", marginBottom: "2%" } },
-                "Didn't receive the code?",
-                " ",
-                react_1.default.createElement("button", { onClick: function () { return resendMail(); }, style: {
-                        background: "none",
-                        color: theme.colors.primary[700],
-                        border: "none",
-                        padding: "0",
-                        font: "inherit",
-                        cursor: "pointer",
-                        outline: "inherit",
-                    } }, "Resend Code")))));
-}
-exports.default = VerifyEmailOtp;

package/dist/Components/EmailCards/VerifyEmailOtp/VerifyEmailOtpProps.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-export type VerifyEmailOtpProps = {
-    resendMail: () => void;
-    onChange: (value: string) => void;
-    onComplete: (value: string) => void;
-    placeholder?: string;
-    pins: number;
-    title: string;
-    description: string;
-    isDisabled?: boolean;
-    isInvalid?: boolean;
-    styles?: React.CSSProperties;
-};

package/dist/Components/EmailCards/VerifyEmailOtp/VerifyEmailOtpProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/FileUpload/FileUpload.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { FileUploaderProps } from "./FileUploadProps";
-declare const FileUpload: React.FC<FileUploaderProps>;
-export default FileUpload;

package/dist/Components/FileUpload/FileUpload.js

@@ -1,156 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var react_dropzone_1 = require("react-dropzone");
-var lucide_react_1 = require("lucide-react");
-var useCustomTheme_1 = require("../../Theme/useCustomTheme");
-var constants_1 = require("./constants");
-var Modal_1 = __importStar(require("../Modal/Modal"));
-var FileUpload = function (_a) {
-    var _b, _c, _d, _e;
-    var onFilesUploaded = _a.onFilesUploaded, uploadedFiles = _a.uploadedFiles, onRemoveFile = _a.onRemoveFile, _f = _a.acceptTypes, acceptTypes = _f === void 0 ? [".jpg", ".png"] : _f, _g = _a.maxSizeKB, maxSizeKB = _g === void 0 ? 5 : _g, _h = _a.maxFiles, maxFiles = _h === void 0 ? undefined : _h, _j = _a.progress, progress = _j === void 0 ? {} : _j;
-    var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
-    var _k = (0, react_2.useDisclosure)(), isOpen = _k.isOpen, onOpen = _k.onOpen, onClose = _k.onClose;
-    var _l = react_1.default.useState(null), previewUrl = _l[0], setPreviewUrl = _l[1];
-    var _m = react_1.default.useState(null), previewTitle = _m[0], setPreviewTitle = _m[1];
-    var _o = react_1.default.useState([]), errors = _o[0], setErrors = _o[1];
-    var bg = (_b = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _b === void 0 ? void 0 : _b[50];
-    var border = (_c = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _c === void 0 ? void 0 : _c[300];
-    var mappedAccept = acceptTypes.reduce(function (acc, ext) {
-        var mime = constants_1.mimeMap[ext];
-        if (mime) {
-            acc[mime] = []; // File dropzone format
-        }
-        return acc;
-    }, {});
-    var onDrop = (0, react_1.useCallback)(function (acceptedFiles) {
-        setErrors([]);
-        var totalFiles = uploadedFiles.length + acceptedFiles.length;
-        if (maxFiles && totalFiles > maxFiles) {
-            setErrors([
-                "Maximum ".concat(maxFiles, " files allowed. You already uploaded ").concat(uploadedFiles.length, "."),
-            ]);
-            return;
-        }
-        onFilesUploaded(acceptedFiles);
-    }, [onFilesUploaded, uploadedFiles, maxFiles]);
-    var _p = (0, react_dropzone_1.useDropzone)({
-        onDrop: onDrop,
-        accept: mappedAccept,
-        maxSize: maxSizeKB * 1024,
-        maxFiles: maxFiles,
-        onDropRejected: function (rejectedFiles) {
-            var messages = rejectedFiles.flatMap(function (rejected) {
-                return rejected.errors.map(function (err) {
-                    if (err.code === "file-too-large") {
-                        return "File \"".concat(rejected.file.name, "\" is too large. Max size is ").concat((0, constants_1.toMB)(maxSizeKB), ".");
-                    }
-                    else if (err.code === "file-invalid-type") {
-                        return "File \"".concat(rejected.file.name, "\" is not an accepted file type.");
-                    }
-                    else {
-                        return "File \"".concat(rejected.file.name, "\" was rejected: ").concat(err.message);
-                    }
-                });
-            });
-            setErrors(messages);
-        },
-    }), getRootProps = _p.getRootProps, getInputProps = _p.getInputProps;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(react_2.VStack, { spacing: 4, align: "stretch" },
-            react_1.default.createElement(react_2.Box, __assign({}, getRootProps(), { border: "2px dashed", borderColor: border, borderRadius: "md", p: 10, textAlign: "center", bg: bg, cursor: "pointer", transition: "all 0.2s", _hover: { bg: (_d = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _d === void 0 ? void 0 : _d[100] }, position: "relative" }),
-                react_1.default.createElement("input", __assign({}, getInputProps())),
-                react_1.default.createElement(react_2.VStack, { spacing: 2 },
-                    react_1.default.createElement(react_2.Icon, { as: lucide_react_1.Upload, boxSize: 6 }),
-                    react_1.default.createElement(react_2.Text, { fontWeight: "medium" }, "Drag and drop files here"),
-                    react_1.default.createElement(react_2.Text, { fontSize: "sm", color: (_e = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _e === void 0 ? void 0 : _e[500] },
-                        acceptTypes.join(", "),
-                        " up to ",
-                        (0, constants_1.toMB)(maxSizeKB),
-                        " ",
-                        maxFiles ? "- ".concat(maxFiles, " file(s) max") : ""))),
-            errors.length > 0 && (react_1.default.createElement(react_2.Box, null, errors.map(function (err, idx) {
-                var _a;
-                return (react_1.default.createElement(react_2.Text, { key: idx, fontSize: "sm", color: (_a = colors === null || colors === void 0 ? void 0 : colors.red) === null || _a === void 0 ? void 0 : _a[600] }, err));
-            }))),
-            uploadedFiles.length > 0 && (react_1.default.createElement(react_2.Box, null,
-                react_1.default.createElement(react_2.Box, { display: "flex", alignItems: "center", gap: 2 },
-                    react_1.default.createElement(react_2.Text, { fontFamily: "open-sans, sans-serif", fontWeight: 600, fontSize: 14, lineHeight: "100%", letterSpacing: "4%", textTransform: "uppercase", py: 4 }, "Uploaded Files")),
-                react_1.default.createElement(react_2.List, { spacing: 2 }, uploadedFiles.map(function (file, index) {
-                    var _a, _b, _c, _d, _e, _f;
-                    return (react_1.default.createElement(react_2.Box, { key: index, borderWidth: "0.063rem", borderRadius: "md", px: 3, py: 2, bg: colors === null || colors === void 0 ? void 0 : colors.white },
-                        react_1.default.createElement(react_2.ListItem, { display: "flex", justifyContent: "space-between", alignItems: "center" },
-                            react_1.default.createElement(react_2.HStack, { spacing: 3, flex: "1" },
-                                file.type.startsWith("image/") ? (react_1.default.createElement(react_2.Box, { boxSize: "2.5rem", cursor: "pointer", position: "relative", _hover: {
-                                        ".hover-icon": {
-                                            opacity: 1,
-                                            bg: (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.secondary) === null || _a === void 0 ? void 0 : _a.opacity) === null || _b === void 0 ? void 0 : _b[16],
-                                        },
-                                    }, onClick: function () {
-                                        setPreviewUrl(URL.createObjectURL(file));
-                                        setPreviewTitle(file.name);
-                                        onOpen();
-                                    } },
-                                    react_1.default.createElement("img", { src: URL.createObjectURL(file), alt: file.name, style: {
-                                            width: "100%",
-                                            height: "100%",
-                                            objectFit: "cover",
-                                            borderRadius: "0.25rem",
-                                        } }),
-                                    react_1.default.createElement(react_2.Box, { className: "hover-icon", position: "absolute", top: "0.5rem", left: "0.5rem", opacity: 0 },
-                                        react_1.default.createElement(lucide_react_1.Eye, { color: (_c = colors === null || colors === void 0 ? void 0 : colors.background) === null || _c === void 0 ? void 0 : _c[100] })))) : (react_1.default.createElement(react_2.ListIcon, { as: lucide_react_1.FileText, color: (_d = colors === null || colors === void 0 ? void 0 : colors.blue) === null || _d === void 0 ? void 0 : _d[500], boxSize: 8 })),
-                                react_1.default.createElement(react_2.VStack, { align: "start", spacing: 0, flex: "1" },
-                                    react_1.default.createElement(react_2.Text, { fontSize: "sm", noOfLines: 1 }, file.name),
-                                    react_1.default.createElement(react_2.Text, { fontSize: "xs", color: (_e = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _e === void 0 ? void 0 : _e[500] },
-                                        (0, constants_1.toMB)(file.size / 1024),
-                                        " \u2022",
-                                        " ",
-                                        file.type || "Unknown type"))),
-                            onRemoveFile && (react_1.default.createElement(react_2.CloseButton, { onClick: function () { return onRemoveFile(file); }, size: "sm", color: (_f = colors === null || colors === void 0 ? void 0 : colors.red) === null || _f === void 0 ? void 0 : _f[600] }))),
-                        (progress === null || progress === void 0 ? void 0 : progress[file.name]) !== undefined && (react_1.default.createElement(react_2.Progress, { value: progress === null || progress === void 0 ? void 0 : progress[file.name], size: "xs", mt: 1, hasStripe: (progress === null || progress === void 0 ? void 0 : progress[file.name]) < 100, isAnimated: (progress === null || progress === void 0 ? void 0 : progress[file.name]) < 100, colorScheme: (progress === null || progress === void 0 ? void 0 : progress[file.name]) >= 100 ? "green" : "blue", borderRadius: 5 }))));
-                }))))),
-        react_1.default.createElement(Modal_1.default, { isOpen: isOpen, onClose: function () {
-                onClose();
-                setPreviewUrl(null);
-                setPreviewTitle(null);
-            }, size: "xl", isCentered: true },
-            react_1.default.createElement(Modal_1.ModalHeader, null,
-                react_1.default.createElement(react_2.Text, { fontFamily: "open-sans, sans-serif", fontWeight: 600, fontSize: 16, textTransform: "uppercase" }, previewTitle)),
-            react_1.default.createElement(Modal_1.ModalBody, null, previewUrl && (react_1.default.createElement(react_2.Image, { src: previewUrl, alt: "Preview", w: "100%", h: "auto", objectFit: "contain" }))))));
-};
-exports.default = FileUpload;

package/dist/Components/FileUpload/FileUploadProps.d.ts

@@ -1,11 +0,0 @@
-export type MimeExtension = '.jpg' | '.jpeg' | '.png' | '.gif' | '.webp' | '.svg' | '.pdf' | '.doc' | '.docx' | '.xls' | '.xlsx' | '.ppt' | '.pptx' | '.txt' | '.mp4' | '.mov' | '.mp3' | '.wav' | '.zip' | '.rar' | '.7z';
-export type MimeMap = Record<MimeExtension, string>;
-export type FileUploaderProps = {
-    onFilesUploaded: (files: File[]) => void;
-    uploadedFiles: File[];
-    onRemoveFile?: (file: File) => void;
-    acceptTypes?: MimeExtension[];
-    maxSizeKB?: number;
-    maxFiles?: number;
-    progress?: Record<string, number>;
-};

package/dist/Components/FileUpload/FileUploadProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/FileUpload/constants.d.ts

@@ -1,3 +0,0 @@
-import { MimeMap } from "./FileUploadProps";
-export declare const mimeMap: MimeMap;
-export declare const toMB: (size: number) => string;