@stonecrop/atable 0.4.15 → 0.4.17
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/assets/index.css +1 -1
- package/dist/atable.d.ts +11 -1
- package/dist/atable.js +686 -623
- package/dist/atable.js.map +1 -1
- package/dist/atable.umd.cjs +2 -2
- package/dist/atable.umd.cjs.map +1 -1
- package/dist/src/stores/table.d.ts +10 -1
- package/dist/src/stores/table.d.ts.map +1 -1
- package/dist/src/types/index.d.ts +1 -0
- package/dist/src/types/index.d.ts.map +1 -1
- package/dist/stores/table.js +26 -5
- package/package.json +3 -3
- package/src/components/ATable.vue +0 -1
- package/src/components/ATableHeader.vue +19 -1
- package/src/stores/table.ts +31 -5
- package/src/types/index.ts +1 -0
|
@@ -25,6 +25,7 @@ export declare const createTableStore: (initData: {
|
|
|
25
25
|
type?: string | undefined;
|
|
26
26
|
width?: string | undefined;
|
|
27
27
|
pinned?: boolean | undefined;
|
|
28
|
+
resizable?: boolean | undefined;
|
|
28
29
|
cellComponent?: string | undefined;
|
|
29
30
|
cellComponentProps?: Record<string, any> | undefined;
|
|
30
31
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -43,6 +44,7 @@ export declare const createTableStore: (initData: {
|
|
|
43
44
|
type?: string | undefined;
|
|
44
45
|
width?: string | undefined;
|
|
45
46
|
pinned?: boolean | undefined;
|
|
47
|
+
resizable?: boolean | undefined;
|
|
46
48
|
cellComponent?: string | undefined;
|
|
47
49
|
cellComponentProps?: Record<string, any> | undefined;
|
|
48
50
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -136,6 +138,7 @@ export declare const createTableStore: (initData: {
|
|
|
136
138
|
getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
|
|
137
139
|
getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
|
|
138
140
|
getHeaderCellStyle: (column: TableColumn) => CSSProperties;
|
|
141
|
+
resizeColumn: (colIndex: number, newWidth: number) => void;
|
|
139
142
|
getIndent: (colIndex: number, indentLevel?: number) => string;
|
|
140
143
|
getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
|
|
141
144
|
isRowGantt: (rowIndex: number) => boolean;
|
|
@@ -153,6 +156,7 @@ export declare const createTableStore: (initData: {
|
|
|
153
156
|
type?: string | undefined;
|
|
154
157
|
width?: string | undefined;
|
|
155
158
|
pinned?: boolean | undefined;
|
|
159
|
+
resizable?: boolean | undefined;
|
|
156
160
|
cellComponent?: string | undefined;
|
|
157
161
|
cellComponentProps?: Record<string, any> | undefined;
|
|
158
162
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -171,6 +175,7 @@ export declare const createTableStore: (initData: {
|
|
|
171
175
|
type?: string | undefined;
|
|
172
176
|
width?: string | undefined;
|
|
173
177
|
pinned?: boolean | undefined;
|
|
178
|
+
resizable?: boolean | undefined;
|
|
174
179
|
cellComponent?: string | undefined;
|
|
175
180
|
cellComponentProps?: Record<string, any> | undefined;
|
|
176
181
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -264,6 +269,7 @@ export declare const createTableStore: (initData: {
|
|
|
264
269
|
getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
|
|
265
270
|
getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
|
|
266
271
|
getHeaderCellStyle: (column: TableColumn) => CSSProperties;
|
|
272
|
+
resizeColumn: (colIndex: number, newWidth: number) => void;
|
|
267
273
|
getIndent: (colIndex: number, indentLevel?: number) => string;
|
|
268
274
|
getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
|
|
269
275
|
isRowGantt: (rowIndex: number) => boolean;
|
|
@@ -281,6 +287,7 @@ export declare const createTableStore: (initData: {
|
|
|
281
287
|
type?: string | undefined;
|
|
282
288
|
width?: string | undefined;
|
|
283
289
|
pinned?: boolean | undefined;
|
|
290
|
+
resizable?: boolean | undefined;
|
|
284
291
|
cellComponent?: string | undefined;
|
|
285
292
|
cellComponentProps?: Record<string, any> | undefined;
|
|
286
293
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -299,6 +306,7 @@ export declare const createTableStore: (initData: {
|
|
|
299
306
|
type?: string | undefined;
|
|
300
307
|
width?: string | undefined;
|
|
301
308
|
pinned?: boolean | undefined;
|
|
309
|
+
resizable?: boolean | undefined;
|
|
302
310
|
cellComponent?: string | undefined;
|
|
303
311
|
cellComponentProps?: Record<string, any> | undefined;
|
|
304
312
|
modalComponent?: (string | ((context: CellContext) => string)) | undefined;
|
|
@@ -392,6 +400,7 @@ export declare const createTableStore: (initData: {
|
|
|
392
400
|
getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
|
|
393
401
|
getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
|
|
394
402
|
getHeaderCellStyle: (column: TableColumn) => CSSProperties;
|
|
403
|
+
resizeColumn: (colIndex: number, newWidth: number) => void;
|
|
395
404
|
getIndent: (colIndex: number, indentLevel?: number) => string;
|
|
396
405
|
getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
|
|
397
406
|
isRowGantt: (rowIndex: number) => boolean;
|
|
@@ -400,5 +409,5 @@ export declare const createTableStore: (initData: {
|
|
|
400
409
|
setCellText: (colIndex: number, rowIndex: number, value: string) => void;
|
|
401
410
|
toggleRowExpand: (rowIndex: number) => void;
|
|
402
411
|
updateGanttBar: (event: GanttDragEvent) => void;
|
|
403
|
-
}, "closeModal" | "getCellData" | "getCellDisplayValue" | "getFormattedValue" | "getHeaderCellStyle" | "getIndent" | "getRowExpandSymbol" | "isRowGantt" | "isRowVisible" | "setCellData" | "setCellText" | "toggleRowExpand" | "updateGanttBar">>;
|
|
412
|
+
}, "closeModal" | "getCellData" | "getCellDisplayValue" | "getFormattedValue" | "getHeaderCellStyle" | "resizeColumn" | "getIndent" | "getRowExpandSymbol" | "isRowGantt" | "isRowVisible" | "setCellData" | "setCellText" | "toggleRowExpand" | "updateGanttBar">>;
|
|
404
413
|
//# sourceMappingURL=table.d.ts.map
|
|
@@ -1 +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,EACX,WAAW,EACX,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,MAAM,UAAU,CAAA;AAGjB;;;;;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
|
|
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,EACX,WAAW,EACX,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,MAAM,UAAU,CAAA;AAGjB;;;;;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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBA6L4B,UAAU;kBApHhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCA0F7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCAzErC,WAAW,KAAG,aAAa;6BAmB/B,MAAM,YAAY,MAAM;0BAqF3B,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;2BATd,MAAM;6BAKJ,MAAM;4BAzDP,MAAM,YAAY,MAAM,SAAS,GAAG;4BAYpC,MAAM,YAAY,MAAM,SAAS,MAAM;gCA6DnC,MAAM;4BA4DV,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAlBlB,UAAU;kBApHhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCA0F7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCAzErC,WAAW,KAAG,aAAa;6BAmB/B,MAAM,YAAY,MAAM;0BAqF3B,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;2BATd,MAAM;6BAKJ,MAAM;4BAzDP,MAAM,YAAY,MAAM,SAAS,GAAG;4BAYpC,MAAM,YAAY,MAAM,SAAS,MAAM;gCA6DnC,MAAM;4BA4DV,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAlBlB,UAAU;kBApHhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCA0F7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCAzErC,WAAW,KAAG,aAAa;6BAmB/B,MAAM,YAAY,MAAM;0BAqF3B,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;2BATd,MAAM;6BAKJ,MAAM;4BAzDP,MAAM,YAAY,MAAM,SAAS,GAAG;4BAYpC,MAAM,YAAY,MAAM,SAAS,MAAM;gCA6DnC,MAAM;4BA4DV,cAAc;mQAwD9C,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAA;AAEjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC3B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IAEZ;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,eAAe,CAAA;IAEvB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"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"}
|
package/dist/stores/table.js
CHANGED
|
@@ -85,11 +85,31 @@ export const createTableStore = (initData) => {
|
|
|
85
85
|
updates.value[index] = value;
|
|
86
86
|
}
|
|
87
87
|
};
|
|
88
|
-
const getHeaderCellStyle = (column) =>
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
88
|
+
const getHeaderCellStyle = (column) => {
|
|
89
|
+
const isLastCol = columns.value.indexOf(column) === columns.value.length - 1;
|
|
90
|
+
// if the table is full width, the last column should not be resizable;
|
|
91
|
+
// ref: https://github.com/agritheory/stonecrop/pull/196#issuecomment-2503762641
|
|
92
|
+
const isResizable = config.value.fullWidth ? column.resizable && !isLastCol : column.resizable;
|
|
93
|
+
return {
|
|
94
|
+
width: column.width || '40ch',
|
|
95
|
+
textAlign: column.align || 'center',
|
|
96
|
+
...(isResizable && {
|
|
97
|
+
resize: 'horizontal',
|
|
98
|
+
overflow: 'hidden',
|
|
99
|
+
whiteSpace: 'nowrap',
|
|
100
|
+
}),
|
|
101
|
+
};
|
|
102
|
+
};
|
|
103
|
+
const resizeColumn = (colIndex, newWidth) => {
|
|
104
|
+
if (colIndex < 0 || colIndex >= columns.value.length)
|
|
105
|
+
return;
|
|
106
|
+
const minWidth = 40;
|
|
107
|
+
const finalWidth = Math.max(newWidth, minWidth);
|
|
108
|
+
columns.value[colIndex] = {
|
|
109
|
+
...columns.value[colIndex],
|
|
110
|
+
width: `${finalWidth}px`,
|
|
111
|
+
};
|
|
112
|
+
};
|
|
93
113
|
const isRowGantt = (rowIndex) => {
|
|
94
114
|
const row = rows.value[rowIndex];
|
|
95
115
|
return config.value.view === 'gantt' && row.indent === 0;
|
|
@@ -206,6 +226,7 @@ export const createTableStore = (initData) => {
|
|
|
206
226
|
getCellDisplayValue,
|
|
207
227
|
getFormattedValue,
|
|
208
228
|
getHeaderCellStyle,
|
|
229
|
+
resizeColumn,
|
|
209
230
|
getIndent,
|
|
210
231
|
getRowExpandSymbol,
|
|
211
232
|
isRowGantt,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stonecrop/atable",
|
|
3
|
-
"version": "0.4.
|
|
3
|
+
"version": "0.4.17",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": {
|
|
@@ -38,8 +38,8 @@
|
|
|
38
38
|
"@vueuse/core": "^12.7.0",
|
|
39
39
|
"pinia": "^3.0.1",
|
|
40
40
|
"vue": "^3.5.13",
|
|
41
|
-
"@stonecrop/utilities": "0.4.
|
|
42
|
-
"@stonecrop/themes": "0.4.
|
|
41
|
+
"@stonecrop/utilities": "0.4.17",
|
|
42
|
+
"@stonecrop/themes": "0.4.17"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@microsoft/api-documenter": "^7.26.10",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<thead
|
|
2
|
+
<thead v-if="columns.length">
|
|
3
3
|
<tr class="atable-header-row" tabindex="-1">
|
|
4
4
|
<th
|
|
5
5
|
v-if="store.zeroColumn"
|
|
@@ -12,7 +12,9 @@
|
|
|
12
12
|
class="list-index" />
|
|
13
13
|
<th
|
|
14
14
|
v-for="(column, colKey) in columns"
|
|
15
|
+
v-resize-observer="onResize"
|
|
15
16
|
:key="column.name"
|
|
17
|
+
:data-colindex="colKey"
|
|
16
18
|
tabindex="-1"
|
|
17
19
|
:style="store.getHeaderCellStyle(column)"
|
|
18
20
|
:class="column.pinned ? 'sticky-column' : ''">
|
|
@@ -23,6 +25,7 @@
|
|
|
23
25
|
</template>
|
|
24
26
|
|
|
25
27
|
<script setup lang="ts">
|
|
28
|
+
import { vResizeObserver } from '@vueuse/components'
|
|
26
29
|
import { createTableStore } from '../stores/table'
|
|
27
30
|
import type { TableColumn } from '../types'
|
|
28
31
|
|
|
@@ -30,6 +33,20 @@ const { columns, store } = defineProps<{
|
|
|
30
33
|
columns: TableColumn[]
|
|
31
34
|
store: ReturnType<typeof createTableStore>
|
|
32
35
|
}>()
|
|
36
|
+
|
|
37
|
+
const onResize = (entries: ReadonlyArray<ResizeObserverEntry>) => {
|
|
38
|
+
for (const entry of entries) {
|
|
39
|
+
if (entry.borderBoxSize.length === 0) continue
|
|
40
|
+
const observedCell = entry.borderBoxSize[0]
|
|
41
|
+
const observedWidth = observedCell.inlineSize
|
|
42
|
+
const colIndex = Number((entry.target as HTMLElement).dataset.colindex)
|
|
43
|
+
const currentWidth = store.columns[colIndex]?.width
|
|
44
|
+
|
|
45
|
+
if (typeof currentWidth === 'number' && currentWidth !== observedWidth) {
|
|
46
|
+
store.resizeColumn(colIndex, observedWidth)
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
33
50
|
</script>
|
|
34
51
|
|
|
35
52
|
<style>
|
|
@@ -42,6 +59,7 @@ const { columns, store } = defineProps<{
|
|
|
42
59
|
padding-bottom: var(--sc-atable-row-padding);
|
|
43
60
|
box-sizing: border-box;
|
|
44
61
|
color: var(--sc-header-text-color);
|
|
62
|
+
position: relative;
|
|
45
63
|
}
|
|
46
64
|
#header-index {
|
|
47
65
|
padding-left: var(--sc-atable-row-padding);
|
package/src/stores/table.ts
CHANGED
|
@@ -121,11 +121,36 @@ export const createTableStore = (initData: {
|
|
|
121
121
|
}
|
|
122
122
|
}
|
|
123
123
|
|
|
124
|
-
const getHeaderCellStyle = (column: TableColumn): CSSProperties =>
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
width
|
|
128
|
-
|
|
124
|
+
const getHeaderCellStyle = (column: TableColumn): CSSProperties => {
|
|
125
|
+
const isLastCol = columns.value.indexOf(column) === columns.value.length - 1
|
|
126
|
+
|
|
127
|
+
// if the table is full width, the last column should not be resizable;
|
|
128
|
+
// ref: https://github.com/agritheory/stonecrop/pull/196#issuecomment-2503762641
|
|
129
|
+
|
|
130
|
+
const isResizable = config.value.fullWidth ? column.resizable && !isLastCol : column.resizable
|
|
131
|
+
|
|
132
|
+
return {
|
|
133
|
+
width: column.width || '40ch',
|
|
134
|
+
textAlign: column.align || 'center',
|
|
135
|
+
...(isResizable && {
|
|
136
|
+
resize: 'horizontal',
|
|
137
|
+
overflow: 'hidden',
|
|
138
|
+
whiteSpace: 'nowrap',
|
|
139
|
+
}),
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
const resizeColumn = (colIndex: number, newWidth: number) => {
|
|
144
|
+
if (colIndex < 0 || colIndex >= columns.value.length) return
|
|
145
|
+
|
|
146
|
+
const minWidth = 40
|
|
147
|
+
const finalWidth = Math.max(newWidth, minWidth)
|
|
148
|
+
|
|
149
|
+
columns.value[colIndex] = {
|
|
150
|
+
...columns.value[colIndex],
|
|
151
|
+
width: `${finalWidth}px`,
|
|
152
|
+
}
|
|
153
|
+
}
|
|
129
154
|
|
|
130
155
|
const isRowGantt = (rowIndex: number) => {
|
|
131
156
|
const row = rows.value[rowIndex]
|
|
@@ -251,6 +276,7 @@ export const createTableStore = (initData: {
|
|
|
251
276
|
getCellDisplayValue,
|
|
252
277
|
getFormattedValue,
|
|
253
278
|
getHeaderCellStyle,
|
|
279
|
+
resizeColumn,
|
|
254
280
|
getIndent,
|
|
255
281
|
getRowExpandSymbol,
|
|
256
282
|
isRowGantt,
|