@dilicorp/ui 0.0.57 → 0.0.58

package/dist/components/navbar/navbar.js

@@ -1,10 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Dropdown } from '../../molecules/dropdown/dropdown';
 import { Icon } from '../../atoms/icon';
 import { Image } from '../../atoms/image';
 export const Navbar = (props) => {
     const { image, dropdown } = props;
-    return (_jsx("div", Object.assign({ className: "navbar mb-3" }, { children: _jsxs("div", Object.assign({ className: "navbar-profile" }, { children: [image
-                    ? _jsx(Image, Object.assign({}, image, { circle: true, width: "38px", height: "38px", objectFit: "cover", className: "me-2" }), void 0)
-                    : (_jsx("div", Object.assign({ className: "image-profile circle me-2" }, { children: _jsx(Icon, { icon: "faUserAlt" }, void 0) }), void 0)), _jsx(Dropdown, Object.assign({}, dropdown), void 0)] }), void 0) }), void 0));
+    return (React.createElement("div", { className: "navbar mb-3" },
+        React.createElement("div", { className: "navbar-profile" },
+            image
+                ? React.createElement(Image, Object.assign({}, image, { circle: true, width: "38px", height: "38px", objectFit: "cover", className: "me-2" }))
+                : (React.createElement("div", { className: "image-profile circle me-2" },
+                    React.createElement(Icon, { icon: "faUserAlt" }))),
+            React.createElement(Dropdown, Object.assign({}, dropdown)))));
 };

package/dist/components/page-create/page-create.js

@@ -1,6 +1,16 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
 import { Button, Col, Dropdown, FormBuilder, Icon, Link, Row, Separator, Typography } from '../../';
 export const PageCreate = (props) => {
     const { title, extraButtons = [], cancelButton, onSubmit, data } = props;
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, Object.assign({ className: "mb-3" }, { children: [_jsx(Col, { children: _jsx(Typography, Object.assign({ lineBottom: true, variant: "h4", tag: "h1" }, { children: title }), void 0) }, void 0), _jsxs(Col, Object.assign({ className: "ms-auto" }, { children: [Boolean(extraButtons.length) && (_jsx(Dropdown, { color: "default", className: "me-2", label: _jsx(Icon, { icon: "faEllipsisH" }, void 0), items: extraButtons }, void 0)), Boolean(cancelButton) && (_jsxs(Button, Object.assign({ tag: Link, href: cancelButton === null || cancelButton === void 0 ? void 0 : cancelButton.uri, color: "danger" }, { children: [_jsx(Icon, { icon: "faAngleLeft", className: "me-1" }, void 0), cancelButton === null || cancelButton === void 0 ? void 0 : cancelButton.label] }), void 0))] }), void 0)] }), void 0), _jsx(Separator, {}, void 0), _jsx(FormBuilder, { data: data, onSubmit: onSubmit }, void 0)] }, void 0));
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Row, { className: "mb-3" },
+            React.createElement(Col, null,
+                React.createElement(Typography, { lineBottom: true, variant: "h4", tag: "h1" }, title)),
+            React.createElement(Col, { className: "ms-auto" },
+                Boolean(extraButtons.length) && (React.createElement(Dropdown, { color: "default", className: "me-2", label: React.createElement(Icon, { icon: "faEllipsisH" }), items: extraButtons })),
+                Boolean(cancelButton) && (React.createElement(Button, { tag: Link, href: cancelButton === null || cancelButton === void 0 ? void 0 : cancelButton.uri, color: "danger" },
+                    React.createElement(Icon, { icon: "faAngleLeft", className: "me-1" }), cancelButton === null || cancelButton === void 0 ? void 0 :
+                    cancelButton.label)))),
+        React.createElement(Separator, null),
+        React.createElement(FormBuilder, { data: data, onSubmit: onSubmit })));
 };

package/dist/components/page-list/column-management-components/button-config.js

@@ -1,11 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import classNames from 'classnames';
 import { Icon } from '../../../atoms/icon';
 import { Dropdown } from '../../../molecules/dropdown/dropdown';
 export const ButtonConfig = (props) => {
     const { className, title, show = true, onClick } = props;
     const classes = classNames(className, show ? 'd-inline-block' : 'd-none', 'btn btn-default mb-3 ms-3');
-    return (_jsx(Dropdown, { tag: 'div', color: "default", className: classes, align: "right", label: _jsx(Icon, { icon: "faCog" }, void 0), items: [
+    return (React.createElement(Dropdown, { tag: 'div', color: "default", className: classes, align: "right", label: React.createElement(Icon, { icon: "faCog" }), items: [
             {
                 label: title,
                 onClick: () => {
@@ -13,5 +13,5 @@ export const ButtonConfig = (props) => {
                         onClick();
                 }
             }
-        ] }, void 0));
+        ] }));
 };

package/dist/components/page-list/column-management-components/container-drag-drop.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import update from 'immutability-helper';
 import { ItemDragDrop } from "./item-drag-drop";
@@ -16,7 +15,7 @@ export const ContainerDragDrop = ({ items, setItems }) => {
         });
     }, []);
     const renderCard = React.useCallback((card, index) => {
-        return (_jsx(ItemDragDrop, { index: index, id: card.id, title: card.title, moveCard: moveCard }, card.id));
+        return (React.createElement(ItemDragDrop, { key: card.id, index: index, id: card.id, title: card.title, moveCard: moveCard }));
     }, []);
-    return (_jsx("div", Object.assign({ style: { width: 400 } }, { children: items.map((card, i) => renderCard(card, i)) }), void 0));
+    return (React.createElement("div", { style: { width: 400 } }, items.map((card, i) => renderCard(card, i))));
 };

package/dist/components/page-list/column-management-components/item-drag-drop.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { useDrag, useDrop } from 'react-dnd';
 import { Icon } from "../../../atoms/icon";
@@ -59,5 +58,8 @@ export const ItemDragDrop = ({ id, title, index, moveCard }) => {
     });
     const opacity = isDragging ? 0 : 1;
     drag(drop(ref));
-    return (_jsxs("div", Object.assign({ ref: ref, className: 'item-drag mb-2', style: { opacity }, "data-handler-id": handlerId }, { children: [_jsx(Icon, { icon: "fa-grip-vertical", className: "me-2" }, void 0), " ", title] }), void 0));
+    return (React.createElement("div", { ref: ref, className: 'item-drag mb-2', style: { opacity }, "data-handler-id": handlerId },
+        React.createElement(Icon, { icon: "fa-grip-vertical", className: "me-2" }),
+        " ",
+        title));
 };

package/dist/components/page-list/column-management-components/modal-config.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
@@ -18,8 +17,38 @@ export const ModalConfig = ({ title, description, items, defaultConfig, cancelLa
     const onClickRestoreDefault = () => {
         setColumns(defaultConfig);
     };
-    return (_jsxs("div", Object.assign({ className: "modal modal-lg" }, { children: [_jsxs("div", Object.assign({ className: "modal-header" }, { children: [_jsx("div", Object.assign({ className: "title" }, { children: title }), void 0), _jsx(Button, Object.assign({ small: true, onClick: closeFn }, { children: "\u00D7" }), void 0)] }), void 0), _jsxs("div", Object.assign({ className: "modal-body" }, { children: [_jsx("p", Object.assign({ className: "my-4 p-2" }, { children: description }), void 0), _jsxs("div", Object.assign({ className: "row" }, { children: [_jsx("div", Object.assign({ className: "col-6" }, { children: _jsxs("div", Object.assign({ className: "drag-drop-container" }, { children: [_jsxs("div", Object.assign({ className: "drag-drop-header" }, { children: [_jsx("p", { children: availableItemsTitle }, void 0), _jsx("span", Object.assign({ className: "badge" }, { children: columnsOrdered.length }), void 0)] }), void 0), _jsx("div", Object.assign({ className: "drag-drop-body" }, { children: _jsx("ul", Object.assign({ className: "list-unstyled" }, { children: columnsOrdered.map(column => (_jsx("li", Object.assign({ className: 'mb-2' }, { children: _jsxs("label", Object.assign({ className: "position-relative ps-4", htmlFor: `column-${column.id}` }, { children: [_jsx("input", { className: "checkbox-primary", type: "checkbox", id: `column-${column.id}`, defaultChecked: column.show, checked: column.show, onClick: () => handleCheckColumn(column.id) }, void 0), _jsx("div", { className: "checkbox-container" }, void 0), ' ', column.title] }), void 0) }), `column-${column.id}`))) }), void 0) }), void 0)] }), void 0) }), void 0), _jsx("div", Object.assign({ className: "col-6" }, { children: _jsxs("div", Object.assign({ className: "drag-drop-container" }, { children: [_jsxs("div", Object.assign({ className: "drag-drop-header" }, { children: [_jsx("p", { children: orderItemsTitle }, void 0), _jsx("span", Object.assign({ className: "badge" }, { children: columnsVisible.length }), void 0), _jsx(Button, Object.assign({ color: "primary", type: "button", onClick: onClickRestoreDefault, outline: true }, { children: restoreDefaultLabel }), void 0)] }), void 0), _jsx("div", Object.assign({ className: "drag-drop-body" }, { children: _jsx(DndProvider, Object.assign({ backend: HTML5Backend }, { children: _jsx(ContainerDragDrop, { items: columnsVisible, setItems: setColumns }, void 0) }), void 0) }), void 0)] }), void 0) }), void 0)] }), void 0), _jsxs("div", Object.assign({ className: "d-flex justify-content-between mt-4" }, { children: [_jsx(Button, Object.assign({ outline: true, title: cancelLabel, color: "primary", onClick: closeFn }, { children: cancelLabel }), void 0), _jsx(Button, Object.assign({ title: confirmLabel, color: "primary", onClick: () => {
-                                    confirmFn(columns);
-                                    closeFn();
-                                } }, { children: confirmLabel }), void 0)] }), void 0)] }), void 0)] }), void 0));
+    return (React.createElement("div", { className: "modal modal-lg" },
+        React.createElement("div", { className: "modal-header" },
+            React.createElement("div", { className: "title" }, title),
+            React.createElement(Button, { small: true, onClick: closeFn }, "\u00D7")),
+        React.createElement("div", { className: "modal-body" },
+            React.createElement("p", { className: "my-4 p-2" }, description),
+            React.createElement("div", { className: "row" },
+                React.createElement("div", { className: "col-6" },
+                    React.createElement("div", { className: "drag-drop-container" },
+                        React.createElement("div", { className: "drag-drop-header" },
+                            React.createElement("p", null, availableItemsTitle),
+                            React.createElement("span", { className: "badge" }, columnsOrdered.length)),
+                        React.createElement("div", { className: "drag-drop-body" },
+                            React.createElement("ul", { className: "list-unstyled" }, columnsOrdered.map(column => (React.createElement("li", { key: `column-${column.id}`, className: 'mb-2' },
+                                React.createElement("label", { className: "position-relative ps-4", htmlFor: `column-${column.id}` },
+                                    React.createElement("input", { className: "checkbox-primary", type: "checkbox", id: `column-${column.id}`, defaultChecked: column.show, checked: column.show, onClick: () => handleCheckColumn(column.id) }),
+                                    React.createElement("div", { className: "checkbox-container" }),
+                                    ' ',
+                                    column.title)))))))),
+                React.createElement("div", { className: "col-6" },
+                    React.createElement("div", { className: "drag-drop-container" },
+                        React.createElement("div", { className: "drag-drop-header" },
+                            React.createElement("p", null, orderItemsTitle),
+                            React.createElement("span", { className: "badge" }, columnsVisible.length),
+                            React.createElement(Button, { color: "primary", type: "button", onClick: onClickRestoreDefault, outline: true }, restoreDefaultLabel)),
+                        React.createElement("div", { className: "drag-drop-body" },
+                            React.createElement(DndProvider, { backend: HTML5Backend },
+                                React.createElement(ContainerDragDrop, { items: columnsVisible, setItems: setColumns })))))),
+            React.createElement("div", { className: "d-flex justify-content-between mt-4" },
+                React.createElement(Button, { outline: true, title: cancelLabel, color: "primary", onClick: closeFn }, cancelLabel),
+                React.createElement(Button, { title: confirmLabel, color: "primary", onClick: () => {
+                        confirmFn(columns);
+                        closeFn();
+                    } }, confirmLabel)))));
 };

package/dist/components/page-list/filter-components/button-filter-clear.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import classNames from 'classnames';
 import { Icon } from '../../../atoms/icon';
@@ -17,5 +16,7 @@ export const ButtonFilterClear = (props) => {
             search: uriHelper.stringify(Object.assign(Object.assign({}, elements), { page: 1 }))
         });
     }, [search, navigate]);
-    return (_jsxs(Button, Object.assign({ color: "warning", className: classes, onClick: handleClick }, { children: [_jsx(Icon, { icon: "faTimes", className: "me-2" }, void 0), clearLabel] }), void 0));
+    return (React.createElement(Button, { color: "warning", className: classes, onClick: handleClick },
+        React.createElement(Icon, { icon: "faTimes", className: "me-2" }),
+        clearLabel));
 };

package/dist/components/page-list/filter-components/button-filter.js

@@ -1,9 +1,11 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import classNames from 'classnames';
 import { Icon } from '../../../atoms/icon';
 import { Button } from '../../../atoms/button';
 export const ButtonFilter = (props) => {
     const { className, submitLabel, show = true } = props;
     const classes = classNames(className, show ? 'd-inline-block' : 'd-none', 'mb-3');
-    return (_jsxs(Button, Object.assign({ type: "submit", className: classes }, { children: [_jsx(Icon, { icon: "faSearch", className: "me-2" }, void 0), submitLabel] }), void 0));
+    return (React.createElement(Button, { type: "submit", className: classes },
+        React.createElement(Icon, { icon: "faSearch", className: "me-2" }),
+        submitLabel));
 };

package/dist/components/page-list/filter-components/button-filters.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import classNames from 'classnames';
 import { Icon } from '../../../atoms/icon';
 import { Button } from '../../../atoms/button';
@@ -8,5 +8,7 @@ export const ButtonFilters = (props) => {
     const handleClick = () => {
         setShow(prev => !prev);
     };
-    return (_jsxs(Button, Object.assign({ color: "info", outline: !show, onClick: handleClick, className: classes }, { children: [_jsx(Icon, { icon: "faFilter", className: "me-2" }, void 0), filterLabel] }), void 0));
+    return (React.createElement(Button, { color: "info", outline: !show, onClick: handleClick, className: classes },
+        React.createElement(Icon, { icon: "faFilter", className: "me-2" }),
+        filterLabel));
 };

package/dist/components/page-list/filter-components/filter-form.js

@@ -1,10 +1,10 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { useNavigate } from 'react-router-dom';
 import uriHelper from '../../../utils/uri-helper';
 export const FilterForm = (props) => {
     const { children, search } = props;
     const navigate = useNavigate();
-    return (_jsx("form", Object.assign({ className: "filter-form", onSubmit: (e) => {
+    return (React.createElement("form", { className: "filter-form", onSubmit: (e) => {
             e.preventDefault();
             const count = e.target.length;
             const fields = e.target;
@@ -22,5 +22,5 @@ export const FilterForm = (props) => {
             navigate({
                 search: uriHelper.stringify(Object.assign(Object.assign({}, elements), { page: 1 }))
             });
-        } }, { children: children }), void 0));
+        } }, children));
 };

package/dist/components/page-list/filters/filter-datepicker.js

@@ -1,6 +1,10 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { InputDatepicker } from '../../../atoms/input-datepicker';
 export const FilterDatepicker = (props) => {
     const { name, id = name, value = '', placeholder } = props;
-    return (_jsxs("div", Object.assign({ className: "form-group" }, { children: [Boolean(placeholder) && _jsxs("label", Object.assign({ className: "form-label", htmlFor: name }, { children: [placeholder, ":"] }), void 0), _jsx(InputDatepicker, Object.assign({}, props, { value: value, id: id }), void 0)] }), void 0));
+    return (React.createElement("div", { className: "form-group" },
+        Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
+            placeholder,
+            ":"),
+        React.createElement(InputDatepicker, Object.assign({}, props, { value: value, id: id }))));
 };

package/dist/components/page-list/filters/filter-input.js

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import classNames from 'classnames';
 import InputMask from 'react-input-mask';
 export const FilterInput = (props) => {
@@ -27,7 +27,15 @@ export const FilterInput = (props) => {
     const classes = classNames(className, 'form-control');
     const attrs = Object.assign(Object.assign({}, validOptions), { className: classes, name: name, id: id, defaultValue: value, onChange: props.onChange });
     if (mask) {
-        return (_jsxs("div", Object.assign({ className: "form-group" }, { children: [Boolean(placeholder) && _jsxs("label", Object.assign({ className: "form-label", htmlFor: name }, { children: [placeholder, ":"] }), void 0), _jsx(InputMask, Object.assign({ mask: mask }, attrs), void 0)] }), void 0));
+        return (React.createElement("div", { className: "form-group" },
+            Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
+                placeholder,
+                ":"),
+            React.createElement(InputMask, Object.assign({ mask: mask }, attrs))));
     }
-    return (_jsxs("div", Object.assign({ className: "form-group" }, { children: [Boolean(placeholder) && _jsxs("label", Object.assign({ className: "form-label", htmlFor: name }, { children: [placeholder, ":"] }), void 0), _jsx("input", Object.assign({}, attrs), void 0)] }), void 0));
+    return (React.createElement("div", { className: "form-group" },
+        Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
+            placeholder,
+            ":"),
+        React.createElement("input", Object.assign({}, attrs))));
 };

package/dist/components/page-list/filters/filter-select.js

@@ -1,4 +1,3 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import ReactSelect from 'react-select';
 const getValueInOption = (options, value) => {
@@ -42,5 +41,9 @@ export const FilterSelect = (props) => {
             }, action);
         }
     }, []);
-    return (_jsxs("div", Object.assign({ className: "form-group" }, { children: [Boolean(placeholder) && _jsxs("label", Object.assign({ className: "form-label", htmlFor: name }, { children: [placeholder, ":"] }), void 0), _jsx(ReactSelect, { placeholder: placeholder, className: "form-builder-select", classNamePrefix: "form-builder", options: options, name: name, id: id, defaultValue: newValue, isDisabled: isDisabled, isLoading: isLoading, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, onChange: handleChange }, void 0)] }), void 0));
+    return (React.createElement("div", { className: "form-group" },
+        Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
+            placeholder,
+            ":"),
+        React.createElement(ReactSelect, { placeholder: placeholder, className: "form-builder-select", classNamePrefix: "form-builder", options: options, name: name, id: id, defaultValue: newValue, isDisabled: isDisabled, isLoading: isLoading, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, onChange: handleChange })));
 };

package/dist/components/page-list/page-list-filters.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 export const PageListFilters = ({ children }) => {
-    return (_jsx("div", Object.assign({ className: "page-list-filters" }, { children: children }), void 0));
+    return (React.createElement("div", { className: "page-list-filters" }, children));
 };
 PageListFilters.displayName = 'PageListFilters';

package/dist/components/page-list/page-list-get-filters.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from 'react';
 import { FilterForm } from './filter-components/filter-form';
 import { Row } from '../../atoms/row';
@@ -31,6 +30,26 @@ export const PageListGetFilters = (props) => {
         open: () => { var _a; return (_a = modal === null || modal === void 0 ? void 0 : modal.current) === null || _a === void 0 ? void 0 : _a.open(); },
         close: () => { var _a; return (_a = modal === null || modal === void 0 ? void 0 : modal.current) === null || _a === void 0 ? void 0 : _a.close(); },
     };
-    return (_jsxs(_Fragment, { children: [_jsxs(FilterForm, Object.assign({ search: search }, { children: [_jsxs(Row, { children: [visible.map((element, index) => (_jsx(Col, Object.assign({ size: [12, 6, 4, 3], className: "mb-3" }, { children: setValue(element, search[element.props.name]) }), JSON.stringify({ index, props: element === null || element === void 0 ? void 0 : element.props })))), _jsx(Col, Object.assign({ className: 'p-0' }, { children: _jsxs("div", Object.assign({ className: "form-group", id: "btns-filter" }, { children: [_jsx("label", Object.assign({ className: "form-label", htmlFor: "btns-filter" }, { children: "\u00A0" }), void 0), _jsxs("div", { children: [_jsx(ButtonFilter, { submitLabel: filter.submitLabel, className: "me-3" }, void 0), _jsx(ButtonFilterClear, { clearLabel: filter.clearLabel, className: "me-3", search: search }, void 0), Boolean(hidden.length) && _jsx(ButtonFilters, { show: showFilter, setShow: setShowFilter, filterLabel: filter.filterLabel }, void 0), columnManagement && _jsx(ButtonConfig, Object.assign({}, columnManagement, { onClick: () => modalActions.open() }), void 0)] }, void 0)] }), void 0) }), void 0)] }, void 0), Boolean(hidden.length) && (_jsxs("div", Object.assign({ className: `aside-filter ${showFilter ? 'in' : ''}` }, { children: [_jsx("div", Object.assign({ className: "mb-3 text-right" }, { children: _jsx(Button, Object.assign({ color: "primary", outline: showFilter, onClick: () => setShowFilter(prev => !prev), small: true }, { children: _jsx(Icon, { icon: "faTimes" }, void 0) }), void 0) }), void 0), _jsx("div", Object.assign({ className: "content-aside-filter" }, { children: hidden.map((element, index) => (_jsx("div", Object.assign({ className: hidden.length === (index + 1) ? '' : 'mb-3' }, { children: setValue(element, search[element.props.name]) }), `visible-child-${JSON.stringify({ index: index + numFiltersVisible, props: element === null || element === void 0 ? void 0 : element.props })}`))) }), void 0), _jsxs("div", Object.assign({ className: `pt-3 text-center ${showFilter ? 'd-block' : 'd-none'}` }, { children: [_jsx(ButtonFilter, { submitLabel: filter.submitLabel, className: "me-3" }, void 0), _jsx(ButtonFilterClear, { clearLabel: filter.clearLabel, search: search }, void 0)] }), void 0)] }), void 0))] }), void 0), _jsx(Alert, Object.assign({ ref: modal, className: "alert-lg" }, { children: columnManagement &&
-                    _jsx(ModalConfig, Object.assign({}, columnManagement, { closeFn: modalActions.close, confirmFn: columnManagement.onConfirm }), void 0) }), void 0)] }, void 0));
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FilterForm, { search: search },
+            React.createElement(Row, null,
+                visible.map((element, index) => (React.createElement(Col, { size: [12, 6, 4, 3], key: JSON.stringify({ index, props: element === null || element === void 0 ? void 0 : element.props }), className: "mb-3" }, setValue(element, search[element.props.name])))),
+                React.createElement(Col, { className: 'p-0' },
+                    React.createElement("div", { className: "form-group", id: "btns-filter" },
+                        React.createElement("label", { className: "form-label", htmlFor: "btns-filter" }, "\u00A0"),
+                        React.createElement("div", null,
+                            React.createElement(ButtonFilter, { submitLabel: filter.submitLabel, className: "me-3" }),
+                            React.createElement(ButtonFilterClear, { clearLabel: filter.clearLabel, className: "me-3", search: search }),
+                            Boolean(hidden.length) && React.createElement(ButtonFilters, { show: showFilter, setShow: setShowFilter, filterLabel: filter.filterLabel }),
+                            columnManagement && React.createElement(ButtonConfig, Object.assign({}, columnManagement, { onClick: () => modalActions.open() })))))),
+            Boolean(hidden.length) && (React.createElement("div", { className: `aside-filter ${showFilter ? 'in' : ''}` },
+                React.createElement("div", { className: "mb-3 text-right" },
+                    React.createElement(Button, { color: "primary", outline: showFilter, onClick: () => setShowFilter(prev => !prev), small: true },
+                        React.createElement(Icon, { icon: "faTimes" }))),
+                React.createElement("div", { className: "content-aside-filter" }, hidden.map((element, index) => (React.createElement("div", { key: `visible-child-${JSON.stringify({ index: index + numFiltersVisible, props: element === null || element === void 0 ? void 0 : element.props })}`, className: hidden.length === (index + 1) ? '' : 'mb-3' }, setValue(element, search[element.props.name]))))),
+                React.createElement("div", { className: `pt-3 text-center ${showFilter ? 'd-block' : 'd-none'}` },
+                    React.createElement(ButtonFilter, { submitLabel: filter.submitLabel, className: "me-3" }),
+                    React.createElement(ButtonFilterClear, { clearLabel: filter.clearLabel, search: search }))))),
+        React.createElement(Alert, { ref: modal, className: "alert-lg" }, columnManagement &&
+            React.createElement(ModalConfig, Object.assign({}, columnManagement, { closeFn: modalActions.close, confirmFn: columnManagement.onConfirm })))));
 };

package/dist/components/page-list/page-list.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Typography } from '../../atoms/typography';
 import { Row } from '../../atoms/row';
 import { Col } from '../../atoms/col';
+import React from 'react';
 import { Button } from '../../atoms/button';
 import { Icon } from '../../atoms/icon';
 import { Link } from '../../atoms/link';
@@ -19,7 +19,20 @@ export const PageList = (props) => {
     const filterList = Array.isArray(children) ? children.find(child => { var _a; return typeof child.type !== 'string' && ((_a = child.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'PageListFilters'; }) : null;
     const restList = Array.isArray(children) ? children === null || children === void 0 ? void 0 : children.filter(child => child !== filterList) : children;
     if (loading) {
-        return (_jsx("div", Object.assign({ className: "my-5" }, { children: _jsx(Spinner, {}, void 0) }), void 0));
+        return (React.createElement("div", { className: "my-5" },
+            React.createElement(Spinner, null)));
     }
-    return (_jsxs(_Fragment, { children: [_jsxs(Row, Object.assign({ className: "mb-3" }, { children: [title && (_jsx(Col, { children: _jsx(Typography, Object.assign({ lineBottom: true, variant: "h4", tag: "h1" }, { children: title }), void 0) }, void 0)), _jsxs(Col, Object.assign({ className: "ms-auto" }, { children: [Boolean(extraButtons.length) && (_jsx(Dropdown, { color: "default", className: extraButtons.length ? 'me-2' : '', align: "right", label: _jsx(Icon, { icon: "faEllipsisH" }, void 0), items: extraButtons }, void 0)), Boolean(addButton) && (_jsxs(Button, Object.assign({ tag: Link, href: addButton === null || addButton === void 0 ? void 0 : addButton.uri }, { children: [_jsx(Icon, { icon: "faPlus", className: "me-1" }, void 0), addButton === null || addButton === void 0 ? void 0 : addButton.label] }), void 0))] }), void 0)] }), void 0), !!customizeFilter && customizeFilter, !customizeFilter && filterList && (_jsx(PageListGetFilters, { filterList: filterList, search: search, filter: filter, columnManagement: columnManagement }, JSON.stringify(history))), _jsx("div", { children: restList }, void 0), meta && _jsx(Paginate, { activePage: meta.current_page, perPage: meta.per_page, totalItems: meta.total, from: meta.from, to: meta.to, currentCount: totalRecords, translate: metaTranslate }, void 0)] }, void 0));
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Row, { className: "mb-3" },
+            title && (React.createElement(Col, null,
+                React.createElement(Typography, { lineBottom: true, variant: "h4", tag: "h1" }, title))),
+            React.createElement(Col, { className: "ms-auto" },
+                Boolean(extraButtons.length) && (React.createElement(Dropdown, { color: "default", className: extraButtons.length ? 'me-2' : '', align: "right", label: React.createElement(Icon, { icon: "faEllipsisH" }), items: extraButtons })),
+                Boolean(addButton) && (React.createElement(Button, { tag: Link, href: addButton === null || addButton === void 0 ? void 0 : addButton.uri },
+                    React.createElement(Icon, { icon: "faPlus", className: "me-1" }), addButton === null || addButton === void 0 ? void 0 :
+                    addButton.label)))),
+        !!customizeFilter && customizeFilter,
+        !customizeFilter && filterList && (React.createElement(PageListGetFilters, { filterList: filterList, search: search, filter: filter, key: JSON.stringify(history), columnManagement: columnManagement })),
+        React.createElement("div", null, restList),
+        meta && React.createElement(Paginate, { activePage: meta.current_page, perPage: meta.per_page, totalItems: meta.total, from: meta.from, to: meta.to, currentCount: totalRecords, translate: metaTranslate })));
 };

package/dist/components/page-show/page-show.js

@@ -1,8 +1,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Button, Col, Dropdown, Icon, Link, Row, Separator, Spinner, Typography } from '../../';
 export const PageShow = (props) => {
     const { loading = true, children, extraButtons = [], backButton, title } = props;
     if (loading)
-        return _jsx(Spinner, {}, void 0);
-    return (_jsxs("div", { children: [_jsxs(Row, Object.assign({ className: "mb-3" }, { children: [_jsx(Col, { children: _jsx(Typography, Object.assign({ lineBottom: true, variant: "h4", tag: "h1" }, { children: title }), void 0) }, void 0), _jsxs(Col, Object.assign({ className: "ms-auto" }, { children: [Boolean(extraButtons.length) && (_jsx(Dropdown, { color: "default", className: "me-2", align: "right", label: _jsx(Icon, { icon: "faEllipsisH" }, void 0), items: extraButtons }, void 0)), Boolean(backButton) && (_jsxs(Button, Object.assign({ tag: Link, href: backButton === null || backButton === void 0 ? void 0 : backButton.uri, color: "danger" }, { children: [_jsx(Icon, { icon: "faAngleLeft", className: "me-1" }, void 0), backButton === null || backButton === void 0 ? void 0 : backButton.label] }), void 0))] }), void 0)] }), void 0), _jsx(Separator, {}, void 0), children] }, void 0));
+        return React.createElement(Spinner, null);
+    return (React.createElement("div", null,
+        React.createElement(Row, { className: "mb-3" },
+            React.createElement(Col, null,
+                React.createElement(Typography, { lineBottom: true, variant: "h4", tag: "h1" }, title)),
+            React.createElement(Col, { className: "ms-auto" },
+                Boolean(extraButtons.length) && (React.createElement(Dropdown, { color: "default", className: "me-2", align: "right", label: React.createElement(Icon, { icon: "faEllipsisH" }), items: extraButtons })),
+                Boolean(backButton) && (React.createElement(Button, { tag: Link, href: backButton === null || backButton === void 0 ? void 0 : backButton.uri, color: "danger" },
+                    React.createElement(Icon, { icon: "faAngleLeft", className: "me-1" }), backButton === null || backButton === void 0 ? void 0 :
+                    backButton.label)))),
+        React.createElement(Separator, null),
+        children));
 };

package/dist/components/side-navigation-bar/side-navigation-bar-item.js

@@ -9,13 +9,18 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Icon } from '../../atoms/icon';
 import { Link } from '../../index';
 const InnerItem = ({ icon, label }) => {
-    return (_jsxs(_Fragment, { children: [icon && _jsx(Icon, { icon: icon }, void 0), _jsx("span", Object.assign({ className: "link-name" }, { children: label }), void 0)] }, void 0));
+    return (React.createElement(React.Fragment, null,
+        icon && React.createElement(Icon, { icon: icon }),
+        React.createElement("span", { className: "link-name" }, label)));
 };
 export const SideNavigationBarItem = (props) => {
     const { className = '', label } = props, attrs = __rest(props, ["className", "label"]);
-    return (_jsxs("li", Object.assign({ className: className }, { children: [_jsx(Link, Object.assign({}, attrs, { children: _jsx(InnerItem, Object.assign({}, props), void 0) }), void 0), _jsx("span", Object.assign({ className: "tooltip" }, { children: label }), void 0)] }), void 0));
+    return (React.createElement("li", { className: className },
+        React.createElement(Link, Object.assign({}, attrs),
+            React.createElement(InnerItem, Object.assign({}, props))),
+        React.createElement("span", { className: "tooltip" }, label)));
 };

package/dist/components/side-navigation-bar/side-navigation-bar.js

@@ -1,5 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useEffect } from 'react';
+import React, { memo, useEffect } from 'react';
 import { SideNavigationBarItem } from './side-navigation-bar-item';
 import { Icon } from '../../atoms/icon';
 import { storageHelper } from '../../index';
@@ -17,11 +16,19 @@ export const SideNavigationBar = memo((props) => {
             sidebar.classList.toggle('active');
         };
     }, []);
-    return (_jsxs("div", Object.assign({ className: `sidebar${showActive ? ' active' : ''}` }, { children: [_jsxs("div", Object.assign({ className: "logo-content" }, { children: [_jsxs("div", Object.assign({ className: "logo" }, { children: [Boolean(logoThumb) && _jsx("div", Object.assign({ className: "logo-thumb" }, { children: logoThumb }), void 0), logoName && _jsx("div", Object.assign({ className: "logo-name" }, { children: logoName }), void 0)] }), void 0), _jsx(Icon, { icon: "fa-bars", className: "btn-sidebar" }, void 0)] }), void 0), _jsxs("ul", Object.assign({ className: "nav-list" }, { children: [items.map((item, index) => (_jsx(SideNavigationBarItem, Object.assign({}, item), `side-navigation-bar-item-${index}`))), !!(logout === null || logout === void 0 ? void 0 : logout.href) && (_jsx(SideNavigationBarItem, Object.assign({}, {
-                        className: 'link-logout',
-                        icon: 'fa-sign-out-alt',
-                        label: logout.label || 'Logout',
-                        href: logout.href
-                    }), void 0))] }), void 0)] }), void 0));
+    return (React.createElement("div", { className: `sidebar${showActive ? ' active' : ''}` },
+        React.createElement("div", { className: "logo-content" },
+            React.createElement("div", { className: "logo" },
+                Boolean(logoThumb) && React.createElement("div", { className: "logo-thumb" }, logoThumb),
+                logoName && React.createElement("div", { className: "logo-name" }, logoName)),
+            React.createElement(Icon, { icon: "fa-bars", className: "btn-sidebar" })),
+        React.createElement("ul", { className: "nav-list" },
+            items.map((item, index) => (React.createElement(SideNavigationBarItem, Object.assign({ key: `side-navigation-bar-item-${index}` }, item)))),
+            !!(logout === null || logout === void 0 ? void 0 : logout.href) && (React.createElement(SideNavigationBarItem, Object.assign({}, {
+                className: 'link-logout',
+                icon: 'fa-sign-out-alt',
+                label: logout.label || 'Logout',
+                href: logout.href
+            }))))));
 });
 SideNavigationBar.displayName = 'SideNavigationBar';

package/dist/components/tabs/tab-list.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 export const TabList = ({ children }) => {
-    return (_jsx("div", Object.assign({ className: "tab-list" }, { children: children }), void 0));
+    return (React.createElement("div", { className: "tab-list" }, children));
 };

package/dist/components/tabs/tab-panel.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import classNames from 'classnames';
 export const TabPanel = ({ children, active }) => {
     const classes = classNames('tab-panel', active && 'active');
-    return (_jsx("div", Object.assign({ className: classes }, { children: children }), void 0));
+    return (React.createElement("div", { className: classes }, children));
 };

package/dist/components/tabs/tab.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { Link } from '../../atoms/link';
 import classNames from 'classnames';
 export const Tab = ({ children, href, active }) => {
     const classes = classNames('tab', active && 'active');
-    return (_jsx(Link, Object.assign({ className: classes, href: href }, { children: children }), void 0));
+    return (React.createElement(Link, { className: classes, href: href }, children));
 };

package/dist/components/tabs/tabs.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { TabList } from './tab-list';
 import { Tab } from './tab';
 import { useLocation } from 'react-router-dom';
@@ -21,11 +21,13 @@ export const Tabs = ({ children }) => {
             href: uriHelper.stringify(Object.assign(Object.assign(Object.assign({}, params), (params.page && { page: 1 })), { tab }))
         });
     };
-    return (_jsxs("div", Object.assign({ className: "tabs" }, { children: [_jsx(TabList, { children: (_a = tabList.props.children) === null || _a === void 0 ? void 0 : _a.map((child, index) => {
-                    var _a;
-                    return (_jsx(Tab, Object.assign({}, getParams(index), { children: (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.children }), `tab-child-${index}`));
-                }) }, void 0), tabPanels.map((child, index) => {
-                var _a;
-                return (_jsx(TabPanel, Object.assign({ active: getActive(index) }, { children: (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.children }), `tab-panel-child-${index}`));
-            })] }), void 0));
+    return (React.createElement("div", { className: "tabs" },
+        React.createElement(TabList, null, (_a = tabList.props.children) === null || _a === void 0 ? void 0 : _a.map((child, index) => {
+            var _a;
+            return (React.createElement(Tab, Object.assign({ key: `tab-child-${index}` }, getParams(index)), (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.children));
+        })),
+        tabPanels.map((child, index) => {
+            var _a;
+            return (React.createElement(TabPanel, { key: `tab-panel-child-${index}`, active: getActive(index) }, (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.children));
+        })));
 };

package/dist/molecules/alert.js

@@ -1,5 +1,4 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useState } from 'react';
+import React, { forwardRef, useImperativeHandle, useState } from 'react';
 import ReactDOM from 'react-dom';
 import classNames from 'classnames';
 import { Button } from '../atoms/button';
@@ -14,7 +13,12 @@ export const Alert = forwardRef((props, ref) => {
     }));
     const classes = classNames(className, 'alert-content', color);
     if (!display)
-        return _jsx(_Fragment, {}, void 0);
-    return ReactDOM.createPortal(_jsxs(_Fragment, { children: [_jsx("div", { className: "alert-overlay", onClick: close }, void 0), _jsxs("div", Object.assign({ className: classes }, { children: [_jsx("div", Object.assign({ className: "alert-body" }, { children: children }), void 0), showButton && (_jsx("div", Object.assign({ className: "alert-footer" }, { children: _jsx(Button, Object.assign({ color: "primary", onClick: close }, { children: buttonText }), void 0) }), void 0))] }), void 0)] }, void 0), document.getElementById('alert-portal'));
+        return React.createElement(React.Fragment, null);
+    return ReactDOM.createPortal(React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "alert-overlay", onClick: close }),
+        React.createElement("div", { className: classes },
+            React.createElement("div", { className: "alert-body" }, children),
+            showButton && (React.createElement("div", { className: "alert-footer" },
+                React.createElement(Button, { color: "primary", onClick: close }, buttonText))))), document.getElementById('alert-portal'));
 });
 Alert.displayName = 'Alert';

package/dist/molecules/breadcrumb.js

@@ -1,9 +1,11 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Link } from '../atoms/link';
 import { Icon } from '../atoms/icon';
 export const Breadcrumb = (props) => {
     const { items } = props;
-    return (_jsx("div", Object.assign({ className: "breadcrumb" }, { children: items.map((item, index) => (_jsx("div", { children: item.uri
-                ? _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({ href: item.uri }, { children: item.label }), void 0), _jsx(Icon, { icon: "faAngleRight" }, void 0)] }, void 0)
-                : _jsx("span", { children: item.label }, void 0) }, index))) }), void 0));
+    return (React.createElement("div", { className: "breadcrumb" }, items.map((item, index) => (React.createElement("div", { key: index }, item.uri
+        ? React.createElement(React.Fragment, null,
+            React.createElement(Link, { href: item.uri }, item.label),
+            React.createElement(Icon, { icon: "faAngleRight" }))
+        : React.createElement("span", null, item.label))))));
 };

package/dist/molecules/card.js

@@ -1,8 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Typography } from '../atoms/typography';
 import classNames from 'classnames';
 export const Card = (props) => {
     const { children, title, header, footer, fullHeight = false } = props;
     const classes = classNames('card', fullHeight && 'mh-100', footer && 'justify-content-between');
-    return (_jsxs("div", Object.assign({ className: classes }, { children: [!!(title || header) && (_jsxs("div", Object.assign({ className: "card-header" }, { children: [!!title && _jsx(Typography, Object.assign({ variant: "h4", className: "card-title" }, { children: title }), void 0), header] }), void 0)), _jsx("div", Object.assign({ className: "card-body" }, { children: children }), void 0), !!footer && (_jsx("div", Object.assign({ className: "card-footer" }, { children: footer }), void 0))] }), void 0));
+    return (React.createElement("div", { className: classes },
+        !!(title || header) && (React.createElement("div", { className: "card-header" },
+            !!title && React.createElement(Typography, { variant: "h4", className: "card-title" }, title),
+            header)),
+        React.createElement("div", { className: "card-body" }, children),
+        !!footer && (React.createElement("div", { className: "card-footer" }, footer))));
 };

package/dist/molecules/dropdown/dropdown-item.js

@@ -9,14 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { Link } from '../../atoms/link';
 export const DropdownItem = (props) => {
     if (props.separator)
-        return _jsx("div", { className: "dropdown-divider" }, void 0);
+        return React.createElement("div", { className: "dropdown-divider" });
     const _a = props, { uri, label, onClick } = _a, attrs = __rest(_a, ["uri", "label", "onClick"]);
     if (onClick) {
-        return _jsx("div", Object.assign({}, attrs, { className: "dropdown-item", onClick: onClick }, { children: label }), void 0);
+        return React.createElement("div", Object.assign({}, attrs, { className: "dropdown-item", onClick: onClick }), label);
     }
-    return _jsx(Link, Object.assign({}, attrs, { href: uri, className: "dropdown-item" }, { children: label }), void 0);
+    return React.createElement(Link, Object.assign({}, attrs, { href: uri, className: "dropdown-item" }), label);
 };