@wikicasa-dev/components 1.5.18 → 1.6.0
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/AccessibleSelect.js +1 -1
- package/dist/BaseAlert.js +1 -1
- package/dist/BaseAutocomplete.js +1 -1
- package/dist/BaseInput.js +189 -270
- package/dist/BaseSlider.js +8 -8
- package/dist/BaseToggle.js +37 -38
- package/dist/UIKit/BaseAlert.vue.d.ts +0 -5
- package/dist/UIKit/BaseAutocomplete.vue.d.ts +10 -10
- package/dist/UIKit/BaseButton.vue.d.ts +1 -1
- package/dist/UIKit/BaseInput.vue.d.ts +63 -110
- package/dist/UIKit/BaseTextarea.vue.d.ts +1 -1
- package/dist/UIKit/BaseToggle.vue.d.ts +19 -22
- package/dist/assets/BaseInput.css +1 -1
- package/dist/assets/BaseSlider.css +1 -1
- package/dist/assets/BaseToggle.css +1 -1
- package/dist/assets/index.css +1 -1
- package/dist/chunks/{AccessibleSelect.vue_vue_type_script_setup_true_lang.BE4EKjlJ.js → AccessibleSelect.vue_vue_type_script_setup_true_lang.5pqk7vlZ.js} +1 -1
- package/dist/chunks/BaseAlert.vue_vue_type_style_index_0_lang.BtqP_iYL.js +20 -0
- package/dist/chunks/{BaseAutocomplete.vue_vue_type_script_setup_true_lang.BoNJQPjL.js → BaseAutocomplete.vue_vue_type_script_setup_true_lang.CFikyojk.js} +64 -67
- package/dist/index.js +3 -3
- package/dist/useFloatingLabel.js +19 -19
- package/package.json +1 -1
- package/dist/chunks/BaseAlert.vue_vue_type_style_index_0_lang.CunhU74n.js +0 -23
package/dist/AccessibleSelect.js
CHANGED
package/dist/BaseAlert.js
CHANGED
package/dist/BaseAutocomplete.js
CHANGED
package/dist/BaseInput.js
CHANGED
|
@@ -1,287 +1,206 @@
|
|
|
1
1
|
import './assets/BaseInput.css';
|
|
2
|
-
import v from "
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import { _ as
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
2
|
+
import { defineComponent as K, mergeModels as T, useModel as N, ref as $, watch as g, useAttrs as O, onBeforeMount as j, onMounted as D, openBlock as u, createElementBlock as d, normalizeClass as b, unref as r, renderSlot as p, createElementVNode as v, withModifiers as w, withKeys as G, createBlock as J, createCommentVNode as c, Fragment as L, renderList as I } from "vue";
|
|
3
|
+
import Q from "./BaseFloatingLabel.js";
|
|
4
|
+
import { useFloatingLabel as R } from "./useFloatingLabel.js";
|
|
5
|
+
import { _ as U } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
6
|
+
const W = ["id", "data-cy", "name", "autocomplete", "disabled", "aria-labelledby", "readonly", "type", "pattern", "min", "max", "maxlength", "inputmode", "placeholder"], X = { class: "uikit-invisible uikit-float-none uikit-mb-2 uikit-ml-2 uikit-block uikit-h-3 uikit-w-auto uikit-max-w-full uikit-overflow-hidden uikit-whitespace-nowrap uikit-p-0 uikit-text uikit-transition-[max-width] uikit-duration-[50ms] uikit-ease-out" }, Y = ["innerHTML"], Z = ["innerHTML"], x = ["innerHTML"], _ = {
|
|
7
|
+
key: 1,
|
|
8
|
+
class: "under-label uikit-absolute uikit-text-12"
|
|
9
|
+
}, ee = /* @__PURE__ */ K({
|
|
9
10
|
inheritAttrs: !1,
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
},
|
|
16
|
-
labelText: { type: String, default: "" },
|
|
17
|
-
border: { type: Boolean, default: !0 },
|
|
18
|
-
radius: { type: Boolean, default: !0 },
|
|
19
|
-
modelValue: { type: [String, Number] },
|
|
20
|
-
feedback: { type: Object },
|
|
21
|
-
isValid: { type: Boolean, default: null },
|
|
22
|
-
auto: { type: Boolean, default: !0 },
|
|
11
|
+
__name: "BaseInput",
|
|
12
|
+
props: /* @__PURE__ */ T({
|
|
13
|
+
inputClass: { default: "" },
|
|
14
|
+
labelText: { default: "" },
|
|
15
|
+
feedback: {},
|
|
16
|
+
isValid: { default: null },
|
|
23
17
|
keepFloatingLabel: { type: Boolean, default: !1 },
|
|
24
|
-
formatter: {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
emits: [
|
|
30
|
-
|
|
31
|
-
"
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
} =
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
setFloatingLabel: i
|
|
18
|
+
formatter: { default: null }
|
|
19
|
+
}, {
|
|
20
|
+
modelValue: { default: "" },
|
|
21
|
+
modelModifiers: {}
|
|
22
|
+
}),
|
|
23
|
+
emits: /* @__PURE__ */ T(["click", "keydownEnterPressed", "focusin", "focusout", "keydown"], ["update:modelValue"]),
|
|
24
|
+
setup(y, { expose: M, emit: B }) {
|
|
25
|
+
const t = y, a = N(y, "modelValue"), f = B, {
|
|
26
|
+
labelState: s,
|
|
27
|
+
setInitialLabelState: C,
|
|
28
|
+
handleFocusIn: H,
|
|
29
|
+
handleFocusOut: V,
|
|
30
|
+
setInlineLabel: E,
|
|
31
|
+
setFloatingLabel: S
|
|
32
|
+
} = R(f), o = $(""), k = $({}), n = $(null), F = () => {
|
|
33
|
+
t.feedback && (k.value = t.feedback, t.feedback.valid && typeof t.feedback.valid == "string" && (k.value.valid = [t.feedback.valid]), t.feedback.invalid && typeof t.feedback.invalid == "string" && (k.value.invalid = [t.feedback.invalid]));
|
|
34
|
+
}, m = (e, i) => {
|
|
35
|
+
if (!i)
|
|
36
|
+
return e.value = "", "";
|
|
37
|
+
let l = "";
|
|
38
|
+
return t.formatter && t.formatter.unFormatFn ? l = `${t.formatter.unFormatFn(i)}` : l = i, t.formatter ? e.value = t.formatter.formatFn(l) : e.value = l, l;
|
|
39
|
+
}, P = ({ target: e }) => {
|
|
40
|
+
const i = e, l = m(i, i.value);
|
|
41
|
+
a.value = l || "";
|
|
42
|
+
}, q = () => {
|
|
43
|
+
a.value = "", E();
|
|
44
|
+
}, z = () => {
|
|
45
|
+
o.value === "password" ? o.value = "text" : o.value === "text" && (o.value = "password");
|
|
53
46
|
};
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
//a valid input type
|
|
59
|
-
feedbackObj: {},
|
|
60
|
-
pointerDownListener: (e) => {
|
|
61
|
-
e.preventDefault();
|
|
47
|
+
g(
|
|
48
|
+
() => t.feedback,
|
|
49
|
+
() => {
|
|
50
|
+
F();
|
|
62
51
|
}
|
|
63
|
-
|
|
64
|
-
},
|
|
65
|
-
computed: {
|
|
66
|
-
passwordIcon() {
|
|
67
|
-
return document ? document.querySelector("[data-type='password-icon']") : null;
|
|
68
|
-
}
|
|
69
|
-
},
|
|
70
|
-
watch: {
|
|
71
|
-
feedback() {
|
|
72
|
-
this.normalizeFeedbackProp();
|
|
73
|
-
},
|
|
74
|
-
modelValue(e) {
|
|
52
|
+
), g(a, (e) => {
|
|
75
53
|
if (e) {
|
|
76
|
-
|
|
77
|
-
if (!t)
|
|
54
|
+
if (!n.value)
|
|
78
55
|
return;
|
|
79
|
-
!
|
|
80
|
-
const
|
|
81
|
-
|
|
56
|
+
!n.value?.value && t.formatter && (e = n.value?.value);
|
|
57
|
+
const i = m(
|
|
58
|
+
n.value,
|
|
59
|
+
e.toString()
|
|
60
|
+
);
|
|
61
|
+
a.value = i || "";
|
|
82
62
|
} else
|
|
83
|
-
|
|
84
|
-
e != null && `${e}`.length > 0 &&
|
|
85
|
-
},
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
},
|
|
91
|
-
created() {
|
|
92
|
-
this.type = this.$attrs.type, this.normalizeFeedbackProp(), this.setInitialLabelState(this.modelValue);
|
|
93
|
-
},
|
|
94
|
-
mounted() {
|
|
95
|
-
if ((this.modelValue != null || this.modelValue != null) && (this.$refs.baseInput.value = `${this.modelValue}`), this.formatter) {
|
|
96
|
-
const e = this.updateInputValue(
|
|
97
|
-
this.$refs.baseInput,
|
|
98
|
-
`${this.modelValue}`
|
|
99
|
-
);
|
|
100
|
-
this.$emit("update:modelValue", e);
|
|
101
|
-
}
|
|
102
|
-
this.setPointerOutListener();
|
|
103
|
-
},
|
|
104
|
-
unmounted() {
|
|
105
|
-
this.passwordIcon?.removeEventListener(
|
|
106
|
-
"pointerdown",
|
|
107
|
-
this.pointerDownListener
|
|
63
|
+
n.value.value = "";
|
|
64
|
+
e != null && `${e}`.length > 0 && s.value !== "floating-label" ? s.value = "floating-label" : (e == null || e == null) && (s.value = "inline-label");
|
|
65
|
+
}), g(
|
|
66
|
+
() => t.keepFloatingLabel,
|
|
67
|
+
(e) => {
|
|
68
|
+
e ? S() : V(a.value);
|
|
69
|
+
}
|
|
108
70
|
);
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
if (!t)
|
|
131
|
-
return e.value = "", "";
|
|
132
|
-
let a = "";
|
|
133
|
-
return this.formatter && this.formatter.unFormatFn ? a = `${this.formatter.unFormatFn(t)}` : a = t, this.formatter ? e.value = this.formatter.formatFn(a) : e.value = a, a;
|
|
134
|
-
},
|
|
135
|
-
handleInputChange({ target: e }) {
|
|
136
|
-
if (this.inputType === "select")
|
|
137
|
-
return;
|
|
138
|
-
const t = e, a = this.updateInputValue(t, t.value);
|
|
139
|
-
this.$emit("update:modelValue", a);
|
|
140
|
-
},
|
|
141
|
-
handleClick(e) {
|
|
142
|
-
this.$emit("click", e);
|
|
143
|
-
},
|
|
144
|
-
handleClean() {
|
|
145
|
-
this.$emit("update:modelValue", ""), this.setInlineLabel();
|
|
146
|
-
},
|
|
147
|
-
handleShowPasswd() {
|
|
148
|
-
this.type === "password" ? this.type = "text" : this.type === "text" && (this.type = "password");
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
}), L = ["id", "data-cy", "name", "autocomplete", "disabled", "aria-labelledby", "readonly", "type", "pattern", "min", "max", "maxlength", "inputmode", "placeholder"], C = {
|
|
152
|
-
key: 0,
|
|
153
|
-
class: "uikit-invisible uikit-float-none uikit-mb-2 uikit-ml-2 uikit-block uikit-h-3 uikit-w-auto uikit-max-w-full uikit-overflow-hidden uikit-whitespace-nowrap uikit-p-0 uikit-text uikit-transition-[max-width] uikit-duration-[50ms] uikit-ease-out"
|
|
154
|
-
}, S = ["innerHTML"], T = ["innerHTML"], O = ["innerHTML"], B = {
|
|
155
|
-
key: 1,
|
|
156
|
-
class: "under-label uikit-absolute uikit-text-12"
|
|
157
|
-
};
|
|
158
|
-
function j(e, t, a, k, h, f) {
|
|
159
|
-
const u = g("base-floating-label");
|
|
160
|
-
return l(), s("div", {
|
|
161
|
-
class: n(["input-wrapper uikit-relative uikit-inline-block uikit-w-full [&.has-right-icon.is-invalid_.text-input-icon]:uikit-mr-25px [&.has-right-icon.is-valid_.text-input-icon]:uikit-mr-25px", [
|
|
162
|
-
e.$attrs.class,
|
|
163
|
-
{ "uikit-h-12": e.labelText },
|
|
164
|
-
{ "floating-label": e.labelText },
|
|
165
|
-
e.labelState === "floating-label" ? "floating-state" : "inline-state",
|
|
166
|
-
{
|
|
167
|
-
"has-right-icon": e.$attrs["with-right-icon"] !== void 0 ? e.$attrs["with-right-icon"] : !!e.$slots.righticon
|
|
168
|
-
},
|
|
169
|
-
{
|
|
170
|
-
"has-left-icon": e.$attrs["with-left-icon"] !== void 0 ? e.$attrs["with-left-icon"] : !!e.$slots.leftIcon
|
|
171
|
-
},
|
|
172
|
-
{ "is-invalid": e.isValid === !1, "is-valid": e.isValid }
|
|
173
|
-
]])
|
|
174
|
-
}, [
|
|
175
|
-
o(e.$slots, "leftIcon", {}, void 0, !0),
|
|
176
|
-
o(e.$slots, "righticon", {
|
|
177
|
-
handleClean: e.handleClean,
|
|
178
|
-
handleShowPasswd: e.handleShowPasswd,
|
|
179
|
-
curType: e.type
|
|
180
|
-
}, void 0, !0),
|
|
181
|
-
p("input", {
|
|
182
|
-
id: e.$attrs.id,
|
|
183
|
-
ref: "baseInput",
|
|
184
|
-
"data-cy": e.$attrs["data-cy"],
|
|
185
|
-
name: e.$attrs.name,
|
|
186
|
-
class: n(["uikit-peer uikit-relative uikit-z-10 uikit-box-border uikit-h-12 uikit-truncate !uikit-border-none uikit-bg-transparent uikit-bg-no-repeat uikit-pt-5px focus:uikit-shadow-none focus:uikit-outline-none", [
|
|
187
|
-
{ "uikit-rounded-xs": e.radius },
|
|
188
|
-
{
|
|
189
|
-
"input-element uikit-block uikit-w-full uikit-appearance-none uikit-px-4 uikit-outline-0": e.inputType === "text-input"
|
|
190
|
-
},
|
|
191
|
-
{ "uikit-text-w-secondary": e.$attrs.disabled },
|
|
192
|
-
{
|
|
193
|
-
"is-invalid invalid-bg !uikit-pr-9": e.isValid === !1,
|
|
194
|
-
"is-valid valid-bg !uikit-pr-9": e.isValid
|
|
195
|
-
},
|
|
196
|
-
{
|
|
197
|
-
"uikit-pr-[42px]": e.$attrs["with-right-icon"] !== void 0 ? e.$attrs["with-right-icon"] : !!e.$slots.righticon
|
|
198
|
-
},
|
|
71
|
+
const A = O();
|
|
72
|
+
return j(() => {
|
|
73
|
+
o.value = A.type, F(), C(a.value);
|
|
74
|
+
}), D(() => {
|
|
75
|
+
if ((a.value != null || a.value != null) && (n.value.value = `${a.value}`), t.formatter) {
|
|
76
|
+
const e = m(
|
|
77
|
+
n.value,
|
|
78
|
+
`${a.value}`
|
|
79
|
+
);
|
|
80
|
+
a.value = e || "";
|
|
81
|
+
}
|
|
82
|
+
}), M({
|
|
83
|
+
select: () => {
|
|
84
|
+
n.value?.select();
|
|
85
|
+
}
|
|
86
|
+
}), (e, i) => (u(), d("div", {
|
|
87
|
+
class: b(["input-wrapper uikit-relative uikit-inline-block uikit-w-full [&.has-right-icon.is-invalid_.text-input-icon]:uikit-mr-25px [&.has-right-icon.is-valid_.text-input-icon]:uikit-mr-25px", [
|
|
88
|
+
e.$attrs.class,
|
|
89
|
+
{ "uikit-h-12": e.labelText },
|
|
90
|
+
{ "floating-label": e.labelText },
|
|
91
|
+
r(s) === "floating-label" ? "floating-state" : "inline-state",
|
|
199
92
|
{
|
|
200
|
-
"
|
|
93
|
+
"has-right-icon": e.$attrs["with-right-icon"] !== void 0 ? e.$attrs["with-right-icon"] : !!e.$slots.righticon
|
|
201
94
|
},
|
|
202
|
-
e.inputClass
|
|
203
|
-
]]),
|
|
204
|
-
autocomplete: e.$attrs.autocomplete === "on" ? "on" : "off",
|
|
205
|
-
disabled: e.$attrs.disabled,
|
|
206
|
-
"aria-labelledby": e.$attrs.id,
|
|
207
|
-
readonly: e.$attrs.readonly,
|
|
208
|
-
type: e.type,
|
|
209
|
-
pattern: e.$attrs.pattern,
|
|
210
|
-
min: e.$attrs.min,
|
|
211
|
-
max: e.$attrs.max,
|
|
212
|
-
maxlength: e.$attrs.maxlength,
|
|
213
|
-
inputmode: e.$attrs.inputmode,
|
|
214
|
-
placeholder: e.$attrs.placeholder,
|
|
215
|
-
onClick: t[0] || (t[0] = (...i) => e.handleClick && e.handleClick(...i)),
|
|
216
|
-
onFocusin: t[1] || (t[1] = b(() => e.handleFocusIn(), ["stop"])),
|
|
217
|
-
onFocusout: t[2] || (t[2] = b((i) => !e.keepFloatingLabel && e.handleFocusOut(e.modelValue, !1, e.auto), ["stop"])),
|
|
218
|
-
onInput: t[3] || (t[3] = b((...i) => e.handleInputChange && e.handleInputChange(...i), ["stop"])),
|
|
219
|
-
onKeydown: [
|
|
220
|
-
t[4] || (t[4] = V((i) => e.$emit("keydown-enter-pressed"), ["enter"])),
|
|
221
|
-
t[5] || (t[5] = (i) => e.$emit("keydown", i))
|
|
222
|
-
]
|
|
223
|
-
}, null, 42, L),
|
|
224
|
-
p("fieldset", {
|
|
225
|
-
class: n(["uikit-pointer-events-none uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-m-0 uikit-box-border uikit-h-12 uikit-overflow-hidden uikit-bg-white uikit-px-2 uikit-py-0 uikit-text-left", [
|
|
226
|
-
{ "uikit-border-0": !e.border },
|
|
227
|
-
{ "uikit-bg-w-cultured": e.$attrs.disabled },
|
|
228
95
|
{
|
|
229
|
-
"
|
|
230
|
-
"uikit-rounded-xs": e.radius,
|
|
231
|
-
"is-invalid uikit-border-w-danger": e.isValid === !1,
|
|
232
|
-
"is-valid uikit-border-w-primary": e.isValid,
|
|
233
|
-
"uikit-border-w-secondary": e.isValid === null && e.border
|
|
96
|
+
"has-left-icon": e.$attrs["with-left-icon"] !== void 0 ? e.$attrs["with-left-icon"] : !!e.$slots.leftIcon
|
|
234
97
|
},
|
|
235
|
-
{ "
|
|
236
|
-
e.$attrs["fieldset-classes"]
|
|
98
|
+
{ "is-invalid": e.isValid === !1, "is-valid": e.isValid }
|
|
237
99
|
]])
|
|
238
100
|
}, [
|
|
239
|
-
e
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
101
|
+
p(e.$slots, "leftIcon", {}, void 0, !0),
|
|
102
|
+
p(e.$slots, "righticon", {
|
|
103
|
+
handleClean: q,
|
|
104
|
+
handleShowPasswd: z,
|
|
105
|
+
curType: o.value
|
|
106
|
+
}, void 0, !0),
|
|
107
|
+
v("input", {
|
|
108
|
+
id: e.$attrs.id,
|
|
109
|
+
ref_key: "baseInputEl",
|
|
110
|
+
ref: n,
|
|
111
|
+
"data-cy": e.$attrs["data-cy"],
|
|
112
|
+
name: e.$attrs.name,
|
|
113
|
+
class: b(["input-element uikit-peer uikit-relative uikit-z-10 uikit-box-border uikit-block uikit-h-12 uikit-w-full uikit-appearance-none uikit-truncate uikit-rounded-xs !uikit-border-none uikit-bg-transparent uikit-bg-no-repeat uikit-px-4 uikit-pt-5px uikit-outline-0 focus:uikit-shadow-none focus:uikit-outline-none", [
|
|
114
|
+
{ "uikit-text-w-secondary": e.$attrs.disabled },
|
|
115
|
+
{
|
|
116
|
+
"is-invalid invalid-bg !uikit-pr-9": e.isValid === !1,
|
|
117
|
+
"is-valid valid-bg !uikit-pr-9": e.isValid
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
"uikit-pr-[42px]": e.$attrs["with-right-icon"] !== void 0 ? e.$attrs["with-right-icon"] : !!e.$slots.righticon
|
|
121
|
+
},
|
|
122
|
+
{
|
|
123
|
+
"uikit-pl-[42px]": e.$attrs["with-left-icon"] !== void 0 ? e.$attrs["with-left-icon"] : !!e.$slots.leftIcon
|
|
124
|
+
},
|
|
125
|
+
e.inputClass
|
|
126
|
+
]]),
|
|
127
|
+
autocomplete: e.$attrs.autocomplete === "on" ? "on" : "off",
|
|
128
|
+
disabled: e.$attrs.disabled,
|
|
129
|
+
"aria-labelledby": e.$attrs.id,
|
|
130
|
+
readonly: e.$attrs.readonly,
|
|
131
|
+
type: o.value,
|
|
132
|
+
pattern: e.$attrs.pattern,
|
|
133
|
+
min: e.$attrs.min,
|
|
134
|
+
max: e.$attrs.max,
|
|
135
|
+
maxlength: e.$attrs.maxlength,
|
|
136
|
+
inputmode: e.$attrs.inputmode,
|
|
137
|
+
placeholder: e.$attrs.placeholder,
|
|
138
|
+
onClick: i[0] || (i[0] = (l) => f("click", l)),
|
|
139
|
+
onFocusin: i[1] || (i[1] = w(() => e.labelText && r(H)(), ["stop"])),
|
|
140
|
+
onFocusout: i[2] || (i[2] = w((l) => e.labelText && !e.keepFloatingLabel && r(V)(a.value), ["stop"])),
|
|
141
|
+
onInput: w(P, ["stop"]),
|
|
142
|
+
onKeydown: [
|
|
143
|
+
i[3] || (i[3] = G(() => f("keydownEnterPressed"), ["enter"])),
|
|
144
|
+
i[4] || (i[4] = (l) => f("keydown", l))
|
|
145
|
+
]
|
|
146
|
+
}, null, 42, W),
|
|
147
|
+
v("fieldset", {
|
|
148
|
+
class: b(["uikit-pointer-events-none uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-m-0 uikit-box-border uikit-h-12 uikit-overflow-hidden uikit-rounded-xs uikit-border uikit-border-solid uikit-bg-white uikit-px-2 uikit-py-0 uikit-text-left uikit-transition-[border] uikit-duration-100 uikit-ease-out peer-focus:uikit-border-2 peer-focus:uikit-border-w-primary peer-focus:[&.is-invalid]:uikit-border-w-danger", [
|
|
149
|
+
{ "uikit-bg-w-cultured": e.$attrs.disabled },
|
|
150
|
+
{
|
|
151
|
+
"is-invalid uikit-border-w-danger": e.isValid === !1,
|
|
152
|
+
"is-valid uikit-border-w-primary": e.isValid,
|
|
153
|
+
"uikit-border-w-secondary": e.isValid === null
|
|
154
|
+
},
|
|
155
|
+
{ "uikit-top-0": !e.labelText },
|
|
156
|
+
e.$attrs["fieldset-classes"]
|
|
157
|
+
]])
|
|
158
|
+
}, [
|
|
159
|
+
v("legend", X, [
|
|
160
|
+
v("span", {
|
|
161
|
+
class: b(["visible-label uikit-opacity-0", [
|
|
162
|
+
{ "uikit-mx-5px": e.labelText },
|
|
163
|
+
{
|
|
164
|
+
"uikit-visible uikit-inline-block": r(s) === "floating-label"
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"uikit-invisible uikit-hidden": r(s) === "inline-label"
|
|
168
|
+
}
|
|
169
|
+
]]),
|
|
170
|
+
innerHTML: e.labelText
|
|
171
|
+
}, null, 10, Y)
|
|
172
|
+
])
|
|
173
|
+
], 2),
|
|
174
|
+
e.labelText ? (u(), J(Q, {
|
|
175
|
+
key: 0,
|
|
176
|
+
for: e.$attrs.id,
|
|
177
|
+
"label-text": e.labelText,
|
|
178
|
+
"label-state": r(s),
|
|
179
|
+
"is-valid": e.isValid,
|
|
180
|
+
required: e.$attrs.required,
|
|
181
|
+
disabled: e.$attrs.disabled,
|
|
182
|
+
"label-classes": [
|
|
183
|
+
r(s) === "floating-label" ? "!-uikit-top-1" : "!uikit-top-4",
|
|
184
|
+
e.$attrs["label-classes"]
|
|
185
|
+
]
|
|
186
|
+
}, null, 8, ["for", "label-text", "label-state", "is-valid", "required", "disabled", "label-classes"])) : c("", !0),
|
|
187
|
+
p(e.$slots, "feedback", {}, () => [
|
|
188
|
+
e.isValid === !1 ? (u(!0), d(L, { key: 0 }, I(k.value.invalid, (l, h) => (u(), d("div", {
|
|
189
|
+
key: `${e.$attrs.id}_invalid_${h}`,
|
|
190
|
+
class: "uikit-mt-1 uikit-text-12 uikit-text-w-danger",
|
|
191
|
+
innerHTML: l
|
|
192
|
+
}, null, 8, Z))), 128)) : e.isValid === !0 ? (u(!0), d(L, { key: 1 }, I(k.value.valid, (l, h) => (u(), d("div", {
|
|
193
|
+
key: `${e.$attrs.id}_valid_${h}`,
|
|
194
|
+
class: "uikit-mt-1 uikit-text-12 uikit-text-w-primary",
|
|
195
|
+
innerHTML: l
|
|
196
|
+
}, null, 8, x))), 128)) : c("", !0)
|
|
197
|
+
], !0),
|
|
198
|
+
e.$slots["under-label"] ? (u(), d("div", _, [
|
|
199
|
+
p(e.$slots, "under-label", {}, void 0, !0)
|
|
200
|
+
])) : c("", !0)
|
|
201
|
+
], 2));
|
|
202
|
+
}
|
|
203
|
+
}), se = /* @__PURE__ */ U(ee, [["__scopeId", "data-v-55589da3"]]);
|
|
285
204
|
export {
|
|
286
|
-
|
|
205
|
+
se as default
|
|
287
206
|
};
|
package/dist/BaseSlider.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './assets/BaseSlider.css';
|
|
2
|
-
import
|
|
2
|
+
import p from "./BaseInput.js";
|
|
3
3
|
import { defineComponent as c, resolveComponent as S, openBlock as V, createElementBlock as g, createElementVNode as a, withModifiers as h, createVNode as d } from "vue";
|
|
4
4
|
import { _ as x } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
5
|
-
function
|
|
5
|
+
function f(t, i) {
|
|
6
6
|
const e = parseInt(t.value, 10), l = parseInt(i.value, 10);
|
|
7
7
|
return [e, l];
|
|
8
8
|
}
|
|
@@ -25,7 +25,7 @@ function u(t, i) {
|
|
|
25
25
|
}
|
|
26
26
|
const I = c({
|
|
27
27
|
name: "BaseSlider",
|
|
28
|
-
components: { BaseInput:
|
|
28
|
+
components: { BaseInput: p },
|
|
29
29
|
props: {
|
|
30
30
|
type: {
|
|
31
31
|
type: String,
|
|
@@ -170,7 +170,7 @@ const I = c({
|
|
|
170
170
|
controlFromSlider(t, i) {
|
|
171
171
|
if (!this.toSlider)
|
|
172
172
|
return;
|
|
173
|
-
const [e, l] =
|
|
173
|
+
const [e, l] = f(t, i), s = this.getCurrentValue(e);
|
|
174
174
|
m(
|
|
175
175
|
e,
|
|
176
176
|
{
|
|
@@ -186,7 +186,7 @@ const I = c({
|
|
|
186
186
|
controlToSlider(t, i) {
|
|
187
187
|
if (!this.toSlider)
|
|
188
188
|
return;
|
|
189
|
-
const [e, l] =
|
|
189
|
+
const [e, l] = f(t, i), s = this.getCurrentValue(l);
|
|
190
190
|
m(
|
|
191
191
|
this.sliderMinValue,
|
|
192
192
|
{
|
|
@@ -240,7 +240,7 @@ function b(t, i, e, l, s, r) {
|
|
|
240
240
|
pattern: "[0-9]*",
|
|
241
241
|
inputmode: "numeric",
|
|
242
242
|
"model-value": t.minValue,
|
|
243
|
-
"onUpdate:modelValue": i[2] || (i[2] = (n) => t.handleInputChange("min-input", n))
|
|
243
|
+
"onUpdate:modelValue": i[2] || (i[2] = (n) => t.handleInputChange("min-input", `${n || ""}`))
|
|
244
244
|
}, null, 8, ["model-value"])
|
|
245
245
|
]),
|
|
246
246
|
a("div", B, [
|
|
@@ -250,13 +250,13 @@ function b(t, i, e, l, s, r) {
|
|
|
250
250
|
pattern: "[0-9]*",
|
|
251
251
|
inputmode: "numeric",
|
|
252
252
|
"model-value": t.maxValue,
|
|
253
|
-
"onUpdate:modelValue": i[3] || (i[3] = (n) => t.handleInputChange("max-input", n))
|
|
253
|
+
"onUpdate:modelValue": i[3] || (i[3] = (n) => t.handleInputChange("max-input", `${n || ""}`))
|
|
254
254
|
}, null, 8, ["model-value"])
|
|
255
255
|
])
|
|
256
256
|
])
|
|
257
257
|
]);
|
|
258
258
|
}
|
|
259
|
-
const _ = /* @__PURE__ */ x(I, [["render", b], ["__scopeId", "data-v-
|
|
259
|
+
const _ = /* @__PURE__ */ x(I, [["render", b], ["__scopeId", "data-v-c77ef0f8"]]);
|
|
260
260
|
export {
|
|
261
261
|
_ as default
|
|
262
262
|
};
|
package/dist/BaseToggle.js
CHANGED
|
@@ -1,45 +1,44 @@
|
|
|
1
1
|
import './assets/BaseToggle.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { _ as
|
|
4
|
-
const
|
|
5
|
-
name: "BaseToggle",
|
|
2
|
+
import { defineComponent as a, mergeModels as n, useModel as d, openBlock as k, createElementBlock as c, normalizeClass as b, renderSlot as r, createElementVNode as i, withModifiers as p, createCommentVNode as f, pushScopeId as m, popScopeId as h } from "vue";
|
|
3
|
+
import { _ as g } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
4
|
+
const w = (t) => (m("data-v-1e6f488b"), t = t(), h(), t), _ = { class: "switch uikit-relative uikit-inline-block uikit-min-w-[40px] uikit-text-sm" }, y = ["data-cy", "checked"], v = /* @__PURE__ */ w(() => /* @__PURE__ */ i("span", { class: "slider round uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-top-0 uikit-cursor-pointer uikit-bg-w-lavender uikit-duration-300 before:uikit-absolute before:uikit-bottom-0 before:uikit-left-0 before:uikit-top-0 before:uikit-box-border before:uikit-h-[22px] before:uikit-w-[22px] before:uikit-rounded-circle before:uikit-border before:uikit-border-solid before:uikit-border-w-secondary before:uikit-bg-white before:uikit-shadow-sm before:uikit-duration-300 before:uikit-content-[''] peer-checked/toggle:uikit-bg-w-primary" }, null, -1)), B = ["innerHTML"], L = /* @__PURE__ */ a({
|
|
6
5
|
inheritAttrs: !1,
|
|
7
|
-
|
|
6
|
+
__name: "BaseToggle",
|
|
7
|
+
props: /* @__PURE__ */ n({
|
|
8
8
|
withRightLabel: { type: Boolean, default: !0 },
|
|
9
|
-
label: {
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
label: { default: "" }
|
|
10
|
+
}, {
|
|
11
|
+
modelValue: { type: Boolean, default: !1 },
|
|
12
|
+
modelModifiers: {}
|
|
13
|
+
}),
|
|
12
14
|
emits: ["update:modelValue"],
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
}
|
|
15
|
+
setup(t) {
|
|
16
|
+
const o = d(t, "modelValue"), u = ({ target: e }) => {
|
|
17
|
+
o.value = e.checked;
|
|
18
|
+
};
|
|
19
|
+
return (e, l) => (k(), c("div", {
|
|
20
|
+
class: b(["switch-container uikit-inline-block uikit-items-center", e.$attrs.class])
|
|
21
|
+
}, [
|
|
22
|
+
r(e.$slots, "leftLabel", {}, void 0, !0),
|
|
23
|
+
i("label", _, [
|
|
24
|
+
i("input", {
|
|
25
|
+
"data-cy": e.$attrs["data-cy"] ?? "",
|
|
26
|
+
class: "uikit-peer/toggle uikit-h-0 uikit-w-0 uikit-opacity-0",
|
|
27
|
+
type: "checkbox",
|
|
28
|
+
checked: o.value,
|
|
29
|
+
onInput: l[0] || (l[0] = p((s) => u(s), ["stop"]))
|
|
30
|
+
}, null, 40, y),
|
|
31
|
+
v
|
|
32
|
+
]),
|
|
33
|
+
e.withRightLabel ? r(e.$slots, "rightLabel", { key: 0 }, () => [
|
|
34
|
+
i("span", {
|
|
35
|
+
class: "uikit-ml-10px",
|
|
36
|
+
innerHTML: e.label
|
|
37
|
+
}, null, 8, B)
|
|
38
|
+
], !0) : f("", !0)
|
|
39
|
+
], 2));
|
|
17
40
|
}
|
|
18
|
-
}),
|
|
19
|
-
function y(e, i, _, $, v, B) {
|
|
20
|
-
return a(), s("div", {
|
|
21
|
-
class: u(["switch-container uikit-inline-block uikit-items-center", e.$attrs.class])
|
|
22
|
-
}, [
|
|
23
|
-
o(e.$slots, "leftLabel", {}, void 0, !0),
|
|
24
|
-
t("label", h, [
|
|
25
|
-
t("input", {
|
|
26
|
-
"data-cy": e.$attrs["data-cy"] ?? "",
|
|
27
|
-
class: "uikit-peer/toggle uikit-h-0 uikit-w-0 uikit-opacity-0",
|
|
28
|
-
type: "checkbox",
|
|
29
|
-
checked: e.modelValue,
|
|
30
|
-
onInput: i[0] || (i[0] = n((r) => e.handleToggle(r), ["stop"]))
|
|
31
|
-
}, null, 40, m),
|
|
32
|
-
g
|
|
33
|
-
]),
|
|
34
|
-
e.withRightLabel ? o(e.$slots, "rightLabel", { key: 0 }, () => [
|
|
35
|
-
t("span", {
|
|
36
|
-
class: "uikit-ml-10px",
|
|
37
|
-
innerHTML: e.label
|
|
38
|
-
}, null, 8, w)
|
|
39
|
-
], !0) : d("", !0)
|
|
40
|
-
], 2);
|
|
41
|
-
}
|
|
42
|
-
const V = /* @__PURE__ */ p(b, [["render", y], ["__scopeId", "data-v-1326e378"]]);
|
|
41
|
+
}), I = /* @__PURE__ */ g(L, [["__scopeId", "data-v-1e6f488b"]]);
|
|
43
42
|
export {
|
|
44
|
-
|
|
43
|
+
I as default
|
|
45
44
|
};
|