@noraent/nora-datagrid 0.0.1

package/lib/esm/types/dataGridProps.d.ts

@@ -0,0 +1,148 @@
+import { EditStatus } from "./dataGridCoreEnum";
+import { CellRangeDef, CellRangeTempDef, DataGridColumns, DataGridDataSource, DataGridPrivateDataSourceModel, DeepOmitStartsWith } from "./dataGridCoreProps";
+export default DataGridBasicProps;
+/**
+ * DataGrid를 구성하는 Props 입니다.
+ * 데이터 그리드에서 사용되는 모든 속성 및 구성 요소를 관리합니다
+ * @version 0.0.1
+ * @public
+ * @namespace NoraDataGrid.DataGridBasicProps
+ */
+export type DataGridBasicProps = DeepOmitStartsWith<Pick<DataGridBasicPropsModel, "columns" | "dataSource">, "__"> & Partial<DataGridOptionPropsModel>;
+export type DataGridBasicPropsModelDef = DataGridBasicPropsModel;
+/**
+ * DataGrid를 구성하는 기본 소모품 구조 입니다.
+ * 데이터 그리드에서 사용되는 기본적인 속성을 관리합니다
+ * @private
+ * @namespace NoraDataGrid.DataGridBasicPropsModel
+ */
+export interface DataGridBasicPropsModel {
+    columns: DataGridColumns;
+    dataSource: DataGridDataSource;
+}
+/**
+ * DataGrid를 구성하는 부가적인 소모품 구조 입니다.
+ * 데이터 그리드에서 사용되는 부가적인 속성을 관리합니다.
+ * @private
+ * @namespace NoraDataGrid.DataGridOptionPropsModel
+ */
+export interface DataGridOptionPropsModel {
+    gridRef: React.MutableRefObject<GirdApiCommon<DataGridPublicApi> | null> | null;
+    /**
+     * 포커스된 셀 정보를 담고 있습니다.
+     * [ariaRowIndex, ariaColIndex]
+     */
+    cellFocus: Array<number | undefined>;
+    /**
+     * 현재 렌더링된 행의 범위 시작과 끝을 나타냅니다.
+     * [startRowIndex, endRowIndex]
+     */
+    renderedRowStartEnd: Array<number> | null;
+    /**
+     * 현재 포커스된 셀의 수정 상태를 담고 있습니다.
+     */
+    editStatus: EditStatus;
+}
+/**
+ * 데이터 그리드 내부에서 사용되는 속성을 관리합니다
+ * @private
+ * @namespace NoraDataGrid.DataGridBasicStorePropsModel
+ */
+interface DataGridBasicStorePropsModel {
+    gridContainer: React.RefObject<HTMLDivElement>;
+    __cellRange: Array<CellRangeDef>;
+    __cellRangeTemp: CellRangeTempDef;
+}
+/**
+ * DataGrid를 구성하는 내부 메소드들을 관리 합니다.
+ * @private
+ * @namespace NoraDataGrid.DataGridPrivateApi
+ */
+export type DataGridPrivateApi = DataGridPrivateApiModel;
+export type DataGridPublicApi = DataGridPublicApiModel;
+/**
+ * 데이터 그리드 개발을 위해 사용되는 내부 API를 관리 합니다.
+ * @private
+ * @namespace NoraDataGrid.DataGridPrivateApiModel
+ */
+export interface DataGridPrivateApiModel {
+    setText: () => void;
+    /**
+     *
+     * @private
+     * @param ref
+     * @namespace NoraDataGrid.DataGridPrivateApiModel.setGridContainer
+     */
+    setGridContainer: (ref: React.RefObject<HTMLDivElement>) => void;
+    /**
+     * 스토어 공간을 생성합니다.
+     * @private
+     * @param props DataGridBasicProps
+     * @namespace NoraDataGrid.DataGridPrivateApiModel.setInitialStore
+     */
+    setInitialStore: (props: DataGridBasicProps) => any;
+    /**
+     * 데이터 그리드에서 사용되는 기본적인 속성을 설정합니다.
+     * @private
+     * @namespace NoraDataGrid.DataGridPrivateApiModel.setBasicProps
+     */
+    setBasicProps: (props: DataGridBasicProps) => DataGridStoreDef["state"];
+    /**
+     * 특정 행(row)의 위치로 스크롤을 이동합니다.
+     * @private
+     * @namespace NoraDataGrid.DataGridPrivateApiModel.scrollToRowIndex
+     */
+    scrollToRowIndex: (rowIndex: number) => void;
+    /**
+     * 선택할 셀의 범위를 추가하는동안 임시 공간에 추가합니다.
+     * @param cellRange
+     * @returns
+     */
+    addCellRangeTemp: (cellRange: CellRangeTempDef) => void;
+    /**
+     * 셀 포커스를 지정합니다.
+     * @returns
+     */
+    setCellFocus: (rowIndex: number | undefined, colIndex: number | undefined) => Promise<DataGridStoreDef["state"]["cellFocus"]>;
+    /**
+     * 셀 포커스를 가져옵니다.
+     */
+    getCellFocus: () => DataGridStoreDef["state"]["cellFocus"];
+    /**
+     * 셀 모드를 변경합니다.
+     */
+    setEditStatus: (editStatus: DataGridStoreDef["state"]["editStatus"]) => Promise<DataGridStoreDef["state"]["editStatus"]>;
+    cellByRowIndex: (rowIndex: number, fieldId: keyof DataGridPrivateDataSourceModel, value: string | number | undefined) => Promise<DataGridStoreDef["state"]["dataSource"]>;
+}
+export interface DataGridPublicApiModel {
+    setTextPublic: (data: any) => void;
+    /**
+     * 선택할 셀의 범위를 추가합니다.
+     * @param cellRange
+     * @returns
+     */
+    addCellRange: (cellRange: CellRangeDef) => void;
+    forceUpdate: () => void;
+}
+export type CommonApi = React.MutableRefObject<DataGridPrivateApi | null>;
+export interface GirdApiCommon<DataGridPrivateApi> extends DataGridPrivateApiModel {
+    register: <V extends Visibility, T extends V extends "public" ? Partial<DataGridPublicApi> : Partial<DataGridPrivateApi>>(visibility: V, methods: T) => void;
+    getPublicApi: () => DataGridPublicApi;
+    store: DataGridStoreDef;
+}
+export declare class Store<T> {
+    private state;
+    private listeners;
+    constructor(initialState: T);
+    getState(): T;
+    setState<K extends keyof T>(path: K | [K, ...string[]], value: any, isUpdate?: boolean): void;
+    subscribe(path: string[], callback: Function): () => void;
+    private notify;
+    private updateNestedState;
+    private isPathAffected;
+}
+export interface DataGridStoreDef extends DataGridBasicStorePropsModel {
+    original: DataGridBasicPropsModel & DataGridOptionPropsModel;
+    state: DataGridBasicPropsModel & DataGridOptionPropsModel;
+}
+export type Visibility = "public" | "private";

package/lib/esm/types/dataGridProps.js

@@ -0,0 +1,54 @@
+export class Store {
+    constructor(initialState) {
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "listeners", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        this.state = initialState;
+    }
+    getState() {
+        return this.state;
+    }
+    setState(path, value, isUpdate) {
+        const fullPath = Array.isArray(path) ? path.map(String) : [String(path)];
+        this.state = this.updateNestedState(this.state, fullPath, value);
+        this.notify(fullPath, isUpdate);
+    }
+    subscribe(path, callback) {
+        const listener = { path, callback };
+        this.listeners.push(listener);
+        return () => {
+            this.listeners = this.listeners.filter((l) => l !== listener);
+        };
+    }
+    notify(changedPath, isUpdate) {
+        this.listeners.forEach(({ path, callback }) => {
+            if (this.isPathAffected(path, changedPath)) {
+                if (isUpdate === undefined || isUpdate)
+                    callback();
+            }
+        });
+    }
+    updateNestedState(obj, path, value) {
+        if (path.length === 0)
+            return value;
+        const [key, ...rest] = path;
+        return Object.assign(Object.assign({}, obj), { [key]: rest.length > 0 ? this.updateNestedState(obj[key], rest, value) : value });
+    }
+    // 경로 비교 로직 개선
+    isPathAffected(listenerPath, changedPath) {
+        // 전체 경로가 정확히 일치하는 경우에만 true 반환
+        if (listenerPath.length !== changedPath.length) {
+            return false;
+        }
+        return listenerPath.every((segment, index) => segment === changedPath[index]);
+    }
+}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@noraent/nora-datagrid",
+  "version": "0.0.1",
+  "module": "./lib/esm/index.js",
+  "main": "./lib/cjs/index.js",
+  "private": false,
+  "files": [
+    "lib/"
+  ],
+  "type": "module",
+  "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": "jest",
+    "tsc-build": "tsc -p tsconfig-esm.json && tsc -p tsconfig-cjs.json",
+    "publish:npm": "rm -rf dist && mkdir dist && babel src -d dist --copy-files && 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"
+  },
+  "dependencies": {
+    "@emotion/css": "^11.13.4",
+    "@emotion/react": "^11.13.3",
+    "@emotion/styled": "^11.13.0",
+    "@noraent/nora-datagrid": "file:",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "rimraf": "^6.0.1",
+    "sass-embedded": "^1.79.4",
+    "vite-plugin-svgr": "^4.2.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.26.4",
+    "@babel/preset-react": "^7.26.3",
+    "@eslint/js": "^9.9.0",
+    "@types/lodash": "^4.17.16",
+    "@types/node": "^22.5.4",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "eslint": "^9.9.0",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.9",
+    "globals": "^15.9.0",
+    "typescript": "^5.5.3",
+    "typescript-eslint": "^8.0.1",
+    "vite": "^5.4.1"
+  },
+  "babel": {
+    "presets": [
+      "@babel/preset-env",
+      "@babel/preset-react"
+    ]
+  }
+}