@radix-ui/react-one-time-password-field 0.1.12 → 0.1.13-rc.1784059564143
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/index.js +14 -8
- package/dist/index.js.map +2 -2
- package/dist/index.mjs +15 -8
- package/dist/index.mjs.map +2 -2
- package/package.json +7 -7
- package/src/one-time-password-field.tsx +7 -3
package/dist/index.js
CHANGED
|
@@ -6,6 +6,7 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
6
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
7
|
var __getProtoOf = Object.getPrototypeOf;
|
|
8
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
9
10
|
var __export = (target, all) => {
|
|
10
11
|
for (var name in all)
|
|
11
12
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -84,8 +85,9 @@ var [createOneTimePasswordFieldContext] = (0, import_react_context.createContext
|
|
|
84
85
|
]);
|
|
85
86
|
var useRovingFocusGroupScope = (0, import_react_roving_focus.createRovingFocusGroupScope)();
|
|
86
87
|
var [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] = createOneTimePasswordFieldContext(ONE_TIME_PASSWORD_FIELD_NAME);
|
|
87
|
-
var OneTimePasswordField = React.forwardRef(
|
|
88
|
-
|
|
88
|
+
var OneTimePasswordField = /* @__PURE__ */ React.forwardRef(
|
|
89
|
+
// blank line to reduce diff noise
|
|
90
|
+
/* @__PURE__ */ __name(function OneTimePasswordFieldImpl({
|
|
89
91
|
__scopeOneTimePasswordField,
|
|
90
92
|
defaultValue,
|
|
91
93
|
value: valueProp,
|
|
@@ -266,7 +268,7 @@ var OneTimePasswordField = React.forwardRef(
|
|
|
266
268
|
React.useEffect(() => {
|
|
267
269
|
const form2 = locateForm();
|
|
268
270
|
if (form2) {
|
|
269
|
-
const reset = () => dispatch({ type: "CLEAR", reason: "Reset" });
|
|
271
|
+
const reset = /* @__PURE__ */ __name(() => dispatch({ type: "CLEAR", reason: "Reset" }), "reset");
|
|
270
272
|
form2.addEventListener("reset", reset);
|
|
271
273
|
return () => form2.removeEventListener("reset", reset);
|
|
272
274
|
}
|
|
@@ -335,9 +337,9 @@ var OneTimePasswordField = React.forwardRef(
|
|
|
335
337
|
) }) })
|
|
336
338
|
}
|
|
337
339
|
);
|
|
338
|
-
}
|
|
340
|
+
}, "OneTimePasswordFieldImpl")
|
|
339
341
|
);
|
|
340
|
-
var OneTimePasswordFieldHiddenInput = React.forwardRef(function OneTimePasswordFieldHiddenInput2({ __scopeOneTimePasswordField, ...props }, forwardedRef) {
|
|
342
|
+
var OneTimePasswordFieldHiddenInput = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function OneTimePasswordFieldHiddenInput2({ __scopeOneTimePasswordField, ...props }, forwardedRef) {
|
|
341
343
|
const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(
|
|
342
344
|
"OneTimePasswordFieldHiddenInput",
|
|
343
345
|
__scopeOneTimePasswordField
|
|
@@ -360,8 +362,8 @@ var OneTimePasswordFieldHiddenInput = React.forwardRef(function OneTimePasswordF
|
|
|
360
362
|
readOnly: true
|
|
361
363
|
}
|
|
362
364
|
);
|
|
363
|
-
});
|
|
364
|
-
var OneTimePasswordFieldInput = React.forwardRef(function OneTimePasswordFieldInput2({
|
|
365
|
+
}, "OneTimePasswordFieldHiddenInput"));
|
|
366
|
+
var OneTimePasswordFieldInput = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function OneTimePasswordFieldInput2({
|
|
365
367
|
__scopeOneTimePasswordField,
|
|
366
368
|
onInvalidChange,
|
|
367
369
|
index: indexProp,
|
|
@@ -613,13 +615,15 @@ var OneTimePasswordFieldInput = React.forwardRef(function OneTimePasswordFieldIn
|
|
|
613
615
|
}
|
|
614
616
|
}
|
|
615
617
|
) });
|
|
616
|
-
});
|
|
618
|
+
}, "OneTimePasswordFieldInput"));
|
|
617
619
|
function isFormElement(element) {
|
|
618
620
|
return element?.tagName === "FORM";
|
|
619
621
|
}
|
|
622
|
+
__name(isFormElement, "isFormElement");
|
|
620
623
|
function removeWhitespace(value) {
|
|
621
624
|
return value.replace(/\s/g, "");
|
|
622
625
|
}
|
|
626
|
+
__name(removeWhitespace, "removeWhitespace");
|
|
623
627
|
function focusInput(element) {
|
|
624
628
|
if (!element) return;
|
|
625
629
|
if (element.ownerDocument.activeElement === element) {
|
|
@@ -630,7 +634,9 @@ function focusInput(element) {
|
|
|
630
634
|
element.focus();
|
|
631
635
|
}
|
|
632
636
|
}
|
|
637
|
+
__name(focusInput, "focusInput");
|
|
633
638
|
function isInputEvent(event) {
|
|
634
639
|
return event.type === "input";
|
|
635
640
|
}
|
|
641
|
+
__name(isInputEvent, "isInputEvent");
|
|
636
642
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts", "../src/one-time-password-field.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client';\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n} from './one-time-password-field';\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n Root,\n Input,\n HiddenInput,\n} from './one-time-password-field';\n", "import * as Primitive from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { unstable_createCollection as createCollection } from '@radix-ui/react-collection';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useIsHydrated } from '@radix-ui/react-use-is-hydrated';\nimport * as React from 'react';\nimport { flushSync } from 'react-dom';\nimport type { Scope } from '@radix-ui/react-context';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { clamp } from '@radix-ui/number';\n\ntype InputValidationType = 'alpha' | 'numeric' | 'alphanumeric' | 'none';\n\nconst INPUT_VALIDATION_MAP = {\n numeric: {\n type: 'numeric',\n regexp: /[^\\d]/g,\n pattern: '\\\\d{1}',\n inputMode: 'numeric',\n },\n alpha: {\n type: 'alpha',\n regexp: /[^a-zA-Z]/g,\n pattern: '[a-zA-Z]{1}',\n inputMode: 'text',\n },\n alphanumeric: {\n type: 'alphanumeric',\n regexp: /[^a-zA-Z0-9]/g,\n pattern: '[a-zA-Z0-9]{1}',\n inputMode: 'text',\n },\n none: null,\n} satisfies InputValidation;\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldProvider\n * -----------------------------------------------------------------------------------------------*/\n\ntype RovingFocusGroupProps = RovingFocusGroup.RovingFocusGroupProps;\n\ninterface OneTimePasswordFieldContextValue {\n attemptSubmit: () => void;\n autoComplete: AutoComplete;\n autoFocus: boolean;\n disabled: boolean;\n dispatch: Dispatcher;\n form: string | undefined;\n hiddenInputRef: React.RefObject<HTMLInputElement | null>;\n isHydrated: boolean;\n name: string | undefined;\n orientation: Exclude<RovingFocusGroupProps['orientation'], undefined>;\n placeholder: string | undefined;\n readOnly: boolean;\n type: InputType;\n userActionRef: React.RefObject<KeyboardActionDetails | null>;\n validationType: InputValidationType;\n value: string[];\n sanitizeValue: (arg: string | string[]) => string[];\n}\n\nconst ONE_TIME_PASSWORD_FIELD_NAME = 'OneTimePasswordField';\nconst [Collection, { useCollection, createCollectionScope, useInitCollection }] =\n createCollection<HTMLInputElement>(ONE_TIME_PASSWORD_FIELD_NAME);\nconst [createOneTimePasswordFieldContext] = createContextScope(ONE_TIME_PASSWORD_FIELD_NAME, [\n createCollectionScope,\n createRovingFocusGroupScope,\n]);\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\n\nconst [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] =\n createOneTimePasswordFieldContext<OneTimePasswordFieldContextValue>(ONE_TIME_PASSWORD_FIELD_NAME);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordField\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldOwnProps {\n /**\n * Specifies what\u2014if any\u2014permission the user agent has to provide automated\n * assistance in filling out form field values, as well as guidance to the\n * browser as to the type of information expected in the field. Allows\n * `\"one-time-code\"` or `\"off\"`.\n *\n * @defaultValue `\"one-time-code\"`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete\n */\n autoComplete?: AutoComplete;\n /**\n * Whether or not the first fillable input should be focused on page-load.\n *\n * @defaultValue `false`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autofocus\n */\n autoFocus?: boolean;\n /**\n * Whether or not the component should attempt to automatically submit when\n * all fields are filled. If the field is associated with an HTML `form`\n * element, the form's `requestSubmit` method will be called.\n *\n * @defaultValue `false`\n */\n autoSubmit?: boolean;\n /**\n * The initial value of the uncontrolled field.\n */\n defaultValue?: string;\n /**\n * Indicates the horizontal directionality of the parent element's text.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir\n */\n dir?: RovingFocusGroupProps['dir'];\n /**\n * Whether or not the the field's input elements are disabled.\n */\n disabled?: boolean;\n /**\n * A string specifying the `form` element with which the input is associated.\n * This string's value, if present, must match the id of a `form` element in\n * the same document.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#form\n */\n form?: string | undefined;\n /**\n * A string specifying a name for the input control. This name is submitted\n * along with the control's value when the form data is submitted.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#name\n */\n name?: string | undefined;\n /**\n * When the `autoSubmit` prop is set to `true`, this callback will be fired\n * before attempting to submit the associated form. It will be called whether\n * or not a form is located, or if submission is not allowed.\n */\n onAutoSubmit?: (value: string) => void;\n /**\n * A callback fired when the field's value changes. When the component is\n * controlled, this should update the state passed to the `value` prop.\n */\n onValueChange?: (value: string) => void;\n /**\n * Indicates the vertical directionality of the input elements.\n *\n * @defaultValue `\"horizontal\"`\n */\n orientation?: RovingFocusGroupProps['orientation'];\n /**\n * Defines the text displayed in a form control when the control has no value.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/placeholder\n */\n placeholder?: string | undefined;\n /**\n * Whether or not the input elements can be updated by the user.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/readonly\n */\n readOnly?: boolean;\n /**\n * Function for custom sanitization when `validationType` is set to `\"none\"`.\n * This function will be called before updating values in response to user\n * interactions.\n */\n sanitizeValue?: (value: string) => string;\n /**\n * The input type of the field's input elements. Can be `\"password\"` or `\"text\"`.\n */\n type?: InputType;\n /**\n * Specifies the type of input validation to be used. Can be `\"alpha\"`,\n * `\"numeric\"`, `\"alphanumeric\"` or `\"none\"`.\n *\n * @defaultValue `\"numeric\"`\n */\n validationType?: InputValidationType;\n /**\n * The controlled value of the field.\n */\n value?: string;\n}\n\ntype ScopedProps<P> = P & { __scopeOneTimePasswordField?: Scope };\n\ninterface OneTimePasswordFieldProps\n extends\n OneTimePasswordFieldOwnProps,\n Omit<Primitive.PrimitivePropsWithRef<'div'>, keyof OneTimePasswordFieldOwnProps> {}\n\nconst OneTimePasswordField = React.forwardRef<HTMLDivElement, OneTimePasswordFieldProps>(\n function OneTimePasswordFieldImpl(\n {\n __scopeOneTimePasswordField,\n defaultValue,\n value: valueProp,\n onValueChange,\n autoSubmit = false,\n children,\n onPaste,\n onAutoSubmit,\n disabled = false,\n readOnly = false,\n autoComplete = 'one-time-code',\n autoFocus = false,\n form,\n name,\n placeholder,\n type = 'text',\n // TODO: Change default to vertical when inputs use vertical writing mode\n orientation = 'horizontal',\n dir,\n validationType = 'numeric',\n sanitizeValue: sanitizeValueProp,\n ...domProps\n }: ScopedProps<OneTimePasswordFieldProps>,\n forwardedRef,\n ) {\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n const direction = useDirection(dir);\n const collectionState = useInitCollection();\n const [collection] = collectionState;\n\n const validation = INPUT_VALIDATION_MAP[validationType]\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : null;\n\n const sanitizeValue = React.useCallback(\n (value: string | string[]) => {\n if (Array.isArray(value)) {\n value = value.map(removeWhitespace).join('');\n } else {\n value = removeWhitespace(value);\n }\n\n if (validation) {\n // global regexp is stateful, so we clone it for each call\n const regexp = new RegExp(validation.regexp);\n value = value.replace(regexp, '');\n } else if (sanitizeValueProp) {\n value = sanitizeValueProp(value);\n }\n\n return value.split('');\n },\n [validation, sanitizeValueProp],\n );\n\n const controlledValue = React.useMemo(() => {\n return valueProp != null ? sanitizeValue(valueProp) : undefined;\n }, [valueProp, sanitizeValue]);\n\n const [value, setValue] = useControllableState({\n caller: 'OneTimePasswordField',\n prop: controlledValue,\n defaultProp: defaultValue != null ? sanitizeValue(defaultValue) : [],\n onChange: React.useCallback(\n (value: string[]) => onValueChange?.(value.join('')),\n [onValueChange],\n ),\n });\n\n // Use a ref so dispatch always reads the latest value without needing\n // value in its dependency array (which would change its identity every\n // keystroke and cause cascading effect re-runs).\n const latestValueRef = React.useRef(value);\n latestValueRef.current = value;\n\n // Update function *specifically* for event handlers.\n const dispatch = React.useCallback<Dispatcher>(\n (action) => {\n const value = latestValueRef.current;\n switch (action.type) {\n case 'SET_CHAR': {\n const { index, char } = action;\n const currentTarget = collection.at(index)?.element;\n if (value[index] === char) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n // empty values should be handled in the CLEAR_CHAR action\n if (char === '') {\n return;\n }\n\n if (validation) {\n const regexp = new RegExp(validation.regexp);\n const clean = char.replace(regexp, '');\n if (clean !== char) {\n // not valid; ignore\n return;\n }\n }\n\n // no more space\n if (value.length >= collection.size) {\n // replace current value; move to next input\n const newValue = [...value];\n newValue[index] = char;\n flushSync(() => setValue(newValue));\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n const newValue = [...value];\n newValue[index] = char;\n\n const lastElement = collection.at(-1)?.element;\n flushSync(() => setValue(newValue));\n if (currentTarget !== lastElement) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n } else {\n currentTarget?.select();\n }\n return;\n }\n\n case 'CLEAR_CHAR': {\n const { index, reason } = action;\n if (!value[index]) {\n return;\n }\n\n const newValue = value.filter((_, i) => i !== index);\n const currentTarget = collection.at(index)?.element;\n const previous = currentTarget && collection.from(currentTarget, -1)?.element;\n\n flushSync(() => setValue(newValue));\n if (reason === 'Backspace') {\n focusInput(previous);\n } else if (reason === 'Delete' || reason === 'Cut') {\n focusInput(currentTarget);\n }\n return;\n }\n\n case 'CLEAR': {\n if (value.length === 0) {\n return;\n }\n\n if (action.reason === 'Backspace' || action.reason === 'Delete') {\n flushSync(() => setValue([]));\n focusInput(collection.at(0)?.element);\n } else {\n setValue([]);\n }\n return;\n }\n\n case 'PASTE': {\n const { value: pastedValue } = action;\n const sanitizedValue = sanitizeValue(pastedValue);\n if (!sanitizedValue) {\n return;\n }\n\n const value = sanitizedValue.slice(0, collection.size);\n\n flushSync(() => setValue(value));\n focusInput(collection.at(value.length - 1)?.element);\n return;\n }\n }\n },\n [collection, sanitizeValue, setValue, validation],\n );\n\n // re-validate when the validation type changes\n const validationTypeRef = React.useRef(validation);\n React.useEffect(() => {\n if (!validation) {\n return;\n }\n\n if (validationTypeRef.current?.type !== validation.type) {\n validationTypeRef.current = validation;\n setValue(sanitizeValue(value.join('')));\n }\n }, [sanitizeValue, setValue, validation, value]);\n\n const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n\n const userActionRef = React.useRef<KeyboardActionDetails | null>(null);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, rootRef);\n\n const firstInput = collection.at(0)?.element;\n const locateForm = React.useCallback(() => {\n let formElement: HTMLFormElement | null | undefined;\n if (form) {\n const associatedElement = (rootRef.current?.ownerDocument ?? document).getElementById(form);\n if (isFormElement(associatedElement)) {\n formElement = associatedElement;\n }\n } else if (hiddenInputRef.current) {\n formElement = hiddenInputRef.current.form;\n } else if (firstInput) {\n formElement = firstInput.form;\n }\n\n return formElement ?? null;\n }, [form, firstInput]);\n\n const attemptSubmit = React.useCallback(() => {\n const formElement = locateForm();\n formElement?.requestSubmit();\n }, [locateForm]);\n\n React.useEffect(() => {\n const form = locateForm();\n if (form) {\n const reset = () => dispatch({ type: 'CLEAR', reason: 'Reset' });\n form.addEventListener('reset', reset);\n return () => form.removeEventListener('reset', reset);\n }\n }, [dispatch, locateForm]);\n\n const currentValue = value.join('');\n const valueRef = React.useRef(currentValue);\n const length = collection.size;\n React.useEffect(() => {\n const previousValue = valueRef.current;\n valueRef.current = currentValue;\n if (previousValue === currentValue) {\n return;\n }\n\n if (autoSubmit && value.every((char) => char !== '') && value.length === length) {\n onAutoSubmit?.(value.join(''));\n attemptSubmit();\n }\n }, [attemptSubmit, autoSubmit, currentValue, length, onAutoSubmit, value]);\n const isHydrated = useIsHydrated();\n\n return (\n <OneTimePasswordFieldContext\n scope={__scopeOneTimePasswordField}\n value={value}\n attemptSubmit={attemptSubmit}\n disabled={disabled}\n readOnly={readOnly}\n autoComplete={autoComplete}\n autoFocus={autoFocus}\n form={form}\n name={name}\n placeholder={placeholder}\n type={type}\n hiddenInputRef={hiddenInputRef}\n userActionRef={userActionRef}\n dispatch={dispatch}\n validationType={validationType}\n orientation={orientation}\n isHydrated={isHydrated}\n sanitizeValue={sanitizeValue}\n >\n <Collection.Provider scope={__scopeOneTimePasswordField} state={collectionState}>\n <Collection.Slot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n >\n <Primitive.Root.div\n {...domProps}\n role=\"group\"\n ref={composedRefs}\n onPaste={composeEventHandlers(\n onPaste,\n (event: React.ClipboardEvent<HTMLDivElement>) => {\n event.preventDefault();\n const pastedValue = event.clipboardData.getData('text/plain');\n dispatch({ type: 'PASTE', value: pastedValue });\n },\n )}\n >\n {children}\n </Primitive.Root.div>\n </RovingFocusGroup.Root>\n </Collection.Slot>\n </Collection.Provider>\n </OneTimePasswordFieldContext>\n );\n },\n);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldHiddenInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldHiddenInputProps extends Omit<\n React.ComponentProps<'input'>,\n | keyof 'value'\n | 'defaultValue'\n | 'type'\n | 'onChange'\n | 'readOnly'\n | 'disabled'\n | 'autoComplete'\n | 'autoFocus'\n> {}\n\nconst OneTimePasswordFieldHiddenInput = React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldHiddenInputProps\n>(function OneTimePasswordFieldHiddenInput(\n { __scopeOneTimePasswordField, ...props }: ScopedProps<OneTimePasswordFieldHiddenInputProps>,\n forwardedRef,\n) {\n const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldHiddenInput',\n __scopeOneTimePasswordField,\n );\n const ref = useComposedRefs(hiddenInputRef, forwardedRef);\n return (\n <input\n ref={ref}\n name={name}\n value={value.join('').trim()}\n autoComplete=\"off\"\n autoFocus={false}\n autoCapitalize=\"off\"\n autoCorrect=\"off\"\n autoSave=\"off\"\n spellCheck={false}\n {...props}\n type=\"hidden\"\n readOnly\n />\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldInputProps extends Omit<\n Primitive.PrimitivePropsWithRef<'input'>,\n | 'value'\n | 'defaultValue'\n | 'disabled'\n | 'readOnly'\n | 'autoComplete'\n | 'autoFocus'\n | 'form'\n | 'name'\n | 'placeholder'\n | 'type'\n> {\n /**\n * Callback fired when the user input fails native HTML input validation.\n */\n onInvalidChange?: (character: string) => void;\n /**\n * User-provided index to determine the order of the inputs. This is useful if\n * you need certain index-based attributes to be set on the initial render,\n * often to prevent flickering after hydration.\n */\n index?: number;\n}\n\nconst OneTimePasswordFieldInput = React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldInputProps\n>(function OneTimePasswordFieldInput(\n {\n __scopeOneTimePasswordField,\n onInvalidChange,\n index: indexProp,\n ...props\n }: ScopedProps<OneTimePasswordFieldInputProps>,\n forwardedRef,\n) {\n // TODO: warn if these values are passed\n const {\n value: _value,\n defaultValue: _defaultValue,\n disabled: _disabled,\n readOnly: _readOnly,\n autoComplete: _autoComplete,\n autoFocus: _autoFocus,\n form: _form,\n name: _name,\n placeholder: _placeholder,\n type: _type,\n ...domProps\n } = props as Primitive.PrimitivePropsWithRef<'input'>;\n\n const context = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldInput',\n __scopeOneTimePasswordField,\n );\n const { dispatch, userActionRef, validationType, isHydrated, disabled } = context;\n const collection = useCollection(__scopeOneTimePasswordField);\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n const [element, setElement] = React.useState<HTMLInputElement | null>(null);\n\n const index = indexProp ?? (element ? collection.indexOf(element) : -1);\n const canSetPlaceholder = indexProp != null || isHydrated;\n let placeholder: string | undefined;\n if (canSetPlaceholder && context.placeholder && context.value.length === 0) {\n // only set placeholder after hydration to prevent flickering when indices\n // are re-calculated\n placeholder = context.placeholder[index];\n }\n\n const composedInputRef = useComposedRefs(forwardedRef, inputRef, setElement);\n const char = context.value[index] ?? '';\n\n const keyboardActionTimeoutRef = React.useRef<number | null>(null);\n React.useEffect(() => {\n return () => {\n if (keyboardActionTimeoutRef.current) {\n window.clearTimeout(keyboardActionTimeoutRef.current);\n }\n };\n }, []);\n\n const totalValue = context.value.join('').trim();\n const lastSelectableIndex = clamp(totalValue.length, [0, collection.size - 1]);\n const isFocusable = index <= lastSelectableIndex;\n\n const validation =\n validationType in INPUT_VALIDATION_MAP\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : undefined;\n\n return (\n <Collection.ItemSlot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Item\n {...rovingFocusGroupScope}\n asChild\n focusable={!context.disabled && isFocusable}\n active={index === lastSelectableIndex}\n >\n {({ hasTabStop, isCurrentTabStop }) => {\n const supportsAutoComplete = hasTabStop ? isCurrentTabStop : index === 0;\n return (\n <Primitive.Root.input\n ref={composedInputRef}\n type={context.type}\n disabled={disabled}\n aria-label={`Character ${index + 1} of ${collection.size}`}\n autoComplete={supportsAutoComplete ? context.autoComplete : 'off'}\n data-1p-ignore={supportsAutoComplete ? undefined : 'true'}\n data-lpignore={supportsAutoComplete ? undefined : 'true'}\n data-protonpass-ignore={supportsAutoComplete ? undefined : 'true'}\n data-bwignore={supportsAutoComplete ? undefined : 'true'}\n inputMode={validation?.inputMode}\n maxLength={supportsAutoComplete ? collection.size : 1}\n pattern={validation?.pattern}\n readOnly={context.readOnly}\n value={char}\n placeholder={placeholder}\n data-radix-otp-input=\"\"\n data-radix-index={index}\n {...domProps}\n onFocus={composeEventHandlers(props.onFocus, (event) => {\n event.currentTarget.select();\n })}\n onCut={composeEventHandlers(props.onCut, (event) => {\n const currentValue = event.currentTarget.value;\n if (currentValue !== '') {\n // In this case the value will be cleared, but we don't want to\n // set it directly because the user may want to prevent default\n // behavior in the onChange handler. The userActionRef will\n // be set temporarily so the change handler can behave correctly\n // in response to the action.\n userActionRef.current = { type: 'cut' };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onInput={composeEventHandlers(props.onInput, (event) => {\n const value = event.currentTarget.value;\n if (value.length > 1) {\n // Password managers may try to insert the code into a single\n // input, in which case form validation will fail to prevent\n // additional input. Handle this the same as if a user were\n // pasting a value.\n event.preventDefault();\n userActionRef.current = { type: 'autocomplete-paste' };\n dispatch({ type: 'PASTE', value });\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onChange={composeEventHandlers(props.onChange, (event) => {\n const value = event.target.value;\n event.preventDefault();\n const action = userActionRef.current;\n userActionRef.current = null;\n\n if (action) {\n switch (action.type) {\n case 'cut':\n // TODO: do we want to assume the user wants to clear the\n // entire value here and copy the code to the clipboard instead\n // of just the value of the given input?\n dispatch({ type: 'CLEAR_CHAR', index, reason: 'Cut' });\n return;\n case 'autocomplete-paste':\n // the PASTE handler will already set the value and focus the final\n // input; we want to skip focusing the wrong element if the browser fires\n // onChange for the first input. This sometimes happens during autocomplete.\n return;\n case 'keydown': {\n if (action.key === 'Char') {\n // update resulting from a keydown event that set a value\n // directly. Ignore.\n return;\n }\n\n const isClearing =\n action.key === 'Backspace' && (action.metaKey || action.ctrlKey);\n if (action.key === 'Clear' || isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n dispatch({ type: 'CLEAR_CHAR', index, reason: action.key });\n }\n return;\n }\n default:\n action satisfies never;\n return;\n }\n }\n\n // Only update the value if it matches the input pattern\n if (event.target.validity.valid) {\n if (value === '') {\n let reason: 'Backspace' | 'Delete' | 'Cut' = 'Backspace';\n if (isInputEvent(event.nativeEvent)) {\n const inputType = event.nativeEvent.inputType;\n if (inputType === 'deleteContentBackward') {\n reason = 'Backspace';\n } else if (inputType === 'deleteByCut') {\n reason = 'Cut';\n }\n }\n dispatch({ type: 'CLEAR_CHAR', index, reason });\n } else {\n dispatch({ type: 'SET_CHAR', char: value, index, event });\n }\n } else {\n const element = event.target;\n onInvalidChange?.(element.value);\n requestAnimationFrame(() => {\n if (element.ownerDocument.activeElement === element) {\n element.select();\n }\n });\n }\n })}\n onKeyDown={composeEventHandlers(props.onKeyDown, (event) => {\n switch (event.key) {\n case 'Clear':\n case 'Delete':\n case 'Backspace': {\n const currentValue = event.currentTarget.value;\n // if current value is empty, no change event will fire\n if (currentValue === '') {\n // if the user presses delete when there is no value, noop\n if (event.key === 'Delete') return;\n\n const isClearing = event.key === 'Clear' || event.metaKey || event.ctrlKey;\n if (isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n const element = event.currentTarget;\n requestAnimationFrame(() => {\n focusInput(collection.from(element, -1)?.element);\n });\n }\n } else {\n // In this case the value will be cleared, but we don't want\n // to set it directly because the user may want to prevent\n // default behavior in the onChange handler. The userActionRef\n // will is set temporarily so the change handler can behave\n // correctly in response to the key vs. clearing the value by\n // setting state externally.\n userActionRef.current = {\n type: 'keydown',\n key: event.key,\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n\n return;\n }\n case 'Enter': {\n event.preventDefault();\n context.attemptSubmit();\n return;\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (context.orientation === 'horizontal') {\n // in horizontal orientation, the up/down will de-select the\n // input instead of moving focus\n event.preventDefault();\n }\n return;\n }\n // TODO: Handle left/right arrow keys in vertical writing mode\n default: {\n if (event.currentTarget.value === event.key) {\n // if current value is same as the key press, no change event\n // will fire. Focus the next input.\n const element = event.currentTarget;\n event.preventDefault();\n focusInput(collection.from(element, 1)?.element);\n return;\n } else if (\n // input already has a value, but...\n event.currentTarget.value &&\n // the value is not selected\n !(\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd != null &&\n event.currentTarget.selectionEnd > 0\n )\n ) {\n const attemptedValue = event.key;\n if (event.key.length > 1 || event.key === ' ') {\n // not a character; do nothing\n return;\n } else {\n // user is attempting to enter a character, but the input\n // will not update by default since it's limited to a single\n // character.\n const nextInput = collection.from(event.currentTarget, 1)?.element;\n const lastInput = collection.at(-1)?.element;\n if (nextInput !== lastInput && event.currentTarget !== lastInput) {\n // if selection is before the value, set the value of the\n // current input. Otherwise set the value of the next\n // input.\n if (event.currentTarget.selectionStart === 0) {\n dispatch({ type: 'SET_CHAR', char: attemptedValue, index, event });\n } else {\n dispatch({\n type: 'SET_CHAR',\n char: attemptedValue,\n index: index + 1,\n event,\n });\n }\n\n userActionRef.current = {\n type: 'keydown',\n key: 'Char',\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n }\n }\n }\n }\n })}\n onPointerDown={composeEventHandlers(props.onPointerDown, (event) => {\n event.preventDefault();\n const indexToFocus = Math.min(index, lastSelectableIndex);\n const element = collection.at(indexToFocus)?.element;\n focusInput(element);\n })}\n />\n );\n }}\n </RovingFocusGroup.Item>\n </Collection.ItemSlot>\n );\n});\n\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n OneTimePasswordField as Root,\n OneTimePasswordFieldInput as Input,\n OneTimePasswordFieldHiddenInput as HiddenInput,\n};\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction isFormElement(element: Element | null | undefined): element is HTMLFormElement {\n return element?.tagName === 'FORM';\n}\n\nfunction removeWhitespace(value: string) {\n return value.replace(/\\s/g, '');\n}\n\nfunction focusInput(element: HTMLInputElement | null | undefined) {\n if (!element) return;\n if (element.ownerDocument.activeElement === element) {\n // if the element is already focused, select the value in the next\n // animation frame\n window.requestAnimationFrame(() => {\n element.select?.();\n });\n } else {\n element.focus();\n }\n}\n\nfunction isInputEvent(event: Event): event is InputEvent {\n return event.type === 'input';\n}\n\ntype InputType = 'password' | 'text';\ntype AutoComplete = 'off' | 'one-time-code';\ntype KeyboardActionDetails =\n | {\n type: 'keydown';\n key: 'Backspace' | 'Delete' | 'Clear' | 'Char';\n metaKey: boolean;\n ctrlKey: boolean;\n }\n | { type: 'cut' }\n | { type: 'autocomplete-paste' };\n\ntype UpdateAction =\n | {\n type: 'SET_CHAR';\n char: string;\n index: number;\n event: React.KeyboardEvent | React.ChangeEvent;\n }\n | { type: 'CLEAR_CHAR'; index: number; reason: 'Backspace' | 'Delete' | 'Cut' }\n | { type: 'CLEAR'; reason: 'Reset' | 'Backspace' | 'Delete' | 'Clear' }\n | { type: 'PASTE'; value: string };\ntype Dispatcher = React.Dispatch<UpdateAction>;\ntype InputValidation = Record<\n InputValidationType,\n {\n type: InputValidationType;\n regexp: RegExp;\n pattern: string;\n inputMode: 'text' | 'numeric';\n } | null\n>;\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["'use client';\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n} from './one-time-password-field';\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n Root,\n Input,\n HiddenInput,\n} from './one-time-password-field';\n", "import * as Primitive from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { unstable_createCollection as createCollection } from '@radix-ui/react-collection';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useIsHydrated } from '@radix-ui/react-use-is-hydrated';\nimport * as React from 'react';\nimport { flushSync } from 'react-dom';\nimport type { Scope } from '@radix-ui/react-context';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { clamp } from '@radix-ui/number';\n\ntype InputValidationType = 'alpha' | 'numeric' | 'alphanumeric' | 'none';\n\nconst INPUT_VALIDATION_MAP = {\n numeric: {\n type: 'numeric',\n regexp: /[^\\d]/g,\n pattern: '\\\\d{1}',\n inputMode: 'numeric',\n },\n alpha: {\n type: 'alpha',\n regexp: /[^a-zA-Z]/g,\n pattern: '[a-zA-Z]{1}',\n inputMode: 'text',\n },\n alphanumeric: {\n type: 'alphanumeric',\n regexp: /[^a-zA-Z0-9]/g,\n pattern: '[a-zA-Z0-9]{1}',\n inputMode: 'text',\n },\n none: null,\n} satisfies InputValidation;\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldProvider\n * -----------------------------------------------------------------------------------------------*/\n\ntype RovingFocusGroupProps = RovingFocusGroup.RovingFocusGroupProps;\n\ninterface OneTimePasswordFieldContextValue {\n attemptSubmit: () => void;\n autoComplete: AutoComplete;\n autoFocus: boolean;\n disabled: boolean;\n dispatch: Dispatcher;\n form: string | undefined;\n hiddenInputRef: React.RefObject<HTMLInputElement | null>;\n isHydrated: boolean;\n name: string | undefined;\n orientation: Exclude<RovingFocusGroupProps['orientation'], undefined>;\n placeholder: string | undefined;\n readOnly: boolean;\n type: InputType;\n userActionRef: React.RefObject<KeyboardActionDetails | null>;\n validationType: InputValidationType;\n value: string[];\n sanitizeValue: (arg: string | string[]) => string[];\n}\n\nconst ONE_TIME_PASSWORD_FIELD_NAME = 'OneTimePasswordField';\nconst [Collection, { useCollection, createCollectionScope, useInitCollection }] =\n createCollection<HTMLInputElement>(ONE_TIME_PASSWORD_FIELD_NAME);\nconst [createOneTimePasswordFieldContext] = createContextScope(ONE_TIME_PASSWORD_FIELD_NAME, [\n createCollectionScope,\n createRovingFocusGroupScope,\n]);\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\n\nconst [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] =\n createOneTimePasswordFieldContext<OneTimePasswordFieldContextValue>(ONE_TIME_PASSWORD_FIELD_NAME);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordField\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldOwnProps {\n /**\n * Specifies what\u2014if any\u2014permission the user agent has to provide automated\n * assistance in filling out form field values, as well as guidance to the\n * browser as to the type of information expected in the field. Allows\n * `\"one-time-code\"` or `\"off\"`.\n *\n * @defaultValue `\"one-time-code\"`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete\n */\n autoComplete?: AutoComplete;\n /**\n * Whether or not the first fillable input should be focused on page-load.\n *\n * @defaultValue `false`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autofocus\n */\n autoFocus?: boolean;\n /**\n * Whether or not the component should attempt to automatically submit when\n * all fields are filled. If the field is associated with an HTML `form`\n * element, the form's `requestSubmit` method will be called.\n *\n * @defaultValue `false`\n */\n autoSubmit?: boolean;\n /**\n * The initial value of the uncontrolled field.\n */\n defaultValue?: string;\n /**\n * Indicates the horizontal directionality of the parent element's text.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir\n */\n dir?: RovingFocusGroupProps['dir'];\n /**\n * Whether or not the the field's input elements are disabled.\n */\n disabled?: boolean;\n /**\n * A string specifying the `form` element with which the input is associated.\n * This string's value, if present, must match the id of a `form` element in\n * the same document.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#form\n */\n form?: string | undefined;\n /**\n * A string specifying a name for the input control. This name is submitted\n * along with the control's value when the form data is submitted.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#name\n */\n name?: string | undefined;\n /**\n * When the `autoSubmit` prop is set to `true`, this callback will be fired\n * before attempting to submit the associated form. It will be called whether\n * or not a form is located, or if submission is not allowed.\n */\n onAutoSubmit?: (value: string) => void;\n /**\n * A callback fired when the field's value changes. When the component is\n * controlled, this should update the state passed to the `value` prop.\n */\n onValueChange?: (value: string) => void;\n /**\n * Indicates the vertical directionality of the input elements.\n *\n * @defaultValue `\"horizontal\"`\n */\n orientation?: RovingFocusGroupProps['orientation'];\n /**\n * Defines the text displayed in a form control when the control has no value.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/placeholder\n */\n placeholder?: string | undefined;\n /**\n * Whether or not the input elements can be updated by the user.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/readonly\n */\n readOnly?: boolean;\n /**\n * Function for custom sanitization when `validationType` is set to `\"none\"`.\n * This function will be called before updating values in response to user\n * interactions.\n */\n sanitizeValue?: (value: string) => string;\n /**\n * The input type of the field's input elements. Can be `\"password\"` or `\"text\"`.\n */\n type?: InputType;\n /**\n * Specifies the type of input validation to be used. Can be `\"alpha\"`,\n * `\"numeric\"`, `\"alphanumeric\"` or `\"none\"`.\n *\n * @defaultValue `\"numeric\"`\n */\n validationType?: InputValidationType;\n /**\n * The controlled value of the field.\n */\n value?: string;\n}\n\ntype ScopedProps<P> = P & { __scopeOneTimePasswordField?: Scope };\n\ninterface OneTimePasswordFieldProps\n extends\n OneTimePasswordFieldOwnProps,\n Omit<Primitive.PrimitivePropsWithRef<'div'>, keyof OneTimePasswordFieldOwnProps> {}\n\nconst OneTimePasswordField = /* @__PURE__ */ React.forwardRef<\n HTMLDivElement,\n OneTimePasswordFieldProps\n>(\n // blank line to reduce diff noise\n function OneTimePasswordFieldImpl(\n {\n __scopeOneTimePasswordField,\n defaultValue,\n value: valueProp,\n onValueChange,\n autoSubmit = false,\n children,\n onPaste,\n onAutoSubmit,\n disabled = false,\n readOnly = false,\n autoComplete = 'one-time-code',\n autoFocus = false,\n form,\n name,\n placeholder,\n type = 'text',\n // TODO: Change default to vertical when inputs use vertical writing mode\n orientation = 'horizontal',\n dir,\n validationType = 'numeric',\n sanitizeValue: sanitizeValueProp,\n ...domProps\n }: ScopedProps<OneTimePasswordFieldProps>,\n forwardedRef,\n ) {\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n const direction = useDirection(dir);\n const collectionState = useInitCollection();\n const [collection] = collectionState;\n\n const validation = INPUT_VALIDATION_MAP[validationType]\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : null;\n\n const sanitizeValue = React.useCallback(\n (value: string | string[]) => {\n if (Array.isArray(value)) {\n value = value.map(removeWhitespace).join('');\n } else {\n value = removeWhitespace(value);\n }\n\n if (validation) {\n // global regexp is stateful, so we clone it for each call\n const regexp = new RegExp(validation.regexp);\n value = value.replace(regexp, '');\n } else if (sanitizeValueProp) {\n value = sanitizeValueProp(value);\n }\n\n return value.split('');\n },\n [validation, sanitizeValueProp],\n );\n\n const controlledValue = React.useMemo(() => {\n return valueProp != null ? sanitizeValue(valueProp) : undefined;\n }, [valueProp, sanitizeValue]);\n\n const [value, setValue] = useControllableState({\n caller: 'OneTimePasswordField',\n prop: controlledValue,\n defaultProp: defaultValue != null ? sanitizeValue(defaultValue) : [],\n onChange: React.useCallback(\n (value: string[]) => onValueChange?.(value.join('')),\n [onValueChange],\n ),\n });\n\n // Use a ref so dispatch always reads the latest value without needing\n // value in its dependency array (which would change its identity every\n // keystroke and cause cascading effect re-runs).\n const latestValueRef = React.useRef(value);\n latestValueRef.current = value;\n\n // Update function *specifically* for event handlers.\n const dispatch = React.useCallback<Dispatcher>(\n (action) => {\n const value = latestValueRef.current;\n switch (action.type) {\n case 'SET_CHAR': {\n const { index, char } = action;\n const currentTarget = collection.at(index)?.element;\n if (value[index] === char) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n // empty values should be handled in the CLEAR_CHAR action\n if (char === '') {\n return;\n }\n\n if (validation) {\n const regexp = new RegExp(validation.regexp);\n const clean = char.replace(regexp, '');\n if (clean !== char) {\n // not valid; ignore\n return;\n }\n }\n\n // no more space\n if (value.length >= collection.size) {\n // replace current value; move to next input\n const newValue = [...value];\n newValue[index] = char;\n flushSync(() => setValue(newValue));\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n const newValue = [...value];\n newValue[index] = char;\n\n const lastElement = collection.at(-1)?.element;\n flushSync(() => setValue(newValue));\n if (currentTarget !== lastElement) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n } else {\n currentTarget?.select();\n }\n return;\n }\n\n case 'CLEAR_CHAR': {\n const { index, reason } = action;\n if (!value[index]) {\n return;\n }\n\n const newValue = value.filter((_, i) => i !== index);\n const currentTarget = collection.at(index)?.element;\n const previous = currentTarget && collection.from(currentTarget, -1)?.element;\n\n flushSync(() => setValue(newValue));\n if (reason === 'Backspace') {\n focusInput(previous);\n } else if (reason === 'Delete' || reason === 'Cut') {\n focusInput(currentTarget);\n }\n return;\n }\n\n case 'CLEAR': {\n if (value.length === 0) {\n return;\n }\n\n if (action.reason === 'Backspace' || action.reason === 'Delete') {\n flushSync(() => setValue([]));\n focusInput(collection.at(0)?.element);\n } else {\n setValue([]);\n }\n return;\n }\n\n case 'PASTE': {\n const { value: pastedValue } = action;\n const sanitizedValue = sanitizeValue(pastedValue);\n if (!sanitizedValue) {\n return;\n }\n\n const value = sanitizedValue.slice(0, collection.size);\n\n flushSync(() => setValue(value));\n focusInput(collection.at(value.length - 1)?.element);\n return;\n }\n }\n },\n [collection, sanitizeValue, setValue, validation],\n );\n\n // re-validate when the validation type changes\n const validationTypeRef = React.useRef(validation);\n React.useEffect(() => {\n if (!validation) {\n return;\n }\n\n if (validationTypeRef.current?.type !== validation.type) {\n validationTypeRef.current = validation;\n setValue(sanitizeValue(value.join('')));\n }\n }, [sanitizeValue, setValue, validation, value]);\n\n const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n\n const userActionRef = React.useRef<KeyboardActionDetails | null>(null);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, rootRef);\n\n const firstInput = collection.at(0)?.element;\n const locateForm = React.useCallback(() => {\n let formElement: HTMLFormElement | null | undefined;\n if (form) {\n const associatedElement = (rootRef.current?.ownerDocument ?? document).getElementById(form);\n if (isFormElement(associatedElement)) {\n formElement = associatedElement;\n }\n } else if (hiddenInputRef.current) {\n formElement = hiddenInputRef.current.form;\n } else if (firstInput) {\n formElement = firstInput.form;\n }\n\n return formElement ?? null;\n }, [form, firstInput]);\n\n const attemptSubmit = React.useCallback(() => {\n const formElement = locateForm();\n formElement?.requestSubmit();\n }, [locateForm]);\n\n React.useEffect(() => {\n const form = locateForm();\n if (form) {\n const reset = () => dispatch({ type: 'CLEAR', reason: 'Reset' });\n form.addEventListener('reset', reset);\n return () => form.removeEventListener('reset', reset);\n }\n }, [dispatch, locateForm]);\n\n const currentValue = value.join('');\n const valueRef = React.useRef(currentValue);\n const length = collection.size;\n React.useEffect(() => {\n const previousValue = valueRef.current;\n valueRef.current = currentValue;\n if (previousValue === currentValue) {\n return;\n }\n\n if (autoSubmit && value.every((char) => char !== '') && value.length === length) {\n onAutoSubmit?.(value.join(''));\n attemptSubmit();\n }\n }, [attemptSubmit, autoSubmit, currentValue, length, onAutoSubmit, value]);\n const isHydrated = useIsHydrated();\n\n return (\n <OneTimePasswordFieldContext\n scope={__scopeOneTimePasswordField}\n value={value}\n attemptSubmit={attemptSubmit}\n disabled={disabled}\n readOnly={readOnly}\n autoComplete={autoComplete}\n autoFocus={autoFocus}\n form={form}\n name={name}\n placeholder={placeholder}\n type={type}\n hiddenInputRef={hiddenInputRef}\n userActionRef={userActionRef}\n dispatch={dispatch}\n validationType={validationType}\n orientation={orientation}\n isHydrated={isHydrated}\n sanitizeValue={sanitizeValue}\n >\n <Collection.Provider scope={__scopeOneTimePasswordField} state={collectionState}>\n <Collection.Slot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n >\n <Primitive.Root.div\n {...domProps}\n role=\"group\"\n ref={composedRefs}\n onPaste={composeEventHandlers(\n onPaste,\n (event: React.ClipboardEvent<HTMLDivElement>) => {\n event.preventDefault();\n const pastedValue = event.clipboardData.getData('text/plain');\n dispatch({ type: 'PASTE', value: pastedValue });\n },\n )}\n >\n {children}\n </Primitive.Root.div>\n </RovingFocusGroup.Root>\n </Collection.Slot>\n </Collection.Provider>\n </OneTimePasswordFieldContext>\n );\n },\n);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldHiddenInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldHiddenInputProps extends Omit<\n React.ComponentProps<'input'>,\n | keyof 'value'\n | 'defaultValue'\n | 'type'\n | 'onChange'\n | 'readOnly'\n | 'disabled'\n | 'autoComplete'\n | 'autoFocus'\n> {}\n\nconst OneTimePasswordFieldHiddenInput = /* @__PURE__ */ React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldHiddenInputProps\n>(function OneTimePasswordFieldHiddenInput(\n { __scopeOneTimePasswordField, ...props }: ScopedProps<OneTimePasswordFieldHiddenInputProps>,\n forwardedRef,\n) {\n const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldHiddenInput',\n __scopeOneTimePasswordField,\n );\n const ref = useComposedRefs(hiddenInputRef, forwardedRef);\n return (\n <input\n ref={ref}\n name={name}\n value={value.join('').trim()}\n autoComplete=\"off\"\n autoFocus={false}\n autoCapitalize=\"off\"\n autoCorrect=\"off\"\n autoSave=\"off\"\n spellCheck={false}\n {...props}\n type=\"hidden\"\n readOnly\n />\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldInputProps extends Omit<\n Primitive.PrimitivePropsWithRef<'input'>,\n | 'value'\n | 'defaultValue'\n | 'disabled'\n | 'readOnly'\n | 'autoComplete'\n | 'autoFocus'\n | 'form'\n | 'name'\n | 'placeholder'\n | 'type'\n> {\n /**\n * Callback fired when the user input fails native HTML input validation.\n */\n onInvalidChange?: (character: string) => void;\n /**\n * User-provided index to determine the order of the inputs. This is useful if\n * you need certain index-based attributes to be set on the initial render,\n * often to prevent flickering after hydration.\n */\n index?: number;\n}\n\nconst OneTimePasswordFieldInput = /* @__PURE__ */ React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldInputProps\n>(function OneTimePasswordFieldInput(\n {\n __scopeOneTimePasswordField,\n onInvalidChange,\n index: indexProp,\n ...props\n }: ScopedProps<OneTimePasswordFieldInputProps>,\n forwardedRef,\n) {\n // TODO: warn if these values are passed\n const {\n value: _value,\n defaultValue: _defaultValue,\n disabled: _disabled,\n readOnly: _readOnly,\n autoComplete: _autoComplete,\n autoFocus: _autoFocus,\n form: _form,\n name: _name,\n placeholder: _placeholder,\n type: _type,\n ...domProps\n } = props as Primitive.PrimitivePropsWithRef<'input'>;\n\n const context = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldInput',\n __scopeOneTimePasswordField,\n );\n const { dispatch, userActionRef, validationType, isHydrated, disabled } = context;\n const collection = useCollection(__scopeOneTimePasswordField);\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n const [element, setElement] = React.useState<HTMLInputElement | null>(null);\n\n const index = indexProp ?? (element ? collection.indexOf(element) : -1);\n const canSetPlaceholder = indexProp != null || isHydrated;\n let placeholder: string | undefined;\n if (canSetPlaceholder && context.placeholder && context.value.length === 0) {\n // only set placeholder after hydration to prevent flickering when indices\n // are re-calculated\n placeholder = context.placeholder[index];\n }\n\n const composedInputRef = useComposedRefs(forwardedRef, inputRef, setElement);\n const char = context.value[index] ?? '';\n\n const keyboardActionTimeoutRef = React.useRef<number | null>(null);\n React.useEffect(() => {\n return () => {\n if (keyboardActionTimeoutRef.current) {\n window.clearTimeout(keyboardActionTimeoutRef.current);\n }\n };\n }, []);\n\n const totalValue = context.value.join('').trim();\n const lastSelectableIndex = clamp(totalValue.length, [0, collection.size - 1]);\n const isFocusable = index <= lastSelectableIndex;\n\n const validation =\n validationType in INPUT_VALIDATION_MAP\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : undefined;\n\n return (\n <Collection.ItemSlot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Item\n {...rovingFocusGroupScope}\n asChild\n focusable={!context.disabled && isFocusable}\n active={index === lastSelectableIndex}\n >\n {({ hasTabStop, isCurrentTabStop }) => {\n const supportsAutoComplete = hasTabStop ? isCurrentTabStop : index === 0;\n return (\n <Primitive.Root.input\n ref={composedInputRef}\n type={context.type}\n disabled={disabled}\n aria-label={`Character ${index + 1} of ${collection.size}`}\n autoComplete={supportsAutoComplete ? context.autoComplete : 'off'}\n data-1p-ignore={supportsAutoComplete ? undefined : 'true'}\n data-lpignore={supportsAutoComplete ? undefined : 'true'}\n data-protonpass-ignore={supportsAutoComplete ? undefined : 'true'}\n data-bwignore={supportsAutoComplete ? undefined : 'true'}\n inputMode={validation?.inputMode}\n maxLength={supportsAutoComplete ? collection.size : 1}\n pattern={validation?.pattern}\n readOnly={context.readOnly}\n value={char}\n placeholder={placeholder}\n data-radix-otp-input=\"\"\n data-radix-index={index}\n {...domProps}\n onFocus={composeEventHandlers(props.onFocus, (event) => {\n event.currentTarget.select();\n })}\n onCut={composeEventHandlers(props.onCut, (event) => {\n const currentValue = event.currentTarget.value;\n if (currentValue !== '') {\n // In this case the value will be cleared, but we don't want to\n // set it directly because the user may want to prevent default\n // behavior in the onChange handler. The userActionRef will\n // be set temporarily so the change handler can behave correctly\n // in response to the action.\n userActionRef.current = { type: 'cut' };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onInput={composeEventHandlers(props.onInput, (event) => {\n const value = event.currentTarget.value;\n if (value.length > 1) {\n // Password managers may try to insert the code into a single\n // input, in which case form validation will fail to prevent\n // additional input. Handle this the same as if a user were\n // pasting a value.\n event.preventDefault();\n userActionRef.current = { type: 'autocomplete-paste' };\n dispatch({ type: 'PASTE', value });\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onChange={composeEventHandlers(props.onChange, (event) => {\n const value = event.target.value;\n event.preventDefault();\n const action = userActionRef.current;\n userActionRef.current = null;\n\n if (action) {\n switch (action.type) {\n case 'cut':\n // TODO: do we want to assume the user wants to clear the\n // entire value here and copy the code to the clipboard instead\n // of just the value of the given input?\n dispatch({ type: 'CLEAR_CHAR', index, reason: 'Cut' });\n return;\n case 'autocomplete-paste':\n // the PASTE handler will already set the value and focus the final\n // input; we want to skip focusing the wrong element if the browser fires\n // onChange for the first input. This sometimes happens during autocomplete.\n return;\n case 'keydown': {\n if (action.key === 'Char') {\n // update resulting from a keydown event that set a value\n // directly. Ignore.\n return;\n }\n\n const isClearing =\n action.key === 'Backspace' && (action.metaKey || action.ctrlKey);\n if (action.key === 'Clear' || isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n dispatch({ type: 'CLEAR_CHAR', index, reason: action.key });\n }\n return;\n }\n default:\n action satisfies never;\n return;\n }\n }\n\n // Only update the value if it matches the input pattern\n if (event.target.validity.valid) {\n if (value === '') {\n let reason: 'Backspace' | 'Delete' | 'Cut' = 'Backspace';\n if (isInputEvent(event.nativeEvent)) {\n const inputType = event.nativeEvent.inputType;\n if (inputType === 'deleteContentBackward') {\n reason = 'Backspace';\n } else if (inputType === 'deleteByCut') {\n reason = 'Cut';\n }\n }\n dispatch({ type: 'CLEAR_CHAR', index, reason });\n } else {\n dispatch({ type: 'SET_CHAR', char: value, index, event });\n }\n } else {\n const element = event.target;\n onInvalidChange?.(element.value);\n requestAnimationFrame(() => {\n if (element.ownerDocument.activeElement === element) {\n element.select();\n }\n });\n }\n })}\n onKeyDown={composeEventHandlers(props.onKeyDown, (event) => {\n switch (event.key) {\n case 'Clear':\n case 'Delete':\n case 'Backspace': {\n const currentValue = event.currentTarget.value;\n // if current value is empty, no change event will fire\n if (currentValue === '') {\n // if the user presses delete when there is no value, noop\n if (event.key === 'Delete') return;\n\n const isClearing = event.key === 'Clear' || event.metaKey || event.ctrlKey;\n if (isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n const element = event.currentTarget;\n requestAnimationFrame(() => {\n focusInput(collection.from(element, -1)?.element);\n });\n }\n } else {\n // In this case the value will be cleared, but we don't want\n // to set it directly because the user may want to prevent\n // default behavior in the onChange handler. The userActionRef\n // will is set temporarily so the change handler can behave\n // correctly in response to the key vs. clearing the value by\n // setting state externally.\n userActionRef.current = {\n type: 'keydown',\n key: event.key,\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n\n return;\n }\n case 'Enter': {\n event.preventDefault();\n context.attemptSubmit();\n return;\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (context.orientation === 'horizontal') {\n // in horizontal orientation, the up/down will de-select the\n // input instead of moving focus\n event.preventDefault();\n }\n return;\n }\n // TODO: Handle left/right arrow keys in vertical writing mode\n default: {\n if (event.currentTarget.value === event.key) {\n // if current value is same as the key press, no change event\n // will fire. Focus the next input.\n const element = event.currentTarget;\n event.preventDefault();\n focusInput(collection.from(element, 1)?.element);\n return;\n } else if (\n // input already has a value, but...\n event.currentTarget.value &&\n // the value is not selected\n !(\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd != null &&\n event.currentTarget.selectionEnd > 0\n )\n ) {\n const attemptedValue = event.key;\n if (event.key.length > 1 || event.key === ' ') {\n // not a character; do nothing\n return;\n } else {\n // user is attempting to enter a character, but the input\n // will not update by default since it's limited to a single\n // character.\n const nextInput = collection.from(event.currentTarget, 1)?.element;\n const lastInput = collection.at(-1)?.element;\n if (nextInput !== lastInput && event.currentTarget !== lastInput) {\n // if selection is before the value, set the value of the\n // current input. Otherwise set the value of the next\n // input.\n if (event.currentTarget.selectionStart === 0) {\n dispatch({ type: 'SET_CHAR', char: attemptedValue, index, event });\n } else {\n dispatch({\n type: 'SET_CHAR',\n char: attemptedValue,\n index: index + 1,\n event,\n });\n }\n\n userActionRef.current = {\n type: 'keydown',\n key: 'Char',\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n }\n }\n }\n }\n })}\n onPointerDown={composeEventHandlers(props.onPointerDown, (event) => {\n event.preventDefault();\n const indexToFocus = Math.min(index, lastSelectableIndex);\n const element = collection.at(indexToFocus)?.element;\n focusInput(element);\n })}\n />\n );\n }}\n </RovingFocusGroup.Item>\n </Collection.ItemSlot>\n );\n});\n\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n OneTimePasswordField as Root,\n OneTimePasswordFieldInput as Input,\n OneTimePasswordFieldHiddenInput as HiddenInput,\n};\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction isFormElement(element: Element | null | undefined): element is HTMLFormElement {\n return element?.tagName === 'FORM';\n}\n\nfunction removeWhitespace(value: string) {\n return value.replace(/\\s/g, '');\n}\n\nfunction focusInput(element: HTMLInputElement | null | undefined) {\n if (!element) return;\n if (element.ownerDocument.activeElement === element) {\n // if the element is already focused, select the value in the next\n // animation frame\n window.requestAnimationFrame(() => {\n element.select?.();\n });\n } else {\n element.focus();\n }\n}\n\nfunction isInputEvent(event: Event): event is InputEvent {\n return event.type === 'input';\n}\n\ntype InputType = 'password' | 'text';\ntype AutoComplete = 'off' | 'one-time-code';\ntype KeyboardActionDetails =\n | {\n type: 'keydown';\n key: 'Backspace' | 'Delete' | 'Clear' | 'Char';\n metaKey: boolean;\n ctrlKey: boolean;\n }\n | { type: 'cut' }\n | { type: 'autocomplete-paste' };\n\ntype UpdateAction =\n | {\n type: 'SET_CHAR';\n char: string;\n index: number;\n event: React.KeyboardEvent | React.ChangeEvent;\n }\n | { type: 'CLEAR_CHAR'; index: number; reason: 'Backspace' | 'Delete' | 'Cut' }\n | { type: 'CLEAR'; reason: 'Reset' | 'Backspace' | 'Delete' | 'Clear' }\n | { type: 'PASTE'; value: string };\ntype Dispatcher = React.Dispatch<UpdateAction>;\ntype InputValidation = Record<\n InputValidationType,\n {\n type: InputValidationType;\n regexp: RegExp;\n pattern: string;\n inputMode: 'text' | 'numeric';\n } | null\n>;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gBAA2B;AAC3B,gCAAgC;AAChC,0CAAqC;AACrC,uBAAqC;AACrC,8BAA8D;AAC9D,uBAAkC;AAClC,gCAA4C;AAC5C,mCAA8B;AAC9B,YAAuB;AACvB,uBAA0B;AAE1B,2BAAmC;AACnC,6BAA6B;AAC7B,oBAAsB;AAgdR;AA5cd,IAAM,uBAAuB;AAAA,EAC3B,SAAS;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,OAAO;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,MAAM;AACR;AA4BA,IAAM,+BAA+B;AACrC,IAAM,CAAC,YAAY,EAAE,eAAe,uBAAuB,kBAAkB,CAAC,QAC5E,wBAAAA,2BAAmC,4BAA4B;AACjE,IAAM,CAAC,iCAAiC,QAAI,yCAAmB,8BAA8B;AAAA,EAC3F;AAAA,EACA;AACF,CAAC;AACD,IAAM,+BAA2B,uDAA4B;AAE7D,IAAM,CAAC,6BAA6B,8BAA8B,IAChE,kCAAoE,4BAA4B;AAwHlG,IAAM,uBAAuC,gBAAM;AAAA;AAAA,EAKjD,gCAAS,yBACP;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX,eAAe;AAAA,IACf,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA;AAAA,IAEP,cAAc;AAAA,IACd;AAAA,IACA,iBAAiB;AAAA,IACjB,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,cACA;AACA,UAAM,wBAAwB,yBAAyB,2BAA2B;AAClF,UAAM,gBAAY,qCAAa,GAAG;AAClC,UAAM,kBAAkB,kBAAkB;AAC1C,UAAM,CAAC,UAAU,IAAI;AAErB,UAAM,aAAa,qBAAqB,cAAc,IAClD,qBAAqB,cAAuC,IAC5D;AAEJ,UAAM,gBAAsB;AAAA,MAC1B,CAACC,WAA6B;AAC5B,YAAI,MAAM,QAAQA,MAAK,GAAG;AACxB,UAAAA,SAAQA,OAAM,IAAI,gBAAgB,EAAE,KAAK,EAAE;AAAA,QAC7C,OAAO;AACL,UAAAA,SAAQ,iBAAiBA,MAAK;AAAA,QAChC;AAEA,YAAI,YAAY;AAEd,gBAAM,SAAS,IAAI,OAAO,WAAW,MAAM;AAC3C,UAAAA,SAAQA,OAAM,QAAQ,QAAQ,EAAE;AAAA,QAClC,WAAW,mBAAmB;AAC5B,UAAAA,SAAQ,kBAAkBA,MAAK;AAAA,QACjC;AAEA,eAAOA,OAAM,MAAM,EAAE;AAAA,MACvB;AAAA,MACA,CAAC,YAAY,iBAAiB;AAAA,IAChC;AAEA,UAAM,kBAAwB,cAAQ,MAAM;AAC1C,aAAO,aAAa,OAAO,cAAc,SAAS,IAAI;AAAA,IACxD,GAAG,CAAC,WAAW,aAAa,CAAC;AAE7B,UAAM,CAAC,OAAO,QAAQ,QAAI,0DAAqB;AAAA,MAC7C,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,aAAa,gBAAgB,OAAO,cAAc,YAAY,IAAI,CAAC;AAAA,MACnE,UAAgB;AAAA,QACd,CAACA,WAAoB,gBAAgBA,OAAM,KAAK,EAAE,CAAC;AAAA,QACnD,CAAC,aAAa;AAAA,MAChB;AAAA,IACF,CAAC;AAKD,UAAM,iBAAuB,aAAO,KAAK;AACzC,mBAAe,UAAU;AAGzB,UAAM,WAAiB;AAAA,MACrB,CAAC,WAAW;AACV,cAAMA,SAAQ,eAAe;AAC7B,gBAAQ,OAAO,MAAM;AAAA,UACnB,KAAK,YAAY;AACf,kBAAM,EAAE,OAAO,KAAK,IAAI;AACxB,kBAAM,gBAAgB,WAAW,GAAG,KAAK,GAAG;AAC5C,gBAAIA,OAAM,KAAK,MAAM,MAAM;AACzB,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AACf;AAAA,YACF;AAGA,gBAAI,SAAS,IAAI;AACf;AAAA,YACF;AAEA,gBAAI,YAAY;AACd,oBAAM,SAAS,IAAI,OAAO,WAAW,MAAM;AAC3C,oBAAM,QAAQ,KAAK,QAAQ,QAAQ,EAAE;AACrC,kBAAI,UAAU,MAAM;AAElB;AAAA,cACF;AAAA,YACF;AAGA,gBAAIA,OAAM,UAAU,WAAW,MAAM;AAEnC,oBAAMC,YAAW,CAAC,GAAGD,MAAK;AAC1B,cAAAC,UAAS,KAAK,IAAI;AAClB,8CAAU,MAAM,SAASA,SAAQ,CAAC;AAClC,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AACf;AAAA,YACF;AAEA,kBAAM,WAAW,CAAC,GAAGD,MAAK;AAC1B,qBAAS,KAAK,IAAI;AAElB,kBAAM,cAAc,WAAW,GAAG,EAAE,GAAG;AACvC,4CAAU,MAAM,SAAS,QAAQ,CAAC;AAClC,gBAAI,kBAAkB,aAAa;AACjC,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AAAA,YACjB,OAAO;AACL,6BAAe,OAAO;AAAA,YACxB;AACA;AAAA,UACF;AAAA,UAEA,KAAK,cAAc;AACjB,kBAAM,EAAE,OAAO,OAAO,IAAI;AAC1B,gBAAI,CAACA,OAAM,KAAK,GAAG;AACjB;AAAA,YACF;AAEA,kBAAM,WAAWA,OAAM,OAAO,CAAC,GAAG,MAAM,MAAM,KAAK;AACnD,kBAAM,gBAAgB,WAAW,GAAG,KAAK,GAAG;AAC5C,kBAAM,WAAW,iBAAiB,WAAW,KAAK,eAAe,EAAE,GAAG;AAEtE,4CAAU,MAAM,SAAS,QAAQ,CAAC;AAClC,gBAAI,WAAW,aAAa;AAC1B,yBAAW,QAAQ;AAAA,YACrB,WAAW,WAAW,YAAY,WAAW,OAAO;AAClD,yBAAW,aAAa;AAAA,YAC1B;AACA;AAAA,UACF;AAAA,UAEA,KAAK,SAAS;AACZ,gBAAIA,OAAM,WAAW,GAAG;AACtB;AAAA,YACF;AAEA,gBAAI,OAAO,WAAW,eAAe,OAAO,WAAW,UAAU;AAC/D,8CAAU,MAAM,SAAS,CAAC,CAAC,CAAC;AAC5B,yBAAW,WAAW,GAAG,CAAC,GAAG,OAAO;AAAA,YACtC,OAAO;AACL,uBAAS,CAAC,CAAC;AAAA,YACb;AACA;AAAA,UACF;AAAA,UAEA,KAAK,SAAS;AACZ,kBAAM,EAAE,OAAO,YAAY,IAAI;AAC/B,kBAAM,iBAAiB,cAAc,WAAW;AAChD,gBAAI,CAAC,gBAAgB;AACnB;AAAA,YACF;AAEA,kBAAMA,SAAQ,eAAe,MAAM,GAAG,WAAW,IAAI;AAErD,4CAAU,MAAM,SAASA,MAAK,CAAC;AAC/B,uBAAW,WAAW,GAAGA,OAAM,SAAS,CAAC,GAAG,OAAO;AACnD;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,MACA,CAAC,YAAY,eAAe,UAAU,UAAU;AAAA,IAClD;AAGA,UAAM,oBAA0B,aAAO,UAAU;AACjD,IAAM,gBAAU,MAAM;AACpB,UAAI,CAAC,YAAY;AACf;AAAA,MACF;AAEA,UAAI,kBAAkB,SAAS,SAAS,WAAW,MAAM;AACvD,0BAAkB,UAAU;AAC5B,iBAAS,cAAc,MAAM,KAAK,EAAE,CAAC,CAAC;AAAA,MACxC;AAAA,IACF,GAAG,CAAC,eAAe,UAAU,YAAY,KAAK,CAAC;AAE/C,UAAM,iBAAuB,aAAyB,IAAI;AAE1D,UAAM,gBAAsB,aAAqC,IAAI;AACrE,UAAM,UAAgB,aAA8B,IAAI;AACxD,UAAM,mBAAe,2CAAgB,cAAc,OAAO;AAE1D,UAAM,aAAa,WAAW,GAAG,CAAC,GAAG;AACrC,UAAM,aAAmB,kBAAY,MAAM;AACzC,UAAI;AACJ,UAAI,MAAM;AACR,cAAM,qBAAqB,QAAQ,SAAS,iBAAiB,UAAU,eAAe,IAAI;AAC1F,YAAI,cAAc,iBAAiB,GAAG;AACpC,wBAAc;AAAA,QAChB;AAAA,MACF,WAAW,eAAe,SAAS;AACjC,sBAAc,eAAe,QAAQ;AAAA,MACvC,WAAW,YAAY;AACrB,sBAAc,WAAW;AAAA,MAC3B;AAEA,aAAO,eAAe;AAAA,IACxB,GAAG,CAAC,MAAM,UAAU,CAAC;AAErB,UAAM,gBAAsB,kBAAY,MAAM;AAC5C,YAAM,cAAc,WAAW;AAC/B,mBAAa,cAAc;AAAA,IAC7B,GAAG,CAAC,UAAU,CAAC;AAEf,IAAM,gBAAU,MAAM;AACpB,YAAME,QAAO,WAAW;AACxB,UAAIA,OAAM;AACR,cAAM,QAAQ,6BAAM,SAAS,EAAE,MAAM,SAAS,QAAQ,QAAQ,CAAC,GAAjD;AACd,QAAAA,MAAK,iBAAiB,SAAS,KAAK;AACpC,eAAO,MAAMA,MAAK,oBAAoB,SAAS,KAAK;AAAA,MACtD;AAAA,IACF,GAAG,CAAC,UAAU,UAAU,CAAC;AAEzB,UAAM,eAAe,MAAM,KAAK,EAAE;AAClC,UAAM,WAAiB,aAAO,YAAY;AAC1C,UAAM,SAAS,WAAW;AAC1B,IAAM,gBAAU,MAAM;AACpB,YAAM,gBAAgB,SAAS;AAC/B,eAAS,UAAU;AACnB,UAAI,kBAAkB,cAAc;AAClC;AAAA,MACF;AAEA,UAAI,cAAc,MAAM,MAAM,CAAC,SAAS,SAAS,EAAE,KAAK,MAAM,WAAW,QAAQ;AAC/E,uBAAe,MAAM,KAAK,EAAE,CAAC;AAC7B,sBAAc;AAAA,MAChB;AAAA,IACF,GAAG,CAAC,eAAe,YAAY,cAAc,QAAQ,cAAc,KAAK,CAAC;AACzE,UAAM,iBAAa,4CAAc;AAEjC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA,sDAAC,WAAW,UAAX,EAAoB,OAAO,6BAA6B,OAAO,iBAC9D,sDAAC,WAAW,MAAX,EAAgB,OAAO,6BACtB;AAAA,UAAkB;AAAA,UAAjB;AAAA,YACC,SAAO;AAAA,YACN,GAAG;AAAA,YACJ;AAAA,YACA,KAAK;AAAA,YAEL;AAAA,cAAW,eAAK;AAAA,cAAf;AAAA,gBACE,GAAG;AAAA,gBACJ,MAAK;AAAA,gBACL,KAAK;AAAA,gBACL,aAAS;AAAA,kBACP;AAAA,kBACA,CAAC,UAAgD;AAC/C,0BAAM,eAAe;AACrB,0BAAM,cAAc,MAAM,cAAc,QAAQ,YAAY;AAC5D,6BAAS,EAAE,MAAM,SAAS,OAAO,YAAY,CAAC;AAAA,kBAChD;AAAA,gBACF;AAAA,gBAEC;AAAA;AAAA,YACH;AAAA;AAAA,QACF,GACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ,GAzSA;AA0SF;AAkBA,IAAM,kCAAkD,gBAAM,iBAG5D,gCAASC,iCACT,EAAE,6BAA6B,GAAG,MAAM,GACxC,cACA;AACA,QAAM,EAAE,OAAO,gBAAgB,KAAK,IAAI;AAAA,IACtC;AAAA,IACA;AAAA,EACF;AACA,QAAM,UAAM,2CAAgB,gBAAgB,YAAY;AACxD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,OAAO,MAAM,KAAK,EAAE,EAAE,KAAK;AAAA,MAC3B,cAAa;AAAA,MACb,WAAW;AAAA,MACX,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,UAAS;AAAA,MACT,YAAY;AAAA,MACX,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,UAAQ;AAAA;AAAA,EACV;AAEJ,GAzBE,kCAyBD;AA+BD,IAAM,4BAA4C,gBAAM,iBAGtD,gCAASC,2BACT;AAAA,EACE;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GACA,cACA;AAEA,QAAM;AAAA,IACJ,OAAO;AAAA,IACP,cAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,cAAc;AAAA,IACd,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,MAAM;AAAA,IACN,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,EACF;AACA,QAAM,EAAE,UAAU,eAAe,gBAAgB,YAAY,SAAS,IAAI;AAC1E,QAAM,aAAa,cAAc,2BAA2B;AAC5D,QAAM,wBAAwB,yBAAyB,2BAA2B;AAElF,QAAM,WAAiB,aAAyB,IAAI;AACpD,QAAM,CAAC,SAAS,UAAU,IAAU,eAAkC,IAAI;AAE1E,QAAM,QAAQ,cAAc,UAAU,WAAW,QAAQ,OAAO,IAAI;AACpE,QAAM,oBAAoB,aAAa,QAAQ;AAC/C,MAAI;AACJ,MAAI,qBAAqB,QAAQ,eAAe,QAAQ,MAAM,WAAW,GAAG;AAG1E,kBAAc,QAAQ,YAAY,KAAK;AAAA,EACzC;AAEA,QAAM,uBAAmB,2CAAgB,cAAc,UAAU,UAAU;AAC3E,QAAM,OAAO,QAAQ,MAAM,KAAK,KAAK;AAErC,QAAM,2BAAiC,aAAsB,IAAI;AACjE,EAAM,gBAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,yBAAyB,SAAS;AACpC,eAAO,aAAa,yBAAyB,OAAO;AAAA,MACtD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,aAAa,QAAQ,MAAM,KAAK,EAAE,EAAE,KAAK;AAC/C,QAAM,0BAAsB,qBAAM,WAAW,QAAQ,CAAC,GAAG,WAAW,OAAO,CAAC,CAAC;AAC7E,QAAM,cAAc,SAAS;AAE7B,QAAM,aACJ,kBAAkB,uBACd,qBAAqB,cAAuC,IAC5D;AAEN,SACE,4CAAC,WAAW,UAAX,EAAoB,OAAO,6BAC1B;AAAA,IAAkB;AAAA,IAAjB;AAAA,MACE,GAAG;AAAA,MACJ,SAAO;AAAA,MACP,WAAW,CAAC,QAAQ,YAAY;AAAA,MAChC,QAAQ,UAAU;AAAA,MAEjB,WAAC,EAAE,YAAY,iBAAiB,MAAM;AACrC,cAAM,uBAAuB,aAAa,mBAAmB,UAAU;AACvE,eACE;AAAA,UAAW,eAAK;AAAA,UAAf;AAAA,YACC,KAAK;AAAA,YACL,MAAM,QAAQ;AAAA,YACd;AAAA,YACA,cAAY,aAAa,QAAQ,CAAC,OAAO,WAAW,IAAI;AAAA,YACxD,cAAc,uBAAuB,QAAQ,eAAe;AAAA,YAC5D,kBAAgB,uBAAuB,SAAY;AAAA,YACnD,iBAAe,uBAAuB,SAAY;AAAA,YAClD,0BAAwB,uBAAuB,SAAY;AAAA,YAC3D,iBAAe,uBAAuB,SAAY;AAAA,YAClD,WAAW,YAAY;AAAA,YACvB,WAAW,uBAAuB,WAAW,OAAO;AAAA,YACpD,SAAS,YAAY;AAAA,YACrB,UAAU,QAAQ;AAAA,YAClB,OAAO;AAAA,YACP;AAAA,YACA,wBAAqB;AAAA,YACrB,oBAAkB;AAAA,YACjB,GAAG;AAAA,YACJ,aAAS,uCAAqB,MAAM,SAAS,CAAC,UAAU;AACtD,oBAAM,cAAc,OAAO;AAAA,YAC7B,CAAC;AAAA,YACD,WAAO,uCAAqB,MAAM,OAAO,CAAC,UAAU;AAClD,oBAAM,eAAe,MAAM,cAAc;AACzC,kBAAI,iBAAiB,IAAI;AAMvB,8BAAc,UAAU,EAAE,MAAM,MAAM;AAGtC,yCAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,gCAAc,UAAU;AAAA,gBAC1B,GAAG,EAAE;AAAA,cACP;AAAA,YACF,CAAC;AAAA,YACD,aAAS,uCAAqB,MAAM,SAAS,CAAC,UAAU;AACtD,oBAAM,QAAQ,MAAM,cAAc;AAClC,kBAAI,MAAM,SAAS,GAAG;AAKpB,sBAAM,eAAe;AACrB,8BAAc,UAAU,EAAE,MAAM,qBAAqB;AACrD,yBAAS,EAAE,MAAM,SAAS,MAAM,CAAC;AACjC,yCAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,gCAAc,UAAU;AAAA,gBAC1B,GAAG,EAAE;AAAA,cACP;AAAA,YACF,CAAC;AAAA,YACD,cAAU,uCAAqB,MAAM,UAAU,CAAC,UAAU;AACxD,oBAAM,QAAQ,MAAM,OAAO;AAC3B,oBAAM,eAAe;AACrB,oBAAM,SAAS,cAAc;AAC7B,4BAAc,UAAU;AAExB,kBAAI,QAAQ;AACV,wBAAQ,OAAO,MAAM;AAAA,kBACnB,KAAK;AAIH,6BAAS,EAAE,MAAM,cAAc,OAAO,QAAQ,MAAM,CAAC;AACrD;AAAA,kBACF,KAAK;AAIH;AAAA,kBACF,KAAK,WAAW;AACd,wBAAI,OAAO,QAAQ,QAAQ;AAGzB;AAAA,oBACF;AAEA,0BAAM,aACJ,OAAO,QAAQ,gBAAgB,OAAO,WAAW,OAAO;AAC1D,wBAAI,OAAO,QAAQ,WAAW,YAAY;AACxC,+BAAS,EAAE,MAAM,SAAS,QAAQ,YAAY,CAAC;AAAA,oBACjD,OAAO;AACL,+BAAS,EAAE,MAAM,cAAc,OAAO,QAAQ,OAAO,IAAI,CAAC;AAAA,oBAC5D;AACA;AAAA,kBACF;AAAA,kBACA;AACE;AACA;AAAA,gBACJ;AAAA,cACF;AAGA,kBAAI,MAAM,OAAO,SAAS,OAAO;AAC/B,oBAAI,UAAU,IAAI;AAChB,sBAAI,SAAyC;AAC7C,sBAAI,aAAa,MAAM,WAAW,GAAG;AACnC,0BAAM,YAAY,MAAM,YAAY;AACpC,wBAAI,cAAc,yBAAyB;AACzC,+BAAS;AAAA,oBACX,WAAW,cAAc,eAAe;AACtC,+BAAS;AAAA,oBACX;AAAA,kBACF;AACA,2BAAS,EAAE,MAAM,cAAc,OAAO,OAAO,CAAC;AAAA,gBAChD,OAAO;AACL,2BAAS,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,MAAM,CAAC;AAAA,gBAC1D;AAAA,cACF,OAAO;AACL,sBAAMC,WAAU,MAAM;AACtB,kCAAkBA,SAAQ,KAAK;AAC/B,sCAAsB,MAAM;AAC1B,sBAAIA,SAAQ,cAAc,kBAAkBA,UAAS;AACnD,oBAAAA,SAAQ,OAAO;AAAA,kBACjB;AAAA,gBACF,CAAC;AAAA,cACH;AAAA,YACF,CAAC;AAAA,YACD,eAAW,uCAAqB,MAAM,WAAW,CAAC,UAAU;AAC1D,sBAAQ,MAAM,KAAK;AAAA,gBACjB,KAAK;AAAA,gBACL,KAAK;AAAA,gBACL,KAAK,aAAa;AAChB,wBAAM,eAAe,MAAM,cAAc;AAEzC,sBAAI,iBAAiB,IAAI;AAEvB,wBAAI,MAAM,QAAQ,SAAU;AAE5B,0BAAM,aAAa,MAAM,QAAQ,WAAW,MAAM,WAAW,MAAM;AACnE,wBAAI,YAAY;AACd,+BAAS,EAAE,MAAM,SAAS,QAAQ,YAAY,CAAC;AAAA,oBACjD,OAAO;AACL,4BAAMA,WAAU,MAAM;AACtB,4CAAsB,MAAM;AAC1B,mCAAW,WAAW,KAAKA,UAAS,EAAE,GAAG,OAAO;AAAA,sBAClD,CAAC;AAAA,oBACH;AAAA,kBACF,OAAO;AAOL,kCAAc,UAAU;AAAA,sBACtB,MAAM;AAAA,sBACN,KAAK,MAAM;AAAA,sBACX,SAAS,MAAM;AAAA,sBACf,SAAS,MAAM;AAAA,oBACjB;AAGA,6CAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,oCAAc,UAAU;AAAA,oBAC1B,GAAG,EAAE;AAAA,kBACP;AAEA;AAAA,gBACF;AAAA,gBACA,KAAK,SAAS;AACZ,wBAAM,eAAe;AACrB,0BAAQ,cAAc;AACtB;AAAA,gBACF;AAAA,gBACA,KAAK;AAAA,gBACL,KAAK,WAAW;AACd,sBAAI,QAAQ,gBAAgB,cAAc;AAGxC,0BAAM,eAAe;AAAA,kBACvB;AACA;AAAA,gBACF;AAAA;AAAA,gBAEA,SAAS;AACP,sBAAI,MAAM,cAAc,UAAU,MAAM,KAAK;AAG3C,0BAAMA,WAAU,MAAM;AACtB,0BAAM,eAAe;AACrB,+BAAW,WAAW,KAAKA,UAAS,CAAC,GAAG,OAAO;AAC/C;AAAA,kBACF;AAAA;AAAA,oBAEE,MAAM,cAAc;AAAA,oBAEpB,EACE,MAAM,cAAc,mBAAmB,KACvC,MAAM,cAAc,gBAAgB,QACpC,MAAM,cAAc,eAAe;AAAA,oBAErC;AACA,0BAAM,iBAAiB,MAAM;AAC7B,wBAAI,MAAM,IAAI,SAAS,KAAK,MAAM,QAAQ,KAAK;AAE7C;AAAA,oBACF,OAAO;AAIL,4BAAM,YAAY,WAAW,KAAK,MAAM,eAAe,CAAC,GAAG;AAC3D,4BAAM,YAAY,WAAW,GAAG,EAAE,GAAG;AACrC,0BAAI,cAAc,aAAa,MAAM,kBAAkB,WAAW;AAIhE,4BAAI,MAAM,cAAc,mBAAmB,GAAG;AAC5C,mCAAS,EAAE,MAAM,YAAY,MAAM,gBAAgB,OAAO,MAAM,CAAC;AAAA,wBACnE,OAAO;AACL,mCAAS;AAAA,4BACP,MAAM;AAAA,4BACN,MAAM;AAAA,4BACN,OAAO,QAAQ;AAAA,4BACf;AAAA,0BACF,CAAC;AAAA,wBACH;AAEA,sCAAc,UAAU;AAAA,0BACtB,MAAM;AAAA,0BACN,KAAK;AAAA,0BACL,SAAS,MAAM;AAAA,0BACf,SAAS,MAAM;AAAA,wBACjB;AACA,iDAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,wCAAc,UAAU;AAAA,wBAC1B,GAAG,EAAE;AAAA,sBACP;AAAA,oBACF;AAAA,kBACF;AAAA,gBACF;AAAA,cACF;AAAA,YACF,CAAC;AAAA,YACD,mBAAe,uCAAqB,MAAM,eAAe,CAAC,UAAU;AAClE,oBAAM,eAAe;AACrB,oBAAM,eAAe,KAAK,IAAI,OAAO,mBAAmB;AACxD,oBAAMA,WAAU,WAAW,GAAG,YAAY,GAAG;AAC7C,yBAAWA,QAAO;AAAA,YACpB,CAAC;AAAA;AAAA,QACH;AAAA,MAEJ;AAAA;AAAA,EACF,GACF;AAEJ,GAnUE,4BAmUD;AAoBD,SAAS,cAAc,SAAiE;AACtF,SAAO,SAAS,YAAY;AAC9B;AAFS;AAIT,SAAS,iBAAiB,OAAe;AACvC,SAAO,MAAM,QAAQ,OAAO,EAAE;AAChC;AAFS;AAIT,SAAS,WAAW,SAA8C;AAChE,MAAI,CAAC,QAAS;AACd,MAAI,QAAQ,cAAc,kBAAkB,SAAS;AAGnD,WAAO,sBAAsB,MAAM;AACjC,cAAQ,SAAS;AAAA,IACnB,CAAC;AAAA,EACH,OAAO;AACL,YAAQ,MAAM;AAAA,EAChB;AACF;AAXS;AAaT,SAAS,aAAa,OAAmC;AACvD,SAAO,MAAM,SAAS;AACxB;AAFS;",
|
|
6
6
|
"names": ["createCollection", "value", "newValue", "form", "OneTimePasswordFieldHiddenInput", "OneTimePasswordFieldInput", "element"]
|
|
7
7
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
2
4
|
|
|
3
5
|
// src/one-time-password-field.tsx
|
|
4
6
|
import * as Primitive from "@radix-ui/react-primitive";
|
|
@@ -44,8 +46,9 @@ var [createOneTimePasswordFieldContext] = createContextScope(ONE_TIME_PASSWORD_F
|
|
|
44
46
|
]);
|
|
45
47
|
var useRovingFocusGroupScope = createRovingFocusGroupScope();
|
|
46
48
|
var [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] = createOneTimePasswordFieldContext(ONE_TIME_PASSWORD_FIELD_NAME);
|
|
47
|
-
var OneTimePasswordField = React.forwardRef(
|
|
48
|
-
|
|
49
|
+
var OneTimePasswordField = /* @__PURE__ */ React.forwardRef(
|
|
50
|
+
// blank line to reduce diff noise
|
|
51
|
+
/* @__PURE__ */ __name(function OneTimePasswordFieldImpl({
|
|
49
52
|
__scopeOneTimePasswordField,
|
|
50
53
|
defaultValue,
|
|
51
54
|
value: valueProp,
|
|
@@ -226,7 +229,7 @@ var OneTimePasswordField = React.forwardRef(
|
|
|
226
229
|
React.useEffect(() => {
|
|
227
230
|
const form2 = locateForm();
|
|
228
231
|
if (form2) {
|
|
229
|
-
const reset = () => dispatch({ type: "CLEAR", reason: "Reset" });
|
|
232
|
+
const reset = /* @__PURE__ */ __name(() => dispatch({ type: "CLEAR", reason: "Reset" }), "reset");
|
|
230
233
|
form2.addEventListener("reset", reset);
|
|
231
234
|
return () => form2.removeEventListener("reset", reset);
|
|
232
235
|
}
|
|
@@ -295,9 +298,9 @@ var OneTimePasswordField = React.forwardRef(
|
|
|
295
298
|
) }) })
|
|
296
299
|
}
|
|
297
300
|
);
|
|
298
|
-
}
|
|
301
|
+
}, "OneTimePasswordFieldImpl")
|
|
299
302
|
);
|
|
300
|
-
var OneTimePasswordFieldHiddenInput = React.forwardRef(function OneTimePasswordFieldHiddenInput2({ __scopeOneTimePasswordField, ...props }, forwardedRef) {
|
|
303
|
+
var OneTimePasswordFieldHiddenInput = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function OneTimePasswordFieldHiddenInput2({ __scopeOneTimePasswordField, ...props }, forwardedRef) {
|
|
301
304
|
const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(
|
|
302
305
|
"OneTimePasswordFieldHiddenInput",
|
|
303
306
|
__scopeOneTimePasswordField
|
|
@@ -320,8 +323,8 @@ var OneTimePasswordFieldHiddenInput = React.forwardRef(function OneTimePasswordF
|
|
|
320
323
|
readOnly: true
|
|
321
324
|
}
|
|
322
325
|
);
|
|
323
|
-
});
|
|
324
|
-
var OneTimePasswordFieldInput = React.forwardRef(function OneTimePasswordFieldInput2({
|
|
326
|
+
}, "OneTimePasswordFieldHiddenInput"));
|
|
327
|
+
var OneTimePasswordFieldInput = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function OneTimePasswordFieldInput2({
|
|
325
328
|
__scopeOneTimePasswordField,
|
|
326
329
|
onInvalidChange,
|
|
327
330
|
index: indexProp,
|
|
@@ -573,13 +576,15 @@ var OneTimePasswordFieldInput = React.forwardRef(function OneTimePasswordFieldIn
|
|
|
573
576
|
}
|
|
574
577
|
}
|
|
575
578
|
) });
|
|
576
|
-
});
|
|
579
|
+
}, "OneTimePasswordFieldInput"));
|
|
577
580
|
function isFormElement(element) {
|
|
578
581
|
return element?.tagName === "FORM";
|
|
579
582
|
}
|
|
583
|
+
__name(isFormElement, "isFormElement");
|
|
580
584
|
function removeWhitespace(value) {
|
|
581
585
|
return value.replace(/\s/g, "");
|
|
582
586
|
}
|
|
587
|
+
__name(removeWhitespace, "removeWhitespace");
|
|
583
588
|
function focusInput(element) {
|
|
584
589
|
if (!element) return;
|
|
585
590
|
if (element.ownerDocument.activeElement === element) {
|
|
@@ -590,9 +595,11 @@ function focusInput(element) {
|
|
|
590
595
|
element.focus();
|
|
591
596
|
}
|
|
592
597
|
}
|
|
598
|
+
__name(focusInput, "focusInput");
|
|
593
599
|
function isInputEvent(event) {
|
|
594
600
|
return event.type === "input";
|
|
595
601
|
}
|
|
602
|
+
__name(isInputEvent, "isInputEvent");
|
|
596
603
|
export {
|
|
597
604
|
OneTimePasswordFieldHiddenInput as HiddenInput,
|
|
598
605
|
OneTimePasswordFieldInput as Input,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/one-time-password-field.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as Primitive from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { unstable_createCollection as createCollection } from '@radix-ui/react-collection';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useIsHydrated } from '@radix-ui/react-use-is-hydrated';\nimport * as React from 'react';\nimport { flushSync } from 'react-dom';\nimport type { Scope } from '@radix-ui/react-context';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { clamp } from '@radix-ui/number';\n\ntype InputValidationType = 'alpha' | 'numeric' | 'alphanumeric' | 'none';\n\nconst INPUT_VALIDATION_MAP = {\n numeric: {\n type: 'numeric',\n regexp: /[^\\d]/g,\n pattern: '\\\\d{1}',\n inputMode: 'numeric',\n },\n alpha: {\n type: 'alpha',\n regexp: /[^a-zA-Z]/g,\n pattern: '[a-zA-Z]{1}',\n inputMode: 'text',\n },\n alphanumeric: {\n type: 'alphanumeric',\n regexp: /[^a-zA-Z0-9]/g,\n pattern: '[a-zA-Z0-9]{1}',\n inputMode: 'text',\n },\n none: null,\n} satisfies InputValidation;\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldProvider\n * -----------------------------------------------------------------------------------------------*/\n\ntype RovingFocusGroupProps = RovingFocusGroup.RovingFocusGroupProps;\n\ninterface OneTimePasswordFieldContextValue {\n attemptSubmit: () => void;\n autoComplete: AutoComplete;\n autoFocus: boolean;\n disabled: boolean;\n dispatch: Dispatcher;\n form: string | undefined;\n hiddenInputRef: React.RefObject<HTMLInputElement | null>;\n isHydrated: boolean;\n name: string | undefined;\n orientation: Exclude<RovingFocusGroupProps['orientation'], undefined>;\n placeholder: string | undefined;\n readOnly: boolean;\n type: InputType;\n userActionRef: React.RefObject<KeyboardActionDetails | null>;\n validationType: InputValidationType;\n value: string[];\n sanitizeValue: (arg: string | string[]) => string[];\n}\n\nconst ONE_TIME_PASSWORD_FIELD_NAME = 'OneTimePasswordField';\nconst [Collection, { useCollection, createCollectionScope, useInitCollection }] =\n createCollection<HTMLInputElement>(ONE_TIME_PASSWORD_FIELD_NAME);\nconst [createOneTimePasswordFieldContext] = createContextScope(ONE_TIME_PASSWORD_FIELD_NAME, [\n createCollectionScope,\n createRovingFocusGroupScope,\n]);\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\n\nconst [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] =\n createOneTimePasswordFieldContext<OneTimePasswordFieldContextValue>(ONE_TIME_PASSWORD_FIELD_NAME);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordField\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldOwnProps {\n /**\n * Specifies what\u2014if any\u2014permission the user agent has to provide automated\n * assistance in filling out form field values, as well as guidance to the\n * browser as to the type of information expected in the field. Allows\n * `\"one-time-code\"` or `\"off\"`.\n *\n * @defaultValue `\"one-time-code\"`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete\n */\n autoComplete?: AutoComplete;\n /**\n * Whether or not the first fillable input should be focused on page-load.\n *\n * @defaultValue `false`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autofocus\n */\n autoFocus?: boolean;\n /**\n * Whether or not the component should attempt to automatically submit when\n * all fields are filled. If the field is associated with an HTML `form`\n * element, the form's `requestSubmit` method will be called.\n *\n * @defaultValue `false`\n */\n autoSubmit?: boolean;\n /**\n * The initial value of the uncontrolled field.\n */\n defaultValue?: string;\n /**\n * Indicates the horizontal directionality of the parent element's text.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir\n */\n dir?: RovingFocusGroupProps['dir'];\n /**\n * Whether or not the the field's input elements are disabled.\n */\n disabled?: boolean;\n /**\n * A string specifying the `form` element with which the input is associated.\n * This string's value, if present, must match the id of a `form` element in\n * the same document.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#form\n */\n form?: string | undefined;\n /**\n * A string specifying a name for the input control. This name is submitted\n * along with the control's value when the form data is submitted.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#name\n */\n name?: string | undefined;\n /**\n * When the `autoSubmit` prop is set to `true`, this callback will be fired\n * before attempting to submit the associated form. It will be called whether\n * or not a form is located, or if submission is not allowed.\n */\n onAutoSubmit?: (value: string) => void;\n /**\n * A callback fired when the field's value changes. When the component is\n * controlled, this should update the state passed to the `value` prop.\n */\n onValueChange?: (value: string) => void;\n /**\n * Indicates the vertical directionality of the input elements.\n *\n * @defaultValue `\"horizontal\"`\n */\n orientation?: RovingFocusGroupProps['orientation'];\n /**\n * Defines the text displayed in a form control when the control has no value.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/placeholder\n */\n placeholder?: string | undefined;\n /**\n * Whether or not the input elements can be updated by the user.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/readonly\n */\n readOnly?: boolean;\n /**\n * Function for custom sanitization when `validationType` is set to `\"none\"`.\n * This function will be called before updating values in response to user\n * interactions.\n */\n sanitizeValue?: (value: string) => string;\n /**\n * The input type of the field's input elements. Can be `\"password\"` or `\"text\"`.\n */\n type?: InputType;\n /**\n * Specifies the type of input validation to be used. Can be `\"alpha\"`,\n * `\"numeric\"`, `\"alphanumeric\"` or `\"none\"`.\n *\n * @defaultValue `\"numeric\"`\n */\n validationType?: InputValidationType;\n /**\n * The controlled value of the field.\n */\n value?: string;\n}\n\ntype ScopedProps<P> = P & { __scopeOneTimePasswordField?: Scope };\n\ninterface OneTimePasswordFieldProps\n extends\n OneTimePasswordFieldOwnProps,\n Omit<Primitive.PrimitivePropsWithRef<'div'>, keyof OneTimePasswordFieldOwnProps> {}\n\nconst OneTimePasswordField = React.forwardRef<HTMLDivElement, OneTimePasswordFieldProps>(\n function OneTimePasswordFieldImpl(\n {\n __scopeOneTimePasswordField,\n defaultValue,\n value: valueProp,\n onValueChange,\n autoSubmit = false,\n children,\n onPaste,\n onAutoSubmit,\n disabled = false,\n readOnly = false,\n autoComplete = 'one-time-code',\n autoFocus = false,\n form,\n name,\n placeholder,\n type = 'text',\n // TODO: Change default to vertical when inputs use vertical writing mode\n orientation = 'horizontal',\n dir,\n validationType = 'numeric',\n sanitizeValue: sanitizeValueProp,\n ...domProps\n }: ScopedProps<OneTimePasswordFieldProps>,\n forwardedRef,\n ) {\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n const direction = useDirection(dir);\n const collectionState = useInitCollection();\n const [collection] = collectionState;\n\n const validation = INPUT_VALIDATION_MAP[validationType]\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : null;\n\n const sanitizeValue = React.useCallback(\n (value: string | string[]) => {\n if (Array.isArray(value)) {\n value = value.map(removeWhitespace).join('');\n } else {\n value = removeWhitespace(value);\n }\n\n if (validation) {\n // global regexp is stateful, so we clone it for each call\n const regexp = new RegExp(validation.regexp);\n value = value.replace(regexp, '');\n } else if (sanitizeValueProp) {\n value = sanitizeValueProp(value);\n }\n\n return value.split('');\n },\n [validation, sanitizeValueProp],\n );\n\n const controlledValue = React.useMemo(() => {\n return valueProp != null ? sanitizeValue(valueProp) : undefined;\n }, [valueProp, sanitizeValue]);\n\n const [value, setValue] = useControllableState({\n caller: 'OneTimePasswordField',\n prop: controlledValue,\n defaultProp: defaultValue != null ? sanitizeValue(defaultValue) : [],\n onChange: React.useCallback(\n (value: string[]) => onValueChange?.(value.join('')),\n [onValueChange],\n ),\n });\n\n // Use a ref so dispatch always reads the latest value without needing\n // value in its dependency array (which would change its identity every\n // keystroke and cause cascading effect re-runs).\n const latestValueRef = React.useRef(value);\n latestValueRef.current = value;\n\n // Update function *specifically* for event handlers.\n const dispatch = React.useCallback<Dispatcher>(\n (action) => {\n const value = latestValueRef.current;\n switch (action.type) {\n case 'SET_CHAR': {\n const { index, char } = action;\n const currentTarget = collection.at(index)?.element;\n if (value[index] === char) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n // empty values should be handled in the CLEAR_CHAR action\n if (char === '') {\n return;\n }\n\n if (validation) {\n const regexp = new RegExp(validation.regexp);\n const clean = char.replace(regexp, '');\n if (clean !== char) {\n // not valid; ignore\n return;\n }\n }\n\n // no more space\n if (value.length >= collection.size) {\n // replace current value; move to next input\n const newValue = [...value];\n newValue[index] = char;\n flushSync(() => setValue(newValue));\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n const newValue = [...value];\n newValue[index] = char;\n\n const lastElement = collection.at(-1)?.element;\n flushSync(() => setValue(newValue));\n if (currentTarget !== lastElement) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n } else {\n currentTarget?.select();\n }\n return;\n }\n\n case 'CLEAR_CHAR': {\n const { index, reason } = action;\n if (!value[index]) {\n return;\n }\n\n const newValue = value.filter((_, i) => i !== index);\n const currentTarget = collection.at(index)?.element;\n const previous = currentTarget && collection.from(currentTarget, -1)?.element;\n\n flushSync(() => setValue(newValue));\n if (reason === 'Backspace') {\n focusInput(previous);\n } else if (reason === 'Delete' || reason === 'Cut') {\n focusInput(currentTarget);\n }\n return;\n }\n\n case 'CLEAR': {\n if (value.length === 0) {\n return;\n }\n\n if (action.reason === 'Backspace' || action.reason === 'Delete') {\n flushSync(() => setValue([]));\n focusInput(collection.at(0)?.element);\n } else {\n setValue([]);\n }\n return;\n }\n\n case 'PASTE': {\n const { value: pastedValue } = action;\n const sanitizedValue = sanitizeValue(pastedValue);\n if (!sanitizedValue) {\n return;\n }\n\n const value = sanitizedValue.slice(0, collection.size);\n\n flushSync(() => setValue(value));\n focusInput(collection.at(value.length - 1)?.element);\n return;\n }\n }\n },\n [collection, sanitizeValue, setValue, validation],\n );\n\n // re-validate when the validation type changes\n const validationTypeRef = React.useRef(validation);\n React.useEffect(() => {\n if (!validation) {\n return;\n }\n\n if (validationTypeRef.current?.type !== validation.type) {\n validationTypeRef.current = validation;\n setValue(sanitizeValue(value.join('')));\n }\n }, [sanitizeValue, setValue, validation, value]);\n\n const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n\n const userActionRef = React.useRef<KeyboardActionDetails | null>(null);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, rootRef);\n\n const firstInput = collection.at(0)?.element;\n const locateForm = React.useCallback(() => {\n let formElement: HTMLFormElement | null | undefined;\n if (form) {\n const associatedElement = (rootRef.current?.ownerDocument ?? document).getElementById(form);\n if (isFormElement(associatedElement)) {\n formElement = associatedElement;\n }\n } else if (hiddenInputRef.current) {\n formElement = hiddenInputRef.current.form;\n } else if (firstInput) {\n formElement = firstInput.form;\n }\n\n return formElement ?? null;\n }, [form, firstInput]);\n\n const attemptSubmit = React.useCallback(() => {\n const formElement = locateForm();\n formElement?.requestSubmit();\n }, [locateForm]);\n\n React.useEffect(() => {\n const form = locateForm();\n if (form) {\n const reset = () => dispatch({ type: 'CLEAR', reason: 'Reset' });\n form.addEventListener('reset', reset);\n return () => form.removeEventListener('reset', reset);\n }\n }, [dispatch, locateForm]);\n\n const currentValue = value.join('');\n const valueRef = React.useRef(currentValue);\n const length = collection.size;\n React.useEffect(() => {\n const previousValue = valueRef.current;\n valueRef.current = currentValue;\n if (previousValue === currentValue) {\n return;\n }\n\n if (autoSubmit && value.every((char) => char !== '') && value.length === length) {\n onAutoSubmit?.(value.join(''));\n attemptSubmit();\n }\n }, [attemptSubmit, autoSubmit, currentValue, length, onAutoSubmit, value]);\n const isHydrated = useIsHydrated();\n\n return (\n <OneTimePasswordFieldContext\n scope={__scopeOneTimePasswordField}\n value={value}\n attemptSubmit={attemptSubmit}\n disabled={disabled}\n readOnly={readOnly}\n autoComplete={autoComplete}\n autoFocus={autoFocus}\n form={form}\n name={name}\n placeholder={placeholder}\n type={type}\n hiddenInputRef={hiddenInputRef}\n userActionRef={userActionRef}\n dispatch={dispatch}\n validationType={validationType}\n orientation={orientation}\n isHydrated={isHydrated}\n sanitizeValue={sanitizeValue}\n >\n <Collection.Provider scope={__scopeOneTimePasswordField} state={collectionState}>\n <Collection.Slot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n >\n <Primitive.Root.div\n {...domProps}\n role=\"group\"\n ref={composedRefs}\n onPaste={composeEventHandlers(\n onPaste,\n (event: React.ClipboardEvent<HTMLDivElement>) => {\n event.preventDefault();\n const pastedValue = event.clipboardData.getData('text/plain');\n dispatch({ type: 'PASTE', value: pastedValue });\n },\n )}\n >\n {children}\n </Primitive.Root.div>\n </RovingFocusGroup.Root>\n </Collection.Slot>\n </Collection.Provider>\n </OneTimePasswordFieldContext>\n );\n },\n);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldHiddenInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldHiddenInputProps extends Omit<\n React.ComponentProps<'input'>,\n | keyof 'value'\n | 'defaultValue'\n | 'type'\n | 'onChange'\n | 'readOnly'\n | 'disabled'\n | 'autoComplete'\n | 'autoFocus'\n> {}\n\nconst OneTimePasswordFieldHiddenInput = React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldHiddenInputProps\n>(function OneTimePasswordFieldHiddenInput(\n { __scopeOneTimePasswordField, ...props }: ScopedProps<OneTimePasswordFieldHiddenInputProps>,\n forwardedRef,\n) {\n const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldHiddenInput',\n __scopeOneTimePasswordField,\n );\n const ref = useComposedRefs(hiddenInputRef, forwardedRef);\n return (\n <input\n ref={ref}\n name={name}\n value={value.join('').trim()}\n autoComplete=\"off\"\n autoFocus={false}\n autoCapitalize=\"off\"\n autoCorrect=\"off\"\n autoSave=\"off\"\n spellCheck={false}\n {...props}\n type=\"hidden\"\n readOnly\n />\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldInputProps extends Omit<\n Primitive.PrimitivePropsWithRef<'input'>,\n | 'value'\n | 'defaultValue'\n | 'disabled'\n | 'readOnly'\n | 'autoComplete'\n | 'autoFocus'\n | 'form'\n | 'name'\n | 'placeholder'\n | 'type'\n> {\n /**\n * Callback fired when the user input fails native HTML input validation.\n */\n onInvalidChange?: (character: string) => void;\n /**\n * User-provided index to determine the order of the inputs. This is useful if\n * you need certain index-based attributes to be set on the initial render,\n * often to prevent flickering after hydration.\n */\n index?: number;\n}\n\nconst OneTimePasswordFieldInput = React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldInputProps\n>(function OneTimePasswordFieldInput(\n {\n __scopeOneTimePasswordField,\n onInvalidChange,\n index: indexProp,\n ...props\n }: ScopedProps<OneTimePasswordFieldInputProps>,\n forwardedRef,\n) {\n // TODO: warn if these values are passed\n const {\n value: _value,\n defaultValue: _defaultValue,\n disabled: _disabled,\n readOnly: _readOnly,\n autoComplete: _autoComplete,\n autoFocus: _autoFocus,\n form: _form,\n name: _name,\n placeholder: _placeholder,\n type: _type,\n ...domProps\n } = props as Primitive.PrimitivePropsWithRef<'input'>;\n\n const context = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldInput',\n __scopeOneTimePasswordField,\n );\n const { dispatch, userActionRef, validationType, isHydrated, disabled } = context;\n const collection = useCollection(__scopeOneTimePasswordField);\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n const [element, setElement] = React.useState<HTMLInputElement | null>(null);\n\n const index = indexProp ?? (element ? collection.indexOf(element) : -1);\n const canSetPlaceholder = indexProp != null || isHydrated;\n let placeholder: string | undefined;\n if (canSetPlaceholder && context.placeholder && context.value.length === 0) {\n // only set placeholder after hydration to prevent flickering when indices\n // are re-calculated\n placeholder = context.placeholder[index];\n }\n\n const composedInputRef = useComposedRefs(forwardedRef, inputRef, setElement);\n const char = context.value[index] ?? '';\n\n const keyboardActionTimeoutRef = React.useRef<number | null>(null);\n React.useEffect(() => {\n return () => {\n if (keyboardActionTimeoutRef.current) {\n window.clearTimeout(keyboardActionTimeoutRef.current);\n }\n };\n }, []);\n\n const totalValue = context.value.join('').trim();\n const lastSelectableIndex = clamp(totalValue.length, [0, collection.size - 1]);\n const isFocusable = index <= lastSelectableIndex;\n\n const validation =\n validationType in INPUT_VALIDATION_MAP\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : undefined;\n\n return (\n <Collection.ItemSlot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Item\n {...rovingFocusGroupScope}\n asChild\n focusable={!context.disabled && isFocusable}\n active={index === lastSelectableIndex}\n >\n {({ hasTabStop, isCurrentTabStop }) => {\n const supportsAutoComplete = hasTabStop ? isCurrentTabStop : index === 0;\n return (\n <Primitive.Root.input\n ref={composedInputRef}\n type={context.type}\n disabled={disabled}\n aria-label={`Character ${index + 1} of ${collection.size}`}\n autoComplete={supportsAutoComplete ? context.autoComplete : 'off'}\n data-1p-ignore={supportsAutoComplete ? undefined : 'true'}\n data-lpignore={supportsAutoComplete ? undefined : 'true'}\n data-protonpass-ignore={supportsAutoComplete ? undefined : 'true'}\n data-bwignore={supportsAutoComplete ? undefined : 'true'}\n inputMode={validation?.inputMode}\n maxLength={supportsAutoComplete ? collection.size : 1}\n pattern={validation?.pattern}\n readOnly={context.readOnly}\n value={char}\n placeholder={placeholder}\n data-radix-otp-input=\"\"\n data-radix-index={index}\n {...domProps}\n onFocus={composeEventHandlers(props.onFocus, (event) => {\n event.currentTarget.select();\n })}\n onCut={composeEventHandlers(props.onCut, (event) => {\n const currentValue = event.currentTarget.value;\n if (currentValue !== '') {\n // In this case the value will be cleared, but we don't want to\n // set it directly because the user may want to prevent default\n // behavior in the onChange handler. The userActionRef will\n // be set temporarily so the change handler can behave correctly\n // in response to the action.\n userActionRef.current = { type: 'cut' };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onInput={composeEventHandlers(props.onInput, (event) => {\n const value = event.currentTarget.value;\n if (value.length > 1) {\n // Password managers may try to insert the code into a single\n // input, in which case form validation will fail to prevent\n // additional input. Handle this the same as if a user were\n // pasting a value.\n event.preventDefault();\n userActionRef.current = { type: 'autocomplete-paste' };\n dispatch({ type: 'PASTE', value });\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onChange={composeEventHandlers(props.onChange, (event) => {\n const value = event.target.value;\n event.preventDefault();\n const action = userActionRef.current;\n userActionRef.current = null;\n\n if (action) {\n switch (action.type) {\n case 'cut':\n // TODO: do we want to assume the user wants to clear the\n // entire value here and copy the code to the clipboard instead\n // of just the value of the given input?\n dispatch({ type: 'CLEAR_CHAR', index, reason: 'Cut' });\n return;\n case 'autocomplete-paste':\n // the PASTE handler will already set the value and focus the final\n // input; we want to skip focusing the wrong element if the browser fires\n // onChange for the first input. This sometimes happens during autocomplete.\n return;\n case 'keydown': {\n if (action.key === 'Char') {\n // update resulting from a keydown event that set a value\n // directly. Ignore.\n return;\n }\n\n const isClearing =\n action.key === 'Backspace' && (action.metaKey || action.ctrlKey);\n if (action.key === 'Clear' || isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n dispatch({ type: 'CLEAR_CHAR', index, reason: action.key });\n }\n return;\n }\n default:\n action satisfies never;\n return;\n }\n }\n\n // Only update the value if it matches the input pattern\n if (event.target.validity.valid) {\n if (value === '') {\n let reason: 'Backspace' | 'Delete' | 'Cut' = 'Backspace';\n if (isInputEvent(event.nativeEvent)) {\n const inputType = event.nativeEvent.inputType;\n if (inputType === 'deleteContentBackward') {\n reason = 'Backspace';\n } else if (inputType === 'deleteByCut') {\n reason = 'Cut';\n }\n }\n dispatch({ type: 'CLEAR_CHAR', index, reason });\n } else {\n dispatch({ type: 'SET_CHAR', char: value, index, event });\n }\n } else {\n const element = event.target;\n onInvalidChange?.(element.value);\n requestAnimationFrame(() => {\n if (element.ownerDocument.activeElement === element) {\n element.select();\n }\n });\n }\n })}\n onKeyDown={composeEventHandlers(props.onKeyDown, (event) => {\n switch (event.key) {\n case 'Clear':\n case 'Delete':\n case 'Backspace': {\n const currentValue = event.currentTarget.value;\n // if current value is empty, no change event will fire\n if (currentValue === '') {\n // if the user presses delete when there is no value, noop\n if (event.key === 'Delete') return;\n\n const isClearing = event.key === 'Clear' || event.metaKey || event.ctrlKey;\n if (isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n const element = event.currentTarget;\n requestAnimationFrame(() => {\n focusInput(collection.from(element, -1)?.element);\n });\n }\n } else {\n // In this case the value will be cleared, but we don't want\n // to set it directly because the user may want to prevent\n // default behavior in the onChange handler. The userActionRef\n // will is set temporarily so the change handler can behave\n // correctly in response to the key vs. clearing the value by\n // setting state externally.\n userActionRef.current = {\n type: 'keydown',\n key: event.key,\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n\n return;\n }\n case 'Enter': {\n event.preventDefault();\n context.attemptSubmit();\n return;\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (context.orientation === 'horizontal') {\n // in horizontal orientation, the up/down will de-select the\n // input instead of moving focus\n event.preventDefault();\n }\n return;\n }\n // TODO: Handle left/right arrow keys in vertical writing mode\n default: {\n if (event.currentTarget.value === event.key) {\n // if current value is same as the key press, no change event\n // will fire. Focus the next input.\n const element = event.currentTarget;\n event.preventDefault();\n focusInput(collection.from(element, 1)?.element);\n return;\n } else if (\n // input already has a value, but...\n event.currentTarget.value &&\n // the value is not selected\n !(\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd != null &&\n event.currentTarget.selectionEnd > 0\n )\n ) {\n const attemptedValue = event.key;\n if (event.key.length > 1 || event.key === ' ') {\n // not a character; do nothing\n return;\n } else {\n // user is attempting to enter a character, but the input\n // will not update by default since it's limited to a single\n // character.\n const nextInput = collection.from(event.currentTarget, 1)?.element;\n const lastInput = collection.at(-1)?.element;\n if (nextInput !== lastInput && event.currentTarget !== lastInput) {\n // if selection is before the value, set the value of the\n // current input. Otherwise set the value of the next\n // input.\n if (event.currentTarget.selectionStart === 0) {\n dispatch({ type: 'SET_CHAR', char: attemptedValue, index, event });\n } else {\n dispatch({\n type: 'SET_CHAR',\n char: attemptedValue,\n index: index + 1,\n event,\n });\n }\n\n userActionRef.current = {\n type: 'keydown',\n key: 'Char',\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n }\n }\n }\n }\n })}\n onPointerDown={composeEventHandlers(props.onPointerDown, (event) => {\n event.preventDefault();\n const indexToFocus = Math.min(index, lastSelectableIndex);\n const element = collection.at(indexToFocus)?.element;\n focusInput(element);\n })}\n />\n );\n }}\n </RovingFocusGroup.Item>\n </Collection.ItemSlot>\n );\n});\n\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n OneTimePasswordField as Root,\n OneTimePasswordFieldInput as Input,\n OneTimePasswordFieldHiddenInput as HiddenInput,\n};\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction isFormElement(element: Element | null | undefined): element is HTMLFormElement {\n return element?.tagName === 'FORM';\n}\n\nfunction removeWhitespace(value: string) {\n return value.replace(/\\s/g, '');\n}\n\nfunction focusInput(element: HTMLInputElement | null | undefined) {\n if (!element) return;\n if (element.ownerDocument.activeElement === element) {\n // if the element is already focused, select the value in the next\n // animation frame\n window.requestAnimationFrame(() => {\n element.select?.();\n });\n } else {\n element.focus();\n }\n}\n\nfunction isInputEvent(event: Event): event is InputEvent {\n return event.type === 'input';\n}\n\ntype InputType = 'password' | 'text';\ntype AutoComplete = 'off' | 'one-time-code';\ntype KeyboardActionDetails =\n | {\n type: 'keydown';\n key: 'Backspace' | 'Delete' | 'Clear' | 'Char';\n metaKey: boolean;\n ctrlKey: boolean;\n }\n | { type: 'cut' }\n | { type: 'autocomplete-paste' };\n\ntype UpdateAction =\n | {\n type: 'SET_CHAR';\n char: string;\n index: number;\n event: React.KeyboardEvent | React.ChangeEvent;\n }\n | { type: 'CLEAR_CHAR'; index: number; reason: 'Backspace' | 'Delete' | 'Cut' }\n | { type: 'CLEAR'; reason: 'Reset' | 'Backspace' | 'Delete' | 'Clear' }\n | { type: 'PASTE'; value: string };\ntype Dispatcher = React.Dispatch<UpdateAction>;\ntype InputValidation = Record<\n InputValidationType,\n {\n type: InputValidationType;\n regexp: RegExp;\n pattern: string;\n inputMode: 'text' | 'numeric';\n } | null\n>;\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["import * as Primitive from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { unstable_createCollection as createCollection } from '@radix-ui/react-collection';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useIsHydrated } from '@radix-ui/react-use-is-hydrated';\nimport * as React from 'react';\nimport { flushSync } from 'react-dom';\nimport type { Scope } from '@radix-ui/react-context';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { clamp } from '@radix-ui/number';\n\ntype InputValidationType = 'alpha' | 'numeric' | 'alphanumeric' | 'none';\n\nconst INPUT_VALIDATION_MAP = {\n numeric: {\n type: 'numeric',\n regexp: /[^\\d]/g,\n pattern: '\\\\d{1}',\n inputMode: 'numeric',\n },\n alpha: {\n type: 'alpha',\n regexp: /[^a-zA-Z]/g,\n pattern: '[a-zA-Z]{1}',\n inputMode: 'text',\n },\n alphanumeric: {\n type: 'alphanumeric',\n regexp: /[^a-zA-Z0-9]/g,\n pattern: '[a-zA-Z0-9]{1}',\n inputMode: 'text',\n },\n none: null,\n} satisfies InputValidation;\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldProvider\n * -----------------------------------------------------------------------------------------------*/\n\ntype RovingFocusGroupProps = RovingFocusGroup.RovingFocusGroupProps;\n\ninterface OneTimePasswordFieldContextValue {\n attemptSubmit: () => void;\n autoComplete: AutoComplete;\n autoFocus: boolean;\n disabled: boolean;\n dispatch: Dispatcher;\n form: string | undefined;\n hiddenInputRef: React.RefObject<HTMLInputElement | null>;\n isHydrated: boolean;\n name: string | undefined;\n orientation: Exclude<RovingFocusGroupProps['orientation'], undefined>;\n placeholder: string | undefined;\n readOnly: boolean;\n type: InputType;\n userActionRef: React.RefObject<KeyboardActionDetails | null>;\n validationType: InputValidationType;\n value: string[];\n sanitizeValue: (arg: string | string[]) => string[];\n}\n\nconst ONE_TIME_PASSWORD_FIELD_NAME = 'OneTimePasswordField';\nconst [Collection, { useCollection, createCollectionScope, useInitCollection }] =\n createCollection<HTMLInputElement>(ONE_TIME_PASSWORD_FIELD_NAME);\nconst [createOneTimePasswordFieldContext] = createContextScope(ONE_TIME_PASSWORD_FIELD_NAME, [\n createCollectionScope,\n createRovingFocusGroupScope,\n]);\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\n\nconst [OneTimePasswordFieldContext, useOneTimePasswordFieldContext] =\n createOneTimePasswordFieldContext<OneTimePasswordFieldContextValue>(ONE_TIME_PASSWORD_FIELD_NAME);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordField\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldOwnProps {\n /**\n * Specifies what\u2014if any\u2014permission the user agent has to provide automated\n * assistance in filling out form field values, as well as guidance to the\n * browser as to the type of information expected in the field. Allows\n * `\"one-time-code\"` or `\"off\"`.\n *\n * @defaultValue `\"one-time-code\"`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete\n */\n autoComplete?: AutoComplete;\n /**\n * Whether or not the first fillable input should be focused on page-load.\n *\n * @defaultValue `false`\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autofocus\n */\n autoFocus?: boolean;\n /**\n * Whether or not the component should attempt to automatically submit when\n * all fields are filled. If the field is associated with an HTML `form`\n * element, the form's `requestSubmit` method will be called.\n *\n * @defaultValue `false`\n */\n autoSubmit?: boolean;\n /**\n * The initial value of the uncontrolled field.\n */\n defaultValue?: string;\n /**\n * Indicates the horizontal directionality of the parent element's text.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir\n */\n dir?: RovingFocusGroupProps['dir'];\n /**\n * Whether or not the the field's input elements are disabled.\n */\n disabled?: boolean;\n /**\n * A string specifying the `form` element with which the input is associated.\n * This string's value, if present, must match the id of a `form` element in\n * the same document.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#form\n */\n form?: string | undefined;\n /**\n * A string specifying a name for the input control. This name is submitted\n * along with the control's value when the form data is submitted.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#name\n */\n name?: string | undefined;\n /**\n * When the `autoSubmit` prop is set to `true`, this callback will be fired\n * before attempting to submit the associated form. It will be called whether\n * or not a form is located, or if submission is not allowed.\n */\n onAutoSubmit?: (value: string) => void;\n /**\n * A callback fired when the field's value changes. When the component is\n * controlled, this should update the state passed to the `value` prop.\n */\n onValueChange?: (value: string) => void;\n /**\n * Indicates the vertical directionality of the input elements.\n *\n * @defaultValue `\"horizontal\"`\n */\n orientation?: RovingFocusGroupProps['orientation'];\n /**\n * Defines the text displayed in a form control when the control has no value.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/placeholder\n */\n placeholder?: string | undefined;\n /**\n * Whether or not the input elements can be updated by the user.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/readonly\n */\n readOnly?: boolean;\n /**\n * Function for custom sanitization when `validationType` is set to `\"none\"`.\n * This function will be called before updating values in response to user\n * interactions.\n */\n sanitizeValue?: (value: string) => string;\n /**\n * The input type of the field's input elements. Can be `\"password\"` or `\"text\"`.\n */\n type?: InputType;\n /**\n * Specifies the type of input validation to be used. Can be `\"alpha\"`,\n * `\"numeric\"`, `\"alphanumeric\"` or `\"none\"`.\n *\n * @defaultValue `\"numeric\"`\n */\n validationType?: InputValidationType;\n /**\n * The controlled value of the field.\n */\n value?: string;\n}\n\ntype ScopedProps<P> = P & { __scopeOneTimePasswordField?: Scope };\n\ninterface OneTimePasswordFieldProps\n extends\n OneTimePasswordFieldOwnProps,\n Omit<Primitive.PrimitivePropsWithRef<'div'>, keyof OneTimePasswordFieldOwnProps> {}\n\nconst OneTimePasswordField = /* @__PURE__ */ React.forwardRef<\n HTMLDivElement,\n OneTimePasswordFieldProps\n>(\n // blank line to reduce diff noise\n function OneTimePasswordFieldImpl(\n {\n __scopeOneTimePasswordField,\n defaultValue,\n value: valueProp,\n onValueChange,\n autoSubmit = false,\n children,\n onPaste,\n onAutoSubmit,\n disabled = false,\n readOnly = false,\n autoComplete = 'one-time-code',\n autoFocus = false,\n form,\n name,\n placeholder,\n type = 'text',\n // TODO: Change default to vertical when inputs use vertical writing mode\n orientation = 'horizontal',\n dir,\n validationType = 'numeric',\n sanitizeValue: sanitizeValueProp,\n ...domProps\n }: ScopedProps<OneTimePasswordFieldProps>,\n forwardedRef,\n ) {\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n const direction = useDirection(dir);\n const collectionState = useInitCollection();\n const [collection] = collectionState;\n\n const validation = INPUT_VALIDATION_MAP[validationType]\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : null;\n\n const sanitizeValue = React.useCallback(\n (value: string | string[]) => {\n if (Array.isArray(value)) {\n value = value.map(removeWhitespace).join('');\n } else {\n value = removeWhitespace(value);\n }\n\n if (validation) {\n // global regexp is stateful, so we clone it for each call\n const regexp = new RegExp(validation.regexp);\n value = value.replace(regexp, '');\n } else if (sanitizeValueProp) {\n value = sanitizeValueProp(value);\n }\n\n return value.split('');\n },\n [validation, sanitizeValueProp],\n );\n\n const controlledValue = React.useMemo(() => {\n return valueProp != null ? sanitizeValue(valueProp) : undefined;\n }, [valueProp, sanitizeValue]);\n\n const [value, setValue] = useControllableState({\n caller: 'OneTimePasswordField',\n prop: controlledValue,\n defaultProp: defaultValue != null ? sanitizeValue(defaultValue) : [],\n onChange: React.useCallback(\n (value: string[]) => onValueChange?.(value.join('')),\n [onValueChange],\n ),\n });\n\n // Use a ref so dispatch always reads the latest value without needing\n // value in its dependency array (which would change its identity every\n // keystroke and cause cascading effect re-runs).\n const latestValueRef = React.useRef(value);\n latestValueRef.current = value;\n\n // Update function *specifically* for event handlers.\n const dispatch = React.useCallback<Dispatcher>(\n (action) => {\n const value = latestValueRef.current;\n switch (action.type) {\n case 'SET_CHAR': {\n const { index, char } = action;\n const currentTarget = collection.at(index)?.element;\n if (value[index] === char) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n // empty values should be handled in the CLEAR_CHAR action\n if (char === '') {\n return;\n }\n\n if (validation) {\n const regexp = new RegExp(validation.regexp);\n const clean = char.replace(regexp, '');\n if (clean !== char) {\n // not valid; ignore\n return;\n }\n }\n\n // no more space\n if (value.length >= collection.size) {\n // replace current value; move to next input\n const newValue = [...value];\n newValue[index] = char;\n flushSync(() => setValue(newValue));\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n return;\n }\n\n const newValue = [...value];\n newValue[index] = char;\n\n const lastElement = collection.at(-1)?.element;\n flushSync(() => setValue(newValue));\n if (currentTarget !== lastElement) {\n const next = currentTarget && collection.from(currentTarget, 1)?.element;\n focusInput(next);\n } else {\n currentTarget?.select();\n }\n return;\n }\n\n case 'CLEAR_CHAR': {\n const { index, reason } = action;\n if (!value[index]) {\n return;\n }\n\n const newValue = value.filter((_, i) => i !== index);\n const currentTarget = collection.at(index)?.element;\n const previous = currentTarget && collection.from(currentTarget, -1)?.element;\n\n flushSync(() => setValue(newValue));\n if (reason === 'Backspace') {\n focusInput(previous);\n } else if (reason === 'Delete' || reason === 'Cut') {\n focusInput(currentTarget);\n }\n return;\n }\n\n case 'CLEAR': {\n if (value.length === 0) {\n return;\n }\n\n if (action.reason === 'Backspace' || action.reason === 'Delete') {\n flushSync(() => setValue([]));\n focusInput(collection.at(0)?.element);\n } else {\n setValue([]);\n }\n return;\n }\n\n case 'PASTE': {\n const { value: pastedValue } = action;\n const sanitizedValue = sanitizeValue(pastedValue);\n if (!sanitizedValue) {\n return;\n }\n\n const value = sanitizedValue.slice(0, collection.size);\n\n flushSync(() => setValue(value));\n focusInput(collection.at(value.length - 1)?.element);\n return;\n }\n }\n },\n [collection, sanitizeValue, setValue, validation],\n );\n\n // re-validate when the validation type changes\n const validationTypeRef = React.useRef(validation);\n React.useEffect(() => {\n if (!validation) {\n return;\n }\n\n if (validationTypeRef.current?.type !== validation.type) {\n validationTypeRef.current = validation;\n setValue(sanitizeValue(value.join('')));\n }\n }, [sanitizeValue, setValue, validation, value]);\n\n const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n\n const userActionRef = React.useRef<KeyboardActionDetails | null>(null);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, rootRef);\n\n const firstInput = collection.at(0)?.element;\n const locateForm = React.useCallback(() => {\n let formElement: HTMLFormElement | null | undefined;\n if (form) {\n const associatedElement = (rootRef.current?.ownerDocument ?? document).getElementById(form);\n if (isFormElement(associatedElement)) {\n formElement = associatedElement;\n }\n } else if (hiddenInputRef.current) {\n formElement = hiddenInputRef.current.form;\n } else if (firstInput) {\n formElement = firstInput.form;\n }\n\n return formElement ?? null;\n }, [form, firstInput]);\n\n const attemptSubmit = React.useCallback(() => {\n const formElement = locateForm();\n formElement?.requestSubmit();\n }, [locateForm]);\n\n React.useEffect(() => {\n const form = locateForm();\n if (form) {\n const reset = () => dispatch({ type: 'CLEAR', reason: 'Reset' });\n form.addEventListener('reset', reset);\n return () => form.removeEventListener('reset', reset);\n }\n }, [dispatch, locateForm]);\n\n const currentValue = value.join('');\n const valueRef = React.useRef(currentValue);\n const length = collection.size;\n React.useEffect(() => {\n const previousValue = valueRef.current;\n valueRef.current = currentValue;\n if (previousValue === currentValue) {\n return;\n }\n\n if (autoSubmit && value.every((char) => char !== '') && value.length === length) {\n onAutoSubmit?.(value.join(''));\n attemptSubmit();\n }\n }, [attemptSubmit, autoSubmit, currentValue, length, onAutoSubmit, value]);\n const isHydrated = useIsHydrated();\n\n return (\n <OneTimePasswordFieldContext\n scope={__scopeOneTimePasswordField}\n value={value}\n attemptSubmit={attemptSubmit}\n disabled={disabled}\n readOnly={readOnly}\n autoComplete={autoComplete}\n autoFocus={autoFocus}\n form={form}\n name={name}\n placeholder={placeholder}\n type={type}\n hiddenInputRef={hiddenInputRef}\n userActionRef={userActionRef}\n dispatch={dispatch}\n validationType={validationType}\n orientation={orientation}\n isHydrated={isHydrated}\n sanitizeValue={sanitizeValue}\n >\n <Collection.Provider scope={__scopeOneTimePasswordField} state={collectionState}>\n <Collection.Slot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n >\n <Primitive.Root.div\n {...domProps}\n role=\"group\"\n ref={composedRefs}\n onPaste={composeEventHandlers(\n onPaste,\n (event: React.ClipboardEvent<HTMLDivElement>) => {\n event.preventDefault();\n const pastedValue = event.clipboardData.getData('text/plain');\n dispatch({ type: 'PASTE', value: pastedValue });\n },\n )}\n >\n {children}\n </Primitive.Root.div>\n </RovingFocusGroup.Root>\n </Collection.Slot>\n </Collection.Provider>\n </OneTimePasswordFieldContext>\n );\n },\n);\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldHiddenInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldHiddenInputProps extends Omit<\n React.ComponentProps<'input'>,\n | keyof 'value'\n | 'defaultValue'\n | 'type'\n | 'onChange'\n | 'readOnly'\n | 'disabled'\n | 'autoComplete'\n | 'autoFocus'\n> {}\n\nconst OneTimePasswordFieldHiddenInput = /* @__PURE__ */ React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldHiddenInputProps\n>(function OneTimePasswordFieldHiddenInput(\n { __scopeOneTimePasswordField, ...props }: ScopedProps<OneTimePasswordFieldHiddenInputProps>,\n forwardedRef,\n) {\n const { value, hiddenInputRef, name } = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldHiddenInput',\n __scopeOneTimePasswordField,\n );\n const ref = useComposedRefs(hiddenInputRef, forwardedRef);\n return (\n <input\n ref={ref}\n name={name}\n value={value.join('').trim()}\n autoComplete=\"off\"\n autoFocus={false}\n autoCapitalize=\"off\"\n autoCorrect=\"off\"\n autoSave=\"off\"\n spellCheck={false}\n {...props}\n type=\"hidden\"\n readOnly\n />\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * OneTimePasswordFieldInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface OneTimePasswordFieldInputProps extends Omit<\n Primitive.PrimitivePropsWithRef<'input'>,\n | 'value'\n | 'defaultValue'\n | 'disabled'\n | 'readOnly'\n | 'autoComplete'\n | 'autoFocus'\n | 'form'\n | 'name'\n | 'placeholder'\n | 'type'\n> {\n /**\n * Callback fired when the user input fails native HTML input validation.\n */\n onInvalidChange?: (character: string) => void;\n /**\n * User-provided index to determine the order of the inputs. This is useful if\n * you need certain index-based attributes to be set on the initial render,\n * often to prevent flickering after hydration.\n */\n index?: number;\n}\n\nconst OneTimePasswordFieldInput = /* @__PURE__ */ React.forwardRef<\n HTMLInputElement,\n OneTimePasswordFieldInputProps\n>(function OneTimePasswordFieldInput(\n {\n __scopeOneTimePasswordField,\n onInvalidChange,\n index: indexProp,\n ...props\n }: ScopedProps<OneTimePasswordFieldInputProps>,\n forwardedRef,\n) {\n // TODO: warn if these values are passed\n const {\n value: _value,\n defaultValue: _defaultValue,\n disabled: _disabled,\n readOnly: _readOnly,\n autoComplete: _autoComplete,\n autoFocus: _autoFocus,\n form: _form,\n name: _name,\n placeholder: _placeholder,\n type: _type,\n ...domProps\n } = props as Primitive.PrimitivePropsWithRef<'input'>;\n\n const context = useOneTimePasswordFieldContext(\n 'OneTimePasswordFieldInput',\n __scopeOneTimePasswordField,\n );\n const { dispatch, userActionRef, validationType, isHydrated, disabled } = context;\n const collection = useCollection(__scopeOneTimePasswordField);\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeOneTimePasswordField);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n const [element, setElement] = React.useState<HTMLInputElement | null>(null);\n\n const index = indexProp ?? (element ? collection.indexOf(element) : -1);\n const canSetPlaceholder = indexProp != null || isHydrated;\n let placeholder: string | undefined;\n if (canSetPlaceholder && context.placeholder && context.value.length === 0) {\n // only set placeholder after hydration to prevent flickering when indices\n // are re-calculated\n placeholder = context.placeholder[index];\n }\n\n const composedInputRef = useComposedRefs(forwardedRef, inputRef, setElement);\n const char = context.value[index] ?? '';\n\n const keyboardActionTimeoutRef = React.useRef<number | null>(null);\n React.useEffect(() => {\n return () => {\n if (keyboardActionTimeoutRef.current) {\n window.clearTimeout(keyboardActionTimeoutRef.current);\n }\n };\n }, []);\n\n const totalValue = context.value.join('').trim();\n const lastSelectableIndex = clamp(totalValue.length, [0, collection.size - 1]);\n const isFocusable = index <= lastSelectableIndex;\n\n const validation =\n validationType in INPUT_VALIDATION_MAP\n ? INPUT_VALIDATION_MAP[validationType as keyof InputValidation]\n : undefined;\n\n return (\n <Collection.ItemSlot scope={__scopeOneTimePasswordField}>\n <RovingFocusGroup.Item\n {...rovingFocusGroupScope}\n asChild\n focusable={!context.disabled && isFocusable}\n active={index === lastSelectableIndex}\n >\n {({ hasTabStop, isCurrentTabStop }) => {\n const supportsAutoComplete = hasTabStop ? isCurrentTabStop : index === 0;\n return (\n <Primitive.Root.input\n ref={composedInputRef}\n type={context.type}\n disabled={disabled}\n aria-label={`Character ${index + 1} of ${collection.size}`}\n autoComplete={supportsAutoComplete ? context.autoComplete : 'off'}\n data-1p-ignore={supportsAutoComplete ? undefined : 'true'}\n data-lpignore={supportsAutoComplete ? undefined : 'true'}\n data-protonpass-ignore={supportsAutoComplete ? undefined : 'true'}\n data-bwignore={supportsAutoComplete ? undefined : 'true'}\n inputMode={validation?.inputMode}\n maxLength={supportsAutoComplete ? collection.size : 1}\n pattern={validation?.pattern}\n readOnly={context.readOnly}\n value={char}\n placeholder={placeholder}\n data-radix-otp-input=\"\"\n data-radix-index={index}\n {...domProps}\n onFocus={composeEventHandlers(props.onFocus, (event) => {\n event.currentTarget.select();\n })}\n onCut={composeEventHandlers(props.onCut, (event) => {\n const currentValue = event.currentTarget.value;\n if (currentValue !== '') {\n // In this case the value will be cleared, but we don't want to\n // set it directly because the user may want to prevent default\n // behavior in the onChange handler. The userActionRef will\n // be set temporarily so the change handler can behave correctly\n // in response to the action.\n userActionRef.current = { type: 'cut' };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onInput={composeEventHandlers(props.onInput, (event) => {\n const value = event.currentTarget.value;\n if (value.length > 1) {\n // Password managers may try to insert the code into a single\n // input, in which case form validation will fail to prevent\n // additional input. Handle this the same as if a user were\n // pasting a value.\n event.preventDefault();\n userActionRef.current = { type: 'autocomplete-paste' };\n dispatch({ type: 'PASTE', value });\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n })}\n onChange={composeEventHandlers(props.onChange, (event) => {\n const value = event.target.value;\n event.preventDefault();\n const action = userActionRef.current;\n userActionRef.current = null;\n\n if (action) {\n switch (action.type) {\n case 'cut':\n // TODO: do we want to assume the user wants to clear the\n // entire value here and copy the code to the clipboard instead\n // of just the value of the given input?\n dispatch({ type: 'CLEAR_CHAR', index, reason: 'Cut' });\n return;\n case 'autocomplete-paste':\n // the PASTE handler will already set the value and focus the final\n // input; we want to skip focusing the wrong element if the browser fires\n // onChange for the first input. This sometimes happens during autocomplete.\n return;\n case 'keydown': {\n if (action.key === 'Char') {\n // update resulting from a keydown event that set a value\n // directly. Ignore.\n return;\n }\n\n const isClearing =\n action.key === 'Backspace' && (action.metaKey || action.ctrlKey);\n if (action.key === 'Clear' || isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n dispatch({ type: 'CLEAR_CHAR', index, reason: action.key });\n }\n return;\n }\n default:\n action satisfies never;\n return;\n }\n }\n\n // Only update the value if it matches the input pattern\n if (event.target.validity.valid) {\n if (value === '') {\n let reason: 'Backspace' | 'Delete' | 'Cut' = 'Backspace';\n if (isInputEvent(event.nativeEvent)) {\n const inputType = event.nativeEvent.inputType;\n if (inputType === 'deleteContentBackward') {\n reason = 'Backspace';\n } else if (inputType === 'deleteByCut') {\n reason = 'Cut';\n }\n }\n dispatch({ type: 'CLEAR_CHAR', index, reason });\n } else {\n dispatch({ type: 'SET_CHAR', char: value, index, event });\n }\n } else {\n const element = event.target;\n onInvalidChange?.(element.value);\n requestAnimationFrame(() => {\n if (element.ownerDocument.activeElement === element) {\n element.select();\n }\n });\n }\n })}\n onKeyDown={composeEventHandlers(props.onKeyDown, (event) => {\n switch (event.key) {\n case 'Clear':\n case 'Delete':\n case 'Backspace': {\n const currentValue = event.currentTarget.value;\n // if current value is empty, no change event will fire\n if (currentValue === '') {\n // if the user presses delete when there is no value, noop\n if (event.key === 'Delete') return;\n\n const isClearing = event.key === 'Clear' || event.metaKey || event.ctrlKey;\n if (isClearing) {\n dispatch({ type: 'CLEAR', reason: 'Backspace' });\n } else {\n const element = event.currentTarget;\n requestAnimationFrame(() => {\n focusInput(collection.from(element, -1)?.element);\n });\n }\n } else {\n // In this case the value will be cleared, but we don't want\n // to set it directly because the user may want to prevent\n // default behavior in the onChange handler. The userActionRef\n // will is set temporarily so the change handler can behave\n // correctly in response to the key vs. clearing the value by\n // setting state externally.\n userActionRef.current = {\n type: 'keydown',\n key: event.key,\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n // Set a short timeout to clear the action tracker after the change\n // handler has had time to complete.\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n\n return;\n }\n case 'Enter': {\n event.preventDefault();\n context.attemptSubmit();\n return;\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (context.orientation === 'horizontal') {\n // in horizontal orientation, the up/down will de-select the\n // input instead of moving focus\n event.preventDefault();\n }\n return;\n }\n // TODO: Handle left/right arrow keys in vertical writing mode\n default: {\n if (event.currentTarget.value === event.key) {\n // if current value is same as the key press, no change event\n // will fire. Focus the next input.\n const element = event.currentTarget;\n event.preventDefault();\n focusInput(collection.from(element, 1)?.element);\n return;\n } else if (\n // input already has a value, but...\n event.currentTarget.value &&\n // the value is not selected\n !(\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd != null &&\n event.currentTarget.selectionEnd > 0\n )\n ) {\n const attemptedValue = event.key;\n if (event.key.length > 1 || event.key === ' ') {\n // not a character; do nothing\n return;\n } else {\n // user is attempting to enter a character, but the input\n // will not update by default since it's limited to a single\n // character.\n const nextInput = collection.from(event.currentTarget, 1)?.element;\n const lastInput = collection.at(-1)?.element;\n if (nextInput !== lastInput && event.currentTarget !== lastInput) {\n // if selection is before the value, set the value of the\n // current input. Otherwise set the value of the next\n // input.\n if (event.currentTarget.selectionStart === 0) {\n dispatch({ type: 'SET_CHAR', char: attemptedValue, index, event });\n } else {\n dispatch({\n type: 'SET_CHAR',\n char: attemptedValue,\n index: index + 1,\n event,\n });\n }\n\n userActionRef.current = {\n type: 'keydown',\n key: 'Char',\n metaKey: event.metaKey,\n ctrlKey: event.ctrlKey,\n };\n keyboardActionTimeoutRef.current = window.setTimeout(() => {\n userActionRef.current = null;\n }, 10);\n }\n }\n }\n }\n }\n })}\n onPointerDown={composeEventHandlers(props.onPointerDown, (event) => {\n event.preventDefault();\n const indexToFocus = Math.min(index, lastSelectableIndex);\n const element = collection.at(indexToFocus)?.element;\n focusInput(element);\n })}\n />\n );\n }}\n </RovingFocusGroup.Item>\n </Collection.ItemSlot>\n );\n});\n\nexport {\n OneTimePasswordField,\n OneTimePasswordFieldInput,\n OneTimePasswordFieldHiddenInput,\n //\n OneTimePasswordField as Root,\n OneTimePasswordFieldInput as Input,\n OneTimePasswordFieldHiddenInput as HiddenInput,\n};\nexport type {\n OneTimePasswordFieldProps,\n OneTimePasswordFieldInputProps,\n OneTimePasswordFieldHiddenInputProps,\n InputValidationType,\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction isFormElement(element: Element | null | undefined): element is HTMLFormElement {\n return element?.tagName === 'FORM';\n}\n\nfunction removeWhitespace(value: string) {\n return value.replace(/\\s/g, '');\n}\n\nfunction focusInput(element: HTMLInputElement | null | undefined) {\n if (!element) return;\n if (element.ownerDocument.activeElement === element) {\n // if the element is already focused, select the value in the next\n // animation frame\n window.requestAnimationFrame(() => {\n element.select?.();\n });\n } else {\n element.focus();\n }\n}\n\nfunction isInputEvent(event: Event): event is InputEvent {\n return event.type === 'input';\n}\n\ntype InputType = 'password' | 'text';\ntype AutoComplete = 'off' | 'one-time-code';\ntype KeyboardActionDetails =\n | {\n type: 'keydown';\n key: 'Backspace' | 'Delete' | 'Clear' | 'Char';\n metaKey: boolean;\n ctrlKey: boolean;\n }\n | { type: 'cut' }\n | { type: 'autocomplete-paste' };\n\ntype UpdateAction =\n | {\n type: 'SET_CHAR';\n char: string;\n index: number;\n event: React.KeyboardEvent | React.ChangeEvent;\n }\n | { type: 'CLEAR_CHAR'; index: number; reason: 'Backspace' | 'Delete' | 'Cut' }\n | { type: 'CLEAR'; reason: 'Reset' | 'Backspace' | 'Delete' | 'Clear' }\n | { type: 'PASTE'; value: string };\ntype Dispatcher = React.Dispatch<UpdateAction>;\ntype InputValidation = Record<\n InputValidationType,\n {\n type: InputValidationType;\n regexp: RegExp;\n pattern: string;\n inputMode: 'text' | 'numeric';\n } | null\n>;\n"],
|
|
5
|
+
"mappings": ";;;;;AAAA,YAAY,eAAe;AAC3B,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,6BAA6B,wBAAwB;AAC9D,YAAY,sBAAsB;AAClC,SAAS,mCAAmC;AAC5C,SAAS,qBAAqB;AAC9B,YAAY,WAAW;AACvB,SAAS,iBAAiB;AAE1B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AAgdR;AA5cd,IAAM,uBAAuB;AAAA,EAC3B,SAAS;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,OAAO;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,MAAM;AACR;AA4BA,IAAM,+BAA+B;AACrC,IAAM,CAAC,YAAY,EAAE,eAAe,uBAAuB,kBAAkB,CAAC,IAC5E,iBAAmC,4BAA4B;AACjE,IAAM,CAAC,iCAAiC,IAAI,mBAAmB,8BAA8B;AAAA,EAC3F;AAAA,EACA;AACF,CAAC;AACD,IAAM,2BAA2B,4BAA4B;AAE7D,IAAM,CAAC,6BAA6B,8BAA8B,IAChE,kCAAoE,4BAA4B;AAwHlG,IAAM,uBAAuC,gBAAM;AAAA;AAAA,EAKjD,gCAAS,yBACP;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX,eAAe;AAAA,IACf,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA;AAAA,IAEP,cAAc;AAAA,IACd;AAAA,IACA,iBAAiB;AAAA,IACjB,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,cACA;AACA,UAAM,wBAAwB,yBAAyB,2BAA2B;AAClF,UAAM,YAAY,aAAa,GAAG;AAClC,UAAM,kBAAkB,kBAAkB;AAC1C,UAAM,CAAC,UAAU,IAAI;AAErB,UAAM,aAAa,qBAAqB,cAAc,IAClD,qBAAqB,cAAuC,IAC5D;AAEJ,UAAM,gBAAsB;AAAA,MAC1B,CAACA,WAA6B;AAC5B,YAAI,MAAM,QAAQA,MAAK,GAAG;AACxB,UAAAA,SAAQA,OAAM,IAAI,gBAAgB,EAAE,KAAK,EAAE;AAAA,QAC7C,OAAO;AACL,UAAAA,SAAQ,iBAAiBA,MAAK;AAAA,QAChC;AAEA,YAAI,YAAY;AAEd,gBAAM,SAAS,IAAI,OAAO,WAAW,MAAM;AAC3C,UAAAA,SAAQA,OAAM,QAAQ,QAAQ,EAAE;AAAA,QAClC,WAAW,mBAAmB;AAC5B,UAAAA,SAAQ,kBAAkBA,MAAK;AAAA,QACjC;AAEA,eAAOA,OAAM,MAAM,EAAE;AAAA,MACvB;AAAA,MACA,CAAC,YAAY,iBAAiB;AAAA,IAChC;AAEA,UAAM,kBAAwB,cAAQ,MAAM;AAC1C,aAAO,aAAa,OAAO,cAAc,SAAS,IAAI;AAAA,IACxD,GAAG,CAAC,WAAW,aAAa,CAAC;AAE7B,UAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,MAC7C,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,aAAa,gBAAgB,OAAO,cAAc,YAAY,IAAI,CAAC;AAAA,MACnE,UAAgB;AAAA,QACd,CAACA,WAAoB,gBAAgBA,OAAM,KAAK,EAAE,CAAC;AAAA,QACnD,CAAC,aAAa;AAAA,MAChB;AAAA,IACF,CAAC;AAKD,UAAM,iBAAuB,aAAO,KAAK;AACzC,mBAAe,UAAU;AAGzB,UAAM,WAAiB;AAAA,MACrB,CAAC,WAAW;AACV,cAAMA,SAAQ,eAAe;AAC7B,gBAAQ,OAAO,MAAM;AAAA,UACnB,KAAK,YAAY;AACf,kBAAM,EAAE,OAAO,KAAK,IAAI;AACxB,kBAAM,gBAAgB,WAAW,GAAG,KAAK,GAAG;AAC5C,gBAAIA,OAAM,KAAK,MAAM,MAAM;AACzB,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AACf;AAAA,YACF;AAGA,gBAAI,SAAS,IAAI;AACf;AAAA,YACF;AAEA,gBAAI,YAAY;AACd,oBAAM,SAAS,IAAI,OAAO,WAAW,MAAM;AAC3C,oBAAM,QAAQ,KAAK,QAAQ,QAAQ,EAAE;AACrC,kBAAI,UAAU,MAAM;AAElB;AAAA,cACF;AAAA,YACF;AAGA,gBAAIA,OAAM,UAAU,WAAW,MAAM;AAEnC,oBAAMC,YAAW,CAAC,GAAGD,MAAK;AAC1B,cAAAC,UAAS,KAAK,IAAI;AAClB,wBAAU,MAAM,SAASA,SAAQ,CAAC;AAClC,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AACf;AAAA,YACF;AAEA,kBAAM,WAAW,CAAC,GAAGD,MAAK;AAC1B,qBAAS,KAAK,IAAI;AAElB,kBAAM,cAAc,WAAW,GAAG,EAAE,GAAG;AACvC,sBAAU,MAAM,SAAS,QAAQ,CAAC;AAClC,gBAAI,kBAAkB,aAAa;AACjC,oBAAM,OAAO,iBAAiB,WAAW,KAAK,eAAe,CAAC,GAAG;AACjE,yBAAW,IAAI;AAAA,YACjB,OAAO;AACL,6BAAe,OAAO;AAAA,YACxB;AACA;AAAA,UACF;AAAA,UAEA,KAAK,cAAc;AACjB,kBAAM,EAAE,OAAO,OAAO,IAAI;AAC1B,gBAAI,CAACA,OAAM,KAAK,GAAG;AACjB;AAAA,YACF;AAEA,kBAAM,WAAWA,OAAM,OAAO,CAAC,GAAG,MAAM,MAAM,KAAK;AACnD,kBAAM,gBAAgB,WAAW,GAAG,KAAK,GAAG;AAC5C,kBAAM,WAAW,iBAAiB,WAAW,KAAK,eAAe,EAAE,GAAG;AAEtE,sBAAU,MAAM,SAAS,QAAQ,CAAC;AAClC,gBAAI,WAAW,aAAa;AAC1B,yBAAW,QAAQ;AAAA,YACrB,WAAW,WAAW,YAAY,WAAW,OAAO;AAClD,yBAAW,aAAa;AAAA,YAC1B;AACA;AAAA,UACF;AAAA,UAEA,KAAK,SAAS;AACZ,gBAAIA,OAAM,WAAW,GAAG;AACtB;AAAA,YACF;AAEA,gBAAI,OAAO,WAAW,eAAe,OAAO,WAAW,UAAU;AAC/D,wBAAU,MAAM,SAAS,CAAC,CAAC,CAAC;AAC5B,yBAAW,WAAW,GAAG,CAAC,GAAG,OAAO;AAAA,YACtC,OAAO;AACL,uBAAS,CAAC,CAAC;AAAA,YACb;AACA;AAAA,UACF;AAAA,UAEA,KAAK,SAAS;AACZ,kBAAM,EAAE,OAAO,YAAY,IAAI;AAC/B,kBAAM,iBAAiB,cAAc,WAAW;AAChD,gBAAI,CAAC,gBAAgB;AACnB;AAAA,YACF;AAEA,kBAAMA,SAAQ,eAAe,MAAM,GAAG,WAAW,IAAI;AAErD,sBAAU,MAAM,SAASA,MAAK,CAAC;AAC/B,uBAAW,WAAW,GAAGA,OAAM,SAAS,CAAC,GAAG,OAAO;AACnD;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,MACA,CAAC,YAAY,eAAe,UAAU,UAAU;AAAA,IAClD;AAGA,UAAM,oBAA0B,aAAO,UAAU;AACjD,IAAM,gBAAU,MAAM;AACpB,UAAI,CAAC,YAAY;AACf;AAAA,MACF;AAEA,UAAI,kBAAkB,SAAS,SAAS,WAAW,MAAM;AACvD,0BAAkB,UAAU;AAC5B,iBAAS,cAAc,MAAM,KAAK,EAAE,CAAC,CAAC;AAAA,MACxC;AAAA,IACF,GAAG,CAAC,eAAe,UAAU,YAAY,KAAK,CAAC;AAE/C,UAAM,iBAAuB,aAAyB,IAAI;AAE1D,UAAM,gBAAsB,aAAqC,IAAI;AACrE,UAAM,UAAgB,aAA8B,IAAI;AACxD,UAAM,eAAe,gBAAgB,cAAc,OAAO;AAE1D,UAAM,aAAa,WAAW,GAAG,CAAC,GAAG;AACrC,UAAM,aAAmB,kBAAY,MAAM;AACzC,UAAI;AACJ,UAAI,MAAM;AACR,cAAM,qBAAqB,QAAQ,SAAS,iBAAiB,UAAU,eAAe,IAAI;AAC1F,YAAI,cAAc,iBAAiB,GAAG;AACpC,wBAAc;AAAA,QAChB;AAAA,MACF,WAAW,eAAe,SAAS;AACjC,sBAAc,eAAe,QAAQ;AAAA,MACvC,WAAW,YAAY;AACrB,sBAAc,WAAW;AAAA,MAC3B;AAEA,aAAO,eAAe;AAAA,IACxB,GAAG,CAAC,MAAM,UAAU,CAAC;AAErB,UAAM,gBAAsB,kBAAY,MAAM;AAC5C,YAAM,cAAc,WAAW;AAC/B,mBAAa,cAAc;AAAA,IAC7B,GAAG,CAAC,UAAU,CAAC;AAEf,IAAM,gBAAU,MAAM;AACpB,YAAME,QAAO,WAAW;AACxB,UAAIA,OAAM;AACR,cAAM,QAAQ,6BAAM,SAAS,EAAE,MAAM,SAAS,QAAQ,QAAQ,CAAC,GAAjD;AACd,QAAAA,MAAK,iBAAiB,SAAS,KAAK;AACpC,eAAO,MAAMA,MAAK,oBAAoB,SAAS,KAAK;AAAA,MACtD;AAAA,IACF,GAAG,CAAC,UAAU,UAAU,CAAC;AAEzB,UAAM,eAAe,MAAM,KAAK,EAAE;AAClC,UAAM,WAAiB,aAAO,YAAY;AAC1C,UAAM,SAAS,WAAW;AAC1B,IAAM,gBAAU,MAAM;AACpB,YAAM,gBAAgB,SAAS;AAC/B,eAAS,UAAU;AACnB,UAAI,kBAAkB,cAAc;AAClC;AAAA,MACF;AAEA,UAAI,cAAc,MAAM,MAAM,CAAC,SAAS,SAAS,EAAE,KAAK,MAAM,WAAW,QAAQ;AAC/E,uBAAe,MAAM,KAAK,EAAE,CAAC;AAC7B,sBAAc;AAAA,MAChB;AAAA,IACF,GAAG,CAAC,eAAe,YAAY,cAAc,QAAQ,cAAc,KAAK,CAAC;AACzE,UAAM,aAAa,cAAc;AAEjC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA,8BAAC,WAAW,UAAX,EAAoB,OAAO,6BAA6B,OAAO,iBAC9D,8BAAC,WAAW,MAAX,EAAgB,OAAO,6BACtB;AAAA,UAAkB;AAAA,UAAjB;AAAA,YACC,SAAO;AAAA,YACN,GAAG;AAAA,YACJ;AAAA,YACA,KAAK;AAAA,YAEL;AAAA,cAAW,eAAK;AAAA,cAAf;AAAA,gBACE,GAAG;AAAA,gBACJ,MAAK;AAAA,gBACL,KAAK;AAAA,gBACL,SAAS;AAAA,kBACP;AAAA,kBACA,CAAC,UAAgD;AAC/C,0BAAM,eAAe;AACrB,0BAAM,cAAc,MAAM,cAAc,QAAQ,YAAY;AAC5D,6BAAS,EAAE,MAAM,SAAS,OAAO,YAAY,CAAC;AAAA,kBAChD;AAAA,gBACF;AAAA,gBAEC;AAAA;AAAA,YACH;AAAA;AAAA,QACF,GACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ,GAzSA;AA0SF;AAkBA,IAAM,kCAAkD,gBAAM,iBAG5D,gCAASC,iCACT,EAAE,6BAA6B,GAAG,MAAM,GACxC,cACA;AACA,QAAM,EAAE,OAAO,gBAAgB,KAAK,IAAI;AAAA,IACtC;AAAA,IACA;AAAA,EACF;AACA,QAAM,MAAM,gBAAgB,gBAAgB,YAAY;AACxD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,OAAO,MAAM,KAAK,EAAE,EAAE,KAAK;AAAA,MAC3B,cAAa;AAAA,MACb,WAAW;AAAA,MACX,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,UAAS;AAAA,MACT,YAAY;AAAA,MACX,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,UAAQ;AAAA;AAAA,EACV;AAEJ,GAzBE,kCAyBD;AA+BD,IAAM,4BAA4C,gBAAM,iBAGtD,gCAASC,2BACT;AAAA,EACE;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GACA,cACA;AAEA,QAAM;AAAA,IACJ,OAAO;AAAA,IACP,cAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,cAAc;AAAA,IACd,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,MAAM;AAAA,IACN,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,EACF;AACA,QAAM,EAAE,UAAU,eAAe,gBAAgB,YAAY,SAAS,IAAI;AAC1E,QAAM,aAAa,cAAc,2BAA2B;AAC5D,QAAM,wBAAwB,yBAAyB,2BAA2B;AAElF,QAAM,WAAiB,aAAyB,IAAI;AACpD,QAAM,CAAC,SAAS,UAAU,IAAU,eAAkC,IAAI;AAE1E,QAAM,QAAQ,cAAc,UAAU,WAAW,QAAQ,OAAO,IAAI;AACpE,QAAM,oBAAoB,aAAa,QAAQ;AAC/C,MAAI;AACJ,MAAI,qBAAqB,QAAQ,eAAe,QAAQ,MAAM,WAAW,GAAG;AAG1E,kBAAc,QAAQ,YAAY,KAAK;AAAA,EACzC;AAEA,QAAM,mBAAmB,gBAAgB,cAAc,UAAU,UAAU;AAC3E,QAAM,OAAO,QAAQ,MAAM,KAAK,KAAK;AAErC,QAAM,2BAAiC,aAAsB,IAAI;AACjE,EAAM,gBAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,yBAAyB,SAAS;AACpC,eAAO,aAAa,yBAAyB,OAAO;AAAA,MACtD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,aAAa,QAAQ,MAAM,KAAK,EAAE,EAAE,KAAK;AAC/C,QAAM,sBAAsB,MAAM,WAAW,QAAQ,CAAC,GAAG,WAAW,OAAO,CAAC,CAAC;AAC7E,QAAM,cAAc,SAAS;AAE7B,QAAM,aACJ,kBAAkB,uBACd,qBAAqB,cAAuC,IAC5D;AAEN,SACE,oBAAC,WAAW,UAAX,EAAoB,OAAO,6BAC1B;AAAA,IAAkB;AAAA,IAAjB;AAAA,MACE,GAAG;AAAA,MACJ,SAAO;AAAA,MACP,WAAW,CAAC,QAAQ,YAAY;AAAA,MAChC,QAAQ,UAAU;AAAA,MAEjB,WAAC,EAAE,YAAY,iBAAiB,MAAM;AACrC,cAAM,uBAAuB,aAAa,mBAAmB,UAAU;AACvE,eACE;AAAA,UAAW,eAAK;AAAA,UAAf;AAAA,YACC,KAAK;AAAA,YACL,MAAM,QAAQ;AAAA,YACd;AAAA,YACA,cAAY,aAAa,QAAQ,CAAC,OAAO,WAAW,IAAI;AAAA,YACxD,cAAc,uBAAuB,QAAQ,eAAe;AAAA,YAC5D,kBAAgB,uBAAuB,SAAY;AAAA,YACnD,iBAAe,uBAAuB,SAAY;AAAA,YAClD,0BAAwB,uBAAuB,SAAY;AAAA,YAC3D,iBAAe,uBAAuB,SAAY;AAAA,YAClD,WAAW,YAAY;AAAA,YACvB,WAAW,uBAAuB,WAAW,OAAO;AAAA,YACpD,SAAS,YAAY;AAAA,YACrB,UAAU,QAAQ;AAAA,YAClB,OAAO;AAAA,YACP;AAAA,YACA,wBAAqB;AAAA,YACrB,oBAAkB;AAAA,YACjB,GAAG;AAAA,YACJ,SAAS,qBAAqB,MAAM,SAAS,CAAC,UAAU;AACtD,oBAAM,cAAc,OAAO;AAAA,YAC7B,CAAC;AAAA,YACD,OAAO,qBAAqB,MAAM,OAAO,CAAC,UAAU;AAClD,oBAAM,eAAe,MAAM,cAAc;AACzC,kBAAI,iBAAiB,IAAI;AAMvB,8BAAc,UAAU,EAAE,MAAM,MAAM;AAGtC,yCAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,gCAAc,UAAU;AAAA,gBAC1B,GAAG,EAAE;AAAA,cACP;AAAA,YACF,CAAC;AAAA,YACD,SAAS,qBAAqB,MAAM,SAAS,CAAC,UAAU;AACtD,oBAAM,QAAQ,MAAM,cAAc;AAClC,kBAAI,MAAM,SAAS,GAAG;AAKpB,sBAAM,eAAe;AACrB,8BAAc,UAAU,EAAE,MAAM,qBAAqB;AACrD,yBAAS,EAAE,MAAM,SAAS,MAAM,CAAC;AACjC,yCAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,gCAAc,UAAU;AAAA,gBAC1B,GAAG,EAAE;AAAA,cACP;AAAA,YACF,CAAC;AAAA,YACD,UAAU,qBAAqB,MAAM,UAAU,CAAC,UAAU;AACxD,oBAAM,QAAQ,MAAM,OAAO;AAC3B,oBAAM,eAAe;AACrB,oBAAM,SAAS,cAAc;AAC7B,4BAAc,UAAU;AAExB,kBAAI,QAAQ;AACV,wBAAQ,OAAO,MAAM;AAAA,kBACnB,KAAK;AAIH,6BAAS,EAAE,MAAM,cAAc,OAAO,QAAQ,MAAM,CAAC;AACrD;AAAA,kBACF,KAAK;AAIH;AAAA,kBACF,KAAK,WAAW;AACd,wBAAI,OAAO,QAAQ,QAAQ;AAGzB;AAAA,oBACF;AAEA,0BAAM,aACJ,OAAO,QAAQ,gBAAgB,OAAO,WAAW,OAAO;AAC1D,wBAAI,OAAO,QAAQ,WAAW,YAAY;AACxC,+BAAS,EAAE,MAAM,SAAS,QAAQ,YAAY,CAAC;AAAA,oBACjD,OAAO;AACL,+BAAS,EAAE,MAAM,cAAc,OAAO,QAAQ,OAAO,IAAI,CAAC;AAAA,oBAC5D;AACA;AAAA,kBACF;AAAA,kBACA;AACE;AACA;AAAA,gBACJ;AAAA,cACF;AAGA,kBAAI,MAAM,OAAO,SAAS,OAAO;AAC/B,oBAAI,UAAU,IAAI;AAChB,sBAAI,SAAyC;AAC7C,sBAAI,aAAa,MAAM,WAAW,GAAG;AACnC,0BAAM,YAAY,MAAM,YAAY;AACpC,wBAAI,cAAc,yBAAyB;AACzC,+BAAS;AAAA,oBACX,WAAW,cAAc,eAAe;AACtC,+BAAS;AAAA,oBACX;AAAA,kBACF;AACA,2BAAS,EAAE,MAAM,cAAc,OAAO,OAAO,CAAC;AAAA,gBAChD,OAAO;AACL,2BAAS,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,MAAM,CAAC;AAAA,gBAC1D;AAAA,cACF,OAAO;AACL,sBAAMC,WAAU,MAAM;AACtB,kCAAkBA,SAAQ,KAAK;AAC/B,sCAAsB,MAAM;AAC1B,sBAAIA,SAAQ,cAAc,kBAAkBA,UAAS;AACnD,oBAAAA,SAAQ,OAAO;AAAA,kBACjB;AAAA,gBACF,CAAC;AAAA,cACH;AAAA,YACF,CAAC;AAAA,YACD,WAAW,qBAAqB,MAAM,WAAW,CAAC,UAAU;AAC1D,sBAAQ,MAAM,KAAK;AAAA,gBACjB,KAAK;AAAA,gBACL,KAAK;AAAA,gBACL,KAAK,aAAa;AAChB,wBAAM,eAAe,MAAM,cAAc;AAEzC,sBAAI,iBAAiB,IAAI;AAEvB,wBAAI,MAAM,QAAQ,SAAU;AAE5B,0BAAM,aAAa,MAAM,QAAQ,WAAW,MAAM,WAAW,MAAM;AACnE,wBAAI,YAAY;AACd,+BAAS,EAAE,MAAM,SAAS,QAAQ,YAAY,CAAC;AAAA,oBACjD,OAAO;AACL,4BAAMA,WAAU,MAAM;AACtB,4CAAsB,MAAM;AAC1B,mCAAW,WAAW,KAAKA,UAAS,EAAE,GAAG,OAAO;AAAA,sBAClD,CAAC;AAAA,oBACH;AAAA,kBACF,OAAO;AAOL,kCAAc,UAAU;AAAA,sBACtB,MAAM;AAAA,sBACN,KAAK,MAAM;AAAA,sBACX,SAAS,MAAM;AAAA,sBACf,SAAS,MAAM;AAAA,oBACjB;AAGA,6CAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,oCAAc,UAAU;AAAA,oBAC1B,GAAG,EAAE;AAAA,kBACP;AAEA;AAAA,gBACF;AAAA,gBACA,KAAK,SAAS;AACZ,wBAAM,eAAe;AACrB,0BAAQ,cAAc;AACtB;AAAA,gBACF;AAAA,gBACA,KAAK;AAAA,gBACL,KAAK,WAAW;AACd,sBAAI,QAAQ,gBAAgB,cAAc;AAGxC,0BAAM,eAAe;AAAA,kBACvB;AACA;AAAA,gBACF;AAAA;AAAA,gBAEA,SAAS;AACP,sBAAI,MAAM,cAAc,UAAU,MAAM,KAAK;AAG3C,0BAAMA,WAAU,MAAM;AACtB,0BAAM,eAAe;AACrB,+BAAW,WAAW,KAAKA,UAAS,CAAC,GAAG,OAAO;AAC/C;AAAA,kBACF;AAAA;AAAA,oBAEE,MAAM,cAAc;AAAA,oBAEpB,EACE,MAAM,cAAc,mBAAmB,KACvC,MAAM,cAAc,gBAAgB,QACpC,MAAM,cAAc,eAAe;AAAA,oBAErC;AACA,0BAAM,iBAAiB,MAAM;AAC7B,wBAAI,MAAM,IAAI,SAAS,KAAK,MAAM,QAAQ,KAAK;AAE7C;AAAA,oBACF,OAAO;AAIL,4BAAM,YAAY,WAAW,KAAK,MAAM,eAAe,CAAC,GAAG;AAC3D,4BAAM,YAAY,WAAW,GAAG,EAAE,GAAG;AACrC,0BAAI,cAAc,aAAa,MAAM,kBAAkB,WAAW;AAIhE,4BAAI,MAAM,cAAc,mBAAmB,GAAG;AAC5C,mCAAS,EAAE,MAAM,YAAY,MAAM,gBAAgB,OAAO,MAAM,CAAC;AAAA,wBACnE,OAAO;AACL,mCAAS;AAAA,4BACP,MAAM;AAAA,4BACN,MAAM;AAAA,4BACN,OAAO,QAAQ;AAAA,4BACf;AAAA,0BACF,CAAC;AAAA,wBACH;AAEA,sCAAc,UAAU;AAAA,0BACtB,MAAM;AAAA,0BACN,KAAK;AAAA,0BACL,SAAS,MAAM;AAAA,0BACf,SAAS,MAAM;AAAA,wBACjB;AACA,iDAAyB,UAAU,OAAO,WAAW,MAAM;AACzD,wCAAc,UAAU;AAAA,wBAC1B,GAAG,EAAE;AAAA,sBACP;AAAA,oBACF;AAAA,kBACF;AAAA,gBACF;AAAA,cACF;AAAA,YACF,CAAC;AAAA,YACD,eAAe,qBAAqB,MAAM,eAAe,CAAC,UAAU;AAClE,oBAAM,eAAe;AACrB,oBAAM,eAAe,KAAK,IAAI,OAAO,mBAAmB;AACxD,oBAAMA,WAAU,WAAW,GAAG,YAAY,GAAG;AAC7C,yBAAWA,QAAO;AAAA,YACpB,CAAC;AAAA;AAAA,QACH;AAAA,MAEJ;AAAA;AAAA,EACF,GACF;AAEJ,GAnUE,4BAmUD;AAoBD,SAAS,cAAc,SAAiE;AACtF,SAAO,SAAS,YAAY;AAC9B;AAFS;AAIT,SAAS,iBAAiB,OAAe;AACvC,SAAO,MAAM,QAAQ,OAAO,EAAE;AAChC;AAFS;AAIT,SAAS,WAAW,SAA8C;AAChE,MAAI,CAAC,QAAS;AACd,MAAI,QAAQ,cAAc,kBAAkB,SAAS;AAGnD,WAAO,sBAAsB,MAAM;AACjC,cAAQ,SAAS;AAAA,IACnB,CAAC;AAAA,EACH,OAAO;AACL,YAAQ,MAAM;AAAA,EAChB;AACF;AAXS;AAaT,SAAS,aAAa,OAAmC;AACvD,SAAO,MAAM,SAAS;AACxB;AAFS;",
|
|
6
6
|
"names": ["value", "newValue", "form", "OneTimePasswordFieldHiddenInput", "OneTimePasswordFieldInput", "element"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@radix-ui/react-one-time-password-field",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.13-rc.1784059564143",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"source": "./src/index.ts",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -13,17 +13,17 @@
|
|
|
13
13
|
"sideEffects": false,
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@radix-ui/primitive": "1.1.5",
|
|
16
|
-
"@radix-ui/react-collection": "1.1.12",
|
|
17
16
|
"@radix-ui/react-compose-refs": "1.1.3",
|
|
17
|
+
"@radix-ui/react-collection": "1.1.12",
|
|
18
18
|
"@radix-ui/react-context": "1.2.0",
|
|
19
|
-
"@radix-ui/react-direction": "1.1.2",
|
|
20
19
|
"@radix-ui/number": "1.1.2",
|
|
20
|
+
"@radix-ui/react-direction": "1.1.2",
|
|
21
21
|
"@radix-ui/react-primitive": "2.1.7",
|
|
22
|
-
"@radix-ui/react-
|
|
23
|
-
"@radix-ui/react-
|
|
22
|
+
"@radix-ui/react-use-controllable-state": "1.2.3",
|
|
23
|
+
"@radix-ui/react-roving-focus": "1.1.16-rc.1784059564143",
|
|
24
24
|
"@radix-ui/react-use-is-hydrated": "0.1.1",
|
|
25
|
-
"@radix-ui/react-use-
|
|
26
|
-
"@radix-ui/react-use-
|
|
25
|
+
"@radix-ui/react-use-effect-event": "0.0.3",
|
|
26
|
+
"@radix-ui/react-use-layout-effect": "1.1.2"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@types/react": "^19.2.2",
|
|
@@ -193,7 +193,11 @@ interface OneTimePasswordFieldProps
|
|
|
193
193
|
OneTimePasswordFieldOwnProps,
|
|
194
194
|
Omit<Primitive.PrimitivePropsWithRef<'div'>, keyof OneTimePasswordFieldOwnProps> {}
|
|
195
195
|
|
|
196
|
-
const OneTimePasswordField = React.forwardRef<
|
|
196
|
+
const OneTimePasswordField = /* @__PURE__ */ React.forwardRef<
|
|
197
|
+
HTMLDivElement,
|
|
198
|
+
OneTimePasswordFieldProps
|
|
199
|
+
>(
|
|
200
|
+
// blank line to reduce diff noise
|
|
197
201
|
function OneTimePasswordFieldImpl(
|
|
198
202
|
{
|
|
199
203
|
__scopeOneTimePasswordField,
|
|
@@ -510,7 +514,7 @@ interface OneTimePasswordFieldHiddenInputProps extends Omit<
|
|
|
510
514
|
| 'autoFocus'
|
|
511
515
|
> {}
|
|
512
516
|
|
|
513
|
-
const OneTimePasswordFieldHiddenInput = React.forwardRef<
|
|
517
|
+
const OneTimePasswordFieldHiddenInput = /* @__PURE__ */ React.forwardRef<
|
|
514
518
|
HTMLInputElement,
|
|
515
519
|
OneTimePasswordFieldHiddenInputProps
|
|
516
520
|
>(function OneTimePasswordFieldHiddenInput(
|
|
@@ -569,7 +573,7 @@ interface OneTimePasswordFieldInputProps extends Omit<
|
|
|
569
573
|
index?: number;
|
|
570
574
|
}
|
|
571
575
|
|
|
572
|
-
const OneTimePasswordFieldInput = React.forwardRef<
|
|
576
|
+
const OneTimePasswordFieldInput = /* @__PURE__ */ React.forwardRef<
|
|
573
577
|
HTMLInputElement,
|
|
574
578
|
OneTimePasswordFieldInputProps
|
|
575
579
|
>(function OneTimePasswordFieldInput(
|