lsoft-ui 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Londrisoft
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,82 @@
+# Lib Front
+
+## 📋 Sobre o Projeto
+
+Este é um projeto front-end desenvolvido com React, TypeScript, oferecendo uma estrutura moderna e eficiente para desenvolvimento web.
+
+## 🚀 Tecnologias Utilizadas
+
+- [React](https://react.dev/)
+- [TypeScript](https://www.typescriptlang.org/)
+- [chakraUI](https://v2.chakra-ui.com/getting-started)
+
+## ⚙️ Pré-requisitos
+
+- Node.js (versão 14.x ou superior)
+- npm ou yarn
+
+## 🛠️ Instalação
+
+1. Clone o repositório:
+
+```bash
+git clone [URL_DO_SEU_REPOSITÓRIO]
+```
+
+````markdown:c:\Users\usuario\Documents\JS\lib-front\README.md
+2. Instale as dependências:
+```bash
+npm install
+# ou
+yarn install
+````
+
+3. Inicie o servidor de desenvolvimento:
+
+```bash
+npm run dev
+# ou
+yarn dev
+```
+
+## 📦 Scripts Disponíveis
+
+- `dev`: Inicia o servidor de desenvolvimento
+- `build`: Gera a versão de produção
+- `lint`: Executa a verificação de código com ESLint
+- `preview`: Visualiza a versão de produção localmente
+
+## 🔧 Configuração do ESLint
+
+O projeto inclui uma configuração robusta do ESLint com suporte a TypeScript. Para mais detalhes sobre a configuração, consulte o arquivo `eslint.config.js`.
+
+## 📚 Documentação
+
+### 📖 Documentação da Biblioteca
+
+- [📚 Documentação Completa dos Componentes](./docs/COMPONENTS_DOCUMENTATION.md)
+- [⚡ Guia de Referência Rápida](./docs/QUICK_REFERENCE.md)
+- [📝 Componentes de Formulário](./docs/FORM_COMPONENTS.md)
+- [🔧 Exemplos de Integração](./docs/INTEGRATION_EXAMPLES.md)
+- [📋 Documentação da CustomTable](./docs/CUSTOM_TABLE_DOCUMENTATION.md)
+- [📋 Regras de Desenvolvimento](./docs/DEVELOPMENT_RULES.md)
+
+### 🔗 Documentação Externa
+
+Para mais informações sobre as tecnologias utilizadas:
+
+- [Documentação do React](https://react.dev/)
+- [Documentação do TypeScript](https://www.typescriptlang.org/docs/)
+- [Documentação do Chakra UI](https://chakra-ui.com/)
+
+## 📝 Licença
+
+Este projeto está sob a licença MIT.
+
+---
+
+Desenvolvido com ❤️ por [@Londrisoft](https://londrisoft.com.br/)
+
+```
+
+```

package/dist/components/Accordion/CustomAccordionGroup.d.ts

@@ -0,0 +1,10 @@
+import { AccordionProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
+interface CustomAccordionGroupProps extends AccordionProps {
+    children: ReactNode;
+}
+/**
+ * Um agrupador de itens de Accordion com configuração padrão e estilização consistente com o design system.
+ */
+export declare const CustomAccordionGroup: React.FC<CustomAccordionGroupProps>;
+export {};

package/dist/components/Accordion/CustomAccordionGroup.js

@@ -0,0 +1,20 @@
+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 { Accordion } from "@chakra-ui/react";
+/**
+ * Um agrupador de itens de Accordion com configuração padrão e estilização consistente com o design system.
+ */
+export const CustomAccordionGroup = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    return (_jsx(Accordion, Object.assign({ allowMultiple: true }, props, { children: children })));
+};

package/dist/components/Accordion/CustomAccordionItem.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from "react";
+interface CustomAccordionItemProps {
+    title: string;
+    label?: string;
+    children: ReactNode;
+    bgColor?: string;
+    hoverColor?: string;
+    expandedColor?: string;
+    expandedTextColor?: string;
+}
+export declare const CustomAccordionItem: React.FC<CustomAccordionItemProps>;
+export {};

package/dist/components/Accordion/CustomAccordionItem.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AccordionItem, AccordionButton, AccordionPanel, AccordionIcon, Box, Text, } from "@chakra-ui/react";
+export const CustomAccordionItem = ({ title, label, children, bgColor = "background.secondary", hoverColor = "background.primary", expandedColor = "background.brand", expandedTextColor = "white", }) => {
+    return (_jsxs(AccordionItem, { children: [label && (_jsx(Box, { px: 4, pt: 4, children: _jsx(Text, { fontSize: "xs", fontWeight: "bold", color: "primary.300", textTransform: "uppercase", mb: 1, children: label }) })), _jsxs(AccordionButton, { px: 4, bg: bgColor, _hover: { bg: hoverColor }, _expanded: { bg: expandedColor, color: expandedTextColor }, children: [_jsx(Box, { flex: "1", textAlign: "left", fontWeight: "bold", color: "neutral.400", children: title }), _jsx(AccordionIcon, {})] }), _jsx(AccordionPanel, { px: 6, children: children })] }));
+};

package/dist/components/CustomAlertDialog.d.ts

@@ -0,0 +1,8 @@
+import { AlertDialogProps } from "@chakra-ui/react";
+type CustomAlertDialogProps = Omit<AlertDialogProps, "children"> & {
+    header?: React.ReactNode;
+    body?: React.ReactNode;
+    footer?: React.ReactNode;
+};
+export default function CustomAlertDialog({ isOpen, onClose, leastDestructiveRef, header, body, footer, ...props }: CustomAlertDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CustomAlertDialog.js

@@ -0,0 +1,18 @@
+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 { AlertDialog, AlertDialogBody, AlertDialogContent, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay } from "@chakra-ui/react";
+import { CustomButton } from "./CustomButton";
+export default function CustomAlertDialog(_a) {
+    var { isOpen, onClose, leastDestructiveRef, header, body, footer } = _a, props = __rest(_a, ["isOpen", "onClose", "leastDestructiveRef", "header", "body", "footer"]);
+    return (_jsx(AlertDialog, Object.assign({ isOpen: isOpen, leastDestructiveRef: leastDestructiveRef, onClose: onClose }, props, { children: _jsx(AlertDialogOverlay, { children: _jsxs(AlertDialogContent, { children: [header && (_jsx(AlertDialogHeader, { fontSize: 'lg', fontWeight: 'bold', children: header })), body && (_jsx(AlertDialogBody, { children: body })), footer ? (_jsx(AlertDialogFooter, { children: footer })) : (_jsxs(AlertDialogFooter, { children: [_jsx(CustomButton, { onClick: onClose, children: "Cancelar" }), _jsx(CustomButton, { onClick: onClose, ml: 3, children: "Confirmar" })] }))] }) }) })));
+}

package/dist/components/CustomAutoComplete.d.ts

@@ -0,0 +1,35 @@
+import React, { ReactNode } from "react";
+import { InputProps } from "@chakra-ui/react";
+interface Option {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+interface CustomAutocompleteProps extends Omit<InputProps, "onChange" | "onSelect"> {
+    label?: string;
+    placeholder?: string;
+    error?: string;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    showError?: boolean;
+    withFormControl?: boolean;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+    size?: "sm" | "md" | "lg";
+    options: Option[];
+    value?: string;
+    onChange?: (value: string) => void;
+    onSelect?: (option: Option) => void;
+    isLoading?: boolean;
+    noOptionsMessage?: string;
+    loadingMessage?: string;
+    minCharsToSearch?: number;
+    maxHeight?: string;
+    allowCustomValue?: boolean;
+    caseSensitive?: boolean;
+    returnValueOnSelect?: boolean;
+}
+export declare const CustomAutocomplete: React.ForwardRefExoticComponent<CustomAutocompleteProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/components/CustomAutoComplete.js

@@ -0,0 +1,141 @@
+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, { useState, useRef, useCallback, useEffect, } from "react";
+import { Box, FormControl, FormLabel, FormErrorMessage, Tooltip, Text, HStack, List, ListItem, Spinner, IconButton, useOutsideClick, } from "@chakra-ui/react";
+import { ChevronUpIcon, ChevronDownIcon, CloseIcon } from "@chakra-ui/icons";
+import { CustomInput } from "./CustomInput";
+import { Info } from "lucide-react";
+export const CustomAutocomplete = React.forwardRef((_a, ref) => {
+    var _b;
+    var { label, placeholder, error, leftIcon, rightIcon, withFormControl = true, showError = true, required = false, tooltip, labelColor, labelBold = false, size = "sm", options = [], value = "", onChange, onSelect, isLoading = false, noOptionsMessage = "Nenhuma opção encontrada", loadingMessage = "Carregando...", minCharsToSearch = 0, maxHeight = "200px", allowCustomValue = false, caseSensitive = false, returnValueOnSelect = true } = _a, // Por padrão retorna value para compatibilidade com backend
+    props = __rest(_a, ["label", "placeholder", "error", "leftIcon", "rightIcon", "withFormControl", "showError", "required", "tooltip", "labelColor", "labelBold", "size", "options", "value", "onChange", "onSelect", "isLoading", "noOptionsMessage", "loadingMessage", "minCharsToSearch", "maxHeight", "allowCustomValue", "caseSensitive", "returnValueOnSelect"]);
+    const [inputValue, setInputValue] = useState(value);
+    const [filteredOptions, setFilteredOptions] = useState([]);
+    const [selectedIndex, setSelectedIndex] = useState(-1);
+    const [isOpen, setIsOpen] = useState(false);
+    const containerRef = useRef(null);
+    const listRef = useRef(null);
+    // Filtra as opções baseado no input
+    const filterOptions = useCallback((searchTerm) => {
+        if (searchTerm.length < minCharsToSearch) {
+            return options;
+        }
+        const term = caseSensitive ? searchTerm : searchTerm.toLowerCase();
+        return options.filter((option) => {
+            const label = caseSensitive
+                ? option.label
+                : option.label.toLowerCase();
+            return label.includes(term) && !option.disabled;
+        });
+    }, [options, minCharsToSearch, caseSensitive]);
+    // Atualiza opções filtradas quando input ou options mudam
+    useEffect(() => {
+        const filtered = filterOptions(inputValue);
+        setFilteredOptions(filtered);
+        setSelectedIndex(-1);
+    }, [inputValue, filterOptions]);
+    // Sincroniza inputValue com value externo
+    useEffect(() => {
+        setInputValue(value);
+    }, [value]);
+    // Fecha dropdown quando clica fora
+    useOutsideClick({
+        ref: containerRef,
+        handler: () => setIsOpen(false),
+    });
+    // Keyboard navigation
+    const handleKeyDown = (e) => {
+        if (!isOpen && (e.key === "ArrowDown" || e.key === "Enter")) {
+            setIsOpen(true);
+            return;
+        }
+        if (!isOpen)
+            return;
+        switch (e.key) {
+            case "ArrowDown":
+                e.preventDefault();
+                setSelectedIndex((prev) => prev < filteredOptions.length - 1 ? prev + 1 : 0);
+                break;
+            case "ArrowUp":
+                e.preventDefault();
+                setSelectedIndex((prev) => prev > 0 ? prev - 1 : filteredOptions.length - 1);
+                break;
+            case "Enter":
+                e.preventDefault();
+                if (selectedIndex >= 0 && filteredOptions[selectedIndex]) {
+                    handleSelect(filteredOptions[selectedIndex]);
+                }
+                else if (allowCustomValue) {
+                    handleCustomValue();
+                }
+                break;
+            case "Escape":
+                setIsOpen(false);
+                setSelectedIndex(-1);
+                break;
+        }
+    };
+    // Scroll para o item selecionado
+    useEffect(() => {
+        if (selectedIndex >= 0 && listRef.current) {
+            const selectedElement = listRef.current.children[selectedIndex];
+            if (selectedElement) {
+                selectedElement.scrollIntoView({ block: "nearest" });
+            }
+        }
+    }, [selectedIndex]);
+    const handleInputChange = (e) => {
+        const newValue = e.target.value;
+        setInputValue(newValue);
+        setIsOpen(true);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+    };
+    const handleSelect = (option) => {
+        setInputValue(option.label);
+        setIsOpen(false);
+        setSelectedIndex(-1);
+        // Retorna value ou label baseado na prop returnValueOnSelect
+        onChange === null || onChange === void 0 ? void 0 : onChange(returnValueOnSelect ? option.value : option.label);
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(option);
+    };
+    const handleCustomValue = () => {
+        setIsOpen(false);
+        setSelectedIndex(-1);
+        onChange === null || onChange === void 0 ? void 0 : onChange(inputValue);
+    };
+    const handleInputFocus = () => {
+        if (filteredOptions.length > 0) {
+            setIsOpen(true);
+        }
+    };
+    const toggleDropdown = () => {
+        setIsOpen(!isOpen);
+        if (!isOpen) {
+            setSelectedIndex(-1);
+        }
+    };
+    const handleClear = () => {
+        setInputValue("");
+        setIsOpen(false);
+        setSelectedIndex(-1);
+        onChange === null || onChange === void 0 ? void 0 : onChange("");
+    };
+    const shouldShowDropdown = isOpen && (filteredOptions.length > 0 || isLoading);
+    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(Box, { ref: containerRef, position: "relative", overflow: "visible", children: [_jsxs(Box, { position: "relative", sx: { width: ((_b = props.style) === null || _b === void 0 ? void 0 : _b.width) || "auto" }, children: [leftIcon && (_jsx(Box, { display: "flex", alignItems: "center", position: "absolute", left: "8px", children: leftIcon })), _jsx(CustomInput, { ref: ref, value: inputValue, onChange: handleInputChange, onKeyDown: handleKeyDown, onFocus: handleInputFocus, placeholder: placeholder, leftIcon: leftIcon, size: size, _placeholder: {
+                                    color: "neutral.200",
+                                    opacity: 1
+                                }, style: Object.assign({ paddingRight: inputValue ? "80px" : "40px" }, (props.isDisabled && {
+                                    backgroundColor: "var(--chakra-colors-background-secondary)",
+                                })), isDisabled: props.isDisabled }), _jsxs(Box, { display: "flex", alignItems: "center", position: "absolute", right: "8px", top: "50%", transform: "translateY(-50%)", zIndex: 1, children: [isLoading ? (_jsx(Spinner, { size: "xs", color: "neutral.200" })) : inputValue && !props.isDisabled ? (_jsxs(HStack, { spacing: 1, children: [_jsx(IconButton, { size: "xs", variant: "ghost", icon: _jsx(CloseIcon, { boxSize: 3 }), onClick: handleClear, "aria-label": "Limpar campo", _hover: { bg: "transparent" }, color: "neutral.300", isDisabled: props.isDisabled }), _jsx(IconButton, { size: "xs", variant: "ghost", icon: isOpen ? (_jsx(ChevronUpIcon, { boxSize: 3 })) : (_jsx(ChevronDownIcon, { boxSize: 3 })), onClick: props.isDisabled ? undefined : toggleDropdown, "aria-label": "Toggle dropdown", _hover: { bg: "transparent" }, isDisabled: props.isDisabled, opacity: props.isDisabled ? 0.5 : 1, cursor: props.isDisabled ? "not-allowed" : "pointer" })] })) : (_jsx(IconButton, { size: "xs", variant: "ghost", icon: isOpen ? (_jsx(ChevronUpIcon, { boxSize: 3 })) : (_jsx(ChevronDownIcon, { boxSize: 3 })), onClick: props.isDisabled ? undefined : toggleDropdown, "aria-label": "Toggle dropdown", _hover: { bg: "transparent" }, isDisabled: props.isDisabled, opacity: props.isDisabled ? 0.5 : 1, cursor: props.isDisabled ? "not-allowed" : "pointer" })), rightIcon] })] }), shouldShowDropdown && (_jsx(Box, { position: "absolute", top: "100%", left: 0, right: 0, zIndex: 9999, bg: "background.primary", border: "1px solid", borderColor: "border.primary", borderRadius: "md", boxShadow: "lg", maxHeight: maxHeight, overflow: "hidden", mt: 1, children: _jsx(List, { ref: listRef, spacing: 0, maxHeight: "200px", overflowY: "auto", children: isLoading ? (_jsx(ListItem, { p: 3, textAlign: "center", color: "neutral.200", children: loadingMessage })) : filteredOptions.length > 0 ? (filteredOptions.map((option, index) => (_jsx(ListItem, { p: 3, cursor: "pointer", bg: selectedIndex === index ? "secondary.50" : "transparent", _hover: { bg: "background.secondary" }, onClick: () => handleSelect(option), opacity: option.disabled ? 0.5 : 1, pointerEvents: option.disabled ? "none" : "auto", children: _jsx(Text, { fontSize: "sm", color: "neutral.400", children: option.label }) }, option.value)))) : (_jsx(ListItem, { p: 3, textAlign: "center", color: "neutral.200", children: noOptionsMessage })) }) }))] }), showError && error && (_jsx(FormErrorMessage, { fontSize: "xs", mt: "3px", children: error }))] }));
+    return withFormControl ? (_jsx(FormControl, { isInvalid: !!error, children: inputElement })) : (inputElement);
+});

package/dist/components/CustomBadge.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { BadgeProps } from '@chakra-ui/react';
+interface CustomBadgeProps extends BadgeProps {
+    colorScheme?: BadgeProps['colorScheme'] | string;
+    pHorizontal?: number | string;
+    pVertical?: number | string;
+}
+export declare const CustomBadge: React.FC<CustomBadgeProps>;
+export default CustomBadge;

package/dist/components/CustomBadge.js

@@ -0,0 +1,25 @@
+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 { Badge } from '@chakra-ui/react';
+export const CustomBadge = (_a) => {
+    var { colorScheme = "alert.success", children, pHorizontal = 1.5, // Padding horizontal
+    pVertical = 1.5 } = _a, // Padding vertical
+    props = __rest(_a, ["colorScheme", "children", "pHorizontal", "pVertical"]);
+    // Se colorScheme contém ponto, usar como bg direto
+    if (typeof colorScheme === 'string' && colorScheme.includes('.')) {
+        return (_jsx(Badge, Object.assign({ bg: colorScheme, color: "background.alwaysLight", px: pHorizontal, py: pVertical, borderRadius: "4px" }, props, { children: children })));
+    }
+    // Senão, usar colorScheme normal do Chakra
+    return (_jsx(Badge, Object.assign({ colorScheme: colorScheme, px: pHorizontal, py: pVertical }, props, { children: children })));
+};
+export default CustomBadge;

package/dist/components/CustomButton.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { ButtonProps } from "@chakra-ui/react";
+export interface CustomButtonProps extends ButtonProps {
+    variant?: "primary" | "secondary" | "outline" | "link" | "unstyled" | "solid" | "ghost";
+    isLoading?: boolean;
+    disabled?: boolean;
+    leftIcon?: React.ReactElement;
+    rightIcon?: React.ReactElement;
+    children: React.ReactNode;
+    backgroundColor?: string;
+    color?: string;
+    borderColor?: string;
+    width?: string;
+    style?: React.CSSProperties;
+}
+export declare const CustomButton: React.FC<CustomButtonProps>;

package/dist/components/CustomButton.js

@@ -0,0 +1,18 @@
+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 { Button } from "@chakra-ui/react";
+export const CustomButton = (_a) => {
+    var { variant = "outline", // Variante padrão
+    isLoading = false, disabled = false, leftIcon, rightIcon, children, backgroundColor = "primary.300", color, borderColor, width, style } = _a, props = __rest(_a, ["variant", "isLoading", "disabled", "leftIcon", "rightIcon", "children", "backgroundColor", "color", "borderColor", "width", "style"]);
+    return (_jsx(Button, Object.assign({ isLoading: isLoading, isDisabled: disabled, leftIcon: leftIcon, rightIcon: rightIcon, width: width, backgroundColor: backgroundColor, borderColor: borderColor, variant: variant, color: color ? color : "background.alwaysLight", _hover: { backgroundColor: backgroundColor, opacity: 0.7 }, borderRadius: "4px" }, props, { children: children })));
+};

package/dist/components/CustomCard.d.ts

@@ -0,0 +1,11 @@
+import { CardProps } from "@chakra-ui/react";
+type CustomCardProps = CardProps & {
+    header?: React.ReactNode;
+    body?: React.ReactNode;
+    footer?: React.ReactNode;
+    maxWidth?: string | number;
+    borderRadius?: string | number;
+    style?: React.CSSProperties;
+};
+export default function CustomCard({ header, body, footer, maxWidth, borderRadius, style, ...props }: CustomCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CustomCard.js

@@ -0,0 +1,20 @@
+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 { Card, CardBody, CardFooter, CardHeader, } from "@chakra-ui/react";
+export default function CustomCard(_a) {
+    var { header, body, footer, maxWidth = "sm", borderRadius = "lg", style } = _a, props = __rest(_a, ["header", "body", "footer", "maxWidth", "borderRadius", "style"]);
+    return (_jsxs(Card, Object.assign({ maxW: maxWidth, borderRadius: borderRadius, style: style, overflow: "hidden" }, props, { sx: { border: `1px solid`, borderColor: "border.secondary" }, children: [header && _jsx(CardHeader, { children: header }), body && _jsx(CardBody, { children: body }), footer && (_jsx(CardFooter, { sx: {
+                    borderTop: "1px solid",
+                    borderColor: "neutral.50",
+                }, children: footer }))] })));
+}

package/dist/components/CustomCheckBox.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { CheckboxProps } from "@chakra-ui/react";
+export default interface CustomCheckboxProps extends CheckboxProps {
+    label?: React.ReactNode;
+    helperText?: React.ReactNode;
+    error?: string;
+    required?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+}
+export declare const CustomCheckbox: React.ForwardRefExoticComponent<CustomCheckboxProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/CustomCheckBox.js

@@ -0,0 +1,26 @@
+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 { forwardRef, useId } from "react";
+import { Checkbox, FormControl, FormErrorMessage, FormHelperText, FormLabel, HStack, Text, Tooltip, } from "@chakra-ui/react";
+import { Info } from "lucide-react";
+export const CustomCheckbox = forwardRef((_a, ref) => {
+    var { id, label, helperText, error, isRequired, isDisabled, children, required = false, tooltip, labelColor = "neutral.400", labelBold = true } = _a, checkboxProps = __rest(_a, ["id", "label", "helperText", "error", "isRequired", "isDisabled", "children", "required", "tooltip", "labelColor", "labelBold"]);
+    // Gera um ID único se não for fornecido via props
+    const generatedId = useId();
+    const checkboxId = id !== null && id !== void 0 ? id : `custom-checkbox-${generatedId}`;
+    return (_jsxs(FormControl, { isInvalid: !!error, isDisabled: isDisabled, children: [label && (_jsx(FormLabel, { htmlFor: checkboxId, fontSize: "sm", children: _jsxs(HStack, { spacing: 1, align: "center", children: [_jsx(Text, { color: labelColor, fontWeight: labelBold ? "bold" : "normal", children: label }), (required || isRequired) && (_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(Checkbox, Object.assign({ id: checkboxId, ref: ref }, checkboxProps, { borderColor: "primary.300", _focusVisible: {
+                    ring: 1,
+                    ringColor: "primary.300",
+                }, children: children })), helperText && !error && (_jsx(FormHelperText, { fontSize: "xs", children: helperText })), error && _jsx(FormErrorMessage, { fontSize: "xs", mt: "3px", children: error })] }));
+});
+CustomCheckbox.displayName = "CustomCheckbox";

package/dist/components/CustomCheckboxGroup.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+import { CheckboxGroupProps } from "@chakra-ui/react";
+export interface CheckboxOption {
+    label?: string;
+    value: string;
+}
+export interface CustomCheckboxGroupProps extends Omit<CheckboxGroupProps, "children"> {
+    label?: React.ReactNode;
+    helperText?: React.ReactNode;
+    error?: string;
+    options: CheckboxOption[];
+    fieldSize?: "sm" | "md" | "lg";
+    direction?: "row" | "column";
+    spacing?: number | string;
+    isDisabled?: boolean;
+    tooltip?: string;
+    labelColor?: string;
+    labelBold?: boolean;
+}
+export declare const CustomCheckboxGroup: React.ForwardRefExoticComponent<CustomCheckboxGroupProps & React.RefAttributes<HTMLDivElement>>;
+export default CustomCheckboxGroup;

package/dist/components/CustomCheckboxGroup.js

@@ -0,0 +1,28 @@
+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 { forwardRef, useId } from "react";
+import { CheckboxGroup, FormControl, FormLabel, FormHelperText, FormErrorMessage, Stack, Tooltip, Text, HStack, } from "@chakra-ui/react";
+import { CustomCheckbox } from "./CustomCheckBox";
+import { Info } from "lucide-react";
+export const CustomCheckboxGroup = forwardRef((_a, ref) => {
+    var { label, helperText, error, options, fieldSize = "sm", direction = "column", spacing = 4, isDisabled = false, tooltip, labelColor = "neutral.400", labelBold = true } = _a, groupProps = __rest(_a, ["label", "helperText", "error", "options", "fieldSize", "direction", "spacing", "isDisabled", "tooltip", "labelColor", "labelBold"]);
+    // id base para o grupo e para cada checkbox
+    const generatedId = useId();
+    const groupId = `checkbox-group-${generatedId}`;
+    return (_jsxs(FormControl, { ref: ref, id: groupId, isInvalid: !!error, isDisabled: isDisabled, children: [label && (_jsx(FormLabel, { htmlFor: groupId, fontSize: "sm", children: _jsxs(HStack, { spacing: 1, align: "center", children: [_jsx(Text, { color: labelColor, fontWeight: labelBold ? "bold" : "normal", children: label }), tooltip && (_jsx(Tooltip, { label: tooltip, placement: "top", hasArrow: true, children: _jsx(Info, { color: "var(--chakra-colors-alert-warning)", width: "16px", height: "16px" }) }))] }) })), _jsx(CheckboxGroup, Object.assign({}, groupProps, { children: _jsx(Stack, { direction: direction, spacing: spacing, children: options.map((option) => {
+                        var _a;
+                        return (_jsx(CustomCheckbox, { id: `${groupId}-${option.value}`, value: option.value.toString(), size: fieldSize, isDisabled: isDisabled, children: (_a = option.label) !== null && _a !== void 0 ? _a : option.value }, option.value));
+                    }) }) })), helperText && !error && (_jsx(FormHelperText, { fontSize: "xs", children: helperText })), error && _jsx(FormErrorMessage, { fontSize: "xs", mt: "3px", children: error })] }));
+});
+CustomCheckboxGroup.displayName = "CustomCheckboxGroup";
+export default CustomCheckboxGroup;

package/dist/components/CustomDrawer.d.ts

@@ -0,0 +1,11 @@
+import { DrawerProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
+type CustomDrawerProps = Omit<DrawerProps, "children"> & {
+    header?: ReactNode;
+    footer?: ReactNode;
+    children?: ReactNode;
+    showCloseButton?: boolean;
+    contentProps?: Record<string, any>;
+};
+declare const CustomDrawer: React.FC<CustomDrawerProps>;
+export default CustomDrawer;

package/dist/components/CustomDrawer.js

@@ -0,0 +1,36 @@
+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 { Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, DrawerHeader, DrawerOverlay, Text, } from "@chakra-ui/react";
+import styled from "@emotion/styled";
+const CustomDrawer = (_a) => {
+    var { isOpen, onClose, placement = "right", header, footer, children, showCloseButton = true, contentProps } = _a, rest = __rest(_a, ["isOpen", "onClose", "placement", "header", "footer", "children", "showCloseButton", "contentProps"]);
+    return (_jsxs(Drawer, Object.assign({ isOpen: isOpen, placement: placement, onClose: onClose }, rest, { children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerContent, Object.assign({}, contentProps, { children: [showCloseButton && _jsx(DrawerCloseButton, { color: "neutral.100" }), header && (_jsxs(CustomDrawerHeader, { children: [_jsx(Text, { fontSize: "sm", color: "primary.300", fontWeight: "bold", children: header }), _jsx(Divider, { borderColor: "primary.300" })] })), _jsx(CustomDrawerContent, { children: children }), footer && _jsx(CustomDrawerFooter, { children: footer })] }))] })));
+};
+export default CustomDrawer;
+const CustomDrawerHeader = styled(DrawerHeader) `
+  background-color: var(--chakra-colors-background-primary);
+  padding-left: 18px;
+  padding-right: 18px;
+  padding-top: 26px;
+`;
+const CustomDrawerContent = styled(DrawerBody) `
+  background-color: var(--chakra-colors-background-primary);
+  padding-left: 18px;
+  padding-right: 18px;
+  padding-top: 0px;
+`;
+const CustomDrawerFooter = styled(DrawerFooter) `
+  background-color: var(--chakra-colors-background-secondary);
+  padding-right: 18px;
+  padding-left: 18px;
+`;

package/dist/components/CustomIconButton.d.ts

@@ -0,0 +1,7 @@
+import { IconButtonProps } from "@chakra-ui/react";
+interface CustomIconButtonProps extends IconButtonProps {
+    colorScheme?: string;
+    borderColor?: string;
+}
+declare const CustomIconButton: React.FC<CustomIconButtonProps>;
+export default CustomIconButton;