stk-table-vue 0.0.1 → 0.0.2

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 (15) hide show
  1. package/README.md +12 -6
  2. package/lib/src/StkTable/StkTable.vue.d.ts +335 -335
  3. package/lib/src/StkTable/types/index.d.ts +60 -60
  4. package/lib/src/StkTable/useColResize.d.ts +18 -18
  5. package/lib/src/StkTable/useFixedStyle.d.ts +20 -19
  6. package/lib/src/StkTable/useKeyboardArrowScroll.d.ts +14 -14
  7. package/lib/src/StkTable/useThDrag.d.ts +14 -14
  8. package/lib/src/StkTable/useVirtualScroll.d.ts +73 -73
  9. package/lib/src/StkTable/utils.d.ts +23 -23
  10. package/lib/stk-table-vue.js +1269 -1263
  11. package/lib/style.css +286 -286
  12. package/package.json +60 -60
  13. package/src/StkTable/StkTable.vue +55 -20
  14. package/src/StkTable/useFixedStyle.ts +23 -29
  15. package/src/StkTable/utils.ts +3 -3
package/lib/style.css CHANGED
@@ -1,286 +1,286 @@
1
- @keyframes stkTableDim{
2
- from{
3
- background-color:var(--highlight-color);
4
- }
5
- }
6
- .stk-table{
7
- --row-height:28px;
8
- --cell-padding-x:8px;
9
- --resize-handle-width:4px;
10
- --border-color:#e8e8f4;
11
- --border-width:1px;
12
- --td-bgc:#fff;
13
- --th-bgc:#fafafc;
14
- --th-color:#272841;
15
- --tr-active-bgc:#e6f7ff;
16
- --tr-hover-bgc:rgba(230, 247, 255, 0.7);
17
- --bg-border-top:linear-gradient(180deg, var(--border-color) var(--border-width), transparent var(--border-width));
18
- --bg-border-right:linear-gradient(270deg, var(--border-color) var(--border-width), transparent var(--border-width));
19
- --bg-border-bottom:linear-gradient(0deg, var(--border-color) var(--border-width), transparent var(--border-width));
20
- --bg-border-left:linear-gradient(90deg, var(--border-color) var(--border-width), transparent var(--border-width));
21
- --highlight-color:#71a2fd;
22
- --stripe-bgc:#fafafc;
23
- --sort-arrow-color:#757699;
24
- --sort-arrow-hover-color:#8f90b5;
25
- --sort-arrow-active-color:#1b63d9;
26
- --sort-arrow-active-sub-color:#cbcbe1;
27
- --col-resize-indicator-color:#87879c;
28
- position:relative;
29
- overflow:auto;
30
- display:flex;
31
- flex-direction:column;
32
- }
33
- .stk-table.dark{
34
- --th-bgc:#202029;
35
- --th-color:#C0C0D1;
36
- --td-bgc:#1b1b24;
37
- --border-color:#292933;
38
- --tr-active-bgc:#283f63;
39
- --tr-hover-bgc:#1a2b46;
40
- --table-bgc:#1b1b24;
41
- --highlight-color:#1e4c99;
42
- --stripe-bgc:#202029;
43
- --sort-arrow-color:#5d6064;
44
- --sort-arrow-hover-color:#727782;
45
- --sort-arrow-active-color:#d0d1d2;
46
- --sort-arrow-active-sub-color:#5d6064;
47
- --col-resize-indicator-color:#5d6064;
48
- color:#d1d1e0;
49
- }
50
- .stk-table.headless{
51
- border-top:1px solid var(--border-color);
52
- }
53
- .stk-table.col-resizable .stk-table-main{
54
- width:-moz-fit-content !important;
55
- width:fit-content !important;
56
- min-width:-moz-min-content !important;
57
- min-width:min-content !important;
58
- }
59
- .stk-table.is-col-resizing th{
60
- pointer-events:none;
61
- }
62
- .stk-table.border-h{
63
- --bg-border-right:linear-gradient(transparent, transparent);
64
- --bg-border-left:linear-gradient(transparent, transparent);
65
- }
66
- .stk-table.border-v{
67
- --bg-border-bottom:linear-gradient(transparent, transparent);
68
- }
69
- .stk-table.border .stk-table-main th,
70
- .stk-table.border .stk-table-main td{
71
- background-image:var(--bg-border-right), var(--bg-border-bottom);
72
- }
73
- .stk-table.border .stk-table-main thead tr:first-child th{
74
- background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom);
75
- }
76
- .stk-table.border .stk-table-main thead tr:first-child th:first-child{
77
- background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
78
- }
79
- .stk-table.border .stk-table-main thead tr th:first-child{
80
- background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
81
- }
82
- .stk-table.border .stk-table-main tbody td:first-child{
83
- background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
84
- }
85
- .stk-table.border.virtual-x .stk-table-main .virtual-x-left{
86
- background:none;
87
- pointer-events:none;
88
- }
89
- .stk-table.border.virtual-x .stk-table-main .virtual-x-right{
90
- padding:0;
91
- background:none;
92
- pointer-events:none;
93
- }
94
- .stk-table.border.virtual-x .stk-table-main thead tr:first-child .virtual-x-left + th{
95
- background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
96
- }
97
- .stk-table.border.virtual-x .stk-table-main tr .virtual-x-left + th{
98
- background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
99
- }
100
- .stk-table.border-body-v .stk-table-main tbody{
101
- --bg-border-bottom:linear-gradient(transparent, transparent);
102
- }
103
- .stk-table.stripe .stk-table-main{
104
- }
105
- .stk-table.stripe .stk-table-main tbody tr:nth-child(odd){
106
- background-color:var(--stripe-bgc);
107
- }
108
- .stk-table.stripe .stk-table-main tbody tr:hover{
109
- background-color:var(--tr-hover-bgc);
110
- }
111
- .stk-table .column-resize-indicator{
112
- width:0;
113
- height:100%;
114
- border-left:2px solid var(--col-resize-indicator-color);
115
- position:absolute;
116
- z-index:10;
117
- display:none;
118
- pointer-events:none;
119
- }
120
- .stk-table .stk-table-main{
121
- border-spacing:0;
122
- border-collapse:separate;
123
- width:-moz-fit-content;
124
- width:fit-content;
125
- min-width:100%;
126
- }
127
- .stk-table .stk-table-main.fixed-mode{
128
- table-layout:fixed;
129
- min-width:-moz-min-content;
130
- min-width:min-content;
131
- }
132
- .stk-table .stk-table-main th,
133
- .stk-table .stk-table-main td{
134
- z-index:1;
135
- height:var(--row-height);
136
- font-size:14px;
137
- box-sizing:border-box;
138
- padding:0 var(--cell-padding-x);
139
- }
140
- .stk-table .stk-table-main th{
141
- color:var(--th-color);
142
- }
143
- .stk-table .stk-table-main thead tr:first-child th{
144
- position:sticky;
145
- top:0;
146
- }
147
- .stk-table .stk-table-main thead tr th{
148
- background-color:var(--th-bgc);
149
- }
150
- .stk-table .stk-table-main thead tr th.sortable{
151
- cursor:pointer;
152
- }
153
- .stk-table .stk-table-main thead tr th.text-overflow .table-header-cell-wrapper{
154
- white-space:nowrap;
155
- overflow:hidden;
156
- }
157
- .stk-table .stk-table-main thead tr th.text-overflow .table-header-cell-wrapper .table-header-title{
158
- text-overflow:ellipsis;
159
- overflow:hidden;
160
- }
161
- .stk-table .stk-table-main thead tr th:not(.sorter-desc):not(.sorter-asc):hover .table-header-cell-wrapper .table-header-sorter #arrow-up{
162
- fill:var(--sort-arrow-hover-color);
163
- }
164
- .stk-table .stk-table-main thead tr th:not(.sorter-desc):not(.sorter-asc):hover .table-header-cell-wrapper .table-header-sorter #arrow-down{
165
- fill:var(--sort-arrow-hover-color);
166
- }
167
- .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter{
168
- display:inline;
169
- display:initial;
170
- }
171
- .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter #arrow-up{
172
- fill:var(--sort-arrow-active-sub-color);
173
- }
174
- .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter #arrow-down{
175
- fill:var(--sort-arrow-active-color);
176
- }
177
- .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter{
178
- display:inline;
179
- display:initial;
180
- }
181
- .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter #arrow-up{
182
- fill:var(--sort-arrow-active-color);
183
- }
184
- .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter #arrow-down{
185
- fill:var(--sort-arrow-active-sub-color);
186
- }
187
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper{
188
- max-width:100%;
189
- display:inline-flex;
190
- align-items:center;
191
- }
192
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-title{
193
- overflow:hidden;
194
- align-self:flex-start;
195
- }
196
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter{
197
- flex-shrink:0;
198
- margin-left:4px;
199
- width:16px;
200
- height:16px;
201
- display:none;
202
- }
203
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter #arrow-up,
204
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter #arrow-down{
205
- fill:var(--sort-arrow-color);
206
- }
207
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer{
208
- position:absolute;
209
- top:0;
210
- bottom:0;
211
- cursor:col-resize;
212
- width:var(--resize-handle-width);
213
- }
214
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer.left{
215
- left:0;
216
- }
217
- .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer.right{
218
- right:0;
219
- }
220
- .stk-table .stk-table-main tbody tr{
221
- background-color:var(--td-bgc);
222
- }
223
- .stk-table .stk-table-main tbody tr.highlight-row{
224
- animation:stkTableDim 2s linear;
225
- }
226
- .stk-table .stk-table-main tbody tr.hover,
227
- .stk-table .stk-table-main tbody tr:hover{
228
- background-color:var(--tr-hover-bgc);
229
- }
230
- .stk-table .stk-table-main tbody tr.active{
231
- background-color:var(--tr-active-bgc);
232
- }
233
- .stk-table .stk-table-main tbody tr td{
234
- }
235
- .stk-table .stk-table-main tbody tr td.fixed-cell{
236
- background-color:inherit;
237
- }
238
- .stk-table .stk-table-main tbody tr td.highlight-cell{
239
- animation:stkTableDim 2s linear;
240
- }
241
- .stk-table .stk-table-main tbody tr td.text-overflow .table-cell-wrapper{
242
- white-space:nowrap;
243
- overflow:hidden;
244
- text-overflow:ellipsis;
245
- }
246
- .stk-table .stk-table-no-data{
247
- background-color:var(--table-bgc);
248
- line-height:var(--row-height);
249
- text-align:center;
250
- font-size:14px;
251
- position:sticky;
252
- left:0px;
253
- border-left:var(--border-width) solid var(--border-color);
254
- border-right:var(--border-width) solid var(--border-color);
255
- border-bottom:var(--border-width) solid var(--border-color);
256
- display:flex;
257
- flex-direction:column;
258
- align-items:center;
259
- justify-content:center;
260
- }
261
- .stk-table .stk-table-no-data.no-data-full{
262
- flex:1;
263
- }
264
- .stk-table.virtual .stk-table-main thead tr th{
265
- }
266
- .stk-table.virtual .stk-table-main thead tr th .table-header-cell-wrapper{
267
- overflow:hidden;
268
- max-height:var(--row-height);
269
- }
270
- .stk-table.virtual .stk-table-main tbody{
271
- position:relative;
272
- }
273
- .stk-table.virtual .stk-table-main tbody tr.padding-top-tr td{
274
- height:0;
275
- }
276
- .stk-table.virtual .stk-table-main tbody tr td{
277
- height:var(--row-height);
278
- line-height:1;
279
- }
280
- .stk-table.virtual .stk-table-main tbody tr td .table-cell-wrapper{
281
- max-height:var(--row-height);
282
- overflow:hidden;
283
- }
284
- .stk-table.virtual-x .stk-table-main .virtual-x-left{
285
- padding:0;
286
- }
1
+ @keyframes stkTableDim{
2
+ from{
3
+ background-color:var(--highlight-color);
4
+ }
5
+ }
6
+ .stk-table{
7
+ --row-height:28px;
8
+ --cell-padding-x:8px;
9
+ --resize-handle-width:4px;
10
+ --border-color:#e8e8f4;
11
+ --border-width:1px;
12
+ --td-bgc:#fff;
13
+ --th-bgc:#fafafc;
14
+ --th-color:#272841;
15
+ --tr-active-bgc:#e6f7ff;
16
+ --tr-hover-bgc:rgba(230, 247, 255, 0.7);
17
+ --bg-border-top:linear-gradient(180deg, var(--border-color) var(--border-width), transparent var(--border-width));
18
+ --bg-border-right:linear-gradient(270deg, var(--border-color) var(--border-width), transparent var(--border-width));
19
+ --bg-border-bottom:linear-gradient(0deg, var(--border-color) var(--border-width), transparent var(--border-width));
20
+ --bg-border-left:linear-gradient(90deg, var(--border-color) var(--border-width), transparent var(--border-width));
21
+ --highlight-color:#71a2fd;
22
+ --stripe-bgc:#fafafc;
23
+ --sort-arrow-color:#757699;
24
+ --sort-arrow-hover-color:#8f90b5;
25
+ --sort-arrow-active-color:#1b63d9;
26
+ --sort-arrow-active-sub-color:#cbcbe1;
27
+ --col-resize-indicator-color:#87879c;
28
+ position:relative;
29
+ overflow:auto;
30
+ display:flex;
31
+ flex-direction:column;
32
+ }
33
+ .stk-table.dark{
34
+ --th-bgc:#202029;
35
+ --th-color:#C0C0D1;
36
+ --td-bgc:#1b1b24;
37
+ --border-color:#292933;
38
+ --tr-active-bgc:#283f63;
39
+ --tr-hover-bgc:#1a2b46;
40
+ --table-bgc:#1b1b24;
41
+ --highlight-color:#1e4c99;
42
+ --stripe-bgc:#202029;
43
+ --sort-arrow-color:#5d6064;
44
+ --sort-arrow-hover-color:#727782;
45
+ --sort-arrow-active-color:#d0d1d2;
46
+ --sort-arrow-active-sub-color:#5d6064;
47
+ --col-resize-indicator-color:#5d6064;
48
+ color:#d1d1e0;
49
+ }
50
+ .stk-table.headless{
51
+ border-top:1px solid var(--border-color);
52
+ }
53
+ .stk-table.col-resizable .stk-table-main{
54
+ width:-moz-fit-content !important;
55
+ width:fit-content !important;
56
+ min-width:-moz-min-content !important;
57
+ min-width:min-content !important;
58
+ }
59
+ .stk-table.is-col-resizing th{
60
+ pointer-events:none;
61
+ }
62
+ .stk-table.border-h{
63
+ --bg-border-right:linear-gradient(transparent, transparent);
64
+ --bg-border-left:linear-gradient(transparent, transparent);
65
+ }
66
+ .stk-table.border-v{
67
+ --bg-border-bottom:linear-gradient(transparent, transparent);
68
+ }
69
+ .stk-table.border .stk-table-main th,
70
+ .stk-table.border .stk-table-main td{
71
+ background-image:var(--bg-border-right), var(--bg-border-bottom);
72
+ }
73
+ .stk-table.border .stk-table-main thead tr:first-child th{
74
+ background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom);
75
+ }
76
+ .stk-table.border .stk-table-main thead tr:first-child th:first-child{
77
+ background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
78
+ }
79
+ .stk-table.border .stk-table-main thead tr th:first-child{
80
+ background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
81
+ }
82
+ .stk-table.border .stk-table-main tbody td:first-child{
83
+ background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
84
+ }
85
+ .stk-table.border.virtual-x .stk-table-main .virtual-x-left{
86
+ background:none;
87
+ pointer-events:none;
88
+ }
89
+ .stk-table.border.virtual-x .stk-table-main .virtual-x-right{
90
+ padding:0;
91
+ background:none;
92
+ pointer-events:none;
93
+ }
94
+ .stk-table.border.virtual-x .stk-table-main thead tr:first-child .virtual-x-left + th{
95
+ background-image:var(--bg-border-top), var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
96
+ }
97
+ .stk-table.border.virtual-x .stk-table-main tr .virtual-x-left + th{
98
+ background-image:var(--bg-border-right), var(--bg-border-bottom), var(--bg-border-left);
99
+ }
100
+ .stk-table.border-body-v .stk-table-main tbody{
101
+ --bg-border-bottom:linear-gradient(transparent, transparent);
102
+ }
103
+ .stk-table.stripe .stk-table-main{
104
+ }
105
+ .stk-table.stripe .stk-table-main tbody tr:nth-child(odd){
106
+ background-color:var(--stripe-bgc);
107
+ }
108
+ .stk-table.stripe .stk-table-main tbody tr:hover{
109
+ background-color:var(--tr-hover-bgc);
110
+ }
111
+ .stk-table .column-resize-indicator{
112
+ width:0;
113
+ height:100%;
114
+ border-left:2px solid var(--col-resize-indicator-color);
115
+ position:absolute;
116
+ z-index:10;
117
+ display:none;
118
+ pointer-events:none;
119
+ }
120
+ .stk-table .stk-table-main{
121
+ border-spacing:0;
122
+ border-collapse:separate;
123
+ width:-moz-fit-content;
124
+ width:fit-content;
125
+ min-width:100%;
126
+ }
127
+ .stk-table .stk-table-main.fixed-mode{
128
+ table-layout:fixed;
129
+ min-width:-moz-min-content;
130
+ min-width:min-content;
131
+ }
132
+ .stk-table .stk-table-main th,
133
+ .stk-table .stk-table-main td{
134
+ z-index:1;
135
+ height:var(--row-height);
136
+ font-size:14px;
137
+ box-sizing:border-box;
138
+ padding:0 var(--cell-padding-x);
139
+ }
140
+ .stk-table .stk-table-main th{
141
+ color:var(--th-color);
142
+ }
143
+ .stk-table .stk-table-main thead tr:first-child th{
144
+ position:sticky;
145
+ top:0;
146
+ }
147
+ .stk-table .stk-table-main thead tr th{
148
+ background-color:var(--th-bgc);
149
+ }
150
+ .stk-table .stk-table-main thead tr th.sortable{
151
+ cursor:pointer;
152
+ }
153
+ .stk-table .stk-table-main thead tr th.text-overflow .table-header-cell-wrapper{
154
+ white-space:nowrap;
155
+ overflow:hidden;
156
+ }
157
+ .stk-table .stk-table-main thead tr th.text-overflow .table-header-cell-wrapper .table-header-title{
158
+ text-overflow:ellipsis;
159
+ overflow:hidden;
160
+ }
161
+ .stk-table .stk-table-main thead tr th:not(.sorter-desc):not(.sorter-asc):hover .table-header-cell-wrapper .table-header-sorter #arrow-up{
162
+ fill:var(--sort-arrow-hover-color);
163
+ }
164
+ .stk-table .stk-table-main thead tr th:not(.sorter-desc):not(.sorter-asc):hover .table-header-cell-wrapper .table-header-sorter #arrow-down{
165
+ fill:var(--sort-arrow-hover-color);
166
+ }
167
+ .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter{
168
+ display:inline;
169
+ display:initial;
170
+ }
171
+ .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter #arrow-up{
172
+ fill:var(--sort-arrow-active-sub-color);
173
+ }
174
+ .stk-table .stk-table-main thead tr th.sorter-desc .table-header-cell-wrapper .table-header-sorter #arrow-down{
175
+ fill:var(--sort-arrow-active-color);
176
+ }
177
+ .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter{
178
+ display:inline;
179
+ display:initial;
180
+ }
181
+ .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter #arrow-up{
182
+ fill:var(--sort-arrow-active-color);
183
+ }
184
+ .stk-table .stk-table-main thead tr th.sorter-asc .table-header-cell-wrapper .table-header-sorter #arrow-down{
185
+ fill:var(--sort-arrow-active-sub-color);
186
+ }
187
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper{
188
+ max-width:100%;
189
+ display:inline-flex;
190
+ align-items:center;
191
+ }
192
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-title{
193
+ overflow:hidden;
194
+ align-self:flex-start;
195
+ }
196
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter{
197
+ flex-shrink:0;
198
+ margin-left:4px;
199
+ width:16px;
200
+ height:16px;
201
+ display:none;
202
+ }
203
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter #arrow-up,
204
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-sorter #arrow-down{
205
+ fill:var(--sort-arrow-color);
206
+ }
207
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer{
208
+ position:absolute;
209
+ top:0;
210
+ bottom:0;
211
+ cursor:col-resize;
212
+ width:var(--resize-handle-width);
213
+ }
214
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer.left{
215
+ left:0;
216
+ }
217
+ .stk-table .stk-table-main thead tr th .table-header-cell-wrapper .table-header-resizer.right{
218
+ right:0;
219
+ }
220
+ .stk-table .stk-table-main tbody tr{
221
+ background-color:var(--td-bgc);
222
+ }
223
+ .stk-table .stk-table-main tbody tr.highlight-row{
224
+ animation:stkTableDim 2s linear;
225
+ }
226
+ .stk-table .stk-table-main tbody tr.hover,
227
+ .stk-table .stk-table-main tbody tr:hover{
228
+ background-color:var(--tr-hover-bgc);
229
+ }
230
+ .stk-table .stk-table-main tbody tr.active{
231
+ background-color:var(--tr-active-bgc);
232
+ }
233
+ .stk-table .stk-table-main tbody tr td{
234
+ }
235
+ .stk-table .stk-table-main tbody tr td.fixed-cell{
236
+ background-color:inherit;
237
+ }
238
+ .stk-table .stk-table-main tbody tr td.highlight-cell{
239
+ animation:stkTableDim 2s linear;
240
+ }
241
+ .stk-table .stk-table-main tbody tr td.text-overflow .table-cell-wrapper{
242
+ white-space:nowrap;
243
+ overflow:hidden;
244
+ text-overflow:ellipsis;
245
+ }
246
+ .stk-table .stk-table-no-data{
247
+ background-color:var(--table-bgc);
248
+ line-height:var(--row-height);
249
+ text-align:center;
250
+ font-size:14px;
251
+ position:sticky;
252
+ left:0px;
253
+ border-left:var(--border-width) solid var(--border-color);
254
+ border-right:var(--border-width) solid var(--border-color);
255
+ border-bottom:var(--border-width) solid var(--border-color);
256
+ display:flex;
257
+ flex-direction:column;
258
+ align-items:center;
259
+ justify-content:center;
260
+ }
261
+ .stk-table .stk-table-no-data.no-data-full{
262
+ flex:1;
263
+ }
264
+ .stk-table.virtual .stk-table-main thead tr th{
265
+ }
266
+ .stk-table.virtual .stk-table-main thead tr th .table-header-cell-wrapper{
267
+ overflow:hidden;
268
+ max-height:var(--row-height);
269
+ }
270
+ .stk-table.virtual .stk-table-main tbody{
271
+ position:relative;
272
+ }
273
+ .stk-table.virtual .stk-table-main tbody tr.padding-top-tr td{
274
+ height:0;
275
+ }
276
+ .stk-table.virtual .stk-table-main tbody tr td{
277
+ height:var(--row-height);
278
+ line-height:1;
279
+ }
280
+ .stk-table.virtual .stk-table-main tbody tr td .table-cell-wrapper{
281
+ max-height:var(--row-height);
282
+ overflow:hidden;
283
+ }
284
+ .stk-table.virtual-x .stk-table-main .virtual-x-left{
285
+ padding:0;
286
+ }