vlite3 0.9.9 → 0.9.12
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/components/ColorPicker/ColorIro.vue3.js +2 -2
- package/components/ColorPicker/ColorPicker.vue.js +2 -2
- package/components/Form/CustomFields.vue.js +2 -2
- package/components/Form/CustomFields.vue2.js +82 -82
- package/components/Form/FormField.vue.js +119 -115
- package/components/Form/FormFields.vue.js +2 -2
- package/components/Form/FormFields.vue2.js +99 -91
- package/components/Form/composables/useForm.js +110 -108
- package/components/Form/types.d.ts +6 -2
- package/components/Form/utils/form.utils.d.ts +12 -8
- package/components/Form/utils/form.utils.js +172 -149
- package/components/List/List.vue.js +1 -1
- package/components/Screen/Screen.vue.js +82 -81
- package/components/Screen/ScreenFilter.vue.js +1 -1
- package/package.json +1 -1
- package/style.css +1 -1
- /package/components/ColorPicker/{ColorIro.vue2.js → ColorIro.vue.js} +0 -0
|
@@ -6,8 +6,8 @@ import O from "../Input.vue.js";
|
|
|
6
6
|
import "../../core/config.js";
|
|
7
7
|
/* empty css */
|
|
8
8
|
import y from "../Button.vue.js";
|
|
9
|
-
import E from "./ColorIro.
|
|
10
|
-
/* empty css
|
|
9
|
+
import E from "./ColorIro.vue.js";
|
|
10
|
+
/* empty css */
|
|
11
11
|
import { useEyeDropper as P } from "@vueuse/core";
|
|
12
12
|
const I = {
|
|
13
13
|
key: 0,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./CustomFields.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import t from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const
|
|
4
|
+
const r = /* @__PURE__ */ t(o, [["__scopeId", "data-v-3e1f26ae"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
r as default
|
|
7
7
|
};
|
|
@@ -1,33 +1,33 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { VueDraggable as
|
|
3
|
-
import
|
|
1
|
+
import { defineComponent as Z, computed as f, shallowRef as I, watch as ee, openBlock as n, createElementBlock as d, createElementVNode as p, createBlock as B, withCtx as D, createTextVNode as te, toDisplayString as v, createCommentVNode as c, createVNode as w, Fragment as k, renderList as V, normalizeClass as C, unref as ae, isMemoSame as re } from "vue";
|
|
2
|
+
import { VueDraggable as le } from "vue-draggable-plus";
|
|
3
|
+
import se from "./FormField.vue.js";
|
|
4
4
|
import N from "../Button.vue.js";
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import { $t as
|
|
8
|
-
import { setNestedValue as E, evaluateConditional as $ } from "./utils/form.utils.js";
|
|
9
|
-
const
|
|
5
|
+
import oe from "../Label.vue.js";
|
|
6
|
+
import ne from "../Icon.vue.js";
|
|
7
|
+
import { $t as x } from "../../utils/i18n.js";
|
|
8
|
+
import { setNestedValue as E, resolveFieldType as de, evaluateConditional as $ } from "./utils/form.utils.js";
|
|
9
|
+
const ue = { class: "custom-fields-wrapper" }, ie = { class: "flex justify-between items-center mb-2" }, ce = { class: "custom-fields-table border border-border rounded overflow-hidden bg-background" }, me = {
|
|
10
10
|
key: 0,
|
|
11
11
|
class: "flex border-b border-border bg-muted/50 text-gray-800 text-xs font-semibold uppercase tracking-wider"
|
|
12
|
-
},
|
|
12
|
+
}, be = {
|
|
13
13
|
key: 0,
|
|
14
14
|
class: "w-10 flex-none p-3 border-r border-border"
|
|
15
|
-
},
|
|
15
|
+
}, fe = {
|
|
16
16
|
key: 1,
|
|
17
17
|
class: "w-10 flex-none p-3 text-center border-r border-border"
|
|
18
|
-
},
|
|
18
|
+
}, ve = {
|
|
19
19
|
key: 2,
|
|
20
20
|
class: "w-10 flex-none p-3"
|
|
21
|
-
},
|
|
21
|
+
}, ge = {
|
|
22
22
|
key: 1,
|
|
23
23
|
class: "w-10 flex-none flex items-center justify-center text-xs text-muted-foreground border-r border-border bg-muted/20"
|
|
24
|
-
},
|
|
24
|
+
}, he = {
|
|
25
25
|
key: 2,
|
|
26
26
|
class: "w-10 flex-none flex items-center justify-center border-l border-border bg-muted/20"
|
|
27
|
-
},
|
|
27
|
+
}, ye = {
|
|
28
28
|
key: 1,
|
|
29
29
|
class: "flex flex-col items-center justify-center py-6 text-center bg-muted/5"
|
|
30
|
-
},
|
|
30
|
+
}, pe = { class: "text-sm font-medium text-foreground" }, we = { class: "text-xs text-muted-foreground mt-1" }, _e = /* @__PURE__ */ Z({
|
|
31
31
|
__name: "CustomFields",
|
|
32
32
|
props: {
|
|
33
33
|
name: {},
|
|
@@ -51,21 +51,21 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
51
51
|
isUpdate: { type: Boolean, default: !1 }
|
|
52
52
|
},
|
|
53
53
|
emits: ["update:modelValue", "change"],
|
|
54
|
-
setup(s, { emit:
|
|
55
|
-
const
|
|
56
|
-
const e =
|
|
54
|
+
setup(s, { emit: T }) {
|
|
55
|
+
const a = s, F = T, U = f(() => a.labelI18n ? x(a.labelI18n) : a.label), z = f(() => {
|
|
56
|
+
const e = x("vlite.customFields.emptyTitle");
|
|
57
57
|
return e !== "vlite.customFields.emptyTitle" ? e : "No items added";
|
|
58
|
-
}),
|
|
59
|
-
const e =
|
|
58
|
+
}), A = f(() => {
|
|
59
|
+
const e = x("vlite.customFields.emptyDescription");
|
|
60
60
|
return e !== "vlite.customFields.emptyDescription" ? e : "Add a new item to get started";
|
|
61
|
-
}), l =
|
|
62
|
-
|
|
63
|
-
() =>
|
|
61
|
+
}), l = I([]), _ = () => `row_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
|
62
|
+
ee(
|
|
63
|
+
() => a.modelValue,
|
|
64
64
|
(e) => {
|
|
65
|
-
Array.isArray(e) ? l.value = e.map((
|
|
65
|
+
Array.isArray(e) ? l.value = e.map((t, o) => {
|
|
66
66
|
const r = l.value[o];
|
|
67
67
|
return {
|
|
68
|
-
...
|
|
68
|
+
...t,
|
|
69
69
|
_id: r?._id || _()
|
|
70
70
|
};
|
|
71
71
|
}) : l.value = [];
|
|
@@ -74,74 +74,74 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
74
74
|
);
|
|
75
75
|
const S = () => {
|
|
76
76
|
const e = {};
|
|
77
|
-
for (const
|
|
78
|
-
const o = typeof
|
|
79
|
-
e[
|
|
77
|
+
for (const t of a.schema) {
|
|
78
|
+
const o = typeof t.value == "function" ? t.value() : t.value;
|
|
79
|
+
e[t.name] = o ?? null;
|
|
80
80
|
}
|
|
81
81
|
return { ...e, _id: _() };
|
|
82
82
|
}, H = () => {
|
|
83
|
-
if (
|
|
83
|
+
if (a.disabled || a.maxRows && l.value.length >= a.maxRows) return;
|
|
84
84
|
const e = [...l.value, S()];
|
|
85
85
|
l.value = e, g(e);
|
|
86
86
|
}, L = (e) => {
|
|
87
|
-
if (
|
|
88
|
-
const
|
|
89
|
-
|
|
90
|
-
}, M = async (e,
|
|
87
|
+
if (a.disabled || l.value.length <= a.minRows) return;
|
|
88
|
+
const t = [...l.value];
|
|
89
|
+
t.splice(e, 1), l.value = t, g(t);
|
|
90
|
+
}, M = async (e, t, o) => {
|
|
91
91
|
const r = [...l.value];
|
|
92
92
|
r[e] = {
|
|
93
93
|
...r[e],
|
|
94
|
-
[
|
|
94
|
+
[t]: o.value
|
|
95
95
|
};
|
|
96
|
-
const
|
|
97
|
-
if (
|
|
96
|
+
const y = a.schema.find((i) => i.name === t);
|
|
97
|
+
if (y && y.updateValues)
|
|
98
98
|
try {
|
|
99
99
|
const i = r[e];
|
|
100
|
-
let m = { ...
|
|
101
|
-
|
|
102
|
-
const b = await
|
|
100
|
+
let m = { ...a.values || {} };
|
|
101
|
+
a.name && (m = E(m, a.name, r));
|
|
102
|
+
const b = await y.updateValues({
|
|
103
103
|
value: o.value,
|
|
104
104
|
values: i,
|
|
105
105
|
// strictly local row scope
|
|
106
106
|
globalValues: m,
|
|
107
107
|
// strictly global root scope
|
|
108
108
|
data: o.data,
|
|
109
|
-
isUpdate:
|
|
109
|
+
isUpdate: a.isUpdate
|
|
110
110
|
});
|
|
111
111
|
b && typeof b == "object" && (r[e] = { ...r[e], ...b });
|
|
112
112
|
} catch (i) {
|
|
113
|
-
console.error(`[CustomFields] Error in updateValues for ${
|
|
113
|
+
console.error(`[CustomFields] Error in updateValues for ${t}:`, i);
|
|
114
114
|
}
|
|
115
115
|
l.value = r, g(r);
|
|
116
116
|
}, G = (e) => {
|
|
117
117
|
l.value = e, g(e);
|
|
118
118
|
}, g = (e) => {
|
|
119
|
-
const
|
|
120
|
-
F("update:modelValue",
|
|
121
|
-
}, O = (e,
|
|
122
|
-
let
|
|
123
|
-
return
|
|
119
|
+
const t = e.map(({ _id: o, ...r }) => r);
|
|
120
|
+
F("update:modelValue", t), F("change", t);
|
|
121
|
+
}, O = (e, t) => l.value[e]?.[t], W = f(() => !(a.disabled || a.maxRows && l.value.length >= a.maxRows)), R = f(() => a.disabled ? !1 : l.value.length > a.minRows), j = f(() => a.headers && a.headers.length > 0 ? a.headers : a.schema.map((e) => e.labelI18n ? x(e.labelI18n) : e.label || e.name)), h = (e) => {
|
|
122
|
+
let t = { ...a.values || {} };
|
|
123
|
+
return a.name && (t = E(t, a.name, l.value)), {
|
|
124
124
|
values: l.value[e] || {},
|
|
125
|
-
globalValues:
|
|
126
|
-
isUpdate:
|
|
125
|
+
globalValues: t,
|
|
126
|
+
isUpdate: a.isUpdate
|
|
127
127
|
};
|
|
128
|
-
}, q = (e,
|
|
129
|
-
if (!
|
|
130
|
-
const
|
|
131
|
-
return Object.keys(
|
|
128
|
+
}, q = (e, t) => de(e, h(t)), J = (e, t) => a.disabled ? !0 : $(t.disabled, h(e)), K = (e, t) => $(t.readonly, h(e)), P = (e, t) => t.when ? $(t.when, h(e)) : !0, Q = (e) => {
|
|
129
|
+
if (!a.errors || !a.name) return "";
|
|
130
|
+
const t = `${a.name}.${e}.`;
|
|
131
|
+
return Object.keys(a.errors).filter((o) => o.startsWith(t)).map((o) => a.errors[o]).join(",");
|
|
132
132
|
};
|
|
133
|
-
return (e,
|
|
134
|
-
|
|
135
|
-
U.value ? (n(), B(
|
|
133
|
+
return (e, t) => (n(), d("div", ue, [
|
|
134
|
+
p("div", ie, [
|
|
135
|
+
U.value ? (n(), B(oe, {
|
|
136
136
|
key: 0,
|
|
137
137
|
class: "text-sm font-medium text-foreground"
|
|
138
138
|
}, {
|
|
139
139
|
default: D(() => [
|
|
140
|
-
|
|
140
|
+
te(v(U.value), 1)
|
|
141
141
|
]),
|
|
142
142
|
_: 1
|
|
143
143
|
})) : c("", !0),
|
|
144
|
-
|
|
144
|
+
w(N, {
|
|
145
145
|
type: "button",
|
|
146
146
|
variant: "outline",
|
|
147
147
|
size: "xs",
|
|
@@ -151,17 +151,17 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
151
151
|
onClick: H
|
|
152
152
|
}, null, 8, ["disabled"])
|
|
153
153
|
]),
|
|
154
|
-
|
|
155
|
-
j.value.length > 0 ? (n(), d("div",
|
|
156
|
-
s.draggable ? (n(), d("div",
|
|
157
|
-
s.showRowNumbers ? (n(), d("div",
|
|
154
|
+
p("div", ce, [
|
|
155
|
+
j.value.length > 0 ? (n(), d("div", me, [
|
|
156
|
+
s.draggable ? (n(), d("div", be)) : c("", !0),
|
|
157
|
+
s.showRowNumbers ? (n(), d("div", fe, " # ")) : c("", !0),
|
|
158
158
|
(n(!0), d(k, null, V(j.value, (o, r) => (n(), d("div", {
|
|
159
159
|
key: r,
|
|
160
160
|
class: C(["flex-1 p-3 min-w-0 truncate", { "border-l border-border": r > 0 }])
|
|
161
161
|
}, v(o), 3))), 128)),
|
|
162
|
-
|
|
162
|
+
R.value ? (n(), d("div", ve)) : c("", !0)
|
|
163
163
|
])) : c("", !0),
|
|
164
|
-
|
|
164
|
+
w(ae(le), {
|
|
165
165
|
"model-value": l.value,
|
|
166
166
|
"onUpdate:modelValue": G,
|
|
167
167
|
disabled: !s.draggable || s.disabled,
|
|
@@ -171,9 +171,9 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
171
171
|
class: "divide-y divide-border"
|
|
172
172
|
}, {
|
|
173
173
|
default: D(() => [
|
|
174
|
-
(n(!0), d(k, null, V(l.value, (o, r,
|
|
175
|
-
const m = [o, s.disabled, s.isUpdate, s.showRowNumbers,
|
|
176
|
-
if (i && i.key === o._id &&
|
|
174
|
+
(n(!0), d(k, null, V(l.value, (o, r, y, i) => {
|
|
175
|
+
const m = [o, s.disabled, s.isUpdate, s.showRowNumbers, R.value, s.draggable, r, Q(r)];
|
|
176
|
+
if (i && i.key === o._id && re(i, m)) return i;
|
|
177
177
|
const b = (n(), d("div", {
|
|
178
178
|
key: o._id,
|
|
179
179
|
class: "flex group bg-white transition-colors"
|
|
@@ -182,22 +182,22 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
182
182
|
key: 0,
|
|
183
183
|
class: C(["w-10 flex-none flex items-center justify-center border-r border-border bg-muted/5 drag-handle transition-colors", s.disabled ? "cursor-not-allowed opacity-50" : "cursor-grab active:cursor-grabbing hover:bg-muted/10 text-muted-foreground hover:text-foreground"])
|
|
184
184
|
}, [
|
|
185
|
-
|
|
185
|
+
w(ne, {
|
|
186
186
|
icon: "lucide:grip-vertical",
|
|
187
187
|
class: "w-4 h-4"
|
|
188
188
|
})
|
|
189
189
|
], 2)) : c("", !0),
|
|
190
|
-
s.showRowNumbers ? (n(), d("div",
|
|
191
|
-
(n(!0), d(k, null, V(s.schema, (u,
|
|
190
|
+
s.showRowNumbers ? (n(), d("div", ge, v(r + 1), 1)) : c("", !0),
|
|
191
|
+
(n(!0), d(k, null, V(s.schema, (u, X) => (n(), d("div", {
|
|
192
192
|
key: u.name,
|
|
193
|
-
class: C(["flex-1 min-w-0 relative", { "border-l border-border":
|
|
193
|
+
class: C(["flex-1 min-w-0 relative", { "border-l border-border": X > 0 }])
|
|
194
194
|
}, [
|
|
195
|
-
|
|
195
|
+
P(r, u) ? (n(), B(se, {
|
|
196
196
|
key: 0,
|
|
197
197
|
field: {
|
|
198
198
|
...u,
|
|
199
199
|
props: {
|
|
200
|
-
...u
|
|
200
|
+
...q(u, r) === "multiSelect" ? { showControls: !1, wrap: !1 } : {},
|
|
201
201
|
...u.props || {}
|
|
202
202
|
},
|
|
203
203
|
label: void 0
|
|
@@ -209,15 +209,15 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
209
209
|
variant: "transparent",
|
|
210
210
|
size: "sm",
|
|
211
211
|
rounded: "none",
|
|
212
|
-
disabled:
|
|
213
|
-
readonly:
|
|
212
|
+
disabled: J(r, u),
|
|
213
|
+
readonly: K(r, u),
|
|
214
214
|
isUpdate: s.isUpdate,
|
|
215
215
|
class: "w-full h-full min-h-[40px]",
|
|
216
|
-
onChange: (
|
|
216
|
+
onChange: (Y) => M(r, u.name, Y)
|
|
217
217
|
}, null, 8, ["field", "value", "values", "errors", "error", "disabled", "readonly", "isUpdate", "onChange"])) : c("", !0)
|
|
218
218
|
], 2))), 128)),
|
|
219
|
-
|
|
220
|
-
|
|
219
|
+
R.value ? (n(), d("div", he, [
|
|
220
|
+
w(N, {
|
|
221
221
|
type: "button",
|
|
222
222
|
variant: "ghost",
|
|
223
223
|
size: "xs",
|
|
@@ -228,18 +228,18 @@ const ne = { class: "custom-fields-wrapper" }, de = { class: "flex justify-betwe
|
|
|
228
228
|
])) : c("", !0)
|
|
229
229
|
]));
|
|
230
230
|
return b.memo = m, b;
|
|
231
|
-
},
|
|
231
|
+
}, t, 0), 128))
|
|
232
232
|
]),
|
|
233
233
|
_: 1
|
|
234
234
|
}, 8, ["model-value", "disabled"]),
|
|
235
|
-
l.value.length === 0 ? (n(), d("div",
|
|
236
|
-
|
|
237
|
-
|
|
235
|
+
l.value.length === 0 ? (n(), d("div", ye, [
|
|
236
|
+
p("p", pe, v(z.value), 1),
|
|
237
|
+
p("p", we, v(A.value), 1)
|
|
238
238
|
])) : c("", !0)
|
|
239
239
|
])
|
|
240
240
|
]));
|
|
241
241
|
}
|
|
242
242
|
});
|
|
243
243
|
export {
|
|
244
|
-
|
|
244
|
+
_e as default
|
|
245
245
|
};
|