sccoreui 5.9.85 → 5.9.87

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 (6) hide show
  1. package/dist/components/ag-grid/advancedFeature/hide-column.js +41 -22
  2. package/dist/components/ag-grid/helper.js +12 -1
  3. package/dist/components/ag-grid/parent-for-grid.js +5 -6
  4. package/dist/types/components/ag-grid/Types.d.ts +1 -0
  5. package/dist/types/components/ag-grid/helper.d.ts +1 -0
  6. package/package.json +1 -1
package/dist/components/ag-grid/advancedFeature/hide-column.js CHANGED
@@ -63,46 +63,65 @@ function HideColumn() {
63
63
  };
64
64
  // Return columns needs to hide
65
65
  const updateColumns = () => {
66
- const columnsToHide = storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.filter((col) => {
67
- return col.hasOwnProperty("checked") && !col.checked;
68
- });
69
- const updatedNodes = storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.map((node) => {
70
- if (node.hasOwnProperty("checked") && !node.checked) {
71
- node.unSelected = true;
72
- node.selected = false;
66
+ const columnsToHide = storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.filter((col) => col.hasOwnProperty("checked") && !col.checked);
67
+ const updatedNodes = storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.map((node, idx) => {
68
+ const newSeq = idx + 1;
69
+ if (node.seq !== newSeq) {
70
+ node.seq = newSeq;
73
71
  }
74
- else if (node.hasOwnProperty("checked") && node.checked) {
75
- node.selected = true;
76
- node.unSelected = false;
72
+ if (node.hasOwnProperty("checked")) {
73
+ node.selected = node.checked;
74
+ node.unSelected = !node.checked;
77
75
  }
78
76
  return node;
79
77
  });
80
78
  setNodes(updatedNodes);
81
79
  setStoreNodes(updatedNodes);
82
- hideColumns(columnsToHide);
80
+ hideColumns(columnsToHide, updatedNodes);
83
81
  setVisibleRight(false);
84
82
  };
85
83
  // Hide columns from grid
86
- const hideColumns = (columnsToHide) => {
84
+ const hideColumns = (columnsToHide, updatedSeq) => {
87
85
  if (!gridApi)
88
86
  return;
89
- // const columnDefs = gridApi.current!.api.getColumnDefs();
90
87
  const columnDefs = JSON.parse(JSON.stringify(gridData.columnData));
91
- // All columns containing flag to hide
92
88
  const updatedColumnDefs = columnDefs.map((colDef) => {
93
89
  const colToHide = columnsToHide.find((col) => col.id === colDef.id);
94
- if (colToHide) {
95
- colDef.hide = true; // or colDef.hide = !!colToHide.checked; if using checked property
96
- }
97
- else {
98
- colDef.hide = false; // ensure other columns are not hidden
90
+ colDef.hide = !!colToHide;
91
+ const updatedCol = updatedSeq.find((col) => col.id === colDef.id);
92
+ if (updatedCol) {
93
+ colDef.seq = updatedCol.seq;
99
94
  }
100
95
  return colDef;
101
96
  });
102
97
  updateColumnsForGrid(updatedColumnDefs);
103
- // gridApi.current!.api.setColumnDefs(updatedColumnDefs);
104
98
  };
105
- console.log(storeNodes, 'store nodes');
99
+ // When drag started
100
+ const handleDragStart = (index) => (event) => {
101
+ event.dataTransfer.setData("text/plain", index);
102
+ };
103
+ // When selected item dropped
104
+ const handleDrop = (index) => (event) => {
105
+ event.preventDefault();
106
+ const draggedIndex = event.dataTransfer.getData("text");
107
+ if (draggedIndex !== index.toString()) {
108
+ const updatedColumns = [...storeNodes];
109
+ const [draggedItem] = updatedColumns.splice(draggedIndex, 1);
110
+ console.log(draggedItem, 'dragged item', draggedIndex);
111
+ updatedColumns.splice(index, 0, draggedItem);
112
+ console.log(updatedColumns, draggedIndex, draggedItem, 'data of dragging');
113
+ for (let i = 0; i < updatedColumns.length; i++) {
114
+ const currentColumn = updatedColumns[i];
115
+ console.log(i, currentColumn, 'columns in loop');
116
+ }
117
+ setNodes(updatedColumns);
118
+ setStoreNodes(updatedColumns);
119
+ }
120
+ };
121
+ // When drag is completed
122
+ const handleDragOver = (event) => {
123
+ event.preventDefault();
124
+ };
106
125
  (0, react_1.useEffect)(() => {
107
126
  assignInitialValues();
108
127
  }, []);
@@ -125,7 +144,7 @@ function HideColumn() {
125
144
  searchHandler(e.target.value);
126
145
  }, disabled: false, placeholder: "Search by column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full" })] })) })), (0, jsx_runtime_1.jsxs)("p", Object.assign({ className: "py-2 my-0 text-gray-900 text-lg font-medium border-bottom-1 border-gray-200" }, { children: ["Selected Attributes", " ", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "text-gray-500 text-sm" }, { children: [nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.selected).length, "/", nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.unSelected || node.selected).length] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "w-full" }, { children: (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 &&
127
146
  (nodes === null || nodes === void 0 ? void 0 : nodes.map((listItem, idx) => (listItem === null || listItem === void 0 ? void 0 : listItem.visibleInPanel) &&
128
- (listItem === null || listItem === void 0 ? void 0 : listItem.selected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3" }, { children: [(0, jsx_runtime_1.jsx)("span", { children: listItem.headerName }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem === null || listItem === void 0 ? void 0 : listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), idx)))) })) })), (0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "mt-6 mb-0 pb-2 border-bottom-1 border-gray-200" }, { children: "Unselected Attributes" })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 &&
147
+ (listItem === null || listItem === void 0 ? void 0 : listItem.selected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3", draggable: true, onDragStart: handleDragStart(idx), onDrop: handleDrop(idx), onDragOver: handleDragOver }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ role: "img", "aria-label": "drag icon", className: "cursor-pointer" }, { children: "\uD83D\uDCE6" })), (0, jsx_runtime_1.jsx)("span", { children: listItem.headerName }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem === null || listItem === void 0 ? void 0 : listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), idx)))) })) })), (0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "mt-6 mb-0 pb-2 border-bottom-1 border-gray-200" }, { children: "Unselected Attributes" })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 &&
129
148
  (nodes === null || nodes === void 0 ? void 0 : nodes.map((listItem) => (listItem === null || listItem === void 0 ? void 0 : listItem.visibleInPanel) &&
130
149
  (listItem === null || listItem === void 0 ? void 0 : listItem.unSelected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3" }, { children: [(0, jsx_runtime_1.jsx)("span", { children: listItem.headerName }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), listItem.id)))) }))] }))] }))] }));
131
150
  }
package/dist/components/ag-grid/helper.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.parseIfNeeded = exports.applyDefaultFilters = void 0;
3
+ exports.sortColumns = exports.parseIfNeeded = exports.applyDefaultFilters = void 0;
4
4
  const applyDefaultFilters = (defaultFilters) => {
5
5
  console.log(defaultFilters, 'deafult filters');
6
6
  const filters = defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.map((item) => {
@@ -33,3 +33,14 @@ const parseIfNeeded = (value) => {
33
33
  }
34
34
  };
35
35
  exports.parseIfNeeded = parseIfNeeded;
36
+ const sortColumns = (columns) => {
37
+ const sortedColumns = columns === null || columns === void 0 ? void 0 : columns.sort((a, b) => {
38
+ if (!a.seq)
39
+ return 1;
40
+ if (!b.seq)
41
+ return -1;
42
+ return a.seq - b.seq;
43
+ });
44
+ return sortedColumns;
45
+ };
46
+ exports.sortColumns = sortColumns;
package/dist/components/ag-grid/parent-for-grid.js CHANGED
@@ -15,7 +15,7 @@ function ParentForGrid(props) {
15
15
  var _a, _b, _c, _d;
16
16
  const [gridData, setGridData] = (0, react_1.useState)({
17
17
  rowData: [],
18
- columnData: props === null || props === void 0 ? void 0 : props.columnData,
18
+ columnData: (0, helper_1.sortColumns)(props === null || props === void 0 ? void 0 : props.columnData)
19
19
  });
20
20
  const [style] = (0, react_1.useState)(props.style);
21
21
  const [api, setApi] = (0, react_1.useState)(null);
@@ -255,20 +255,19 @@ function ParentForGrid(props) {
255
255
  const existingColumns = (_a = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current.api) === null || _a === void 0 ? void 0 : _a.getColumnDefs();
256
256
  if (!(props === null || props === void 0 ? void 0 : props.columnData) || !existingColumns)
257
257
  return;
258
- const columnFromProps = props.columnData;
258
+ const columnFromProps = (0, helper_1.sortColumns)(props === null || props === void 0 ? void 0 : props.columnData);
259
259
  const updatedColumnDefs = existingColumns.map((colDef) => {
260
260
  columnFromProps.find((col) => {
261
261
  if (col.id === colDef.id) {
262
262
  colDef.hide = col.hide;
263
+ colDef.seq = col === null || col === void 0 ? void 0 : col.seq;
263
264
  }
264
265
  });
265
266
  return colDef;
266
267
  });
267
- console.log(updatedColumnDefs, 'updatedColumnDefs in use effect');
268
- // setGridData({...gridData})
269
- gridRef.current.api.setGridOption("columnDefs", updatedColumnDefs);
268
+ const reOrderedColumns = updatedColumnDefs.sort((a, b) => a.seq - b.seq);
269
+ gridRef.current.api.setGridOption("columnDefs", reOrderedColumns);
270
270
  }, [props === null || props === void 0 ? void 0 : props.columnData]);
271
- console.log(props === null || props === void 0 ? void 0 : props.columnData, gridData === null || gridData === void 0 ? void 0 : gridData.columnData, 'column from props and grid data');
272
271
  return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ style: { height: style.height, width: style.width }, className: "ag-grid-container border-1 border-gray-200 border-round" }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(context_provider_1.default, Object.assign({ value: {
273
272
  featureDetails,
274
273
  setFeatureDetails,
package/dist/types/components/ag-grid/Types.d.ts CHANGED
@@ -13,6 +13,7 @@ export interface ColumnDef extends ColDef {
13
13
  selectionType?: string;
14
14
  columnType?: string;
15
15
  visibleInPanel?: boolean;
16
+ seq?: number;
16
17
  }
17
18
  export interface ColHideShow extends ColumnDef {
18
19
  checked?: boolean;
package/dist/types/components/ag-grid/helper.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export declare const applyDefaultFilters: (defaultFilters: any) => any;
2
2
  export declare const parseIfNeeded: (value: any) => any;
3
+ export declare const sortColumns: (columns: any) => any;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sccoreui",
3
- "version": "5.9.85",
3
+ "version": "5.9.87",
4
4
  "description": "ui-sccore",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",