@stonecrop/atable 0.4.24 → 0.4.25

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 (10) hide show
  1. package/dist/atable.d.ts +13 -67
  2. package/dist/atable.js +885 -851
  3. package/dist/atable.js.map +1 -1
  4. package/dist/atable.umd.cjs +2 -2
  5. package/dist/atable.umd.cjs.map +1 -1
  6. package/dist/src/stores/table.d.ts +12 -67
  7. package/dist/src/stores/table.d.ts.map +1 -1
  8. package/dist/stores/table.js +81 -34
  9. package/package.json +3 -3
  10. package/src/stores/table.ts +91 -39
package/dist/src/stores/table.d.ts CHANGED
@@ -11,10 +11,6 @@ export declare const createTableStore: (initData: {
11
11
  rows: TableRow[];
12
12
  id?: string;
13
13
  config?: TableConfig;
14
- table?: {
15
- [key: string]: any;
16
- };
17
- display?: TableDisplay[];
18
14
  modal?: TableModal;
19
15
  }) => import("pinia").Store<`table-${string}`, Pick<{
20
16
  columns: import("vue").Ref<{
@@ -117,25 +113,7 @@ export declare const createTableStore: (initData: {
117
113
  } | undefined;
118
114
  label?: string | undefined;
119
115
  }[]>;
120
- display: import("vue").Ref<{
121
- expanded?: boolean | undefined;
122
- childrenOpen?: boolean | undefined;
123
- isParent?: boolean | undefined;
124
- isRoot?: boolean | undefined;
125
- open?: boolean | undefined;
126
- indent?: number | undefined;
127
- parent?: number | undefined;
128
- rowModified?: boolean | undefined;
129
- }[], TableDisplay[] | {
130
- expanded?: boolean | undefined;
131
- childrenOpen?: boolean | undefined;
132
- isParent?: boolean | undefined;
133
- isRoot?: boolean | undefined;
134
- open?: boolean | undefined;
135
- indent?: number | undefined;
136
- parent?: number | undefined;
137
- rowModified?: boolean | undefined;
138
- }[]>;
116
+ display: import("vue").WritableComputedRef<TableDisplay[], TableDisplay[]>;
139
117
  ganttBars: import("vue").Ref<{
140
118
  id: string;
141
119
  rowIndex: number;
@@ -207,7 +185,7 @@ export declare const createTableStore: (initData: {
207
185
  colspan?: number | undefined;
208
186
  } | undefined;
209
187
  }[]>;
210
- table: import("vue").Ref<{}, {}>;
188
+ table: import("vue").ComputedRef<{}>;
211
189
  updates: import("vue").Ref<Record<string, string>, Record<string, string>>;
212
190
  hasPinnedColumns: import("vue").ComputedRef<boolean>;
213
191
  isGanttView: import("vue").ComputedRef<boolean>;
@@ -265,7 +243,8 @@ export declare const createTableStore: (initData: {
265
243
  unregisterConnectionHandle: (handleId: string) => void;
266
244
  unregisterGanttBar: (barId: string) => void;
267
245
  updateGanttBar: (event: GanttDragEvent) => void;
268
- }, "columns" | "config" | "connectionHandles" | "connectionPaths" | "display" | "ganttBars" | "modal" | "rows" | "table" | "updates">, Pick<{
246
+ updateRows: (newRows: TableRow[]) => void;
247
+ }, "columns" | "config" | "connectionHandles" | "connectionPaths" | "ganttBars" | "modal" | "rows" | "updates">, Pick<{
269
248
  columns: import("vue").Ref<{
270
249
  name: string;
271
250
  align?: CanvasTextAlign | undefined;
@@ -366,25 +345,7 @@ export declare const createTableStore: (initData: {
366
345
  } | undefined;
367
346
  label?: string | undefined;
368
347
  }[]>;
369
- display: import("vue").Ref<{
370
- expanded?: boolean | undefined;
371
- childrenOpen?: boolean | undefined;
372
- isParent?: boolean | undefined;
373
- isRoot?: boolean | undefined;
374
- open?: boolean | undefined;
375
- indent?: number | undefined;
376
- parent?: number | undefined;
377
- rowModified?: boolean | undefined;
378
- }[], TableDisplay[] | {
379
- expanded?: boolean | undefined;
380
- childrenOpen?: boolean | undefined;
381
- isParent?: boolean | undefined;
382
- isRoot?: boolean | undefined;
383
- open?: boolean | undefined;
384
- indent?: number | undefined;
385
- parent?: number | undefined;
386
- rowModified?: boolean | undefined;
387
- }[]>;
348
+ display: import("vue").WritableComputedRef<TableDisplay[], TableDisplay[]>;
388
349
  ganttBars: import("vue").Ref<{
389
350
  id: string;
390
351
  rowIndex: number;
@@ -456,7 +417,7 @@ export declare const createTableStore: (initData: {
456
417
  colspan?: number | undefined;
457
418
  } | undefined;
458
419
  }[]>;
459
- table: import("vue").Ref<{}, {}>;
420
+ table: import("vue").ComputedRef<{}>;
460
421
  updates: import("vue").Ref<Record<string, string>, Record<string, string>>;
461
422
  hasPinnedColumns: import("vue").ComputedRef<boolean>;
462
423
  isGanttView: import("vue").ComputedRef<boolean>;
@@ -514,7 +475,8 @@ export declare const createTableStore: (initData: {
514
475
  unregisterConnectionHandle: (handleId: string) => void;
515
476
  unregisterGanttBar: (barId: string) => void;
516
477
  updateGanttBar: (event: GanttDragEvent) => void;
517
- }, "hasPinnedColumns" | "isGanttView" | "isTreeView" | "numberedRowWidth" | "zeroColumn">, Pick<{
478
+ updateRows: (newRows: TableRow[]) => void;
479
+ }, "display" | "table" | "hasPinnedColumns" | "isGanttView" | "isTreeView" | "numberedRowWidth" | "zeroColumn">, Pick<{
518
480
  columns: import("vue").Ref<{
519
481
  name: string;
520
482
  align?: CanvasTextAlign | undefined;
@@ -615,25 +577,7 @@ export declare const createTableStore: (initData: {
615
577
  } | undefined;
616
578
  label?: string | undefined;
617
579
  }[]>;
618
- display: import("vue").Ref<{
619
- expanded?: boolean | undefined;
620
- childrenOpen?: boolean | undefined;
621
- isParent?: boolean | undefined;
622
- isRoot?: boolean | undefined;
623
- open?: boolean | undefined;
624
- indent?: number | undefined;
625
- parent?: number | undefined;
626
- rowModified?: boolean | undefined;
627
- }[], TableDisplay[] | {
628
- expanded?: boolean | undefined;
629
- childrenOpen?: boolean | undefined;
630
- isParent?: boolean | undefined;
631
- isRoot?: boolean | undefined;
632
- open?: boolean | undefined;
633
- indent?: number | undefined;
634
- parent?: number | undefined;
635
- rowModified?: boolean | undefined;
636
- }[]>;
580
+ display: import("vue").WritableComputedRef<TableDisplay[], TableDisplay[]>;
637
581
  ganttBars: import("vue").Ref<{
638
582
  id: string;
639
583
  rowIndex: number;
@@ -705,7 +649,7 @@ export declare const createTableStore: (initData: {
705
649
  colspan?: number | undefined;
706
650
  } | undefined;
707
651
  }[]>;
708
- table: import("vue").Ref<{}, {}>;
652
+ table: import("vue").ComputedRef<{}>;
709
653
  updates: import("vue").Ref<Record<string, string>, Record<string, string>>;
710
654
  hasPinnedColumns: import("vue").ComputedRef<boolean>;
711
655
  isGanttView: import("vue").ComputedRef<boolean>;
@@ -763,5 +707,6 @@ export declare const createTableStore: (initData: {
763
707
  unregisterConnectionHandle: (handleId: string) => void;
764
708
  unregisterGanttBar: (barId: string) => void;
765
709
  updateGanttBar: (event: GanttDragEvent) => void;
766
- }, "closeModal" | "createConnection" | "deleteConnection" | "getCellData" | "getCellDisplayValue" | "getConnectionsForBar" | "getFormattedValue" | "getHandlesForBar" | "getHeaderCellStyle" | "getIndent" | "getRowExpandSymbol" | "isRowGantt" | "isRowVisible" | "registerConnectionHandle" | "registerGanttBar" | "resizeColumn" | "setCellData" | "setCellText" | "toggleRowExpand" | "unregisterConnectionHandle" | "unregisterGanttBar" | "updateGanttBar">>;
710
+ updateRows: (newRows: TableRow[]) => void;
711
+ }, "closeModal" | "createConnection" | "deleteConnection" | "getCellData" | "getCellDisplayValue" | "getConnectionsForBar" | "getFormattedValue" | "getHandlesForBar" | "getHeaderCellStyle" | "getIndent" | "getRowExpandSymbol" | "isRowGantt" | "isRowVisible" | "registerConnectionHandle" | "registerGanttBar" | "resizeColumn" | "setCellData" | "setCellText" | "toggleRowExpand" | "unregisterConnectionHandle" | "unregisterGanttBar" | "updateGanttBar" | "updateRows">>;
767
712
  //# sourceMappingURL=table.d.ts.map
package/dist/src/stores/table.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/stores/table.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/stores/table.ts"],"names":[],"mappings":"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"}
package/dist/stores/table.js CHANGED
@@ -10,28 +10,8 @@ import { generateHash } from '../utils';
10
10
  export const createTableStore = (initData) => {
11
11
  const id = initData.id || generateHash();
12
12
  const createStore = defineStore(`table-${id}`, () => {
13
- // util functions
14
- const createTableObject = () => {
15
- const table = {};
16
- for (const [colIndex, column] of columns.value.entries()) {
17
- for (const [rowIndex, row] of rows.value.entries()) {
18
- table[`${colIndex}:${rowIndex}`] = row[column.name];
19
- }
20
- }
21
- return table;
22
- };
23
- const createDisplayObject = (display) => {
13
+ const createDisplayObject = () => {
24
14
  const defaultDisplay = [Object.assign({}, { rowModified: false })];
25
- // TODO: (typing) what is the type of `display` here?
26
- if (display) {
27
- if ('0:0' in display) {
28
- return display;
29
- }
30
- // else if ('default' in display) {
31
- // // TODO: (typing) what is the possible input here for 'default'?
32
- // defaultDisplay = display.default
33
- // }
34
- }
35
15
  // TODO: (typing) is this type correct for the parent set?
36
16
  const parents = new Set();
37
17
  for (let rowIndex = 0; rowIndex < rows.value.length; rowIndex++) {
@@ -59,8 +39,57 @@ export const createTableStore = (initData) => {
59
39
  const columns = ref(initData.columns);
60
40
  const rows = ref(initData.rows);
61
41
  const config = ref(initData.config || {});
62
- const table = ref(initData.table || createTableObject());
63
- const display = ref(createDisplayObject(initData.display));
42
+ // Track row modifications and expand states separately from the computed display
43
+ const rowModifications = ref({});
44
+ const rowExpandStates = ref({});
45
+ const table = computed(() => {
46
+ const table = {};
47
+ for (const [colIndex, column] of columns.value.entries()) {
48
+ for (const [rowIndex, row] of rows.value.entries()) {
49
+ table[`${colIndex}:${rowIndex}`] = row[column.name];
50
+ }
51
+ }
52
+ return table;
53
+ });
54
+ const display = computed({
55
+ get: () => {
56
+ const baseDisplay = createDisplayObject();
57
+ // Apply persistent modifications and expand states
58
+ for (let i = 0; i < baseDisplay.length; i++) {
59
+ if (rowModifications.value[i]) {
60
+ baseDisplay[i].rowModified = rowModifications.value[i];
61
+ }
62
+ if (rowExpandStates.value[i]) {
63
+ if (rowExpandStates.value[i].childrenOpen !== undefined) {
64
+ baseDisplay[i].childrenOpen = rowExpandStates.value[i].childrenOpen;
65
+ }
66
+ if (rowExpandStates.value[i].expanded !== undefined) {
67
+ baseDisplay[i].expanded = rowExpandStates.value[i].expanded;
68
+ }
69
+ }
70
+ }
71
+ // Calculate 'open' property for tree view based on parent's childrenOpen state
72
+ if (isTreeView.value) {
73
+ for (let i = 0; i < baseDisplay.length; i++) {
74
+ const row = baseDisplay[i];
75
+ if (!row.isRoot && row.parent !== null && row.parent !== undefined) {
76
+ // Child row is 'open' if its parent's childrenOpen is true
77
+ const parentIndex = row.parent;
78
+ if (parentIndex >= 0 && parentIndex < baseDisplay.length) {
79
+ baseDisplay[i].open = baseDisplay[parentIndex].childrenOpen || false;
80
+ }
81
+ }
82
+ }
83
+ }
84
+ return baseDisplay;
85
+ },
86
+ set: (newDisplay) => {
87
+ // Only update if the new display is different from the current one; also avoids recursive updates
88
+ if (JSON.stringify(newDisplay) !== JSON.stringify(display.value)) {
89
+ display.value = newDisplay;
90
+ }
91
+ },
92
+ });
64
93
  const modal = ref(initData.modal || { visible: false });
65
94
  const updates = ref({});
66
95
  const ganttBars = ref([]);
@@ -81,7 +110,7 @@ export const createTableStore = (initData) => {
81
110
  const index = `${colIndex}:${rowIndex}`;
82
111
  const col = columns.value[colIndex];
83
112
  if (table.value[index] !== value) {
84
- display.value[rowIndex].rowModified = true;
113
+ rowModifications.value[rowIndex] = true;
85
114
  }
86
115
  table.value[index] = value;
87
116
  // Create a new row object to ensure reactivity
@@ -90,10 +119,13 @@ export const createTableStore = (initData) => {
90
119
  [col.name]: value,
91
120
  };
92
121
  };
122
+ const updateRows = (newRows) => {
123
+ rows.value = newRows;
124
+ };
93
125
  const setCellText = (colIndex, rowIndex, value) => {
94
126
  const index = `${colIndex}:${rowIndex}`;
95
127
  if (table.value[index] !== value) {
96
- display.value[rowIndex].rowModified = true;
128
+ rowModifications.value[rowIndex] = true;
97
129
  updates.value[index] = value;
98
130
  }
99
131
  };
@@ -143,21 +175,34 @@ export const createTableStore = (initData) => {
143
175
  };
144
176
  const toggleRowExpand = (rowIndex) => {
145
177
  if (isTreeView.value) {
146
- display.value[rowIndex].childrenOpen = !display.value[rowIndex].childrenOpen;
147
- const isOpen = display.value[rowIndex].childrenOpen;
148
- for (let index = 0; index < rows.value.length; index++) {
149
- if (display.value[index].parent === rowIndex) {
150
- display.value[index].open = isOpen;
151
- if (!isOpen) {
152
- // If we're closing, also close any children recursively
153
- display.value[index].childrenOpen = false;
178
+ const currentState = rowExpandStates.value[rowIndex] || {};
179
+ const currentChildrenOpen = currentState.childrenOpen ?? display.value[rowIndex].childrenOpen;
180
+ const newChildrenOpen = !currentChildrenOpen;
181
+ rowExpandStates.value[rowIndex] = {
182
+ ...currentState,
183
+ childrenOpen: newChildrenOpen,
184
+ };
185
+ // If we're closing, recursively close all descendant nodes
186
+ if (!newChildrenOpen) {
187
+ for (let index = 0; index < rows.value.length; index++) {
188
+ if (display.value[index].parent === rowIndex) {
189
+ const childState = rowExpandStates.value[index] || {};
190
+ rowExpandStates.value[index] = {
191
+ ...childState,
192
+ childrenOpen: false,
193
+ };
154
194
  toggleRowExpand(index);
155
195
  }
156
196
  }
157
197
  }
158
198
  }
159
199
  else if (config.value.view === 'list-expansion') {
160
- display.value[rowIndex].expanded = !display.value[rowIndex].expanded;
200
+ const currentState = rowExpandStates.value[rowIndex] || {};
201
+ const currentExpanded = currentState.expanded ?? display.value[rowIndex].expanded;
202
+ rowExpandStates.value[rowIndex] = {
203
+ ...currentState,
204
+ expanded: !currentExpanded,
205
+ };
161
206
  }
162
207
  };
163
208
  const getCellDisplayValue = (colIndex, rowIndex) => {
@@ -263,6 +308,7 @@ export const createTableStore = (initData) => {
263
308
  const fromHandle = connectionHandles.value.find(h => h.id === fromHandleId);
264
309
  const toHandle = connectionHandles.value.find(h => h.id === toHandleId);
265
310
  if (!fromHandle || !toHandle) {
311
+ // eslint-disable-next-line no-console
266
312
  console.warn('Cannot create connection: handle not found');
267
313
  return null;
268
314
  }
@@ -337,6 +383,7 @@ export const createTableStore = (initData) => {
337
383
  unregisterConnectionHandle,
338
384
  unregisterGanttBar,
339
385
  updateGanttBar,
386
+ updateRows,
340
387
  };
341
388
  });
342
389
  return createStore();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stonecrop/atable",
3
- "version": "0.4.24",
3
+ "version": "0.4.25",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "author": {
@@ -38,8 +38,8 @@
38
38
  "@vueuse/core": "^13.4.0",
39
39
  "pinia": "^3.0.3",
40
40
  "vue": "^3.5.17",
41
- "@stonecrop/themes": "0.4.24",
42
- "@stonecrop/utilities": "0.4.24"
41
+ "@stonecrop/utilities": "0.4.25",
42
+ "@stonecrop/themes": "0.4.25"
43
43
  },
44
44
  "devDependencies": {
45
45
  "@microsoft/api-documenter": "^7.26.29",
package/src/stores/table.ts CHANGED
@@ -26,37 +26,13 @@ export const createTableStore = (initData: {
26
26
  rows: TableRow[]
27
27
  id?: string
28
28
  config?: TableConfig
29
- table?: { [key: string]: any }
30
- display?: TableDisplay[]
31
29
  modal?: TableModal
32
30
  }) => {
33
31
  const id = initData.id || generateHash()
34
32
  const createStore = defineStore(`table-${id}`, () => {
35
- // util functions
36
- const createTableObject = () => {
37
- const table = {}
38
- for (const [colIndex, column] of columns.value.entries()) {
39
- for (const [rowIndex, row] of rows.value.entries()) {
40
- table[`${colIndex}:${rowIndex}`] = row[column.name]
41
- }
42
- }
43
- return table
44
- }
45
-
46
- const createDisplayObject = (display?: TableDisplay[]) => {
33
+ const createDisplayObject = () => {
47
34
  const defaultDisplay: TableDisplay[] = [Object.assign({}, { rowModified: false })]
48
35
 
49
- // TODO: (typing) what is the type of `display` here?
50
- if (display) {
51
- if ('0:0' in display) {
52
- return display
53
- }
54
- // else if ('default' in display) {
55
- // // TODO: (typing) what is the possible input here for 'default'?
56
- // defaultDisplay = display.default
57
- // }
58
- }
59
-
60
36
  // TODO: (typing) is this type correct for the parent set?
61
37
  const parents = new Set<string | number>()
62
38
  for (let rowIndex = 0; rowIndex < rows.value.length; rowIndex++) {
@@ -87,8 +63,64 @@ export const createTableStore = (initData: {
87
63
  const columns = ref(initData.columns)
88
64
  const rows = ref(initData.rows)
89
65
  const config = ref(initData.config || {})
90
- const table = ref(initData.table || createTableObject())
91
- const display = ref(createDisplayObject(initData.display))
66
+
67
+ // Track row modifications and expand states separately from the computed display
68
+ const rowModifications = ref<Record<number, boolean>>({})
69
+ const rowExpandStates = ref<Record<number, { childrenOpen?: boolean; expanded?: boolean }>>({})
70
+
71
+ const table = computed(() => {
72
+ const table = {}
73
+ for (const [colIndex, column] of columns.value.entries()) {
74
+ for (const [rowIndex, row] of rows.value.entries()) {
75
+ table[`${colIndex}:${rowIndex}`] = row[column.name]
76
+ }
77
+ }
78
+ return table
79
+ })
80
+
81
+ const display = computed({
82
+ get: () => {
83
+ const baseDisplay = createDisplayObject()
84
+
85
+ // Apply persistent modifications and expand states
86
+ for (let i = 0; i < baseDisplay.length; i++) {
87
+ if (rowModifications.value[i]) {
88
+ baseDisplay[i].rowModified = rowModifications.value[i]
89
+ }
90
+ if (rowExpandStates.value[i]) {
91
+ if (rowExpandStates.value[i].childrenOpen !== undefined) {
92
+ baseDisplay[i].childrenOpen = rowExpandStates.value[i].childrenOpen!
93
+ }
94
+ if (rowExpandStates.value[i].expanded !== undefined) {
95
+ baseDisplay[i].expanded = rowExpandStates.value[i].expanded!
96
+ }
97
+ }
98
+ }
99
+
100
+ // Calculate 'open' property for tree view based on parent's childrenOpen state
101
+ if (isTreeView.value) {
102
+ for (let i = 0; i < baseDisplay.length; i++) {
103
+ const row = baseDisplay[i]
104
+ if (!row.isRoot && row.parent !== null && row.parent !== undefined) {
105
+ // Child row is 'open' if its parent's childrenOpen is true
106
+ const parentIndex = row.parent
107
+ if (parentIndex >= 0 && parentIndex < baseDisplay.length) {
108
+ baseDisplay[i].open = baseDisplay[parentIndex].childrenOpen || false
109
+ }
110
+ }
111
+ }
112
+ }
113
+
114
+ return baseDisplay
115
+ },
116
+ set: (newDisplay: TableDisplay[]) => {
117
+ // Only update if the new display is different from the current one; also avoids recursive updates
118
+ if (JSON.stringify(newDisplay) !== JSON.stringify(display.value)) {
119
+ display.value = newDisplay
120
+ }
121
+ },
122
+ })
123
+
92
124
  const modal = ref<TableModal>(initData.modal || { visible: false })
93
125
  const updates = ref<Record<string, string>>({})
94
126
  const ganttBars = ref<GanttBarInfo[]>([])
@@ -116,7 +148,7 @@ export const createTableStore = (initData: {
116
148
  const col = columns.value[colIndex]
117
149
 
118
150
  if (table.value[index] !== value) {
119
- display.value[rowIndex].rowModified = true
151
+ rowModifications.value[rowIndex] = true
120
152
  }
121
153
 
122
154
  table.value[index] = value
@@ -127,11 +159,15 @@ export const createTableStore = (initData: {
127
159
  }
128
160
  }
129
161
 
162
+ const updateRows = (newRows: TableRow[]) => {
163
+ rows.value = newRows
164
+ }
165
+
130
166
  const setCellText = (colIndex: number, rowIndex: number, value: string) => {
131
167
  const index = `${colIndex}:${rowIndex}`
132
168
 
133
169
  if (table.value[index] !== value) {
134
- display.value[rowIndex].rowModified = true
170
+ rowModifications.value[rowIndex] = true
135
171
  updates.value[index] = value
136
172
  }
137
173
  }
@@ -194,21 +230,35 @@ export const createTableStore = (initData: {
194
230
 
195
231
  const toggleRowExpand = (rowIndex: number) => {
196
232
  if (isTreeView.value) {
197
- display.value[rowIndex].childrenOpen = !display.value[rowIndex].childrenOpen
198
- const isOpen = display.value[rowIndex].childrenOpen
199
-
200
- for (let index = 0; index < rows.value.length; index++) {
201
- if (display.value[index].parent === rowIndex) {
202
- display.value[index].open = isOpen
203
- if (!isOpen) {
204
- // If we're closing, also close any children recursively
205
- display.value[index].childrenOpen = false
233
+ const currentState = rowExpandStates.value[rowIndex] || {}
234
+ const currentChildrenOpen = currentState.childrenOpen ?? display.value[rowIndex].childrenOpen
235
+ const newChildrenOpen = !currentChildrenOpen
236
+
237
+ rowExpandStates.value[rowIndex] = {
238
+ ...currentState,
239
+ childrenOpen: newChildrenOpen,
240
+ }
241
+
242
+ // If we're closing, recursively close all descendant nodes
243
+ if (!newChildrenOpen) {
244
+ for (let index = 0; index < rows.value.length; index++) {
245
+ if (display.value[index].parent === rowIndex) {
246
+ const childState = rowExpandStates.value[index] || {}
247
+ rowExpandStates.value[index] = {
248
+ ...childState,
249
+ childrenOpen: false,
250
+ }
206
251
  toggleRowExpand(index)
207
252
  }
208
253
  }
209
254
  }
210
255
  } else if (config.value.view === 'list-expansion') {
211
- display.value[rowIndex].expanded = !display.value[rowIndex].expanded
256
+ const currentState = rowExpandStates.value[rowIndex] || {}
257
+ const currentExpanded = currentState.expanded ?? display.value[rowIndex].expanded
258
+ rowExpandStates.value[rowIndex] = {
259
+ ...currentState,
260
+ expanded: !currentExpanded,
261
+ }
212
262
  }
213
263
  }
214
264
 
@@ -323,6 +373,7 @@ export const createTableStore = (initData: {
323
373
  const toHandle = connectionHandles.value.find(h => h.id === toHandleId)
324
374
 
325
375
  if (!fromHandle || !toHandle) {
376
+ // eslint-disable-next-line no-console
326
377
  console.warn('Cannot create connection: handle not found')
327
378
  return null
328
379
  }
@@ -405,6 +456,7 @@ export const createTableStore = (initData: {
405
456
  unregisterConnectionHandle,
406
457
  unregisterGanttBar,
407
458
  updateGanttBar,
459
+ updateRows,
408
460
  }
409
461
  })
410
462