@intlayer/design-system 7.1.4 → 7.1.5

package/dist/esm/components/Input/CodeInput.mjs

@@ -1,84 +0,0 @@
-'use client';
-
-
-import { cn } from "../../utils/cn.mjs";
-import { useRef, useState } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/Input/CodeInput.tsx
-const CodeInput = ({ length = 6, onValueChange, defaultValue = "", value: controlledValue, disabled = false, containerClassName, slotClassName, "aria-invalid": ariaInvalid }) => {
-	const isControlled = controlledValue !== void 0;
-	const [internalValue, setInternalValue] = useState(defaultValue);
-	const value = isControlled ? controlledValue : internalValue;
-	const inputRefs = useRef([]);
-	const handleChange = (index, newValue) => {
-		const digit = newValue.replace(/\D/g, "").slice(-1);
-		const newCode = value.split("");
-		while (newCode.length < length) newCode.push("");
-		newCode[index] = digit;
-		const finalValue = newCode.join("");
-		if (!isControlled) setInternalValue(finalValue);
-		onValueChange?.(finalValue);
-		if (digit && index < length - 1) inputRefs.current[index + 1]?.focus();
-	};
-	const handleKeyDown = (index, e) => {
-		if (e.key === "Backspace") {
-			const newCode = value.split("");
-			if (!newCode[index] && index > 0) {
-				e.preventDefault();
-				newCode[index - 1] = "";
-				const finalValue = newCode.join("");
-				if (!isControlled) setInternalValue(finalValue);
-				onValueChange?.(finalValue);
-				inputRefs.current[index - 1]?.focus();
-			} else if (newCode[index]) {
-				newCode[index] = "";
-				const finalValue = newCode.join("");
-				if (!isControlled) setInternalValue(finalValue);
-				onValueChange?.(finalValue);
-			}
-		} else if (e.key === "ArrowLeft" && index > 0) {
-			e.preventDefault();
-			inputRefs.current[index - 1]?.focus();
-		} else if (e.key === "ArrowRight" && index < length - 1) {
-			e.preventDefault();
-			inputRefs.current[index + 1]?.focus();
-		}
-	};
-	const handlePaste = (e) => {
-		e.preventDefault();
-		const newCode = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, length).split("");
-		while (newCode.length < length) newCode.push("");
-		const finalValue = newCode.join("");
-		if (!isControlled) setInternalValue(finalValue);
-		onValueChange?.(finalValue);
-		const nextEmptyIndex = newCode.findIndex((digit) => !digit);
-		const focusIndex = nextEmptyIndex === -1 ? length - 1 : nextEmptyIndex;
-		inputRefs.current[focusIndex]?.focus();
-	};
-	const digits = value.split("");
-	while (digits.length < length) digits.push("");
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex items-center gap-2", disabled && "opacity-50", containerClassName),
-		children: Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx("input", {
-			ref: (el) => {
-				inputRefs.current[index] = el;
-			},
-			type: "text",
-			inputMode: "numeric",
-			pattern: "[0-9]*",
-			maxLength: 1,
-			value: digits[index] || "",
-			onChange: (e) => handleChange(index, e.target.value),
-			onKeyDown: (e) => handleKeyDown(index, e),
-			onPaste: handlePaste,
-			disabled,
-			"aria-invalid": ariaInvalid,
-			className: cn("relative flex h-12 w-12 items-center justify-center rounded-md border border-input bg-neutral-50 text-center text-base font-medium shadow-xs outline-none transition-all", "focus:z-10 focus:border-ring focus:ring-[3px] focus:ring-ring/50", "disabled:cursor-not-allowed disabled:opacity-50", "dark:bg-input/30", ariaInvalid && "border-destructive focus:border-destructive focus:ring-destructive/20 dark:focus:ring-destructive/40", slotClassName)
-		}, index))
-	});
-};
-
-//#endregion
-export { CodeInput };
-//# sourceMappingURL=CodeInput.mjs.map

package/dist/esm/components/Input/CodeInput.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"CodeInput.mjs","names":["CodeInput: FC<CodeInputProps>"],"sources":["../../../../src/components/Input/CodeInput.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ChangeEvent,\n  type ClipboardEvent,\n  type FC,\n  type KeyboardEvent,\n  useRef,\n  useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface CodeInputProps {\n  /** Number of input fields (default: 6) */\n  length?: number;\n  /** Callback when value changes */\n  onValueChange?: (value: string) => void;\n  /** Default value */\n  defaultValue?: string;\n  /** Current value (controlled) */\n  value?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Custom class name for container */\n  containerClassName?: string;\n  /** Custom class name for each input slot */\n  slotClassName?: string;\n  /** Whether to show error state */\n  'aria-invalid'?: boolean;\n}\n\nexport const CodeInput: FC<CodeInputProps> = ({\n  length = 6,\n  onValueChange,\n  defaultValue = '',\n  value: controlledValue,\n  disabled = false,\n  containerClassName,\n  slotClassName,\n  'aria-invalid': ariaInvalid,\n}) => {\n  const isControlled = controlledValue !== undefined;\n  const [internalValue, setInternalValue] = useState(defaultValue);\n  const value = isControlled ? controlledValue : internalValue;\n  \n  const inputRefs = useRef<(HTMLInputElement | null)[]>([]);\n\n  const handleChange = (index: number, newValue: string) => {\n    // Only allow digits\n    const digit = newValue.replace(/\\D/g, '').slice(-1);\n    \n    const newCode = value.split('');\n    while (newCode.length < length) {\n      newCode.push('');\n    }\n    newCode[index] = digit;\n    \n    const finalValue = newCode.join('');\n    \n    if (!isControlled) {\n      setInternalValue(finalValue);\n    }\n    onValueChange?.(finalValue);\n\n    // Auto-focus next input\n    if (digit && index < length - 1) {\n      inputRefs.current[index + 1]?.focus();\n    }\n  };\n\n  const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Backspace') {\n      const newCode = value.split('');\n      \n      if (!newCode[index] && index > 0) {\n        // If current is empty, go back and clear previous\n        e.preventDefault();\n        newCode[index - 1] = '';\n        const finalValue = newCode.join('');\n        \n        if (!isControlled) {\n          setInternalValue(finalValue);\n        }\n        onValueChange?.(finalValue);\n        inputRefs.current[index - 1]?.focus();\n      } else if (newCode[index]) {\n        // Clear current\n        newCode[index] = '';\n        const finalValue = newCode.join('');\n        \n        if (!isControlled) {\n          setInternalValue(finalValue);\n        }\n        onValueChange?.(finalValue);\n      }\n    } else if (e.key === 'ArrowLeft' && index > 0) {\n      e.preventDefault();\n      inputRefs.current[index - 1]?.focus();\n    } else if (e.key === 'ArrowRight' && index < length - 1) {\n      e.preventDefault();\n      inputRefs.current[index + 1]?.focus();\n    }\n  };\n\n  const handlePaste = (e: ClipboardEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    const pastedData = e.clipboardData.getData('text').replace(/\\D/g, '');\n    const newCode = pastedData.slice(0, length).split('');\n    \n    while (newCode.length < length) {\n      newCode.push('');\n    }\n    \n    const finalValue = newCode.join('');\n    \n    if (!isControlled) {\n      setInternalValue(finalValue);\n    }\n    onValueChange?.(finalValue);\n\n    // Focus the next empty input or the last one\n    const nextEmptyIndex = newCode.findIndex((digit) => !digit);\n    const focusIndex = nextEmptyIndex === -1 ? length - 1 : nextEmptyIndex;\n    inputRefs.current[focusIndex]?.focus();\n  };\n\n  const digits = value.split('');\n  while (digits.length < length) {\n    digits.push('');\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-2',\n        disabled && 'opacity-50',\n        containerClassName\n      )}\n    >\n      {Array.from({ length }).map((_, index) => (\n        <input\n          key={index}\n          ref={(el) => {\n            inputRefs.current[index] = el;\n          }}\n          type=\"text\"\n          inputMode=\"numeric\"\n          pattern=\"[0-9]*\"\n          maxLength={1}\n          value={digits[index] || ''}\n          onChange={(e: ChangeEvent<HTMLInputElement>) =>\n            handleChange(index, e.target.value)\n          }\n          onKeyDown={(e: KeyboardEvent<HTMLInputElement>) =>\n            handleKeyDown(index, e)\n          }\n          onPaste={handlePaste}\n          disabled={disabled}\n          aria-invalid={ariaInvalid}\n          className={cn(\n            'relative flex h-12 w-12 items-center justify-center rounded-md border border-input bg-neutral-50 text-center text-base font-medium shadow-xs outline-none transition-all',\n            'focus:z-10 focus:border-ring focus:ring-[3px] focus:ring-ring/50',\n            'disabled:cursor-not-allowed disabled:opacity-50',\n            'dark:bg-input/30',\n            ariaInvalid &&\n              'border-destructive focus:border-destructive focus:ring-destructive/20 dark:focus:ring-destructive/40',\n            slotClassName\n          )}\n        />\n      ))}\n    </div>\n  );\n};\n\n"],"mappings":";;;;;;;;AA+BA,MAAaA,aAAiC,EAC5C,SAAS,GACT,eACA,eAAe,IACf,OAAO,iBACP,WAAW,OACX,oBACA,eACA,gBAAgB,kBACZ;CACJ,MAAM,eAAe,oBAAoB;CACzC,MAAM,CAAC,eAAe,oBAAoB,SAAS,aAAa;CAChE,MAAM,QAAQ,eAAe,kBAAkB;CAE/C,MAAM,YAAY,OAAoC,EAAE,CAAC;CAEzD,MAAM,gBAAgB,OAAe,aAAqB;EAExD,MAAM,QAAQ,SAAS,QAAQ,OAAO,GAAG,CAAC,MAAM,GAAG;EAEnD,MAAM,UAAU,MAAM,MAAM,GAAG;AAC/B,SAAO,QAAQ,SAAS,OACtB,SAAQ,KAAK,GAAG;AAElB,UAAQ,SAAS;EAEjB,MAAM,aAAa,QAAQ,KAAK,GAAG;AAEnC,MAAI,CAAC,aACH,kBAAiB,WAAW;AAE9B,kBAAgB,WAAW;AAG3B,MAAI,SAAS,QAAQ,SAAS,EAC5B,WAAU,QAAQ,QAAQ,IAAI,OAAO;;CAIzC,MAAM,iBAAiB,OAAe,MAAuC;AAC3E,MAAI,EAAE,QAAQ,aAAa;GACzB,MAAM,UAAU,MAAM,MAAM,GAAG;AAE/B,OAAI,CAAC,QAAQ,UAAU,QAAQ,GAAG;AAEhC,MAAE,gBAAgB;AAClB,YAAQ,QAAQ,KAAK;IACrB,MAAM,aAAa,QAAQ,KAAK,GAAG;AAEnC,QAAI,CAAC,aACH,kBAAiB,WAAW;AAE9B,oBAAgB,WAAW;AAC3B,cAAU,QAAQ,QAAQ,IAAI,OAAO;cAC5B,QAAQ,QAAQ;AAEzB,YAAQ,SAAS;IACjB,MAAM,aAAa,QAAQ,KAAK,GAAG;AAEnC,QAAI,CAAC,aACH,kBAAiB,WAAW;AAE9B,oBAAgB,WAAW;;aAEpB,EAAE,QAAQ,eAAe,QAAQ,GAAG;AAC7C,KAAE,gBAAgB;AAClB,aAAU,QAAQ,QAAQ,IAAI,OAAO;aAC5B,EAAE,QAAQ,gBAAgB,QAAQ,SAAS,GAAG;AACvD,KAAE,gBAAgB;AAClB,aAAU,QAAQ,QAAQ,IAAI,OAAO;;;CAIzC,MAAM,eAAe,MAAwC;AAC3D,IAAE,gBAAgB;EAElB,MAAM,UADa,EAAE,cAAc,QAAQ,OAAO,CAAC,QAAQ,OAAO,GAAG,CAC1C,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG;AAErD,SAAO,QAAQ,SAAS,OACtB,SAAQ,KAAK,GAAG;EAGlB,MAAM,aAAa,QAAQ,KAAK,GAAG;AAEnC,MAAI,CAAC,aACH,kBAAiB,WAAW;AAE9B,kBAAgB,WAAW;EAG3B,MAAM,iBAAiB,QAAQ,WAAW,UAAU,CAAC,MAAM;EAC3D,MAAM,aAAa,mBAAmB,KAAK,SAAS,IAAI;AACxD,YAAU,QAAQ,aAAa,OAAO;;CAGxC,MAAM,SAAS,MAAM,MAAM,GAAG;AAC9B,QAAO,OAAO,SAAS,OACrB,QAAO,KAAK,GAAG;AAGjB,QACE,oBAAC;EACC,WAAW,GACT,2BACA,YAAY,cACZ,mBACD;YAEA,MAAM,KAAK,EAAE,QAAQ,CAAC,CAAC,KAAK,GAAG,UAC9B,oBAAC;GAEC,MAAM,OAAO;AACX,cAAU,QAAQ,SAAS;;GAE7B,MAAK;GACL,WAAU;GACV,SAAQ;GACR,WAAW;GACX,OAAO,OAAO,UAAU;GACxB,WAAW,MACT,aAAa,OAAO,EAAE,OAAO,MAAM;GAErC,YAAY,MACV,cAAc,OAAO,EAAE;GAEzB,SAAS;GACC;GACV,gBAAc;GACd,WAAW,GACT,4KACA,oEACA,mDACA,oBACA,eACE,wGACF,cACD;KA1BI,MA2BL,CACF;GACE"}

package/dist/esm/components/Input/OTPInput/Input.mjs

@@ -1,426 +0,0 @@
-'use client';
-
-
-import { createContext, useEffect, useRef, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Input/OTPInput/Input.tsx
-const syncTimeouts = (cb) => {
-	return [
-		setTimeout(cb, 0),
-		setTimeout(cb, 10),
-		setTimeout(cb, 50)
-	];
-};
-const PWM_BADGE_MARGIN_RIGHT = 18;
-const PWM_BADGE_SPACE_WIDTH_PX = 40;
-const PWM_BADGE_SPACE_WIDTH = `${PWM_BADGE_SPACE_WIDTH_PX}px`;
-const PASSWORD_MANAGERS_SELECTORS = [
-	"[data-lastpass-icon-root]",
-	"com-1password-button",
-	"[data-dashlanecreated]",
-	"[style$=\"2147483647 !important;\"]"
-].join(",");
-const usePasswordManagerBadge = ({ containerRef, inputRef, pushPasswordManagerStrategy, isFocused }) => {
-	/** Password managers have a badge
-	*  and I'll use this state to push them
-	*  outside the input */
-	const [hasPWMBadge, setHasPWMBadge] = useState(false);
-	const [hasPWMBadgeSpace, setHasPWMBadgeSpace] = useState(false);
-	const [done, setDone] = useState(false);
-	const willPushPWMBadge = pushPasswordManagerStrategy === "none" ? false : (pushPasswordManagerStrategy === "increase-width" || pushPasswordManagerStrategy === "experimental-no-flickering") && hasPWMBadge && hasPWMBadgeSpace;
-	const trackPWMBadge = () => {
-		const container = containerRef.current;
-		const input = inputRef.current;
-		if (!container || !input || done || pushPasswordManagerStrategy === "none") return;
-		const elementToCompare = container;
-		const rightCornerX = elementToCompare.getBoundingClientRect().left + elementToCompare.offsetWidth;
-		const centereredY = elementToCompare.getBoundingClientRect().top + elementToCompare.offsetHeight / 2;
-		const x = rightCornerX - PWM_BADGE_MARGIN_RIGHT;
-		const y = centereredY;
-		if (document.querySelectorAll(PASSWORD_MANAGERS_SELECTORS).length === 0) {
-			if (document.elementFromPoint(x, y) === container) return;
-		}
-		setHasPWMBadge(true);
-		setDone(true);
-	};
-	useEffect(() => {
-		const container = containerRef.current;
-		if (!container || pushPasswordManagerStrategy === "none") return;
-		const checkHasSpace = () => {
-			setHasPWMBadgeSpace(window.innerWidth - container.getBoundingClientRect().right >= PWM_BADGE_SPACE_WIDTH_PX);
-		};
-		checkHasSpace();
-		const interval = setInterval(checkHasSpace, 1e3);
-		return () => {
-			clearInterval(interval);
-		};
-	}, [containerRef, pushPasswordManagerStrategy]);
-	useEffect(() => {
-		const _isFocused = isFocused || document.activeElement === inputRef.current;
-		if (pushPasswordManagerStrategy === "none" || !_isFocused) return;
-		const t1 = setTimeout(trackPWMBadge, 0);
-		const t2 = setTimeout(trackPWMBadge, 2e3);
-		const t3 = setTimeout(trackPWMBadge, 5e3);
-		const t4 = setTimeout(() => {
-			setDone(true);
-		}, 6e3);
-		return () => {
-			clearTimeout(t1);
-			clearTimeout(t2);
-			clearTimeout(t3);
-			clearTimeout(t4);
-		};
-	}, [
-		inputRef,
-		isFocused,
-		pushPasswordManagerStrategy
-	]);
-	return {
-		hasPWMBadge,
-		willPushPWMBadge,
-		PWM_BADGE_SPACE_WIDTH
-	};
-};
-const usePrevious = (value) => {
-	const ref = useRef(void 0);
-	useEffect(() => {
-		ref.current = value;
-	});
-	return ref.current;
-};
-const OTPInputContext = createContext({});
-const OTPInput = ({ value: uncheckedValue, onChange: uncheckedOnChange, maxLength, textAlign = "left", pattern, placeholder, inputMode = "numeric", onComplete, pushPasswordManagerStrategy = "increase-width", pasteTransformer, containerClassName, noScriptCSSFallback = NOSCRIPT_CSS_FALLBACK, render, children, ...props }) => {
-	const [internalValue, setInternalValue] = useState(typeof props.defaultValue === "string" ? props.defaultValue : "");
-	const value = uncheckedValue ?? internalValue;
-	const previousValue = usePrevious(value);
-	const onChange = (newValue) => {
-		uncheckedOnChange?.(newValue);
-		setInternalValue(newValue);
-	};
-	const regexp = pattern !== void 0 ? typeof pattern === "string" ? new RegExp(pattern) : pattern : null;
-	/** useRef */
-	const inputRef = useRef(null);
-	const containerRef = useRef(null);
-	const initialLoadRef = useRef({
-		value,
-		onChange,
-		isIOS: typeof window !== "undefined" && window?.CSS?.supports?.("-webkit-touch-callout", "none")
-	});
-	const inputMetadataRef = useRef({ prev: [
-		inputRef.current?.selectionStart ?? null,
-		inputRef.current?.selectionEnd ?? null,
-		inputRef.current?.selectionDirection ?? "none"
-	] });
-	useEffect(() => {
-		const input = inputRef.current;
-		const container = containerRef.current;
-		if (!input || !container) return;
-		if (initialLoadRef.current.value !== input.value) initialLoadRef.current.onChange(input.value);
-		inputMetadataRef.current.prev = [
-			input.selectionStart,
-			input.selectionEnd,
-			input.selectionDirection ?? "none"
-		];
-		const onDocumentSelectionChange = () => {
-			if (document.activeElement !== input) {
-				setMirrorSelectionStart(null);
-				setMirrorSelectionEnd(null);
-				return;
-			}
-			const _s = input.selectionStart;
-			const _e = input.selectionEnd;
-			const _dir = input.selectionDirection;
-			const _ml = input.maxLength;
-			const _val = input.value;
-			const _prev = inputMetadataRef.current.prev;
-			let start = -1;
-			let end = -1;
-			let direction = _dir ?? "none";
-			if (_val.length !== 0 && _s !== null && _e !== null) {
-				const isSingleCaret = _s === _e;
-				const isInsertMode = _s === _val.length && _val.length < _ml;
-				if (isSingleCaret && !isInsertMode) {
-					const c = _s;
-					if (c === 0) {
-						start = 0;
-						end = 1;
-						direction = "forward";
-					} else if (c === _ml) {
-						start = c - 1;
-						end = c;
-						direction = "backward";
-					} else if (_ml > 1 && _val.length > 1) {
-						let offset = 0;
-						if (_prev[0] !== null && _prev[1] !== null) {
-							direction = c < _prev[1] ? "backward" : "forward";
-							const wasPreviouslyInserting = _prev[0] === _prev[1] && _prev[0] < _ml;
-							if (direction === "backward" && !wasPreviouslyInserting) offset = -1;
-						}
-						start = offset + c;
-						end = offset + c + 1;
-					}
-				}
-				if (start !== -1 && end !== -1 && start !== end) inputRef.current?.setSelectionRange(start, end, direction);
-			}
-			const s = start !== -1 ? start : _s;
-			const e = end !== -1 ? end : _e;
-			const dir = direction;
-			setMirrorSelectionStart(s);
-			setMirrorSelectionEnd(e);
-			inputMetadataRef.current.prev = [
-				s,
-				e,
-				dir
-			];
-		};
-		document.addEventListener("selectionchange", onDocumentSelectionChange, { capture: true });
-		onDocumentSelectionChange();
-		if (document.activeElement === input) setIsFocused(true);
-		if (!document.getElementById("input-otp-style")) {
-			const styleEl = document.createElement("style");
-			styleEl.id = "input-otp-style";
-			document.head.appendChild(styleEl);
-			if (styleEl.sheet) {
-				const autofillStyles = "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;";
-				safeInsertRule(styleEl.sheet, "[data-input-otp]::selection { background: transparent !important; color: transparent !important; }");
-				safeInsertRule(styleEl.sheet, `[data-input-otp]:autofill { ${autofillStyles} }`);
-				safeInsertRule(styleEl.sheet, `[data-input-otp]:-webkit-autofill { ${autofillStyles} }`);
-				safeInsertRule(styleEl.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; } }`);
-				safeInsertRule(styleEl.sheet, `[data-input-otp] + * { pointer-events: all !important; }`);
-			}
-		}
-		const updateRootHeight = () => {
-			if (container) container.style.setProperty("--root-height", `${input.clientHeight}px`);
-		};
-		updateRootHeight();
-		const resizeObserver = new ResizeObserver(updateRootHeight);
-		resizeObserver.observe(input);
-		return () => {
-			document.removeEventListener("selectionchange", onDocumentSelectionChange, { capture: true });
-			resizeObserver.disconnect();
-		};
-	}, []);
-	/** Mirrors for UI rendering purpose only */
-	const [isHoveringInput, setIsHoveringInput] = useState(false);
-	const [isFocused, setIsFocused] = useState(false);
-	const [mirrorSelectionStart, setMirrorSelectionStart] = useState(null);
-	const [mirrorSelectionEnd, setMirrorSelectionEnd] = useState(null);
-	/** Effects */
-	useEffect(() => {
-		syncTimeouts(() => {
-			inputRef.current?.dispatchEvent(new Event("input"));
-			const s = inputRef.current?.selectionStart ?? null;
-			const e = inputRef.current?.selectionEnd ?? null;
-			const dir = inputRef.current?.selectionDirection ?? "none";
-			if (s !== null && e !== null) {
-				setMirrorSelectionStart(s);
-				setMirrorSelectionEnd(e);
-				inputMetadataRef.current.prev = [
-					s,
-					e,
-					dir
-				];
-			}
-		});
-	}, [value, isFocused]);
-	useEffect(() => {
-		if (previousValue === void 0) return;
-		if (value !== previousValue && previousValue.length < maxLength && value.length === maxLength) onComplete?.(value);
-	}, [
-		maxLength,
-		onComplete,
-		previousValue,
-		value
-	]);
-	const pwmb = usePasswordManagerBadge({
-		containerRef,
-		inputRef,
-		pushPasswordManagerStrategy,
-		isFocused
-	});
-	/** Event handlers */
-	const _changeListener = (e) => {
-		const newValue = e.currentTarget.value.slice(0, maxLength);
-		if (newValue.length > 0 && regexp && !regexp.test(newValue)) {
-			e.preventDefault();
-			return;
-		}
-		if (typeof previousValue === "string" && newValue.length < previousValue.length) document.dispatchEvent(new Event("selectionchange"));
-		onChange(newValue);
-	};
-	const _focusListener = () => {
-		if (inputRef.current) {
-			const start = Math.min(inputRef.current.value.length, maxLength - 1);
-			const end = inputRef.current.value.length;
-			inputRef.current?.setSelectionRange(start, end);
-			setMirrorSelectionStart(start);
-			setMirrorSelectionEnd(end);
-		}
-		setIsFocused(true);
-	};
-	const _pasteListener = (e) => {
-		const input = inputRef.current;
-		if (!pasteTransformer && (!initialLoadRef.current.isIOS || !e.clipboardData || !input)) return;
-		const _content = e.clipboardData.getData("text/plain");
-		const content = pasteTransformer ? pasteTransformer(_content) : _content;
-		e.preventDefault();
-		const start = inputRef.current?.selectionStart;
-		const end = inputRef.current?.selectionEnd;
-		const newValue = (start !== end ? value.slice(0, start ?? 0) + content + value.slice(end ?? 0) : value.slice(0, start ?? 0) + content + value.slice(start ?? 0)).slice(0, maxLength);
-		if (newValue.length > 0 && regexp && !regexp.test(newValue)) return;
-		if (input) {
-			input.value = newValue;
-			onChange(newValue);
-			const _start = Math.min(newValue.length, maxLength - 1);
-			const _end = newValue.length;
-			input.setSelectionRange(_start, _end);
-			setMirrorSelectionStart(_start);
-			setMirrorSelectionEnd(_end);
-		}
-	};
-	/** Styles */
-	const rootStyle = {
-		position: "relative",
-		cursor: props.disabled ? "default" : "text",
-		userSelect: "none",
-		WebkitUserSelect: "none",
-		pointerEvents: "none"
-	};
-	const inputStyle = {
-		position: "absolute",
-		inset: 0,
-		width: pwmb.willPushPWMBadge ? `calc(100% + ${pwmb.PWM_BADGE_SPACE_WIDTH})` : "100%",
-		clipPath: pwmb.willPushPWMBadge ? `inset(0 ${pwmb.PWM_BADGE_SPACE_WIDTH} 0 0)` : void 0,
-		height: "100%",
-		display: "flex",
-		textAlign,
-		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",
-		zIndex: -1,
-		fontVariantNumeric: "tabular-nums"
-	};
-	/** Rendering */
-	const renderedInput = /* @__PURE__ */ jsx("input", {
-		autoComplete: props.autoComplete || "one-time-code",
-		...props,
-		"data-input-otp": true,
-		"data-input-otp-placeholder-shown": value.length === 0 || void 0,
-		"data-input-otp-mss": mirrorSelectionStart,
-		"data-input-otp-mse": mirrorSelectionEnd,
-		inputMode,
-		pattern: regexp?.source,
-		"aria-placeholder": placeholder,
-		style: inputStyle,
-		maxLength,
-		value,
-		ref: inputRef,
-		onPaste: (e) => {
-			_pasteListener(e);
-			props.onPaste?.(e);
-		},
-		onChange: _changeListener,
-		onMouseOver: (e) => {
-			setIsHoveringInput(true);
-			props.onMouseOver?.(e);
-		},
-		onMouseLeave: (e) => {
-			setIsHoveringInput(false);
-			props.onMouseLeave?.(e);
-		},
-		onFocus: (e) => {
-			_focusListener();
-			props.onFocus?.(e);
-		},
-		onBlur: (e) => {
-			setIsFocused(false);
-			props.onBlur?.(e);
-		}
-	});
-	const setSelection = (index) => {
-		const input = inputRef.current;
-		if (!input || props.disabled) return;
-		const clampedIndex = Math.max(0, Math.min(index, maxLength - 1));
-		if (document.activeElement !== input) input.focus();
-		const hasChar = value[clampedIndex] !== void 0;
-		const start = clampedIndex;
-		const end = hasChar ? clampedIndex + 1 : clampedIndex;
-		input.setSelectionRange(start, end);
-		setMirrorSelectionStart(start);
-		setMirrorSelectionEnd(end);
-		setIsFocused(true);
-	};
-	const contextValue = {
-		slots: Array.from({ length: maxLength }).map((_, slotIdx) => {
-			const isActive = isFocused && mirrorSelectionStart !== null && mirrorSelectionEnd !== null && (mirrorSelectionStart === mirrorSelectionEnd && slotIdx === mirrorSelectionStart || slotIdx >= mirrorSelectionStart && slotIdx < mirrorSelectionEnd);
-			const char = value[slotIdx] !== void 0 ? value[slotIdx] : null;
-			return {
-				char,
-				placeholderChar: value[0] !== void 0 ? null : placeholder?.[slotIdx] ?? null,
-				isActive,
-				hasFakeCaret: isActive && char === null
-			};
-		}),
-		isFocused,
-		isHovering: !props.disabled && isHoveringInput,
-		setSelection
-	};
-	const renderedChildren = render !== void 0 ? render(contextValue) : /* @__PURE__ */ jsx(OTPInputContext.Provider, {
-		value: contextValue,
-		children
-	});
-	return /* @__PURE__ */ jsxs(Fragment$1, { children: [noScriptCSSFallback !== null && /* @__PURE__ */ jsx("noscript", { children: /* @__PURE__ */ jsx("style", { children: noScriptCSSFallback }) }), /* @__PURE__ */ jsxs("div", {
-		ref: containerRef,
-		"data-input-otp-container": true,
-		style: rootStyle,
-		className: containerClassName,
-		children: [renderedChildren, /* @__PURE__ */ jsx("div", {
-			style: {
-				position: "absolute",
-				inset: 0
-			},
-			children: renderedInput
-		})]
-	})] });
-};
-const safeInsertRule = (sheet, rule) => {
-	try {
-		sheet.insertRule(rule);
-	} catch {
-		console.error("input-otp could not insert CSS rule:", rule);
-	}
-};
-const NOSCRIPT_CSS_FALLBACK = `
-[data-input-otp] {
-  --nojs-bg: white !important;
-  --nojs-fg: black !important;
-
-  background-color: var(--nojs-bg) !important;
-  color: var(--nojs-fg) !important;
-  caret-color: var(--nojs-fg) !important;
-  letter-spacing: .25em !important;
-  text-align: center !important;
-  border: 1px solid var(--nojs-fg) !important;
-  border-radius: 4px !important;
-  width: 100% !important;
-}
-@media (prefers-color-scheme: dark) {
-  [data-input-otp] {
-    --nojs-bg: black !important;
-    --nojs-fg: white !important;
-  }
-}`;
-
-//#endregion
-export { OTPInput, OTPInputContext, usePasswordManagerBadge, usePrevious };
-//# sourceMappingURL=Input.mjs.map

package/dist/esm/components/Input/OTPInput/Input.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Input.mjs","names":["OTPInput: FC<OTPInputProps>","direction: 'forward' | 'backward' | 'none'","rootStyle: CSSProperties","inputStyle: CSSProperties","contextValue: RenderProps"],"sources":["../../../../../src/components/Input/OTPInput/Input.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ChangeEvent,\n  type ClipboardEvent,\n  type CSSProperties,\n  createContext,\n  type FC,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type RefObject,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nconst syncTimeouts = (cb: (...args: any[]) => unknown): number[] => {\n  const t1 = setTimeout(cb, 0); // For faster machines\n  const t2 = setTimeout(cb, 1_0);\n  const t3 = setTimeout(cb, 5_0);\n  return [t1, t2, t3];\n};\n\nexport type SlotProps = {\n  isActive: boolean;\n  char: string | null;\n  placeholderChar: string | null;\n  hasFakeCaret: boolean;\n};\nexport type RenderProps = {\n  slots: SlotProps[];\n  isFocused: boolean;\n  isHovering: boolean;\n  setSelection: (index: number) => void;\n};\ntype OverrideProps<T, R> = Omit<T, keyof R> & R;\ntype OTPInputBaseProps = OverrideProps<\n  InputHTMLAttributes<HTMLInputElement>,\n  {\n    value?: string;\n    onChange?: (newValue: string) => unknown;\n\n    maxLength: number;\n\n    textAlign?: 'left' | 'center' | 'right';\n\n    onComplete?: (...args: any[]) => unknown;\n    pushPasswordManagerStrategy?: 'increase-width' | 'none';\n    pasteTransformer?: (pasted: string) => string;\n\n    containerClassName?: string;\n\n    noScriptCSSFallback?: string | null;\n  }\n>;\n\ntype InputOTPRenderFn = (props: RenderProps) => ReactNode;\n\nexport type OTPInputProps = OTPInputBaseProps &\n  (\n    | {\n        render: InputOTPRenderFn;\n        children?: never;\n      }\n    | {\n        render?: never;\n        children: ReactNode;\n      }\n  );\n\nconst PWM_BADGE_MARGIN_RIGHT = 18;\nconst PWM_BADGE_SPACE_WIDTH_PX = 40;\nconst PWM_BADGE_SPACE_WIDTH = `${PWM_BADGE_SPACE_WIDTH_PX}px` as const;\n\nconst PASSWORD_MANAGERS_SELECTORS = [\n  '[data-lastpass-icon-root]', // LastPass\n  'com-1password-button', // 1Password\n  '[data-dashlanecreated]', // Dashlane\n  '[style$=\"2147483647 !important;\"]', // Bitwarden\n].join(',');\n\nexport const usePasswordManagerBadge = ({\n  containerRef,\n  inputRef,\n  pushPasswordManagerStrategy,\n  isFocused,\n}: {\n  containerRef: RefObject<HTMLDivElement | null>;\n  inputRef: RefObject<HTMLInputElement | null>;\n  pushPasswordManagerStrategy: OTPInputProps['pushPasswordManagerStrategy'];\n  isFocused: boolean;\n}) => {\n  /** Password managers have a badge\n   *  and I'll use this state to push them\n   *  outside the input */\n  const [hasPWMBadge, setHasPWMBadge] = useState(false);\n  const [hasPWMBadgeSpace, setHasPWMBadgeSpace] = useState(false);\n  const [done, setDone] = useState(false);\n\n  const willPushPWMBadge =\n    pushPasswordManagerStrategy === 'none'\n      ? false\n      : (pushPasswordManagerStrategy === 'increase-width' ||\n          // TODO: remove 'experimental-no-flickering' support in 2.0.0\n          pushPasswordManagerStrategy === 'experimental-no-flickering') &&\n        hasPWMBadge &&\n        hasPWMBadgeSpace;\n\n  const trackPWMBadge = () => {\n    const container = containerRef.current;\n    const input = inputRef.current;\n    if (\n      !container ||\n      !input ||\n      done ||\n      pushPasswordManagerStrategy === 'none'\n    ) {\n      return;\n    }\n\n    const elementToCompare = container;\n\n    // Get the top right-center point of the container.\n    // That is usually where most password managers place their badge.\n    const rightCornerX =\n      elementToCompare.getBoundingClientRect().left +\n      elementToCompare.offsetWidth;\n    const centereredY =\n      elementToCompare.getBoundingClientRect().top +\n      elementToCompare.offsetHeight / 2;\n    const x = rightCornerX - PWM_BADGE_MARGIN_RIGHT;\n    const y = centereredY;\n\n    // Do an extra search to check for famous password managers\n    const pmws = document.querySelectorAll(PASSWORD_MANAGERS_SELECTORS);\n\n    // If no password manager is automatically detect,\n    // we'll try to dispatch document.elementFromPoint\n    // to identify badges\n    if (pmws.length === 0) {\n      const maybeBadgeEl = document.elementFromPoint(x, y);\n\n      // If the found element is the input itself,\n      // then we assume it's not a password manager badge.\n      // We are not sure. Most times that means there isn't a badge.\n      if (maybeBadgeEl === container) {\n        return;\n      }\n    }\n\n    setHasPWMBadge(true);\n    setDone(true);\n  };\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container || pushPasswordManagerStrategy === 'none') {\n      return;\n    }\n\n    // Check if the PWM area is 100% visible\n    const checkHasSpace = () => {\n      const viewportWidth = window.innerWidth;\n      const distanceToRightEdge =\n        viewportWidth - container.getBoundingClientRect().right;\n      setHasPWMBadgeSpace(distanceToRightEdge >= PWM_BADGE_SPACE_WIDTH_PX);\n    };\n\n    checkHasSpace();\n    const interval = setInterval(checkHasSpace, 1000);\n\n    return () => {\n      clearInterval(interval);\n    };\n  }, [containerRef, pushPasswordManagerStrategy]);\n\n  useEffect(() => {\n    const _isFocused = isFocused || document.activeElement === inputRef.current;\n\n    if (pushPasswordManagerStrategy === 'none' || !_isFocused) {\n      return;\n    }\n    const t1 = setTimeout(trackPWMBadge, 0);\n    const t2 = setTimeout(trackPWMBadge, 2000);\n    const t3 = setTimeout(trackPWMBadge, 5000);\n    const t4 = setTimeout(() => {\n      setDone(true);\n    }, 6000);\n    return () => {\n      clearTimeout(t1);\n      clearTimeout(t2);\n      clearTimeout(t3);\n      clearTimeout(t4);\n    };\n  }, [inputRef, isFocused, pushPasswordManagerStrategy]);\n\n  return { hasPWMBadge, willPushPWMBadge, PWM_BADGE_SPACE_WIDTH };\n};\n\nexport const usePrevious = <T,>(value: T): T | undefined => {\n  const ref = useRef<T | undefined>(undefined);\n  useEffect(() => {\n    ref.current = value;\n  });\n  return ref.current;\n};\n\nexport const OTPInputContext = createContext<RenderProps>({} as RenderProps);\n\nexport const OTPInput: FC<OTPInputProps> = ({\n  value: uncheckedValue,\n  onChange: uncheckedOnChange,\n  maxLength,\n  textAlign = 'left',\n  pattern,\n  placeholder,\n  inputMode = 'numeric',\n  onComplete,\n  pushPasswordManagerStrategy = 'increase-width',\n  pasteTransformer,\n  containerClassName,\n  noScriptCSSFallback = NOSCRIPT_CSS_FALLBACK,\n  render,\n  children,\n  ...props\n}) => {\n  // Only used when `value` state is not provided\n  const [internalValue, setInternalValue] = useState(\n    typeof props.defaultValue === 'string' ? props.defaultValue : ''\n  );\n\n  // Definitions\n  const value = uncheckedValue ?? internalValue;\n  const previousValue = usePrevious(value);\n  const onChange = (newValue: string) => {\n    uncheckedOnChange?.(newValue);\n    setInternalValue(newValue);\n  };\n  const regexp =\n    pattern !== undefined\n      ? typeof pattern === 'string'\n        ? new RegExp(pattern)\n        : pattern\n      : null;\n\n  /** useRef */\n  const inputRef = useRef<HTMLInputElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const initialLoadRef = useRef({\n    value,\n    onChange,\n    isIOS:\n      typeof window !== 'undefined' &&\n      window?.CSS?.supports?.('-webkit-touch-callout', 'none'),\n  });\n  const inputMetadataRef = useRef<{\n    prev: [number | null, number | null, 'none' | 'forward' | 'backward'];\n  }>({\n    prev: [\n      inputRef.current?.selectionStart ?? null,\n      inputRef.current?.selectionEnd ?? null,\n      inputRef.current?.selectionDirection ?? 'none',\n    ],\n  });\n  useEffect(() => {\n    const input = inputRef.current;\n    const container = containerRef.current;\n\n    if (!input || !container) {\n      return;\n    }\n\n    // Sync input value\n    if (initialLoadRef.current.value !== input.value) {\n      initialLoadRef.current.onChange(input.value);\n    }\n\n    // Previous selection\n    inputMetadataRef.current.prev = [\n      input.selectionStart,\n      input.selectionEnd,\n      input.selectionDirection ?? 'none',\n    ];\n    const onDocumentSelectionChange = () => {\n      if (document.activeElement !== input) {\n        setMirrorSelectionStart(null);\n        setMirrorSelectionEnd(null);\n        return;\n      }\n\n      // Aliases\n      const _s = input.selectionStart;\n      const _e = input.selectionEnd;\n      const _dir = input.selectionDirection;\n      const _ml = input.maxLength;\n      const _val = input.value;\n      const _prev = inputMetadataRef.current.prev;\n\n      // Algorithm\n      let start = -1;\n      let end = -1;\n      let direction: 'forward' | 'backward' | 'none' = _dir ?? 'none';\n      if (_val.length !== 0 && _s !== null && _e !== null) {\n        const isSingleCaret = _s === _e;\n        const isInsertMode = _s === _val.length && _val.length < _ml;\n\n        if (isSingleCaret && !isInsertMode) {\n          const c = _s;\n          if (c === 0) {\n            start = 0;\n            end = 1;\n            direction = 'forward';\n          } else if (c === _ml) {\n            start = c - 1;\n            end = c;\n            direction = 'backward';\n          } else if (_ml > 1 && _val.length > 1) {\n            let offset = 0;\n            if (_prev[0] !== null && _prev[1] !== null) {\n              direction = c < _prev[1] ? 'backward' : 'forward';\n              const wasPreviouslyInserting =\n                _prev[0] === _prev[1] && _prev[0] < _ml;\n              if (direction === 'backward' && !wasPreviouslyInserting) {\n                offset = -1;\n              }\n            }\n\n            start = offset + c;\n            end = offset + c + 1;\n          }\n        }\n\n        if (start !== -1 && end !== -1 && start !== end) {\n          inputRef.current?.setSelectionRange(start, end, direction);\n        }\n      }\n\n      // Finally, update the state\n      const s = start !== -1 ? start : _s;\n      const e = end !== -1 ? end : _e;\n      const dir = direction;\n      setMirrorSelectionStart(s);\n      setMirrorSelectionEnd(e);\n      // Store the previous selection value\n      inputMetadataRef.current.prev = [s, e, dir];\n    };\n    document.addEventListener('selectionchange', onDocumentSelectionChange, {\n      capture: true,\n    });\n\n    // Set initial mirror state\n    onDocumentSelectionChange();\n    if (document.activeElement === input) {\n      setIsFocused(true);\n    }\n\n    // Apply needed styles\n    if (!document.getElementById('input-otp-style')) {\n      const styleEl = document.createElement('style');\n      styleEl.id = 'input-otp-style';\n      document.head.appendChild(styleEl);\n\n      if (styleEl.sheet) {\n        const autofillStyles =\n          '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;';\n\n        safeInsertRule(\n          styleEl.sheet,\n          '[data-input-otp]::selection { background: transparent !important; color: transparent !important; }'\n        );\n        safeInsertRule(\n          styleEl.sheet,\n          `[data-input-otp]:autofill { ${autofillStyles} }`\n        );\n        safeInsertRule(\n          styleEl.sheet,\n          `[data-input-otp]:-webkit-autofill { ${autofillStyles} }`\n        );\n        // iOS\n        safeInsertRule(\n          styleEl.sheet,\n          `@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; } }`\n        );\n        // PWM badges\n        safeInsertRule(\n          styleEl.sheet,\n          `[data-input-otp] + * { pointer-events: all !important; }`\n        );\n      }\n    }\n    // Track root height\n    const updateRootHeight = () => {\n      if (container) {\n        container.style.setProperty('--root-height', `${input.clientHeight}px`);\n      }\n    };\n    updateRootHeight();\n    const resizeObserver = new ResizeObserver(updateRootHeight);\n    resizeObserver.observe(input);\n\n    return () => {\n      document.removeEventListener(\n        'selectionchange',\n        onDocumentSelectionChange,\n        { capture: true }\n      );\n      resizeObserver.disconnect();\n    };\n  }, []);\n\n  /** Mirrors for UI rendering purpose only */\n  const [isHoveringInput, setIsHoveringInput] = useState(false);\n  const [isFocused, setIsFocused] = useState(false);\n  const [mirrorSelectionStart, setMirrorSelectionStart] = useState<\n    number | null\n  >(null);\n  const [mirrorSelectionEnd, setMirrorSelectionEnd] = useState<number | null>(\n    null\n  );\n\n  /** Effects */\n  useEffect(() => {\n    syncTimeouts(() => {\n      // Forcefully remove :autofill state\n      inputRef.current?.dispatchEvent(new Event('input'));\n\n      // Update the selection state\n      const s = inputRef.current?.selectionStart ?? null;\n      const e = inputRef.current?.selectionEnd ?? null;\n      const dir = inputRef.current?.selectionDirection ?? 'none';\n      if (s !== null && e !== null) {\n        setMirrorSelectionStart(s);\n        setMirrorSelectionEnd(e);\n        inputMetadataRef.current.prev = [s, e, dir];\n      }\n    });\n  }, [value, isFocused]);\n\n  useEffect(() => {\n    if (previousValue === undefined) {\n      return;\n    }\n\n    if (\n      value !== previousValue &&\n      previousValue.length < maxLength &&\n      value.length === maxLength\n    ) {\n      onComplete?.(value);\n    }\n  }, [maxLength, onComplete, previousValue, value]);\n\n  const pwmb = usePasswordManagerBadge({\n    containerRef,\n    inputRef,\n    pushPasswordManagerStrategy,\n    isFocused,\n  });\n\n  /** Event handlers */\n  const _changeListener = (e: ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.currentTarget.value.slice(0, maxLength);\n    if (newValue.length > 0 && regexp && !regexp.test(newValue)) {\n      e.preventDefault();\n      return;\n    }\n    const maybeHasDeleted =\n      typeof previousValue === 'string' &&\n      newValue.length < previousValue.length;\n    if (maybeHasDeleted) {\n      // Since cutting/deleting text doesn't trigger\n      // selectionchange event, we'll have to dispatch it manually.\n      // NOTE: The following line also triggers when cmd+A then pasting\n      // a value with smaller length, which is not ideal for performance.\n      document.dispatchEvent(new Event('selectionchange'));\n    }\n    onChange(newValue);\n  };\n  const _focusListener = () => {\n    if (inputRef.current) {\n      const start = Math.min(inputRef.current.value.length, maxLength - 1);\n      const end = inputRef.current.value.length;\n      inputRef.current?.setSelectionRange(start, end);\n      setMirrorSelectionStart(start);\n      setMirrorSelectionEnd(end);\n    }\n    setIsFocused(true);\n  };\n  // Fix iOS pasting\n  const _pasteListener = (e: ClipboardEvent<HTMLInputElement>) => {\n    const input = inputRef.current;\n    if (\n      !pasteTransformer &&\n      (!initialLoadRef.current.isIOS || !e.clipboardData || !input)\n    ) {\n      return;\n    }\n\n    const _content = e.clipboardData.getData('text/plain');\n    const content = pasteTransformer ? pasteTransformer(_content) : _content;\n    e.preventDefault();\n\n    const start = inputRef.current?.selectionStart;\n    const end = inputRef.current?.selectionEnd;\n\n    const isReplacing = start !== end;\n\n    const newValueUncapped = isReplacing\n      ? value.slice(0, start ?? 0) + content + value.slice(end ?? 0) // Replacing\n      : value.slice(0, start ?? 0) + content + value.slice(start ?? 0); // Inserting\n    const newValue = newValueUncapped.slice(0, maxLength);\n\n    if (newValue.length > 0 && regexp && !regexp.test(newValue)) {\n      return;\n    }\n\n    if (input) {\n      input.value = newValue;\n      onChange(newValue);\n\n      const _start = Math.min(newValue.length, maxLength - 1);\n      const _end = newValue.length;\n\n      input.setSelectionRange(_start, _end);\n      setMirrorSelectionStart(_start);\n      setMirrorSelectionEnd(_end);\n    }\n  };\n\n  /** Styles */\n  const rootStyle: CSSProperties = {\n    position: 'relative',\n    cursor: props.disabled ? 'default' : 'text',\n    userSelect: 'none',\n    WebkitUserSelect: 'none',\n    pointerEvents: 'none',\n  };\n\n  const inputStyle: CSSProperties = {\n    position: 'absolute',\n    inset: 0,\n    width: pwmb.willPushPWMBadge\n      ? `calc(100% + ${pwmb.PWM_BADGE_SPACE_WIDTH})`\n      : '100%',\n    clipPath: pwmb.willPushPWMBadge\n      ? `inset(0 ${pwmb.PWM_BADGE_SPACE_WIDTH} 0 0)`\n      : undefined,\n    height: '100%',\n    display: 'flex',\n    textAlign,\n    opacity: '1', // Mandatory for iOS hold-paste\n    color: 'transparent',\n    pointerEvents: 'all',\n    background: 'transparent',\n    caretColor: 'transparent',\n    border: '0 solid transparent',\n    outline: '0 solid transparent',\n    boxShadow: 'none',\n    lineHeight: '1',\n    letterSpacing: '-.5em',\n    fontSize: 'var(--root-height)',\n    fontFamily: 'monospace',\n    zIndex: -1,\n    fontVariantNumeric: 'tabular-nums',\n    // letterSpacing: '-1em',\n    // transform: 'scale(1.5)',\n    // paddingRight: '100%',\n    // paddingBottom: '100%',\n    // debugging purposes\n    // inset: undefined,\n    // position: undefined,\n    // color: 'black',\n    // background: 'white',\n    // opacity: '1',\n    // caretColor: 'black',\n    // padding: '0',\n    // letterSpacing: 'unset',\n    // fontSize: 'unset',\n    // paddingInline: '.5rem',\n  };\n\n  /** Rendering */\n  const renderedInput = (\n    <input\n      autoComplete={props.autoComplete || 'one-time-code'}\n      {...props}\n      data-input-otp\n      data-input-otp-placeholder-shown={value.length === 0 || undefined}\n      data-input-otp-mss={mirrorSelectionStart}\n      data-input-otp-mse={mirrorSelectionEnd}\n      inputMode={inputMode}\n      pattern={regexp?.source}\n      aria-placeholder={placeholder}\n      style={inputStyle}\n      maxLength={maxLength}\n      value={value}\n      ref={inputRef}\n      onPaste={(e) => {\n        _pasteListener(e);\n        props.onPaste?.(e);\n      }}\n      onChange={_changeListener}\n      onMouseOver={(e) => {\n        setIsHoveringInput(true);\n        props.onMouseOver?.(e);\n      }}\n      onMouseLeave={(e) => {\n        setIsHoveringInput(false);\n        props.onMouseLeave?.(e);\n      }}\n      onFocus={(e) => {\n        _focusListener();\n        props.onFocus?.(e);\n      }}\n      onBlur={(e) => {\n        setIsFocused(false);\n        props.onBlur?.(e);\n      }}\n    />\n  );\n\n  const setSelection = (index: number) => {\n    const input = inputRef.current;\n    if (!input || props.disabled) {\n      return;\n    }\n\n    // Clamp index to valid range\n    const clampedIndex = Math.max(0, Math.min(index, maxLength - 1));\n\n    // Focus the input if not already focused\n    if (document.activeElement !== input) {\n      input.focus();\n    }\n\n    // Set selection to the clicked slot\n    // If there's a character at that position, select it; otherwise just position the caret\n    const hasChar = value[clampedIndex] !== undefined;\n    const start = clampedIndex;\n    const end = hasChar ? clampedIndex + 1 : clampedIndex;\n\n    input.setSelectionRange(start, end);\n    setMirrorSelectionStart(start);\n    setMirrorSelectionEnd(end);\n    setIsFocused(true);\n  };\n\n  const contextValue: RenderProps = {\n    slots: Array.from({ length: maxLength }).map((_, slotIdx) => {\n      const isActive =\n        isFocused &&\n        mirrorSelectionStart !== null &&\n        mirrorSelectionEnd !== null &&\n        ((mirrorSelectionStart === mirrorSelectionEnd &&\n          slotIdx === mirrorSelectionStart) ||\n          (slotIdx >= mirrorSelectionStart && slotIdx < mirrorSelectionEnd));\n\n      const char = value[slotIdx] !== undefined ? value[slotIdx] : null;\n      const placeholderChar =\n        value[0] !== undefined ? null : (placeholder?.[slotIdx] ?? null);\n\n      return {\n        char,\n        placeholderChar,\n        isActive,\n        hasFakeCaret: isActive && char === null,\n      };\n    }),\n    isFocused,\n    isHovering: !props.disabled && isHoveringInput,\n    setSelection,\n  };\n\n  const renderedChildren =\n    render !== undefined ? (\n      render(contextValue)\n    ) : (\n      <OTPInputContext.Provider value={contextValue}>\n        {children}\n      </OTPInputContext.Provider>\n    );\n\n  return (\n    <>\n      {noScriptCSSFallback !== null && (\n        <noscript>\n          <style>{noScriptCSSFallback}</style>\n        </noscript>\n      )}\n\n      <div\n        ref={containerRef}\n        data-input-otp-container\n        style={rootStyle}\n        className={containerClassName}\n      >\n        {renderedChildren}\n\n        <div\n          style={{\n            position: 'absolute',\n            inset: 0,\n          }}\n        >\n          {renderedInput}\n        </div>\n      </div>\n    </>\n  );\n};\n\nconst safeInsertRule = (sheet: CSSStyleSheet, rule: string) => {\n  try {\n    sheet.insertRule(rule);\n  } catch {\n    console.error('input-otp could not insert CSS rule:', rule);\n  }\n};\n\n// Decided to go with <noscript>\n// instead of `scripting` CSS media query\n// because it's a fallback for initial page load\n// and the <script> tag won't be loaded\n// unless the user has JS disabled.\nconst NOSCRIPT_CSS_FALLBACK = `\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}`;\n"],"mappings":"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"}