@zauru-sdk/components 1.0.26 → 1.0.28

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.0.28](https://github.com/intuitiva/zauru-typescript-sdk/compare/v1.0.27...v1.0.28) (2024-03-25)
+
+**Note:** Version bump only for package @zauru-sdk/components
+
+
+
+
+
+## [1.0.27](https://github.com/intuitiva/zauru-typescript-sdk/compare/v1.0.26...v1.0.27) (2024-03-25)
+
+**Note:** Version bump only for package @zauru-sdk/components
+
+
+
+
+
 ## [1.0.26](https://github.com/intuitiva/zauru-typescript-sdk/compare/v1.0.25...v1.0.26) (2024-03-25)
 
 **Note:** Version bump only for package @zauru-sdk/components

package/dist/Alerts/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./ErrorBoundaryAlert/ErrorBoundaryAlert";
-export * from "./StaticAlert";
+export * from "./ErrorBoundaryAlert/ErrorBoundaryAlert.js";
+export * from "./StaticAlert.js";

package/dist/Alerts/index.js

@@ -1,2 +1,2 @@
-export * from "./ErrorBoundaryAlert/ErrorBoundaryAlert";
-export * from "./StaticAlert";
+export * from "./ErrorBoundaryAlert/ErrorBoundaryAlert.js";
+export * from "./StaticAlert.js";

package/dist/BlockUI/index.d.ts

@@ -1 +1 @@
-export * from "./BlockUI";
+export * from "./BlockUI.js";

package/dist/BlockUI/index.js

@@ -1 +1 @@
-export * from "./BlockUI";
+export * from "./BlockUI.js";

package/dist/Buttons/index.d.ts

@@ -1 +1 @@
-export * from "./Button";
+export * from "./Button.js";

package/dist/Buttons/index.js

@@ -1 +1 @@
-export * from "./Button";
+export * from "./Button.js";

package/dist/Card/index.d.ts

@@ -1 +1 @@
-export * from "./Card";
+export * from "./Card.js";

package/dist/Card/index.js

@@ -1 +1 @@
-export * from "./Card";
+export * from "./Card.js";

package/dist/Chat/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./ChatLayout";
-export * from "./ChatMessageHistory";
+export * from "./ChatLayout.js";
+export * from "./ChatMessageHistory.js";

package/dist/Chat/index.js

@@ -1,2 +1,2 @@
-export * from "./ChatLayout";
-export * from "./ChatMessageHistory";
+export * from "./ChatLayout.js";
+export * from "./ChatMessageHistory.js";

package/dist/ConnectionState/index.d.ts

@@ -1 +1 @@
-export * from "./ConnectionState";
+export * from "./ConnectionState.js";

package/dist/ConnectionState/index.js

@@ -1 +1 @@
-export * from "./ConnectionState";
+export * from "./ConnectionState.js";

package/dist/Containers/index.d.ts

@@ -1,7 +1,7 @@
-export * from "./BodyContainer";
-export * from "./ButtonSectionContainer";
-export * from "./Container";
-export * from "./DoubleContainer";
-export * from "./MainContainer";
-export * from "./OutletContainer";
-export * from "./SubContainer";
+export * from "./BodyContainer.js";
+export * from "./ButtonSectionContainer.js";
+export * from "./Container.js";
+export * from "./DoubleContainer.js";
+export * from "./MainContainer.js";
+export * from "./OutletContainer.js";
+export * from "./SubContainer.js";

package/dist/Containers/index.js

@@ -1,7 +1,7 @@
-export * from "./BodyContainer";
-export * from "./ButtonSectionContainer";
-export * from "./Container";
-export * from "./DoubleContainer";
-export * from "./MainContainer";
-export * from "./OutletContainer";
-export * from "./SubContainer";
+export * from "./BodyContainer.js";
+export * from "./ButtonSectionContainer.js";
+export * from "./Container.js";
+export * from "./DoubleContainer.js";
+export * from "./MainContainer.js";
+export * from "./OutletContainer.js";
+export * from "./SubContainer.js";

package/dist/DynamicTable/DynamicPrintTable.d.ts

@@ -19,5 +19,5 @@ type Props = {
         getTableState: (updatedData?: ReactNode[][]) => TableStateItem[] | undefined;
     }>;
 };
-declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<unknown>>;
-export default _default;
+export declare const DynamicPrintTable: ({ forwardedRef, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/DynamicTable/DynamicPrintTable.js

@@ -7,7 +7,7 @@ const errorAnimation = {
     hidden: { opacity: 0, y: -10 },
     visible: { opacity: 1, y: 0 },
 };
-const DynamicPrintTable = ({ forwardedRef, ...props }) => {
+export const DynamicPrintTable = ({ forwardedRef, ...props }) => {
     const { items, onChange, className } = props;
     const { formValidations } = useAppSelector((state) => state.formValidation);
     const createItemSelect = (rowIndex, defaultValue) => (_jsx(SelectFieldWithoutValidation, { name: "item_select", isClearable: true, onChange: (value) => {
@@ -129,4 +129,3 @@ const DynamicPrintTable = ({ forwardedRef, ...props }) => {
                                             return sum + val;
                                         }, 0)] })] }) })] })] }));
 };
-export default React.forwardRef(DynamicPrintTable);

package/dist/DynamicTable/DynamicTable.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+type Props = {
+    cellInputs?: boolean;
+    intersectionTitle?: string;
+    className?: string;
+    onChange?: (data: string) => void;
+    defaultValue?: string;
+    onValidate?: (headerValue: string, rowValue: string) => boolean;
+    onRemove?: () => void;
+    margins?: {
+        marginLeft?: number;
+        marginTop?: number;
+        verticalGap?: number;
+        horizontalGap?: number;
+    };
+    forwardedRef?: React.RefObject<{
+        getTotalForRows: () => number;
+        getTotalForColumns: () => number;
+        getColumnsCount: () => number;
+        getRowsCount: () => number;
+    }>;
+};
+export declare const DynamicTable: ({ forwardedRef, ...props }: Props, ref: React.ForwardedRef<any>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/DynamicTable/DynamicTable.js

@@ -0,0 +1,192 @@
+import { jsxs as _jsxs, Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import React, { useEffect, useState } from "react";
+import { TextAreaWithoutValidation } from "../Form/TextArea";
+import { TextFieldWithoutValidation } from "../Form/TextField";
+import { CheckboxWithoutValidation } from "../Form/Checkbox";
+export const DynamicTable = ({ forwardedRef, ...props }, ref) => {
+    const [tableData, setTableData] = useState({});
+    const { cellInputs, intersectionTitle, className, onChange, defaultValue, margins, } = props;
+    useEffect(() => {
+        if (onChange) {
+            onChange(JSON.stringify(tableData));
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [tableData]);
+    useEffect(() => {
+        if (defaultValue) {
+            initializeTable(defaultValue);
+        }
+        else {
+            initializeTableWithDefaults();
+        }
+    }, [defaultValue]);
+    const getRows = () => {
+        const rowsIds = Object.keys(tableData)
+            .filter((key) => key.startsWith("row"))
+            .map((key) => parseInt(key.slice(3)));
+        return rowsIds.sort().map((id) => ({ id }));
+    };
+    const getCols = () => {
+        const colsIds = Object.keys(tableData)
+            .filter((key) => key.startsWith("column"))
+            .map((key) => parseInt(key.slice(6)));
+        return colsIds.sort().map((id) => ({ id }));
+    };
+    const addRow = (event) => {
+        event.stopPropagation();
+        event.preventDefault();
+        const rows = getRows();
+        const lastId = rows[rows.length - 1].id;
+        handleInputChange(`row${lastId + 1}`, 1);
+    };
+    const addCol = (event) => {
+        event.stopPropagation();
+        event.preventDefault();
+        const cols = getCols();
+        const lastId = cols[cols.length - 1].id;
+        handleInputChange(`column${lastId + 1}`, 1);
+    };
+    const removeRow = (rowId) => {
+        const newRowData = { ...tableData };
+        for (const key in newRowData) {
+            if (key.startsWith(`row${rowId}`) || key.startsWith(`cell-${rowId}-`)) {
+                delete newRowData[key];
+            }
+        }
+        setTableData(newRowData);
+    };
+    const removeCol = (colId) => {
+        const newRowData = { ...tableData };
+        for (const key in newRowData) {
+            if (key.startsWith(`column${colId}`) || key.endsWith(`-${colId}`)) {
+                delete newRowData[key];
+            }
+        }
+        setTableData(newRowData);
+    };
+    const getTotalForRow = (rowId) => {
+        return Number(tableData[`row${rowId}`] ?? 0) ?? 0;
+    };
+    const getTotalForColumn = (colId) => {
+        return Number(tableData[`column${colId}`] ?? 0) ?? 0;
+    };
+    const getTotalForRows = () => {
+        return getRows()
+            .map((row) => getTotalForRow(row.id))
+            .reduce((a, b) => a + b, 0);
+    };
+    const getTotalForColumns = () => {
+        return getCols()
+            .map((col) => getTotalForColumn(col.id))
+            .reduce((a, b) => a + b, 0);
+    };
+    const getRowsCount = () => {
+        return getRows().length;
+    };
+    const getColumnsCount = () => {
+        return getCols().length;
+    };
+    const handleInputChange = (name, value) => {
+        setTableData((prevData) => ({ ...prevData, [name]: value }));
+    };
+    const handleValidation = (cellId, colId, rowId) => {
+        const headerValue = tableData[`column${colId}`];
+        const rowValue = tableData[`row${rowId}`];
+        if (props.onValidate && props.onValidate(headerValue, rowValue)) {
+            return handleInputChange(cellId, true);
+        }
+        return { stopUIChange: true };
+    };
+    const handleRemoveValidation = (cellId) => {
+        handleInputChange(cellId, false);
+    };
+    const initializeTableWithDefaults = () => {
+        const initialData = { row0: 1, column0: 1 };
+        setTableData(initialData);
+    };
+    const initializeTable = (tableJson) => {
+        try {
+            const initialData = JSON.parse(tableJson);
+            setTableData(initialData);
+        }
+        catch (error) {
+            console.error("Error al inicializar la tabla:", error);
+        }
+    };
+    const cellBordered = {
+        border: "1px solid #ccc",
+    };
+    const pastelGrayBackground = {
+        backgroundColor: "#B69E99",
+    };
+    const cellCenteredContent = {
+        textAlign: "center",
+        verticalAlign: "middle",
+    };
+    const renderTotalHeight = () => {
+        const sumaFilas = getRows()
+            .map((row) => getTotalForRow(row.id))
+            .reduce((a, b) => a + b, 0);
+        const sumTotalFilas = sumaFilas +
+            (margins?.marginTop ?? 0) +
+            (getRows().length - 1) * (margins?.verticalGap ?? 0);
+        return (_jsxs("div", { className: "ml-4 inline-block", children: [_jsxs("strong", { children: ["Total alto: ", sumTotalFilas, " "] }), margins && (_jsxs(_Fragment, { children: ["(Celdas: ", sumaFilas, " + M\u00E1rgen superior: ", margins?.marginTop ?? 0, " +", " ", getRows().length - 1, " Brechas verticales:", " ", Math.round((getRows().length - 1) * (margins?.verticalGap ?? 0)), ")"] }))] }));
+    };
+    const renderTotalWidth = () => {
+        const cols = getCols();
+        const sumaColumnas = cols
+            .map((col) => getTotalForColumn(col.id))
+            .reduce((a, b) => a + b, 0);
+        const sumaTotal = sumaColumnas +
+            (margins?.marginLeft ?? 0) +
+            (getCols().length - 1) * (margins?.horizontalGap ?? 0);
+        return (_jsxs("div", { className: "ml-4 inline-block", children: [_jsxs("strong", { children: ["Total ancho: ", sumaTotal, " "] }), margins && (_jsxs(_Fragment, { children: ["(Celdas: ", sumaColumnas, " + M\u00E1rgen izquierdo:", " ", margins?.marginLeft ?? 0, " + ", getCols().length - 1, " Brechas horizontales:", " ", Math.round((getCols().length - 1) * (margins?.horizontalGap ?? 0)), ")"] }))] }));
+    };
+    const renderHeader = () => {
+        const cols = getCols();
+        return (_jsxs("tr", { children: [_jsx("th", { className: "align-middle py-2 text-center", style: {
+                        ...cellBordered,
+                        ...pastelGrayBackground,
+                    }, children: intersectionTitle ?? "" }), cols.map((col) => (_jsx("th", { className: "align-middle py-2 text-center", style: { ...cellBordered, ...pastelGrayBackground }, children: _jsxs("div", { className: "inline-flex", children: [_jsx(TextFieldWithoutValidation, { style: { maxWidth: "45%", minWidth: "45%" }, name: `column${col.id}`, defaultValue: tableData[`column${col.id}`] || 1, type: "number", onChange: (value) => handleInputChange(`column${col.id}`, value) }), col.id > 0 && (_jsx("button", { className: "bg-red-500 hover:bg-red-600 font-bold py-1 px-2 rounded ml-2", onClick: () => removeCol(col.id), children: "x" }))] }) }, col.id))), _jsx("th", { children: _jsx("button", { className: "bg-blue-500 hover:bg-blue-600 font-bold py-2 px-4 rounded", onClick: addCol, children: "+" }) })] }));
+    };
+    const renderRow = (rowId) => {
+        const cols = getCols();
+        return (_jsxs("tr", { children: [_jsx("td", { className: "align-middle", style: {
+                        ...cellBordered,
+                        ...pastelGrayBackground,
+                        textOverflow: "ellipsis",
+                        msTextOverflow: "ellipsis",
+                        maxWidth: "200px",
+                    }, children: _jsxs("div", { className: "inline-flex", children: [_jsx(TextFieldWithoutValidation, { style: { maxWidth: "45%", minWidth: "45%" }, name: `row${rowId}`, defaultValue: tableData[`row${rowId}`] || 1, type: "number", onChange: (value) => handleInputChange(`row${rowId}`, value) }), rowId > 0 && (_jsx("button", { className: "bg-red-500 hover:bg-red-600 font-bold py-1 px-2 rounded ml-2", onClick: () => {
+                                    removeRow(rowId);
+                                }, children: "x" }))] }) }), cols.map((col) => {
+                    const cellId = `cell-${rowId}-${col.id}`;
+                    const cellValidation = tableData[cellId] === true;
+                    if (!cellInputs)
+                        tableData[cellId] = cellValidation;
+                    return (_jsx("td", { id: cellId, style: { ...cellBordered, ...cellCenteredContent }, children: cellInputs ? (_jsx(TextAreaWithoutValidation, { name: cellId, defaultValue: tableData[cellId] || "", onChange: (value) => handleInputChange(cellId, value) })) : (_jsx(CheckboxWithoutValidation, { name: cellId, defaultValue: cellValidation, onChange: (value) => {
+                                if (value) {
+                                    return handleValidation(cellId, col.id, rowId);
+                                }
+                                else {
+                                    handleRemoveValidation(cellId);
+                                }
+                            } })) }, col.id));
+                }), rowId === 0 && (_jsx("td", { rowSpan: getRows().length, style: { maxWidth: "100px" }, children: renderTotalHeight() }))] }, rowId));
+    };
+    const renderRows = () => {
+        const rows = getRows();
+        return rows.map((row) => renderRow(row.id));
+    };
+    // Use el "useImperativeHandle" para que el componente padre pueda acceder a los métodos deseados
+    React.useImperativeHandle(forwardedRef, () => ({
+        getTotalForRows,
+        getTotalForColumns,
+        getColumnsCount,
+        getRowsCount,
+    }));
+    return (_jsx("div", { className: `${className}`, children: _jsxs("table", { className: "border-collapse", children: [_jsx("thead", { children: renderHeader() }), _jsx("tbody", { children: renderRows() }), _jsx("tfoot", { children: _jsxs("tr", { children: [_jsx("td", { children: _jsx("button", { className: "bg-blue-500 hover:bg-blue-600 font-bold py-2 px-4 rounded", onClick: addRow, children: "+" }) }), _jsx("td", { colSpan: getCols().length + 1, className: "text-left align-middle", style: {
+                                    textOverflow: "ellipsis",
+                                    msTextOverflow: "ellipsis",
+                                }, children: renderTotalWidth() })] }) })] }) }));
+};

package/dist/DynamicTable/index.d.ts

@@ -1,24 +1,4 @@
-import React from "react";
-type Props = {
-    cellInputs?: boolean;
-    intersectionTitle?: string;
-    className?: string;
-    onChange?: (data: string) => void;
-    defaultValue?: string;
-    onValidate?: (headerValue: string, rowValue: string) => boolean;
-    onRemove?: () => void;
-    margins?: {
-        marginLeft?: number;
-        marginTop?: number;
-        verticalGap?: number;
-        horizontalGap?: number;
-    };
-    forwardedRef?: React.RefObject<{
-        getTotalForRows: () => number;
-        getTotalForColumns: () => number;
-        getColumnsCount: () => number;
-        getRowsCount: () => number;
-    }>;
-};
-declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<any>>;
-export default _default;
+export * from "./BasicPrintDynamicTable.js";
+export * from "./DynamicPrintTable.js";
+export * from "./DynamicTable.js";
+export * from "./GenericDynamicTable.js";

package/dist/DynamicTable/index.js

@@ -1,193 +1,4 @@
-import { jsxs as _jsxs, Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import React, { useEffect, useState } from "react";
-import { TextAreaWithoutValidation } from "../Form/TextArea";
-import { TextFieldWithoutValidation } from "../Form/TextField";
-import { CheckboxWithoutValidation } from "../Form/Checkbox";
-const DynamicTable = ({ forwardedRef, ...props }, ref) => {
-    const [tableData, setTableData] = useState({});
-    const { cellInputs, intersectionTitle, className, onChange, defaultValue, margins, } = props;
-    useEffect(() => {
-        if (onChange) {
-            onChange(JSON.stringify(tableData));
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [tableData]);
-    useEffect(() => {
-        if (defaultValue) {
-            initializeTable(defaultValue);
-        }
-        else {
-            initializeTableWithDefaults();
-        }
-    }, [defaultValue]);
-    const getRows = () => {
-        const rowsIds = Object.keys(tableData)
-            .filter((key) => key.startsWith("row"))
-            .map((key) => parseInt(key.slice(3)));
-        return rowsIds.sort().map((id) => ({ id }));
-    };
-    const getCols = () => {
-        const colsIds = Object.keys(tableData)
-            .filter((key) => key.startsWith("column"))
-            .map((key) => parseInt(key.slice(6)));
-        return colsIds.sort().map((id) => ({ id }));
-    };
-    const addRow = (event) => {
-        event.stopPropagation();
-        event.preventDefault();
-        const rows = getRows();
-        const lastId = rows[rows.length - 1].id;
-        handleInputChange(`row${lastId + 1}`, 1);
-    };
-    const addCol = (event) => {
-        event.stopPropagation();
-        event.preventDefault();
-        const cols = getCols();
-        const lastId = cols[cols.length - 1].id;
-        handleInputChange(`column${lastId + 1}`, 1);
-    };
-    const removeRow = (rowId) => {
-        const newRowData = { ...tableData };
-        for (const key in newRowData) {
-            if (key.startsWith(`row${rowId}`) || key.startsWith(`cell-${rowId}-`)) {
-                delete newRowData[key];
-            }
-        }
-        setTableData(newRowData);
-    };
-    const removeCol = (colId) => {
-        const newRowData = { ...tableData };
-        for (const key in newRowData) {
-            if (key.startsWith(`column${colId}`) || key.endsWith(`-${colId}`)) {
-                delete newRowData[key];
-            }
-        }
-        setTableData(newRowData);
-    };
-    const getTotalForRow = (rowId) => {
-        return Number(tableData[`row${rowId}`] ?? 0) ?? 0;
-    };
-    const getTotalForColumn = (colId) => {
-        return Number(tableData[`column${colId}`] ?? 0) ?? 0;
-    };
-    const getTotalForRows = () => {
-        return getRows()
-            .map((row) => getTotalForRow(row.id))
-            .reduce((a, b) => a + b, 0);
-    };
-    const getTotalForColumns = () => {
-        return getCols()
-            .map((col) => getTotalForColumn(col.id))
-            .reduce((a, b) => a + b, 0);
-    };
-    const getRowsCount = () => {
-        return getRows().length;
-    };
-    const getColumnsCount = () => {
-        return getCols().length;
-    };
-    const handleInputChange = (name, value) => {
-        setTableData((prevData) => ({ ...prevData, [name]: value }));
-    };
-    const handleValidation = (cellId, colId, rowId) => {
-        const headerValue = tableData[`column${colId}`];
-        const rowValue = tableData[`row${rowId}`];
-        if (props.onValidate && props.onValidate(headerValue, rowValue)) {
-            return handleInputChange(cellId, true);
-        }
-        return { stopUIChange: true };
-    };
-    const handleRemoveValidation = (cellId) => {
-        handleInputChange(cellId, false);
-    };
-    const initializeTableWithDefaults = () => {
-        const initialData = { row0: 1, column0: 1 };
-        setTableData(initialData);
-    };
-    const initializeTable = (tableJson) => {
-        try {
-            const initialData = JSON.parse(tableJson);
-            setTableData(initialData);
-        }
-        catch (error) {
-            console.error("Error al inicializar la tabla:", error);
-        }
-    };
-    const cellBordered = {
-        border: "1px solid #ccc",
-    };
-    const pastelGrayBackground = {
-        backgroundColor: "#B69E99",
-    };
-    const cellCenteredContent = {
-        textAlign: "center",
-        verticalAlign: "middle",
-    };
-    const renderTotalHeight = () => {
-        const sumaFilas = getRows()
-            .map((row) => getTotalForRow(row.id))
-            .reduce((a, b) => a + b, 0);
-        const sumTotalFilas = sumaFilas +
-            (margins?.marginTop ?? 0) +
-            (getRows().length - 1) * (margins?.verticalGap ?? 0);
-        return (_jsxs("div", { className: "ml-4 inline-block", children: [_jsxs("strong", { children: ["Total alto: ", sumTotalFilas, " "] }), margins && (_jsxs(_Fragment, { children: ["(Celdas: ", sumaFilas, " + M\u00E1rgen superior: ", margins?.marginTop ?? 0, " +", " ", getRows().length - 1, " Brechas verticales:", " ", Math.round((getRows().length - 1) * (margins?.verticalGap ?? 0)), ")"] }))] }));
-    };
-    const renderTotalWidth = () => {
-        const cols = getCols();
-        const sumaColumnas = cols
-            .map((col) => getTotalForColumn(col.id))
-            .reduce((a, b) => a + b, 0);
-        const sumaTotal = sumaColumnas +
-            (margins?.marginLeft ?? 0) +
-            (getCols().length - 1) * (margins?.horizontalGap ?? 0);
-        return (_jsxs("div", { className: "ml-4 inline-block", children: [_jsxs("strong", { children: ["Total ancho: ", sumaTotal, " "] }), margins && (_jsxs(_Fragment, { children: ["(Celdas: ", sumaColumnas, " + M\u00E1rgen izquierdo:", " ", margins?.marginLeft ?? 0, " + ", getCols().length - 1, " Brechas horizontales:", " ", Math.round((getCols().length - 1) * (margins?.horizontalGap ?? 0)), ")"] }))] }));
-    };
-    const renderHeader = () => {
-        const cols = getCols();
-        return (_jsxs("tr", { children: [_jsx("th", { className: "align-middle py-2 text-center", style: {
-                        ...cellBordered,
-                        ...pastelGrayBackground,
-                    }, children: intersectionTitle ?? "" }), cols.map((col) => (_jsx("th", { className: "align-middle py-2 text-center", style: { ...cellBordered, ...pastelGrayBackground }, children: _jsxs("div", { className: "inline-flex", children: [_jsx(TextFieldWithoutValidation, { style: { maxWidth: "45%", minWidth: "45%" }, name: `column${col.id}`, defaultValue: tableData[`column${col.id}`] || 1, type: "number", onChange: (value) => handleInputChange(`column${col.id}`, value) }), col.id > 0 && (_jsx("button", { className: "bg-red-500 hover:bg-red-600 font-bold py-1 px-2 rounded ml-2", onClick: () => removeCol(col.id), children: "x" }))] }) }, col.id))), _jsx("th", { children: _jsx("button", { className: "bg-blue-500 hover:bg-blue-600 font-bold py-2 px-4 rounded", onClick: addCol, children: "+" }) })] }));
-    };
-    const renderRow = (rowId) => {
-        const cols = getCols();
-        return (_jsxs("tr", { children: [_jsx("td", { className: "align-middle", style: {
-                        ...cellBordered,
-                        ...pastelGrayBackground,
-                        textOverflow: "ellipsis",
-                        msTextOverflow: "ellipsis",
-                        maxWidth: "200px",
-                    }, children: _jsxs("div", { className: "inline-flex", children: [_jsx(TextFieldWithoutValidation, { style: { maxWidth: "45%", minWidth: "45%" }, name: `row${rowId}`, defaultValue: tableData[`row${rowId}`] || 1, type: "number", onChange: (value) => handleInputChange(`row${rowId}`, value) }), rowId > 0 && (_jsx("button", { className: "bg-red-500 hover:bg-red-600 font-bold py-1 px-2 rounded ml-2", onClick: () => {
-                                    removeRow(rowId);
-                                }, children: "x" }))] }) }), cols.map((col) => {
-                    const cellId = `cell-${rowId}-${col.id}`;
-                    const cellValidation = tableData[cellId] === true;
-                    if (!cellInputs)
-                        tableData[cellId] = cellValidation;
-                    return (_jsx("td", { id: cellId, style: { ...cellBordered, ...cellCenteredContent }, children: cellInputs ? (_jsx(TextAreaWithoutValidation, { name: cellId, defaultValue: tableData[cellId] || "", onChange: (value) => handleInputChange(cellId, value) })) : (_jsx(CheckboxWithoutValidation, { name: cellId, defaultValue: cellValidation, onChange: (value) => {
-                                if (value) {
-                                    return handleValidation(cellId, col.id, rowId);
-                                }
-                                else {
-                                    handleRemoveValidation(cellId);
-                                }
-                            } })) }, col.id));
-                }), rowId === 0 && (_jsx("td", { rowSpan: getRows().length, style: { maxWidth: "100px" }, children: renderTotalHeight() }))] }, rowId));
-    };
-    const renderRows = () => {
-        const rows = getRows();
-        return rows.map((row) => renderRow(row.id));
-    };
-    // Use el "useImperativeHandle" para que el componente padre pueda acceder a los métodos deseados
-    React.useImperativeHandle(forwardedRef, () => ({
-        getTotalForRows,
-        getTotalForColumns,
-        getColumnsCount,
-        getRowsCount,
-    }));
-    return (_jsx("div", { className: `${className}`, children: _jsxs("table", { className: "border-collapse", children: [_jsx("thead", { children: renderHeader() }), _jsx("tbody", { children: renderRows() }), _jsx("tfoot", { children: _jsxs("tr", { children: [_jsx("td", { children: _jsx("button", { className: "bg-blue-500 hover:bg-blue-600 font-bold py-2 px-4 rounded", onClick: addRow, children: "+" }) }), _jsx("td", { colSpan: getCols().length + 1, className: "text-left align-middle", style: {
-                                    textOverflow: "ellipsis",
-                                    msTextOverflow: "ellipsis",
-                                }, children: renderTotalWidth() })] }) })] }) }));
-};
-export default React.forwardRef(DynamicTable);
+export * from "./BasicPrintDynamicTable.js";
+export * from "./DynamicPrintTable.js";
+export * from "./DynamicTable.js";
+export * from "./GenericDynamicTable.js";

package/dist/Footer/index.d.ts

@@ -1 +1 @@
-export * from "./Footer";
+export * from "./Footer.js";

package/dist/Footer/index.js

@@ -1 +1 @@
-export * from "./Footer";
+export * from "./Footer.js";

package/dist/Form/FieldContainer/index.d.ts

@@ -1,3 +1,3 @@
-export * from "./DoubleFieldContainer";
-export * from "./QuadrupleFieldContainer";
-export * from "./TripleFieldContainer";
+export * from "./DoubleFieldContainer.js";
+export * from "./QuadrupleFieldContainer.js";
+export * from "./TripleFieldContainer.js";

package/dist/Form/FieldContainer/index.js

@@ -1,3 +1,3 @@
-export * from "./DoubleFieldContainer";
-export * from "./QuadrupleFieldContainer";
-export * from "./TripleFieldContainer";
+export * from "./DoubleFieldContainer.js";
+export * from "./QuadrupleFieldContainer.js";
+export * from "./TripleFieldContainer.js";

package/dist/Form/index.d.ts

@@ -1,13 +1,13 @@
-export * from "./Checkbox";
-export * from "./Checklist";
-export * from "./DatePicker";
-export * from "./DynamicBaculoForm";
-export * from "./FieldContainer";
-export * from "./FileUpload";
-export * from "./FormButtons";
-export * from "./FormLayout";
-export * from "./SelectField";
-export * from "./TextArea";
-export * from "./TextField";
-export * from "./TimePicker";
-export * from "./YesNo";
+export * from "./Checkbox/index.js";
+export * from "./Checklist/index.js";
+export * from "./DatePicker/index.js";
+export * from "./DynamicBaculoForm/index.js";
+export * from "./FieldContainer/index.js";
+export * from "./FileUpload/index.js";
+export * from "./FormButtons/index.js";
+export * from "./FormLayout/index.js";
+export * from "./SelectField/index.js";
+export * from "./TextArea/index.js";
+export * from "./TextField/index.js";
+export * from "./TimePicker/index.js";
+export * from "./YesNo/index.js";