@noraent/nora-datagrid 1.1.0-beta.31 → 1.1.0-beta.32

package/README.md

@@ -208,7 +208,35 @@ pnpm add @emotion/react @emotion/styled @emotion/css
 pnpm add rimraf
 ```
 
+## Tree Data와 행 이동
+
+평면 데이터의 parent id field를 사용해 계층을 구성할 수 있습니다. Tree Data에서는 행 상태와 이동을 안정적으로 유지하기 위해 `getRowId`를 지정해야 합니다.
+
+```tsx
+const rows = [
+  { id: "project", parentId: null, name: "프로젝트" },
+  { id: "design", parentId: "project", name: "디자인" },
+  { id: "develop", parentId: "project", name: "개발" },
+];
+
+<DataGrid
+  columns={[{ fieldId: "name", fieldName: "이름", width: 280 }]}
+  dataSource={rows}
+  getRowId={(row) => row.id}
+  treeData
+  treeDataParentIdField="parentId"
+  treeDataColumn="name"
+  groupDefaultExpanded={-1}
+  rowDragManaged
+  onRowMove={({ dataSource }) => setRows(dataSource)}
+/>
+```
+
+`groupDefaultExpanded`는 기본으로 펼칠 계층 수이며 `-1`은 전체 펼침입니다. Managed row drag는 정렬이 적용되지 않은 클라이언트 데이터에서 활성화됩니다. `isRowValidDropPosition`으로 업무 규칙에 맞지 않는 drop을 차단할 수 있습니다.
+펼쳐진 그룹의 상위 행은 세로 스크롤 중 컬럼 헤더 아래에 고정됩니다. 이 동작이 필요하지 않으면 `suppressGroupRowsSticky`를 `true`로 설정합니다.
+
 참고 레퍼런스
+
 nora-data-grid은 @leokim97제공하는 ConveGrid 코어를 기반으로 개발 되었습니다.
 일부 nameSpace 구조등 ConveGrid 기반이므로 중복될 수 있습니다.
 

package/dist/buildPackage.json

@@ -1,6 +1,6 @@
 {
   "name": "@noraent/nora-datagrid",
-  "version": "1.1.0-beta.31",
+  "version": "1.1.0-beta.32",
   "module": "./dist/nora_datagrid.es.js",
   "main": "./dist/nora_datagrid.cjs.js",
   "private": false,

package/dist/common/constants/useEnhancedEffect/useEnhancedEffect.d.ts

@@ -1,3 +1,3 @@
 import * as React from "react";
-declare const useEnhancedEffect: typeof React.useLayoutEffect;
+declare const useEnhancedEffect: typeof React.useEffect;
 export default useEnhancedEffect;

package/dist/common/constants/utils.d.ts

@@ -45,6 +45,11 @@ export declare const sorting: (dataSource: DataGridDataSource, newSort: GridSort
     __ariaRowindex: number;
     __dataRowindex: number;
     __uuid: string;
+    __rowId?: import('../../types').GridRowId;
     __originalRowindex: number;
+    __parentId?: import('../../types').GridRowId | null;
+    __treeDepth?: number;
+    __hasChildren?: boolean;
+    __expanded?: boolean;
     height?: number;
 }[];

package/dist/common/rows/treeData.d.ts

@@ -0,0 +1,20 @@
+import { DataGridPrivateDataSourceModel, GridRowId, GridSortModel } from '../../types/dataGridCoreProps';
+export type TreeDropPosition = "before" | "inside" | "after";
+export interface TreeRowModel {
+    sourceRows: DataGridPrivateDataSourceModel[];
+    visibleRows: DataGridPrivateDataSourceModel[];
+    nodeById: Map<GridRowId, DataGridPrivateDataSourceModel>;
+    childrenByParentId: Map<GridRowId | null, GridRowId[]>;
+    expandedIds: Set<GridRowId>;
+}
+interface BuildTreeRowModelOptions {
+    getRowId: (row: DataGridPrivateDataSourceModel) => GridRowId;
+    parentIdField: string;
+    expandedIds?: ReadonlySet<GridRowId>;
+    groupDefaultExpanded?: number;
+    sortModel?: GridSortModel;
+}
+export declare function rowIdToKey(id: GridRowId): string;
+export declare function buildTreeRowModel(sourceRows: DataGridPrivateDataSourceModel[], options: BuildTreeRowModelOptions): TreeRowModel;
+export declare function moveTreeRow(model: TreeRowModel, sourceId: GridRowId, targetId: GridRowId, position: TreeDropPosition, parentIdField: string, getRowId: (row: DataGridPrivateDataSourceModel) => GridRowId): DataGridPrivateDataSourceModel[] | null;
+export {};

package/dist/common/rows/treeData.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/TreeData.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/TwoDimensionalVirtualizedList.d.ts

@@ -2,6 +2,12 @@ import { default as React, ReactNode } from 'react';
 import { DataGridPrivateColumnModel, DataGridPrivateDataSourceModel } from '../types/dataGridCoreProps';
 import { DataGridPrivateApiModel, GirdApiCommon } from '../types/dataGridProps';
 export declare const initialWindowHeight = 500;
+export interface StickyTreeRow {
+    row: DataGridPrivateDataSourceModel;
+    top: number;
+    translateY: number;
+}
+export declare function getStickyTreeRows(rows: DataGridPrivateDataSourceModel[], cumulativeHeights: number[], scrollTop: number, fallbackRowHeight: number): StickyTreeRow[];
 interface VirtualListProps {
     children: (props: {
         visibleItems: Array<DataGridPrivateDataSourceModel>;

package/dist/components/icon/ChevronDownIcon.d.ts

@@ -0,0 +1,7 @@
+export declare function ChevronDownIcon({ size, color, strokeWidth, className, ...props }: {
+    [x: string]: any;
+    size?: number | undefined;
+    color?: string | undefined;
+    strokeWidth?: number | undefined;
+    className?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/ChevronRightIcon.d.ts

@@ -0,0 +1,7 @@
+export declare function ChevronRightIcon({ size, color, strokeWidth, className, ...props }: {
+    [x: string]: any;
+    size?: number | undefined;
+    color?: string | undefined;
+    strokeWidth?: number | undefined;
+    className?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/GripIcon.d.ts

@@ -0,0 +1,7 @@
+export declare function GripIcon({ size, color, strokeWidth, className, ...props }: {
+    [x: string]: any;
+    size?: number | undefined;
+    color?: string | undefined;
+    strokeWidth?: number | undefined;
+    className?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;