lsoft-ui 0.0.1

package/dist/components/CustomIconButton.js

@@ -0,0 +1,19 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { IconButton } from "@chakra-ui/react";
+import { SearchIcon } from "@chakra-ui/icons";
+const CustomIconButton = (_a) => {
+    var { icon = _jsx(SearchIcon, {}), colorScheme = "blue", backgroundColor = "primary.300", borderColor = "" } = _a, props = __rest(_a, ["icon", "colorScheme", "backgroundColor", "borderColor"]);
+    return (_jsx(IconButton, Object.assign({ colorScheme: colorScheme, icon: icon, backgroundColor: backgroundColor, borderColor: borderColor, borderWidth: borderColor ? "1px" : "0px" }, props)));
+};
+export default CustomIconButton;

package/dist/components/CustomInput.d.ts

@@ -0,0 +1,19 @@
+import React, { ReactNode } from "react";
+import { InputProps } from "@chakra-ui/react";
+interface CustomInputProps extends InputProps {
+    label?: string;
+    type?: string;
+    placeholder?: string;
+    error?: string;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    showError?: boolean;
+    withFormControl?: boolean;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+    size?: "xs" | "sm" | "md" | "lg";
+}
+export declare const CustomInput: React.ForwardRefExoticComponent<CustomInputProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/components/CustomInput.js

@@ -0,0 +1,32 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+import { Input, FormControl, FormLabel, FormErrorMessage, InputGroup, InputLeftElement, InputRightElement, Tooltip, Text, HStack, } from "@chakra-ui/react";
+import { Info } from "lucide-react";
+export const CustomInput = React.forwardRef((_a, ref) => {
+    var { label, type = "text", placeholder, error, leftIcon, rightIcon, withFormControl = true, showError = true, required = false, tooltip, labelColor = "neutral.400", labelBold = false, size = "sm" } = _a, props = __rest(_a, ["label", "type", "placeholder", "error", "leftIcon", "rightIcon", "withFormControl", "showError", "required", "tooltip", "labelColor", "labelBold", "size"]);
+    const inputElement = (_jsxs(_Fragment, { children: [label && label.trim() !== "" && (_jsx(FormLabel, { fontSize: "xs", children: _jsxs(HStack, { spacing: 1, align: "center", children: [_jsx(Text, { color: labelColor || "neutral.400", fontWeight: labelBold ? "bold" : "normal", children: label }), required && (_jsx(Text, { color: "red.500", fontSize: "xs", children: "*" })), tooltip && (_jsx(Tooltip, { label: tooltip, placement: "top", hasArrow: true, children: _jsx(Info, { color: "var(--chakra-colors-alert-warning)", width: "16px", height: "16px" }) }))] }) })), _jsxs(InputGroup, { size: size, sx: {
+                    ".chakra-input": { transition: "border-color .5s, box-shadow .5s" },
+                    ".input-left, .input-right": { transition: "color .5s" },
+                    "&:focus-within .input-left, &:focus-within .input-right": {
+                        color: "primary.300",
+                    },
+                    "&:has(input:not(:placeholder-shown)) .input-left, &:has(input:not(:placeholder-shown)) .input-right": {
+                        color: "primary.300",
+                    },
+                }, children: [leftIcon && (_jsx(InputLeftElement, { className: "input-left", color: "border.primary", children: leftIcon })), _jsx(Input, Object.assign({ ref: ref, type: type, placeholder: placeholder, focusBorderColor: "primary.300", backgroundColor: props.isDisabled ? "background.secondary" : "background.primary", borderColor: "border.primary", color: "neutral.400", borderRadius: "4px", size: size, _placeholder: {
+                            color: "neutral.200",
+                            opacity: 1,
+                        } }, props)), rightIcon && (_jsx(InputRightElement, { className: "input-right", color: "border.primary", children: rightIcon }))] }), showError && error && (_jsx(FormErrorMessage, { fontSize: "xs", mt: "3px", children: error }))] }));
+    return withFormControl ? (_jsx(FormControl, { isInvalid: !!error, children: inputElement })) : (inputElement);
+});

package/dist/components/CustomInputNumber.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { NumberInputProps } from "@chakra-ui/react";
+interface CustomInputNumberProps extends NumberInputProps {
+    label?: string;
+    error?: string;
+    showError?: boolean;
+    withFormControl?: boolean;
+    fieldSize?: "sm" | "md" | "lg";
+    disabled?: boolean;
+    style?: React.CSSProperties;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+}
+declare const CustomInputNumber: React.FC<CustomInputNumberProps>;
+export default CustomInputNumber;

package/dist/components/CustomInputNumber.js

@@ -0,0 +1,23 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { FormControl, FormErrorMessage, FormLabel, NumberInput, NumberInputField, Tooltip, Text, HStack, } from "@chakra-ui/react";
+import { Info } from "lucide-react";
+const CustomInputNumber = (_a) => {
+    var { label, error, showError = true, withFormControl = true, fieldSize = "md", disabled = false, style = {}, required = false, tooltip, labelColor = "neutral.400", labelBold = false } = _a, props = __rest(_a, ["label", "error", "showError", "withFormControl", "fieldSize", "disabled", "style", "required", "tooltip", "labelColor", "labelBold"]);
+    const inputElement = (_jsxs(_Fragment, { children: [label && label.trim() !== "" && (_jsx(FormLabel, { fontSize: "xs", children: _jsxs(HStack, { spacing: 1, align: "center", children: [_jsx(Text, { color: labelColor, fontWeight: labelBold ? "bold" : "normal", children: label }), required && (_jsx(Text, { color: "red.500", fontSize: "xs", children: "*" })), tooltip && (_jsx(Tooltip, { label: tooltip, placement: "top", hasArrow: true, children: _jsx(Info, { color: "var(--chakra-colors-alert-warning)", width: "16px", height: "16px" }) }))] }) })), _jsx(NumberInput, Object.assign({ size: fieldSize, focusBorderColor: "primary.300", backgroundColor: props.isDisabled ? "background.secondary" : "background.primary", borderColor: "border.primary", color: "neutral.400", borderRadius: "4px", style: style, isDisabled: disabled }, props, { children: _jsx(NumberInputField, { _placeholder: {
+                        color: "neutral.200",
+                        opacity: 1
+                    } }) })), showError && error && (_jsx(FormErrorMessage, { fontSize: "xs", mt: "3px", children: error }))] }));
+    return withFormControl ? (_jsx(FormControl, { isInvalid: !!error, children: inputElement })) : (inputElement);
+};
+export default CustomInputNumber;

package/dist/components/CustomList.d.ts

@@ -0,0 +1,22 @@
+import { ListProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
+export interface CustomListItem {
+    id: string | number;
+    label: string | ReactNode;
+    icon?: ReactNode;
+    description?: string | ReactNode;
+    isActive?: boolean;
+}
+interface CustomListProps extends Omit<ListProps, "children"> {
+    items: CustomListItem[];
+    onItemClick?: (item: CustomListItem) => void;
+    bgColor?: string;
+    hoverColor?: string;
+    activeColor?: string;
+    iconColor?: string;
+    striped?: boolean;
+    stripedColor?: string;
+}
+export declare function CustomList({ items, onItemClick, bgColor, hoverColor, activeColor, iconColor, striped, stripedColor, // cor alternada
+...props }: CustomListProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CustomList.js

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { List, ListItem, Text, Box, } from "@chakra-ui/react";
+export function CustomList(_a) {
+    var { items, onItemClick, bgColor = "background.primary", hoverColor = "background.secondary", activeColor = "transparent", iconColor, striped = false, stripedColor = "background.secondary" } = _a, // cor alternada
+    props = __rest(_a, ["items", "onItemClick", "bgColor", "hoverColor", "activeColor", "iconColor", "striped", "stripedColor"]);
+    return (_jsx(List, Object.assign({ spacing: 1 }, props, { children: items.map((item, index) => {
+            // se striped = true, alterna a cor
+            const itemBg = item.isActive
+                ? activeColor
+                : striped && index % 2 !== 0
+                    ? stripedColor
+                    : bgColor;
+            return (_jsx(ListItem, { px: 4, py: 2, bg: itemBg, borderRadius: "none", cursor: onItemClick ? "pointer" : "default", transition: "background 0.2s ease", _hover: { bg: hoverColor }, onClick: () => onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(item), role: onItemClick ? "button" : undefined, "aria-label": onItemClick ? `Selecionar ${item.label}` : undefined, children: _jsxs(Box, { children: [typeof item.label === "string" ? (_jsx(Text, { fontSize: "sm", fontWeight: "medium", children: item.label })) : (item.label), item.description &&
+                            (typeof item.description === "string" ? (_jsx(Text, { fontSize: "xs", color: "neutral.400", children: item.description })) : (item.description))] }) }, item.id));
+        }) })));
+}

package/dist/components/CustomLoadingCenterPage.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface LoadingProps {
+    message?: string;
+}
+export declare const CustomLoadingCenterPage: React.FC<LoadingProps>;
+export {};

package/dist/components/CustomLoadingCenterPage.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Spinner, Text } from "@chakra-ui/react";
+export const CustomLoadingCenterPage = ({ message, }) => {
+    return (_jsxs(Box, { display: "flex", justifyContent: "center", alignItems: "center", height: "100%", bg: "transparent", flexDirection: "column", children: [_jsx(Spinner, { size: "xl", thickness: "4px", speed: "0.65s", color: "primary.300", emptyColor: "gray.200" }), message && (_jsx(Text, { mt: 4, fontSize: "lg", color: "netural.400", textAlign: "center", children: message }))] }));
+};

package/dist/components/CustomModal.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { ModalProps, ModalOverlayProps, ModalContentProps } from "@chakra-ui/react";
+export interface CustomModalProps extends Omit<ModalProps, "children"> {
+    modalHeader?: React.ReactNode;
+    modalBody?: React.ReactNode;
+    modalFooter?: React.ReactNode;
+    modalHeaderIcon?: {
+        icon: React.ReactNode;
+        iconColor: string;
+        bgIconColor: string;
+        headerColor: string;
+    };
+    overlayProps?: ModalOverlayProps;
+    contentProps?: ModalContentProps;
+    icon?: React.ReactNode;
+    style?: React.CSSProperties;
+    typeMsg?: "success" | "error" | "warning" | "info" | "nfWarning" | "nfError" | "nfSuccess" | "nfDenied";
+}
+export declare const CustomModal: React.FC<CustomModalProps>;

package/dist/components/CustomModal.js

@@ -0,0 +1,83 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Modal, ModalOverlay, ModalContent, ModalHeader, ModalBody, ModalFooter, ModalCloseButton, Flex, Heading, Text, } from "@chakra-ui/react";
+import { CircleCheck, CircleX, TriangleAlert } from "lucide-react";
+function getTypeMsgColors(type) {
+    switch (type) {
+        case "success":
+            return {
+                boxBg: "alert.success",
+                flexBg: "alert.successBg",
+                IconModal: _jsx(CircleCheck, { size: 41 }),
+            };
+        case "error":
+            return {
+                boxBg: "alert.error",
+                flexBg: "alert.errorBg",
+                IconModal: _jsx(CircleX, { size: 41 }),
+            };
+        case "warning":
+            return {
+                boxBg: "alert.warning",
+                flexBg: "alert.warningBg",
+                IconModal: _jsx(TriangleAlert, { size: 41 }),
+            };
+        case "info":
+            return {
+                boxBg: "alert.info",
+                flexBg: "alert.infoBg",
+                IconModal: _jsx(TriangleAlert, { size: 41 }),
+            };
+        case "nfWarning":
+            return {
+                boxBg: "alert.warning",
+                flexBg: "alert.warningBg",
+                IconModal: _jsx(TriangleAlert, { size: 41 }),
+            };
+        case "nfError":
+            return {
+                boxBg: "alert.error",
+                flexBg: "alert.errorBg",
+                IconModal: _jsx(CircleX, { size: 41 }),
+            };
+        case "nfSuccess":
+            return {
+                boxBg: "alert.success",
+                flexBg: "alert.successBg",
+                IconModal: _jsx(CircleCheck, { size: 41 }),
+            };
+        case "nfDenied":
+            return {
+                boxBg: "neutral.300",
+                flexBg: "neutral.200",
+                IconModal: _jsx(CircleX, { size: 41 }),
+            };
+        default:
+            return {
+                boxBg: "primary.300",
+                flexBg: "transparent",
+                IconModal: _jsx(TriangleAlert, { size: 41, color: "yellow.400" }),
+            };
+    }
+}
+export const CustomModal = (_a) => {
+    var _b, _c, _d, _e;
+    var { isOpen, onClose, modalHeader, modalHeaderIcon, modalBody, modalFooter, typeMsg, size = "sm", overlayProps, contentProps } = _a, props = __rest(_a, ["isOpen", "onClose", "modalHeader", "modalHeaderIcon", "modalBody", "modalFooter", "typeMsg", "size", "overlayProps", "contentProps"]);
+    const { boxBg, flexBg, IconModal } = getTypeMsgColors(typeMsg);
+    return (_jsxs(Modal, Object.assign({ isOpen: isOpen, onClose: onClose, size: size, isCentered: true }, props, { children: [_jsx(ModalOverlay, Object.assign({}, overlayProps)), _jsxs(ModalContent, Object.assign({ w: "auto", minW: size, maxW: "90vw", borderRadius: "0" }, contentProps, { children: [_jsxs(ModalHeader, { px: "40px", pt: "40px", pb: "0", color: (_b = modalHeaderIcon === null || modalHeaderIcon === void 0 ? void 0 : modalHeaderIcon.headerColor) !== null && _b !== void 0 ? _b : boxBg, children: [_jsxs(Flex, { justifyContent: "space-between", align: "flex-start", children: [_jsx(Flex, { bg: (_c = modalHeaderIcon === null || modalHeaderIcon === void 0 ? void 0 : modalHeaderIcon.bgIconColor) !== null && _c !== void 0 ? _c : flexBg, color: (_d = modalHeaderIcon === null || modalHeaderIcon === void 0 ? void 0 : modalHeaderIcon.iconColor) !== null && _d !== void 0 ? _d : boxBg, h: "46px", w: "48px", borderRadius: "5px", p: "5px", justify: "center", align: "center", children: (_e = modalHeaderIcon === null || modalHeaderIcon === void 0 ? void 0 : modalHeaderIcon.icon) !== null && _e !== void 0 ? _e : IconModal }), _jsx(ModalCloseButton, { color: "neutral.300", position: "relative", h: 0, w: 0, sx: {
+                                            "& .chakra-icon": {
+                                                width: "14px",
+                                                height: "14px",
+                                            },
+                                        } })] }), modalHeader && (_jsx(Heading, { as: "h3", size: "md", pt: 7, fontSize: "2xl", children: modalHeader }))] }), modalBody && (_jsx(ModalBody, { pt: 3, px: "40px", pb: modalFooter ? 0 : "40px", maxW: "calc(var(--chakra-sizes-xl) - 62px)", children: _jsx(Text, { children: modalBody }) })), modalFooter && (_jsx(ModalFooter, { px: "40px", pt: 5, pb: "40px", justifyContent: "flex-end", children: modalFooter }))] }))] })));
+};

package/dist/components/CustomModalNfe.d.ts

@@ -0,0 +1,34 @@
+export declare enum StatusNFeResumeEnum {
+    APPROVED = 100,
+    CANCELED = 101,
+    INUTILIZED = 102,
+    DENIED = 103,
+    NOT_TRANSMITTED = 104,
+    WITH_ERROR = 105
+}
+export interface NFeNotaItem {
+    serie: string;
+    nfnumero: number;
+    modelo: number;
+    dataemissao: string;
+    datacancelado: string;
+    clicnpj: string;
+    agente: number;
+    nomagente: string;
+    pedido: number;
+    totalnota: number;
+    chave_nfe: string;
+    tpamb: "1" | "2";
+    cliemail: string;
+    mensagem: string;
+    status: string;
+}
+interface ModalNfeProps {
+    isOpen: boolean;
+    onClose: () => void;
+    size?: "sm" | "md" | "lg" | "xl" | "2xl";
+    nfSelected: NFeNotaItem;
+    bodyOptions?: React.ReactNode;
+}
+export declare const CustomModalNfe: ({ isOpen, onClose, nfSelected, bodyOptions, size, }: ModalNfeProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/CustomModalNfe.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon, Modal, ModalOverlay, ModalContent, ModalHeader, ModalBody, Text, Box, Flex, useToast, } from "@chakra-ui/react";
+import { CustomInput } from "./CustomInput";
+import CustomTextarea from "./CustomTextarea";
+import { Check, CheckCircle2Icon, CircleSlash, Copy, X, XCircle, } from "lucide-react";
+import CustomToast from "./CustomToast";
+import { useCallback } from "react";
+export var StatusNFeResumeEnum;
+(function (StatusNFeResumeEnum) {
+    StatusNFeResumeEnum[StatusNFeResumeEnum["APPROVED"] = 100] = "APPROVED";
+    StatusNFeResumeEnum[StatusNFeResumeEnum["CANCELED"] = 101] = "CANCELED";
+    StatusNFeResumeEnum[StatusNFeResumeEnum["INUTILIZED"] = 102] = "INUTILIZED";
+    StatusNFeResumeEnum[StatusNFeResumeEnum["DENIED"] = 103] = "DENIED";
+    StatusNFeResumeEnum[StatusNFeResumeEnum["NOT_TRANSMITTED"] = 104] = "NOT_TRANSMITTED";
+    StatusNFeResumeEnum[StatusNFeResumeEnum["WITH_ERROR"] = 105] = "WITH_ERROR";
+})(StatusNFeResumeEnum || (StatusNFeResumeEnum = {}));
+// nota fiscar rejeitada ou não transmitida - alert.warning
+// nota fiscal cancelada ou inutilizada - alert.error
+//nota fiscal denegada - neutral.300
+//nota fiscal aprovada - alert.success
+const colorStatus = {
+    [StatusNFeResumeEnum.DENIED]: "alert.warning",
+    [StatusNFeResumeEnum.CANCELED]: "alert.error",
+    [StatusNFeResumeEnum.INUTILIZED]: "alert.error",
+    [StatusNFeResumeEnum.NOT_TRANSMITTED]: "alert.warning",
+    [StatusNFeResumeEnum.WITH_ERROR]: "alert.warning",
+    [StatusNFeResumeEnum.APPROVED]: "alert.success",
+};
+const messageStatus = {
+    [StatusNFeResumeEnum.DENIED]: "Nota fiscal não autorizada",
+    [StatusNFeResumeEnum.CANCELED]: "Nota fiscal cancelada",
+    [StatusNFeResumeEnum.INUTILIZED]: "Nota fiscal inutilizada",
+    [StatusNFeResumeEnum.NOT_TRANSMITTED]: "Nota fiscal não transmitida",
+    [StatusNFeResumeEnum.WITH_ERROR]: "Nota fiscal rejeitada",
+    [StatusNFeResumeEnum.APPROVED]: "Nota fiscal aprovada",
+};
+const iconByStatus = {
+    [StatusNFeResumeEnum.DENIED]: XCircle,
+    [StatusNFeResumeEnum.CANCELED]: XCircle,
+    [StatusNFeResumeEnum.INUTILIZED]: CircleSlash,
+    [StatusNFeResumeEnum.NOT_TRANSMITTED]: XCircle,
+    [StatusNFeResumeEnum.WITH_ERROR]: XCircle,
+    [StatusNFeResumeEnum.APPROVED]: CheckCircle2Icon,
+};
+const hoverStyle = {
+    _hover: {
+        borderColor: "primary.300",
+    },
+};
+const formatChaveAcesso = (chave) => {
+    if (!chave || chave.length !== 44)
+        return chave;
+    return chave.replace(/(\d{4})(?=\d)/g, "$1 ");
+};
+export const CustomModalNfe = ({ isOpen, onClose, nfSelected, bodyOptions, size = "2xl", }) => {
+    var _a;
+    const toast = useToast();
+    const handleCopyChave = useCallback((chave) => {
+        navigator.clipboard.writeText(chave);
+        toast({
+            position: "top-right",
+            duration: 2000,
+            render: () => (_jsx(CustomToast, { msg: "Chave de acesso copiada!", textColor: "alert.success", bgColor: "alert.successBg", borderColor: "alert.success", icon: _jsx(Icon, { as: Check, boxSize: 4, color: "alert.success" }) })),
+        });
+    }, [toast]);
+    if (!nfSelected)
+        return null;
+    const { serie, nfnumero, modelo, dataemissao, mensagem, chave_nfe, status } = nfSelected;
+    return (_jsxs(Modal, { isOpen: isOpen, onClose: onClose, isCentered: true, size: size, children: [_jsx(ModalOverlay, {}), _jsxs(ModalContent, { gap: 6, children: [_jsx(ModalHeader, { pb: 0, pt: 10, px: 10, children: _jsxs(Flex, { justifyContent: "space-between", alignItems: "flex-start", w: "full", children: [_jsxs(Flex, { alignItems: "flex-start", flexDir: "column", gap: 5, children: [_jsx(Box, { background: `${colorStatus[Number(status)]}Bg`, borderRadius: "md", p: 2, width: "fit-content", children: _jsx(Icon, { as: (_a = iconByStatus[Number(status)]) !== null && _a !== void 0 ? _a : XCircle, boxSize: 35, color: colorStatus[Number(status)] }) }), _jsx(Text, { id: "modal-nfe-title", color: colorStatus[Number(status)], fontSize: "lg", fontWeight: "bold", children: messageStatus[Number(status)] })] }), _jsx(Icon, { as: X, boxSize: 5, color: "neutral.300", cursor: "pointer", _hover: { color: "neutral.400" }, onClick: onClose, role: "button", "aria-label": "Fechar modal", tabIndex: 0, onKeyDown: (e) => {
+                                        if (e.key === "Enter" || e.key === " ") {
+                                            e.preventDefault();
+                                            onClose();
+                                        }
+                                    } })] }) }), _jsx(ModalBody, { id: "modal-nfe-description", pt: 0, pb: 10, px: 10, children: _jsxs(Flex, { flexDir: "column", gap: 3, children: [_jsxs(Flex, { gap: 4, children: [_jsx(Box, { flex: 2, children: _jsx(CustomInput, { label: "S\u00E9rie", value: serie, _hover: hoverStyle, isReadOnly: true }) }), _jsx(Box, { flex: 2.5, children: _jsx(CustomInput, { label: "N\u00FAmero", value: nfnumero, _hover: hoverStyle, isReadOnly: true }) }), _jsx(Box, { flex: 1, children: _jsx(CustomInput, { label: "Modelo", value: modelo, _hover: hoverStyle, isReadOnly: true }) }), _jsx(Box, { flex: 2, children: _jsx(CustomInput, { label: "Data de emiss\u00E3o", value: new Date(dataemissao).toLocaleDateString("pt-BR", {
+                                                    timeZone: "UTC",
+                                                }), _hover: hoverStyle, isReadOnly: true }) })] }), _jsx(Flex, { children: (mensagem === null || mensagem === void 0 ? void 0 : mensagem.includes("Arquivo XML")) ? (_jsx(CustomTextarea, { label: "Mensagem", value: mensagem, _hover: hoverStyle, isReadOnly: true })) : (_jsx(Box, { role: "group", width: "100%", children: _jsx(CustomInput, { label: "Chave de Acesso", value: formatChaveAcesso(chave_nfe), leftIcon: _jsx(Icon, { as: Copy, boxSize: 4, cursor: "pointer", color: "neutral.200", transition: "color 0.5s", _groupHover: { color: "primary.300" }, onClick: (e) => {
+                                                    e.stopPropagation();
+                                                    handleCopyChave(chave_nfe);
+                                                }, role: "button", "aria-label": "Copiar chave de acesso", tabIndex: 0, onKeyDown: (e) => {
+                                                    if (e.key === "Enter" || e.key === " ") {
+                                                        e.preventDefault();
+                                                        e.stopPropagation();
+                                                        handleCopyChave(chave_nfe);
+                                                    }
+                                                } }), _hover: hoverStyle, isReadOnly: true }) })) }), bodyOptions] }) })] })] }));
+};

package/dist/components/CustomMultSelect.d.ts

@@ -0,0 +1,28 @@
+export interface MultiSelectOption {
+    value: string;
+    label: string;
+    icon?: JSX.Element;
+}
+interface MultiSelectProps {
+    options: MultiSelectOption[];
+    value?: string[];
+    defaultValue?: string[];
+    onChange?: (values: string[]) => void;
+    placeholder?: string;
+    maxWidth?: string | number;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl";
+    multipleLabel?: (count: number) => string;
+    label?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+    labelSize?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl";
+    tooltip?: string;
+    error?: string;
+    touched?: boolean;
+    withFormControl?: boolean;
+    required?: boolean;
+    helperText?: string;
+}
+export declare function MultiSelectLikeSelect({ options, value, defaultValue, onChange, placeholder, maxWidth, // 👈 default é 100%, mas pode ser sobrescrito
+size, multipleLabel, label, labelColor, labelBold, labelSize, tooltip, error, touched, withFormControl, required, helperText, }: MultiSelectProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CustomMultSelect.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Menu, MenuButton, MenuList, MenuItem, Button, HStack, Text, useDisclosure, FormControl, FormLabel, Tooltip, FormErrorMessage, FormHelperText, Icon, } from "@chakra-ui/react";
+import { ChevronDownIcon } from "@chakra-ui/icons";
+import { useState } from "react";
+import { Info } from "lucide-react";
+import { CustomCheckbox } from "./CustomCheckBox";
+export function MultiSelectLikeSelect({ options, value, defaultValue = [], onChange, placeholder = "Selecione uma ou mais opções", maxWidth = "100%", // 👈 default é 100%, mas pode ser sobrescrito
+size = "sm", multipleLabel = (count) => `${count} selecionados`, 
+// extras
+label, labelColor = "neutral.400", labelBold = false, labelSize = "sm", tooltip, error, touched = true, withFormControl = true, required = false, helperText, }) {
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const { isOpen, onOpen, onClose } = useDisclosure();
+    const selected = value !== null && value !== void 0 ? value : internalValue;
+    const toggleValue = (val) => {
+        const newValues = selected.includes(val)
+            ? selected.filter((v) => v !== val)
+            : [...selected, val];
+        if (!value)
+            setInternalValue(newValues);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValues);
+    };
+    const renderButtonLabel = () => {
+        if (selected.length === 0)
+            return placeholder;
+        if (selected.length === 1) {
+            const opt = options.find((o) => o.value === selected[0]);
+            return (_jsxs(HStack, { spacing: 2, maxW: maxWidth, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", children: [opt === null || opt === void 0 ? void 0 : opt.icon, _jsx(Text, { children: opt === null || opt === void 0 ? void 0 : opt.label })] }));
+        }
+        return multipleLabel(selected.length);
+    };
+    const menuElement = (_jsxs(Menu, { closeOnSelect: false, isOpen: isOpen, onOpen: onOpen, onClose: onClose, matchWidth: true, children: [_jsx(MenuButton, { as: Button, rightIcon: _jsx(Icon, { as: ChevronDownIcon, transition: "transform 0.2s ease-in-out", transform: isOpen ? "rotate(180deg)" : "rotate(0deg)" }), variant: "outline", w: "100%", maxW: maxWidth, textAlign: "left", fontWeight: "normal", size: size, children: renderButtonLabel() }), _jsx(MenuList, { maxW: maxWidth, maxH: "160px", overflowY: "auto", sx: {
+                    "::-webkit-scrollbar": {
+                        width: "6px",
+                    },
+                    "::-webkit-scrollbar-track": {
+                        background: "transparent",
+                    },
+                    "::-webkit-scrollbar-thumb": {
+                        background: "neutral.200",
+                        borderRadius: "full",
+                    },
+                    "::-webkit-scrollbar-thumb:hover": {
+                        background: "neutral.300",
+                    },
+                    scrollbarWidth: "thin", // Firefox
+                    scrollbarColor: "var(--chakra-colors-neutral-200) transparent",
+                }, children: options.map((opt) => (_jsx(MenuItem, { closeOnSelect: false, display: "flex", alignItems: "center", width: "100%", onClick: (e) => e.stopPropagation(), children: _jsx(CustomCheckbox, { width: "100%", size: size, isChecked: selected.includes(opt.value), onChange: () => toggleValue(opt.value), children: _jsxs(HStack, { spacing: 2, children: [opt.icon, _jsx(Text, { children: opt.label })] }) }) }, opt.value))) })] }));
+    if (!withFormControl)
+        return menuElement;
+    return (_jsxs(FormControl, { isInvalid: !!error && touched, children: [label && (_jsx(FormLabel, { fontSize: "xs", children: _jsxs(HStack, { spacing: 1, align: "center", children: [_jsx(Text, { fontSize: labelSize, color: labelColor, fontWeight: labelBold ? "bold" : "normal", children: label }), required && (_jsx(Text, { color: "red.500", fontSize: "xs", children: "*" })), tooltip && (_jsx(Tooltip, { label: tooltip, placement: "top", hasArrow: true, children: _jsx(Info, { color: "var(--chakra-colors-alert-warning)", width: "16px", height: "16px" }) }))] }) })), menuElement, !error && helperText && (_jsx(FormHelperText, { fontSize: "xs", children: helperText })), error && touched && (_jsx(FormErrorMessage, { fontSize: "xs", children: error }))] }));
+}

package/dist/components/CustomMultipleInputs.d.ts

@@ -0,0 +1,36 @@
+import { InputProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
+export interface InputConfig {
+    label?: string;
+    type?: string;
+    placeholder?: string;
+    error?: string;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    showError?: boolean;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+    labelSize?: "xs" | "sm" | "md" | "lg";
+}
+export interface CustomMultipleInputsProps extends Omit<InputProps, "size" | "onChange" | "ref"> {
+    label?: string;
+    type?: string;
+    placeholder?: string;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    showError?: boolean;
+    withFormControl?: boolean;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+    labelSize?: "xs" | "sm" | "md" | "lg";
+    size?: "xs" | "sm" | "md" | "lg";
+    inputs: [InputConfig, InputConfig, ...InputConfig[]];
+    error?: string[];
+    values?: string[];
+    onChange?: (values: string[]) => void;
+}
+export declare const CustomMultipleInputs: import("react").ForwardRefExoticComponent<CustomMultipleInputsProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/CustomMultipleInputs.js

@@ -0,0 +1,91 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { FormControl, HStack, FormLabel, Text, Tooltip, Icon, InputGroup, Flex, InputRightElement, InputLeftElement, Input, FormErrorMessage, } from "@chakra-ui/react";
+import { Info } from "lucide-react";
+import { forwardRef, useCallback, useMemo } from "react";
+/* -------------------------------- Constants --------------------------------- */
+const INPUT_GROUP_STYLES = {
+    ".chakra-input": { transition: "border-color .5s, box-shadow .5s" },
+    ".input-left, .input-right": { transition: "color .5s" },
+    "&:focus-within .input-left, &:focus-within .input-right": {
+        color: "primary.300",
+    },
+    "&:has(input:not(:placeholder-shown)) .input-left, &:has(input:not(:placeholder-shown)) .input-right": {
+        color: "primary.300",
+    },
+};
+const INPUT_GROUP_INDIVIDUAL_STYLES = {
+    ".chakra-input": {
+        transition: "border-color .5s, box-shadow .5s",
+    },
+    ".input-left, .input-right": { transition: "color .5s" },
+    "&:focus-within .input-left, &:focus-within .input-right": {
+        color: "primary.300",
+    },
+    "&:focus-within .input-label": { color: "primary.300" },
+};
+const LABEL_FLOATING_STYLES = {
+    position: "absolute",
+    zIndex: 10,
+    backgroundColor: "background.primary",
+    top: "0",
+    transform: "translateY(-50%)",
+    ml: 2,
+    pl: 1,
+    pr: 1,
+};
+const LabelWithTooltip = ({ label, required, tooltip, labelColor = "neutral.400", labelBold, labelSize = "sm", error, htmlFor, variant = "main", }) => {
+    const labelElement = (_jsx(Text, { className: variant === "floating" ? "input-label" : undefined, as: variant === "floating" ? "label" : undefined, htmlFor: htmlFor, color: variant === "floating"
+            ? error
+                ? "alert.error"
+                : "border.primary"
+            : labelColor, fontWeight: labelBold ? "bold" : "normal", transition: variant === "floating" ? "color .5s" : undefined, fontSize: labelSize, children: label }));
+    const requiredIndicator = required && (_jsx(Text, { color: variant === "floating" ? "alert.error" : "alert.warning", fontSize: labelSize, "aria-label": "campo obrigat\u00F3rio", children: "*" }));
+    const tooltipIcon = tooltip && (_jsx(Tooltip, { label: tooltip, placement: "top", hasArrow: true, children: _jsx(Icon, { as: Info, color: "alert.warning", size: 16, role: "img", "aria-label": "Informa\u00E7\u00E3o" }) }));
+    if (variant === "floating") {
+        return (_jsxs(HStack, Object.assign({ spacing: 1, align: "center" }, LABEL_FLOATING_STYLES, { children: [labelElement, requiredIndicator, tooltipIcon] })));
+    }
+    return (_jsxs(HStack, { spacing: 1, align: "center", children: [labelElement, requiredIndicator, tooltipIcon] }));
+};
+const SingleInputField = ({ index, input, value, error, shouldShowError, size, defaultType, labelBold, labelSize, isDisabled, onChange, inputRef, inputProps, }) => {
+    const { label, type = defaultType, placeholder, leftIcon, rightIcon, required, tooltip, labelColor, labelBold: inputLabelBold, labelSize: inputLabelSize, } = input;
+    const inputId = `multiple-input-${index}`;
+    const errorId = `multiple-input-error-${index}`;
+    const hasError = !!error;
+    return (_jsxs(FormControl, { isInvalid: hasError, flex: 1, sx: {
+            "&:focus-within .input-label": { color: "primary.300" },
+        }, children: [_jsxs(InputGroup, { size: size, position: "relative", sx: INPUT_GROUP_INDIVIDUAL_STYLES, children: [label && label.trim() !== "" && (_jsx(LabelWithTooltip, { label: label, required: required, tooltip: tooltip, labelColor: labelColor, labelBold: inputLabelBold !== null && inputLabelBold !== void 0 ? inputLabelBold : labelBold, labelSize: inputLabelSize !== null && inputLabelSize !== void 0 ? inputLabelSize : labelSize, error: hasError, htmlFor: inputId, variant: "floating" })), leftIcon && (_jsx(InputLeftElement, { className: "input-left", color: "border.primary", children: leftIcon })), _jsx(Input, Object.assign({ ref: index === 0 ? inputRef : undefined, id: inputId, type: type, placeholder: placeholder, value: value, onChange: (e) => onChange(index, e.target.value), focusBorderColor: "primary.300", backgroundColor: isDisabled ? "background.secondary" : "background.primary", borderColor: "border.primary", color: "neutral.400", borderRadius: "4px", size: size, _placeholder: { color: "neutral.200", opacity: 1 }, pt: size === "xs" ? 1 : 0, "aria-invalid": hasError, "aria-describedby": hasError && shouldShowError ? errorId : undefined, "aria-required": required }, inputProps)), rightIcon && (_jsx(InputRightElement, { className: "input-right", color: "border.primary", children: rightIcon }))] }), shouldShowError && error && (_jsx(FormErrorMessage, { id: errorId, fontSize: "xs", mt: "3px", children: error }))] }));
+};
+/* -------------------------------- Main Component --------------------------- */
+export const CustomMultipleInputs = forwardRef((_a, ref) => {
+    var { label, type = "text", error, leftIcon, rightIcon, withFormControl = true, showError = true, required = false, tooltip, labelColor = "neutral.400", labelBold = false, labelSize = "sm", size = "sm", inputs, values = [], onChange } = _a, props = __rest(_a, ["label", "type", "error", "leftIcon", "rightIcon", "withFormControl", "showError", "required", "tooltip", "labelColor", "labelBold", "labelSize", "size", "inputs", "values", "onChange"]);
+    const handleChange = useCallback((index, value) => {
+        if (!onChange)
+            return;
+        const newValues = [...values];
+        newValues[index] = value;
+        onChange(newValues);
+    }, [values, onChange]);
+    const hasError = useMemo(() => {
+        return ((error === null || error === void 0 ? void 0 : error.some(Boolean)) || inputs.some((input) => !!input.error));
+    }, [error, inputs]);
+    const inputElement = (_jsxs(_Fragment, { children: [label && label.trim() !== "" && (_jsx(FormLabel, { fontSize: labelSize, children: _jsx(LabelWithTooltip, { label: label, required: required, tooltip: tooltip, labelColor: labelColor, labelBold: labelBold, labelSize: labelSize, variant: "main" }) })), _jsx(InputGroup, { size: size, sx: INPUT_GROUP_STYLES, children: _jsx(Flex, { gap: 3, w: "full", children: inputs.map((input, index) => {
+                        var _a, _b;
+                        const fieldError = (error === null || error === void 0 ? void 0 : error[index]) || input.error;
+                        const shouldShowError = (_a = input.showError) !== null && _a !== void 0 ? _a : showError;
+                        const inputValue = (_b = values[index]) !== null && _b !== void 0 ? _b : "";
+                        return (_jsx(SingleInputField, { index: index, input: input, value: inputValue, error: fieldError, shouldShowError: shouldShowError, size: size, defaultType: type, labelBold: labelBold, labelSize: labelSize, isDisabled: props.isDisabled, onChange: handleChange, inputRef: ref, inputProps: props }, index));
+                    }) }) })] }));
+    return withFormControl ? (_jsx(FormControl, { isInvalid: hasError, children: inputElement })) : (inputElement);
+});
+CustomMultipleInputs.displayName = "CustomMultipleInputs";