stk-table-vue 0.11.6 â 0.11.8
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/README.md +173 -172
- package/lib/{index-t5SJ6KNv.js â index-C40Rz-HL.js} +53 -7
- package/lib/src/StkTable/StkTable.vue.d.ts +8 -2
- package/lib/src/StkTable/components/Filter/Dropdown/index.d.ts +4 -2
- package/lib/src/StkTable/components/Filter/Dropdown/index.vue.d.ts +2 -1
- package/lib/src/StkTable/features/const.d.ts +1 -0
- package/lib/src/StkTable/features/index.d.ts +1 -1
- package/lib/src/StkTable/features/useAreaSelection.d.ts +1 -0
- package/lib/src/StkTable/registerFeature.d.ts +5 -1
- package/lib/src/StkTable/types/index.d.ts +7 -5
- package/lib/src/StkTable/useColResize.d.ts +1 -1
- package/lib/src/StkTable/useVirtualScroll.d.ts +1 -1
- package/lib/src/StkTable/utils/index.d.ts +1 -0
- package/lib/stk-table-vue.js +292 -236
- package/lib/style.css +1 -1
- package/lib/test/defaultSort.test.d.ts +1 -0
- package/package.json +84 -75
- package/src/StkTable/StkTable.vue +1750 -1742
- package/src/StkTable/components/DragHandle.vue +9 -9
- package/src/StkTable/components/Filter/Dropdown/index.ts +16 -16
- package/src/StkTable/components/Filter/Dropdown/index.vue +185 -123
- package/src/StkTable/components/Filter/Filter.less +129 -129
- package/src/StkTable/components/Filter/Filter.vue +61 -48
- package/src/StkTable/components/Filter/index.ts +6 -6
- package/src/StkTable/components/Filter/types.ts +18 -18
- package/src/StkTable/components/Filter/useFilter.ts +90 -90
- package/src/StkTable/components/SortIcon.vue +6 -6
- package/src/StkTable/components/TreeNodeCell.vue +19 -19
- package/src/StkTable/components/TriangleIcon.vue +3 -3
- package/src/StkTable/const.ts +50 -50
- package/src/StkTable/features/const.ts +1 -0
- package/src/StkTable/features/index.ts +1 -1
- package/src/StkTable/features/useAreaSelection.ts +780 -776
- package/src/StkTable/index.ts +9 -9
- package/src/StkTable/registerFeature.ts +35 -30
- package/src/StkTable/style.less +723 -723
- package/src/StkTable/types/highlightDimOptions.ts +26 -26
- package/src/StkTable/types/index.ts +393 -390
- package/src/StkTable/useAutoResize.ts +87 -87
- package/src/StkTable/useColResize.ts +202 -200
- package/src/StkTable/useFixedCol.ts +139 -139
- package/src/StkTable/useFixedStyle.ts +74 -74
- package/src/StkTable/useGetFixedColPosition.ts +63 -63
- package/src/StkTable/useHighlight.ts +249 -247
- package/src/StkTable/useKeyboardArrowScroll.ts +114 -112
- package/src/StkTable/useMaxRowSpan.ts +50 -50
- package/src/StkTable/useMergeCells.ts +131 -131
- package/src/StkTable/useRowExpand.ts +80 -80
- package/src/StkTable/useScrollRowByRow.ts +96 -96
- package/src/StkTable/useScrollbar.ts +169 -159
- package/src/StkTable/useSorter.ts +259 -262
- package/src/StkTable/useTableColumns.ts +129 -129
- package/src/StkTable/useThDrag.ts +96 -96
- package/src/StkTable/useTrDrag.ts +100 -100
- package/src/StkTable/useTree.ts +151 -151
- package/src/StkTable/useVirtualScroll.ts +546 -511
- package/src/StkTable/useWheeling.ts +23 -23
- package/src/StkTable/utils/constRefUtils.ts +29 -29
- package/src/StkTable/utils/index.ts +324 -314
- package/src/StkTable/utils/useTriggerRef.ts +33 -33
- package/src/VirtualTree.vue +622 -622
- package/src/VirtualTreeSelect.vue +367 -367
- package/src/vite-env.d.ts +10 -10
package/README.md
CHANGED
|
@@ -1,172 +1,173 @@
|
|
|
1
|
-
<p align="center">
|
|
2
|
-
<a href="https://ja-plus.github.io/stk-table-vue/">
|
|
3
|
-
<img src="./docs-src/public/assets/logo.svg" width="152">
|
|
4
|
-
</a>
|
|
5
|
-
<h3 align='center'>Stk Table Vue</h3>
|
|
6
|
-
<p align="center">
|
|
7
|
-
<a href="https://www.npmjs.com/package/stk-table-vue"><img src="https://img.shields.io/npm/v/stk-table-vue"></a>
|
|
8
|
-
<a href="https://www.npmjs.com/package/stk-table-vue"><img src="https://img.shields.io/npm/dw/stk-table-vue"></a>
|
|
9
|
-
<a href="https://github.com/ja-plus/stk-table-vue/stargazers"><img src="https://img.shields.io/github/stars/ja-plus/stk-table-vue.svg"></a>
|
|
10
|
-
<a href="https://raw.githubusercontent.com/ja-plus/stk-table-vue/master/LICENSE"><img src="https://img.shields.io/npm/l/stk-table-vue"></a>
|
|
11
|
-
<a href="https://github.com/ja-plus/stk-table-vue"><img src="https://img.shields.io/npm/types/stk-table-vue"></a>
|
|
12
|
-
</p>
|
|
13
|
-
</p>
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
- [
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
import {
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
{title: '
|
|
63
|
-
{title: '
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
{id:
|
|
69
|
-
{id:
|
|
70
|
-
{id:
|
|
71
|
-
{id:
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
:
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
:
|
|
112
|
-
:show-
|
|
113
|
-
:
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
virtual
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
:
|
|
124
|
-
:
|
|
125
|
-
|
|
126
|
-
@
|
|
127
|
-
@
|
|
128
|
-
@row-
|
|
129
|
-
@row-
|
|
130
|
-
@
|
|
131
|
-
@
|
|
132
|
-
@
|
|
133
|
-
@
|
|
134
|
-
@scroll
|
|
135
|
-
@
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
Compare
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
1
|
+
<p align="center">
|
|
2
|
+
<a href="https://ja-plus.github.io/stk-table-vue/">
|
|
3
|
+
<img src="./docs-src/public/assets/logo.svg" width="152">
|
|
4
|
+
</a>
|
|
5
|
+
<h3 align='center'>Stk Table Vue</h3>
|
|
6
|
+
<p align="center">
|
|
7
|
+
<a href="https://www.npmjs.com/package/stk-table-vue"><img src="https://img.shields.io/npm/v/stk-table-vue"></a>
|
|
8
|
+
<a href="https://www.npmjs.com/package/stk-table-vue"><img src="https://img.shields.io/npm/dw/stk-table-vue"></a>
|
|
9
|
+
<a href="https://github.com/ja-plus/stk-table-vue/stargazers"><img src="https://img.shields.io/github/stars/ja-plus/stk-table-vue.svg"></a>
|
|
10
|
+
<a href="https://raw.githubusercontent.com/ja-plus/stk-table-vue/master/LICENSE"><img src="https://img.shields.io/npm/l/stk-table-vue"></a>
|
|
11
|
+
<a href="https://github.com/ja-plus/stk-table-vue"><img src="https://img.shields.io/npm/types/stk-table-vue"></a>
|
|
12
|
+
</p>
|
|
13
|
+
</p>
|
|
14
|
+
|
|
15
|
+
Stk Table Vue(Sticky Table) is a high-performance virtual list component based on Vue.
|
|
16
|
+
|
|
17
|
+
Smooth performance with tens of thousands of rows
|
|
18
|
+
|
|
19
|
+
Used for real-time data display, with data highlighting and dynamic effects.
|
|
20
|
+
|
|
21
|
+
Support Vue3 and Vue2.7
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
## Documentation
|
|
25
|
+
### [Stk Table Vue Official](https://ja-plus.github.io/stk-table-vue/)
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
## Repo:
|
|
29
|
+
- [Github](https://github.com/ja-plus/stk-table-vue)
|
|
30
|
+
- [Gitee](https://gitee.com/japlus/stk-table-vue)
|
|
31
|
+
|
|
32
|
+
## Demo
|
|
33
|
+
[<span style="font-size: 16px;font-weight: bold;">Online Demo in stackblitz</span>](https://stackblitz.com/edit/vitejs-vite-ad91hh?file=src%2FDemo%2Findex.vue)
|
|
34
|
+
|
|
35
|
+
## Usage
|
|
36
|
+
> npm install stk-table-vue
|
|
37
|
+
|
|
38
|
+
```html
|
|
39
|
+
<script setup>
|
|
40
|
+
import { StkTable } from 'stk-table-vue'
|
|
41
|
+
import { ref, useTemplateRef } from 'vue'
|
|
42
|
+
const stkTableRef = ref<InstanceType<typeof StkTable>>();
|
|
43
|
+
// or Vue 3.5 useTemplateRef
|
|
44
|
+
const stkTableRef = useTemplateRef('stkTableRef');
|
|
45
|
+
|
|
46
|
+
// highlight row
|
|
47
|
+
stkTableRef.value.setHighlightDimRow([rowKey]ďź{
|
|
48
|
+
method: 'css'|'animation',// default animationă
|
|
49
|
+
className: 'custom-class-name', // method cssă
|
|
50
|
+
keyframe: [{backgroundColor:'#aaa'}, {backgroundColor: '#222'}],//same as https://developer.mozilla.org/zh-CN/docs/Web/API/Web_Animations_API/Keyframe_Formats
|
|
51
|
+
duration: 2000,ă
|
|
52
|
+
});
|
|
53
|
+
// highlight cell
|
|
54
|
+
stkTableRef.value.setHighlightDimCell(rowKey, colDataIndex, {
|
|
55
|
+
method: 'css'|'animation',
|
|
56
|
+
className:'custom-class-name', // method cssă
|
|
57
|
+
keyframe: [{backgroundColor:'#aaa'}, {backgroundColor: '#222'}], // method animationă
|
|
58
|
+
duration: 2000,ă
|
|
59
|
+
});
|
|
60
|
+
|
|
61
|
+
const columns = [
|
|
62
|
+
{title: 'name', dataIndex: 'name'},
|
|
63
|
+
{title: 'age', dataIndex: 'age'},
|
|
64
|
+
{title: 'address', dataIndex: 'address'},
|
|
65
|
+
];
|
|
66
|
+
|
|
67
|
+
const dataSource = [
|
|
68
|
+
{id: 1, name: 'John', age: 32, address: 'New York'},
|
|
69
|
+
{id: 2, name: 'Jim', age: 42, address: 'London'},
|
|
70
|
+
{id: 3, name: 'Joe', age: 52, address: 'Tokyo'},
|
|
71
|
+
{id: 4, name: 'Jack', age: 62, address: 'Sydney'},
|
|
72
|
+
{id: 5, name: 'Jill', age: 72, address: 'Paris'},
|
|
73
|
+
]
|
|
74
|
+
|
|
75
|
+
</script>
|
|
76
|
+
|
|
77
|
+
<template>
|
|
78
|
+
<StkTable ref='stkTableRef' row-key="id" :data-source="dataSource" :columns="columns"></StkTable>
|
|
79
|
+
</template>
|
|
80
|
+
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
### Vue2.7 Usage
|
|
84
|
+
[Vue2.7 Usage](https://ja-plus.github.io/stk-table-vue/main/start/vue2-usage.html)
|
|
85
|
+
|
|
86
|
+
## API
|
|
87
|
+
* [Props](https://ja-plus.github.io/stk-table-vue/main/api/table-props.html)
|
|
88
|
+
|
|
89
|
+
* [Emits](https://ja-plus.github.io/stk-table-vue/main/api/emits.html)
|
|
90
|
+
|
|
91
|
+
* [Slots](https://ja-plus.github.io/stk-table-vue/main/api/slots.html)
|
|
92
|
+
|
|
93
|
+
* [Expose](https://ja-plus.github.io/stk-table-vue/main/api/expose.html)
|
|
94
|
+
|
|
95
|
+
* [StkTableColumn: Define column type](https://ja-plus.github.io/stk-table-vue/main/api/stk-table-column.html)
|
|
96
|
+
|
|
97
|
+
* [Highlight: setHighlightDimCell & setHighlightDimRow](https://ja-plus.github.io/stk-table-vue/main/api/expose.html#sethighlightdimcell)
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
### Example
|
|
101
|
+
```vue
|
|
102
|
+
<template>
|
|
103
|
+
<StkTable
|
|
104
|
+
ref="stkTable"
|
|
105
|
+
row-key="name"
|
|
106
|
+
v-model:columns="columns"
|
|
107
|
+
:style="{height:props.height}"
|
|
108
|
+
theme='dark'
|
|
109
|
+
height='200px'
|
|
110
|
+
bordered="h"
|
|
111
|
+
:row-height="28"
|
|
112
|
+
:show-overflow="false"
|
|
113
|
+
:show-header-overflow="false"
|
|
114
|
+
:sort-remote="false"
|
|
115
|
+
col-resizable
|
|
116
|
+
header-drag
|
|
117
|
+
virtual
|
|
118
|
+
virtual-x
|
|
119
|
+
no-data-full
|
|
120
|
+
col-resizable
|
|
121
|
+
auto-resize
|
|
122
|
+
fixed-col-shadow
|
|
123
|
+
:col-min-width="10"
|
|
124
|
+
:headless="false"
|
|
125
|
+
:data-source="dataSource"
|
|
126
|
+
@current-change="onCurrentChange"
|
|
127
|
+
@row-menu="onRowMenu"
|
|
128
|
+
@header-row-menu="onHeaderRowMenu"
|
|
129
|
+
@row-click="onRowClick"
|
|
130
|
+
@row-dblclick="onRowDblclick"
|
|
131
|
+
@sort-change="handleSortChange"
|
|
132
|
+
@cell-click="onCellClick"
|
|
133
|
+
@header-cell-click="onHeaderCellClick"
|
|
134
|
+
@scroll="onTableScroll"
|
|
135
|
+
@scroll-x="onTableScrollX"
|
|
136
|
+
@col-order-change="onColOrderChange"
|
|
137
|
+
/>
|
|
138
|
+
</template>
|
|
139
|
+
<script setup>
|
|
140
|
+
import { h, defineComponent } from 'vue';
|
|
141
|
+
const columns = [
|
|
142
|
+
{
|
|
143
|
+
title: 'Name',
|
|
144
|
+
dataIndex: 'name',
|
|
145
|
+
fixed: 'left',
|
|
146
|
+
width: '200px',
|
|
147
|
+
headerClassName: 'my-th',
|
|
148
|
+
className: 'my-td',
|
|
149
|
+
sorter: true,
|
|
150
|
+
customHeaderCell: function FunctionalComponent(props){
|
|
151
|
+
return h(
|
|
152
|
+
'span',
|
|
153
|
+
{ style: 'overflow:hidden;text-overflow:ellipsis;white-space:nowrap' },
|
|
154
|
+
props.col.title + '(render) text-overflow,',
|
|
155
|
+
);
|
|
156
|
+
},
|
|
157
|
+
customCell: defineComponent({
|
|
158
|
+
setup(){
|
|
159
|
+
//...
|
|
160
|
+
return () => <div></div> // vue jsx
|
|
161
|
+
}
|
|
162
|
+
})
|
|
163
|
+
},
|
|
164
|
+
]
|
|
165
|
+
</script>
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
## Compare
|
|
169
|
+
Compare performance with other vue table [vue-table-compare](https://github.com/ja-plus/vue-table-compare)
|
|
170
|
+
|
|
171
|
+
|
|
172
|
+
## Other
|
|
173
|
+
* `$*$`
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* name: stk-table-vue
|
|
3
|
-
* version: v0.11.
|
|
3
|
+
* version: v0.11.8
|
|
4
4
|
* description: High performance realtime virtual table for vue3 and vue2.7
|
|
5
5
|
* author: japlus
|
|
6
6
|
* homepage: https://ja-plus.github.io/stk-table-vue/
|
|
7
7
|
* license: MIT
|
|
8
8
|
*/
|
|
9
|
-
import { defineComponent, ref, reactive, h, onMounted, onUnmounted, createElementBlock, openBlock, withModifiers, normalizeStyle, normalizeClass, createElementVNode, createVNode } from "vue";
|
|
9
|
+
import { defineComponent, ref, reactive, h, onMounted, onUnmounted, createElementBlock, openBlock, withModifiers, normalizeStyle, normalizeClass, createElementVNode, createVNode, nextTick } from "vue";
|
|
10
10
|
import { StkTable as _sfc_main$1 } from "./stk-table-vue.js";
|
|
11
|
+
const DROPDOWN_DEFAULT_WIDTH = 300;
|
|
12
|
+
const DROPDOWN_DEFAULT_HEIGHT = 400;
|
|
13
|
+
const PADDING = 6;
|
|
11
14
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
12
15
|
__name: "index",
|
|
13
16
|
setup(__props, { expose: __expose }) {
|
|
@@ -21,8 +24,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
21
24
|
className: "stk-filter-dropdown-checkbox",
|
|
22
25
|
customCell: ({ row }) => h("input", {
|
|
23
26
|
type: "checkbox",
|
|
24
|
-
checked: checkedTempValueSet.has(row.value)
|
|
25
|
-
onClick: (e) => e.preventDefault()
|
|
27
|
+
checked: checkedTempValueSet.has(row.value)
|
|
26
28
|
})
|
|
27
29
|
},
|
|
28
30
|
{ title: "", dataIndex: "label", customCell: ({ row }) => h("span", [row.label]) }
|
|
@@ -38,12 +40,51 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
38
40
|
document.removeEventListener("click", handleClickOutside);
|
|
39
41
|
});
|
|
40
42
|
let onConfirmFn;
|
|
41
|
-
function
|
|
43
|
+
function getDropdownSize() {
|
|
44
|
+
if (!dropdownEl.value) {
|
|
45
|
+
return [DROPDOWN_DEFAULT_WIDTH, DROPDOWN_DEFAULT_HEIGHT];
|
|
46
|
+
}
|
|
47
|
+
const rect = dropdownEl.value.getBoundingClientRect();
|
|
48
|
+
return [rect.width || DROPDOWN_DEFAULT_WIDTH, rect.height || DROPDOWN_DEFAULT_HEIGHT];
|
|
49
|
+
}
|
|
50
|
+
function calculatePosition(docPos) {
|
|
51
|
+
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
52
|
+
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
|
|
53
|
+
const viewportWidth = document.documentElement.clientWidth;
|
|
54
|
+
const viewportHeight = document.documentElement.clientHeight;
|
|
55
|
+
const [dropdownWidth, dropdownHeight] = getDropdownSize();
|
|
56
|
+
let finalX = docPos.x;
|
|
57
|
+
let finalY = docPos.y;
|
|
58
|
+
const relativeX = docPos.x - scrollLeft;
|
|
59
|
+
if (relativeX + dropdownWidth > viewportWidth - PADDING) {
|
|
60
|
+
finalX = viewportWidth - dropdownWidth - PADDING + scrollLeft;
|
|
61
|
+
}
|
|
62
|
+
const relativeY = docPos.y - scrollTop;
|
|
63
|
+
if (relativeY + dropdownHeight > viewportHeight - PADDING) {
|
|
64
|
+
const triggerHeight = docPos.height || 30;
|
|
65
|
+
if (relativeY - triggerHeight >= dropdownHeight + PADDING) {
|
|
66
|
+
finalY = docPos.y - triggerHeight - dropdownHeight - PADDING;
|
|
67
|
+
} else {
|
|
68
|
+
finalY = PADDING + scrollTop;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
finalX = Math.max(PADDING + scrollLeft, finalX);
|
|
72
|
+
finalY = Math.max(PADDING + scrollTop, finalY);
|
|
73
|
+
return { x: finalX, y: finalY };
|
|
74
|
+
}
|
|
75
|
+
async function show(pos, opt, onConfirm) {
|
|
76
|
+
if (dropdownEl.value) {
|
|
77
|
+
dropdownEl.value.style.visibility = "hidden";
|
|
78
|
+
}
|
|
42
79
|
visible.value = true;
|
|
43
|
-
position.value = pos;
|
|
44
80
|
options.value = opt || [];
|
|
45
81
|
initChecked();
|
|
46
82
|
onConfirmFn = onConfirm;
|
|
83
|
+
await nextTick();
|
|
84
|
+
position.value = calculatePosition(pos);
|
|
85
|
+
if (dropdownEl.value) {
|
|
86
|
+
dropdownEl.value.style.visibility = "visible";
|
|
87
|
+
}
|
|
47
88
|
}
|
|
48
89
|
async function handleClickOutside(e) {
|
|
49
90
|
var _a;
|
|
@@ -83,6 +124,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
83
124
|
}
|
|
84
125
|
function handleClear() {
|
|
85
126
|
checkedTempValueSet.clear();
|
|
127
|
+
confirm();
|
|
86
128
|
}
|
|
87
129
|
__expose({ visible, show, hide, setTheme });
|
|
88
130
|
return (_ctx, _cache) => {
|
|
@@ -90,7 +132,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
90
132
|
ref_key: "dropdownEl",
|
|
91
133
|
ref: dropdownEl,
|
|
92
134
|
class: normalizeClass(["stk-filter-dropdown", [`stk-filter-dropdown--${theme.value}`]]),
|
|
93
|
-
style: normalizeStyle({
|
|
135
|
+
style: normalizeStyle({
|
|
136
|
+
top: position.value.y + "px",
|
|
137
|
+
left: position.value.x + "px",
|
|
138
|
+
display: visible.value ? void 0 : "none"
|
|
139
|
+
}),
|
|
94
140
|
onClick: _cache[0] || (_cache[0] = withModifiers(() => {
|
|
95
141
|
}, ["stop"]))
|
|
96
142
|
}, [
|
|
@@ -418,7 +418,13 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
418
418
|
})) | (UniqKey | (PrivateRowDT & {
|
|
419
419
|
children?: (PrivateRowDT & /*elided*/ any)[];
|
|
420
420
|
}))[], option?: {
|
|
421
|
-
expand
|
|
421
|
+
expand
|
|
422
|
+
/**
|
|
423
|
+
* props cannot be placed in a separate file. It will cause compilation errors with vue 2.7 compiler.
|
|
424
|
+
*/
|
|
425
|
+
? /**
|
|
426
|
+
* props cannot be placed in a separate file. It will cause compilation errors with vue 2.7 compiler.
|
|
427
|
+
*/: boolean;
|
|
422
428
|
}) => void;
|
|
423
429
|
/**
|
|
424
430
|
* čˇĺćééä¸çĺĺ
ć źäżĄćŻ
|
|
@@ -745,6 +751,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
745
751
|
row: DT;
|
|
746
752
|
col: StkTableColumn<DT> | null;
|
|
747
753
|
}) => any) | undefined;
|
|
754
|
+
"onSort-change"?: ((col: StkTableColumn<any> | null, order: Order, data: any[], sortConfig: SortConfig<any>) => any) | undefined;
|
|
748
755
|
"onTh-drag-start"?: ((dragStartKey: string) => any) | undefined;
|
|
749
756
|
"onTh-drop"?: ((targetColKey: string) => any) | undefined;
|
|
750
757
|
"onCol-order-change"?: ((dragStartKey: string, targetColKey: string) => any) | undefined;
|
|
@@ -754,7 +761,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
754
761
|
row: DT;
|
|
755
762
|
col: StkTableColumn<DT> | null;
|
|
756
763
|
}) => any) | undefined;
|
|
757
|
-
"onSort-change"?: ((col: StkTableColumn<any> | null, order: Order, data: any[], sortConfig: SortConfig<any>) => any) | undefined;
|
|
758
764
|
"onRow-click"?: ((ev: MouseEvent, row: any, data: {
|
|
759
765
|
rowIndex: number;
|
|
760
766
|
}) => any) | undefined;
|
|
@@ -3,7 +3,8 @@ export declare function getDropdownIns(): Promise<import('vue').CreateComponentP
|
|
|
3
3
|
show: (pos: {
|
|
4
4
|
x: number;
|
|
5
5
|
y: number;
|
|
6
|
-
|
|
6
|
+
height?: number;
|
|
7
|
+
}, opt: import('../types').FilterOption[], onConfirm: (values: import('../types').FilterOption["value"][]) => void) => Promise<void>;
|
|
7
8
|
hide: () => void;
|
|
8
9
|
setTheme: (t: "light" | "dark") => void;
|
|
9
10
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
@@ -18,7 +19,8 @@ export declare function getDropdownIns(): Promise<import('vue').CreateComponentP
|
|
|
18
19
|
show: (pos: {
|
|
19
20
|
x: number;
|
|
20
21
|
y: number;
|
|
21
|
-
|
|
22
|
+
height?: number;
|
|
23
|
+
}, opt: import('../types').FilterOption[], onConfirm: (values: import('../types').FilterOption["value"][]) => void) => Promise<void>;
|
|
22
24
|
hide: () => void;
|
|
23
25
|
setTheme: (t: "light" | "dark") => void;
|
|
24
26
|
}, {}, {}, {}, {}>>;
|
|
@@ -3,7 +3,8 @@ import { FilterOption } from '../types';
|
|
|
3
3
|
declare function show(pos: {
|
|
4
4
|
x: number;
|
|
5
5
|
y: number;
|
|
6
|
-
|
|
6
|
+
height?: number;
|
|
7
|
+
}, opt: FilterOption[], onConfirm: (values: FilterOption['value'][]) => void): Promise<void>;
|
|
7
8
|
declare function hide(): void;
|
|
8
9
|
declare function setTheme(t: 'light' | 'dark'): void;
|
|
9
10
|
declare const _default: import('vue').DefineComponent<{}, {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const MY_FN_NAME = "stkName";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { useAreaSelection } from './useAreaSelection';
|
|
1
|
+
export { useAreaSelection, useAreaSelectionName } from './useAreaSelection';
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
import { useAreaSelection, useAreaSelectionName } from './features';
|
|
2
|
+
|
|
3
|
+
type OnDemandFeature = {
|
|
4
|
+
[useAreaSelectionName]: typeof useAreaSelection<any>;
|
|
5
|
+
};
|
|
2
6
|
export declare const ON_DEMAND_FEATURE: OnDemandFeature;
|
|
3
7
|
type Feature = OnDemandFeature[keyof OnDemandFeature];
|
|
4
8
|
export declare function registerFeature(feature: Feature | Feature[]): void;
|
|
@@ -254,12 +254,13 @@ export type SortConfig<T extends Record<string, any>> = {
|
|
|
254
254
|
multiSortLimit?: number;
|
|
255
255
|
};
|
|
256
256
|
/** th td type */
|
|
257
|
-
export declare const
|
|
258
|
-
TH
|
|
259
|
-
TD
|
|
257
|
+
export declare const TagType: {
|
|
258
|
+
readonly TH: 0;
|
|
259
|
+
readonly TD: 1;
|
|
260
260
|
/** tfoot */
|
|
261
|
-
TF
|
|
262
|
-
}
|
|
261
|
+
readonly TF: 2;
|
|
262
|
+
};
|
|
263
|
+
export type TagType = (typeof TagType)[keyof typeof TagType];
|
|
263
264
|
export type HighlightConfig = {
|
|
264
265
|
/** Duration of the highlight in seconds */
|
|
265
266
|
duration?: number;
|
|
@@ -325,6 +326,7 @@ export type AreaSelectionRange = {
|
|
|
325
326
|
};
|
|
326
327
|
/** ĺĺ
ć źéĺşé
罎 */
|
|
327
328
|
export type AreaSelectionConfig<T extends Record<string, any> = any> = {
|
|
329
|
+
/** default: true */
|
|
328
330
|
enabled?: boolean;
|
|
329
331
|
/**
|
|
330
332
|
* ĺ¤ĺśćśçĺĺ
ć źććŹć źĺźĺĺč°ă
|
|
@@ -2,4 +2,4 @@ import { ComputedRef, Ref, ShallowRef } from 'vue';
|
|
|
2
2
|
import { StkTableColumn, UniqKey } from './types';
|
|
3
3
|
|
|
4
4
|
/** ĺ厽ćĺ¨ */
|
|
5
|
-
export declare function useColResize<DT extends Record<string, any>>(props: any, emits: any, tableContainerRef: Ref<HTMLElement | undefined>, tableHeaderLast: ShallowRef<StkTableColumn<DT>[]>, colResizeIndicatorRef: Ref<HTMLElement | undefined>, colKeyGen: ComputedRef<(p: any) => UniqKey>, fixedCols: Ref<StkTableColumn<DT>[]
|
|
5
|
+
export declare function useColResize<DT extends Record<string, any>>(props: any, emits: any, tableContainerRef: Ref<HTMLElement | undefined>, tableHeaderLast: ShallowRef<StkTableColumn<DT>[]>, colResizeIndicatorRef: Ref<HTMLElement | undefined>, colKeyGen: ComputedRef<(p: any) => UniqKey>, fixedCols: Ref<StkTableColumn<DT>[]>, onColWidthChange?: () => void): readonly [ComputedRef<((col: StkTableColumn<DT>) => boolean) | (() => any)>, Ref<boolean, boolean>, (e: MouseEvent, col: StkTableColumn<DT>, leftHandle?: boolean) => void];
|
|
@@ -75,4 +75,4 @@ export declare function useVirtualScroll(props: any, tableContainerRef: Ref<HTML
|
|
|
75
75
|
endIndex: number;
|
|
76
76
|
offsetLeft: number;
|
|
77
77
|
scrollLeft: number;
|
|
78
|
-
}>, import('vue').ComputedRef<any>, import('vue').ComputedRef<PrivateRowDT[]>, import('vue').ComputedRef<number>, import('vue').ComputedRef<any>, import('vue').ComputedRef<PrivateStkTableColumn<PrivateRowDT>[]>, import('vue').ComputedRef<number>, import('vue').ComputedRef<number>, (height?: number) => void, (height?: number) => void, () => void, (sTop?: number) => void, (sLeft?: number) => void, (rowKey: UniqKey, height?: number | null) => void, () => void];
|
|
78
|
+
}>, import('vue').ComputedRef<any>, import('vue').ComputedRef<PrivateRowDT[]>, import('vue').ComputedRef<number>, import('vue').ComputedRef<any>, import('vue').ComputedRef<PrivateStkTableColumn<PrivateRowDT>[]>, import('vue').ComputedRef<number>, import('vue').ComputedRef<number>, (height?: number) => void, (height?: number) => void, () => void, (sTop?: number) => void, (sLeft?: number) => void, (rowKey: UniqKey, height?: number | null) => void, () => void, () => void];
|
|
@@ -68,3 +68,4 @@ export declare function throttle<T extends (...args: any[]) => any>(fn: T, delay
|
|
|
68
68
|
* @returns A throttled function that executes on the next animation frame
|
|
69
69
|
*/
|
|
70
70
|
export declare function rafThrottle<T extends (...args: any[]) => any>(fn: T): (...args: Parameters<T>) => void;
|
|
71
|
+
export declare function debounce<T extends (...args: any[]) => any>(fn: T, delay: number): (...args: Parameters<T>) => void;
|