@max-ts/components 0.2.3 → 0.3.0

package/lib/components/DataGrid/Row/useLogic/useLogic.d.ts

@@ -2,14 +2,10 @@ import { MouseEvent, SyntheticEvent } from 'react';
 import { CellValue } from '../../types';
 import { RowProps } from '../Row';
 type UseLogicParams<TData extends Record<string, CellValue>> = RowProps<TData>;
-export declare const useLogic: <TData extends Record<string, CellValue>>({ keyId, columns, row, nestedChildren, level, variant, activeRowId, options, isInitialExpanded, expandedLevel, isSelectable, selectedRows, onSelectRow, onRowClick, isVisibleCollapseButton, }: UseLogicParams<TData>) => {
-    isOpen: boolean;
-    isShowConnector: boolean;
-    childrenColumns: any[];
+export declare const useLogic: <TData extends Record<string, CellValue>>({ keyId, columns, row, activeRowId, options, isSelectable, selectedRows, onSelectRow, onRowClick, }: UseLogicParams<TData>) => {
     rowId: string;
     disabled: boolean | undefined;
-    isRenderCollapseButton: boolean;
-    handleToggle: (event: MouseEvent<HTMLButtonElement>) => void;
+    columns: import('../../types').DataGridColumns<TData>[];
     rowProps: {
         $isHovered: boolean;
         $isSelected: boolean;
@@ -27,9 +23,5 @@ export declare const useLogic: <TData extends Record<string, CellValue>>({ keyId
         disabled: boolean | undefined;
         onChange: (event: import('react').ChangeEvent<HTMLInputElement>) => void;
     };
-    nestedChildrenProps: {
-        isOpen: boolean;
-        rowId: string;
-    };
 };
 export {};

package/lib/components/DataGrid/Row/useLogic/useLogic.mjs

@@ -1,79 +1,48 @@
-import { useContext as m, useState as W, useEffect as q, useMemo as z } from "react";
-import { DataGridContext as F } from "../../DataGridContext/DataGridContext.mjs";
-import "../../../../_virtual/jsx-runtime.mjs";
-import { Variant as J } from "../../enums.mjs";
-import { RowContext as K } from "../RowContext/RowContext.mjs";
-import { DISABLE_ROW_ATTR as f } from "../constants.mjs";
-import { mergeColumnsOptions as N } from "./utils/mergeColumnsOptions/mergeColumnsOptions.mjs";
-const oe = ({
-  keyId: r,
-  columns: a,
-  row: s,
-  nestedChildren: c,
-  level: u,
-  variant: b,
-  activeRowId: C,
-  options: n,
-  isInitialExpanded: h = !1,
-  expandedLevel: g,
-  isSelectable: D,
-  selectedRows: x,
-  onSelectRow: O,
-  onRowClick: d,
-  isVisibleCollapseButton: T
+import { useState as g } from "react";
+import { DISABLE_ROW_ATTR as a } from "../constants.mjs";
+const R = ({
+  keyId: i,
+  columns: d,
+  row: t,
+  activeRowId: c,
+  options: r,
+  isSelectable: p,
+  selectedRows: b,
+  onSelectRow: u,
+  onRowClick: n
 }) => {
-  const R = h && u <= g - 1 && c?.length, { checkIsOpened: v, toggleOpenItems: p } = m(F), { isDisabled: B, disabledReason: M } = m(K), [P, i] = W(!1), e = s[r], {
-    isDisabled: k,
-    disabledReason: A
-  } = n || {}, t = B || k, l = v(e);
-  q(() => {
-    R && !l && p(e);
-  }, []);
-  const E = D && !!x?.find((o) => o[r] === e), S = Object.is(b, J.Tree), I = z(
-    () => N(a, n?.childrenColumns),
-    [a, n]
-  ), V = (o) => {
-    o.stopPropagation(), p(e);
-  }, w = (o) => {
-    o.target.getAttribute(f) === "true" && i(!0);
-  }, L = () => i(!1), _ = (o) => {
-    if (!t)
-      return;
-    o.target.getAttribute(f) === "true" || i(!1);
-  }, $ = () => {
-    t || d?.(s);
-  }, j = !!c?.length && T;
+  const [h, l] = g(!1), s = t[i], { isDisabled: e, disabledReason: C } = r || {}, f = p && !!b?.find((o) => o[i] === s);
   return {
-    isOpen: l,
-    isShowConnector: S,
-    childrenColumns: I,
-    rowId: e,
-    disabled: t,
-    isRenderCollapseButton: j,
-    handleToggle: V,
+    rowId: s,
+    disabled: e,
+    columns: d,
     rowProps: {
-      $isHovered: !!(!t && d),
-      $isSelected: C === e,
-      onClick: $,
-      onMouseMove: _
+      $isHovered: !!(!e && n),
+      $isSelected: c === s,
+      onClick: () => {
+        e || n?.(t);
+      },
+      onMouseMove: (o) => {
+        if (!e)
+          return;
+        o.target.getAttribute(a) === "true" || l(!1);
+      }
     },
     tooltipProps: {
-      open: P,
-      title: t ? A || M : void 0,
-      onOpen: w,
-      onClose: L
+      open: h,
+      title: C,
+      onOpen: (o) => {
+        o.target.getAttribute(a) === "true" && l(!0);
+      },
+      onClose: () => l(!1)
     },
     checkboxProps: {
-      checked: E,
-      disabled: t,
-      onChange: O(s)
-    },
-    nestedChildrenProps: {
-      isOpen: l,
-      rowId: e
+      checked: f,
+      disabled: e,
+      onChange: u(t)
     }
   };
 };
 export {
-  oe as useLogic
+  R as useLogic
 };

package/lib/components/DataGrid/constants.d.ts

@@ -1,6 +1,3 @@
 export declare const MIN_ROW_HEIGHT = 44;
 export declare const ROOT_ACTION_CELL_WIDTH = 32;
-export declare const TREE_LINE_WIDTH: number;
 export declare const MIN_DISPLAY_ROWS_BY_DEFAULT = 10;
-export declare const EXPANDED_LEVEL_BY_DEFAULT = 1;
-export declare const INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT = 2;

package/lib/components/DataGrid/constants.mjs

@@ -1,9 +1,6 @@
-const _ = 44, E = 32, T = 16, I = 10, L = 1, D = 2;
+const _ = 44, I = 32, O = 10;
 export {
-  L as EXPANDED_LEVEL_BY_DEFAULT,
-  D as INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT,
-  I as MIN_DISPLAY_ROWS_BY_DEFAULT,
+  O as MIN_DISPLAY_ROWS_BY_DEFAULT,
   _ as MIN_ROW_HEIGHT,
-  E as ROOT_ACTION_CELL_WIDTH,
-  T as TREE_LINE_WIDTH
+  I as ROOT_ACTION_CELL_WIDTH
 };

package/lib/components/DataGrid/enums.d.ts

@@ -2,7 +2,3 @@ export declare enum SortStates {
     ASC = "asc",
     DESC = "desc"
 }
-export declare enum Variant {
-    Tree = "tree",
-    Subrows = "subrows"
-}

package/lib/components/DataGrid/enums.mjs

@@ -1,5 +1,4 @@
-var e = /* @__PURE__ */ ((r) => (r.ASC = "asc", r.DESC = "desc", r))(e || {}), s = /* @__PURE__ */ ((r) => (r.Tree = "tree", r.Subrows = "subrows", r))(s || {});
+var c = /* @__PURE__ */ ((r) => (r.ASC = "asc", r.DESC = "desc", r))(c || {});
 export {
-  e as SortStates,
-  s as Variant
+  c as SortStates
 };

package/lib/components/DataGrid/faker.d.ts

@@ -15,7 +15,7 @@ type TreeDataType = {
 };
 export declare const makeRandomDate: () => string;
 export declare const makeColumns: <T extends DataType>(columnsTemplate: DataGridColumns<T>[], mergedColumns?: DataGridColumns<T>[]) => DataGridColumns<T>[];
-export declare const makeDataList: <TData extends Record<string, CellValue>>(dataObjTemplate: TData, options?: DataGridRowOptions<TData>) => DataGridRowWithOptions<TData>[];
+export declare const makeDataList: <TData extends Record<string, CellValue>>(dataObjTemplate: TData, options?: DataGridRowOptions) => DataGridRowWithOptions<TData>[];
 export declare const makeDataListWithTree: (length?: number, options?: {
     isNotSelectable?: boolean;
     childrenCount?: number;

package/lib/components/DataGrid/styles.mjs

@@ -1,6 +1,16 @@
-import { styled as i } from "@mui/material";
-const n = i("div", {
-  shouldForwardProp: (e) => e !== "$maxHeight"
+import "@mui/material";
+import "remeda";
+import "../../_virtual/jsx-runtime.mjs";
+import "clsx";
+import "../Button/styles.mjs";
+import "react";
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+import o from "../../node_modules/.pnpm/@mui_material@6.4.5_@emotion_react@11.14.0_@types_react@19.0.10_react@19.0.0__@emotion__861faf9ddc4761e7658ec96cff5e306a/node_modules/@mui/material/styles/styled.mjs";
+const x = o("div", {
+  shouldForwardProp: (i) => i !== "$maxHeight"
 })`
   position: relative;
 
@@ -10,21 +20,21 @@ const n = i("div", {
 
   width: 100%;
   height: 100%;
-  max-height: ${({ $maxHeight: e }) => e ? `${e}px` : "initial"};
-`, o = i("div")`
+  max-height: ${({ $maxHeight: i }) => i ? `${i}px` : "initial"};
+`, t = o("div")`
   overflow: hidden;
   display: flex;
   flex-direction: column;
 
   height: 100%;
-`, d = i(o)`
+`, f = o(t)`
   pointer-events: none;
 
-  background: ${({ theme: e }) => e.palette.background.element};
+  background: ${({ theme: i }) => i.palette.background.element};
   mix-blend-mode: luminosity;
 `;
 export {
-  n as Container,
-  o as DataGridWrapper,
-  d as DisabledDataGridWrapper
+  x as Container,
+  t as DataGridWrapper,
+  f as DisabledDataGridWrapper
 };

package/lib/components/DataGrid/types.d.ts

@@ -61,7 +61,7 @@ export type DataGridRowOptionColumns<TData extends Record<string, CellValue>> =
      */
     renderCell?: RenderCell<TData>;
 };
-export type DataGridRowOptions<TData extends Record<string, CellValue>> = {
+export type DataGridRowOptions = {
     /**
      * Если true, строка будет недоступна для взаимодействия
      */
@@ -79,13 +79,8 @@ export type DataGridRowOptions<TData extends Record<string, CellValue>> = {
      * Причина блокировки строки
      */
     disabledReason?: string;
-    /**
-     * Настройка отображения колонок дочерних элементов
-     */
-    childrenColumns?: DataGridRowOptionColumns<TData>[];
 };
 export type DataGridRow = Record<string, CellValue>;
 export type DataGridRowWithOptions<TData extends DataGridRow> = TData & {
-    options?: DataGridRowOptions<TData>;
-    children?: DataGridRowWithOptions<TData>[];
+    options?: DataGridRowOptions;
 };

package/lib/components/DataGrid/useLogic/useLogic.d.ts

@@ -2,13 +2,8 @@ import { ChangeEvent } from 'react';
 import { DataGridProps } from '../DataGrid';
 import { CellValue, DataGridRow } from '../types';
 type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = DataGridProps<TData, TSortField>;
-export declare const useLogic: <TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, onSelectRow, }: UseLogicParams<TData, TSortField>) => {
+export declare const useLogic: <TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, selectedRows, isLoading, isDisabled, onSelectRow, }: UseLogicParams<TData, TSortField>) => {
     isDataGridDisabled: boolean | undefined;
-    treeRenderConfig: {
-        isInitialExpanded?: boolean;
-        expandedLevel?: number;
-        initialVisibleChildrenCount?: number;
-    } | undefined;
     renderRows: TData[];
     headProps: {
         rowsCount: number;

package/lib/components/DataGrid/useLogic/useLogic.mjs

@@ -1,45 +1,41 @@
-import { useRef as N, useEffect as V, useMemo as j, useCallback as h } from "react";
-import { Variant as q } from "../enums.mjs";
-import { uniqueBy as M, prop as O } from "remeda";
-import { getGridTemplateColumns as S } from "./utils/getGridTemplateColumns/getGridTemplateColumns.mjs";
-const J = ({
+import { useRef as A, useEffect as G, useMemo as N, useCallback as m } from "react";
+import { uniqueBy as q, prop as x } from "remeda";
+import { getGridTemplateColumns as E } from "./utils/getGridTemplateColumns/getGridTemplateColumns.mjs";
+const j = ({
   keyId: e,
   columns: s,
   rows: r = [],
-  variant: b,
-  tree: g,
-  subrows: C,
   selectedRows: i = [],
-  isLoading: o,
+  isLoading: l,
   isDisabled: u,
   onSelectRow: n
 }) => {
-  const d = !!r?.length, c = !!n, B = o || u, D = Object.is(b, q.Subrows) ? { ...C, isInitialExpanded: !0 } : g, f = r.filter(
+  const b = !!r?.length, c = !!n, g = l || u, f = r.filter(
     (t) => !(t.options?.isDisabled || t.options?.isNotSelectable)
-  ), p = N([]);
-  V(() => {
-    o || (p.current = r);
-  }, [r, o]);
-  const m = S(s), v = j(() => f.filter(
-    (t) => !i.find((l) => l[e] === t[e])
-  ).length, [f, i, e]), P = h(() => r.length <= 1 ? s.map((t) => ({ ...t, sortable: !1 })) : s, [s, r]), x = o ? p.current : r, A = (t) => {
+  ), p = A([]);
+  G(() => {
+    l || (p.current = r);
+  }, [r, l]);
+  const h = E(s), C = N(() => f.filter(
+    (t) => !i.find((o) => o[e] === t[e])
+  ).length, [f, i, e]), B = m(() => r.length <= 1 ? s.map((t) => ({ ...t, sortable: !1 })) : s, [s, r]), D = l ? p.current : r, d = (t) => {
     if (!n)
       return;
     if (t.target.checked) {
-      const a = M(
+      const a = q(
         [...i, ...f],
-        O(e)
+        x(e)
       );
       return n(a);
     }
-    const l = i.filter(
-      (a) => !r.find((G) => G[e] === a[e])
+    const o = i.filter(
+      (a) => !r.find((P) => P[e] === a[e])
     );
-    n(l);
-  }, E = h(
-    (t) => (l) => {
+    n(o);
+  }, v = m(
+    (t) => (o) => {
       if (n) {
-        if (l.target.checked)
+        if (o.target.checked)
           return n([...i, t]);
         n(
           i.filter(
@@ -51,29 +47,28 @@ const J = ({
     [i, n, e]
   );
   return {
-    isDataGridDisabled: B,
-    treeRenderConfig: D,
-    renderRows: x,
+    isDataGridDisabled: g,
+    renderRows: D,
     headProps: {
       rowsCount: f.length,
-      uncheckedRowsCount: v,
-      gridColumns: m,
+      uncheckedRowsCount: C,
+      gridColumns: h,
       isSelectable: c,
-      columns: P(),
-      onSelectAllRows: A
+      columns: B(),
+      onSelectAllRows: d
     },
     bodyProps: {
-      gridColumns: m,
+      gridColumns: h,
       isSelectable: c,
-      onSelectRow: E
+      onSelectRow: v
     },
     loaderProps: {
-      isLoading: d && o,
+      isLoading: b && l,
       isVisibleDivider: !!r.length,
       isDisabled: u
     }
   };
 };
 export {
-  J as useLogic
+  j as useLogic
 };

package/lib/components/DataGridActionCell/styles.mjs

@@ -1,8 +1,18 @@
-import { styled as e } from "@mui/material";
-const r = e("div")`
+import "@mui/material";
+import "remeda";
+import "../../_virtual/jsx-runtime.mjs";
+import "clsx";
+import "../Button/styles.mjs";
+import "react";
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+import i from "../../node_modules/.pnpm/@mui_material@6.4.5_@emotion_react@11.14.0_@types_react@19.0.10_react@19.0.0__@emotion__861faf9ddc4761e7658ec96cff5e306a/node_modules/@mui/material/styles/styled.mjs";
+const c = i("div")`
   display: inline-flex;
   align-items: center;
 `;
 export {
-  r as Wrapper
+  c as Wrapper
 };

package/lib/components/DataGridActionCell/useLogic/useLogic.mjs

@@ -1,49 +1,20 @@
-import { useContext as s, useEffect as l, useCallback as d } from "react";
-import "../../../_virtual/jsx-runtime.mjs";
-import "../../ConfigProvider/ConfigProvider.mjs";
-import "clsx";
-import "../../Button/styles.mjs";
-import "@mui/material";
-import "../../ErrorBoundary/ErrorBoundary.mjs";
-import "../../Placeholder/Image/Image.mjs";
-import "../../Placeholder/styles.mjs";
-import "../../Typography/styles.mjs";
-import "../../ContentState/styles.mjs";
-import "../../Checkbox/Checkbox.mjs";
-import "../../Tooltip/styles.mjs";
-import "../../DataGrid/Row/NestedChildren/NestedChildren.mjs";
-import "../../DataGrid/Row/styles.mjs";
-import "../../DataGrid/DataGridContext/DataGridContext.mjs";
-import { RowContext as f } from "../../DataGrid/Row/RowContext/RowContext.mjs";
-import "../../DataGrid/Body/styles.mjs";
-import "lucide-react";
-import "../../DataGrid/HeadCell/styles.mjs";
-import "../../DataGrid/Head/styles.mjs";
-import "../../DataGrid/Loader/styles.mjs";
-import "../../DataGrid/styles.mjs";
-import "remeda";
-const H = ({
-  row: i,
-  actions: r
+import { useCallback as e } from "react";
+const d = ({
+  row: o,
+  actions: i
 }) => {
-  const { main: p, secondary: m } = r, { addDisabledRow: n, removeDisabledRow: e } = s(f), t = [...p, ...m || []].find(
-    (o) => o.isBlockingOperation && o.loading
-  ), a = !!t;
-  l(() => {
-    if (t)
-      return n(t?.loadingNote);
-    e();
-  }, [t]);
-  const c = d(
-    (o) => () => {
-      o?.(i);
+  const { main: c, secondary: t } = i, a = !![...c, ...t || []].find(
+    (n) => n.isBlockingOperation && n.loading
+  ), l = e(
+    (n) => () => {
+      n?.(o);
     },
-    [i]
+    [o]
   );
-  return { isDisabledAction: a, handleActionClick: c, handleWrapperClick: (o) => {
-    o.stopPropagation();
+  return { isDisabledAction: a, handleActionClick: l, handleWrapperClick: (n) => {
+    n.stopPropagation();
   } };
 };
 export {
-  H as useLogic
+  d as useLogic
 };

package/lib/components/DataGridOld/Cell/styles.d.ts

@@ -1,4 +1,4 @@
 export declare const StyledCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
     $align?: "left" | "center" | "right" | "justify";
     $disabled?: boolean;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

package/lib/components/DataGridOld/HeadCell/styles.d.ts

@@ -1,3 +1,3 @@
 export declare const StyledHeadCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
     $align?: "left" | "center" | "right" | "justify";
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

package/lib/components/DataGridPagination/DataGridPagination.mjs

@@ -1,4 +1,4 @@
-import { j as e } from "../../_virtual/jsx-runtime.mjs";
+import { j as r } from "../../_virtual/jsx-runtime.mjs";
 import { MenuItem as h } from "../MenuItem/MenuItem.mjs";
 import { Pagination as f } from "../Pagination/Pagination.mjs";
 import { Select as x } from "../Select/Select.mjs";
@@ -23,11 +23,11 @@ const D = (a) => {
     onSetCountPerPage: u,
     ...d
   } = a;
-  return !o && !c || !l ? null : /* @__PURE__ */ e.jsxs(E, { className: g, children: [
-    /* @__PURE__ */ e.jsxs(_, { children: [
-      u && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        /* @__PURE__ */ e.jsx(j, { variant: "body1", children: "Строк на странице:" }),
-        /* @__PURE__ */ e.jsx(
+  return !o && !c || !l ? null : /* @__PURE__ */ r.jsxs(E, { className: g, children: [
+    /* @__PURE__ */ r.jsxs(_, { children: [
+      u && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+        /* @__PURE__ */ r.jsx(j, { variant: "body1", children: "Строк на странице:" }),
+        /* @__PURE__ */ r.jsx(
           x,
           {
             size: "small",
@@ -35,13 +35,13 @@ const D = (a) => {
             disabled: n,
             isShowClearButton: !1,
             onChange: s,
-            children: p.map((r) => /* @__PURE__ */ e.jsx(h, { value: r, children: r }, r))
+            children: p.map((e) => /* @__PURE__ */ r.jsx(h, { value: e, children: e }, e))
           }
         )
       ] }),
-      /* @__PURE__ */ e.jsx(O, { variant: "h6", children: i() })
+      /* @__PURE__ */ r.jsx(O, { variant: "h6", children: i() })
     ] }),
-    o && /* @__PURE__ */ e.jsx(
+    o && /* @__PURE__ */ r.jsx(
       f,
       {
         disabled: n,

package/lib/components/DataGridPagination/faker.d.ts

@@ -1,3 +1,3 @@
 import { CellValue, DataGridRowOptions, DataGridRowWithOptions } from '../DataGrid';
 export declare const makeRandomDate: () => string;
-export declare const makeDataList: <TData extends Record<string, CellValue>>(dataObjTemplate: TData, options?: DataGridRowOptions<TData>) => DataGridRowWithOptions<TData>[];
+export declare const makeDataList: <TData extends Record<string, CellValue>>(dataObjTemplate: TData, options?: DataGridRowOptions) => DataGridRowWithOptions<TData>[];

package/lib/components/DataGridPagination/styles.d.ts

@@ -1,7 +1,7 @@
 export declare const PaginationWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const Range: import('@emotion/styled').StyledComponent<{
-    ref?: import('react').Ref<HTMLSpanElement> | undefined;
     children?: import('react').ReactNode;
+    ref?: import('react').Ref<HTMLSpanElement> | undefined;
     align?: "inherit" | "left" | "center" | "right" | "justify" | undefined;
     gutterBottom?: boolean | undefined;
     noWrap?: boolean | undefined;
@@ -10,7 +10,7 @@ export declare const Range: import('@emotion/styled').StyledComponent<{
     color?: import('../Typography').TypographyColor;
     variant?: import('../Typography').TypographyVariant;
     colorIntensity?: import('../Typography').Intensity;
-    component?: "symbol" | "object" | "style" | "clipPath" | "filter" | "mask" | "path" | import('react').ComponentType<any> | "map" | "search" | "big" | "link" | "small" | "sub" | "sup" | "marker" | "svg" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view";
+    component?: "symbol" | "object" | "text" | "main" | "clipPath" | "filter" | "mask" | "marker" | "style" | "div" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "search" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | import('react').ComponentType<any>;
     isUpperCase?: boolean;
 } & import('react').HTMLAttributes<HTMLParagraphElement> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
 export declare const RangeWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/components/DataGridPagination/styles.mjs

@@ -1,25 +1,35 @@
-import { styled as t, formControlClasses as n } from "@mui/material";
-import { Typography as o } from "../Typography/Typography.mjs";
-const a = t("div")`
+import { formControlClasses as i } from "@mui/material";
+import "remeda";
+import "../../_virtual/jsx-runtime.mjs";
+import "clsx";
+import "../Button/styles.mjs";
+import "react";
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+/* empty css                                                                                         */
+import { Typography as p } from "../Typography/Typography.mjs";
+import o from "../../node_modules/.pnpm/@mui_material@6.4.5_@emotion_react@11.14.0_@types_react@19.0.10_react@19.0.0__@emotion__861faf9ddc4761e7658ec96cff5e306a/node_modules/@mui/material/styles/styled.mjs";
+const x = o("div")`
   display: flex;
   align-items: center;
   justify-content: space-between;
 
   height: 48px;
-  padding-top: ${({ theme: e }) => e.spacing(4)};
-`, r = t(o)`
-  color: ${({ theme: e }) => e.palette.grey[700]};
-`, s = t("div")`
+  padding-top: ${({ theme: t }) => t.spacing(4)};
+`, $ = o(p)`
+  color: ${({ theme: t }) => t.palette.grey[700]};
+`, h = o("div")`
   display: flex;
-  gap: ${({ theme: e }) => e.spacing(3)};
+  gap: ${({ theme: t }) => t.spacing(3)};
   align-items: center;
 
-  .${n.root} {
+  .${i.root} {
     flex-direction: unset;
   }
 `;
 export {
-  a as PaginationWrapper,
-  r as Range,
-  s as RangeWrapper
+  x as PaginationWrapper,
+  $ as Range,
+  h as RangeWrapper
 };