@max-ts/components 0.1.0 → 0.2.0

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;

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

@@ -0,0 +1,159 @@
+import { j as e } from "../../../_virtual/jsx-runtime.mjs";
+import { useCallback as I } from "react";
+import { Checkbox as J } from "../../Checkbox/Checkbox.mjs";
+import { Tooltip as K } from "../../Tooltip/Tooltip.mjs";
+import { NestedChildren as M } from "./NestedChildren/NestedChildren.mjs";
+import { DISABLE_ROW_ATTR as Q } from "./constants.mjs";
+import { CellStyled as U, Wrapper as X, ContentWrapper as Y, CollapseCell as Z, CollapseButton as ee, ChevronIcon as oe, CheckboxCell as le } from "./styles.mjs";
+import { useLogic as re } from "./useLogic/useLogic.mjs";
+import { checkIsDisabled as se } from "./utils/checkIsDisabled/checkIsDisabled.mjs";
+const te = (p) => {
+  const {
+    isOpen: u,
+    isShowConnector: h,
+    childrenColumns: x,
+    rowId: S,
+    handleToggle: P,
+    checkboxProps: B,
+    rowProps: A,
+    tooltipProps: D,
+    nestedChildrenProps: y,
+    disabled: r,
+    isRenderCollapseButton: b
+  } = re(p), {
+    className: L,
+    row: T,
+    options: E,
+    variant: n,
+    isSelectable: s,
+    gridColumns: o,
+    isInitialExpanded: j,
+    expandedLevel: w,
+    level: t,
+    nestedChildren: N,
+    initialVisibleChildrenCount: i,
+    moreButtonColumnPosition: c,
+    isVisibleCollapseButton: V,
+    columns: a,
+    emptyCellValue: W,
+    selectedRows: f,
+    activeRowId: v,
+    keyId: d,
+    onSelectRow: R,
+    onRowClick: $,
+    // В этот rest-оператор попадают специфичные пропсы (атрибуты) virtuoso
+    // Необходимы для NewDataGridInfinite
+    ...F
+  } = p, { isDisabledLastCell: O = !0, isNotSelectable: g } = E || {}, _ = () => !b && (!s || g) ? null : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    b && /* @__PURE__ */ e.jsx(Z, { children: /* @__PURE__ */ e.jsx(ee, { variant: "text", onClick: P, children: /* @__PURE__ */ e.jsx(oe, { $isActive: u }) }) }),
+    s && !g && /* @__PURE__ */ e.jsx(
+      le,
+      {
+        inert: r ? !0 : void 0,
+        onClick: (l) => l.stopPropagation(),
+        children: /* @__PURE__ */ e.jsx(J, { ...B })
+      }
+    )
+  ] }), q = I(() => {
+    const l = O ? void 0 : [a.length - 1];
+    return a?.map((C, m) => {
+      const G = `${S}-${m}`, H = se(
+        r,
+        l,
+        m
+      ), k = !m;
+      return /* @__PURE__ */ e.jsx(
+        U,
+        {
+          $level: k ? t : 0,
+          row: T,
+          cell: C,
+          emptyCellValue: W,
+          startAdornment: k && _(),
+          isDisabled: H
+        },
+        G
+      );
+    });
+  }, [u, a, r]), z = I(
+    ({
+      key: l,
+      ...C
+    }) => /* @__PURE__ */ e.jsx(
+      te,
+      {
+        keyId: d,
+        ...C,
+        variant: n,
+        isSelectable: s,
+        selectedRows: f,
+        gridColumns: o,
+        isInitialExpanded: j,
+        expandedLevel: w,
+        initialVisibleChildrenCount: i,
+        moreButtonColumnPosition: c,
+        isVisibleCollapseButton: V,
+        activeRowId: v,
+        columns: x,
+        onSelectRow: R,
+        onRowClick: $
+      },
+      l
+    ),
+    [
+      d,
+      n,
+      s,
+      f,
+      o,
+      j,
+      w,
+      i,
+      c,
+      v,
+      x,
+      R,
+      $
+    ]
+  );
+  return /* @__PURE__ */ e.jsxs(
+    X,
+    {
+      $level: t,
+      $isShowConnector: h,
+      $gridColumns: o,
+      className: L,
+      ...F,
+      children: [
+        /* @__PURE__ */ e.jsx(K, { followCursor: !0, arrow: !1, ...D, children: /* @__PURE__ */ e.jsx(
+          Y,
+          {
+            $level: t,
+            $isShowConnector: h,
+            $gridColumns: o,
+            [Q]: r,
+            ...A,
+            children: q()
+          }
+        ) }),
+        /* @__PURE__ */ e.jsx(
+          M,
+          {
+            ...y,
+            data: N,
+            keyId: d,
+            level: t,
+            variant: n,
+            gridColumns: o,
+            initialVisibleChildrenCount: i,
+            moreButtonColumnPosition: c,
+            renderRow: z
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  te as Row
+};

package/lib/components/DataGrid/Row/RowContext/RowContext.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext({isDisabled:!1,addDisabledRow:()=>{},removeDisabledRow:()=>{}});exports.RowContext=t;

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

@@ -0,0 +1,7 @@
+export type RowContextProps = {
+    isDisabled: boolean;
+    disabledReason?: string;
+    addDisabledRow: (disabledReason?: string) => void;
+    removeDisabledRow: () => void;
+};
+export declare const RowContext: import('react').Context<RowContextProps>;

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

@@ -0,0 +1,11 @@
+import { createContext as e } from "react";
+const t = e({
+  isDisabled: !1,
+  addDisabledRow: () => {
+  },
+  removeDisabledRow: () => {
+  }
+});
+export {
+  t as RowContext
+};

package/lib/components/DataGrid/Row/RowContext/RowProvider/RowProvider.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../../_virtual/jsx-runtime.cjs"),o=require("react"),l=require("../RowContext.cjs"),R=({children:s})=>{const[r,e]=o.useState(!1),[i,t]=o.useState(),a=d=>{e(!0),t(d)},n=()=>{e(!1),t(void 0)};return u.j.jsx(l.RowContext.Provider,{value:{isDisabled:r,disabledReason:i,addDisabledRow:a,removeDisabledRow:n},children:s})};exports.RowContextProvider=R;

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

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+type RowContextProviderProps = {
+    children: ReactNode;
+};
+export declare const RowContextProvider: ({ children }: RowContextProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/DataGrid/Row/RowContext/RowProvider/RowProvider.mjs

@@ -0,0 +1,25 @@
+import { j as l } from "../../../../../_virtual/jsx-runtime.mjs";
+import { useState as s } from "react";
+import { RowContext as m } from "../RowContext.mjs";
+const c = ({ children: t }) => {
+  const [r, e] = s(!1), [a, o] = s(), i = (n) => {
+    e(!0), o(n);
+  }, d = () => {
+    e(!1), o(void 0);
+  };
+  return /* @__PURE__ */ l.jsx(
+    m.Provider,
+    {
+      value: {
+        isDisabled: r,
+        disabledReason: a,
+        addDisabledRow: i,
+        removeDisabledRow: d
+      },
+      children: t
+    }
+  );
+};
+export {
+  c as RowContextProvider
+};

package/lib/components/DataGrid/Row/constants.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _="data-row-disable",t="astral-ui_datagrid_row_hidden";exports.DISABLE_ROW_ATTR=_;exports.HIDDEN_CHILDREN_ROW_CLASSNAME=t;

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

@@ -0,0 +1,5 @@
+const _ = "data-row-disable", a = "astral-ui_datagrid_row_hidden";
+export {
+  _ as DISABLE_ROW_ATTR,
+  a as HIDDEN_CHILDREN_ROW_CLASSNAME
+};

package/lib/components/DataGrid/Row/styles.cjs

@@ -0,0 +1,80 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("lucide-react"),l=require("../../IconButton/IconButton.cjs"),i=require("../Cell/Cell.cjs"),e=require("../constants.cjs"),o=require("@mui/material"),a=require("./constants.cjs"),s=o.styled("li")`
+  position: relative;
+
+  &:not(:last-of-type)::before,
+  &.${a.HIDDEN_CHILDREN_ROW_CLASSNAME}::before {
+    content: '';
+
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    transform: ${({$level:t})=>`translateX(calc(${e.ROOT_ACTION_CELL_WIDTH}px * ${t} - ${e.TREE_LINE_WIDTH}px))`};
+
+    display: ${({$isShowConnector:t})=>t?"block":"none"};
+
+    width: 0;
+    height: 100%;
+
+    border-left: 1px solid ${({theme:t})=>t.palette.grey[400]};
+  }
+`,p=o.styled("div")`
+  position: relative;
+
+  display: grid;
+  grid-template-columns: ${({$gridColumns:t})=>t};
+
+  background-color: ${({theme:t,$isSelected:r})=>r?t.palette.primary[100]:"transparent"};
+
+  transition: ${({theme:t})=>t.transitions.create(["background-color"],{duration:t.transitions.duration.short})};
+
+  &::before {
+    content: '';
+
+    position: absolute;
+    top: 0;
+    transform: ${({$level:t})=>`translateX(calc(${e.ROOT_ACTION_CELL_WIDTH}px * ${t} - ${e.TREE_LINE_WIDTH}px))`};
+
+    display: ${({$isShowConnector:t})=>t?"block":"none"};
+
+    width: ${e.TREE_LINE_WIDTH}px;
+    height: 50%;
+
+    border-bottom: 1px solid ${({theme:t})=>t.palette.grey[400]};
+    border-left: 1px solid ${({theme:t})=>t.palette.grey[400]};
+    border-radius: 0 0 0 ${({theme:t})=>t.shape.small};
+  }
+
+  &:hover {
+    cursor: ${({$isHovered:t})=>t?"pointer":"default"};
+
+    background-color: ${({theme:t,$isHovered:r})=>r?t.palette.background.elementHover:"transparent"};
+  }
+`,c=o.styled(i.Cell)`
+  margin-left: ${({$level:t})=>`${t*e.ROOT_ACTION_CELL_WIDTH}px`};
+`,d=o.styled("div")`
+  display: flex;
+  align-items: center;
+  align-self: center;
+  justify-content: center;
+
+  width: ${e.ROOT_ACTION_CELL_WIDTH}px;
+`,u=o.styled("div")`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  width: ${e.ROOT_ACTION_CELL_WIDTH}px;
+`,C=o.styled(l.IconButton)`
+  width: 24px;
+  height: 24px;
+
+  color: inherit;
+
+  &:hover {
+    background-color: ${({theme:t})=>t.palette.grey[300]};
+  }
+`,$=o.styled(n.ChevronRight,{shouldForwardProp:t=>t!=="$isActive"})`
+  transform: rotateZ(${({$isActive:t})=>t?90:0}deg);
+
+  transition: ${({theme:t})=>t.transitions.create("transform",{easing:t.transitions.easing.sharp,duration:t.transitions.duration.short})};
+`;exports.CellStyled=c;exports.CheckboxCell=d;exports.ChevronIcon=$;exports.CollapseButton=C;exports.CollapseCell=u;exports.ContentWrapper=p;exports.Wrapper=s;

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

@@ -0,0 +1,31 @@
+export declare const Wrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $isShowConnector: boolean;
+    $gridColumns: string;
+    $level: number;
+}, import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
+export declare const ContentWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $isShowConnector: boolean;
+    $isHovered?: boolean;
+    $isSelected?: boolean;
+    $gridColumns: string;
+    $level: number;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CellStyled: import('@emotion/styled').StyledComponent<import('../Cell').CellProps<Record<string, unknown>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $level: number;
+}, {}, {}>;
+export declare const CheckboxCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CollapseCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CollapseButton: 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('../..').ButtonVariants}`;
+    loading?: boolean;
+    loadingIndicator?: import('react').ReactNode;
+    loadingPosition?: "start" | "end" | "center";
+    color?: `${import('../..').ButtonColors}`;
+    component?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+    selected?: boolean;
+} & {
+    loading?: boolean;
+} & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const ChevronIcon: import('@emotion/styled').StyledComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $isActive?: boolean;
+}, {}, {}>;

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

@@ -0,0 +1,102 @@
+import { ChevronRight as i } from "lucide-react";
+import { IconButton as a } from "../../IconButton/IconButton.mjs";
+import { Cell as s } from "../Cell/Cell.mjs";
+import { ROOT_ACTION_CELL_WIDTH as r, TREE_LINE_WIDTH as n } from "../constants.mjs";
+import { styled as o } from "@mui/material";
+import { HIDDEN_CHILDREN_ROW_CLASSNAME as l } from "./constants.mjs";
+const m = o("li")`
+  position: relative;
+
+  &:not(:last-of-type)::before,
+  &.${l}::before {
+    content: '';
+
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    transform: ${({ $level: t }) => `translateX(calc(${r}px * ${t} - ${n}px))`};
+
+    display: ${({ $isShowConnector: t }) => t ? "block" : "none"};
+
+    width: 0;
+    height: 100%;
+
+    border-left: 1px solid ${({ theme: t }) => t.palette.grey[400]};
+  }
+`, u = o("div")`
+  position: relative;
+
+  display: grid;
+  grid-template-columns: ${({ $gridColumns: t }) => t};
+
+  background-color: ${({ theme: t, $isSelected: e }) => e ? t.palette.primary[100] : "transparent"};
+
+  transition: ${({ theme: t }) => t.transitions.create(["background-color"], {
+  duration: t.transitions.duration.short
+})};
+
+  &::before {
+    content: '';
+
+    position: absolute;
+    top: 0;
+    transform: ${({ $level: t }) => `translateX(calc(${r}px * ${t} - ${n}px))`};
+
+    display: ${({ $isShowConnector: t }) => t ? "block" : "none"};
+
+    width: ${n}px;
+    height: 50%;
+
+    border-bottom: 1px solid ${({ theme: t }) => t.palette.grey[400]};
+    border-left: 1px solid ${({ theme: t }) => t.palette.grey[400]};
+    border-radius: 0 0 0 ${({ theme: t }) => t.shape.small};
+  }
+
+  &:hover {
+    cursor: ${({ $isHovered: t }) => t ? "pointer" : "default"};
+
+    background-color: ${({ theme: t, $isHovered: e }) => e ? t.palette.background.elementHover : "transparent"};
+  }
+`, h = o(s)`
+  margin-left: ${({ $level: t }) => `${t * r}px`};
+`, b = o("div")`
+  display: flex;
+  align-items: center;
+  align-self: center;
+  justify-content: center;
+
+  width: ${r}px;
+`, x = o("div")`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  width: ${r}px;
+`, y = o(a)`
+  width: 24px;
+  height: 24px;
+
+  color: inherit;
+
+  &:hover {
+    background-color: ${({ theme: t }) => t.palette.grey[300]};
+  }
+`, C = o(i, {
+  shouldForwardProp: (t) => t !== "$isActive"
+})`
+  transform: rotateZ(${({ $isActive: t }) => t ? 90 : 0}deg);
+
+  transition: ${({ theme: t }) => t.transitions.create("transform", {
+  easing: t.transitions.easing.sharp,
+  duration: t.transitions.duration.short
+})};
+`;
+export {
+  h as CellStyled,
+  b as CheckboxCell,
+  C as ChevronIcon,
+  y as CollapseButton,
+  x as CollapseCell,
+  u as ContentWrapper,
+  m as Wrapper
+};

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

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

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

@@ -0,0 +1,35 @@
+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[];
+    rowId: string;
+    disabled: boolean | undefined;
+    isRenderCollapseButton: boolean;
+    handleToggle: (event: MouseEvent<HTMLButtonElement>) => void;
+    rowProps: {
+        $isHovered: boolean;
+        $isSelected: boolean;
+        onClick: () => undefined;
+        onMouseMove: (event: MouseEvent<HTMLElement>) => void;
+    };
+    tooltipProps: {
+        open: boolean;
+        title: string | undefined;
+        onOpen: (event: SyntheticEvent<Element, Event>) => void;
+        onClose: () => void;
+    };
+    checkboxProps: {
+        checked: boolean | undefined;
+        disabled: boolean | undefined;
+        onChange: (event: import('react').ChangeEvent<HTMLInputElement>) => void;
+    };
+    nestedChildrenProps: {
+        isOpen: boolean;
+        rowId: string;
+    };
+};
+export {};

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

@@ -0,0 +1,79 @@
+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
+}) => {
+  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;
+  return {
+    isOpen: l,
+    isShowConnector: S,
+    childrenColumns: I,
+    rowId: e,
+    disabled: t,
+    isRenderCollapseButton: j,
+    handleToggle: V,
+    rowProps: {
+      $isHovered: !!(!t && d),
+      $isSelected: C === e,
+      onClick: $,
+      onMouseMove: _
+    },
+    tooltipProps: {
+      open: P,
+      title: t ? A || M : void 0,
+      onOpen: w,
+      onClose: L
+    },
+    checkboxProps: {
+      checked: E,
+      disabled: t,
+      onChange: O(s)
+    },
+    nestedChildrenProps: {
+      isOpen: l,
+      rowId: e
+    }
+  };
+};
+export {
+  oe as useLogic
+};

package/lib/components/DataGrid/Row/useLogic/utils/getColumnsMap/getColumnsMap.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=r=>r.reduce((e,{field:t,...u})=>t?{...e,[t]:u}:e,{});exports.getColumnsMap=n;

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

@@ -0,0 +1,4 @@
+import { CellValue, DataGridRowOptionColumns } from '../../../../types';
+type GetColumnsMapResult<TData> = Record<keyof TData, Omit<TData, 'field'>> | object;
+export declare const getColumnsMap: <TData extends Record<string, CellValue>>(columns: DataGridRowOptionColumns<TData>[]) => GetColumnsMapResult<TData>;
+export {};

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

@@ -0,0 +1,8 @@
+const u = (t) => t.reduce((r, { field: e, ...n }) => e ? {
+  // biome-ignore lint/performance/noAccumulatingSpread: <explanation>
+  ...r,
+  [e]: n
+} : r, {});
+export {
+  u as getColumnsMap
+};