@noraent/nora-datagrid 0.0.7 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/lib/cjs/App.js +1 -1
  2. package/lib/cjs/buildPackage.json +1 -1
  3. package/lib/cjs/components/GridBasicRows.js +1 -1
  4. package/lib/cjs/components/TwoDimensionalVirtualizedList.js +3 -3
  5. package/lib/cjs/components/ime/IMEComponent.js +4 -1
  6. package/lib/cjs/provider/GridStoreContent.js +4 -9
  7. package/lib/cjs/types/dataGridProps.d.ts +2 -1
  8. package/lib/esm/App.js +1 -1
  9. package/lib/esm/buildPackage.json +1 -1
  10. package/lib/esm/components/GridBasicRows.js +1 -1
  11. package/lib/esm/components/TwoDimensionalVirtualizedList.js +3 -3
  12. package/lib/esm/components/ime/IMEComponent.js +4 -1
  13. package/lib/esm/provider/GridStoreContent.js +4 -9
  14. package/lib/esm/types/dataGridProps.d.ts +2 -1
  15. package/package.json +1 -1
package/lib/cjs/App.js CHANGED
@@ -3,7 +3,7 @@ import React from "react";
3
3
  import { DataGrid } from "./DataGrid";
4
4
  function App() {
5
5
  const ref = React.useRef(null);
6
- return (_jsxs(_Fragment, { children: [_jsx("button", { children: "dd" }), _jsx("button", { children: "dd" }), _jsx("div", { style: { width: "1200px", height: "100%", maxHeight: "600px" }, children: _jsx(DataGrid, { readOnly: true, gridRef: ref, columns: [
6
+ return (_jsxs(_Fragment, { children: [_jsx("button", { children: "dd" }), _jsx("button", { children: "dd" }), _jsx("div", { style: { width: "1200px", height: "100%", maxHeight: "600px" }, children: _jsx(DataGrid, { gridRef: ref, columns: [
7
7
  {
8
8
  fieldId: "firstName",
9
9
  fieldName: "코드",
package/lib/cjs/buildPackage.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@noraent/nora-datagrid",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "module": "./lib/esm/index.js",
5
5
  "main": "./lib/cjs/index.js",
6
6
  "private": false,
package/lib/cjs/components/GridBasicRows.js CHANGED
@@ -9,7 +9,7 @@ function GridBasicRows(props) {
9
9
  const ticking = React.useRef(false);
10
10
  const prevScrollTop = React.useRef(0); // 이전 스크롤 위치를 저장하는 Ref
11
11
  const [visibleRange, setVisibleRange] = React.useState({ start: 0, end: 0 });
12
- const [itemsData, setItemsData] = React.useState([]);
12
+ const [itemsData, _setItemsData] = React.useState([]);
13
13
  const visibleItems = React.useMemo(() => itemsData.slice(visibleRange.start, visibleRange.end + 1), [itemsData, visibleRange]);
14
14
  const totalHeight = React.useMemo(() => itemsData.reduce((sum, item) => sum + item.height, 0), [itemsData]);
15
15
  const getCumulativeHeight = React.useCallback((index) => {
package/lib/cjs/components/TwoDimensionalVirtualizedList.js CHANGED
@@ -299,8 +299,8 @@ export const TwoDimensionalVirtualizedList = React.memo(() => {
299
299
  // e.preventDefault();
300
300
  const colIndex = Number(cell.getAttribute("aria-colindex"));
301
301
  const rowIndex = Number(row.getAttribute("aria-rowindex"));
302
- const currentColIndex = gridRef.current.store.state.cellFocus[0];
303
- const currentRowIndex = gridRef.current.store.state.cellFocus[1];
302
+ // const currentColIndex = gridRef.current.store.state.cellFocus[0];
303
+ // const currentRowIndex = gridRef.current.store.state.cellFocus[1];
304
304
  // if (!(currentColIndex === rowIndex && currentRowIndex === colIndex)) {
305
305
  // // IME 문제가 있어 EditStatus.EDITING으로 변경
306
306
  // gridRef.current.setEditStatus(EditStatus.EDITABLE).then((editState) => {
@@ -318,7 +318,7 @@ export const TwoDimensionalVirtualizedList = React.memo(() => {
318
318
  if (gridRef.current.store.state.editStatus !== EditStatus.EDITING) {
319
319
  gridRef.current.setCellFocus(rowIndex, colIndex).then((res) => {
320
320
  store.setState(["state", "cellFocus"], res);
321
- gridRef.current.setEditStatus(EditStatus.IME_EDITING).then((editState) => {
321
+ gridRef.current.setEditStatus(EditStatus.IME_EDITING).then(() => {
322
322
  var _a;
323
323
  (_a = textAreaRef.current) === null || _a === void 0 ? void 0 : _a.focus(); // ime 활성화
324
324
  });
package/lib/cjs/components/ime/IMEComponent.js CHANGED
@@ -19,8 +19,11 @@ const IMEComponent = React.forwardRef((props, ref) => {
19
19
  }, []);
20
20
  const handleKeyDown = React.useCallback((e) => {
21
21
  var _a, _b, _c;
22
+ console.log("!!!!", e.key);
22
23
  if (gridRef.current.store.state.readOnly)
23
24
  return;
25
+ if (e.key === "Meta" || e.key === "Alt" || e.key === "Control" || e.key === "Shift" || e.key === "Tab")
26
+ return;
24
27
  if (e.nativeEvent.isComposing)
25
28
  return;
26
29
  if (e.key === "Enter") {
@@ -93,6 +96,6 @@ const IMEComponent = React.forwardRef((props, ref) => {
93
96
  currentRef.current.value = event.value;
94
97
  }
95
98
  }, [cellFocus, imeValue]);
96
- return (_jsx("textarea", { className: "ime-input", ref: ref, style: { position: "absolute", resize: "none", overflow: "hidden", background: "red" }, value: imeValue, onChange: handleValueChange, onKeyDown: handleKeyDown }));
99
+ return (_jsx("textarea", { className: "ime-input", ref: ref, style: { position: "absolute", resize: "none", overflow: "hidden", background: "red", top: `-${32000}px`, left: `-${32000}px` }, value: imeValue, onChange: handleValueChange, onKeyDown: handleKeyDown }));
97
100
  });
98
101
  export default React.memo(IMEComponent);
package/lib/cjs/provider/GridStoreContent.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
2
2
  import React, { createContext, useContext, useEffect } from "react";
3
- import { Store, } from "../types/dataGridProps";
3
+ import { Store } from "../types/dataGridProps";
4
4
  const StoreContext = createContext(null);
5
5
  export const GridStoreContentProvider = ({ children, value }) => {
6
6
  // const gridRef = useGridApiContext();
@@ -41,7 +41,7 @@ export const GridStoreContentProvider = ({ children, value }) => {
41
41
  // unsubscribeDataSource();
42
42
  // };
43
43
  // }, [gridRef]);
44
- return (_jsx(StoreContext.Provider, { value: new Store(value.current.store), children: children }));
44
+ return _jsx(StoreContext.Provider, { value: new Store(value.current.store), children: children });
45
45
  };
46
46
  export const useStore = () => {
47
47
  const store = useContext(StoreContext);
@@ -83,9 +83,7 @@ export const useSelector = (selector) => {
83
83
  const createPathProxy = (target, currentPath = []) => {
84
84
  return new Proxy(target, {
85
85
  get(obj, prop) {
86
- if (typeof prop === "symbol" ||
87
- prop === "toJSON" ||
88
- prop === "toString") {
86
+ if (typeof prop === "symbol" || prop === "toJSON" || prop === "toString") {
89
87
  return obj[prop];
90
88
  }
91
89
  const newPath = [...currentPath, prop];
@@ -126,10 +124,7 @@ export const useSelector = (selector) => {
126
124
  const isEqual = (a, b) => {
127
125
  if (a === b)
128
126
  return true;
129
- if (typeof a !== "object" ||
130
- a === null ||
131
- typeof b !== "object" ||
132
- b === null) {
127
+ if (typeof a !== "object" || a === null || typeof b !== "object" || b === null) {
133
128
  return false;
134
129
  }
135
130
  const keysA = Object.keys(a);
package/lib/cjs/types/dataGridProps.d.ts CHANGED
@@ -27,7 +27,7 @@ export interface DataGridBasicPropsModel {
27
27
  * @namespace NoraDataGrid.DataGridOptionPropsModel
28
28
  */
29
29
  export interface DataGridOptionPropsModel {
30
- gridRef: React.MutableRefObject<GirdApiCommon<DataGridPublicApi> | null> | null;
30
+ gridRef: React.RefObject<GirdApi> | undefined;
31
31
  /**
32
32
  * 포커스된 셀 정보를 담고 있습니다.
33
33
  * [ariaRowIndex, ariaColIndex]
@@ -129,6 +129,7 @@ export interface DataGridPublicApiModel {
129
129
  forceUpdate: () => void;
130
130
  }
131
131
  export type CommonApi = React.MutableRefObject<DataGridPrivateApi | null>;
132
+ export type GirdApi = GirdApiCommon<DataGridPrivateApi>;
132
133
  export interface GirdApiCommon<DataGridPrivateApi> extends DataGridPrivateApiModel {
133
134
  register: <V extends Visibility, T extends V extends "public" ? Partial<DataGridPublicApi> : Partial<DataGridPrivateApi>>(visibility: V, methods: T) => void;
134
135
  getPublicApi: () => DataGridPublicApi;
package/lib/esm/App.js CHANGED
@@ -3,7 +3,7 @@ import React from "react";
3
3
  import { DataGrid } from "./DataGrid";
4
4
  function App() {
5
5
  const ref = React.useRef(null);
6
- return (_jsxs(_Fragment, { children: [_jsx("button", { children: "dd" }), _jsx("button", { children: "dd" }), _jsx("div", { style: { width: "1200px", height: "100%", maxHeight: "600px" }, children: _jsx(DataGrid, { readOnly: true, gridRef: ref, columns: [
6
+ return (_jsxs(_Fragment, { children: [_jsx("button", { children: "dd" }), _jsx("button", { children: "dd" }), _jsx("div", { style: { width: "1200px", height: "100%", maxHeight: "600px" }, children: _jsx(DataGrid, { gridRef: ref, columns: [
7
7
  {
8
8
  fieldId: "firstName",
9
9
  fieldName: "코드",
package/lib/esm/buildPackage.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@noraent/nora-datagrid",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "module": "./lib/esm/index.js",
5
5
  "main": "./lib/cjs/index.js",
6
6
  "private": false,
package/lib/esm/components/GridBasicRows.js CHANGED
@@ -9,7 +9,7 @@ function GridBasicRows(props) {
9
9
  const ticking = React.useRef(false);
10
10
  const prevScrollTop = React.useRef(0); // 이전 스크롤 위치를 저장하는 Ref
11
11
  const [visibleRange, setVisibleRange] = React.useState({ start: 0, end: 0 });
12
- const [itemsData, setItemsData] = React.useState([]);
12
+ const [itemsData, _setItemsData] = React.useState([]);
13
13
  const visibleItems = React.useMemo(() => itemsData.slice(visibleRange.start, visibleRange.end + 1), [itemsData, visibleRange]);
14
14
  const totalHeight = React.useMemo(() => itemsData.reduce((sum, item) => sum + item.height, 0), [itemsData]);
15
15
  const getCumulativeHeight = React.useCallback((index) => {
package/lib/esm/components/TwoDimensionalVirtualizedList.js CHANGED
@@ -299,8 +299,8 @@ export const TwoDimensionalVirtualizedList = React.memo(() => {
299
299
  // e.preventDefault();
300
300
  const colIndex = Number(cell.getAttribute("aria-colindex"));
301
301
  const rowIndex = Number(row.getAttribute("aria-rowindex"));
302
- const currentColIndex = gridRef.current.store.state.cellFocus[0];
303
- const currentRowIndex = gridRef.current.store.state.cellFocus[1];
302
+ // const currentColIndex = gridRef.current.store.state.cellFocus[0];
303
+ // const currentRowIndex = gridRef.current.store.state.cellFocus[1];
304
304
  // if (!(currentColIndex === rowIndex && currentRowIndex === colIndex)) {
305
305
  // // IME 문제가 있어 EditStatus.EDITING으로 변경
306
306
  // gridRef.current.setEditStatus(EditStatus.EDITABLE).then((editState) => {
@@ -318,7 +318,7 @@ export const TwoDimensionalVirtualizedList = React.memo(() => {
318
318
  if (gridRef.current.store.state.editStatus !== EditStatus.EDITING) {
319
319
  gridRef.current.setCellFocus(rowIndex, colIndex).then((res) => {
320
320
  store.setState(["state", "cellFocus"], res);
321
- gridRef.current.setEditStatus(EditStatus.IME_EDITING).then((editState) => {
321
+ gridRef.current.setEditStatus(EditStatus.IME_EDITING).then(() => {
322
322
  var _a;
323
323
  (_a = textAreaRef.current) === null || _a === void 0 ? void 0 : _a.focus(); // ime 활성화
324
324
  });
package/lib/esm/components/ime/IMEComponent.js CHANGED
@@ -19,8 +19,11 @@ const IMEComponent = React.forwardRef((props, ref) => {
19
19
  }, []);
20
20
  const handleKeyDown = React.useCallback((e) => {
21
21
  var _a, _b, _c;
22
+ console.log("!!!!", e.key);
22
23
  if (gridRef.current.store.state.readOnly)
23
24
  return;
25
+ if (e.key === "Meta" || e.key === "Alt" || e.key === "Control" || e.key === "Shift" || e.key === "Tab")
26
+ return;
24
27
  if (e.nativeEvent.isComposing)
25
28
  return;
26
29
  if (e.key === "Enter") {
@@ -93,6 +96,6 @@ const IMEComponent = React.forwardRef((props, ref) => {
93
96
  currentRef.current.value = event.value;
94
97
  }
95
98
  }, [cellFocus, imeValue]);
96
- return (_jsx("textarea", { className: "ime-input", ref: ref, style: { position: "absolute", resize: "none", overflow: "hidden", background: "red" }, value: imeValue, onChange: handleValueChange, onKeyDown: handleKeyDown }));
99
+ return (_jsx("textarea", { className: "ime-input", ref: ref, style: { position: "absolute", resize: "none", overflow: "hidden", background: "red", top: `-${32000}px`, left: `-${32000}px` }, value: imeValue, onChange: handleValueChange, onKeyDown: handleKeyDown }));
97
100
  });
98
101
  export default React.memo(IMEComponent);
package/lib/esm/provider/GridStoreContent.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
2
2
  import React, { createContext, useContext, useEffect } from "react";
3
- import { Store, } from "../types/dataGridProps";
3
+ import { Store } from "../types/dataGridProps";
4
4
  const StoreContext = createContext(null);
5
5
  export const GridStoreContentProvider = ({ children, value }) => {
6
6
  // const gridRef = useGridApiContext();
@@ -41,7 +41,7 @@ export const GridStoreContentProvider = ({ children, value }) => {
41
41
  // unsubscribeDataSource();
42
42
  // };
43
43
  // }, [gridRef]);
44
- return (_jsx(StoreContext.Provider, { value: new Store(value.current.store), children: children }));
44
+ return _jsx(StoreContext.Provider, { value: new Store(value.current.store), children: children });
45
45
  };
46
46
  export const useStore = () => {
47
47
  const store = useContext(StoreContext);
@@ -83,9 +83,7 @@ export const useSelector = (selector) => {
83
83
  const createPathProxy = (target, currentPath = []) => {
84
84
  return new Proxy(target, {
85
85
  get(obj, prop) {
86
- if (typeof prop === "symbol" ||
87
- prop === "toJSON" ||
88
- prop === "toString") {
86
+ if (typeof prop === "symbol" || prop === "toJSON" || prop === "toString") {
89
87
  return obj[prop];
90
88
  }
91
89
  const newPath = [...currentPath, prop];
@@ -126,10 +124,7 @@ export const useSelector = (selector) => {
126
124
  const isEqual = (a, b) => {
127
125
  if (a === b)
128
126
  return true;
129
- if (typeof a !== "object" ||
130
- a === null ||
131
- typeof b !== "object" ||
132
- b === null) {
127
+ if (typeof a !== "object" || a === null || typeof b !== "object" || b === null) {
133
128
  return false;
134
129
  }
135
130
  const keysA = Object.keys(a);
package/lib/esm/types/dataGridProps.d.ts CHANGED
@@ -27,7 +27,7 @@ export interface DataGridBasicPropsModel {
27
27
  * @namespace NoraDataGrid.DataGridOptionPropsModel
28
28
  */
29
29
  export interface DataGridOptionPropsModel {
30
- gridRef: React.MutableRefObject<GirdApiCommon<DataGridPublicApi> | null> | null;
30
+ gridRef: React.RefObject<GirdApi> | undefined;
31
31
  /**
32
32
  * 포커스된 셀 정보를 담고 있습니다.
33
33
  * [ariaRowIndex, ariaColIndex]
@@ -129,6 +129,7 @@ export interface DataGridPublicApiModel {
129
129
  forceUpdate: () => void;
130
130
  }
131
131
  export type CommonApi = React.MutableRefObject<DataGridPrivateApi | null>;
132
+ export type GirdApi = GirdApiCommon<DataGridPrivateApi>;
132
133
  export interface GirdApiCommon<DataGridPrivateApi> extends DataGridPrivateApiModel {
133
134
  register: <V extends Visibility, T extends V extends "public" ? Partial<DataGridPublicApi> : Partial<DataGridPrivateApi>>(visibility: V, methods: T) => void;
134
135
  getPublicApi: () => DataGridPublicApi;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@noraent/nora-datagrid",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "module": "./lib/esm/index.js",
5
5
  "main": "./lib/cjs/index.js",
6
6
  "private": false,