@stonecrop/atable 0.2.63 → 0.2.65

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.
package/dist/index.js CHANGED
@@ -1,10 +1,10 @@
1
- import ACell from '@/components/ACell.vue';
2
- import AExpansionRow from '@/components/AExpansionRow.vue';
3
- import ARow from '@/components/ARow.vue';
4
- import ATable from '@/components/ATable.vue';
5
- import ATableHeader from '@/components/ATableHeader.vue';
6
- import ATableModal from '@/components/ATableModal.vue';
7
- import TableDataStore from './components';
1
+ import ACell from './components/ACell.vue';
2
+ import AExpansionRow from './components/AExpansionRow.vue';
3
+ import ARow from './components/ARow.vue';
4
+ import ATable from './components/ATable.vue';
5
+ import ATableHeader from './components/ATableHeader.vue';
6
+ import ATableModal from './components/ATableModal.vue';
7
+ export { createTableStore } from './stores/table';
8
8
  /**
9
9
  * Install all ATable components
10
10
  * @param app - Vue app instance
@@ -18,4 +18,4 @@ function install(app /* options */) {
18
18
  app.component('ATableHeader', ATableHeader);
19
19
  app.component('ATableModal', ATableModal);
20
20
  }
21
- export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal, TableDataStore };
21
+ export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal };
@@ -1,17 +1,17 @@
1
1
  import { App } from 'vue';
2
- import ACell from '@/components/ACell.vue';
3
- import AExpansionRow from '@/components/AExpansionRow.vue';
4
- import ARow from '@/components/ARow.vue';
5
- import ATable from '@/components/ATable.vue';
6
- import ATableHeader from '@/components/ATableHeader.vue';
7
- import ATableModal from '@/components/ATableModal.vue';
8
- import TableDataStore from './components';
9
- export type { CellContext, TableColumn, TableConfig, TableDisplay, TableRow, TableModal } from '@/types';
2
+ import ACell from './components/ACell.vue';
3
+ import AExpansionRow from './components/AExpansionRow.vue';
4
+ import ARow from './components/ARow.vue';
5
+ import ATable from './components/ATable.vue';
6
+ import ATableHeader from './components/ATableHeader.vue';
7
+ import ATableModal from './components/ATableModal.vue';
8
+ export { createTableStore } from './stores/table';
9
+ export type { CellContext, TableColumn, TableConfig, TableDisplay, TableRow, TableModal } from './types';
10
10
  /**
11
11
  * Install all ATable components
12
12
  * @param app - Vue app instance
13
13
  * @public
14
14
  */
15
15
  declare function install(app: App): void;
16
- export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal, TableDataStore };
16
+ export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal };
17
17
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,cAAc,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAExG;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAOxB;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACjD,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAExG;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAOxB;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,CAAA"}
@@ -0,0 +1,326 @@
1
+ import { type CSSProperties } from 'vue';
2
+ import type { CellContext, TableColumn, TableConfig, TableDisplay, TableModal, TableRow } from '@/types';
3
+ /**
4
+ * Create a table store
5
+ * @param initData - Initial data for the table store
6
+ * @returns table store instance
7
+ * @public
8
+ */
9
+ export declare const createTableStore: (initData: {
10
+ columns: TableColumn[];
11
+ rows: TableRow[];
12
+ id?: string;
13
+ config?: TableConfig;
14
+ table?: {
15
+ [key: string]: any;
16
+ };
17
+ display?: TableDisplay[];
18
+ modal?: TableModal;
19
+ }) => import("pinia").Store<`table-${string}`, Pick<{
20
+ columns: import("vue").Ref<{
21
+ name: string;
22
+ align?: CanvasTextAlign;
23
+ edit?: boolean;
24
+ label?: string;
25
+ type?: string;
26
+ width?: string;
27
+ pinned?: boolean;
28
+ cellComponent?: string;
29
+ cellComponentProps?: Record<string, any>;
30
+ modalComponent?: string | ((context?: CellContext) => string);
31
+ modalComponentExtraProps?: Record<string, any>;
32
+ format?: string | ((value: any, context?: CellContext) => string);
33
+ mask?: (value: any) => any;
34
+ }[], TableColumn[] | {
35
+ name: string;
36
+ align?: CanvasTextAlign;
37
+ edit?: boolean;
38
+ label?: string;
39
+ type?: string;
40
+ width?: string;
41
+ pinned?: boolean;
42
+ cellComponent?: string;
43
+ cellComponentProps?: Record<string, any>;
44
+ modalComponent?: string | ((context?: CellContext) => string);
45
+ modalComponentExtraProps?: Record<string, any>;
46
+ format?: string | ((value: any, context?: CellContext) => string);
47
+ mask?: (value: any) => any;
48
+ }[]>;
49
+ rows: import("vue").Ref<{
50
+ [x: string]: any;
51
+ indent?: number;
52
+ parent?: number;
53
+ }[], TableRow[] | {
54
+ [x: string]: any;
55
+ indent?: number;
56
+ parent?: number;
57
+ }[]>;
58
+ config: import("vue").Ref<{
59
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
60
+ fullWidth?: boolean;
61
+ }, TableConfig | {
62
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
63
+ fullWidth?: boolean;
64
+ }>;
65
+ table: import("vue").Ref<{}, {}>;
66
+ display: import("vue").Ref<{
67
+ childrenOpen?: boolean;
68
+ expanded?: boolean;
69
+ indent?: number;
70
+ isParent?: boolean;
71
+ isRoot?: boolean;
72
+ open?: boolean;
73
+ parent?: number;
74
+ rowModified?: boolean;
75
+ }[], TableDisplay[] | {
76
+ childrenOpen?: boolean;
77
+ expanded?: boolean;
78
+ indent?: number;
79
+ isParent?: boolean;
80
+ isRoot?: boolean;
81
+ open?: boolean;
82
+ parent?: number;
83
+ rowModified?: boolean;
84
+ }[]>;
85
+ modal: import("vue").Ref<{
86
+ colIndex?: number;
87
+ event?: string;
88
+ left?: number;
89
+ parent?: HTMLElement;
90
+ rowIndex?: number;
91
+ top?: number;
92
+ visible?: boolean;
93
+ width?: string;
94
+ component?: string;
95
+ componentProps?: Record<string, any>;
96
+ }, TableModal | {
97
+ colIndex?: number;
98
+ event?: string;
99
+ left?: number;
100
+ parent?: HTMLElement;
101
+ rowIndex?: number;
102
+ top?: number;
103
+ visible?: boolean;
104
+ width?: string;
105
+ component?: string;
106
+ componentProps?: Record<string, any>;
107
+ }>;
108
+ hasPinnedColumns: import("vue").ComputedRef<boolean>;
109
+ numberedRowWidth: import("vue").ComputedRef<string>;
110
+ zeroColumn: import("vue").ComputedRef<boolean>;
111
+ closeModal: (event: MouseEvent) => void;
112
+ getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
113
+ getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
114
+ getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
115
+ getHeaderCellStyle: (column: TableColumn) => CSSProperties;
116
+ getIndent: (colIndex: number, indentLevel?: number) => string;
117
+ getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
118
+ isRowVisible: (rowIndex: number) => boolean;
119
+ setCellData: (colIndex: number, rowIndex: number, value: any) => void;
120
+ toggleRowExpand: (rowIndex: number) => void;
121
+ }, "columns" | "rows" | "config" | "table" | "display" | "modal">, Pick<{
122
+ columns: import("vue").Ref<{
123
+ name: string;
124
+ align?: CanvasTextAlign;
125
+ edit?: boolean;
126
+ label?: string;
127
+ type?: string;
128
+ width?: string;
129
+ pinned?: boolean;
130
+ cellComponent?: string;
131
+ cellComponentProps?: Record<string, any>;
132
+ modalComponent?: string | ((context?: CellContext) => string);
133
+ modalComponentExtraProps?: Record<string, any>;
134
+ format?: string | ((value: any, context?: CellContext) => string);
135
+ mask?: (value: any) => any;
136
+ }[], TableColumn[] | {
137
+ name: string;
138
+ align?: CanvasTextAlign;
139
+ edit?: boolean;
140
+ label?: string;
141
+ type?: string;
142
+ width?: string;
143
+ pinned?: boolean;
144
+ cellComponent?: string;
145
+ cellComponentProps?: Record<string, any>;
146
+ modalComponent?: string | ((context?: CellContext) => string);
147
+ modalComponentExtraProps?: Record<string, any>;
148
+ format?: string | ((value: any, context?: CellContext) => string);
149
+ mask?: (value: any) => any;
150
+ }[]>;
151
+ rows: import("vue").Ref<{
152
+ [x: string]: any;
153
+ indent?: number;
154
+ parent?: number;
155
+ }[], TableRow[] | {
156
+ [x: string]: any;
157
+ indent?: number;
158
+ parent?: number;
159
+ }[]>;
160
+ config: import("vue").Ref<{
161
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
162
+ fullWidth?: boolean;
163
+ }, TableConfig | {
164
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
165
+ fullWidth?: boolean;
166
+ }>;
167
+ table: import("vue").Ref<{}, {}>;
168
+ display: import("vue").Ref<{
169
+ childrenOpen?: boolean;
170
+ expanded?: boolean;
171
+ indent?: number;
172
+ isParent?: boolean;
173
+ isRoot?: boolean;
174
+ open?: boolean;
175
+ parent?: number;
176
+ rowModified?: boolean;
177
+ }[], TableDisplay[] | {
178
+ childrenOpen?: boolean;
179
+ expanded?: boolean;
180
+ indent?: number;
181
+ isParent?: boolean;
182
+ isRoot?: boolean;
183
+ open?: boolean;
184
+ parent?: number;
185
+ rowModified?: boolean;
186
+ }[]>;
187
+ modal: import("vue").Ref<{
188
+ colIndex?: number;
189
+ event?: string;
190
+ left?: number;
191
+ parent?: HTMLElement;
192
+ rowIndex?: number;
193
+ top?: number;
194
+ visible?: boolean;
195
+ width?: string;
196
+ component?: string;
197
+ componentProps?: Record<string, any>;
198
+ }, TableModal | {
199
+ colIndex?: number;
200
+ event?: string;
201
+ left?: number;
202
+ parent?: HTMLElement;
203
+ rowIndex?: number;
204
+ top?: number;
205
+ visible?: boolean;
206
+ width?: string;
207
+ component?: string;
208
+ componentProps?: Record<string, any>;
209
+ }>;
210
+ hasPinnedColumns: import("vue").ComputedRef<boolean>;
211
+ numberedRowWidth: import("vue").ComputedRef<string>;
212
+ zeroColumn: import("vue").ComputedRef<boolean>;
213
+ closeModal: (event: MouseEvent) => void;
214
+ getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
215
+ getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
216
+ getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
217
+ getHeaderCellStyle: (column: TableColumn) => CSSProperties;
218
+ getIndent: (colIndex: number, indentLevel?: number) => string;
219
+ getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
220
+ isRowVisible: (rowIndex: number) => boolean;
221
+ setCellData: (colIndex: number, rowIndex: number, value: any) => void;
222
+ toggleRowExpand: (rowIndex: number) => void;
223
+ }, "hasPinnedColumns" | "numberedRowWidth" | "zeroColumn">, Pick<{
224
+ columns: import("vue").Ref<{
225
+ name: string;
226
+ align?: CanvasTextAlign;
227
+ edit?: boolean;
228
+ label?: string;
229
+ type?: string;
230
+ width?: string;
231
+ pinned?: boolean;
232
+ cellComponent?: string;
233
+ cellComponentProps?: Record<string, any>;
234
+ modalComponent?: string | ((context?: CellContext) => string);
235
+ modalComponentExtraProps?: Record<string, any>;
236
+ format?: string | ((value: any, context?: CellContext) => string);
237
+ mask?: (value: any) => any;
238
+ }[], TableColumn[] | {
239
+ name: string;
240
+ align?: CanvasTextAlign;
241
+ edit?: boolean;
242
+ label?: string;
243
+ type?: string;
244
+ width?: string;
245
+ pinned?: boolean;
246
+ cellComponent?: string;
247
+ cellComponentProps?: Record<string, any>;
248
+ modalComponent?: string | ((context?: CellContext) => string);
249
+ modalComponentExtraProps?: Record<string, any>;
250
+ format?: string | ((value: any, context?: CellContext) => string);
251
+ mask?: (value: any) => any;
252
+ }[]>;
253
+ rows: import("vue").Ref<{
254
+ [x: string]: any;
255
+ indent?: number;
256
+ parent?: number;
257
+ }[], TableRow[] | {
258
+ [x: string]: any;
259
+ indent?: number;
260
+ parent?: number;
261
+ }[]>;
262
+ config: import("vue").Ref<{
263
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
264
+ fullWidth?: boolean;
265
+ }, TableConfig | {
266
+ view?: "uncounted" | "list" | "list-expansion" | "tree";
267
+ fullWidth?: boolean;
268
+ }>;
269
+ table: import("vue").Ref<{}, {}>;
270
+ display: import("vue").Ref<{
271
+ childrenOpen?: boolean;
272
+ expanded?: boolean;
273
+ indent?: number;
274
+ isParent?: boolean;
275
+ isRoot?: boolean;
276
+ open?: boolean;
277
+ parent?: number;
278
+ rowModified?: boolean;
279
+ }[], TableDisplay[] | {
280
+ childrenOpen?: boolean;
281
+ expanded?: boolean;
282
+ indent?: number;
283
+ isParent?: boolean;
284
+ isRoot?: boolean;
285
+ open?: boolean;
286
+ parent?: number;
287
+ rowModified?: boolean;
288
+ }[]>;
289
+ modal: import("vue").Ref<{
290
+ colIndex?: number;
291
+ event?: string;
292
+ left?: number;
293
+ parent?: HTMLElement;
294
+ rowIndex?: number;
295
+ top?: number;
296
+ visible?: boolean;
297
+ width?: string;
298
+ component?: string;
299
+ componentProps?: Record<string, any>;
300
+ }, TableModal | {
301
+ colIndex?: number;
302
+ event?: string;
303
+ left?: number;
304
+ parent?: HTMLElement;
305
+ rowIndex?: number;
306
+ top?: number;
307
+ visible?: boolean;
308
+ width?: string;
309
+ component?: string;
310
+ componentProps?: Record<string, any>;
311
+ }>;
312
+ hasPinnedColumns: import("vue").ComputedRef<boolean>;
313
+ numberedRowWidth: import("vue").ComputedRef<string>;
314
+ zeroColumn: import("vue").ComputedRef<boolean>;
315
+ closeModal: (event: MouseEvent) => void;
316
+ getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
317
+ getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
318
+ getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
319
+ getHeaderCellStyle: (column: TableColumn) => CSSProperties;
320
+ getIndent: (colIndex: number, indentLevel?: number) => string;
321
+ getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
322
+ isRowVisible: (rowIndex: number) => boolean;
323
+ setCellData: (colIndex: number, rowIndex: number, value: any) => void;
324
+ toggleRowExpand: (rowIndex: number) => void;
325
+ }, "closeModal" | "getCellData" | "getCellDisplayValue" | "getFormattedValue" | "getHeaderCellStyle" | "getIndent" | "getRowExpandSymbol" | "isRowVisible" | "setCellData" | "toggleRowExpand">>;
326
+ //# sourceMappingURL=table.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/stores/table.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,aAAa,EAAiB,MAAM,KAAK,CAAA;AAEvD,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAExG;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,aAAc;IAC1C,OAAO,EAAE,WAAW,EAAE,CAAA;IACtB,IAAI,EAAE,QAAQ,EAAE,CAAA;IAChB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,KAAK,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;IAC9B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IACxB,KAAK,CAAC,EAAE,UAAU,CAAA;CAClB;;;;;;;;;;;2CAXiB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;2CANkB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAwJ6B,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;;;;;;;;;;;;2CApHzB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;2CANkB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAwJ6B,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;;;;;;;;;;;;2CApHzB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;2CANkB,CAAC;;+CAMlB,CAAD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAwJ6B,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;gMAyF1C,CAAA"}
@@ -5,7 +5,7 @@
5
5
  "toolPackages": [
6
6
  {
7
7
  "packageName": "@microsoft/api-extractor",
8
- "packageVersion": "7.47.9"
8
+ "packageVersion": "7.48.0"
9
9
  }
10
10
  ]
11
11
  }
@@ -1,4 +1,7 @@
1
- import TableDataStore from '@/components';
1
+ /**
2
+ * Table column definition.
3
+ * @public
4
+ */
2
5
  export type TableColumn = {
3
6
  name: string;
4
7
  align?: CanvasTextAlign;
@@ -14,11 +17,21 @@ export type TableColumn = {
14
17
  format?: string | ((value: any, context?: CellContext) => string);
15
18
  mask?: (value: any) => any;
16
19
  };
20
+ /**
21
+ * Table cell context definition.
22
+ * @public
23
+ */
17
24
  export type CellContext = {
18
25
  row: TableRow;
19
26
  column: TableColumn;
20
- table: TableDataStore['table'];
27
+ table: {
28
+ [key: string]: any;
29
+ };
21
30
  };
31
+ /**
32
+ * Table configuration definition.
33
+ * @public
34
+ */
22
35
  export type TableConfig = {
23
36
  /**
24
37
  * The type of view to display the table in. Possible values:
@@ -30,6 +43,10 @@ export type TableConfig = {
30
43
  view?: 'uncounted' | 'list' | 'list-expansion' | 'tree';
31
44
  fullWidth?: boolean;
32
45
  };
46
+ /**
47
+ * Table display definition.
48
+ * @public
49
+ */
33
50
  export type TableDisplay = {
34
51
  childrenOpen?: boolean;
35
52
  expanded?: boolean;
@@ -40,11 +57,19 @@ export type TableDisplay = {
40
57
  parent?: number;
41
58
  rowModified?: boolean;
42
59
  };
60
+ /**
61
+ * Table row definition.
62
+ * @public
63
+ */
43
64
  export type TableRow = {
44
65
  [key: string]: any;
45
66
  indent?: number;
46
67
  parent?: number;
47
68
  };
69
+ /**
70
+ * Table modal definition.
71
+ * @public
72
+ */
48
73
  export type TableModal = {
49
74
  colIndex?: number;
50
75
  event?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,cAAc,CAAA;AAEzC,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,MAAM,CAAA;IAEZ,KAAK,CAAC,EAAE,eAAe,CAAA;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IAC7D,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAE9C,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IACjE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,GAAG,EAAE,QAAQ,CAAA;IACb,MAAM,EAAE,WAAW,CAAA;IACnB,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,gBAAgB,GAAG,MAAM,CAAA;IACvD,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,UAAU,GAAG;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,MAAM,CAAA;IAEZ,KAAK,CAAC,EAAE,eAAe,CAAA;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IAC7D,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAE9C,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IACjE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;CAC1B,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB,GAAG,EAAE,QAAQ,CAAA;IACb,MAAM,EAAE,WAAW,CAAA;IACnB,KAAK,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CAC7B,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,gBAAgB,GAAG,MAAM,CAAA;IACvD,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC,CAAA"}
@@ -0,0 +1,180 @@
1
+ import { defineStore } from 'pinia';
2
+ import { computed, ref } from 'vue';
3
+ /**
4
+ * Create a table store
5
+ * @param initData - Initial data for the table store
6
+ * @returns table store instance
7
+ * @public
8
+ */
9
+ export const createTableStore = (initData) => {
10
+ const id = initData.id || crypto.randomUUID();
11
+ const createStore = defineStore(`table-${id}`, () => {
12
+ // util functions
13
+ const createTableObject = () => {
14
+ const table = {};
15
+ for (const [colIndex, column] of columns.value.entries()) {
16
+ for (const [rowIndex, row] of rows.value.entries()) {
17
+ table[`${colIndex}:${rowIndex}`] = row[column.name];
18
+ }
19
+ }
20
+ return table;
21
+ };
22
+ const createDisplayObject = (display) => {
23
+ const defaultDisplay = [Object.assign({}, { rowModified: false })];
24
+ // TODO: (typing) what is the type of `display` here?
25
+ if (display) {
26
+ if ('0:0' in display) {
27
+ return display;
28
+ }
29
+ // else if ('default' in display) {
30
+ // // TODO: (typing) what is the possible input here for 'default'?
31
+ // defaultDisplay = display.default
32
+ // }
33
+ }
34
+ // TODO: (typing) is this type correct for the parent set?
35
+ const parents = new Set();
36
+ for (let rowIndex = rows.value.length - 1; rowIndex >= 0; rowIndex--) {
37
+ const row = rows.value[rowIndex];
38
+ if (row.parent) {
39
+ parents.add(row.parent);
40
+ }
41
+ defaultDisplay[rowIndex] = {
42
+ childrenOpen: false,
43
+ expanded: false,
44
+ indent: row.indent || null,
45
+ isParent: parents.has(rowIndex),
46
+ isRoot: row.parent === null || row.parent === undefined,
47
+ rowModified: false,
48
+ open: row.parent === null || row.parent === undefined,
49
+ parent: row.parent,
50
+ };
51
+ }
52
+ return defaultDisplay;
53
+ };
54
+ // state
55
+ const columns = ref(initData.columns);
56
+ const rows = ref(initData.rows);
57
+ const config = ref(initData.config || {});
58
+ const table = ref(initData.table || createTableObject());
59
+ const display = ref(createDisplayObject(initData.display));
60
+ const modal = ref(initData.modal || { visible: false });
61
+ // getters
62
+ const hasPinnedColumns = computed(() => columns.value.some(col => col.pinned));
63
+ const numberedRowWidth = computed(() => {
64
+ const indent = Math.ceil(rows.value.length / 100 + 1);
65
+ return `${indent}ch`;
66
+ });
67
+ const zeroColumn = computed(() => ['list', 'tree', 'list-expansion'].includes(config.value.view));
68
+ // actions
69
+ const getCellData = (colIndex, rowIndex) => table.value[`${colIndex}:${rowIndex}`];
70
+ const setCellData = (colIndex, rowIndex, value) => {
71
+ const index = `${colIndex}:${rowIndex}`;
72
+ const col = columns.value[colIndex];
73
+ if (table.value[index] !== value) {
74
+ display.value[rowIndex].rowModified = true;
75
+ }
76
+ table.value[index] = value;
77
+ rows.value[rowIndex][col.name] = value;
78
+ };
79
+ const getHeaderCellStyle = (column) => ({
80
+ minWidth: column.width || '40ch',
81
+ textAlign: column.align || 'center',
82
+ width: config.value.fullWidth ? 'auto' : null,
83
+ });
84
+ const isRowVisible = (rowIndex) => {
85
+ return config.value.view !== 'tree' || display.value[rowIndex].isRoot || display.value[rowIndex].open;
86
+ };
87
+ const getRowExpandSymbol = (rowIndex) => {
88
+ if (config.value.view !== 'tree') {
89
+ return '';
90
+ }
91
+ if (display.value[rowIndex].isRoot || display.value[rowIndex].isParent) {
92
+ return display.value[rowIndex].childrenOpen ? '-' : '+';
93
+ }
94
+ return '';
95
+ };
96
+ const toggleRowExpand = (rowIndex) => {
97
+ if (config.value.view === 'tree') {
98
+ display.value[rowIndex].childrenOpen = !display.value[rowIndex].childrenOpen;
99
+ for (let index = rows.value.length - 1; index >= 0; index--) {
100
+ if (display.value[index].parent === rowIndex) {
101
+ display.value[index].open = !display.value[index].open;
102
+ if (display.value[index].childrenOpen) {
103
+ toggleRowExpand(index);
104
+ }
105
+ }
106
+ }
107
+ }
108
+ else if (config.value.view === 'list-expansion') {
109
+ display.value[rowIndex].expanded = !display.value[rowIndex].expanded;
110
+ }
111
+ };
112
+ const getCellDisplayValue = (colIndex, rowIndex) => {
113
+ const cellData = getCellData(colIndex, rowIndex);
114
+ return getFormattedValue(colIndex, rowIndex, cellData);
115
+ };
116
+ const getFormattedValue = (colIndex, rowIndex, value) => {
117
+ const column = columns.value[colIndex];
118
+ const row = rows.value[rowIndex];
119
+ const format = column.format;
120
+ if (!format) {
121
+ return value;
122
+ }
123
+ if (typeof format === 'function') {
124
+ return format(value, { table: table.value, row, column });
125
+ }
126
+ else if (typeof format === 'string') {
127
+ // parse format function from string
128
+ // eslint-disable-next-line @typescript-eslint/no-implied-eval
129
+ const formatFn = Function(`"use strict";return (${format})`)();
130
+ return formatFn(value, { table: table.value, row, column });
131
+ }
132
+ return value;
133
+ };
134
+ const closeModal = (event) => {
135
+ if (!(event.target instanceof Node)) {
136
+ // if the target is not a node, it's probably a custom click event to Document or Window
137
+ // err on the side of closing the modal in that case
138
+ if (modal.value.visible)
139
+ modal.value.visible = false;
140
+ }
141
+ else if (!modal.value.parent?.contains(event.target)) {
142
+ if (modal.value.visible)
143
+ modal.value.visible = false;
144
+ }
145
+ };
146
+ const getIndent = (colIndex, indentLevel) => {
147
+ if (indentLevel && colIndex === 0 && indentLevel > 0) {
148
+ return `${indentLevel}ch`;
149
+ }
150
+ else {
151
+ return 'inherit';
152
+ }
153
+ };
154
+ return {
155
+ // state
156
+ columns,
157
+ rows,
158
+ config,
159
+ table,
160
+ display,
161
+ modal,
162
+ // getters
163
+ hasPinnedColumns,
164
+ numberedRowWidth,
165
+ zeroColumn,
166
+ // actions
167
+ closeModal,
168
+ getCellData,
169
+ getCellDisplayValue,
170
+ getFormattedValue,
171
+ getHeaderCellStyle,
172
+ getIndent,
173
+ getRowExpandSymbol,
174
+ isRowVisible,
175
+ setCellData,
176
+ toggleRowExpand,
177
+ };
178
+ });
179
+ return createStore();
180
+ };