@m4l/components 9.1.120 → 9.1.121

package/.storybook/utils/getStylesColorsByMode.d.ts

@@ -25,11 +25,11 @@ export declare const colorsLight: {
         readonly selected: string;
         readonly selectedOpacity: string;
         readonly focusVisible: string;
-        readonly contrastText: string;
         readonly focus: string;
         readonly light: string;
         readonly dark: string;
         readonly main: string;
+        readonly contrastText: string;
         readonly enabled: string;
         readonly enabledOpacity: string;
         readonly hover: string;
@@ -180,11 +180,11 @@ export declare const colorsLight: {
         readonly selected: string;
         readonly selectedOpacity: string;
         readonly focusVisible: string;
-        readonly contrastText: string;
         readonly focus: string;
         readonly light: string;
         readonly dark: string;
         readonly main: string;
+        readonly contrastText: string;
         readonly enabled: string;
         readonly enabledOpacity: string;
         readonly hover: string;
@@ -336,11 +336,11 @@ export declare const colorsDark: {
         readonly selected: string;
         readonly selectedOpacity: string;
         readonly focusVisible: string;
-        readonly contrastText: string;
         readonly focus: string;
         readonly light: string;
         readonly dark: string;
         readonly main: string;
+        readonly contrastText: string;
         readonly enabled: string;
         readonly enabledOpacity: string;
         readonly hover: string;
@@ -491,11 +491,11 @@ export declare const colorsDark: {
         readonly selected: string;
         readonly selectedOpacity: string;
         readonly focusVisible: string;
-        readonly contrastText: string;
         readonly focus: string;
         readonly light: string;
         readonly dark: string;
         readonly main: string;
+        readonly contrastText: string;
         readonly enabled: string;
         readonly enabledOpacity: string;
         readonly hover: string;

package/components/DataGrid/contexts/DataGridContext/index.js

@@ -96,13 +96,12 @@ function DataGridProvider(props) {
     rows,
     rowsCount,
     rowActionsGetter,
-    rowHeights = [28, 32, 36],
-    rowHeaderHeights = [28, 32, 36],
+    rowHeights = [28, 32, 40],
+    rowHeaderHeights = [28, 32, 40],
     initialRowHeightVariant = "compact",
     checkedRows,
     onCheckedRowsChange,
-    rowKeyGetter,
-    classes
+    rowKeyGetter
   } = props;
   const [columnsWidths, setColumnsWidths] = useState(
     /* @__PURE__ */ new Map()
@@ -215,7 +214,6 @@ function DataGridProvider(props) {
         onChangeColumnWidth,
         setRowsCount: setRowFilterCountInternal,
         rowActionsGetter,
-        classes,
         setRowHeightVariant: setCurrentRowHeightInternal,
         onCheckedRowsChange,
         rowKeyGetter

package/components/DataGrid/contexts/DataGridContext/types.d.ts

@@ -1,7 +1,6 @@
 import { ReactNode } from 'react';
 import { Maybe } from '@m4l/core';
 import { RowKey, RowHeightVariants, GridProps } from '../../types';
-import { Classes } from '../../classes/types';
 export interface IConfigColumn {
     key: string;
     visible: boolean;
@@ -22,14 +21,13 @@ export interface DataGridProviderProps<TRow, TSummaryRow, TKey extends RowKey =
     children: ReactNode;
     remoteConfig?: IGridConfig;
     rowsCount: number;
-    classes: Classes;
 }
 export type RowHeightState = {
     rowHVariant: RowHeightVariants;
     rowHeight: number;
     rowHeaderHeight: number;
 };
-export interface DataGridContextProps<TRow, TSummaryRow, TKey extends RowKey = RowKey> extends IGridConfig, Pick<DataGridProviderProps<TRow, TSummaryRow, TKey>, 'rows' | 'checkedRows' | 'onCheckedRowsChange' | 'rowHeights' | 'rowsCount' | 'rowActionsGetter' | 'rowKeyGetter' | 'classes'> {
+export interface DataGridContextProps<TRow, TSummaryRow, TKey extends RowKey = RowKey> extends IGridConfig, Pick<DataGridProviderProps<TRow, TSummaryRow, TKey>, 'rows' | 'checkedRows' | 'onCheckedRowsChange' | 'rowHeights' | 'rowsCount' | 'rowActionsGetter' | 'rowKeyGetter'> {
     setRowsCount: (newRowsCount: number) => void;
     currentRowHeaderHeight: number;
     currentRowHeight: number;

package/components/DataGrid/contexts/FilterContext/index.d.ts

@@ -6,7 +6,7 @@ type FilterProviderProps = {
     initialActiveFilters: boolean;
 };
 /**
- * TODO: Documentar
+ * Proveedor de contexto para los filtros de la tabla
  */
 declare function FilterProvider({ children, initialActiveFilters }: FilterProviderProps): import("react/jsx-runtime").JSX.Element;
 export { FilterProvider, FilterContext };

package/components/DataGrid/dictionary.d.ts

@@ -6,4 +6,22 @@ export declare const dictionary: {
     LABEL_ACTIONS: string;
     LABEL_ROWS_PER_PAGE: string;
     LABEL_OF: string;
+    DENSITY_COMPACT: string;
+    DENSITY_STANDARD: string;
+    DENSITY_CONFORTABLE: string;
+    DENSITY_TOOLTIP: string;
+    TOOLTIP_FILTER_HIDE: string;
+    TOOLTIP_FILTER_SHOW: string;
+    SETTINGS_COLUMN_NAME: string;
+    SETTINGS_COLUMN_POSITION: string;
+    SETTINGS_COLUMN_VISIBLE: string;
+    SETTINGS_COLUMNS_FROZEN: string;
+    SETTINGS_SEL_COLUMNS: string;
+    SETTINGS_MOVE_FIRST: string;
+    SETTINGS_MOVE_UP: string;
+    SETTINGS_MOVE_LAST: string;
+    SETTINGS_MOVE_DOWN: string;
+    SETTINGS_VISIBLE_ALL: string;
+    SETTINGS_NO_VISIBLE_ALL: string;
+    SETTINGS_RESTORE: string;
 };

package/components/DataGrid/dictionary.js

@@ -6,7 +6,25 @@ function getDataGridComponentsDictionary() {
 const dictionary = {
   LABEL_ACTIONS: "actions",
   LABEL_ROWS_PER_PAGE: "pager.rows_per_page",
-  LABEL_OF: "pager.of"
+  LABEL_OF: "pager.of",
+  DENSITY_COMPACT: `${getDataGridComponentsDictionary()[0]}.density_compact`,
+  DENSITY_STANDARD: `${getDataGridComponentsDictionary()[0]}.density_standard`,
+  DENSITY_CONFORTABLE: `${getDataGridComponentsDictionary()[0]}.density_confortable`,
+  DENSITY_TOOLTIP: `${getDataGridComponentsDictionary()[0]}.tooltip_density`,
+  TOOLTIP_FILTER_HIDE: `${getDataGridComponentsDictionary()[0]}.tooltip_filter_hide`,
+  TOOLTIP_FILTER_SHOW: `${getDataGridComponentsDictionary()[0]}.tooltip_filter_show`,
+  SETTINGS_COLUMN_NAME: `${getDataGridComponentsDictionary()[0]}.settings_column_name`,
+  SETTINGS_COLUMN_POSITION: `${getDataGridComponentsDictionary()[0]}.settings_column_position`,
+  SETTINGS_COLUMN_VISIBLE: `${getDataGridComponentsDictionary()[0]}.settings_column_visible`,
+  SETTINGS_COLUMNS_FROZEN: `${getDataGridComponentsDictionary()[0]}.settings_column_frozen`,
+  SETTINGS_SEL_COLUMNS: `${getDataGridComponentsDictionary()[0]}.settings_sel_columns`,
+  SETTINGS_MOVE_FIRST: `${getDataGridComponentsDictionary()[0]}.settings_move_first`,
+  SETTINGS_MOVE_UP: `${getDataGridComponentsDictionary()[0]}.settings_move_up`,
+  SETTINGS_MOVE_LAST: `${getDataGridComponentsDictionary()[0]}.settings_move_last`,
+  SETTINGS_MOVE_DOWN: `${getDataGridComponentsDictionary()[0]}.settings_move_down`,
+  SETTINGS_VISIBLE_ALL: `${getDataGridComponentsDictionary()[0]}.settings_visible_all`,
+  SETTINGS_NO_VISIBLE_ALL: `${getDataGridComponentsDictionary()[0]}.settings_no_visible_all`,
+  SETTINGS_RESTORE: `${getDataGridComponentsDictionary()[0]}.settings_restore`
 };
 export {
   dictionary as d,

package/components/DataGrid/formatters/ColumnBooleanFormatter/index.d.ts

@@ -1,5 +1,5 @@
 import { ColumnBooleanFormatterProps } from './types';
 /**
- * TODO: Documentar
+ * Función para formatear un booleano en una columna de un DataGrid
  */
 export declare function ColumnBooleanFormatter(props: ColumnBooleanFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/formatters/ColumnConcatenatedValueFormatter/index.js

@@ -8,7 +8,7 @@ function ColumnConcatenatedValueFormatter(props) {
       const valueMaybeString = getPropertyByString(obProps, element);
       let fixedValue;
       if (typeof valueMaybeString === "string" || typeof valueMaybeString === "number") {
-        fixedValue = valueMaybeString;
+        fixedValue = valueMaybeString.toString();
       } else {
         fixedValue = "";
       }

package/components/DataGrid/formatters/ColumnDateFormatter/index.d.ts

@@ -1,5 +1,5 @@
 import { ColumnDateFormatterProps } from './types';
 /**
- * TODO: Documentar
+ * Función para formatear una fecha en una columna de un DataGrid
  */
 export declare function ColumnDateFormatter(props: ColumnDateFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/formatters/ColumnIconFormatter/index.d.ts

@@ -1,5 +1,5 @@
 import { ColumnIconFormatterProps } from './types';
 /**
- * TODO: Documentar
+ * Función para formatear un icono en una columna de un DataGrid
  */
 export declare function ColumnIconFormatter(props: ColumnIconFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/formatters/ColumnIconFormatter/index.js

@@ -1,11 +1,10 @@
 import { jsx } from "react/jsx-runtime";
-import { d as dataGridClasses } from "../../classes/index.js";
 import { I as Icon } from "../../../Icon/Icon.js";
 function ColumnIconFormatter(props) {
   const { getIconUrl } = props;
   return (obProps) => {
     const { iconUrl } = getIconUrl(obProps);
-    return /* @__PURE__ */ jsx("div", { className: dataGridClasses.iconFormatter, children: /* @__PURE__ */ jsx(Icon, { src: iconUrl }) });
+    return /* @__PURE__ */ jsx(Icon, { src: iconUrl });
   };
 }
 export {

package/components/DataGrid/formatters/ColumnInteractiveCheckFormatter/index.js

@@ -1,6 +1,5 @@
 import { jsx } from "react/jsx-runtime";
 import { Checkbox } from "@mui/material";
-import { d as dataGridClasses } from "../../classes/index.js";
 function ColumnInteractiveCheckFormatter(props) {
   const { row, onRowChange, column } = props;
   const handleChange = () => {
@@ -13,8 +12,7 @@ function ColumnInteractiveCheckFormatter(props) {
     {
       size: "small",
       checked: row[column.key] || false,
-      onChange: handleChange,
-      className: dataGridClasses.formatterColumn
+      onChange: handleChange
     }
   );
 }

package/components/DataGrid/formatters/ColumnSetCheckFormatter/index.d.ts

@@ -6,7 +6,4 @@ import { RowKey } from '../../types';
  * acualizando un Set/Setter por medio de un hook generico el cual es invocado con el argumento field para ,
  * sin la necesidad de entrar en edición como lo hace un editor
  */
-/**
- * TODO: Documentar
- */
 export declare function ColumnSetCheckFormatter<Row, TKey extends RowKey = RowKey>(parameters: ColumnSetCheckFormatterProps<Row, TKey>): (props: FormatterProps<Row>) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/hooks/useDataGrid.d.ts

@@ -1,6 +1,7 @@
 import { DataGridContextProps } from '../contexts/DataGridContext/types';
 /**
- * TODO: Documentar
+ * Hook para obtener el contexto de DataGrid
+ * @returns DataGridContextProps
  */
 export declare function useDataGrid<TRow, TSummaryRow>(): DataGridContextProps<TRow, TSummaryRow>;
 export default useDataGrid;

package/components/DataGrid/icons.d.ts

@@ -0,0 +1,15 @@
+export declare const pathIcons: {
+    compact: string;
+    standard: string;
+    confortable: string;
+    filter: string;
+    configuration: string;
+    menu: string;
+    moveFirstPlace: string;
+    moveUpPlace: string;
+    moveLastPlace: string;
+    moveDownPlace: string;
+    checkAll: string;
+    uncheckAll: string;
+    restoreColumns: string;
+};

package/components/DataGrid/icons.js

@@ -0,0 +1,18 @@
+const pathIcons = {
+  compact: "frontend/components/data_grid/assets/icons/compact.svg",
+  standard: "frontend/components/data_grid/assets/icons/standard.svg",
+  confortable: "frontend/components/data_grid/assets/icons/confortable.svg",
+  filter: "frontend/components/data_grid/assets/icons/filter.svg",
+  configuration: "frontend/components/data_grid/assets/icons/configuration.svg",
+  menu: "frontend/components/data_grid/assets/icons/menu.svg",
+  moveFirstPlace: "frontend/components/data_grid/assets/icons/move_first_place.svg",
+  moveUpPlace: "frontend/components/data_grid/assets/icons/move_up_place.svg",
+  moveLastPlace: "frontend/components/data_grid/assets/icons/move_last_place.svg",
+  moveDownPlace: "frontend/components/data_grid/assets/icons/move_down_place.svg",
+  checkAll: "frontend/components/data_grid/assets/icons/check_all.svg",
+  uncheckAll: "frontend/components/data_grid/assets/icons/uncheck_all.svg",
+  restoreColumns: "frontend/components/data_grid/assets/icons/restore_columns.svg"
+};
+export {
+  pathIcons as p
+};

package/components/DataGrid/index.d.ts

@@ -1,5 +1,9 @@
 import { DataGridProps, RowKey } from './types';
 /**
- * TODO: Documentar
+ * DataGrid es un componente encargado de mostrar información en una tabla
+ * con funcionalidades de paginación, filtros y acciones.
+ * ### Dependencies:
+ * - **`useResponsiveContainerStore:`** Hook que permite obtener el tamaño del contenedor.
+ * - **`useModuleDictionary:`** Hook que permite manejar la internacionalización de los textos.
  */
 export declare function DataGrid<TRow, TSummaryRow, TKey extends RowKey = RowKey>(props: DataGridProps<TRow, TSummaryRow, TKey>): import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/index.js

@@ -1,14 +1,14 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { D as DataGridRoot } from "./styles.js";
 import { T as Table } from "./subcomponents/Table/index.js";
 import { A as Actions } from "./subcomponents/Actions/index.js";
 import { a as FilterProvider } from "./contexts/FilterContext/index.js";
 import { a as DataGridProvider } from "./contexts/DataGridContext/index.js";
 import { T as TEST_PROP_COLUMNS } from "./types.js";
-import { a as dataGridUtilityClasses } from "./classes/index.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";
 import { a as getNameDataTestId } from "../../test/getNameDataTestId.js";
 import { D as DATAGRID_PREFIX_NAME } from "./constants.js";
+import { D as DataGridRootStyled } from "./slots/DataGridSlot.js";
+import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 function DataGrid(props) {
   const {
     id,
@@ -28,15 +28,11 @@ function DataGrid(props) {
     onCheckedRowsChange,
     dataTestId = ""
   } = props;
-  const ownerState = {
-    actionsProps,
-    withActions
-  };
-  const classes = dataGridUtilityClasses(ownerState);
+  const classRoot = getComponentSlotRoot(DATAGRID_PREFIX_NAME);
   return /* @__PURE__ */ jsx(
-    DataGridRoot,
+    DataGridRootStyled,
     {
-      className: classes.root,
+      className: classRoot,
       ...process.env.NODE_ENV !== "production" ? {
         [TEST_PROP_COLUMNS]: JSON.stringify(columns),
         [TEST_PROP_ID]: getNameDataTestId(DATAGRID_PREFIX_NAME, "root", dataTestId)
@@ -55,7 +51,6 @@ function DataGrid(props) {
           onCheckedRowsChange,
           rowKeyGetter,
           rows,
-          classes,
           children: /* @__PURE__ */ jsxs(FilterProvider, { initialActiveFilters: false, children: [
             withActions && actionsProps && /* @__PURE__ */ jsx(
               Actions,

package/components/DataGrid/slots/DataGridEnum.d.ts

@@ -0,0 +1,30 @@
+export declare enum DataGridSlots {
+    datagridRoot = "datagridRoot"
+}
+export declare enum ActionsSlots {
+    actionsRoot = "actionsRoot",
+    actionsConfigContainer = "actionsConfigContainer"
+}
+export declare enum RowsCountSlots {
+    rowsCountRoot = "rowsCountRoot",
+    rowsCountLabel = "rowsCountLabel",
+    rowsCountValue = "rowsCountValue"
+}
+export declare enum TableSlots {
+    tableContaniner = "tableContaniner",
+    tableWrapperDataGrid = "tableWrapperDataGrid",
+    draggableHeaderRoot = "draggableHeaderRoot",
+    draggableWrapperInputBase = "draggableWrapperInputBase",
+    headerInputBase = "headerInputBase",
+    wrapperSkeleton = "wrapperSkeleton",
+    contentModalSetting = "contentModalSetting"
+}
+export declare enum TextEditorSlots {
+    inputTexEditor = "inputTexEditor"
+}
+export declare enum ColumnsConfigSlots {
+    columnsConfigWrapper = "columnsConfigWrapper",
+    columnsConfigSelColumns = "columnsConfigSelColumns",
+    columnsConfigDataGrid = "columnsConfigDataGrid",
+    columnsConfigActios = "columnsConfigActios"
+}

package/components/DataGrid/slots/DataGridEnum.js

@@ -0,0 +1,44 @@
+var DataGridSlots = /* @__PURE__ */ ((DataGridSlots2) => {
+  DataGridSlots2["datagridRoot"] = "datagridRoot";
+  return DataGridSlots2;
+})(DataGridSlots || {});
+var ActionsSlots = /* @__PURE__ */ ((ActionsSlots2) => {
+  ActionsSlots2["actionsRoot"] = "actionsRoot";
+  ActionsSlots2["actionsConfigContainer"] = "actionsConfigContainer";
+  return ActionsSlots2;
+})(ActionsSlots || {});
+var RowsCountSlots = /* @__PURE__ */ ((RowsCountSlots2) => {
+  RowsCountSlots2["rowsCountRoot"] = "rowsCountRoot";
+  RowsCountSlots2["rowsCountLabel"] = "rowsCountLabel";
+  RowsCountSlots2["rowsCountValue"] = "rowsCountValue";
+  return RowsCountSlots2;
+})(RowsCountSlots || {});
+var TableSlots = /* @__PURE__ */ ((TableSlots2) => {
+  TableSlots2["tableContaniner"] = "tableContaniner";
+  TableSlots2["tableWrapperDataGrid"] = "tableWrapperDataGrid";
+  TableSlots2["draggableHeaderRoot"] = "draggableHeaderRoot";
+  TableSlots2["draggableWrapperInputBase"] = "draggableWrapperInputBase";
+  TableSlots2["headerInputBase"] = "headerInputBase";
+  TableSlots2["wrapperSkeleton"] = "wrapperSkeleton";
+  TableSlots2["contentModalSetting"] = "contentModalSetting";
+  return TableSlots2;
+})(TableSlots || {});
+var TextEditorSlots = /* @__PURE__ */ ((TextEditorSlots2) => {
+  TextEditorSlots2["inputTexEditor"] = "inputTexEditor";
+  return TextEditorSlots2;
+})(TextEditorSlots || {});
+var ColumnsConfigSlots = /* @__PURE__ */ ((ColumnsConfigSlots2) => {
+  ColumnsConfigSlots2["columnsConfigWrapper"] = "columnsConfigWrapper";
+  ColumnsConfigSlots2["columnsConfigSelColumns"] = "columnsConfigSelColumns";
+  ColumnsConfigSlots2["columnsConfigDataGrid"] = "columnsConfigDataGrid";
+  ColumnsConfigSlots2["columnsConfigActios"] = "columnsConfigActios";
+  return ColumnsConfigSlots2;
+})(ColumnsConfigSlots || {});
+export {
+  ActionsSlots as A,
+  ColumnsConfigSlots as C,
+  DataGridSlots as D,
+  RowsCountSlots as R,
+  TableSlots as T,
+  TextEditorSlots as a
+};

package/components/DataGrid/slots/DataGridSlot.d.ts

@@ -0,0 +1,48 @@
+/**
+ * ****************
+ * Slots DataGrid
+ * ****************
+ */
+export declare const DataGridRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+/**
+ * ****************
+ * Slots Actions
+ * ****************
+ */
+export declare const ActionsRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ActionsConfigContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+/**
+ * ****************
+ * Slots RowsCount
+ * ****************
+ */
+export declare const RowsCountRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const RowsCountLabelStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const RowsCountValueStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+/**
+ * ****************
+ * Slots ColumnsConfig
+ * ****************
+ */
+export declare const ColumnsConfigWrapperStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigSelColumnsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigDataGridStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigActiosStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+/**
+ * ****************
+ * Slots Table
+ * ****************
+ */
+export declare const TableContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const TableWrapperDataGridStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const DraggableHeaderRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const DraggableWrapperInputBaseStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const HeaderInputBaseStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').InputBaseProps, keyof import('@mui/material').InputBaseProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, {}, {}>;
+export declare const WrapperSkeletonStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ContentModalSettingStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+/**
+ * ****************
+ * Slots TextEditor
+ * ****************
+ */
+export declare const InputTextEditorStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import('react').ClassAttributes<HTMLInputElement> | keyof import('react').InputHTMLAttributes<HTMLInputElement>>, {}>;

package/components/DataGrid/slots/DataGridSlot.js

@@ -0,0 +1,97 @@
+import { styled } from "@mui/material/styles";
+import { InputBase } from "@mui/material";
+import { D as DATAGRID_PREFIX_NAME } from "../constants.js";
+import { D as DataGridSlots, A as ActionsSlots, R as RowsCountSlots, C as ColumnsConfigSlots, T as TableSlots, a as TextEditorSlots } from "./DataGridEnum.js";
+import { d as dataGridStyles } from "../styles.js";
+const DataGridRootStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: DataGridSlots.datagridRoot
+})(dataGridStyles.datagridRoot);
+const ActionsRootStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ActionsSlots.actionsRoot
+})(dataGridStyles.actionsRoot);
+const ActionsConfigContainerStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ActionsSlots.actionsConfigContainer
+})(dataGridStyles.actionsConfigContainer);
+const RowsCountRootStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: RowsCountSlots.rowsCountRoot
+})(dataGridStyles.rowsCountRoot);
+const RowsCountLabelStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: RowsCountSlots.rowsCountLabel
+})(dataGridStyles.rowsCountLabel);
+const RowsCountValueStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: RowsCountSlots.rowsCountValue
+})(dataGridStyles.rowsCountValue);
+const ColumnsConfigWrapperStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ColumnsConfigSlots.columnsConfigWrapper
+})(dataGridStyles.columnsConfigWrapper);
+const ColumnsConfigSelColumnsStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ColumnsConfigSlots.columnsConfigSelColumns
+})(dataGridStyles.columnsConfigSelColumns);
+const ColumnsConfigDataGridStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ColumnsConfigSlots.columnsConfigDataGrid
+})(dataGridStyles.columnsConfigDataGrid);
+const ColumnsConfigActiosStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: ColumnsConfigSlots.columnsConfigActios
+})(dataGridStyles.columnsConfigActios);
+const TableContainerStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.tableContaniner
+})(dataGridStyles.tableContaniner);
+const TableWrapperDataGridStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.tableWrapperDataGrid
+})(dataGridStyles.tableWrapperDataGrid);
+const DraggableHeaderRootStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.draggableHeaderRoot
+})(dataGridStyles.draggableHeaderRoot);
+const DraggableWrapperInputBaseStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.draggableWrapperInputBase
+})(dataGridStyles.draggableWrapperInputBase);
+const HeaderInputBaseStyled = styled(InputBase, {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.headerInputBase
+})(dataGridStyles.headerInputBase);
+const WrapperSkeletonStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.wrapperSkeleton
+})(dataGridStyles.wrapperSkeleton);
+const ContentModalSettingStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TableSlots.contentModalSetting
+})(dataGridStyles.contentModalSetting);
+const InputTextEditorStyled = styled("input", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: TextEditorSlots.inputTexEditor
+})(dataGridStyles.inputTexEditor);
+export {
+  ActionsRootStyled as A,
+  ColumnsConfigWrapperStyled as C,
+  DataGridRootStyled as D,
+  HeaderInputBaseStyled as H,
+  InputTextEditorStyled as I,
+  RowsCountRootStyled as R,
+  TableWrapperDataGridStyled as T,
+  WrapperSkeletonStyled as W,
+  ActionsConfigContainerStyled as a,
+  RowsCountLabelStyled as b,
+  RowsCountValueStyled as c,
+  ColumnsConfigSelColumnsStyled as d,
+  ColumnsConfigDataGridStyled as e,
+  ColumnsConfigActiosStyled as f,
+  ContentModalSettingStyled as g,
+  TableContainerStyled as h,
+  DraggableHeaderRootStyled as i,
+  DraggableWrapperInputBaseStyled as j
+};

package/components/DataGrid/styles.d.ts

@@ -1 +1,2 @@
-export declare const DataGridRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+import { DataGridStyles } from './types';
+export declare const dataGridStyles: DataGridStyles;