blessing-ui 0.1.0 → 0.3.0

package/dist/components/BlessScheduler.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,347 @@
+import e from "./BlessButton.js";
+import { addDays as t, fromISO as n, isoToday as r, toISO as i } from "../composables/date.js";
+import { fmtTime as ee, layoutDay as te, moveEvent as a, nextEventId as ne, resizeEvent as o, snapTo as s, weekOf as re } from "../composables/schedule.js";
+import { Fragment as c, computed as l, createBlock as ie, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, defineComponent as h, mergeModels as g, nextTick as _, normalizeClass as v, normalizeStyle as y, onMounted as ae, openBlock as b, ref as x, renderList as S, toDisplayString as C, unref as w, useId as oe, useModel as T, withCtx as E } from "vue";
+//#region src/components/BlessScheduler.vue?vue&type=script&setup=true&lang.ts
+var se = ["aria-label"], ce = { class: "bless-sched__bar" }, le = {
+	class: "bless-sched__title",
+	"aria-live": "polite"
+}, ue = {
+	key: 0,
+	class: "bless-sched__scroll"
+}, de = { class: "bless-sched__body" }, fe = ["aria-label", "onPointerdown"], pe = [
+	"data-event",
+	"aria-pressed",
+	"aria-label",
+	"tabindex",
+	"onPointerdown",
+	"onKeydown",
+	"onFocus"
+], me = { class: "bless-sched__etitle" }, he = { class: "bless-sched__etime" }, ge = ["onPointerdown"], _e = {
+	key: 1,
+	class: "bless-sched__edit"
+}, ve = { class: "bless-sched__field" }, ye = ["value"], be = { class: "bless-sched__when" }, xe = {
+	class: "bless-sched__live",
+	"aria-live": "polite"
+}, D = /*@__PURE__*/ h({
+	name: "BlessScheduler",
+	__name: "BlessScheduler",
+	props: /*@__PURE__*/ g({
+		view: { default: "week" },
+		weekStart: { default: 1 },
+		dayStart: { default: 7 },
+		dayEnd: { default: 20 },
+		snap: { default: 15 },
+		hourHeight: { default: 48 },
+		locale: { default: "en" },
+		editable: {
+			type: Boolean,
+			default: !0
+		},
+		label: { default: "Schedule" },
+		labels: {}
+	}, {
+		modelValue: { default: () => [] },
+		modelModifiers: {},
+		date: { default: null },
+		dateModifiers: {},
+		selected: { default: null },
+		selectedModifiers: {}
+	}),
+	emits: /*@__PURE__*/ g([
+		"create",
+		"change",
+		"remove"
+	], [
+		"update:modelValue",
+		"update:date",
+		"update:selected"
+	]),
+	setup(h, { emit: g }) {
+		let D = h, O = T(h, "modelValue"), k = T(h, "date"), A = T(h, "selected"), j = g, M = l(() => ({
+			prev: "Previous",
+			next: "Next",
+			today: "Today",
+			add: "Add event",
+			remove: "Remove",
+			title: "Title",
+			newEvent: "New event",
+			eventName: (e, t, n, r) => `${e}, ${t}, ${n} to ${r}`,
+			moved: (e, t, n, r) => `${e}: ${t}, ${n} to ${r}`,
+			added: (e) => `${e} added`,
+			removed: (e) => `${e} removed`,
+			hint: "Arrow keys move the event, Alt with up or down changes its length, Delete removes it.",
+			...D.labels
+		})), N = `${oe()}-hint`, P = x(""), F = x(), I = x(), L = l(() => k.value ?? O.value[0]?.date ?? null), R = x("");
+		ae(() => {
+			R.value = r(), L.value || (k.value = R.value);
+		});
+		let z = l(() => D.dayStart * 60), B = l(() => D.dayEnd * 60), V = (e) => (e - z.value) / 60 * D.hourHeight, H = l(() => (D.dayEnd - D.dayStart) * D.hourHeight), Se = l(() => Array.from({ length: D.dayEnd - D.dayStart }, (e, t) => D.dayStart + t)), U = l(() => {
+			if (!L.value) return [];
+			if (D.view === "day") return [L.value];
+			let e = n(re(L.value, D.weekStart));
+			return Array.from({ length: 7 }, (n, r) => i(t(e, r)));
+		}), Ce = l(() => new Intl.DateTimeFormat(D.locale, {
+			weekday: "short",
+			day: "numeric"
+		})), we = l(() => new Intl.DateTimeFormat(D.locale, {
+			weekday: "long",
+			day: "numeric",
+			month: "long"
+		})), W = l(() => new Intl.DateTimeFormat(D.locale, {
+			day: "numeric",
+			month: "short",
+			year: "numeric"
+		})), Te = l(() => {
+			let e = U.value;
+			return e.length ? e.length === 1 ? W.value.format(n(e[0])) : `${W.value.format(n(e[0]))} – ${W.value.format(n(e.at(-1)))}` : "";
+		}), G = (e) => ee(e, D.locale), K = (e) => we.value.format(n(e)), Ee = (e) => O.value.filter((t) => t.date === e), De = l(() => new Map(U.value.map((e) => [e, te(Ee(e))]))), Oe = (e) => M.value.eventName(e.title, K(e.date), G(e.start), G(e.end)), q = l(() => O.value.find((e) => e.id === A.value)), J = (e) => {
+			O.value = O.value.map((t) => t.id === e.id ? e : t), j("change", e);
+		}, ke = (e) => P.value = M.value.moved(e.title, K(e.date), G(e.start), G(e.end));
+		function Ae(e) {
+			let t = {
+				id: ne(O.value),
+				title: M.value.newEvent,
+				...e
+			};
+			O.value = [...O.value, t], A.value = t.id, j("create", t), P.value = M.value.added(t.title), _(() => F.value?.select());
+		}
+		function je() {
+			let e = U.value[0];
+			if (!e) return;
+			let t = Math.min(z.value + 60, B.value - 60);
+			Ae({
+				date: e,
+				start: t,
+				end: Math.min(t + 60, B.value)
+			});
+		}
+		function Me(e) {
+			let t = O.value.indexOf(e), n = O.value.filter((t) => t !== e);
+			O.value = n, j("remove", e), P.value = M.value.removed(e.title), A.value = n[Math.min(t, n.length - 1)]?.id ?? null, _(() => A.value ? Ne(A.value) : I.value?.focus());
+		}
+		let Ne = (e) => I.value?.querySelector(`[data-event="${CSS.escape(e)}"]`)?.focus(), Pe = (e) => {
+			let t = I.value.getBoundingClientRect();
+			return Math.min(B.value, Math.max(z.value, s(z.value + (e - t.top) / D.hourHeight * 60, D.snap)));
+		}, Y = (e) => {
+			let t = I.value.getBoundingClientRect(), n = U.value.length;
+			return Math.min(n - 1, Math.max(0, Math.floor((e - t.left) / (t.width || 1) * n)));
+		}, X = null, Z = x(null);
+		function Fe(e, t) {
+			if (t.button || !D.editable || t.target !== t.currentTarget) return;
+			A.value = null, t.currentTarget.setPointerCapture?.(t.pointerId);
+			let n = Pe(t.clientY);
+			X = {
+				kind: "make",
+				date: e,
+				a: n
+			}, Z.value = {
+				date: e,
+				start: n,
+				end: n
+			};
+		}
+		function Ie(e, t, n) {
+			t.button || (t.stopPropagation(), A.value = e.id, D.editable && (t.currentTarget.setPointerCapture?.(t.pointerId), X = n === "move" ? {
+				kind: n,
+				e,
+				y: t.clientY,
+				col: Y(t.clientX)
+			} : {
+				kind: n,
+				e,
+				y: t.clientY
+			}));
+		}
+		function Le(e) {
+			let t = X;
+			if (t) {
+				if (t.kind === "make") {
+					let n = Pe(e.clientY);
+					Z.value = {
+						date: t.date,
+						start: Math.min(t.a, n),
+						end: Math.max(t.a, n)
+					};
+				} else if (t.kind === "move") {
+					let n = s((e.clientY - t.y) / D.hourHeight * 60, D.snap);
+					J(a(t.e, n, Y(e.clientX) - t.col, z.value, B.value));
+				} else {
+					let n = s((e.clientY - t.y) / D.hourHeight * 60, D.snap);
+					J(o(t.e, n, D.snap, B.value));
+				}
+			}
+		}
+		function Re() {
+			let e = X, t = Z.value;
+			if (X = null, Z.value = null, e?.kind === "make" && t && t.end - t.start >= D.snap) Ae(t);
+			else if (e && e.kind !== "make") {
+				let t = O.value.find((t) => t.id === e.e.id);
+				t && ke(t);
+			}
+		}
+		function ze(e, t) {
+			if (t.target.closest("input")) return;
+			let n = {
+				ArrowUp: [-1, 0],
+				ArrowDown: [1, 0],
+				ArrowLeft: [0, -1],
+				ArrowRight: [0, 1]
+			}[t.key];
+			if (n && D.editable) {
+				t.preventDefault();
+				let r;
+				r = t.altKey ? o(e, n[0] * D.snap, D.snap, B.value) : a(e, n[0] * D.snap, D.view === "week" ? n[1] : 0, z.value, B.value), U.value.includes(r.date) || (r = {
+					...r,
+					date: e.date
+				}), J(r), ke(r), r.date !== e.date && _(() => Ne(e.id));
+			} else (t.key === "Delete" || t.key === "Backspace") && D.editable ? (t.preventDefault(), Me(e)) : (t.key === "Enter" || t.key === " ") && (t.preventDefault(), A.value = e.id, _(() => F.value?.focus()));
+		}
+		let Be = (e) => {
+			L.value && (k.value = i(t(n(L.value), e * (D.view === "week" ? 7 : 1))));
+		}, Ve = l(() => A.value ?? O.value.find((e) => U.value.includes(e.date))?.id), Q = (e) => ({
+			top: `${V(e.start)}px`,
+			height: `${V(e.end) - V(e.start)}px`
+		}), $ = (e, t) => De.value.get(e)?.get(t) ?? {
+			lane: 0,
+			lanes: 1
+		};
+		return (t, i) => (b(), d("div", {
+			class: "bless-sched",
+			role: "group",
+			"aria-label": h.label
+		}, [
+			f("div", ce, [
+				m(e, {
+					size: "sm",
+					variant: "outline",
+					"aria-label": M.value.prev,
+					onClick: i[0] ||= (e) => Be(-1)
+				}, {
+					default: E(() => [...i[5] ||= [p("‹", -1)]]),
+					_: 1
+				}, 8, ["aria-label"]),
+				m(e, {
+					size: "sm",
+					variant: "outline",
+					onClick: i[1] ||= (e) => k.value = w(r)()
+				}, {
+					default: E(() => [p(C(M.value.today), 1)]),
+					_: 1
+				}),
+				m(e, {
+					size: "sm",
+					variant: "outline",
+					"aria-label": M.value.next,
+					onClick: i[2] ||= (e) => Be(1)
+				}, {
+					default: E(() => [...i[6] ||= [p("›", -1)]]),
+					_: 1
+				}, 8, ["aria-label"]),
+				f("strong", le, C(Te.value), 1),
+				h.editable ? (b(), ie(e, {
+					key: 0,
+					size: "sm",
+					class: "bless-sched__add",
+					onClick: je
+				}, {
+					default: E(() => [p(C(M.value.add), 1)]),
+					_: 1
+				})) : u("", !0)
+			]),
+			U.value.length ? (b(), d("div", ue, [f("div", {
+				class: "bless-sched__head",
+				style: y({ "--_n": U.value.length })
+			}, [i[7] ||= f("span", { class: "bless-sched__corner" }, null, -1), (b(!0), d(c, null, S(U.value, (e) => (b(), d("span", {
+				key: e,
+				class: v(["bless-sched__day", { "bless-sched__day--today": e === R.value }])
+			}, C(Ce.value.format(w(n)(e))), 3))), 128))], 4), f("div", de, [f("div", {
+				class: "bless-sched__gutter",
+				"aria-hidden": "true",
+				style: y({ height: `${H.value}px` })
+			}, [(b(!0), d(c, null, S(Se.value, (e) => (b(), d("span", {
+				key: e,
+				class: "bless-sched__hour",
+				style: y({ top: `${V(e * 60)}px` })
+			}, C(G(e * 60)), 5))), 128))], 4), f("div", {
+				ref_key: "cols",
+				ref: I,
+				class: "bless-sched__cols",
+				style: y({
+					height: `${H.value}px`,
+					"--_n": U.value.length,
+					"--_h": `${h.hourHeight}px`
+				}),
+				tabindex: "-1",
+				"aria-describedby": N,
+				onPointermove: Le,
+				onPointerup: Re,
+				onPointercancel: Re
+			}, [(b(!0), d(c, null, S(U.value, (e) => (b(), d("div", {
+				key: e,
+				class: "bless-sched__col",
+				role: "group",
+				"aria-label": K(e),
+				onPointerdown: (t) => Fe(e, t)
+			}, [(b(!0), d(c, null, S(Ee(e), (t) => (b(), d("div", {
+				key: t.id,
+				class: v(["bless-sched__event", { "bless-sched__event--sel": A.value === t.id }]),
+				style: y({
+					...Q(t),
+					left: `calc(${$(e, t.id).lane / $(e, t.id).lanes * 100}% + 1px)`,
+					width: `calc(${100 / $(e, t.id).lanes}% - 3px)`
+				}),
+				"data-event": t.id,
+				role: "button",
+				"aria-pressed": A.value === t.id,
+				"aria-label": Oe(t),
+				tabindex: Ve.value === t.id ? 0 : -1,
+				onPointerdown: (e) => Ie(t, e, "move"),
+				onKeydown: (e) => ze(t, e),
+				onFocus: (e) => A.value = t.id
+			}, [
+				f("span", me, C(t.title), 1),
+				f("span", he, C(G(t.start)) + "–" + C(G(t.end)), 1),
+				h.editable ? (b(), d("span", {
+					key: 0,
+					class: "bless-sched__foot",
+					"aria-hidden": "true",
+					onPointerdown: (e) => Ie(t, e, "size")
+				}, null, 40, ge)) : u("", !0)
+			], 46, pe))), 128)), Z.value && Z.value.date === e ? (b(), d("div", {
+				key: 0,
+				class: "bless-sched__event bless-sched__event--draft",
+				style: y(Q(Z.value))
+			}, null, 4)) : u("", !0)], 40, fe))), 128))], 36)])])) : u("", !0),
+			q.value && h.editable ? (b(), d("div", _e, [
+				f("label", ve, [f("span", null, C(M.value.title), 1), f("input", {
+					ref_key: "titleInput",
+					ref: F,
+					class: "bless-sched__input",
+					type: "text",
+					value: q.value.title,
+					onInput: i[3] ||= (e) => J({
+						...q.value,
+						title: e.target.value
+					})
+				}, null, 40, ye)]),
+				f("span", be, C(K(q.value.date)) + ", " + C(G(q.value.start)) + "–" + C(G(q.value.end)), 1),
+				m(e, {
+					size: "sm",
+					variant: "outline",
+					onClick: i[4] ||= (e) => Me(q.value)
+				}, {
+					default: E(() => [p(C(M.value.remove), 1)]),
+					_: 1
+				})
+			])) : u("", !0),
+			f("span", {
+				id: N,
+				hidden: ""
+			}, C(M.value.hint), 1),
+			f("span", xe, C(P.value), 1)
+		], 8, se));
+	}
+});
+//#endregion
+export { D as default };

package/dist/components/BlessShortcutRecorder.css

@@ -0,0 +1 @@
+.bless-shortcut{gap:var(--bless-space-1);font-family:var(--bless-font-sans);font-size:var(--bless-text-sm);flex-direction:column;display:inline-flex;position:relative}.bless-shortcut__btn{min-width:160px;min-height:36px;padding:var(--bless-space-1) var(--bless-space-3);border:var(--bless-border-width) solid var(--bless-color-border);background:var(--bless-color-bg);color:var(--bless-color-text);font:inherit;cursor:pointer;align-items:center;display:inline-flex}.bless-shortcut__btn:focus-visible{outline:2px solid var(--bless-color-accent);outline-offset:2px}.bless-shortcut--rec .bless-shortcut__btn{border-color:var(--bless-color-accent)}.bless-shortcut--bad .bless-shortcut__btn{border-color:var(--bless-color-danger-text)}.bless-shortcut__btn:disabled{opacity:.5;cursor:not-allowed}.bless-shortcut__hint{color:var(--bless-color-text-muted)}.bless-shortcut__error{color:var(--bless-color-danger-text);font-size:var(--bless-text-xs);margin:0}.bless-shortcut__live{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}

package/dist/components/BlessShortcutRecorder.js

@@ -0,0 +1,6 @@
+import "./BlessShortcutRecorder.css";
+import e from "./BlessShortcutRecorder.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/BlessShortcutRecorder.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/BlessShortcutRecorder.vue.d.ts

@@ -0,0 +1,39 @@
+type __VLS_Props = {
+    /** combos already taken, as a list or `{ "Ctrl+K": "Open search" }` to say by what */
+    taken?: string[] | Record<string, string>;
+    /** accept a bare key such as `G`; off asks for Ctrl, Alt or Meta, or a function key */
+    allowBare?: boolean;
+    disabled?: boolean;
+    label?: string;
+    placeholder?: string;
+    /** button wording and the messages said while recording or on a refusal */
+    labels?: Partial<{
+        button: (label: string, combo: string) => string;
+        pressKeys: string;
+        recording: string;
+        set: (combo: string) => string;
+        needsModifier: (combo: string) => string;
+        usedBy: (combo: string, by: string) => string;
+        taken: (combo: string) => string;
+    }>;
+};
+declare function start(): void;
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {
+    start: typeof start;
+    focus: () => void | undefined;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    conflict: (combo: string, by: string | undefined) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onConflict?: ((combo: string, by: string | undefined) => any) | undefined;
+}>, {
+    label: string;
+    placeholder: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/BlessShortcutRecorder.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,126 @@
+import e from "./BlessKbd.js";
+import { isModifierKey as t, shortcutFromEvent as n, splitShortcut as r } from "../composables/shortcut.js";
+import { computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, defineComponent as l, mergeModels as u, normalizeClass as d, openBlock as f, ref as p, toDisplayString as m, unref as h, useId as g, useModel as _ } from "vue";
+//#region src/components/BlessShortcutRecorder.vue?vue&type=script&setup=true&lang.ts
+var v = [
+	"id",
+	"disabled",
+	"aria-label",
+	"aria-describedby",
+	"aria-invalid"
+], y = {
+	key: 0,
+	class: "bless-shortcut__hint"
+}, b = {
+	key: 2,
+	class: "bless-shortcut__hint"
+}, x = ["id"], S = {
+	class: "bless-shortcut__live",
+	"aria-live": "polite"
+}, C = /*@__PURE__*/ l({
+	name: "BlessShortcutRecorder",
+	__name: "BlessShortcutRecorder",
+	props: /*@__PURE__*/ u({
+		taken: {},
+		allowBare: { type: Boolean },
+		disabled: { type: Boolean },
+		label: { default: "Shortcut" },
+		placeholder: { default: "Not set" },
+		labels: {}
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ u(["conflict"], ["update:modelValue"]),
+	setup(l, { expose: u, emit: C }) {
+		let w = l, T = i(() => ({
+			button: (e, t) => `${e}: ${t || "not set"}. Press Enter to change.`,
+			pressKeys: "Press keys…",
+			recording: "Recording. Press the keys you want. Escape cancels, Backspace clears.",
+			set: (e) => `Set to ${e}`,
+			needsModifier: (e) => `Add Ctrl, Alt or Meta to ${e}`,
+			usedBy: (e, t) => `${e} is already used by ${t}`,
+			taken: (e) => `${e} is already taken`,
+			...w.labels
+		})), E = _(l, "modelValue"), D = C, O = g(), k = p(!1), A = p(""), j = p(""), M = p(""), N = p(), P = (e) => Array.isArray(w.taken) ? w.taken.includes(e) ? "" : void 0 : w.taken?.[e], F = i(() => k.value ? A.value : E.value), I = i(() => F.value ? r(F.value) : []);
+		function L() {
+			w.disabled || (k.value = !0, A.value = "", j.value = "", M.value = T.value.recording);
+		}
+		function R(e = "") {
+			k.value = !1, A.value = "", M.value = e;
+		}
+		let z = (e) => !w.allowBare && !/^(Ctrl|Alt|Meta)\+/.test(e.replace(/Shift\+/, "")) && !/^F\d{1,2}$/.test(e.split("+").at(-1));
+		function B(e) {
+			if (!k.value) {
+				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), L());
+				return;
+			}
+			if (e.preventDefault(), e.stopPropagation(), t(e)) {
+				A.value = [
+					e.ctrlKey && "Ctrl",
+					e.altKey && "Alt",
+					e.shiftKey && "Shift",
+					e.metaKey && "Meta"
+				].filter(Boolean).join("+");
+				return;
+			}
+			let r = !e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey;
+			if (r && e.key === "Escape") return R("Cancelled");
+			if (r && (e.key === "Backspace" || e.key === "Delete")) return E.value = "", j.value = "", R("Cleared");
+			let i = n(e);
+			if (z(i)) {
+				A.value = i, j.value = T.value.needsModifier(i), M.value = j.value;
+				return;
+			}
+			let a = P(i);
+			if (a !== void 0 && i !== E.value) {
+				A.value = i, j.value = a ? T.value.usedBy(i, a) : T.value.taken(i), M.value = j.value, D("conflict", i, a || void 0);
+				return;
+			}
+			E.value = i, j.value = "", R(T.value.set(i));
+		}
+		function V(e) {
+			k.value && t(e) && !j.value && (A.value = [
+				e.ctrlKey && "Ctrl",
+				e.altKey && "Alt",
+				e.shiftKey && "Shift",
+				e.metaKey && "Meta"
+			].filter(Boolean).join("+"));
+		}
+		return u({
+			start: L,
+			focus: () => N.value?.focus()
+		}), (t, n) => (f(), s("div", { class: d(["bless-shortcut", {
+			"bless-shortcut--rec": k.value,
+			"bless-shortcut--bad": !!j.value
+		}]) }, [
+			c("button", {
+				id: h(O),
+				ref_key: "btn",
+				ref: N,
+				type: "button",
+				class: "bless-shortcut__btn",
+				disabled: l.disabled,
+				"aria-label": T.value.button(l.label, E.value),
+				"aria-describedby": j.value ? `${h(O)}-err` : void 0,
+				"aria-invalid": !!j.value || void 0,
+				onClick: n[0] ||= (e) => k.value ? R() : L(),
+				onKeydown: B,
+				onKeyup: V,
+				onBlur: n[1] ||= (e) => k.value && R()
+			}, [k.value && !I.value.length ? (f(), s("span", y, m(T.value.pressKeys), 1)) : I.value.length ? (f(), a(e, {
+				key: 1,
+				keys: I.value
+			}, null, 8, ["keys"])) : (f(), s("span", b, m(l.placeholder), 1))], 40, v),
+			j.value ? (f(), s("p", {
+				key: 0,
+				id: `${h(O)}-err`,
+				class: "bless-shortcut__error",
+				role: "alert"
+			}, m(j.value), 9, x)) : o("", !0),
+			c("span", S, m(M.value), 1)
+		], 2));
+	}
+});
+//#endregion
+export { C as default };

package/dist/components/BlessSignaturePad.vue.d.ts

@@ -37,8 +37,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {
     type: "image/png" | "image/jpeg" | "image/webp";
     hint: string;
     height: number;
-    lineWidth: number;
     clearLabel: string;
+    lineWidth: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/BlessSliderCaptcha.css

@@ -0,0 +1 @@
+.bless-captcha{max-width:360px;font-family:var(--bless-font-sans);font-size:var(--bless-text-sm);color:var(--bless-color-text);position:relative}.bless-captcha__stage{border:var(--bless-border-width) solid var(--bless-color-border);background-color:var(--bless-color-surface);background-image:conic-gradient(var(--bless-color-border) 25%, transparent 0 50%, var(--bless-color-border) 0 75%, transparent 0);-webkit-user-select:none;user-select:none;background-size:24px 24px;position:relative;overflow:hidden}.bless-captcha__gap{background:color-mix(in srgb, var(--bless-color-text) 55%, transparent);box-shadow:inset 0 0 0 2px var(--bless-color-bg);position:absolute}.bless-captcha__piece{background-color:var(--bless-color-surface);background-image:conic-gradient(var(--bless-color-border) 25%, transparent 0 50%, var(--bless-color-border) 0 75%, transparent 0);border:2px solid var(--bless-color-bg);outline:1px solid var(--bless-color-text);box-shadow:var(--bless-shadow-plate);transition:left var(--bless-duration-slow) var(--bless-ease-out);background-size:24px 24px;position:absolute}.bless-captcha__piece--drag{transition:none}.bless-captcha__track{height:40px;margin-top:var(--bless-space-2);background:var(--bless-color-surface);border:var(--bless-border-width) solid var(--bless-color-border);color:var(--bless-color-text-muted);justify-content:center;align-items:center;display:flex;position:relative}.bless-captcha__handle{background:var(--bless-color-text);width:44px;color:var(--bless-color-on-text);font:inherit;cursor:grab;touch-action:none;transition:left var(--bless-duration-slow) var(--bless-ease-out), translate var(--bless-duration-slow) var(--bless-ease-out);border:0;position:absolute;top:-1px;bottom:-1px}.bless-captcha__handle--drag{cursor:grabbing;transition:none}.bless-captcha__handle:focus-visible{outline:2px solid var(--bless-color-accent);outline-offset:2px}.bless-captcha--ok .bless-captcha__handle{background:var(--bless-color-accent);color:var(--bless-color-on-accent);cursor:default}.bless-captcha--fail .bless-captcha__track{border-color:var(--bless-color-danger-text)}.bless-captcha__live{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.bless-captcha__piece,.bless-captcha__handle{transition:none}}

package/dist/components/BlessSliderCaptcha.js

@@ -0,0 +1,6 @@
+import "./BlessSliderCaptcha.css";
+import e from "./BlessSliderCaptcha.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/BlessSliderCaptcha.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/BlessSliderCaptcha.vue.d.ts

@@ -0,0 +1,38 @@
+type __VLS_Props = {
+    /** background picture; without it a checker pattern is drawn */
+    src?: string;
+    /** how close counts, as a fraction of the track (0.03 = 3%) */
+    tolerance?: number;
+    label?: string;
+    /** what is announced when the piece lands or misses */
+    labels?: Partial<{
+        verified: string;
+        failed: string;
+    }>;
+};
+declare function reset(): void;
+type __VLS_ModelProps = {
+    /** true once solved; the widget then stays locked until `reset()` */
+    "verified"?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {
+    reset: typeof reset;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    verify: (info: {
+        ms: number;
+    }) => any;
+    fail: () => any;
+    "update:verified": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onVerify?: ((info: {
+        ms: number;
+    }) => any) | undefined;
+    onFail?: (() => any) | undefined;
+    "onUpdate:verified"?: ((value: boolean) => any) | undefined;
+}>, {
+    label: string;
+    tolerance: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;