vectis-ui 0.9.1 → 0.10.1
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/components/VCombobox/VCombobox.d.ts +7 -0
- package/dist/components/VCombobox/VCombobox.js.map +1 -1
- package/dist/components/VCombobox/VCombobox.vue_vue_type_script_setup_true_lang.js +80 -71
- package/dist/components/VCombobox/VCombobox.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/VInput/VInput.css +1 -1
- package/dist/components/VInput/VInput.js.map +1 -1
- package/dist/components/VInput/VInput.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/VSlider/VSlider.css +1 -1
- package/dist/components/VSlider/VSlider.d.ts +12 -4
- package/dist/components/VSlider/VSlider.js.map +1 -1
- package/dist/components/VSlider/VSlider.vue_vue_type_script_setup_true_lang.js +104 -92
- package/dist/components/VSlider/VSlider.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/styles.css +1 -1
- package/dist/tokens/index.d.ts +5 -0
- package/dist/tokens/semantic.d.ts +5 -0
- package/dist/tokens/semantic.js +5 -0
- package/dist/tokens/semantic.js.map +1 -1
- package/dist/tokens.json +14 -0
- package/package.json +1 -1
|
@@ -9,19 +9,20 @@ import { useRootAttrs as s } from "../../composables/useRootAttrs.js";
|
|
|
9
9
|
import { useFieldIds as c } from "../../composables/useFieldIds.js";
|
|
10
10
|
import { inputGroupKey as ee } from "../VInput/context.js";
|
|
11
11
|
import l from "../VInput/VInput.js";
|
|
12
|
-
import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as te, defineComponent as g, inject as ne, mergeModels as _, mergeProps as
|
|
12
|
+
import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as te, defineComponent as g, inject as ne, mergeModels as _, mergeProps as v, normalizeClass as y, normalizeStyle as b, openBlock as x, reactive as re, ref as ie, renderList as S, toDisplayString as C, unref as w, useModel as ae, watch as oe, watchEffect as se } from "vue";
|
|
13
13
|
//#region src/components/VSlider/VSlider.vue?vue&type=script&setup=true&lang.ts
|
|
14
|
-
var
|
|
14
|
+
var ce = [
|
|
15
15
|
"data-range",
|
|
16
16
|
"data-disabled",
|
|
17
17
|
"data-readonly",
|
|
18
18
|
"data-invalid",
|
|
19
19
|
"data-size",
|
|
20
|
-
"data-orientation"
|
|
21
|
-
|
|
20
|
+
"data-orientation",
|
|
21
|
+
"data-inputs"
|
|
22
|
+
], le = { class: "v-slider-rail" }, ue = { class: "v-slider-control" }, de = {
|
|
22
23
|
class: "v-slider-track",
|
|
23
24
|
"aria-hidden": "true"
|
|
24
|
-
},
|
|
25
|
+
}, fe = ["data-filled"], pe = [
|
|
25
26
|
"min",
|
|
26
27
|
"max",
|
|
27
28
|
"step",
|
|
@@ -31,7 +32,7 @@ var se = [
|
|
|
31
32
|
"aria-valuetext",
|
|
32
33
|
"aria-invalid",
|
|
33
34
|
"aria-readonly"
|
|
34
|
-
],
|
|
35
|
+
], me = [
|
|
35
36
|
"aria-invalid",
|
|
36
37
|
"aria-readonly",
|
|
37
38
|
"aria-valuetext",
|
|
@@ -42,18 +43,18 @@ var se = [
|
|
|
42
43
|
"value",
|
|
43
44
|
"aria-label",
|
|
44
45
|
"aria-describedby"
|
|
45
|
-
],
|
|
46
|
+
], he = {
|
|
46
47
|
key: 0,
|
|
47
48
|
class: "v-slider-tooltip v-slider-tooltip-start",
|
|
48
49
|
"aria-hidden": "true"
|
|
49
|
-
},
|
|
50
|
+
}, ge = { class: "v-slider-tooltip-bubble" }, _e = {
|
|
50
51
|
key: 1,
|
|
51
52
|
class: "v-slider-tooltip v-slider-tooltip-end",
|
|
52
53
|
"aria-hidden": "true"
|
|
53
|
-
},
|
|
54
|
-
key:
|
|
54
|
+
}, ve = { class: "v-slider-tooltip-bubble" }, ye = {
|
|
55
|
+
key: 0,
|
|
55
56
|
class: "v-slider-labels"
|
|
56
|
-
},
|
|
57
|
+
}, be = ["id"], T = /*@__PURE__*/ g({
|
|
57
58
|
inheritAttrs: !1,
|
|
58
59
|
__name: "VSlider",
|
|
59
60
|
props: /*@__PURE__*/ _({
|
|
@@ -81,7 +82,7 @@ var se = [
|
|
|
81
82
|
hint: { default: void 0 },
|
|
82
83
|
orientation: { default: "horizontal" },
|
|
83
84
|
inputs: {
|
|
84
|
-
type: Boolean,
|
|
85
|
+
type: [Boolean, String],
|
|
85
86
|
default: !1
|
|
86
87
|
},
|
|
87
88
|
ticks: {
|
|
@@ -113,7 +114,7 @@ var se = [
|
|
|
113
114
|
return D.value = n, n;
|
|
114
115
|
}
|
|
115
116
|
let L = (e, t) => Array.isArray(e) ? e[t === "start" ? 0 : 1] : e;
|
|
116
|
-
function
|
|
117
|
+
function R(e, t) {
|
|
117
118
|
let n = t.target;
|
|
118
119
|
if (E.readonly) {
|
|
119
120
|
n.value = String(P(e));
|
|
@@ -132,16 +133,16 @@ var se = [
|
|
|
132
133
|
"PageUp",
|
|
133
134
|
"PageDown"
|
|
134
135
|
]);
|
|
135
|
-
function
|
|
136
|
+
function z(e) {
|
|
136
137
|
E.readonly && xe.has(e.key) && e.preventDefault();
|
|
137
138
|
}
|
|
138
|
-
function
|
|
139
|
+
function B(e, t) {
|
|
139
140
|
if (E.readonly) return;
|
|
140
141
|
let n = Number(t.target.value);
|
|
141
142
|
E.range ? e === "start" ? O("change", [n, Math.max(n, N.value)]) : O("change", [Math.min(n, M.value), n]) : O("change", n);
|
|
142
143
|
}
|
|
143
|
-
let
|
|
144
|
-
let e = Math.max(
|
|
144
|
+
let V = d(() => E.step > 0 ? Math.floor((E.max - E.min) / E.step + 1e-9) : 0), Se = d(() => E.step > 0 ? E.min + V.value * E.step : E.max), H = d(() => (E.ticks || E.labels !== void 0) && V.value >= 1 && V.value <= 50), U = d(() => {
|
|
145
|
+
let e = Math.max(H.value ? V.value + 1 : 0, E.labels?.length ?? 0);
|
|
145
146
|
return Array.from({ length: e }, (e, t) => {
|
|
146
147
|
let n = E.min + t * E.step;
|
|
147
148
|
return {
|
|
@@ -149,26 +150,30 @@ var se = [
|
|
|
149
150
|
style: { "--fill-fraction": String(F(n)) }
|
|
150
151
|
};
|
|
151
152
|
});
|
|
152
|
-
}), Ce = d(() =>
|
|
153
|
-
function
|
|
153
|
+
}), Ce = d(() => H.value ? U.value.slice(0, V.value + 1) : []), we = (e) => E.range ? e >= M.value && e <= N.value : e <= N.value;
|
|
154
|
+
function W(e) {
|
|
154
155
|
let t = E.labels?.[Math.round((e - E.min) / E.step)];
|
|
155
156
|
return t === void 0 ? String(e) : typeof t == "string" ? t : t.label;
|
|
156
157
|
}
|
|
157
|
-
let
|
|
158
|
+
let G = t(), K = a(() => E.label), q = d(() => K.value ? G.value.slider.rangeStart(K.value) : G.value.slider.start), J = d(() => K.value ? G.value.slider.rangeEnd(K.value) : G.value.slider.end), Te = d(() => E.range ? J.value : K.value), Ee = d(() => E.range ? J.value : K.value ?? G.value.slider.value), De = d(() => E.range && E.labels ? W(M.value) : void 0), Oe = d(() => E.labels ? W(N.value) : void 0), { attrs: Y, rootClass: ke, rootStyle: Ae, forwardedAttrs: je } = s(), { hintId: Me, describedBy: Ne } = c(Y, () => !!E.hint), X = d(() => E.inputs === "top" || E.inputs === "bottom" ? E.inputs : E.inputs && "ends");
|
|
158
159
|
if (e) {
|
|
159
160
|
let e = /* @__PURE__ */ new Set(), t = (t, n) => {
|
|
160
161
|
e.has(t) || (e.add(t), console.warn(`[VSlider] ${n}`));
|
|
161
162
|
};
|
|
162
|
-
|
|
163
|
-
E.step <= 0 && t("step", `step="${E.step}" cannot move a thumb: the arrow keys do nothing and a value typed into a field is committed as it stands. Give a positive step.`), (E.ticks || E.labels) &&
|
|
163
|
+
se(() => {
|
|
164
|
+
E.step <= 0 && t("step", `step="${E.step}" cannot move a thumb: the arrow keys do nothing and a value typed into a field is committed as it stands. Give a positive step.`), (E.ticks || E.labels) && V.value > 50 && t("ticks", `${V.value} steps: no tick is drawn past 50, the comb being unreadable.`), E.labels && E.labels.length !== V.value + 1 && t("labels", `${E.labels.length} labels for ${V.value + 1} steps: one label per step expected.`), E.inputs !== !1 && E.inputs !== X.value && t("inputs", `inputs="${String(E.inputs)}" is not a placement: the fields are drawn at the ends. Write inputs="ends", "top" or "bottom".`), E.range && Y.name !== void 0 && t("name", `name="${String(Y.name)}" on a range: only the end thumb carries it, so the form receives one value of the two. Bind the model to two inputs of your own instead.`);
|
|
164
165
|
});
|
|
165
166
|
}
|
|
166
|
-
let
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
})
|
|
170
|
-
|
|
171
|
-
|
|
167
|
+
let Z = re({
|
|
168
|
+
start: String(M.value),
|
|
169
|
+
end: String(N.value)
|
|
170
|
+
});
|
|
171
|
+
oe(M, (e) => {
|
|
172
|
+
E.range && (Z.start = String(e));
|
|
173
|
+
}), oe(N, (e) => Z.end = String(e));
|
|
174
|
+
let Pe = d(() => X.value === "ends" ? E.range ? ["start"] : [] : X.value === "top" ? E.range ? ["start", "end"] : ["end"] : []), Fe = d(() => X.value === "ends" ? ["end"] : X.value === "bottom" ? E.range ? ["start", "end"] : ["end"] : []), Ie = (e) => e === "start" ? q.value : Ee.value;
|
|
175
|
+
function Le(e) {
|
|
176
|
+
let t = Z[e], n = Number.parseFloat(String(t));
|
|
172
177
|
if (Number.isNaN(n)) {
|
|
173
178
|
Q();
|
|
174
179
|
return;
|
|
@@ -177,43 +182,46 @@ var se = [
|
|
|
177
182
|
L(c, e) !== s && O("change", c), Q();
|
|
178
183
|
}
|
|
179
184
|
function Q() {
|
|
180
|
-
E.range && (
|
|
185
|
+
E.range && (Z.start = String(M.value)), Z.end = String(N.value);
|
|
181
186
|
}
|
|
182
|
-
let $ =
|
|
187
|
+
let $ = ie(null);
|
|
183
188
|
return _({
|
|
184
189
|
focus: (e) => $.value?.focus(e),
|
|
185
190
|
el: $
|
|
186
|
-
}), (e, t) => (
|
|
187
|
-
class:
|
|
191
|
+
}), (e, t) => (x(), m("div", {
|
|
192
|
+
class: y(["v-slider", w(ke)]),
|
|
188
193
|
"data-range": g.range ? "" : void 0,
|
|
189
|
-
"data-disabled":
|
|
194
|
+
"data-disabled": w(j) ? "" : void 0,
|
|
190
195
|
"data-readonly": g.readonly ? "" : void 0,
|
|
191
196
|
"data-invalid": g.invalid ? "" : void 0,
|
|
192
|
-
"data-size":
|
|
197
|
+
"data-size": w(k),
|
|
193
198
|
"data-orientation": g.orientation,
|
|
194
|
-
|
|
199
|
+
"data-inputs": X.value || void 0,
|
|
200
|
+
style: b([w(Ae), {
|
|
195
201
|
"--slider-start-fraction": g.range ? String(F(M.value)) : void 0,
|
|
196
202
|
"--slider-end-fraction": String(F(N.value))
|
|
197
203
|
}])
|
|
198
204
|
}, [
|
|
199
|
-
|
|
200
|
-
key:
|
|
201
|
-
modelValue:
|
|
202
|
-
"onUpdate:modelValue": t
|
|
203
|
-
class: "v-slider-field v-slider-field
|
|
205
|
+
(x(!0), m(u, null, S(Pe.value, (e) => (x(), f(l, {
|
|
206
|
+
key: e,
|
|
207
|
+
modelValue: Z[e],
|
|
208
|
+
"onUpdate:modelValue": (t) => Z[e] = t,
|
|
209
|
+
class: y(["v-slider-field", `v-slider-field-${e}`]),
|
|
204
210
|
type: "number",
|
|
205
|
-
size:
|
|
206
|
-
compact:
|
|
211
|
+
size: w(k),
|
|
212
|
+
compact: w(A),
|
|
207
213
|
min: g.min,
|
|
208
214
|
max: g.max,
|
|
209
215
|
step: g.step,
|
|
210
|
-
disabled:
|
|
216
|
+
disabled: w(j),
|
|
211
217
|
readonly: g.readonly,
|
|
212
218
|
invalid: g.invalid,
|
|
213
|
-
"aria-label":
|
|
214
|
-
onChange: t
|
|
219
|
+
"aria-label": Ie(e),
|
|
220
|
+
onChange: (t) => Le(e)
|
|
215
221
|
}, null, 8, [
|
|
216
222
|
"modelValue",
|
|
223
|
+
"onUpdate:modelValue",
|
|
224
|
+
"class",
|
|
217
225
|
"size",
|
|
218
226
|
"compact",
|
|
219
227
|
"min",
|
|
@@ -222,83 +230,86 @@ var se = [
|
|
|
222
230
|
"disabled",
|
|
223
231
|
"readonly",
|
|
224
232
|
"invalid",
|
|
225
|
-
"aria-label"
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
233
|
+
"aria-label",
|
|
234
|
+
"onChange"
|
|
235
|
+
]))), 128)),
|
|
236
|
+
h("div", le, [
|
|
237
|
+
h("span", ue, [
|
|
238
|
+
h("span", de, [t[4] ||= h("span", { class: "v-slider-fill" }, null, -1), (x(!0), m(u, null, S(Ce.value, (e, t) => (x(), m("span", {
|
|
230
239
|
key: t,
|
|
231
240
|
class: "v-slider-tick",
|
|
232
241
|
"data-filled": we(e.value) ? "" : void 0,
|
|
233
|
-
style:
|
|
234
|
-
}, null, 12,
|
|
235
|
-
g.range ? (
|
|
242
|
+
style: b(e.style)
|
|
243
|
+
}, null, 12, fe))), 128))]),
|
|
244
|
+
g.range ? (x(), m("input", {
|
|
236
245
|
key: 0,
|
|
237
246
|
type: "range",
|
|
238
247
|
class: "v-slider-input v-slider-input-start",
|
|
239
248
|
min: g.min,
|
|
240
249
|
max: g.max,
|
|
241
250
|
step: g.step,
|
|
242
|
-
disabled:
|
|
251
|
+
disabled: w(j),
|
|
243
252
|
value: M.value,
|
|
244
|
-
"aria-label":
|
|
245
|
-
"aria-valuetext":
|
|
253
|
+
"aria-label": q.value,
|
|
254
|
+
"aria-valuetext": De.value,
|
|
246
255
|
"aria-invalid": g.invalid || void 0,
|
|
247
256
|
"aria-readonly": g.readonly || void 0,
|
|
248
|
-
onKeydown:
|
|
249
|
-
onInput: t[
|
|
250
|
-
onChange: t[
|
|
251
|
-
}, null, 40,
|
|
252
|
-
h("input",
|
|
257
|
+
onKeydown: z,
|
|
258
|
+
onInput: t[0] ||= (e) => R("start", e),
|
|
259
|
+
onChange: t[1] ||= (e) => B("start", e)
|
|
260
|
+
}, null, 40, pe)) : p("", !0),
|
|
261
|
+
h("input", v({
|
|
253
262
|
ref_key: "endThumbEl",
|
|
254
263
|
ref: $,
|
|
255
264
|
"aria-invalid": g.invalid || void 0,
|
|
256
265
|
"aria-readonly": g.readonly || void 0,
|
|
257
|
-
"aria-valuetext":
|
|
258
|
-
},
|
|
266
|
+
"aria-valuetext": Oe.value
|
|
267
|
+
}, w(je), {
|
|
259
268
|
type: "range",
|
|
260
269
|
class: "v-slider-input v-slider-input-end",
|
|
261
270
|
min: g.min,
|
|
262
271
|
max: g.max,
|
|
263
272
|
step: g.step,
|
|
264
|
-
disabled:
|
|
273
|
+
disabled: w(j),
|
|
265
274
|
value: N.value,
|
|
266
275
|
"aria-label": Te.value,
|
|
267
|
-
"aria-describedby":
|
|
268
|
-
onKeydown:
|
|
269
|
-
onInput: t[
|
|
270
|
-
onChange: t[
|
|
271
|
-
}), null, 16,
|
|
276
|
+
"aria-describedby": w(Ne),
|
|
277
|
+
onKeydown: z,
|
|
278
|
+
onInput: t[2] ||= (e) => R("end", e),
|
|
279
|
+
onChange: t[3] ||= (e) => B("end", e)
|
|
280
|
+
}), null, 16, me)
|
|
272
281
|
]),
|
|
273
|
-
g.tooltip && g.range ? (
|
|
274
|
-
g.tooltip ? (
|
|
282
|
+
g.tooltip && g.range ? (x(), m("span", he, [h("span", ge, C(De.value ?? M.value), 1)])) : p("", !0),
|
|
283
|
+
g.tooltip ? (x(), m("span", _e, [h("span", ve, C(Oe.value ?? N.value), 1)])) : p("", !0)
|
|
275
284
|
]),
|
|
276
|
-
g.labels ? (
|
|
285
|
+
g.labels ? (x(), m("div", ye, [(x(!0), m(u, null, S(g.labels, (e, t) => (x(), m("span", {
|
|
277
286
|
key: t,
|
|
278
287
|
class: "v-slider-label",
|
|
279
|
-
style:
|
|
280
|
-
}, [typeof e == "string" ? (
|
|
288
|
+
style: b(U.value[t]?.style)
|
|
289
|
+
}, [typeof e == "string" ? (x(), m(u, { key: 0 }, [te(C(e), 1)], 64)) : (x(), f(r, v({
|
|
281
290
|
key: 1,
|
|
282
291
|
ref_for: !0
|
|
283
|
-
},
|
|
284
|
-
|
|
285
|
-
key:
|
|
286
|
-
modelValue: Z
|
|
287
|
-
"onUpdate:modelValue": t
|
|
288
|
-
class: "v-slider-field v-slider-field
|
|
292
|
+
}, w(n)(e.icon), { label: e.label }), null, 16, ["label"]))], 4))), 128))])) : p("", !0),
|
|
293
|
+
(x(!0), m(u, null, S(Fe.value, (e) => (x(), f(l, {
|
|
294
|
+
key: e,
|
|
295
|
+
modelValue: Z[e],
|
|
296
|
+
"onUpdate:modelValue": (t) => Z[e] = t,
|
|
297
|
+
class: y(["v-slider-field", `v-slider-field-${e}`]),
|
|
289
298
|
type: "number",
|
|
290
|
-
size:
|
|
291
|
-
compact:
|
|
299
|
+
size: w(k),
|
|
300
|
+
compact: w(A),
|
|
292
301
|
min: g.min,
|
|
293
302
|
max: g.max,
|
|
294
303
|
step: g.step,
|
|
295
|
-
disabled:
|
|
304
|
+
disabled: w(j),
|
|
296
305
|
readonly: g.readonly,
|
|
297
306
|
invalid: g.invalid,
|
|
298
|
-
"aria-label":
|
|
299
|
-
onChange: t
|
|
307
|
+
"aria-label": Ie(e),
|
|
308
|
+
onChange: (t) => Le(e)
|
|
300
309
|
}, null, 8, [
|
|
301
310
|
"modelValue",
|
|
311
|
+
"onUpdate:modelValue",
|
|
312
|
+
"class",
|
|
302
313
|
"size",
|
|
303
314
|
"compact",
|
|
304
315
|
"min",
|
|
@@ -307,14 +318,15 @@ var se = [
|
|
|
307
318
|
"disabled",
|
|
308
319
|
"readonly",
|
|
309
320
|
"invalid",
|
|
310
|
-
"aria-label"
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
321
|
+
"aria-label",
|
|
322
|
+
"onChange"
|
|
323
|
+
]))), 128)),
|
|
324
|
+
g.hint ? (x(), m("span", {
|
|
325
|
+
key: 1,
|
|
326
|
+
id: w(Me),
|
|
315
327
|
class: "v-slider-hint"
|
|
316
|
-
},
|
|
317
|
-
], 14,
|
|
328
|
+
}, C(g.hint), 9, be)) : p("", !0)
|
|
329
|
+
], 14, ce));
|
|
318
330
|
}
|
|
319
331
|
});
|
|
320
332
|
//#endregion
|