@nmorph/nmorph-ui-kit 2.2.15 → 2.2.16
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 +0 -8
- package/dist/components/basic/nmorph-button/NmorphButton.css +1 -1
- package/dist/components/basic/nmorph-button/NmorphButton.vue.js +12 -12
- package/dist/components/basic/nmorph-button/NmorphButton.vue2.js +17 -14
- package/dist/components/data/nmorph-calendar/NmorphCalendar.vue2.js +1 -1
- package/dist/components/data/nmorph-calendar/utils.js +65 -52
- package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue.js +39 -37
- package/dist/components/data/nmorph-table/NmorphTable.css +1 -1
- package/dist/components/data/nmorph-table/NmorphTable.vue.js +228 -225
- package/dist/components/data/nmorph-table/NmorphTable.vue2.js +57 -43
- package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue.js +47 -47
- package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue2.js +28 -25
- package/dist/components/form/nmorph-autocomplete/NmorphAutocomplete.css +1 -1
- package/dist/components/form/nmorph-autocomplete/NmorphAutocomplete.vue.js +102 -92
- package/dist/components/form/nmorph-autocomplete/NmorphAutocomplete.vue2.js +67 -44
- package/dist/components/form/nmorph-date-picker/NmorphDatePicker.css +1 -1
- package/dist/components/form/nmorph-date-picker/NmorphDatePicker.vue2.js +45 -33
- package/dist/components/form/nmorph-date-picker/inner-components/nmorph-date-picker-content/NmorphDatePickerContent.vue2.js +1 -1
- package/dist/components/form/nmorph-select/NmorphSelect.css +1 -1
- package/dist/components/form/nmorph-select/NmorphSelect.vue.js +135 -125
- package/dist/components/form/nmorph-select/NmorphSelect.vue2.js +76 -65
- package/dist/components/form/nmorph-select/components/nmorph-select-option/NmorphSelectOption.vue.js +15 -12
- package/dist/components/form/nmorph-text-input/NmorphTextInput.vue.js +22 -21
- package/dist/components/form/nmorph-text-input/NmorphTextInput.vue2.js +16 -16
- package/dist/components/navigation/nmorph-context-menu/NmorphContextMenu.css +1 -0
- package/dist/components/navigation/nmorph-context-menu/NmorphContextMenu.vue.js +50 -0
- package/dist/components/navigation/nmorph-context-menu/NmorphContextMenu.vue2.js +69 -0
- package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.css +1 -1
- package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue.js +23 -23
- package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue2.js +31 -25
- package/dist/components/others/nmorph-overlay/NmorphOverlay.vue.js +42 -18
- package/dist/components/others/nmorph-overlay/NmorphOverlay.vue2.js +66 -19
- package/dist/hooks/use-common-styles.js +42 -33
- package/dist/hooks/use-virtual-list.js +65 -37
- package/dist/icons.d.ts +2 -0
- package/dist/icons.js +539 -0
- package/dist/index.es.js +656 -653
- package/dist/index.umd.js +62 -64
- package/dist/nuxt.mjs +3 -3
- package/dist/package.json.js +1 -1
- package/dist/src/components/data/nmorph-calendar/types.d.ts +8 -1
- package/dist/src/components/data/nmorph-calendar/utils.d.ts +2 -1
- package/dist/src/components/data/nmorph-table/NmorphTable.vue.d.ts +2 -0
- package/dist/src/components/feedback/nmorph-dialog/NmorphDialog.vue.d.ts +2 -0
- package/dist/src/components/form/nmorph-autocomplete/NmorphAutocomplete.vue.d.ts +2 -0
- package/dist/src/components/form/nmorph-date-picker/NmorphDatePicker.vue.d.ts +13 -1
- package/dist/src/components/form/nmorph-select/NmorphSelect.vue.d.ts +2 -0
- package/dist/src/components/form/nmorph-text-input/NmorphTextInput.vue.d.ts +2 -0
- package/dist/src/components/navigation/index.d.ts +1 -0
- package/dist/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue.d.ts +60 -0
- package/dist/src/components/navigation/nmorph-dropdown/NmorphDropdown.vue.d.ts +10 -0
- package/dist/src/components/others/nmorph-overlay/NmorphOverlay.vue.d.ts +12 -1
- package/dist/src/hooks/use-virtual-list.d.ts +3 -0
- package/dist/src/icons.d.ts +3 -0
- package/dist/src/styles.d.ts +2 -0
- package/dist/style.css +1 -1
- package/dist/styles.d.ts +2 -0
- package/dist/styles.js +7 -0
- package/dist/utils/theme-style.js +27 -38
- package/package.json +11 -1
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import './NmorphTable.css';
|
|
2
|
-
import
|
|
3
|
-
import { openBlock as
|
|
2
|
+
import p from "./NmorphTable.vue2.js";
|
|
3
|
+
import { openBlock as r, createElementBlock as t, normalizeClass as _, createElementVNode as o, Fragment as a, renderList as i, normalizeStyle as d, toDisplayString as s, createBlock as m, createCommentVNode as y, renderSlot as h } from "vue";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import
|
|
6
|
-
const
|
|
7
|
-
function E(c,
|
|
8
|
-
return
|
|
9
|
-
(
|
|
5
|
+
import u from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
6
|
+
const v = { class: "nmorph-table__wrapper" }, w = { class: "nmorph-table__header" }, f = ["data-src"], g = { class: "nmorph-table__table-row" }, k = { class: "nmorph-table__cell" }, x = ["tabindex"], S = ["id"], R = { class: "nmorph-table__slot-columns" }, W = ["id"], B = { class: "nmorph-table__slot-columns" };
|
|
7
|
+
function E(c, H, N, l, C, I) {
|
|
8
|
+
return r(), t("div", null, [
|
|
9
|
+
(r(), t(
|
|
10
10
|
"div",
|
|
11
11
|
{
|
|
12
12
|
ref: "nmorphDOMTable",
|
|
@@ -14,54 +14,54 @@ function E(c, h, H, l, L, C) {
|
|
|
14
14
|
class: _(l.modifiers)
|
|
15
15
|
},
|
|
16
16
|
[
|
|
17
|
-
o("div",
|
|
18
|
-
o("table",
|
|
17
|
+
o("div", v, [
|
|
18
|
+
o("table", w, [
|
|
19
19
|
o("colgroup", null, [
|
|
20
|
-
(
|
|
21
|
-
|
|
20
|
+
(r(!0), t(
|
|
21
|
+
a,
|
|
22
22
|
null,
|
|
23
|
-
i(l.columns, (
|
|
24
|
-
key:
|
|
25
|
-
style: d({ width: `${l.getWidth(
|
|
26
|
-
"data-src": `${l.getWidth(
|
|
27
|
-
}, null, 12,
|
|
23
|
+
i(l.columns, (e) => (r(), t("col", {
|
|
24
|
+
key: e.prop,
|
|
25
|
+
style: d({ width: `${l.getWidth(e.width)}px` }),
|
|
26
|
+
"data-src": `${l.getWidth(e.width)}px`
|
|
27
|
+
}, null, 12, f))),
|
|
28
28
|
128
|
|
29
29
|
/* KEYED_FRAGMENT */
|
|
30
30
|
))
|
|
31
31
|
]),
|
|
32
32
|
o("thead", null, [
|
|
33
33
|
o("tr", g, [
|
|
34
|
-
(
|
|
35
|
-
|
|
34
|
+
(r(!0), t(
|
|
35
|
+
a,
|
|
36
36
|
null,
|
|
37
|
-
i(l.columns, (
|
|
37
|
+
i(l.columns, (e, b) => (r(), t(
|
|
38
38
|
"th",
|
|
39
39
|
{
|
|
40
|
-
key:
|
|
40
|
+
key: b,
|
|
41
41
|
class: _(["nmorph-table__table-data", { "nmorph-table__table-data--bordered": l.props.bordered }])
|
|
42
42
|
},
|
|
43
43
|
[
|
|
44
|
-
o("div",
|
|
44
|
+
o("div", k, [
|
|
45
45
|
o(
|
|
46
46
|
"div",
|
|
47
47
|
{
|
|
48
|
-
style: d({ "justify-content":
|
|
48
|
+
style: d({ "justify-content": e.alignment }),
|
|
49
49
|
class: "nmorph-table__cell-content"
|
|
50
50
|
},
|
|
51
51
|
[
|
|
52
52
|
o(
|
|
53
53
|
"span",
|
|
54
54
|
null,
|
|
55
|
-
|
|
55
|
+
s(e.label),
|
|
56
56
|
1
|
|
57
57
|
/* TEXT */
|
|
58
58
|
),
|
|
59
|
-
l.sortData && l.sortData[
|
|
59
|
+
l.sortData && l.sortData[e.prop] ? (r(), m(l.NmorphSortButton, {
|
|
60
60
|
key: 0,
|
|
61
61
|
class: "nmorph-table__button-wrapper",
|
|
62
|
-
value: l.sortData[
|
|
63
|
-
onSort: (
|
|
64
|
-
}, null, 8, ["value", "onSort"])) :
|
|
62
|
+
value: l.sortData[e.prop],
|
|
63
|
+
onSort: (n) => l.onSort(n, e.prop)
|
|
64
|
+
}, null, 8, ["value", "onSort"])) : y("v-if", !0)
|
|
65
65
|
],
|
|
66
66
|
4
|
|
67
67
|
/* STYLE */
|
|
@@ -77,82 +77,176 @@ function E(c, h, H, l, L, C) {
|
|
|
77
77
|
])
|
|
78
78
|
])
|
|
79
79
|
]),
|
|
80
|
-
o(
|
|
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
|
-
|
|
80
|
+
o("div", {
|
|
81
|
+
ref: l.virtualList.containerRef,
|
|
82
|
+
class: _(["nmorph-table__body", { "nmorph-table__body--virtual": l.virtualEnabled, "nmorph-table__body--dynamic": l.props.virtualDynamicHeight }]),
|
|
83
|
+
style: d(l.tableBodyStyle),
|
|
84
|
+
tabindex: l.virtualEnabled ? 0 : void 0,
|
|
85
|
+
role: "grid",
|
|
86
|
+
onKeydown: l.tableKeydownHandler,
|
|
87
|
+
onScroll: l.scrollHandler
|
|
88
|
+
}, [
|
|
89
|
+
l.virtualEnabled ? (r(), t(
|
|
90
|
+
"div",
|
|
91
|
+
{
|
|
92
|
+
key: 0,
|
|
93
|
+
class: "nmorph-table__virtual-spacer",
|
|
94
|
+
style: d(l.virtualSpacerStyle)
|
|
95
|
+
},
|
|
96
|
+
[
|
|
97
|
+
o(
|
|
98
|
+
"div",
|
|
99
|
+
{
|
|
100
|
+
class: "nmorph-table__virtual-content",
|
|
101
|
+
style: d(l.virtualContentStyle)
|
|
102
|
+
},
|
|
103
|
+
[
|
|
104
|
+
o("table", null, [
|
|
105
|
+
o("colgroup", null, [
|
|
106
|
+
(r(!0), t(
|
|
107
|
+
a,
|
|
108
|
+
null,
|
|
109
|
+
i(l.columns, (e) => (r(), t(
|
|
110
|
+
"col",
|
|
111
|
+
{
|
|
112
|
+
key: e.prop,
|
|
113
|
+
style: d({ width: `${l.getWidth(e.width)}px` })
|
|
114
|
+
},
|
|
108
115
|
null,
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
116
|
+
4
|
|
117
|
+
/* STYLE */
|
|
118
|
+
))),
|
|
119
|
+
128
|
|
120
|
+
/* KEYED_FRAGMENT */
|
|
121
|
+
))
|
|
122
|
+
]),
|
|
123
|
+
o("tbody", null, [
|
|
124
|
+
(r(!0), t(
|
|
125
|
+
a,
|
|
126
|
+
null,
|
|
127
|
+
i(l.renderedRows, (e, b) => (r(), t(
|
|
128
|
+
"tr",
|
|
129
|
+
{
|
|
130
|
+
key: e.index,
|
|
131
|
+
ref_for: !0,
|
|
132
|
+
ref: (n) => l.setVirtualRowRef(n, e.index),
|
|
133
|
+
class: _(["nmorph-table__table-data-row", {
|
|
134
|
+
"nmorph-table__table-data-row--row-hover": l.props.rowHover,
|
|
135
|
+
"nmorph-table__table-data-row--active": l.activeRowIndex === e.index
|
|
136
|
+
}]),
|
|
137
|
+
role: "row"
|
|
138
|
+
},
|
|
139
|
+
[
|
|
140
|
+
(r(!0), t(
|
|
141
|
+
a,
|
|
142
|
+
null,
|
|
143
|
+
i(l.columns, (n) => (r(), t(
|
|
144
|
+
"td",
|
|
145
|
+
{
|
|
146
|
+
key: n.prop,
|
|
147
|
+
class: _([{ "nmorph-table__table-data--bordered": l.props.bordered }, "nmorph-table__table-data"])
|
|
148
|
+
},
|
|
149
|
+
[
|
|
150
|
+
o("div", {
|
|
151
|
+
id: `table-cell-${l.tableIdentifier}-${b}-${n.prop}`,
|
|
152
|
+
style: d({ "text-align": n.alignment }),
|
|
153
|
+
class: "nmorph-table__cell nmorph-table__cell--data"
|
|
154
|
+
}, s(l.tableData(e.item[n.prop])), 13, S)
|
|
155
|
+
],
|
|
156
|
+
2
|
|
157
|
+
/* CLASS */
|
|
158
|
+
))),
|
|
159
|
+
128
|
|
160
|
+
/* KEYED_FRAGMENT */
|
|
161
|
+
))
|
|
162
|
+
],
|
|
163
|
+
2
|
|
164
|
+
/* CLASS */
|
|
165
|
+
))),
|
|
166
|
+
128
|
|
167
|
+
/* KEYED_FRAGMENT */
|
|
168
|
+
))
|
|
169
|
+
])
|
|
170
|
+
]),
|
|
171
|
+
o("table", null, [
|
|
172
|
+
o("colgroup", null, [
|
|
173
|
+
(r(!0), t(
|
|
174
|
+
a,
|
|
175
|
+
null,
|
|
176
|
+
i(l.columns, (e) => (r(), t(
|
|
177
|
+
"col",
|
|
178
|
+
{
|
|
179
|
+
key: e.prop,
|
|
180
|
+
style: d({ width: `${l.getWidth(e.width)}px` })
|
|
181
|
+
},
|
|
182
|
+
null,
|
|
183
|
+
4
|
|
184
|
+
/* STYLE */
|
|
185
|
+
))),
|
|
186
|
+
128
|
|
187
|
+
/* KEYED_FRAGMENT */
|
|
188
|
+
))
|
|
189
|
+
]),
|
|
190
|
+
o("tbody", R, [
|
|
191
|
+
h(c.$slots, "default")
|
|
192
|
+
])
|
|
193
|
+
])
|
|
194
|
+
],
|
|
195
|
+
4
|
|
196
|
+
/* STYLE */
|
|
197
|
+
)
|
|
198
|
+
],
|
|
199
|
+
4
|
|
200
|
+
/* STYLE */
|
|
201
|
+
)) : (r(), t(
|
|
202
|
+
a,
|
|
203
|
+
{ key: 1 },
|
|
204
|
+
[
|
|
205
|
+
o("table", null, [
|
|
206
|
+
o("colgroup", null, [
|
|
207
|
+
(r(!0), t(
|
|
208
|
+
a,
|
|
209
|
+
null,
|
|
210
|
+
i(l.columns, (e) => (r(), t(
|
|
211
|
+
"col",
|
|
212
|
+
{
|
|
213
|
+
key: e.prop,
|
|
214
|
+
style: d({ width: `${l.getWidth(e.width)}px` })
|
|
215
|
+
},
|
|
216
|
+
null,
|
|
217
|
+
4
|
|
218
|
+
/* STYLE */
|
|
219
|
+
))),
|
|
220
|
+
128
|
|
221
|
+
/* KEYED_FRAGMENT */
|
|
222
|
+
))
|
|
223
|
+
]),
|
|
224
|
+
o("tbody", null, [
|
|
225
|
+
(r(!0), t(
|
|
226
|
+
a,
|
|
227
|
+
null,
|
|
228
|
+
i(l.renderedRows, (e, b) => (r(), t(
|
|
229
|
+
"tr",
|
|
230
|
+
{
|
|
231
|
+
key: b,
|
|
232
|
+
class: _(["nmorph-table__table-data-row", { "nmorph-table__table-data-row--row-hover": l.props.rowHover }])
|
|
233
|
+
},
|
|
234
|
+
[
|
|
235
|
+
(r(!0), t(
|
|
236
|
+
a,
|
|
126
237
|
null,
|
|
127
|
-
i(l.
|
|
128
|
-
"
|
|
238
|
+
i(l.columns, (n) => (r(), t(
|
|
239
|
+
"td",
|
|
129
240
|
{
|
|
130
|
-
key:
|
|
131
|
-
class: _([
|
|
241
|
+
key: n.prop,
|
|
242
|
+
class: _([{ "nmorph-table__table-data--bordered": l.props.bordered }, "nmorph-table__table-data"])
|
|
132
243
|
},
|
|
133
244
|
[
|
|
134
|
-
(
|
|
135
|
-
n
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
{
|
|
140
|
-
key: a.prop,
|
|
141
|
-
class: _([{ "nmorph-table__table-data--bordered": l.props.bordered }, "nmorph-table__table-data"])
|
|
142
|
-
},
|
|
143
|
-
[
|
|
144
|
-
o("div", {
|
|
145
|
-
id: `table-cell-${l.tableIdentifier}-${s}-${a.prop}`,
|
|
146
|
-
style: d({ "text-align": a.alignment }),
|
|
147
|
-
class: "nmorph-table__cell nmorph-table__cell--data"
|
|
148
|
-
}, b(l.tableData(r[a.prop])), 13, x)
|
|
149
|
-
],
|
|
150
|
-
2
|
|
151
|
-
/* CLASS */
|
|
152
|
-
))),
|
|
153
|
-
128
|
|
154
|
-
/* KEYED_FRAGMENT */
|
|
155
|
-
))
|
|
245
|
+
o("div", {
|
|
246
|
+
id: `table-cell-${l.tableIdentifier}-${b}-${n.prop}`,
|
|
247
|
+
style: d({ "text-align": n.alignment }),
|
|
248
|
+
class: "nmorph-table__cell nmorph-table__cell--data"
|
|
249
|
+
}, s(l.tableData(e.item[n.prop])), 13, W)
|
|
156
250
|
],
|
|
157
251
|
2
|
|
158
252
|
/* CLASS */
|
|
@@ -160,134 +254,43 @@ function E(c, h, H, l, L, C) {
|
|
|
160
254
|
128
|
|
161
255
|
/* KEYED_FRAGMENT */
|
|
162
256
|
))
|
|
163
|
-
]
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
]),
|
|
184
|
-
o("tbody", W, [
|
|
185
|
-
p(c.$slots, "default")
|
|
186
|
-
])
|
|
187
|
-
])
|
|
188
|
-
],
|
|
189
|
-
4
|
|
190
|
-
/* STYLE */
|
|
191
|
-
)
|
|
192
|
-
],
|
|
193
|
-
4
|
|
194
|
-
/* STYLE */
|
|
195
|
-
)) : (t(), e(
|
|
196
|
-
n,
|
|
197
|
-
{ key: 1 },
|
|
198
|
-
[
|
|
199
|
-
o("table", null, [
|
|
200
|
-
o("colgroup", null, [
|
|
201
|
-
(t(!0), e(
|
|
202
|
-
n,
|
|
203
|
-
null,
|
|
204
|
-
i(l.columns, (r) => (t(), e(
|
|
205
|
-
"col",
|
|
206
|
-
{
|
|
207
|
-
key: r.prop,
|
|
208
|
-
style: d({ width: `${l.getWidth(r.width)}px` })
|
|
209
|
-
},
|
|
210
|
-
null,
|
|
211
|
-
4
|
|
212
|
-
/* STYLE */
|
|
213
|
-
))),
|
|
214
|
-
128
|
|
215
|
-
/* KEYED_FRAGMENT */
|
|
216
|
-
))
|
|
217
|
-
]),
|
|
218
|
-
o("tbody", null, [
|
|
219
|
-
(t(!0), e(
|
|
220
|
-
n,
|
|
257
|
+
],
|
|
258
|
+
2
|
|
259
|
+
/* CLASS */
|
|
260
|
+
))),
|
|
261
|
+
128
|
|
262
|
+
/* KEYED_FRAGMENT */
|
|
263
|
+
))
|
|
264
|
+
])
|
|
265
|
+
]),
|
|
266
|
+
o("table", null, [
|
|
267
|
+
o("colgroup", null, [
|
|
268
|
+
(r(!0), t(
|
|
269
|
+
a,
|
|
270
|
+
null,
|
|
271
|
+
i(l.columns, (e) => (r(), t(
|
|
272
|
+
"col",
|
|
273
|
+
{
|
|
274
|
+
key: e.prop,
|
|
275
|
+
style: d({ width: `${l.getWidth(e.width)}px` })
|
|
276
|
+
},
|
|
221
277
|
null,
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
[
|
|
229
|
-
(t(!0), e(
|
|
230
|
-
n,
|
|
231
|
-
null,
|
|
232
|
-
i(l.columns, (a) => (t(), e(
|
|
233
|
-
"td",
|
|
234
|
-
{
|
|
235
|
-
key: a.prop,
|
|
236
|
-
class: _([{ "nmorph-table__table-data--bordered": l.props.bordered }, "nmorph-table__table-data"])
|
|
237
|
-
},
|
|
238
|
-
[
|
|
239
|
-
o("div", {
|
|
240
|
-
id: `table-cell-${l.tableIdentifier}-${s}-${a.prop}`,
|
|
241
|
-
style: d({ "text-align": a.alignment }),
|
|
242
|
-
class: "nmorph-table__cell nmorph-table__cell--data"
|
|
243
|
-
}, b(l.tableData(r[a.prop])), 13, B)
|
|
244
|
-
],
|
|
245
|
-
2
|
|
246
|
-
/* CLASS */
|
|
247
|
-
))),
|
|
248
|
-
128
|
|
249
|
-
/* KEYED_FRAGMENT */
|
|
250
|
-
))
|
|
251
|
-
],
|
|
252
|
-
2
|
|
253
|
-
/* CLASS */
|
|
254
|
-
))),
|
|
255
|
-
128
|
|
256
|
-
/* KEYED_FRAGMENT */
|
|
257
|
-
))
|
|
258
|
-
])
|
|
278
|
+
4
|
|
279
|
+
/* STYLE */
|
|
280
|
+
))),
|
|
281
|
+
128
|
|
282
|
+
/* KEYED_FRAGMENT */
|
|
283
|
+
))
|
|
259
284
|
]),
|
|
260
|
-
o("
|
|
261
|
-
|
|
262
|
-
(t(!0), e(
|
|
263
|
-
n,
|
|
264
|
-
null,
|
|
265
|
-
i(l.columns, (r) => (t(), e(
|
|
266
|
-
"col",
|
|
267
|
-
{
|
|
268
|
-
key: r.prop,
|
|
269
|
-
style: d({ width: `${l.getWidth(r.width)}px` })
|
|
270
|
-
},
|
|
271
|
-
null,
|
|
272
|
-
4
|
|
273
|
-
/* STYLE */
|
|
274
|
-
))),
|
|
275
|
-
128
|
|
276
|
-
/* KEYED_FRAGMENT */
|
|
277
|
-
))
|
|
278
|
-
]),
|
|
279
|
-
o("tbody", N, [
|
|
280
|
-
p(c.$slots, "default")
|
|
281
|
-
])
|
|
285
|
+
o("tbody", B, [
|
|
286
|
+
h(c.$slots, "default")
|
|
282
287
|
])
|
|
283
|
-
]
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
/* CLASS, STYLE, NEED_HYDRATION */
|
|
290
|
-
)
|
|
288
|
+
])
|
|
289
|
+
],
|
|
290
|
+
64
|
|
291
|
+
/* STABLE_FRAGMENT */
|
|
292
|
+
))
|
|
293
|
+
], 46, x)
|
|
291
294
|
])
|
|
292
295
|
],
|
|
293
296
|
2
|
|
@@ -295,7 +298,7 @@ function E(c, h, H, l, L, C) {
|
|
|
295
298
|
))
|
|
296
299
|
]);
|
|
297
300
|
}
|
|
298
|
-
const
|
|
301
|
+
const K = /* @__PURE__ */ u(p, [["render", E], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-table/NmorphTable.vue"]]);
|
|
299
302
|
export {
|
|
300
|
-
|
|
303
|
+
K as default
|
|
301
304
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import './NmorphTable.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { useModifiers as
|
|
4
|
-
import { generateUUID as
|
|
5
|
-
import
|
|
6
|
-
import { useVirtualList as
|
|
7
|
-
const
|
|
2
|
+
import { defineComponent as E, computed as r, ref as n, provide as _, watch as P, nextTick as K } from "vue";
|
|
3
|
+
import { useModifiers as Q } from "../../../utils/create-modifiers.js";
|
|
4
|
+
import { generateUUID as V } from "../../../utils/common.js";
|
|
5
|
+
import Y from "./inner-components/nmorph-sort-button/NmorphSortButton.vue.js";
|
|
6
|
+
import { useVirtualList as z } from "../../../hooks/use-virtual-list.js";
|
|
7
|
+
const te = /* @__PURE__ */ E({
|
|
8
8
|
__name: "NmorphTable",
|
|
9
9
|
props: {
|
|
10
10
|
data: { type: Array, required: !1, default: () => [] },
|
|
@@ -15,57 +15,71 @@ const P = /* @__PURE__ */ j({
|
|
|
15
15
|
virtual: { type: Boolean, required: !1, default: !1 },
|
|
16
16
|
virtualHeight: { type: [Number, String], required: !1, default: "320px" },
|
|
17
17
|
virtualOverscan: { type: Number, required: !1, default: 5 },
|
|
18
|
-
virtualRowHeight: { type: Number, required: !1, default: 42 }
|
|
18
|
+
virtualRowHeight: { type: Number, required: !1, default: 42 },
|
|
19
|
+
virtualDynamicHeight: { type: Boolean, required: !1, default: !1 }
|
|
19
20
|
},
|
|
20
|
-
setup(
|
|
21
|
-
|
|
22
|
-
const t =
|
|
23
|
-
() =>
|
|
21
|
+
setup(k, { expose: I }) {
|
|
22
|
+
I();
|
|
23
|
+
const t = k, W = r(
|
|
24
|
+
() => Q({
|
|
24
25
|
"nmorph-table": [`${t.design}`]
|
|
25
26
|
})
|
|
26
|
-
),
|
|
27
|
-
enabled:
|
|
28
|
-
itemHeight:
|
|
29
|
-
overscan: b
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
27
|
+
), o = n([...t.data]), u = r(() => t.virtual), H = r(() => t.virtualRowHeight), b = r(() => t.virtualOverscan), x = r(() => t.virtualDynamicHeight), a = z(o, {
|
|
28
|
+
enabled: u,
|
|
29
|
+
itemHeight: H,
|
|
30
|
+
overscan: b,
|
|
31
|
+
dynamic: x
|
|
32
|
+
}), R = r(
|
|
33
|
+
() => u.value ? a.virtualItems.value : o.value.map((e, l) => ({ item: e, index: l }))
|
|
34
|
+
), D = r(() => R.value.map((e) => e.item)), s = n(-1), m = n(0), c = n(t.sort), B = (e, l) => {
|
|
35
|
+
c.value && (c.value[l] = e, o.value.sort((g, y) => {
|
|
36
|
+
const w = String(g[l]).toLowerCase(), i = String(y[l]).toLowerCase();
|
|
37
|
+
if (!c.value)
|
|
36
38
|
return 0;
|
|
37
|
-
const
|
|
38
|
-
return
|
|
39
|
+
const f = c.value[l];
|
|
40
|
+
return f === "ascending" ? w.localeCompare(i) : f === "descending" ? i.localeCompare(w) : 0;
|
|
39
41
|
}));
|
|
40
|
-
},
|
|
41
|
-
|
|
42
|
-
const
|
|
43
|
-
const e =
|
|
44
|
-
return
|
|
45
|
-
}),
|
|
46
|
-
|
|
42
|
+
}, h = n(null), d = n([]);
|
|
43
|
+
_("table-data", { rows: D, columns: d });
|
|
44
|
+
const S = r(() => {
|
|
45
|
+
const e = d.value.map((i) => i.width).filter((i) => !!i), l = e.length, g = e.reduce((i, f) => (i += Number(f), i), 0), y = d.value.length - l;
|
|
46
|
+
return h.value?.clientWidth ? (h.value?.clientWidth - g) / y : 0;
|
|
47
|
+
}), N = (e) => e !== "" ? e : S.value, p = n(0);
|
|
48
|
+
P(
|
|
47
49
|
() => t.data,
|
|
48
|
-
() => {
|
|
49
|
-
|
|
50
|
+
async () => {
|
|
51
|
+
p.value = p.value + 1, o.value = [...t.data], d.value = [], await K();
|
|
52
|
+
const e = a.containerRef.value;
|
|
53
|
+
e && (e.scrollTop = Math.min(m.value, Math.max(a.totalHeight.value - e.clientHeight, 0)), a.refresh());
|
|
50
54
|
},
|
|
51
55
|
{
|
|
52
56
|
immediate: !0
|
|
53
57
|
}
|
|
54
58
|
);
|
|
55
|
-
const
|
|
56
|
-
|
|
57
|
-
const
|
|
59
|
+
const O = (e) => typeof e == "object" ? "" : e, C = V();
|
|
60
|
+
_("table-identifier", C);
|
|
61
|
+
const q = (e) => typeof e == "number" ? `${e}px` : e, M = r(() => q(t.virtualHeight)), $ = r(() => ({
|
|
58
62
|
"--table-virtual-row-height": `${t.virtualRowHeight}px`,
|
|
59
|
-
height:
|
|
60
|
-
overflowY:
|
|
61
|
-
})),
|
|
62
|
-
height: `${
|
|
63
|
+
height: u.value ? M.value : void 0,
|
|
64
|
+
overflowY: u.value ? "auto" : void 0
|
|
65
|
+
})), A = r(() => ({
|
|
66
|
+
height: `${a.totalHeight.value}px`
|
|
63
67
|
})), L = r(() => ({
|
|
64
|
-
transform: `translateY(${
|
|
65
|
-
})),
|
|
66
|
-
|
|
68
|
+
transform: `translateY(${a.offsetTop.value}px)`
|
|
69
|
+
})), U = (e, l) => {
|
|
70
|
+
a.measureElement(l, e);
|
|
71
|
+
}, j = () => {
|
|
72
|
+
a.scrollHandler(), m.value = a.containerRef.value?.scrollTop || 0;
|
|
73
|
+
}, v = (e) => {
|
|
74
|
+
if (!o.value.length) return;
|
|
75
|
+
const l = s.value < 0 ? 0 : Math.min(Math.max(s.value + e, 0), o.value.length - 1);
|
|
76
|
+
s.value = l, a.scrollToIndex(l);
|
|
77
|
+
}, T = { props: t, modifiers: W, rows: o, virtualEnabled: u, virtualRowHeight: H, virtualOverscan: b, virtualDynamicHeight: x, virtualList: a, renderedRows: R, tableRows: D, activeRowIndex: s, lastScrollTop: m, sortData: c, onSort: B, nmorphDOMTable: h, columns: d, defaultColWidth: S, getWidth: N, key: p, tableData: O, tableIdentifier: C, getCssSize: q, virtualHeight: M, tableBodyStyle: $, virtualSpacerStyle: A, virtualContentStyle: L, setVirtualRowRef: U, scrollHandler: j, moveActiveRow: v, tableKeydownHandler: (e) => {
|
|
78
|
+
u.value && (e.key === "ArrowDown" ? (e.preventDefault(), v(1)) : e.key === "ArrowUp" ? (e.preventDefault(), v(-1)) : e.key === "Home" ? (e.preventDefault(), s.value = 0, a.scrollToIndex(0)) : e.key === "End" ? (e.preventDefault(), s.value = o.value.length - 1, a.scrollToIndex(o.value.length - 1)) : e.key === "PageDown" ? (e.preventDefault(), v(Math.max(Math.floor((a.viewportHeight.value || t.virtualRowHeight) / t.virtualRowHeight), 1))) : e.key === "PageUp" && (e.preventDefault(), v(-Math.max(Math.floor((a.viewportHeight.value || t.virtualRowHeight) / t.virtualRowHeight), 1))));
|
|
79
|
+
}, NmorphSortButton: Y };
|
|
80
|
+
return Object.defineProperty(T, "__isScriptSetup", { enumerable: !1, value: !0 }), T;
|
|
67
81
|
}
|
|
68
82
|
});
|
|
69
83
|
export {
|
|
70
|
-
|
|
84
|
+
te as default
|
|
71
85
|
};
|