@max-ts/components 0.1.1 → 0.2.1

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

@@ -0,0 +1,39 @@
+import { useMemo as l, useCallback as b } from "react";
+import { SortStates as d } from "../../enums.mjs";
+const D = ({
+  rowsCount: e,
+  sorting: t,
+  uncheckedRowsCount: i,
+  onSort: r
+}) => {
+  const m = l(
+    () => !i && e > 0,
+    [i, e]
+  ), f = l(
+    () => i > 0 && i < e,
+    [i, e]
+  ), c = !e;
+  return {
+    handleSort: b(
+      (s) => {
+        if (!r)
+          return;
+        const a = t?.fieldId === s;
+        if (a && t?.sort === d.ASC)
+          return r({ fieldId: s, sort: d.DESC });
+        if (a && t?.sort === d.DESC)
+          return r(void 0);
+        r({ fieldId: s, sort: d.ASC });
+      },
+      [t, r]
+    ),
+    checkboxProps: {
+      checked: m,
+      disabled: c,
+      indeterminate: f
+    }
+  };
+};
+export {
+  D as useLogic
+};

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

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { AlignVariant, DataGridRow, DataGridSort } from '../types';
+export type HeadCellProps<TData = DataGridRow, TSortField extends keyof TData = keyof TData> = {
+    onSort: (field: TSortField) => void;
+    sorting?: DataGridSort<TSortField>;
+    label?: string;
+    isSortable?: boolean;
+    /**
+     * Выравнивание содержимого ячейки по горизонтали
+     */
+    align?: AlignVariant;
+    field?: keyof TData;
+    /**
+     * Дополнительное содержимое ячейки, которое будет распложено справа
+     */
+    startAdornment?: ReactNode;
+};
+export declare const HeadCell: <TData, TSortField extends keyof TData>(props: HeadCellProps<TData, TSortField>) => import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGrid/HeadCell/HeadCell.mjs

@@ -0,0 +1,32 @@
+import { j as r } from "../../../_virtual/jsx-runtime.mjs";
+import { useMemo as f } from "react";
+import { SortStates as i } from "../enums.mjs";
+import { ChevronsUpDown as a, ChevronDown as u, ChevronUp as d } from "lucide-react";
+import { Wrapper as x, StyledTypography as j } from "./styles.mjs";
+import { useLogic as h } from "./useLogic/useLogic.mjs";
+const b = (e) => {
+  const { wrapperProps: l } = h(e), { startAdornment: s, field: n, isSortable: o, align: p, label: m, sorting: t } = e, c = f(() => {
+    if (!o)
+      return null;
+    if (t?.fieldId !== n)
+      return /* @__PURE__ */ r.jsx(a, {});
+    switch (t?.sort) {
+      case i.ASC:
+        return /* @__PURE__ */ r.jsx(d, { color: "primary" });
+      case i.DESC:
+        return /* @__PURE__ */ r.jsx(u, { color: "primary" });
+      default:
+        return /* @__PURE__ */ r.jsx(a, {});
+    }
+  }, [t, o, n]);
+  return /* @__PURE__ */ r.jsxs(x, { $align: p, $isSortable: o, ...l, children: [
+    s && s,
+    /* @__PURE__ */ r.jsxs(j, { variant: "caption", children: [
+      m,
+      c
+    ] })
+  ] });
+};
+export {
+  b as HeadCell
+};

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

@@ -0,0 +1,22 @@
+import { AlignVariant } from '../types';
+type HeadCellProps = {
+    $align?: AlignVariant;
+    $isSortable?: boolean;
+    $hasStartAdornment?: boolean;
+};
+export declare const Wrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & HeadCellProps, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledTypography: import('@emotion/styled').StyledComponent<{
+    ref?: import('react').Ref<HTMLSpanElement> | undefined;
+    children?: import('react').ReactNode;
+    align?: "inherit" | "left" | "center" | "right" | "justify" | undefined;
+    gutterBottom?: boolean | undefined;
+    noWrap?: boolean | undefined;
+    paragraph?: boolean | undefined;
+} & {
+    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";
+    isUpperCase?: boolean;
+} & import('react').HTMLAttributes<HTMLParagraphElement> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export {};

package/lib/components/DataGrid/HeadCell/styles.mjs

@@ -0,0 +1,30 @@
+import { styled as i } from "@mui/material";
+import { Typography as e } from "../../Typography/Typography.mjs";
+import { alignToJustifyContent as o } from "../utils/alignToJustifyContent/alignToJustifyContent.mjs";
+const a = i("div", {
+  shouldForwardProp: (t) => !["$align", "$isSortable", "$hasStartAdornment"].includes(t.toString())
+})`
+  cursor: ${({ $isSortable: t }) => t ? "pointer" : "initial"};
+  user-select: none;
+
+  display: flex;
+  align-items: center;
+  justify-content: ${({ $align: t }) => o(t)};
+
+  height: 40px;
+  padding: ${({ theme: t, $hasStartAdornment: r }) => r ? t.spacing(1, 2, 1, 0) : t.spacing(1, 2)};
+
+  color: ${({ theme: t }) => t.palette.grey[700]};
+`, l = i(e)`
+  display: flex;
+  align-items: center;
+
+  > svg {
+    width: 16px;
+    height: 16px;
+  }
+`;
+export {
+  l as StyledTypography,
+  a as Wrapper
+};

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

@@ -0,0 +1,10 @@
+import { DataGridRow } from '../../types';
+import { HeadCellProps } from '../HeadCell';
+type UseLogicParams<TData = DataGridRow, TSortField extends keyof TData = keyof TData> = HeadCellProps<TData, TSortField>;
+export declare const useLogic: <TData, TSortField extends keyof TData>({ field, isSortable, startAdornment, onSort, }: UseLogicParams<TData, TSortField>) => {
+    wrapperProps: {
+        $hasStartAdornment: boolean;
+        onClick: () => void;
+    };
+};
+export {};

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

@@ -0,0 +1,16 @@
+const s = ({
+  field: t,
+  isSortable: n,
+  startAdornment: o,
+  onSort: r
+}) => ({
+  wrapperProps: {
+    $hasStartAdornment: !!o,
+    onClick: () => {
+      t && n && r(t);
+    }
+  }
+});
+export {
+  s as useLogic
+};

package/lib/components/DataGrid/Loader/Loader.mjs

@@ -0,0 +1,14 @@
+import { j as r } from "../../../_virtual/jsx-runtime.mjs";
+import { LoaderWrapper as o, Backdrop as p, StyledLinearProgress as x, StyledDivider as a } from "./styles.mjs";
+const l = ({
+  isLoading: e = !1,
+  isDisabled: s = !1,
+  isVisibleDivider: t = !0
+}) => /* @__PURE__ */ r.jsxs(o, { children: [
+  (e || s) && /* @__PURE__ */ r.jsx(p, {}),
+  e && /* @__PURE__ */ r.jsx(x, {}),
+  !e && t && /* @__PURE__ */ r.jsx(a, {})
+] });
+export {
+  l as Loader
+};

package/lib/components/DataGrid/Loader/styles.d.ts

@@ -0,0 +1,4 @@
+export declare const Backdrop: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledDivider: import('@emotion/styled').StyledComponent<import('../../Divider').DividerProps & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const LoaderWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledLinearProgress: import('@emotion/styled').StyledComponent<import('@mui/material').LinearProgressProps & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;

package/lib/components/DataGrid/Loader/styles.mjs

@@ -0,0 +1,24 @@
+import { styled as o, LinearProgress as r } from "@mui/material";
+import { Divider as t } from "../../Divider/Divider.mjs";
+const p = o("div")`
+  position: absolute;
+  top: 0;
+
+  width: 100%;
+  height: 100%;
+
+  opacity: 0.3;
+  background-color: ${({ theme: e }) => e.palette.background.element};
+`, s = o(t)`
+  border-width: 1px;
+`, a = o("div")`
+  height: 2px;
+`, n = o(r)`
+  height: 2px;
+`;
+export {
+  p as Backdrop,
+  a as LoaderWrapper,
+  s as StyledDivider,
+  n as StyledLinearProgress
+};

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

@@ -0,0 +1,34 @@
+import { PlaceholderSize } from '../../Placeholder';
+export type NoDataProps = {
+    /**
+     * Заголовок
+     * @default 'Нет\u00a0данных'
+     * Добавлен неразрывный пробел `\u00a0`,
+     * так как без изображения текст форматируется в 2 строки
+     */
+    title?: string;
+    /**
+     * альтернативный текст в случае, если изображение по какой-то причине не загрузилось
+     * @default эквивалентно title
+     */
+    imgAlt?: string;
+    /**
+     * Ширина иллюстрации в px (высота рассчитывается пропорционально ширине)
+     * @default '250'
+     * @deprecated
+     */
+    noDataIconWidth?: number;
+    /**
+     * Текст и обработчик для кнопки действия
+     */
+    action?: {
+        text: string;
+        onClick: () => void;
+    };
+    /**
+     * Задает общий размер компонента
+     * @default 'small'
+     */
+    size?: PlaceholderSize;
+};
+export declare const NoData: ({ title, imgAlt, action, size, }: NoDataProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGrid/NoData/NoData.mjs

@@ -0,0 +1,29 @@
+import { j as t } from "../../../_virtual/jsx-runtime.mjs";
+import { useContext as s } from "react";
+import { Button as n } from "../../Button/Button.mjs";
+import { ConfigContext as a } from "../../ConfigProvider/ConfigProvider.mjs";
+import "../../Placeholder/Image/Image.mjs";
+import { Placeholder as p } from "../../Placeholder/Placeholder.mjs";
+const j = ({
+  title: r = "Нет данных",
+  imgAlt: m = r,
+  action: o,
+  size: e = "small"
+}) => {
+  const {
+    imagesMap: { noDataImgSrc: i }
+  } = s(a);
+  return /* @__PURE__ */ t.jsx(
+    p,
+    {
+      title: r,
+      imgSrc: i,
+      size: e,
+      Actions: o ? /* @__PURE__ */ t.jsx(n, { onClick: o.onClick, "aria-label": o.text, children: o.text }) : void 0,
+      imgAlt: m
+    }
+  );
+};
+export {
+  j as NoData
+};

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

@@ -0,0 +1,55 @@
+import { ReactElement } from 'react';
+import { Variant } from '../../enums';
+import { CellValue, DataGridRowOptions } from '../../types';
+export type NestedChildrenProps<TData extends Record<string, CellValue>> = {
+    /**
+     * Если true, список дочерних элементов раскрыт
+     */
+    isOpen: boolean;
+    /**
+     * Данные для отображения
+     */
+    data: Array<TData & {
+        options?: DataGridRowOptions<TData>;
+    }>;
+    /**
+     * Поле, которое будет использоваться в качестве ключа
+     */
+    keyId: keyof TData;
+    /**
+     * Идентификатор строки
+     */
+    rowId: string;
+    /**
+     * Вариант отображения вложенных элементов
+     */
+    variant: `${Variant}`;
+    /**
+     * Конфигурация ширины колонок
+     */
+    gridColumns: string;
+    /**
+     * Уровень вложенности в дереве
+     */
+    level: number;
+    /**
+     * Количество отображаемых по умолчанию дочерних элементов
+     */
+    initialVisibleChildrenCount: number;
+    /**
+     * Номер колонки, в которой будет расположена кнопка "Показать все"
+     * Работает только для `variant="subrows"`
+     */
+    moreButtonColumnPosition: number;
+    renderRow: ({ key, level, row, nestedChildren, options, className, }: {
+        key: string;
+        row: TData;
+        level: number;
+        nestedChildren: Array<TData & {
+            options?: DataGridRowOptions<TData>;
+        }>;
+        options?: DataGridRowOptions<TData>;
+        className?: string;
+    }) => ReactElement;
+};
+export declare const NestedChildren: import('react').MemoExoticComponent<(<TData extends Record<string, CellValue>>(props: NestedChildrenProps<TData>) => import("react/jsx-runtime").JSX.Element | null)>;

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

@@ -0,0 +1,72 @@
+import { j as e } from "../../../../_virtual/jsx-runtime.mjs";
+import { memo as f } from "react";
+import { Collapse as a } from "../../../Collapse/Collapse.mjs";
+import { HIDDEN_CHILDREN_ROW_CLASSNAME as g } from "../constants.mjs";
+import { NestedRows as x, MoreButtonRow as E, MoreButton as N } from "./styles.mjs";
+import { useLogic as R } from "./useLogic/useLogic.mjs";
+const O = f(
+  (s) => {
+    const {
+      isShowAllChildren: m,
+      isShowMoreButton: w,
+      isShowConnector: o,
+      nextLevel: r,
+      initialVisibleChildren: p,
+      otherChildren: j,
+      handleToggleShowAllChildren: S
+    } = R(s), {
+      isOpen: d,
+      data: h,
+      keyId: u,
+      level: c,
+      gridColumns: v,
+      moreButtonColumnPosition: $,
+      renderRow: C
+    } = s;
+    return !h || !h.length ? null : /* @__PURE__ */ e.jsx(a, { in: d, unmountOnExit: !0, children: /* @__PURE__ */ e.jsxs(x, { $level: c, $isShowConnector: o, children: [
+      p.map(({ children: t, options: i, ...n }) => {
+        const l = n[u];
+        return C({
+          key: l,
+          row: n,
+          options: i,
+          nestedChildren: t,
+          level: r
+        });
+      }),
+      d && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        /* @__PURE__ */ e.jsx(a, { in: m, component: "li", unmountOnExit: !0, children: /* @__PURE__ */ e.jsx(x, { $level: c, $isShowConnector: o, children: j.map(({ children: t, options: i, ...n }) => {
+          const l = n[u];
+          return C({
+            key: l,
+            row: n,
+            options: i,
+            nestedChildren: t,
+            level: r,
+            className: g
+          });
+        }) }) }),
+        w && /* @__PURE__ */ e.jsx(
+          E,
+          {
+            $level: r,
+            $isShowConnector: o,
+            $gridColumns: v,
+            children: /* @__PURE__ */ e.jsx(
+              N,
+              {
+                $moreButtonColumnPosition: $,
+                variant: "link",
+                onClick: S,
+                children: m ? "Скрыть" : "Показать все"
+              }
+            )
+          }
+        )
+      ] })
+    ] }) });
+  }
+);
+export {
+  O as NestedChildren
+};

package/lib/components/DataGrid/Row/NestedChildren/styles.d.ts

@@ -0,0 +1,20 @@
+export declare const NestedRows: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $level: number;
+    $isShowConnector: boolean;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {}>;
+export declare const MoreButtonRow: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $level: number;
+    $isShowConnector: boolean;
+    $gridColumns: string;
+}, import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
+export declare const MoreButton: import('@emotion/styled').StyledComponent<Omit<import('../../../types').WithoutEmotionSpecific<import('@mui/material').ButtonProps<import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>>>, "color" | "variant"> & {
+    variant?: `${import('../../../Button').ButtonVariants}`;
+    loading?: boolean;
+    loadingIndicator?: import('react').ReactNode;
+    loadingPosition?: "start" | "end" | "center";
+    color?: `${import('../../../Button').ButtonColors}`;
+    component?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+    selected?: boolean;
+} & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $moreButtonColumnPosition: number;
+}, {}, {}>;

package/lib/components/DataGrid/Row/NestedChildren/styles.mjs

@@ -0,0 +1,68 @@
+import { styled as e } from "@mui/material";
+import { Button as i } from "../../../Button/Button.mjs";
+import { ROOT_ACTION_CELL_WIDTH as r, TREE_LINE_WIDTH as t } from "../../constants.mjs";
+const p = e("ul", {
+  shouldForwardProp: (o) => !["$level", "$isShowConnector"].includes(o.toString())
+})`
+  position: relative;
+
+  margin: 0;
+  padding: 0;
+
+  list-style: none;
+
+  &::before {
+    content: '';
+
+    position: absolute;
+    z-index: 2;
+    top: 0;
+    transform: ${({ $level: o }) => `translateX(calc(${r}px * ${o} - ${t}px))`};
+
+    display: ${({ $isShowConnector: o }) => o ? "block" : "none"};
+
+    width: 0;
+    height: 100%;
+
+    border-left: 1px solid ${({ theme: o }) => o.palette.grey[400]};
+  }
+`, d = e("li", {
+  shouldForwardProp: (o) => !["$level", "$isShowConnector", "$gridColumns"].includes(o.toString())
+})`
+  position: relative;
+
+  display: grid;
+  grid-template-columns: ${({ $gridColumns: o }) => o};
+
+  height: 36px;
+  margin-left: ${({ $level: o }) => `${o * r}px`};
+
+  &::before {
+    content: '';
+
+    position: absolute;
+    top: 0;
+    left: -${t}px;
+
+    display: ${({ $isShowConnector: o }) => o ? "block" : "none"};
+
+    width: ${t}px;
+    height: 50%;
+
+    border-bottom: 1px solid ${({ theme: o }) => o.palette.grey[400]};
+    border-left: 1px solid ${({ theme: o }) => o.palette.grey[400]};
+    border-radius: 0 0 0 ${({ theme: o }) => o.shape.small};
+  }
+`, a = e(i, {
+  shouldForwardProp: (o) => !["$moreButtonColumnPosition"].includes(o.toString())
+})`
+  grid-column: ${({ $moreButtonColumnPosition: o }) => o};
+  justify-self: start;
+
+  margin: ${({ theme: o }) => o.spacing(0, 2)};
+`;
+export {
+  a as MoreButton,
+  d as MoreButtonRow,
+  p as NestedRows
+};

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

@@ -0,0 +1,18 @@
+import { MouseEvent } from 'react';
+import { CellValue } from '../../../types';
+import { NestedChildrenProps } from '../NestedChildren';
+type UseLogicParams<TData extends Record<string, CellValue>> = NestedChildrenProps<TData>;
+export declare const useLogic: <TData extends Record<string, CellValue>>({ rowId, data, level, variant, initialVisibleChildrenCount, }: UseLogicParams<TData>) => {
+    isShowAllChildren: boolean;
+    isShowMoreButton: boolean;
+    isShowConnector: boolean;
+    initialVisibleChildren: (TData & {
+        options?: import('../../../types').DataGridRowOptions<TData> | undefined;
+    })[];
+    otherChildren: (TData & {
+        options?: import('../../../types').DataGridRowOptions<TData> | undefined;
+    })[];
+    nextLevel: number;
+    handleToggleShowAllChildren: (event: MouseEvent<HTMLElement>) => void;
+};
+export {};

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

@@ -0,0 +1,27 @@
+import { useContext as d } from "react";
+import { DataGridContext as C } from "../../../DataGridContext/DataGridContext.mjs";
+import "../../../../../_virtual/jsx-runtime.mjs";
+import { Variant as S } from "../../../enums.mjs";
+const A = ({
+  rowId: o,
+  data: e,
+  level: s,
+  variant: i,
+  initialVisibleChildrenCount: t
+}) => {
+  const { checkIsMoreOpened: l, toggleOpenMoreItems: c } = d(C), n = Object.is(i, S.Tree), h = n ? s + 1 : 0, a = e?.slice(0, t), r = e?.slice(t), g = l(o), p = !!r?.length;
+  return {
+    isShowAllChildren: g,
+    isShowMoreButton: p,
+    isShowConnector: n,
+    initialVisibleChildren: a,
+    otherChildren: r,
+    nextLevel: h,
+    handleToggleShowAllChildren: (m) => {
+      m.stopPropagation(), c(o);
+    }
+  };
+};
+export {
+  A as useLogic
+};

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

@@ -0,0 +1,91 @@
+import { ChangeEvent, ReactNode } from 'react';
+import { Variant } from '../enums';
+import { CellValue, DataGridColumns, DataGridRowOptions } from '../types';
+export type RowProps<TData extends Record<string, CellValue>> = {
+    /**
+     * Название класса, применяется к корневому компоненту
+     */
+    className?: string;
+    /**
+     * Поле, которое будет использоваться в качестве ключа
+     */
+    keyId: keyof TData;
+    /**
+     * Данные строки для отображения
+     */
+    row: TData;
+    /**
+     * Конфигурация колонок для таблицы
+     */
+    columns: DataGridColumns<TData>[];
+    /**
+     * Вариант отображения вложенных элементов
+     */
+    variant: `${Variant}`;
+    /**
+     * Конфигурация ширины колонок
+     */
+    gridColumns: string;
+    /**
+     * Уровень вложенности в дереве
+     */
+    level: number;
+    /**
+     * Вложенные элементы
+     */
+    nestedChildren: Array<TData & {
+        options?: DataGridRowOptions<TData>;
+    }>;
+    /**
+     * Идентификатор активного элемента массива rows. Выделяет активную строку в таблице
+     */
+    activeRowId?: string;
+    /**
+     * Если true, то дерево будет раскрыто по умолчанию
+     */
+    isInitialExpanded: boolean;
+    /**
+     * Уровень раскрытия дерева по умолчанию, при isInitialExpanded=true
+     */
+    expandedLevel: number;
+    /**
+     * Количество отображаемых по умолчанию дочерних элементов
+     */
+    initialVisibleChildrenCount: number;
+    /**
+     * Номер колонки, в которой будет расположена кнопка "Показать все"
+     * Работает только для `variant="subrows"`
+     */
+    moreButtonColumnPosition: number;
+    /**
+     * Если false, кнопка разворачивания элементов не показывается
+     * Работает только для `variant="subrows"`
+     */
+    isVisibleCollapseButton: boolean;
+    /**
+     * Если true, то будет отображаться чекбокс для выбора элемента
+     */
+    isSelectable?: boolean;
+    /**
+     * Массив выбранных строк
+     */
+    selectedRows?: Array<TData>;
+    /**
+     * Заглушка для пустых ячеек (если отсутствует field и filter и renderCell)
+     * @default '-'
+     */
+    emptyCellValue?: ReactNode;
+    /**
+     * Дополнительные настройки строки
+     */
+    options?: DataGridRowOptions<TData>;
+    /**
+     * Обработчик выбора строки
+     */
+    onSelectRow: (row: TData) => (event: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Обработчик клика строки таблицы
+     */
+    onRowClick?: (row: TData) => void;
+};
+export declare const Row: <TData extends Record<string, CellValue>>(props: RowProps<TData>) => import("react/jsx-runtime").JSX.Element;