pixelize-design-library 2.1.18 → 2.1.20

package/dist/Components/NoteTextArea/NoteTextArea.js

@@ -1,274 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var react_2 = require("@chakra-ui/react");
-var useCustomTheme_1 = require("../../Theme/useCustomTheme");
-var lucide_react_1 = require("lucide-react");
-var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: ", ";\n  border-radius: 5px;\n  box-shadow: ", ";\n"], ["\n  border: ", ";\n  border-radius: 5px;\n  box-shadow: ", ";\n"])), function (_a) {
-    var isActive = _a.isActive;
-    return isActive ? "1px solid #3182ce" : "1px solid #c0c6cc";
-}, function (_a) {
-    var isActive = _a.isActive;
-    return isActive
-        ? "-1px 1px 8px 4px rgb(49 130 206 / 24%), 0px 2px 6px 0 rgb(49 130 206 / 19%)"
-        : "none";
-});
-var TextAreaContainer = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  cursor: text;\n  padding: 12px 15px;\n  display: ", ";\n"], ["\n  width: 100%;\n  cursor: text;\n  padding: 12px 15px;\n  display: ", ";\n"])), function (_a) {
-    var isActive = _a.isActive;
-    return (isActive ? "block" : "none");
-});
-var PlaceholderText = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: #c0c6cc;\n  width: 100%;\n  cursor: text;\n  display: ", ";\n  padding: 12px 15px;\n"], ["\n  color: #c0c6cc;\n  width: 100%;\n  cursor: text;\n  display: ", ";\n  padding: 12px 15px;\n"])), function (_a) {
-    var isActive = _a.isActive;
-    return (isActive ? "block" : "none");
-});
-var InputTitle = styled_1.default.input(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  width: 100%;\n  height: auto;\n  border: none;\n  outline: none;\n  background: none;\n  color: black;\n  fontsize: 1rem;\n  fontweight: 500;\n  marginbottom: 2px;\n"], ["\n  width: 100%;\n  height: auto;\n  border: none;\n  outline: none;\n  background: none;\n  color: black;\n  fontsize: 1rem;\n  fontweight: 500;\n  marginbottom: 2px;\n"])));
-var NotesTextArea = styled_1.default.textarea(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  color: ", ";\n  width: 100%;\n  height: auto;\n  border: none;\n  outline: none;\n  background: none;\n  fontweight: 300;\n"], ["\n  color: ", ";\n  width: 100%;\n  height: auto;\n  border: none;\n  outline: none;\n  background: none;\n  fontweight: 300;\n"])), function (_a) {
-    var isActive = _a.isActive, noteValue = _a.noteValue;
-    return isActive && noteValue ? "#000000" : "#c0c6cc";
-});
-var FileUploadLabel = styled_1.default.label(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  cursor: pointer;\n"], ["\n  cursor: pointer;\n"])));
-var AddTitleButton = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  color: #616e88;\n  cursor: pointer;\n  fontsize: 0.8rem;\n"], ["\n  color: #616e88;\n  cursor: pointer;\n  fontsize: 0.8rem;\n"])));
-var Button = styled_1.default.button(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  border: none;\n  padding: 3px 15px;\n  text-align: center;\n  text-decoration: none;\n  background: ", ";\n  color: ", ";\n  font-size: 1rem;\n  margin-right: 5px;\n  border-radius: 5px;\n  opacity: ", ";\n  cursor: ", ";\n  pointer-events: ", ";\n"], ["\n  border: none;\n  padding: 3px 15px;\n  text-align: center;\n  text-decoration: none;\n  background: ", ";\n  color: ", ";\n  font-size: 1rem;\n  margin-right: 5px;\n  border-radius: 5px;\n  opacity: ", ";\n  cursor: ", ";\n  pointer-events: ", ";\n"])), function (_a) {
-    var isSaveButton = _a.isSaveButton, noteValue = _a.noteValue, isLoading = _a.isLoading, theme = _a.theme;
-    return isSaveButton
-        ? noteValue && !isLoading
-            ? theme.colors.primary[500]
-            : theme.colors.primary[500]
-        : "white";
-}, function (_a) {
-    var isSaveButton = _a.isSaveButton, isLoading = _a.isLoading;
-    return isSaveButton && !isLoading ? "white" : "white";
-}, function (_a) {
-    var isSaveButton = _a.isSaveButton, noteValue = _a.noteValue, isLoading = _a.isLoading, disabled = _a.disabled;
-    return isSaveButton && (!noteValue || isLoading || disabled) ? "0.5" : "1";
-}, function (_a) {
-    var isSaveButton = _a.isSaveButton, noteValue = _a.noteValue, isLoading = _a.isLoading, disabled = _a.disabled;
-    return isSaveButton && (!noteValue || isLoading || disabled)
-        ? "initial"
-        : "pointer";
-}, function (_a) {
-    var isLoading = _a.isLoading;
-    return (isLoading ? "none" : "auto");
-});
-var CancelButton = styled_1.default.button(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  border: none;\n  color: #5e5c5c;\n  padding: 3px 15px;\n  text-align: center;\n  text-decoration: none;\n  background: white;\n  font-size: 1rem;\n  margin-right: 5px;\n  border-radius: 5px;\n"], ["\n  border: none;\n  color: #5e5c5c;\n  padding: 3px 15px;\n  text-align: center;\n  text-decoration: none;\n  background: white;\n  font-size: 1rem;\n  margin-right: 5px;\n  border-radius: 5px;\n"])));
-var FileViewer = styled_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 300px;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 300px;\n"])));
-var FileEdit = (0, styled_1.default)(lucide_react_1.X)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  cursor: pointer;\n  color: #ff0000;\n"], ["\n  cursor: pointer;\n  color: #ff0000;\n"])));
-var ErrorText = styled_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  color: #ff0000;\n  font-size: 0.8rem;\n  margin-top: 8px;\n"], ["\n  color: #ff0000;\n  font-size: 0.8rem;\n  margin-top: 8px;\n"])));
-var countWords = function (text) {
-    return text.trim().split(/\s+/).length;
-};
-function NoteTextArea(_a) {
-    var _b = _a.width, width = _b === void 0 ? "100%" : _b, handleSubmit = _a.handleSubmit, handleCancel = _a.handleCancel, value = _a.value, title = _a.title, file = _a.file, _c = _a.isEditable, isEditable = _c === void 0 ? false : _c, saveButtonLoading = _a.saveButtonLoading, _d = _a.maxFileSize, maxFileSize = _d === void 0 ? 1 * 1024 * 1024 : _d, _e = _a.maxFilesSizeError, maxFilesSizeError = _e === void 0 ? "Some files are too large. Maximum allowed size is" : _e, _f = _a.maxNoteWordCount, maxNoteWordCount = _f === void 0 ? 15 : _f, onChange = _a.onChange, ref = _a.ref;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var noteAreaRef = (0, react_1.useRef)(null);
-    var _g = (0, react_1.useState)(false), isActive = _g[0], setIsActive = _g[1];
-    var _h = (0, react_1.useState)(""), noteValue = _h[0], setNoteValue = _h[1];
-    var _j = (0, react_1.useState)(""), titleValue = _j[0], setTitleValue = _j[1];
-    var _k = (0, react_1.useState)(false), titleShow = _k[0], setTitleShow = _k[1];
-    var _l = (0, react_1.useState)([]), files = _l[0], setFiles = _l[1];
-    var _m = (0, react_1.useState)(""), fileError = _m[0], setFileError = _m[1];
-    var _o = (0, react_1.useState)(false), isSaveDisabled = _o[0], setIsSaveDisabled = _o[1];
-    (0, react_1.useEffect)(function () {
-        var titleWordCount = countWords(titleValue);
-        setIsSaveDisabled(titleWordCount > maxNoteWordCount);
-    }, [titleValue, maxNoteWordCount]);
-    (0, react_1.useEffect)(function () {
-        var noteWordCount = countWords(noteValue);
-        setIsSaveDisabled(noteWordCount > maxNoteWordCount);
-    }, [noteValue, maxNoteWordCount]);
-    (0, react_1.useEffect)(function () {
-        if (isEditable) {
-            setIsActive(true);
-            if (value) {
-                setNoteValue(value);
-            }
-            if (title) {
-                setTitleValue(title);
-                setTitleShow(true);
-            }
-            if (file) {
-                setFiles(file);
-            }
-        }
-    }, [value, title, file, isEditable]);
-    (0, react_1.useEffect)(function () {
-        if (!saveButtonLoading) {
-            setIsActive(false);
-            if (!isEditable) {
-                setNoteValue("");
-                setTitleValue("");
-                setTitleShow(false);
-                setFiles([]);
-            }
-        }
-        if (isEditable) {
-            setIsActive(true);
-        }
-    }, [saveButtonLoading, isEditable]);
-    var handleTextArea = function () {
-        setIsActive(true);
-        if (!isEditable) {
-            setNoteValue("");
-            setTitleValue("");
-            setTitleShow(false);
-            setFiles([]);
-        }
-    };
-    var handleCloseTextArea = function () {
-        setIsActive(false);
-        if (handleCancel) {
-            handleCancel(!isActive);
-        }
-        if (!isEditable) {
-            setNoteValue("");
-            setTitleValue("");
-            setTitleShow(false);
-            setFiles([]);
-        }
-        setFileError("");
-    };
-    var handleNoteChange = function (event) {
-        setNoteValue(event.target.value);
-        onChange === null || onChange === void 0 ? void 0 : onChange(event.target.value);
-        adjustHeight();
-    };
-    (0, react_1.useEffect)(function () {
-        if (isActive && noteAreaRef.current) {
-            noteAreaRef.current.focus();
-        }
-    }, [isActive]);
-    var adjustHeight = function () {
-        var textarea = noteAreaRef.current;
-        if (!textarea)
-            return;
-        textarea.style.height = "auto";
-        textarea.style.height = "".concat(textarea.scrollHeight, "px");
-    };
-    var handleSetTitle = function () {
-        setTitleShow(true);
-    };
-    var handleTitleChange = function (event) {
-        event.target.value.length === 0 && setTitleShow(false);
-        setTitleValue(event.target.value);
-    };
-    var formatBytes = function (bytes, decimals) {
-        if (decimals === void 0) { decimals = 2; }
-        if (bytes === 0)
-            return "0 Bytes";
-        var k = 1024;
-        var dm = decimals < 0 ? 0 : decimals;
-        var sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
-        var i = Math.floor(Math.log(bytes) / Math.log(k));
-        return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
-    };
-    var shortenFileName = function (name, maxLength) {
-        if (maxLength === void 0) { maxLength = 20; }
-        var extension = name.substring(name.lastIndexOf("."));
-        if (name.length <= maxLength)
-            return name;
-        var nameWithoutExtension = name.replace(extension, "");
-        var start = nameWithoutExtension.substring(0, maxLength - extension.length - 3);
-        return "".concat(start, "...").concat(extension, " ");
-    };
-    return (react_1.default.createElement(Container, { style: { width: width }, isActive: isActive },
-        react_1.default.createElement(PlaceholderText, { isActive: !isActive, onClick: handleTextArea },
-            react_1.default.createElement("span", null, "Add a note...")),
-        react_1.default.createElement(TextAreaContainer, { isActive: isActive },
-            titleShow && (react_1.default.createElement(InputTitle, { value: titleValue, onChange: handleTitleChange, placeholder: "Add a title...", ref: ref })),
-            react_1.default.createElement(NotesTextArea, { ref: noteAreaRef, isActive: isActive, noteValue: noteValue, value: noteValue, onChange: handleNoteChange, placeholder: "Add a note..." })),
-        isActive && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("hr", { style: { margin: 0 } }),
-            react_1.default.createElement("div", { style: { padding: "12px 15px" } },
-                react_1.default.createElement("div", { style: { display: "flex", alignItems: "center" } },
-                    react_1.default.createElement(FileUploadLabel, { htmlFor: "file-upload" },
-                        react_1.default.createElement(lucide_react_1.Paperclip, { size: 17 }),
-                        react_1.default.createElement("input", { id: "file-upload", type: "file", style: { display: "none" }, onChange: function (e) {
-                                var newFiles = Array.from(e.target.files || []);
-                                var validFiles = newFiles.filter(function (file) { return file.size <= maxFileSize; });
-                                var invalidFiles = newFiles.filter(function (file) { return file.size > maxFileSize; });
-                                if (invalidFiles.length > 0) {
-                                    setFileError("".concat(maxFilesSizeError, " ").concat(formatBytes(maxFileSize), "."));
-                                }
-                                else {
-                                    setFileError("");
-                                }
-                                if (validFiles.length > 0) {
-                                    setFiles(function (prevFiles) { return __spreadArray(__spreadArray([], prevFiles, true), validFiles, true); });
-                                }
-                            }, multiple: true })),
-                    !titleShow && (react_1.default.createElement(react_1.default.Fragment, null,
-                        react_1.default.createElement("div", { style: {
-                                height: "15px",
-                                width: "1px",
-                                backgroundColor: "#c0c6cc",
-                                marginRight: "5px",
-                                marginLeft: "5px",
-                            } }),
-                        react_1.default.createElement(AddTitleButton, { onClick: handleSetTitle }, "Add a Title"))),
-                    react_1.default.createElement("div", { style: { marginLeft: "auto" } },
-                        react_1.default.createElement(CancelButton, { onClick: handleCloseTextArea }, "Cancel"),
-                        react_1.default.createElement(Button, { isSaveButton: true, noteValue: noteValue, isLoading: saveButtonLoading, disabled: !noteValue || isSaveDisabled, theme: theme, onClick: function () {
-                                handleSubmit(noteValue, titleValue, files);
-                                // handleCloseTextArea();
-                            } },
-                            saveButtonLoading && (react_1.default.createElement("span", { style: { marginRight: "6px" } },
-                                react_1.default.createElement(react_2.Spinner, { thickness: "2px", speed: "0.75s", emptyColor: "gray.200", color: "blue.500", size: "xs" }))),
-                            "Save"))),
-                react_1.default.createElement("div", { style: { display: "flex", gap: "10px" } },
-                    react_1.default.createElement("div", null, "Note:"),
-                    react_1.default.createElement("div", null,
-                        "You can add up to ",
-                        maxNoteWordCount,
-                        " words only")),
-                fileError && react_1.default.createElement(ErrorText, null, fileError),
-                " ",
-                files.length > 0 && (react_1.default.createElement("div", null, files.map(function (item, index) { return (react_1.default.createElement(FileViewer, { key: index },
-                    react_1.default.createElement(react_1.default.Fragment, null,
-                        react_1.default.createElement("span", null, shortenFileName(item.name)),
-                        react_1.default.createElement("span", null, formatBytes(item.size))),
-                    react_1.default.createElement(FileEdit, { onClick: function () {
-                            return setFiles(files.filter(function (fileItem) { return fileItem !== item; }));
-                        } }))); }))))))));
-}
-exports.default = NoteTextArea;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12;

package/dist/Components/NoteTextArea/NoteTextAreaProps.d.ts

@@ -1,16 +0,0 @@
-import { LegacyRef } from "react";
-export type NoteTextAreaProps = {
-    width: number | string;
-    handleSubmit: (noteValue: string, titleValue: string, file: File[], resetState: void) => void;
-    value?: string;
-    title?: string;
-    file?: File[];
-    isEditable?: boolean;
-    handleCancel?: (isActive: boolean) => void;
-    saveButtonLoading: boolean;
-    maxFileSize?: number;
-    maxFilesSizeError?: string;
-    maxNoteWordCount?: number;
-    onChange?: (value: string) => void;
-    ref?: LegacyRef<HTMLInputElement>;
-};

package/dist/Components/NoteTextArea/NoteTextAreaProps.js

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

package/dist/Components/NumberInput/NumberInput.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { NumberInputProps } from "./NumberInputProps";
-export default function NumberInput({ defaultValue, min, max, precision, step, clampValueOnBlur, keepWithinRange, value, onChange, size, maxW, allowMouseWheel, NumberIncrementStepperBg, NumberIncrementStepperActive, NumberIncrementStepperChildren, NumberDecrementStepperBg, NumberDecrementStepperChildren, NumberDecrementStepperActive, }: NumberInputProps): React.JSX.Element;

package/dist/Components/NumberInput/NumberInput.js

@@ -1,16 +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");
-function NumberInput(_a) {
-    var defaultValue = _a.defaultValue, min = _a.min, max = _a.max, precision = _a.precision, step = _a.step, clampValueOnBlur = _a.clampValueOnBlur, keepWithinRange = _a.keepWithinRange, value = _a.value, onChange = _a.onChange, size = _a.size, maxW = _a.maxW, allowMouseWheel = _a.allowMouseWheel, NumberIncrementStepperBg = _a.NumberIncrementStepperBg, NumberIncrementStepperActive = _a.NumberIncrementStepperActive, NumberIncrementStepperChildren = _a.NumberIncrementStepperChildren, NumberDecrementStepperBg = _a.NumberDecrementStepperBg, NumberDecrementStepperChildren = _a.NumberDecrementStepperChildren, NumberDecrementStepperActive = _a.NumberDecrementStepperActive;
-    return (react_1.default.createElement(react_2.NumberInput, { defaultValue: defaultValue, min: min, max: max, step: step, precision: precision, clampValueOnBlur: clampValueOnBlur, keepWithinRange: keepWithinRange, value: value, onChange: onChange, size: size, maxW: maxW, allowMouseWheel: allowMouseWheel },
-        react_1.default.createElement(react_2.NumberInputField, null),
-        react_1.default.createElement(react_2.NumberInputStepper, null,
-            react_1.default.createElement(react_2.NumberIncrementStepper, { bg: NumberIncrementStepperBg, _active: NumberIncrementStepperActive }, NumberIncrementStepperChildren),
-            react_1.default.createElement(react_2.NumberDecrementStepper, { bg: NumberDecrementStepperBg, _active: NumberDecrementStepperActive }, NumberDecrementStepperChildren))));
-}
-exports.default = NumberInput;

package/dist/Components/NumberInput/NumberInput.stories.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Components/NumberInput/NumberInput.stories.js

@@ -1,5 +0,0 @@
-"use strict";
-// import React from 'react';
-// import { StoryFn, Meta } from '@storybook/react';
-// import NumberInputs from './NumberInput';
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/NumberInput/NumberInputProps.d.ts

@@ -1,12 +0,0 @@
-import { NumberInputProps as chakraNumbetInpurProps } from "@chakra-ui/react";
-export type NumberInputProps = Pick<chakraNumbetInpurProps, "defaultValue" | "min" | "max" | "precision" | "step" | "clampValueOnBlur" | "keepWithinRange" | "value" | "onChange" | "size" | "maxW" | "allowMouseWheel"> & {
-    NumberIncrementStepperBg?: string;
-    NumberIncrementStepperActive?: ActiveStyle;
-    NumberIncrementStepperChildren?: string;
-    NumberDecrementStepperBg?: string;
-    NumberDecrementStepperChildren?: string;
-    NumberDecrementStepperActive?: ActiveStyle;
-};
-export type ActiveStyle = {
-    bg: string;
-};

package/dist/Components/NumberInput/NumberInputProps.js

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

package/dist/Components/PinInput/PinInput.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { ChakraPinInputProps } from "./PinInputProps";
-export default function PinInputs({ otp, mask, defaultValue, placeholder, manageFocus, errorBorderColor, focusBorderColor, onChange, onComplete, type, color, variant, pins, label, }: ChakraPinInputProps): React.JSX.Element;

package/dist/Components/PinInput/PinInput.js

@@ -1,15 +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");
-function PinInputs(_a) {
-    var otp = _a.otp, mask = _a.mask, defaultValue = _a.defaultValue, placeholder = _a.placeholder, manageFocus = _a.manageFocus, errorBorderColor = _a.errorBorderColor, focusBorderColor = _a.focusBorderColor, onChange = _a.onChange, onComplete = _a.onComplete, type = _a.type, color = _a.color, variant = _a.variant, _b = _a.pins, pins = _b === void 0 ? 3 : _b, label = _a.label;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        label && (react_1.default.createElement(react_2.Text, { fontWeight: "bold", marginBottom: "8px" }, label)),
-        react_1.default.createElement(react_2.HStack, null,
-            react_1.default.createElement(react_2.PinInput, { otp: otp, mask: mask, defaultValue: defaultValue, placeholder: placeholder, manageFocus: manageFocus, errorBorderColor: errorBorderColor, focusBorderColor: focusBorderColor, onChange: onChange, onComplete: onComplete, type: type, colorScheme: color, variant: variant }, Array.from({ length: pins }).map(function (_, index) { return (react_1.default.createElement(react_2.PinInputField, { key: index })); })))));
-}
-exports.default = PinInputs;

package/dist/Components/PinInput/PinInput.stories.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Components/PinInput/PinInput.stories.js

@@ -1,6 +0,0 @@
-"use strict";
-// import React from 'react';
-// import { StoryFn, Meta } from '@storybook/react';
-// import PinInput from './PinInput';
-// import { ChakraPinInputProps } from './PinInputProps';
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/PinInput/PinInputProps.d.ts

@@ -1,9 +0,0 @@
-import { PinInputProps } from "@chakra-ui/react";
-export type ChakraPinInputProps = Pick<PinInputProps, "otp" | "mask" | "defaultValue" | "placeholder" | "manageFocus" | "errorBorderColor" | "focusBorderColor" | "onChange" | "onComplete"> & {
-    type?: "alphanumeric" | "number";
-    size?: "xs" | "sm" | "md" | "lg";
-    variant?: "flushed" | "outline" | "filled" | "unstyled";
-    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
-    pins: number;
-    label?: string;
-};

package/dist/Components/PinInput/PinInputProps.js

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

package/dist/Components/PinInputs/PinInputs.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { PinInputsProps } from './PinInputsProps';
-declare const PinInputs: ({ length, label, error, onChange, onComplete, mask, placeholder, }: PinInputsProps) => React.JSX.Element;
-export default PinInputs;

package/dist/Components/PinInputs/PinInputs.js

@@ -1,71 +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;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var Label_1 = __importDefault(require("../Common/Label"));
-var ErrorComponent_1 = __importDefault(require("../Common/ErrorComponent"));
-var PinInputs = function (_a) {
-    var _b = _a.length, length = _b === void 0 ? 3 : _b, label = _a.label, error = _a.error, onChange = _a.onChange, onComplete = _a.onComplete, _c = _a.mask, mask = _c === void 0 ? false : _c, _d = _a.placeholder, placeholder = _d === void 0 ? "*" : _d;
-    var _e = (0, react_1.useState)(Array(length).fill("")), values = _e[0], setValues = _e[1];
-    var inputsRef = (0, react_1.useRef)([]);
-    var handleChange = function (index, value) {
-        var _a;
-        if (!/^[0-9]?$/.test(value))
-            return;
-        var newValues = __spreadArray([], values, true);
-        newValues[index] = value;
-        setValues(newValues);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newValues.join(""));
-        if (value && index < length - 1) {
-            (_a = inputsRef.current[index + 1]) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-        if (newValues.every(function (v) { return v !== ""; })) {
-            onComplete === null || onComplete === void 0 ? void 0 : onComplete(newValues.join(""));
-        }
-    };
-    var handleKeyDown = function (e, index) {
-        var _a;
-        if (e.key === "Backspace" && !values[index] && index > 0) {
-            (_a = inputsRef.current[index - 1]) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-    };
-    return (react_1.default.createElement("div", null,
-        label && react_1.default.createElement(Label_1.default, { label: label }),
-        react_1.default.createElement("div", { className: "flex space-x-2" }, Array.from({ length: length }).map(function (_, index) { return (react_1.default.createElement("input", { key: index, ref: function (el) { return (inputsRef.current[index] = el); }, type: mask ? "password" : "text", inputMode: "numeric", maxLength: 1, placeholder: placeholder, value: values[index], onChange: function (e) { return handleChange(index, e.target.value); }, onKeyDown: function (e) { return handleKeyDown(e, index); }, className: "w-12 h-12 text-center border rounded-md text-lg focus:outline-none focus:ring-2 ".concat(error ? "border-red-500 focus:ring-red-300" : "border-gray-300 focus:ring-blue-500") })); })),
-        error && react_1.default.createElement(ErrorComponent_1.default, { error: error })));
-};
-exports.default = PinInputs;

package/dist/Components/PinInputs/PinInputsProps.js

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

package/dist/Components/ProductCard/ProductCard.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { ProductCardProps } from './ProductCardProps';
-declare const ProductCard: ({ label, productImage, rating, reviews, tags, options, onAddToCart, bag, description, }: ProductCardProps) => React.JSX.Element;
-export default ProductCard;

package/dist/Components/ProductCard/ProductCard.js

@@ -1,51 +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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var ProductTags_1 = __importDefault(require("./ProductTags"));
-var ProductReview_1 = __importDefault(require("./ProductReview"));
-var ProductPrice_1 = __importDefault(require("./ProductPrice"));
-var Button_1 = __importDefault(require("../Button/Button"));
-var ProductLabel_1 = __importDefault(require("./ProductLabel"));
-var ProductCard = function (_a) {
-    var label = _a.label, productImage = _a.productImage, rating = _a.rating, reviews = _a.reviews, tags = _a.tags, options = _a.options, onAddToCart = _a.onAddToCart, bag = _a.bag, description = _a.description;
-    var _b = (0, react_1.useState)(false), hover = _b[0], setHover = _b[1];
-    return (react_1.default.createElement(react_2.Box, { borderWidth: "0.063 rem", borderRadius: "lg", overflow: "hidden", p: 3, w: "16.25rem", position: "relative", bg: "white", boxShadow: "lg" },
-        react_1.default.createElement(react_2.Box, { onMouseEnter: function () { return setHover(true); }, onMouseLeave: function () { return setHover(false); }, h: "11.25rem", w: "full", overflow: "hidden" },
-            react_1.default.createElement(react_2.Image, { src: hover && productImage.hover ? productImage.hover : productImage.visibile, alt: label, w: "full", h: "full", objectFit: "cover" }),
-            bag && (react_1.default.createElement(react_2.Badge, { colorScheme: bag.color || "red", position: "absolute", top: 2, right: 2 }, bag.label))),
-        react_1.default.createElement(react_2.VStack, { spacing: 2, align: "start", mt: 3 },
-            react_1.default.createElement(ProductLabel_1.default, { label: label, description: description }),
-            tags && react_1.default.createElement(ProductTags_1.default, { tags: tags }),
-            rating && reviews &&
-                react_1.default.createElement(ProductReview_1.default, { rating: rating, reviewCount: reviews }),
-            options && react_1.default.createElement(ProductPrice_1.default, { options: options }),
-            onAddToCart && react_1.default.createElement(Button_1.default, { colorScheme: "orange", size: "sm", width: "100%", onClick: onAddToCart }, "Add to Cart"))));
-};
-exports.default = ProductCard;

package/dist/Components/ProductCard/ProductCardProps.js

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

package/dist/Components/ProductCard/ProductLabel.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-declare const ProductLabel: ({ label, description }: {
-    label: string;
-    description?: string | undefined;
-}) => React.JSX.Element;
-export default ProductLabel;

package/dist/Components/ProductCard/ProductLabel.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 = require("@chakra-ui/react");
-var react_2 = __importDefault(require("react"));
-var ProductLabel = function (_a) {
-    var label = _a.label, description = _a.description;
-    return (react_2.default.createElement(react_1.Box, null,
-        react_2.default.createElement(react_1.Text, { fontWeight: "bold" }, label),
-        description && react_2.default.createElement(react_1.Text, { fontSize: "xs", fontStyle: "italic" }, description)));
-};
-exports.default = ProductLabel;

package/dist/Components/ProductCard/ProductPrice.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { options } from './ProductCardProps';
-type ProductPriceProps = {
-    options: options[];
-};
-declare const ProductPrice: ({ options }: ProductPriceProps) => React.JSX.Element;
-export default ProductPrice;