@max-ts/components 0.2.2 → 0.2.4

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/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/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/SearchField/SearchField.d.ts

@@ -1,3 +1,5 @@
 import { TextFieldProps } from '../TextField';
-export type SearchFieldProps = Omit<TextFieldProps, 'startAdornment' | 'endAdornment'>;
+export type SearchFieldProps = Omit<TextFieldProps, 'startAdornment' | 'endAdornment'> & {
+    delay?: number;
+};
 export declare const SearchField: import('react').ForwardRefExoticComponent<Omit<SearchFieldProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/lib/components/SearchField/SearchField.mjs

@@ -1,57 +1,60 @@
-import { j as n } from "../../_virtual/jsx-runtime.mjs";
-import { forwardRef as S, useState as h, useRef as C } from "react";
-import { StyledTextField as j, StyledIconButton as b, StyledCloseFillSm as y, StyledSearchIcon as A } from "./styles.mjs";
-const w = S(
+import { j as r } from "../../_virtual/jsx-runtime.mjs";
+import { forwardRef as j, useState as b, useRef as i } from "react";
+import { StyledTextField as y, StyledIconButton as A, StyledCloseFillSm as R, StyledSearchIcon as g } from "./styles.mjs";
+const B = j(
   ({
-    margin: c = "none",
-    placeholder: s = "Поиск",
-    onChange: r,
-    disabled: l,
-    value: i,
-    defaultValue: d,
-    ...f
-  }, m) => {
-    const [o, u] = h(`${d || i || ""}`), e = C(null), p = (t) => {
-      u(t.target.value), r?.(t);
-    }, v = () => {
-      u(""), e.current && (e.current.value = "");
-      const t = new InputEvent("input", {
+    margin: s = "none",
+    placeholder: d = "Поиск",
+    onChange: l,
+    disabled: u,
+    value: m,
+    defaultValue: f,
+    delay: p = 600,
+    ...v
+  }, x) => {
+    const [c, o] = b(`${f || m || ""}`), t = i(null), e = i(null), S = (n) => {
+      o(n.target.value), t.current && clearTimeout(t.current), t.current = setTimeout(() => {
+        l?.(n);
+      }, p);
+    }, h = () => {
+      o(""), e.current && (e.current.value = ""), t.current && clearTimeout(t.current);
+      const n = new InputEvent("input", {
         bubbles: !0,
         cancelable: !0
       });
-      Object.defineProperty(t, "target", {
+      Object.defineProperty(n, "target", {
         writable: !0,
         value: e.current
-      }), r?.(t), e.current?.focus();
-    }, x = () => {
+      }), l?.(n), e.current?.focus();
+    }, C = () => {
       e.current?.focus();
-    }, a = !!o.length;
-    return /* @__PURE__ */ n.jsx(
-      j,
+    }, a = !!c.length;
+    return /* @__PURE__ */ r.jsx(
+      y,
       {
-        margin: c,
-        placeholder: s,
-        startAdornment: /* @__PURE__ */ n.jsx(A, { onClick: x }),
-        disabled: l,
-        endAdornment: /* @__PURE__ */ n.jsx(
-          b,
+        margin: s,
+        placeholder: d,
+        startAdornment: /* @__PURE__ */ r.jsx(g, { onClick: C }),
+        disabled: u,
+        endAdornment: /* @__PURE__ */ r.jsx(
+          A,
           {
             variant: "text",
-            onClick: v,
-            disabled: l || !a,
+            onClick: h,
+            disabled: u || !a,
             $isActive: a,
-            children: /* @__PURE__ */ n.jsx(y, {})
+            children: /* @__PURE__ */ r.jsx(R, {})
           }
         ),
-        onChange: p,
-        value: o,
-        ref: m,
+        onChange: S,
+        value: c,
+        ref: x,
         inputRef: e,
-        ...f
+        ...v
       }
     );
   }
 );
 export {
-  w as SearchField
+  B as SearchField
 };

package/lib/components/SearchField/styles.mjs

@@ -1,10 +1,10 @@
 import { styled as o } from "@mui/material";
-import { Search as e, CircleX as r } from "lucide-react";
+import { Search as e, X as r } from "lucide-react";
 import { IconButton as l } from "../IconButton/IconButton.mjs";
 import { TextField as i } from "../TextField/TextField.mjs";
-const a = o(e)`
+const d = o(e)`
   color: ${({ theme: t }) => t.palette.grey[600]};
-`, d = o(l, {
+`, a = o(l, {
   shouldForwardProp: (t) => !["$isActive"].includes(t.toString())
 })`
   opacity: ${({ $isActive: t }) => t ? 1 : 0};
@@ -13,23 +13,21 @@ const a = o(e)`
     background-color: transparent;
 
     svg {
-      fill: ${({ theme: t }) => t.palette.grey[700]};
+      stroke: ${({ theme: t }) => t.palette.grey[700]};
     }
   }
 `, m = o(i)`
   & .MuiFormHelperText-root {
-    /* TODO Убрать после реализации https://track.astral.ru/soft/browse/UIKIT-1333 */
     display: none;
   }
 `, y = o(r)`
   width: 16px;
   height: 16px;
-
-  fill: ${({ theme: t }) => t.palette.grey[500]};
+  stroke: ${({ theme: t }) => t.palette.grey[500]};
 `;
 export {
   y as StyledCloseFillSm,
-  d as StyledIconButton,
-  a as StyledSearchIcon,
+  a as StyledIconButton,
+  d as StyledSearchIcon,
   m as StyledTextField
 };

package/lib/components/Select/Select.d.ts

@@ -4,7 +4,7 @@ import { WithoutEmotionSpecific } from '../types';
 export type SelectProps<Value> = WithoutEmotionSpecific<Omit<MuiSelectProps<Value>, 'variant'>> & {
     loading?: boolean;
     placeholder?: string;
-    getOptionLabel?: (value: string | number) => string | number;
+    getOptionLabel?: (value: Value) => string | number;
     /**
      * Добавляет вспомогательный текст под селектом
      */

package/lib/components/Select/Select.mjs

@@ -24,7 +24,7 @@ const _ = ({ onClick: s, disabled: o, ref: t }) => /* @__PURE__ */ r.jsx(
 );
 function nr({
   required: s,
-  getOptionLabel: o = (i) => i,
+  getOptionLabel: o = (i) => String(i),
   placeholder: t,
   helperText: d,
   hideHelperText: v = !1,

package/lib/components/TextField/TextField.d.ts

@@ -25,4 +25,4 @@ export type TextFieldProps = Omit<WithoutEmotionSpecific<MuiTextFieldProps>, 'va
      */
     trimmed?: boolean;
 };
-export declare const TextField: ({ success, error, helperText: helperTextProp, fullWidth, startAdornment, endAdornment, slotProps, maxLength, trimmed, onBlur, ...props }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextField: ({ success, error, helperText: helperTextProp, fullWidth, startAdornment, endAdornment, inputProps, InputProps, maxLength, trimmed, onBlur, ...props }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/TextField/TextField.mjs

@@ -1,56 +1,56 @@
 import { j as r } from "../../_virtual/jsx-runtime.mjs";
-import { TextField as p } from "@mui/material";
+import { TextField as B } from "@mui/material";
 import { useMemo as u } from "react";
-import { FormHelperTextContent as l } from "../FormHelperText/FormHelperTextContent/FormHelperTextContent.mjs";
-const w = ({
+import { FormHelperTextContent as a } from "../FormHelperText/FormHelperTextContent/FormHelperTextContent.mjs";
+const E = ({
   success: e,
   error: i,
   helperText: t,
-  fullWidth: a = !1,
+  fullWidth: l = !1,
   startAdornment: m,
   endAdornment: s,
-  slotProps: f,
-  maxLength: x,
-  trimmed: d = !0,
-  onBlur: c,
+  inputProps: f,
+  InputProps: x,
+  maxLength: d,
+  trimmed: c = !0,
+  onBlur: j,
   ...o
 }) => {
-  const j = u(() => {
+  const g = u(() => {
     if (e)
       return "success";
-  }, [e]), g = u(() => e ? /* @__PURE__ */ r.jsx(l, { success: !0, children: t }) : i ? /* @__PURE__ */ r.jsx(l, { error: !0, children: t }) : t || /* @__PURE__ */ r.jsx(r.Fragment, {}), [t, e, i]), F = (n) => {
-    if (d) {
+  }, [e]), F = u(() => e ? /* @__PURE__ */ r.jsx(a, { success: !0, children: t }) : i ? /* @__PURE__ */ r.jsx(a, { error: !0, children: t }) : t || /* @__PURE__ */ r.jsx(r.Fragment, {}), [t, e, i]), p = (n) => {
+    if (c) {
       const h = n.target.value?.trim();
       o.onChange?.({
         ...n,
         target: { ...n.target, value: h }
       });
     }
-    c?.(n);
+    j?.(n);
   };
   return /* @__PURE__ */ r.jsx(
-    p,
+    B,
     {
       variant: "outlined",
-      fullWidth: a,
+      fullWidth: l,
       error: i,
-      color: j,
-      helperText: g,
-      slotProps: {
-        htmlInput: {
-          maxLength: x
-        },
-        input: {
-          startAdornment: m,
-          endAdornment: s
-        },
+      color: g,
+      helperText: F,
+      InputProps: {
+        startAdornment: m,
+        endAdornment: s,
+        ...x
+      },
+      inputProps: {
+        maxLength: d,
         ...f
       },
-      onBlur: F,
+      onBlur: p,
       ...o
     }
   );
 };
 export {
-  w as TextField
+  E as TextField
 };