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

package/README.md

@@ -48,6 +48,109 @@ feature → develop → release/x.x.x → main
 
 ## ✨ nora-data-grid v3 개요
 
+### 테마 커스텀
+
+`createTheme`과 `ThemeProvider`로 grid 전체 폰트, header, 기본 row와 선택 row 스타일을 설정할 수 있습니다.
+
+```tsx
+const gridTheme = createTheme({
+  typography: {
+    fontFamily: "Pretendard, sans-serif",
+  },
+  palette: {
+    primary: {
+      main: "var(--grid-primary)",
+    },
+  },
+  components: {
+    HeaderCell: {
+      default: {
+        backgroundColor: "#f8fafc",
+        text: { main: "#334155" },
+        typography: { fontSize: 13, fontWeight: 600 },
+      },
+    },
+    Row: {
+      default: {
+        text: { main: "#475569" },
+        typography: { fontSize: 14, fontWeight: 400 },
+      },
+      selected: {
+        background: "#eef2ff",
+        borderColor: "#c7d2fe",
+        text: { main: "#3730a3" },
+      },
+      "selected-hover": {
+        background: "#e0e7ff",
+      },
+    },
+  },
+});
+
+<ThemeProvider theme={gridTheme}>
+  <DataGrid {...props} />
+</ThemeProvider>;
+```
+
+`Row.selected.background`을 생략하면 `palette.primary.main`에 10% 투명도를 적용합니다. `primary.main`에는 HEX뿐 아니라 `var(--grid-primary)` 같은 CSS 색상 표현식도 사용할 수 있습니다.
+
+### 컬럼 크기 설정
+
+고정 너비와 반응형 flex 컬럼을 함께 사용할 수 있습니다. `width`, `minWidth`, `maxWidth`의 단위는 px입니다.
+
+```tsx
+const columns = [
+  { fieldId: "id", fieldName: "ID", width: 100 },
+  { fieldId: "name", fieldName: "이름", flex: 1, minWidth: 120 },
+  { fieldId: "description", fieldName: "설명", flex: 2, minWidth: 160, maxWidth: 500 },
+];
+```
+
+Grid 최초 렌더링 시 전체 폭 또는 콘텐츠에 맞추려면 `autoSizeStrategy`를 사용합니다.
+
+```tsx
+<DataGrid
+  columns={columns}
+  dataSource={rows}
+  autoSizeStrategy={{ type: "fitGridWidth", defaultMinWidth: 80 }}
+/>
+
+<DataGrid
+  columns={columns}
+  dataSource={rows}
+  autoSizeStrategy={{
+    type: "fitCellContents",
+    includeHeader: true,
+    scaleUpToFitGridWidth: true,
+  }}
+/>
+```
+
+원하는 시점에 API로 다시 계산할 수도 있습니다.
+
+```ts
+const gridRef = useGridApiRef();
+
+gridRef.current.sizeColumnsToFit({ defaultMinWidth: 80 });
+gridRef.current.autoSizeColumns(["name", "description"], {
+  includeHeader: true,
+  scaleUpToFitGridWidth: true,
+});
+```
+
+`renderCell`이 문자열이 아닌 커스텀 UI를 반환한다면 측정에 사용할 값을 `getAutoSizeValue`로 지정할 수 있습니다.
+
+```ts
+{
+  fieldId: "status",
+  fieldName: "상태",
+  renderCell: ({ value }) => <StatusChip value={value} />,
+  getAutoSizeValue: ({ value }) => String(value),
+}
+```
+
+사용자가 flex 컬럼의 resize handle을 드래그하면 해당 컬럼은 고정 너비 컬럼으로 전환됩니다. `suppressSizeToFit: true`인 컬럼은 `fitGridWidth` 실행 시 현재 너비를 유지합니다.
+
 ## 🚀 Build Setup
 
 ### install

package/dist/App.d.ts

@@ -1,10 +1,2 @@
 declare function App(): import("react/jsx-runtime").JSX.Element;
-export declare const initialItemsData: () => {
-    id: number;
-    columns: {
-        id: string;
-        width: number;
-        content: string;
-    }[];
-}[];
 export default App;

package/dist/DataGrid.d.ts

@@ -1,3 +1,3 @@
+import { DataGridBasicPropsModel } from './types/dataGridProps';
 import * as React from "react";
-import { DataGridBasicPropsModel } from "./types/dataGridProps";
-export declare const DataGrid: React.NamedExoticComponent<import("./types/dataGridCoreProps").DeepOmitStartsWith<Pick<DataGridBasicPropsModel, "columns" | "dataSource">, "__"> & Partial<import("./types/dataGridProps").DataGridOptionPropsModel> & React.RefAttributes<HTMLDivElement>>;
+export declare const DataGrid: React.NamedExoticComponent<import('./types/dataGridCoreProps').DeepOmitStartsWith<Pick<DataGridBasicPropsModel, "columns" | "dataSource">, "__"> & Partial<import('./types/dataGridProps').DataGridOptionPropsModel> & React.RefAttributes<HTMLDivElement>>;

package/dist/buildPackage.json

@@ -1,3 +1,94 @@
 {
-    "version": "배포시 버전 표시"
+  "name": "@noraent/nora-datagrid",
+  "version": "1.1.0-beta.31",
+  "module": "./dist/nora_datagrid.es.js",
+  "main": "./dist/nora_datagrid.cjs.js",
+  "private": false,
+  "files": [
+    "dist/"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/nora_datagrid.es.js",
+      "require": "./dist/nora_datagrid.cjs.js"
+    }
+  },
+  "type": "module",
+  "sideEffects": false,
+  "scripts": {
+    "start": "vite --mode on-local",
+    "build:local": "tsc -b && vite build --mode on-local",
+    "build:dev": "tsc -b && vite build --mode dev",
+    "build:production": "tsc -b && vite build --mode production",
+    "clean": "pnpm run clean:build && rimraf ./node_modules",
+    "clean:build": "rimraf ./dist",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "test": "vitest run",
+    "tsc-build": "tsc -p tsconfig-esm.json && tsc -p tsconfig-cjs.json && npm run vite-build && npm run copy-scss",
+    "vite-build": "tsc -b && vite build --mode production",
+    "publish:npm": "rm -rf dist && mkdir dist && npm run vite-build && npm run copy-package",
+    "copy-package": "cp package.json dist/buildPackage.json && cp package.json lib/cjs/buildPackage.json&& cp package.json lib/esm/buildPackage.json ",
+    "copy-scss": "cpx \"src/**/*.scss\" lib/cjs && cpx \"src/**/*.scss\" lib/esm"
+  },
+  "dependencies": {
+    "@emotion/css": "^11.13.5",
+    "@noraent/nora-datagrid": "file:",
+    "jose": "^6.1.0",
+    "lodash": "^4.17.21",
+    "rimraf": "^6.0.1",
+    "sass-embedded": "^1.87.0"
+  },
+  "peerDependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.27.2",
+    "@babel/preset-react": "^7.27.1",
+    "@eslint/js": "^9.9.0",
+    "@mui/material": "^7.3.4",
+    "@mui/x-charts": "^8.27.0",
+    "@testing-library/react": "^16.3.3",
+    "@types/lodash": "^4.17.16",
+    "@types/node": "^22.15.14",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "cpx": "^1.5.0",
+    "eslint": "^9.9.0",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.9",
+    "flatqueue": "^3.0.0",
+    "globals": "^15.9.0",
+    "jsdom": "^26.1.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "terser": "^5.39.0",
+    "typescript": "~5.8.3",
+    "typescript-eslint": "^8.24.1",
+    "vite": "^6.2.0",
+    "vite-plugin-dts": "^4.5.3",
+    "vite-plugin-svgr": "^4.3.0",
+    "vite-tsconfig-paths": "^5.1.4",
+    "vitest": "^3.2.4"
+  },
+  "peerDependenciesMeta": {
+    "@emotion/react": {
+      "optional": true
+    },
+    "@emotion/styled": {
+      "optional": true
+    }
+  },
+  "babel": {
+    "presets": [
+      "@babel/preset-env",
+      "@babel/preset-react"
+    ]
+  },
+  "packageManager": "pnpm@10.6.5+sha512.cdf928fca20832cd59ec53826492b7dc25dc524d4370b6b4adbf65803d32efaa6c1c88147c0ae4e8d579a6c9eec715757b50d4fa35eea179d868eada4ed043af"
 }

package/dist/common/columns/sizing.d.ts

@@ -0,0 +1,11 @@
+import { DataGridColumns, DataGridPrivateColumnModel, DataGridPrivateDataSourceModel, FitCellContentsOptions, FitGridWidthOptions } from '../../types/dataGridCoreProps';
+export declare const CHECKBOX_COLUMN_WIDTH = 40;
+export declare const GRID_SCROLLBAR_SIZE = 14;
+export declare function normalizeColumnWidth(width: string | number | undefined): number;
+export declare function getColumnWidth(column: Pick<DataGridPrivateColumnModel, "width" | "__computedWidth">): number;
+export declare function clampColumnWidth(column: DataGridPrivateColumnModel, width: number, defaultMinWidth?: number): number;
+export declare function resizeColumn(columns: DataGridColumns, columnIndex: number, requestedWidth: number): DataGridColumns;
+export declare function resolveFlexColumnWidths(columns: DataGridColumns, availableWidth: number): DataGridColumns;
+export declare function fitColumnsToGridWidth(columns: DataGridColumns, availableWidth: number, options?: FitGridWidthOptions): DataGridColumns;
+export declare function fitColumnsToCellContents(columns: DataGridColumns, rows: DataGridPrivateDataSourceModel[], options?: FitCellContentsOptions, fieldIds?: string[], root?: HTMLElement | null, availableWidth?: number): DataGridColumns;
+export declare function haveSameComputedWidths(left: DataGridColumns, right: DataGridColumns): boolean;

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

@@ -1,2 +1,2 @@
-export * from "./defaultProps";
-export * from "./useEventCallback";
+export * from './defaultProps';
+export * from './useEventCallback';

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

@@ -0,0 +1,3 @@
+import { DataGridPrivateDataSourceModel } from '../../types/dataGridCoreProps';
+export declare function getSelectionSet(selectionList: readonly string[]): ReadonlySet<string>;
+export declare function filterRowsBySelection(rows: DataGridPrivateDataSourceModel[], selectionList: readonly string[]): DataGridPrivateDataSourceModel[];

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

@@ -1,4 +1,6 @@
-import React from "react";
+import { default as React } from 'react';
+import { DataGridDataSource } from '../../types';
+import { GridSortModel } from '../../types/dataGridCoreProps';
 /**
  * 첫 마운트시 실행 되지 않습니다.
  * 업데이트시 실행하고 싶다면 사용해주세요.
@@ -31,10 +33,18 @@ export default useUpdateEffect;
 export declare function range(from: number, to: number): number[];
 export declare function adjustSaturation(hex: string, amount: number): string;
 /**
- * HEX 색상에 투명도(alpha) 적용
- * @param hex - '#RRGGBB' 형식
+ * 색상에 투명도(alpha) 적용
+ * @param color - HEX 색상 또는 CSS 색상 표현식
  * @param opacity - 0 ~ 1 (투명도)
- * @returns 'rgba(r,g,b,a)' 문자열
+ * @returns HEX는 rgba(), 그 외 CSS 색상은 color-mix() 문자열
  */
-export declare function alpha(hex: string, opacity: number): string;
+export declare function alpha(color: string, opacity: number): string;
 export declare function deepMerge<T>(target: T, source: Partial<T>): T;
+export declare function toNumberWidth(width: string | number | undefined): number;
+export declare const sorting: (dataSource: DataGridDataSource, newSort: GridSortModel) => {
+    __ariaRowindex: number;
+    __dataRowindex: number;
+    __uuid: string;
+    __originalRowindex: number;
+    height?: number;
+}[];

package/dist/common/foundation/palette.d.ts

@@ -1,4 +1,4 @@
-import { ColorMode, ComponentColors, DeepRequired, GridTheme, GridThemeOptions } from "../../types/palette";
+import { ColorMode, ComponentColors, DeepRequired, GridTheme, GridThemeOptions } from '../../types/palette';
 declare const lightPalette: GridTheme["palette"];
 declare const darkPalette: GridTheme["palette"];
 declare const darkCustomVars: {

package/dist/common/foundation/scale/color/index.d.ts

@@ -1 +1 @@
-export * from "./color";
+export * from './color';

package/dist/common/foundation/scale/index.d.ts

@@ -1,2 +1,2 @@
-export * as layout from "./layout";
-export * as color from "./color";
+export * as layout from './layout';
+export * as color from './color';

package/dist/common/foundation/scale/layout/index.d.ts

@@ -1 +1 @@
-export * from "./size";
+export * from './size';

package/dist/common/styled/assets/components/index.d.ts

@@ -1 +1 @@
-export * from "./loading/Loading";
+export * from './loading/Loading';

package/dist/common/styled/assets/components/loading/Loading.d.ts

@@ -1,2 +1,2 @@
-import Loading from "../../svg/loading/Loading.svg?react";
+import { default as Loading } from '../../svg/loading/Loading.svg?react';
 export { Loading as LoadingSvg };

package/dist/common/styled/assets/index.d.ts

@@ -1 +1 @@
-export * from "./components";
+export * from './components';

package/dist/common/styled/index.d.ts

@@ -5,19 +5,19 @@
  * 가이드가 아니므로 참고용으로만 활용해 주세요.
  * 디자인 시스템을 개발할경우 색상이나 사이즈 처리 등 가이드로 사용하기에는 다소 부족한 부분이 있을 수 있습니다. 부득이하게 개발이 필요한 경우 해당부분을 고려하여 개발 해주세요.
  */
-export declare const StyledButton: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const StyledButton: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const StyledSubTitle: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const StyledSubTitle: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const StyledNoneContent: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const StyledNoneContent: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const Typography: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const Typography: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const Spinner: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const Spinner: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
 export declare const spin: string;

package/dist/components/GridBasicRows.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import { ReactNode } from 'react';
 declare function GridBasicRows(props: GridMainProps): import("react/jsx-runtime").JSX.Element;
 export default GridBasicRows;
 interface GridMainProps {

package/dist/components/NoraDataGrid.d.ts

@@ -1,6 +1,5 @@
-/** @jsxImportSource @emotion/react */
-import React, { ReactNode } from "react";
-import { Interpolation, Theme } from "@emotion/react";
+import { default as React, ReactNode } from 'react';
+import { Interpolation, Theme } from '@emotion/react';
 export declare const NoraDataGrid: React.ForwardRefExoticComponent<NoraDataGridMainProps & React.RefAttributes<HTMLDivElement>> & {
     Title: typeof NoraDataGridTitle;
     Body: React.ForwardRefExoticComponent<NoraDataGridMainProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/TwoDimensionalVirtualizedList.d.ts

@@ -1,6 +1,21 @@
-import React from "react";
-import { DataGridPrivateColumnModel, DataGridPrivateDataSourceModel } from "../types/dataGridCoreProps";
+import { default as React, ReactNode } from 'react';
+import { DataGridPrivateColumnModel, DataGridPrivateDataSourceModel } from '../types/dataGridCoreProps';
+import { DataGridPrivateApiModel, GirdApiCommon } from '../types/dataGridProps';
 export declare const initialWindowHeight = 500;
+interface VirtualListProps {
+    children: (props: {
+        visibleItems: Array<DataGridPrivateDataSourceModel>;
+        startColumnIndex: number;
+        cumulativeWidths: number[];
+        columnEndIndex: number;
+        windowSize: {
+            width: number;
+            height: number;
+        };
+    }) => ReactNode;
+    imeRef: React.RefObject<HTMLTextAreaElement | null>;
+}
+export declare const DynamicVirtualScroll: React.FC<VirtualListProps>;
 export declare const VirtualItem: React.MemoExoticComponent<({ column, row, rowIndex, }: {
     column: DataGridPrivateColumnModel;
     row: DataGridPrivateDataSourceModel;
@@ -9,6 +24,7 @@ export declare const VirtualItem: React.MemoExoticComponent<({ column, row, rowI
 export declare const TwoDimensionalVirtualizedList: React.MemoExoticComponent<({ imeRef }: {
     imeRef: React.RefObject<HTMLTextAreaElement | null>;
 }) => import("react/jsx-runtime").JSX.Element>;
+export declare const computeCellClass: (gridRef: React.RefObject<GirdApiCommon<DataGridPrivateApiModel>>, fieldId: string, ariaRowindex: number) => string;
 declare const _default: React.MemoExoticComponent<React.MemoExoticComponent<({ imeRef }: {
     imeRef: React.RefObject<HTMLTextAreaElement | null>;
 }) => import("react/jsx-runtime").JSX.Element>>;

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

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

package/dist/components/body/NoDataComponent.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+declare const _default: import('react').MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/components/body/_styled/index.d.ts

@@ -1,9 +1,9 @@
-export declare const NoDataContent: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const NoDataContent: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const NoDataTitle: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const NoDataTitle: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const ErrorIconBox: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const ErrorIconBox: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;

package/dist/components/cell/CellMode.d.ts

@@ -1,3 +1,3 @@
-import { GridCellPrams } from "../../types/dataGridCoreProps";
+import { GridCellPrams } from '../../types/dataGridCoreProps';
 declare const CellMode: (props: GridCellPrams) => string | import("react/jsx-runtime").JSX.Element;
 export default CellMode;

package/dist/components/cell/Checkbox.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import { default as React } from 'react';
 declare const _default: React.MemoExoticComponent<({ rowUUID, isHidden }: {
     rowUUID: string;
     isHidden: boolean;

package/dist/components/cell/CheckboxAll.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
+import { default as React } from 'react';
 declare const _default: React.MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/components/cell/_styled/index.d.ts

@@ -1,3 +1,3 @@
-export declare const CheckboxCon: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const CheckboxCon: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;

package/dist/components/header/VirtualHorizontalHeader.d.ts

@@ -1,5 +1,5 @@
-import { VirtualHeaderProps } from "../virtualized/_constants/virtualHeaderConstants";
-declare const _default: import("react").MemoExoticComponent<(props: VirtualHeaderProps & {
+import { VirtualHeaderProps } from '../virtualized/_constants/virtualHeaderConstants';
+declare const _default: import('react').MemoExoticComponent<(props: VirtualHeaderProps & {
     offsetLeft: number;
 }) => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/components/ime/IMEComponent.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import { default as React } from 'react';
 declare const _default: React.NamedExoticComponent<{
     defaultValue: string;
 } & React.RefAttributes<HTMLDivElement | HTMLTextAreaElement>>;

package/dist/components/virtualized/_components/RenderHeader.d.ts

@@ -1,3 +1,3 @@
-import { DataGridColumnModelType } from "../../../types/dataGridCoreProps";
+import { DataGridColumnModelType } from '../../../types/dataGridCoreProps';
 declare const RenderHeader: (props: DataGridColumnModelType) => import("react/jsx-runtime").JSX.Element;
 export default RenderHeader;

package/dist/components/virtualized/_components/VirtualHeader.d.ts

@@ -1,11 +1,6 @@
-import React from "react";
-import { VirtualHeaderProps } from "../_constants/virtualHeaderConstants";
-import { DataGridDataSource, GridSortModel } from "../../../types/dataGridCoreProps";
+import { default as React } from 'react';
+import { VirtualHeaderProps } from '../_constants/virtualHeaderConstants';
+import { sorting } from '../../../common/constants/utils';
 declare const VirtualHeader: React.FC<VirtualHeaderProps>;
-export declare const sorting: (dataSource: DataGridDataSource, newSort: GridSortModel) => {
-    __ariaRowindex: number;
-    __dataRowindex: number;
-    __uuid: string;
-    height?: number;
-}[];
+export { sorting };
 export default VirtualHeader;

package/dist/components/virtualized/_hooks/useGridVirtualScroller.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import { default as React } from 'react';
 export declare const useGridVirtualScroller: () => {
     getRows: () => React.ReactNode[];
     getScrollerProps: () => {

package/dist/components/virtualized/_styled/index.d.ts

@@ -1,47 +1,47 @@
-import React from "react";
-export declare const RawTableRow: import("@emotion/styled").StyledComponent<any, {}, {
+import { default as React } from 'react';
+export declare const RawTableRow: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
 export declare const TableRow: React.NamedExoticComponent<any>;
-export declare const Skeleton: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const Skeleton: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const TableBody: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const TableBody: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const TableCell: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const TableCell: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const Input: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const Input: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const TableHeaderRoot: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const TableHeaderRoot: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const ResizeBox: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const ResizeBox: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const RightScrollBar: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const RightScrollBar: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const BottomScrollBar: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const BottomScrollBar: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const HeaderStyled: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const HeaderStyled: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const SortContentStyled: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const SortContentStyled: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const SortButton: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const SortButton: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const NoraDataGridStyled: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const NoraDataGridStyled: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const NoraDataGridBodyStyled: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const NoraDataGridBodyStyled: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;
-export declare const WatermarStyled: import("@emotion/styled").StyledComponent<any, {}, {
+export declare const WatermarStyled: import('@emotion/styled').StyledComponent<any, {}, {
     ref?: React.Ref<any> | undefined;
 }>;

package/dist/components/virtualized/_styled/virtualScrollerStyled.d.ts

@@ -1,6 +1,6 @@
-export declare const Scroller: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const Scroller: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;
-export declare const RenderZone: import("@emotion/styled").StyledComponent<any, {}, {
-    ref?: import("react").Ref<any> | undefined;
+export declare const RenderZone: import('@emotion/styled').StyledComponent<any, {}, {
+    ref?: import('react').Ref<any> | undefined;
 }>;

package/dist/components/virtualized/_utils/scrollPosition.d.ts

@@ -0,0 +1,2 @@
+export declare const clampScrollOffset: (value: number, max: number) => number;
+export declare const mapScrollOffset: (value: number, sourceMax: number, targetMax: number) => number;

package/dist/hooks/dimensions/gridDimensionsApi.d.ts

@@ -0,0 +1,4 @@
+export interface GridDimensions {
+    rowWidth: number;
+    rowHeight: number;
+}

package/dist/hooks/dimensions/index.d.ts

@@ -0,0 +1 @@
+export type { GridDimensions } from './gridDimensionsApi';

package/dist/hooks/dimensions/useGridDimensions.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { DataGridPrivateApi, GirdApiCommon } from '../../types/dataGridProps';
+export declare function useGridDimensions(apiRef: React.RefObject<GirdApiCommon<DataGridPrivateApi>>): void;

package/dist/hooks/external/useGridEditing.d.ts

@@ -0,0 +1,15 @@
+export declare function useGridEditing(): {
+    cellFocus: {
+        id: number;
+        field: string;
+    } | null;
+    currentEditingCell: {
+        [rowId: number]: {
+            rowId: number;
+            field: string;
+        };
+    };
+    startEdit: (rowId: number, fieldId: string) => void;
+    stopEdit: (rowId?: number, fieldId?: string) => void;
+    updateCellValue: (rowId: number, fieldId: string, value: any) => void;
+};

package/dist/hooks/external/useGridSelection.d.ts

@@ -0,0 +1,8 @@
+export declare function useGridSelection(): {
+    selectionList: string[];
+    selectionMode: "multiple" | "single";
+    setSelectionList: (nextSelectionList: string[]) => void;
+    clearSelection: () => void;
+    toggleRow: (rowUUID: string) => string[];
+    emitSelectionChange: (nextRows: any[], prevRows: any[]) => void;
+};

package/dist/hooks/external/useGridSort.d.ts

@@ -0,0 +1,7 @@
+import { GridSortModel } from '../../types/dataGridCoreProps';
+export declare function useGridSort(): {
+    sortModel: GridSortModel;
+    setSortModel: (nextSortModel: GridSortModel) => void;
+    toggleSort: (fieldId: string) => GridSortModel;
+    clearSort: () => void;
+};