eai-frontend-components 2.0.78 → 2.0.80

package/dist/index.js

@@ -9606,7 +9606,7 @@ const FormInputPhone = ({ control, name, label, subLabel, helpText, placeholder,
 
 const FormRadioGroup = ({ control, name, value, label, subLabel, helpText, className, classNameOptions, disabled, required, size = 'md', options, onChange, }) => {
     const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
-    return (jsxRuntime.jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (jsxRuntime.jsxs(FormItem, { children: [jsxRuntime.jsxs("div", { className: cn('flex items-center space-x-1.5 mb-2', className), children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), jsxRuntime.jsx(FormControl, { children: jsxRuntime.jsx(RadioGroup, { onValueChange: (value) => {
+    return (jsxRuntime.jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (jsxRuntime.jsxs(FormItem, { children: [label && (jsxRuntime.jsxs("div", { className: cn('flex items-center space-x-1.5 mb-2', className), children: [formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] })), jsxRuntime.jsx(FormControl, { children: jsxRuntime.jsx(RadioGroup, { onValueChange: (value) => {
                             field?.onChange?.(value);
                             onChange?.(value);
                         }, defaultValue: field.value, disabled: disabled || formState.isSubmitting, className: `${className}`, children: jsxRuntime.jsx("div", { className: cn('flex flex-grow gap-6 font-medium text-sm', classNameOptions), children: options?.map((option) => (jsxRuntime.jsx("label", { htmlFor: `r${option.value}`, className: cn(option.disabled ? 'cursor-not-allowed' : 'cursor-pointer', 'block'), children: jsxRuntime.jsxs("div", { className: 'flex flex-col', children: [jsxRuntime.jsxs("div", { className: 'flex items-center space-x-2', children: [jsxRuntime.jsx(RadioGroupItem, { value: option.value, id: `r${option.value}`, checked: field.value === option.value, disabled: option.disabled, size: size }), jsxRuntime.jsx("div", { className: option.disabled ? 'opacity-50' : '', children: option.label })] }), option.description && (jsxRuntime.jsx("div", { className: cn('pl-6 text-zinc-500', { 'opacity-50': option.disabled }), children: option.description }))] }) }, `radio-${name}-${option.value}`))) }) }) }), formMessage(FormMessage)] })) }, value));
@@ -10527,7 +10527,7 @@ function DataTableRows({ table, isLoading, columns, actionsRow, textNoRecords, e
     return isLoading ? renderLoadingRows() : rows.length ? renderRows() : renderEmptyRows();
 }
 
-function DataTable({ columns, data, className, title, rowsPage, actions, actionsRow, customFilters, setSearch, pageChanged, pageSizeChanged, totalRows, filtersActions, exportData, textNoRecords, heightRemainingScroll, hideFilterField, multiRowSelection, hidePagination, disablePagination, isLoading, fixedHeight, }) {
+function DataTable({ columns, data, className, title, rowsPage, actions, actionsRow, customFilters, setSearch, pageChanged, pageSizeChanged, totalRows, filtersActions, exportData, textNoRecords, heightRemainingScroll, hideFilterField, defaultSearch, multiRowSelection, hidePagination, disablePagination, isLoading, fixedHeight, }) {
     const [sorting, setSorting] = React$1.useState([]);
     const [pagination, setPagination] = React$1.useState({
         pageIndex: 0,
@@ -10569,6 +10569,11 @@ function DataTable({ columns, data, className, title, rowsPage, actions, actions
             setPagination({ ...pagination, pageIndex: 0 });
         }
     }, [data]);
+    React$1.useEffect(() => {
+        if (defaultSearch) {
+            setSearch?.(defaultSearch);
+        }
+    }, []);
     React$1.useEffect(() => {
         handleResize();
         window.addEventListener('resize', handleResize);
@@ -10611,7 +10616,7 @@ function DataTable({ columns, data, className, title, rowsPage, actions, actions
             setPagination({ ...pagination, pageIndex: index });
         }
     };
-    return (jsxRuntime.jsxs("div", { className: 'flex flex-col flex-1', children: [(!hideFilterField || filtersActions || customFilters || actions) && (jsxRuntime.jsxs("div", { className: 'flex items-end justify-between mb-4 space-x-6', children: [jsxRuntime.jsxs("div", { className: 'flex items-center gap-x-4', children: [(!hideFilterField || customFilters) && (jsxRuntime.jsxs("div", { className: 'flex gap-x-4', children: [!hideFilterField && (jsxRuntime.jsxs("div", { className: 'flex bg-background items-center border border-slate-300 rounded-sm w-[350px] overflow-hidden focus-within:outline-none focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 group', children: [jsxRuntime.jsx("div", { className: 'pl-3.5 transform transition-transform duration-300 group-hover:-translate-x-1', children: jsxRuntime.jsx(lucideReact.Search, { size: 18, className: 'w-5 h-5 stroke-zinc-500 dark:stroke-default' }) }), jsxRuntime.jsx("input", { placeholder: 'Buscar', onChange: (event) => {
+    return (jsxRuntime.jsxs("div", { className: 'flex flex-col flex-1', children: [(!hideFilterField || filtersActions || customFilters || actions) && (jsxRuntime.jsxs("div", { className: 'flex items-end justify-between mb-4 space-x-6', children: [jsxRuntime.jsxs("div", { className: 'flex items-center gap-x-4', children: [(!hideFilterField || customFilters) && (jsxRuntime.jsxs("div", { className: 'flex gap-x-4', children: [!hideFilterField && (jsxRuntime.jsxs("div", { className: 'flex bg-background items-center border border-slate-300 rounded-sm w-[350px] overflow-hidden focus-within:outline-none focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 group', children: [jsxRuntime.jsx("div", { className: 'pl-3.5 transform transition-transform duration-300 group-hover:-translate-x-1', children: jsxRuntime.jsx(lucideReact.Search, { size: 18, className: 'w-5 h-5 stroke-zinc-500 dark:stroke-default' }) }), jsxRuntime.jsx("input", { placeholder: 'Buscar', defaultValue: defaultSearch, onChange: (event) => {
                                                     handleSearchChange(event);
                                                 }, className: 'w-full bg-background text-default border-none focus:ring-0 focus:outline-none px-3 py-2 transform transition-transform duration-300 group-hover:-translate-x-1 ' })] })), customFilters] })), filtersActions && (jsxRuntime.jsxs(Sheet, { open: filtersActions.filterOpen, onOpenChange: filtersActions.setFilterOpen, children: [jsxRuntime.jsx(SheetTrigger, { asChild: true, children: jsxRuntime.jsxs(Button, { variant: 'secondary', type: 'button', children: [jsxRuntime.jsx(lucideReact.Filter, { size: 20, className: 'h-4 w-4' }), " Filtros", filtersActions.countFilters > 0 && (jsxRuntime.jsx("div", { className: 'bg-background-primary text-white rounded-full h-5 w-5 flex items-center justify-center text-sm placeholder:text-muted-foreground', children: filtersActions.countFilters }))] }) }), jsxRuntime.jsxs(SheetContent, { children: [jsxRuntime.jsxs(SheetHeader, { children: [jsxRuntime.jsx(SheetTitle, { children: "Filtros" }), jsxRuntime.jsx(SheetDescription, {})] }), jsxRuntime.jsx("div", { className: 'flex flex-col py-6', children: filtersActions.fields })] })] }))] }), jsxRuntime.jsx("div", { className: 'flex space-x-4 content-end', children: actions?.map((action, index) => (jsxRuntime.jsx("div", { children: jsxRuntime.jsxs(Button, { type: 'button', onClick: () => action.onClick?.(selectedIds, selectedRows), className: cn(action.className, action.hideUnselectedRows && selectedRows.length === 0 ? 'hidden' : ''), variant: action.variant || 'default', disabled: action.disabled, children: [jsxRuntime.jsx("div", { className: '[&_svg]:size-5', children: action.icon }), action.label] }) }, `action-table-${index}`))) })] })), jsxRuntime.jsxs("div", { className: `flex-1 flex flex-col rounded-md border ${className}`, children: [jsxRuntime.jsx("div", { className: 'flex items-center justify-between', children: title && jsxRuntime.jsx("div", { className: 'text-h4 p-4', children: title }) }), jsxRuntime.jsx("div", { id: 'data-table', ref: tableContainerRef, style: fixedHeight ? { height: fixedHeight } : { height: tableHeight }, className: 'flex flex-col justify-between rounded-md overflow-x-auto overflow-y-auto', children: jsxRuntime.jsxs(Table, { children: [jsxRuntime.jsx(DataTableHeader, { table: table, canActionsRow: actionsRow && actionsRow.length > 0, enableMultiRowSelection: enableMultiRowSelection }), jsxRuntime.jsx(TableBody, { className: 'bg-background', children: jsxRuntime.jsx(DataTableRows, { table: table, columns: columns, isLoading: isLoading, actionsRow: actionsRow, textNoRecords: textNoRecords, enableMultiRowSelection: enableMultiRowSelection }) })] }) })] }), jsxRuntime.jsx(DataTableFooter, { hidePagination: hidePagination, disablePagination: disablePagination, isLoading: isLoading, totalRows: totalRows, totalPages: totalPages, currentPage: currentPage, pagination: pagination, handlePageSize: handlePageSize, handlePage: handlePage, previousPage: { action: () => table.previousPage(), disabled: !table.getCanPreviousPage() }, nextPage: { action: () => table.nextPage(), disabled: !table.getCanNextPage() }, exportData: exportData })] }));
 }