@spear-ai/spectral 1.13.1 → 1.14.2

package/dist/InputOTP-DLn7ja7J.js

@@ -1,464 +0,0 @@
-import './styles/main.css'
-import { MinusIcon as e } from "./Icons/MinusIcon.js";
-import { t } from "./twUtils-BpqlKSeB.js";
-import { ErrorMessage as n } from "./FormFieldMessage.js";
-import { getErrorMessageId as r, useFormFieldId as i, useFormFieldState as a } from "./utils/formFieldUtils.js";
-import * as o from "react";
-import { createContext as s, useContext as c } from "react";
-import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
-//#region node_modules/.pnpm/input-otp@1.4.2_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/input-otp/dist/index.mjs
-var f = Object.defineProperty, p = Object.defineProperties, m = Object.getOwnPropertyDescriptors, h = Object.getOwnPropertySymbols, g = Object.prototype.hasOwnProperty, _ = Object.prototype.propertyIsEnumerable, v = (e, t, n) => t in e ? f(e, t, {
-	enumerable: !0,
-	configurable: !0,
-	writable: !0,
-	value: n
-}) : e[t] = n, y = (e, t) => {
-	for (var n in t ||= {}) g.call(t, n) && v(e, n, t[n]);
-	if (h) for (var n of h(t)) _.call(t, n) && v(e, n, t[n]);
-	return e;
-}, b = (e, t) => p(e, m(t)), x = (e, t) => {
-	var n = {};
-	for (var r in e) g.call(e, r) && t.indexOf(r) < 0 && (n[r] = e[r]);
-	if (e != null && h) for (var r of h(e)) t.indexOf(r) < 0 && _.call(e, r) && (n[r] = e[r]);
-	return n;
-};
-function S(e) {
-	return [
-		setTimeout(e, 0),
-		setTimeout(e, 10),
-		setTimeout(e, 50)
-	];
-}
-function C(e) {
-	let t = o.useRef();
-	return o.useEffect(() => {
-		t.current = e;
-	}), t.current;
-}
-var w = 18, T = 40, E = `${T}px`, D = [
-	"[data-lastpass-icon-root]",
-	"com-1password-button",
-	"[data-dashlanecreated]",
-	"[style$=\"2147483647 !important;\"]"
-].join(",");
-function ee({ containerRef: e, inputRef: t, pushPasswordManagerStrategy: n, isFocused: r }) {
-	let [i, a] = o.useState(!1), [s, c] = o.useState(!1), [l, u] = o.useState(!1), d = o.useMemo(() => n === "none" ? !1 : (n === "increase-width" || n === "experimental-no-flickering") && i && s, [
-		i,
-		s,
-		n
-	]), f = o.useCallback(() => {
-		let r = e.current, i = t.current;
-		if (!r || !i || l || n === "none") return;
-		let o = r, s = o.getBoundingClientRect().left + o.offsetWidth, c = o.getBoundingClientRect().top + o.offsetHeight / 2, d = s - w, f = c;
-		document.querySelectorAll(D).length === 0 && document.elementFromPoint(d, f) === r || (a(!0), u(!0));
-	}, [
-		e,
-		t,
-		l,
-		n
-	]);
-	return o.useEffect(() => {
-		let t = e.current;
-		if (!t || n === "none") return;
-		function r() {
-			c(window.innerWidth - t.getBoundingClientRect().right >= T);
-		}
-		r();
-		let i = setInterval(r, 1e3);
-		return () => {
-			clearInterval(i);
-		};
-	}, [e, n]), o.useEffect(() => {
-		let e = r || document.activeElement === t.current;
-		if (n === "none" || !e) return;
-		let i = setTimeout(f, 0), a = setTimeout(f, 2e3), o = setTimeout(f, 5e3), s = setTimeout(() => {
-			u(!0);
-		}, 6e3);
-		return () => {
-			clearTimeout(i), clearTimeout(a), clearTimeout(o), clearTimeout(s);
-		};
-	}, [
-		t,
-		r,
-		n,
-		f
-	]), {
-		hasPWMBadge: i,
-		willPushPWMBadge: d,
-		PWM_BADGE_SPACE_WIDTH: E
-	};
-}
-var O = o.createContext({}), k = o.forwardRef((e, t) => {
-	var n = e, { value: r, onChange: i, maxLength: a, textAlign: s = "left", pattern: c, placeholder: l, inputMode: u = "numeric", onComplete: d, pushPasswordManagerStrategy: f = "increase-width", pasteTransformer: p, containerClassName: m, noScriptCSSFallback: h = j, render: g, children: _ } = n, v = x(n, [
-		"value",
-		"onChange",
-		"maxLength",
-		"textAlign",
-		"pattern",
-		"placeholder",
-		"inputMode",
-		"onComplete",
-		"pushPasswordManagerStrategy",
-		"pasteTransformer",
-		"containerClassName",
-		"noScriptCSSFallback",
-		"render",
-		"children"
-	]), w;
-	let [T, E] = o.useState(typeof v.defaultValue == "string" ? v.defaultValue : ""), D = r ?? T, k = C(D), M = o.useCallback((e) => {
-		i?.(e), E(e);
-	}, [i]), N = o.useMemo(() => c ? typeof c == "string" ? new RegExp(c) : c : null, [c]), P = o.useRef(null), F = o.useRef(null), I = o.useRef({
-		value: D,
-		onChange: M,
-		isIOS: typeof window < "u" && ((w = window == null ? void 0 : window.CSS)?.supports)?.call(w, "-webkit-touch-callout", "none")
-	}), L = o.useRef({ prev: [
-		P.current?.selectionStart,
-		P.current?.selectionEnd,
-		P.current?.selectionDirection
-	] });
-	o.useImperativeHandle(t, () => P.current, []), o.useEffect(() => {
-		let e = P.current, t = F.current;
-		if (!e || !t) return;
-		I.current.value !== e.value && I.current.onChange(e.value), L.current.prev = [
-			e.selectionStart,
-			e.selectionEnd,
-			e.selectionDirection
-		];
-		function n() {
-			if (document.activeElement !== e) {
-				U(null), G(null);
-				return;
-			}
-			let t = e.selectionStart, n = e.selectionEnd, r = e.selectionDirection, i = e.maxLength, a = e.value, o = L.current.prev, s = -1, c = -1, l;
-			if (a.length !== 0 && t !== null && n !== null) {
-				let e = t === n, r = t === a.length && a.length < i;
-				if (e && !r) {
-					let e = t;
-					if (e === 0) s = 0, c = 1, l = "forward";
-					else if (e === i) s = e - 1, c = e, l = "backward";
-					else if (i > 1 && a.length > 1) {
-						let t = 0;
-						if (o[0] !== null && o[1] !== null) {
-							l = e < o[1] ? "backward" : "forward";
-							let n = o[0] === o[1] && o[0] < i;
-							l === "backward" && !n && (t = -1);
-						}
-						s = t + e, c = t + e + 1;
-					}
-				}
-				s !== -1 && c !== -1 && s !== c && P.current.setSelectionRange(s, c, l);
-			}
-			let u = s === -1 ? t : s, d = c === -1 ? n : c, f = l ?? r;
-			U(u), G(d), L.current.prev = [
-				u,
-				d,
-				f
-			];
-		}
-		if (document.addEventListener("selectionchange", n, { capture: !0 }), n(), document.activeElement === e && V(!0), !document.getElementById("input-otp-style")) {
-			let e = document.createElement("style");
-			if (e.id = "input-otp-style", document.head.appendChild(e), e.sheet) {
-				let t = "background: transparent !important; color: transparent !important; border-color: transparent !important; opacity: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; -webkit-text-fill-color: transparent !important;";
-				A(e.sheet, "[data-input-otp]::selection { background: transparent !important; color: transparent !important; }"), A(e.sheet, `[data-input-otp]:autofill { ${t} }`), A(e.sheet, `[data-input-otp]:-webkit-autofill { ${t} }`), A(e.sheet, "@supports (-webkit-touch-callout: none) { [data-input-otp] { letter-spacing: -.6em !important; font-weight: 100 !important; font-stretch: ultra-condensed; font-optical-sizing: none !important; left: -1px !important; right: 1px !important; } }"), A(e.sheet, "[data-input-otp] + * { pointer-events: all !important; }");
-			}
-		}
-		let r = () => {
-			t && t.style.setProperty("--root-height", `${e.clientHeight}px`);
-		};
-		r();
-		let i = new ResizeObserver(r);
-		return i.observe(e), () => {
-			document.removeEventListener("selectionchange", n, { capture: !0 }), i.disconnect();
-		};
-	}, []);
-	let [R, z] = o.useState(!1), [B, V] = o.useState(!1), [H, U] = o.useState(null), [W, G] = o.useState(null);
-	o.useEffect(() => {
-		S(() => {
-			var e;
-			(e = P.current) == null || e.dispatchEvent(new Event("input"));
-			let t = P.current?.selectionStart, n = P.current?.selectionEnd, r = P.current?.selectionDirection;
-			t !== null && n !== null && (U(t), G(n), L.current.prev = [
-				t,
-				n,
-				r
-			]);
-		});
-	}, [D, B]), o.useEffect(() => {
-		k !== void 0 && D !== k && k.length < a && D.length === a && d?.(D);
-	}, [
-		a,
-		d,
-		k,
-		D
-	]);
-	let K = ee({
-		containerRef: F,
-		inputRef: P,
-		pushPasswordManagerStrategy: f,
-		isFocused: B
-	}), q = o.useCallback((e) => {
-		let t = e.currentTarget.value.slice(0, a);
-		if (t.length > 0 && N && !N.test(t)) {
-			e.preventDefault();
-			return;
-		}
-		typeof k == "string" && t.length < k.length && document.dispatchEvent(new Event("selectionchange")), M(t);
-	}, [
-		a,
-		M,
-		k,
-		N
-	]), J = o.useCallback(() => {
-		var e;
-		if (P.current) {
-			let t = Math.min(P.current.value.length, a - 1), n = P.current.value.length;
-			(e = P.current) == null || e.setSelectionRange(t, n), U(t), G(n);
-		}
-		V(!0);
-	}, [a]), Y = o.useCallback((e) => {
-		let t = P.current;
-		if (!p && (!I.current.isIOS || !e.clipboardData || !t)) return;
-		let n = e.clipboardData.getData("text/plain"), r = p ? p(n) : n;
-		e.preventDefault();
-		let i = P.current?.selectionStart, o = P.current?.selectionEnd, s = (i === o ? D.slice(0, i) + r + D.slice(i) : D.slice(0, i) + r + D.slice(o)).slice(0, a);
-		if (s.length > 0 && N && !N.test(s)) return;
-		t.value = s, M(s);
-		let c = Math.min(s.length, a - 1), l = s.length;
-		t.setSelectionRange(c, l), U(c), G(l);
-	}, [
-		a,
-		M,
-		N,
-		D
-	]), X = o.useMemo(() => ({
-		position: "relative",
-		cursor: v.disabled ? "default" : "text",
-		userSelect: "none",
-		WebkitUserSelect: "none",
-		pointerEvents: "none"
-	}), [v.disabled]), Z = o.useMemo(() => ({
-		position: "absolute",
-		inset: 0,
-		width: K.willPushPWMBadge ? `calc(100% + ${K.PWM_BADGE_SPACE_WIDTH})` : "100%",
-		clipPath: K.willPushPWMBadge ? `inset(0 ${K.PWM_BADGE_SPACE_WIDTH} 0 0)` : void 0,
-		height: "100%",
-		display: "flex",
-		textAlign: s,
-		opacity: "1",
-		color: "transparent",
-		pointerEvents: "all",
-		background: "transparent",
-		caretColor: "transparent",
-		border: "0 solid transparent",
-		outline: "0 solid transparent",
-		boxShadow: "none",
-		lineHeight: "1",
-		letterSpacing: "-.5em",
-		fontSize: "var(--root-height)",
-		fontFamily: "monospace",
-		fontVariantNumeric: "tabular-nums"
-	}), [
-		K.PWM_BADGE_SPACE_WIDTH,
-		K.willPushPWMBadge,
-		s
-	]), Q = o.useMemo(() => o.createElement("input", b(y({ autoComplete: v.autoComplete || "one-time-code" }, v), {
-		"data-input-otp": !0,
-		"data-input-otp-placeholder-shown": D.length === 0 || void 0,
-		"data-input-otp-mss": H,
-		"data-input-otp-mse": W,
-		inputMode: u,
-		pattern: N?.source,
-		"aria-placeholder": l,
-		style: Z,
-		maxLength: a,
-		value: D,
-		ref: P,
-		onPaste: (e) => {
-			var t;
-			Y(e), (t = v.onPaste) == null || t.call(v, e);
-		},
-		onChange: q,
-		onMouseOver: (e) => {
-			var t;
-			z(!0), (t = v.onMouseOver) == null || t.call(v, e);
-		},
-		onMouseLeave: (e) => {
-			var t;
-			z(!1), (t = v.onMouseLeave) == null || t.call(v, e);
-		},
-		onFocus: (e) => {
-			var t;
-			J(), (t = v.onFocus) == null || t.call(v, e);
-		},
-		onBlur: (e) => {
-			var t;
-			V(!1), (t = v.onBlur) == null || t.call(v, e);
-		}
-	})), [
-		q,
-		J,
-		Y,
-		u,
-		Z,
-		a,
-		W,
-		H,
-		v,
-		N?.source,
-		D
-	]), $ = o.useMemo(() => ({
-		slots: Array.from({ length: a }).map((e, t) => {
-			let n = B && H !== null && W !== null && (H === W && t === H || t >= H && t < W), r = D[t] === void 0 ? null : D[t];
-			return {
-				char: r,
-				placeholderChar: D[0] === void 0 ? l?.[t] ?? null : null,
-				isActive: n,
-				hasFakeCaret: n && r === null
-			};
-		}),
-		isFocused: B,
-		isHovering: !v.disabled && R
-	}), [
-		B,
-		R,
-		a,
-		W,
-		H,
-		v.disabled,
-		D
-	]), te = o.useMemo(() => g ? g($) : o.createElement(O.Provider, { value: $ }, _), [
-		_,
-		$,
-		g
-	]);
-	return o.createElement(o.Fragment, null, h !== null && o.createElement("noscript", null, o.createElement("style", null, h)), o.createElement("div", {
-		ref: F,
-		"data-input-otp-container": !0,
-		style: X,
-		className: m
-	}, te, o.createElement("div", { style: {
-		position: "absolute",
-		inset: 0,
-		pointerEvents: "none"
-	} }, Q)));
-});
-k.displayName = "Input";
-function A(e, t) {
-	try {
-		e.insertRule(t);
-	} catch {
-		console.error("input-otp could not insert CSS rule:", t);
-	}
-}
-var j = "\n[data-input-otp] {\n  --nojs-bg: white !important;\n  --nojs-fg: black !important;\n\n  background-color: var(--nojs-bg) !important;\n  color: var(--nojs-fg) !important;\n  caret-color: var(--nojs-fg) !important;\n  letter-spacing: .25em !important;\n  text-align: center !important;\n  border: 1px solid var(--nojs-fg) !important;\n  border-radius: 4px !important;\n  width: 100% !important;\n}\n@media (prefers-color-scheme: dark) {\n  [data-input-otp] {\n    --nojs-bg: black !important;\n    --nojs-fg: white !important;\n  }\n}", M = s({}), N = s(null), P = () => {
-	let e = c(N);
-	if (!e) throw Error("useRoot must be used within an InputOTP");
-	return e;
-}, F = ({ autoFocus: e = !1, children: o, className: s, errorMessage: c, id: l, inputMode: f = "numeric", maxLength: p, name: m, onChange: h, onComplete: g, pattern: _, ref: v, state: y = "default", value: b, variant: x = "outlined", ...S }) => {
-	let C = i(l, m), w = r(C), { isInvalid: T } = a(!1, y), E = _ ?? (f === "numeric" ? "^\\d+$" : void 0);
-	return /* @__PURE__ */ u(M.Provider, {
-		value: { isInvalid: T },
-		children: /* @__PURE__ */ d("div", {
-			className: "gap-y-1 flex w-max flex-col",
-			children: [/* @__PURE__ */ u(k, {
-				autoFocus: e,
-				containerClassName: t("gap-2 flex items-center disabled:cursor-not-allowed has-[disabled]:opacity-50", s),
-				"data-1p-ignore": "true",
-				"data-dashlane-disabled-on-field": "true",
-				"data-lpignore": "true",
-				"data-protonpass-ignore": "true",
-				"data-testid": "spectral-input-otp",
-				id: C,
-				inputMode: f,
-				maxLength: p,
-				onChange: h,
-				onComplete: g,
-				onPaste: (e) => {
-					let t = e.clipboardData.getData("text/plain").trim().replaceAll("-", "");
-					f === "numeric" && (t = t.replace(/\D/g, "")), t.length === p && typeof h == "function" && h(t);
-				},
-				pasteTransformer: (e) => e.replaceAll("-", ""),
-				pattern: E,
-				pushPasswordManagerStrategy: "none",
-				ref: v,
-				"aria-describedby": T && c ? w : void 0,
-				"aria-invalid": T,
-				role: "textbox",
-				textAlign: "center",
-				value: b,
-				...S,
-				render: ({ slots: e }) => /* @__PURE__ */ u(N.Provider, {
-					value: {
-						slots: e,
-						variant: x,
-						maxLength: p
-					},
-					children: o ?? /* @__PURE__ */ u(I, { children: /* @__PURE__ */ u(R, {}) })
-				})
-			}), /* @__PURE__ */ u(n, {
-				dataTestId: "spectral-input-otp-error-message",
-				id: w,
-				message: T ? c : null
-			})]
-		})
-	});
-};
-F.displayName = "InputOTP";
-var I = ({ ref: e, ...t }) => /* @__PURE__ */ u("div", {
-	className: "gap-x-2 flex items-center justify-center",
-	"data-testid": "spectral-input-otp-group",
-	ref: e,
-	...t
-});
-I.displayName = "InputOTP.Group";
-var L = ({ className: e, index: n, ref: r, ...i }) => {
-	let { variant: a = "outlined", slots: o = [] } = P(), { isInvalid: s } = c(M), l = o[n] || {
-		char: "",
-		hasFakeCaret: !0,
-		isActive: !1
-	};
-	return /* @__PURE__ */ d("div", {
-		className: t("h-12 w-10 relative z-10 flex items-center justify-center rounded-[8px] border tabular-nums transition duration-200 focus:outline-none", a === "filled" ? "border-level-one bg-level-one" : "border-input-otp-border bg-transparent", !s && "border", s && "border-2 border-danger-400", l.isActive && !s && "z-10 border-input-otp-border--focus", l.isActive && s && "z-10 border-danger-400 focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-danger-400", e),
-		"data-index": n,
-		"data-testid": "spectral-input-otp-slot",
-		"data-variant": a,
-		ref: r,
-		...i,
-		children: [l.char, l.hasFakeCaret && /* @__PURE__ */ u("div", {
-			className: "inset-0 pointer-events-none absolute flex items-center justify-center motion-safe:animate-caret-blink",
-			children: /* @__PURE__ */ u("div", { className: "h-8 w-px bg-input-otp-caret" })
-		})]
-	});
-};
-L.displayName = "InputOTP.Slot";
-var R = ({ start: e = 0, count: t, className: n }) => {
-	let { maxLength: r = 0 } = P(), i = t === void 0 ? r : e + t;
-	return /* @__PURE__ */ u(l, { children: Array.from({ length: i - e }, (t, n) => e + n).map((e) => /* @__PURE__ */ u(L, {
-		index: e,
-		className: n
-	}, e)) });
-};
-R.displayName = "InputOTP.Slots";
-var z = ({ ref: t, ...n }) => {
-	let { variant: r = "outlined" } = P();
-	return /* @__PURE__ */ u("div", {
-		ref: t,
-		role: "separator",
-		...n,
-		"data-testid": "spectral-input-otp-separator",
-		"data-variant": r,
-		children: /* @__PURE__ */ u(e, {
-			size: 24,
-			color: r === "filled" ? "var(--color-input-otp-filled-separator)" : "var(--color-input-otp-border)"
-		})
-	});
-};
-z.displayName = "InputOTP.Separator";
-var B = Object.assign(F, {
-	Group: I,
-	Slot: L,
-	Slots: R,
-	Separator: z
-});
-//#endregion
-export { B as t };