@zauru-sdk/components 1.0.51 → 1.0.53

package/dist/cjs/Table/ZauruTable.js

@@ -0,0 +1,177 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ZauruTable = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@remix-run/react");
+const react_2 = require("react");
+const react_data_table_component_1 = require("react-data-table-component");
+const icons_1 = require("@zauru-sdk/icons");
+const ReactDataTableComponent = __importStar(require("react-data-table-component"));
+const DataTable = ReactDataTableComponent.default;
+const customStyles = {
+    headCells: {
+        style: {
+            color: "#202124",
+            fontSize: "14px",
+            justifyContent: "left", // Alinea el texto a la izquierda
+            whiteSpace: "normal", // Permite el ajuste de texto
+            wordBreak: "break-word", // Asegura que las palabras se rompan correctamente para evitar desbordamientos
+            maxWidth: "150px", // Establece un ancho máximo para las celdas del encabezado
+        },
+    },
+    rows: {
+        highlightOnHoverStyle: {
+            backgroundColor: "rgb(230, 244, 244)",
+            borderBottomColor: "#FFFFFF",
+            borderRadius: "25px",
+            outline: "1px solid #FFFFFF",
+        },
+    },
+    pagination: {
+        style: {
+            border: "none",
+        },
+    },
+};
+(0, react_data_table_component_1.createTheme)("solarized", {
+    text: {
+        primary: "#002b36",
+        secondary: "#002b36",
+    },
+    background: {
+        default: "#f9f9f9",
+    },
+    context: {
+        background: "#cb4b16",
+        text: "#555555",
+    },
+    divider: {
+        default: "#e2e4ff",
+    },
+    action: {
+        button: "rgba(0,0,0,.54)",
+        hover: "rgba(0,0,0,.08)",
+        disabled: "rgba(0,0,0,.12)",
+    },
+    headRow: {
+        background: "black",
+    },
+});
+(0, react_data_table_component_1.createTheme)("subTable", {
+    text: {
+        primary: "#002b36",
+        secondary: "#002b36",
+    },
+    background: {
+        default: "#e9e9e9",
+    },
+    context: {
+        background: "#cb4b16",
+        text: "#555555",
+    },
+    divider: {
+        default: "#e2e4ff",
+    },
+    action: {
+        button: "rgba(0,0,0,.54)",
+        hover: "rgba(0,0,0,.08)",
+        disabled: "rgba(0,0,0,.12)",
+    },
+    headRow: {
+        background: "black",
+    },
+});
+//Documentación de la tabla https://react-data-table-component.netlify.app/?path=/docs/getting-started-intro--docs
+const ZauruTable = (props) => {
+    const { columns, conditionalRowStyles, data, loading = false, pagination, search, expandable, theme, className, offlineSearch = [], whitOutPagination = false, ...others } = props;
+    const [, setSearchParams] = (0, react_1.useSearchParams)({
+        page: "1",
+        perPage: "10",
+        search: "",
+    });
+    const [filteredData, setFilteredData] = (0, react_2.useState)(data);
+    const [showTable, setShowTable] = (0, react_2.useState)(false);
+    (0, react_2.useEffect)(() => {
+        setShowTable(true);
+    }, []);
+    (0, react_2.useEffect)(() => {
+        setFilteredData(data);
+    }, [data]);
+    const subHeaderComponentMemo = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { name: "search", type: "text", placeholder: search?.placeholderSearch ?? "Filtrar", "aria-label": "Search Input", className: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg px-2", onChange: (event) => {
+                    const searchTerm = event.target.value;
+                    if (offlineSearch.length > 0) {
+                        filterData(searchTerm);
+                    }
+                }, onBlur: (event) => {
+                    const searchTerm = event.target.value;
+                    if (offlineSearch.length <= 0 && search) {
+                        setSearchParams((prevState) => ({
+                            ...Object.fromEntries(prevState),
+                            search: searchTerm,
+                        }));
+                    }
+                } }), (0, jsx_runtime_1.jsx)("button", { type: "button", name: "search", className: "px-2 font-bold", children: (0, jsx_runtime_1.jsx)(icons_1.SearchSVG, {}) })] }));
+    const filterData = (searchTerm) => {
+        if (!searchTerm || !offlineSearch || offlineSearch.length === 0) {
+            setFilteredData(data);
+            return;
+        }
+        const filtered = data.filter((item) => offlineSearch.some((field) => item[field] &&
+            item[field]
+                .toString()
+                .toLowerCase()
+                .includes(searchTerm.toLowerCase())));
+        setFilteredData(filtered);
+    };
+    const handlePageChange = (page) => {
+        //hacer el fetch de más datos
+        setSearchParams((prevState) => ({
+            ...Object.fromEntries(prevState),
+            page: page.toString(),
+        }));
+    };
+    const handlePerRowsChange = async (newPerPage, page) => {
+        //hacer el fetch de más datos
+        setSearchParams((prevState) => ({
+            ...Object.fromEntries(prevState),
+            perPage: newPerPage.toString(),
+        }));
+    };
+    if (!showTable) {
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "Loading..." });
+    }
+    //Textos en español de la tabla
+    const paginationComponentOptions = {
+        rowsPerPageText: "Filas por página",
+        rangeSeparatorText: "de",
+        selectAllRowsItem: true,
+        selectAllRowsItemText: "Todos",
+    };
+    const loadSubHeader = !!(search || offlineSearch.length > 0);
+    const subHeaderComponent = loadSubHeader ? subHeaderComponentMemo : undefined;
+    return ((0, jsx_runtime_1.jsx)(DataTable, { className: className, subHeaderWrap: true, theme: theme ?? "solarized", columns: columns, conditionalRowStyles: conditionalRowStyles, data: filteredData, customStyles: customStyles, progressPending: loading, highlightOnHover: true, pointerOnHover: true, dense: true, striped: true, pagination: !whitOutPagination, persistTableHead: true, responsive: true, noHeader: true, expandableRows: !!expandable, expandableRowExpanded: expandable ? expandable.expandableRowExpanded : undefined, expandableRowsComponent: expandable ? expandable.expandableRowsComponent : undefined, subHeader: loadSubHeader, subHeaderComponent: subHeaderComponent, paginationServer: !!pagination, paginationTotalRows: pagination ? pagination.totalRows : undefined, onChangeRowsPerPage: pagination ? handlePerRowsChange : undefined, onChangePage: pagination ? handlePageChange : undefined, paginationComponentOptions: paginationComponentOptions, paginationRowsPerPageOptions: pagination?.rowsPerPageOptions ? pagination.rowsPerPageOptions : [10], ...others }));
+};
+exports.ZauruTable = ZauruTable;

package/dist/cjs/Table/index.js

@@ -0,0 +1,17 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ZauruTable.js"), exports);

package/dist/cjs/TaskList/TaskList.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TaskList = exports.Task = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Task = ({ task }) => {
+    const [isDescriptionOpen, setIsDescriptionOpen] = (0, react_1.useState)(false);
+    let statusIcon;
+    let taskStyle = {};
+    let bgColor;
+    switch (task.status) {
+        case "waiting":
+            statusIcon = "🕗"; // Icono de reloj (como un ejemplo, puedes reemplazarlo con un ícono o SVG real)
+            taskStyle = { opacity: 0.5 }; // estilo disabled
+            bgColor = "bg-gray-200"; // Color de fondo gris
+            break;
+        case "processing":
+            statusIcon = "⏳"; // Icono de reloj de arena
+            taskStyle = { fontWeight: "bold" }; // estilo negrita
+            bgColor = "bg-blue-200"; // Color de fondo azul
+            break;
+        case "done":
+            statusIcon = "✅"; // Icono de check
+            bgColor = "bg-green-200"; // Color de fondo verde
+            break;
+        case "error":
+            statusIcon = "❌"; // Icono de cruz
+            taskStyle = { color: "red" }; // estilo color rojo
+            bgColor = "bg-red-200"; // Color de fondo rojo
+            break;
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { style: taskStyle, className: `${bgColor} rounded-lg p-3 mb-3 ${task.description ? "cursor-pointer" : ""}`, onClick: () => task.description && setIsDescriptionOpen(!isDescriptionOpen), children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { children: [statusIcon, " ", task.title, " ", `${task.status === "processing" ? "..." : ""}`] }), task.description && (0, jsx_runtime_1.jsx)("div", { children: "\u25BC" })] }), task.description && isDescriptionOpen && ((0, jsx_runtime_1.jsx)("div", { className: "mt-2", children: task.description }))] }));
+};
+exports.Task = Task;
+const TaskList = ({ tasks }) => {
+    const completedTasks = tasks.filter((task) => task.status === "done" || task.status === "error").length;
+    const progressPercentage = (completedTasks / tasks.length) * 100;
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [tasks.map((task, index) => ((0, jsx_runtime_1.jsx)(exports.Task, { task: task }, index))), (0, jsx_runtime_1.jsx)("div", { className: "h-2 bg-gray-200 rounded-lg mt-3", children: (0, jsx_runtime_1.jsx)("div", { className: "bg-green-500 h-full rounded-lg", style: { width: `${progressPercentage}%`, transition: "width 0.5s" } }) })] }));
+};
+exports.TaskList = TaskList;

package/dist/cjs/TaskList/index.js

@@ -0,0 +1,17 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./TaskList.js"), exports);

package/dist/cjs/Titles/LabelArray.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LabelArray = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+//Component to show all information in an array
+const LabelArray = ({ info }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "divide-y divide-gray-100", children: info?.map((x) => {
+            return ((0, jsx_runtime_1.jsxs)("div", { className: "my-1 pt-2", children: [(0, jsx_runtime_1.jsxs)("p", { className: "inline font-bold text-lg", children: [x?.label, ": "] }), (0, jsx_runtime_1.jsx)("p", { className: "inline text-lg", children: x?.value })] }, x?.label));
+        }) }));
+};
+exports.LabelArray = LabelArray;

package/dist/cjs/Titles/TableColumnTitle.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableColumnTitle = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+//column title for datatables
+const TableColumnTitle = ({ textContent }) => {
+    return ((0, jsx_runtime_1.jsx)("p", { className: "font-bold text-sm line-clamp-3 text-center", children: textContent }));
+};
+exports.TableColumnTitle = TableColumnTitle;

package/dist/cjs/Titles/TitleH1.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleH1 = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+//H1 Title Component
+const TitleH1 = ({ texto }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "mb-1", children: (0, jsx_runtime_1.jsx)("h1", { className: "text-4xl font-bold leading-normal mt-0 mb-2 text-zinc-800", children: texto }) }));
+};
+exports.TitleH1 = TitleH1;

package/dist/cjs/Titles/TitleH2.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleH2 = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+//H2 Title Component
+const TitleH2 = ({ texto }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "py-1 ", children: (0, jsx_runtime_1.jsx)("h2", { className: "text-2xl font-bold leading-normal mt-0 mb-2 text-zinc-800", children: texto }) }));
+};
+exports.TitleH2 = TitleH2;

package/dist/cjs/Titles/TitleH3.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleH3 = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+//H3 Title Component
+const TitleH3 = ({ texto }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "py-1 ", children: (0, jsx_runtime_1.jsx)("h3", { className: "text-xl leading-normal mt-0 mb-2 text-zinc-800", children: texto }) }));
+};
+exports.TitleH3 = TitleH3;

package/dist/cjs/Titles/index.js

@@ -0,0 +1,21 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./LabelArray.js"), exports);
+__exportStar(require("./TableColumnTitle.js"), exports);
+__exportStar(require("./TitleH1.js"), exports);
+__exportStar(require("./TitleH2.js"), exports);
+__exportStar(require("./TitleH3.js"), exports);

package/dist/cjs/Tooltip/Tooltip.js

@@ -0,0 +1,18 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tooltip = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Tooltip = ({ children, text }) => {
+    const [show, setShow] = (0, react_1.useState)(false);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "relative inline-block", children: [(0, jsx_runtime_1.jsx)("div", { onMouseEnter: () => setShow(true), onMouseLeave: () => setShow(false), children: children }), show && ((0, jsx_runtime_1.jsxs)("div", { className: "absolute z-10 bg-gray-700 text-white px-2 py-1 rounded-md bottom-full left-1/2 transform -translate-x-1/2", style: { whiteSpace: "nowrap", height: "2rem" }, children: [text, (0, jsx_runtime_1.jsx)("div", { className: "absolute top-full left-1/2 transform -translate-x-1/2", style: {
+                            width: "0",
+                            height: "0",
+                            borderTop: "6px solid transparent",
+                            borderLeft: "6px solid transparent",
+                            borderRight: "6px solid transparent",
+                            borderBottom: "6px solid gray",
+                        } })] }))] }));
+};
+exports.Tooltip = Tooltip;

package/dist/cjs/Tooltip/index.js

@@ -0,0 +1,17 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Tooltip.js"), exports);

package/dist/cjs/WithTooltip/WithTooltip.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WithTooltip = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const WithTooltip = (props) => {
+    const { children, text } = props;
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("span", { className: "group relative", children: [children, (0, jsx_runtime_1.jsx)("span", { className: "pointer-events-none absolute -top-10 left-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-black px-2 py-1 text-white opacity-0 transition z-50 before:absolute before:left-1/2 before:top-full before:-translate-x-1/2 before:border-4 before:border-transparent before:border-t-black before:content-[''] group-hover:opacity-100 before:z-50", children: text })] }) }));
+};
+exports.WithTooltip = WithTooltip;

package/dist/cjs/WithTooltip/index.js

@@ -0,0 +1,17 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./WithTooltip.js"), exports);

package/dist/cjs/Wizards/StepWizard.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StepWizardComponent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const index_js_1 = require("../Skeletons/index.js");
+const StepWizardComponent = ({ steps, showStepName = false, loading = false, }) => {
+    const [currentStep, setCurrentStep] = (0, react_1.useState)(0);
+    if (loading) {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "lg:grid lg:grid-cols-10 gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "lg:col-span-2", children: [(0, jsx_runtime_1.jsx)("select", { className: "lg:hidden mb-5 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm rounded-md", children: (0, jsx_runtime_1.jsx)("option", {}) }), (0, jsx_runtime_1.jsx)("div", { className: "hidden lg:block", children: (0, jsx_runtime_1.jsx)(index_js_1.LoadingInputSkeleton, {}) })] }), (0, jsx_runtime_1.jsx)("div", { className: "lg:col-span-8", children: (0, jsx_runtime_1.jsx)(index_js_1.LoadingInputSkeleton, {}) })] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "lg:grid lg:grid-cols-10 gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "lg:col-span-2", children: [(0, jsx_runtime_1.jsx)("select", { className: "lg:hidden mb-5 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm rounded-md", onChange: (e) => setCurrentStep(parseInt(e.target.value)), value: currentStep, children: steps.map((step, index) => ((0, jsx_runtime_1.jsx)("option", { value: index, children: showStepName ? step.stepName : `Step ${index + 1}` }, index))) }), (0, jsx_runtime_1.jsx)("div", { className: "scroll-hidden hidden lg:block", children: steps.map((step, index) => ((0, jsx_runtime_1.jsx)("div", { onClick: () => setCurrentStep(index), className: `py-2 px-4 mt-5 cursor-pointer rounded ${currentStep === index
+                                ? "bg-blue-500 text-white"
+                                : "text-blue-500 hover:bg-gray-100 border border-gray-300"} ${showStepName
+                                ? "text-wrap break-words"
+                                : "rounded-full w-8 h-8 flex items-center justify-center"}`, children: showStepName ? step.stepName : index + 1 }, index))) })] }), (0, jsx_runtime_1.jsx)("div", { className: "lg:col-span-8", children: steps.map((step, index) => ((0, jsx_runtime_1.jsx)("div", { className: currentStep === index ? "block" : "hidden", children: step.component }, index))) })] }));
+};
+exports.StepWizardComponent = StepWizardComponent;

package/dist/cjs/Wizards/index.js

@@ -0,0 +1,17 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./StepWizard.js"), exports);

package/dist/cjs/Zendesk/Chat.js

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Zendesk = exports.ZendeskAPI = exports.logoutFromZendesk = void 0;
+const react_1 = require("react");
+const canUseDOM = () => {
+    if (typeof window === "undefined" ||
+        !window.document ||
+        !window.document.createElement) {
+        return false;
+    }
+    return true;
+};
+const logoutFromZendesk = () => {
+    if (canUseDOM() && window.zE) {
+        window.zE("messenger", "logoutUser");
+    }
+    else {
+        console.warn("Zendesk is not initialized yet");
+    }
+};
+exports.logoutFromZendesk = logoutFromZendesk;
+const ZendeskAPI = (...args) => {
+    if (canUseDOM() && window.zE) {
+        window.zE.apply(null, args);
+    }
+    else {
+        console.warn("Zendesk is not initialized yet");
+    }
+};
+exports.ZendeskAPI = ZendeskAPI;
+const Zendesk = (props) => {
+    const { defer, configuration, token, ...other } = props;
+    (0, react_1.useEffect)(() => {
+        const insertScript = () => {
+            const zendeskScript = document.createElement("script");
+            if (defer) {
+                zendeskScript.defer = true;
+            }
+            else {
+                zendeskScript.async = true;
+            }
+            zendeskScript.id = "ze-snippet";
+            zendeskScript.src = `https://static.zdassets.com/ekr/snippet.js?key=${configuration.zendeskChatKey}`;
+            zendeskScript.addEventListener("load", () => {
+                if (props.onLoaded) {
+                    props.onLoaded();
+                }
+                window.zE("messenger", "loginUser", function (callback) {
+                    callback(token);
+                });
+            });
+            document.body.appendChild(zendeskScript);
+            return zendeskScript; // Devolvemos la referencia del script
+        };
+        let script; // Guardamos la referencia del script aquí
+        if (canUseDOM() && !window.zE) {
+            script = insertScript();
+            window.zESettings = other;
+        }
+        return () => {
+            if (script) {
+                // Si el script existe, lo eliminamos del DOM
+                script.remove();
+            }
+        };
+    }, [props, defer, other, configuration, token]);
+    return null;
+};
+exports.Zendesk = Zendesk;

package/dist/cjs/Zendesk/index.js

@@ -0,0 +1,18 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Chat.js"), exports);
+__exportStar(require("./zendesk.config.js"), exports);

package/dist/cjs/Zendesk/zendesk.config.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.zendeskJwt = void 0;
+const jsonwebtoken_1 = __importDefault(require("jsonwebtoken"));
+function zendeskJwt(current_user, configuration) {
+    // get the INFO
+    const jwtSecret = configuration.zendeskJWTSecret;
+    const jwtKey = configuration.zendeskJWTKey;
+    const expiresIn = Math.floor(Date.now() / 1000) + 60 * 60 * 24; // Expires in 1 day
+    // create the payload
+    const payload = {
+        external_id: "z" +
+            current_user.selected_entity_id.toString() +
+            "-" +
+            current_user.id.toString(),
+        email: current_user.email,
+        name: current_user.name,
+        organization_id: current_user.selected_entity_id.toString(),
+        scope: "user",
+        exp: expiresIn,
+    };
+    const jwtHeader = { kid: jwtKey, typ: "JWT", alg: "HS256" };
+    return jsonwebtoken_1.default.sign(payload, jwtSecret, {
+        algorithm: "HS256",
+        header: jwtHeader,
+    });
+}
+exports.zendeskJwt = zendeskJwt;

package/dist/cjs/index.js

@@ -0,0 +1,40 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Alerts/index.js"), exports);
+__exportStar(require("./BlockUI/index.js"), exports);
+__exportStar(require("./Buttons/index.js"), exports);
+__exportStar(require("./Card/index.js"), exports);
+__exportStar(require("./ConnectionState/index.js"), exports);
+__exportStar(require("./Chat/index.js"), exports);
+__exportStar(require("./Containers/index.js"), exports);
+__exportStar(require("./DynamicTable/index.js"), exports);
+__exportStar(require("./Footer/index.js"), exports);
+__exportStar(require("./Form/index.js"), exports);
+__exportStar(require("./Labels/index.js"), exports);
+__exportStar(require("./Layouts/index.js"), exports);
+__exportStar(require("./LineSeparator/index.js"), exports);
+__exportStar(require("./Modal/index.js"), exports);
+__exportStar(require("./NavBar/index.js"), exports);
+__exportStar(require("./Skeletons/index.js"), exports);
+__exportStar(require("./Tab/index.js"), exports);
+__exportStar(require("./Table/index.js"), exports);
+__exportStar(require("./TaskList/index.js"), exports);
+__exportStar(require("./Titles/index.js"), exports);
+__exportStar(require("./Tooltip/index.js"), exports);
+__exportStar(require("./WithTooltip/index.js"), exports);
+__exportStar(require("./Wizards/index.js"), exports);
+__exportStar(require("./Zendesk/index.js"), exports);

package/dist/cjs/tailwind.config.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+module.exports = {
+    content: ["./app/**/*.{ts,tsx,jsx,js}"],
+    theme: {
+        extend: {},
+    },
+    plugins: [require("@tailwindcss/forms")],
+};

package/dist/{Table → esm/Table}/ZauruTable.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useSearchParams } from "@remix-run/react";
 import { useEffect, useState } from "react";
-import DataTable, { createTheme } from "react-data-table-component";
+import { createTheme } from "react-data-table-component";
 import { SearchSVG } from "@zauru-sdk/icons";
+import * as ReactDataTableComponent from "react-data-table-component";
+const DataTable = ReactDataTableComponent.default;
 const customStyles = {
     headCells: {
         style: {