@12-apps/ui 6.100.0 → 6.101.0

package/dist/form/AddressAutocomplete.js

@@ -1,21 +1,21 @@
 import "../chunk-573PQ6C6.js";
 import {
   AddressAutocomplete
-} from "../chunk-R775ISK6.js";
+} from "../chunk-2L6TANRY.js";
+import "../chunk-FKUVFPQZ.js";
 import "../chunk-IU2WSJ4F.js";
-import "../chunk-4RSFYS2V.js";
-import "../chunk-4X2TOMK6.js";
+import "../chunk-X6D5JEUV.js";
+import "../chunk-EIOGJBJ5.js";
+import "../chunk-P5JCOFK3.js";
+import "../chunk-NYA26GV2.js";
+import "../chunk-L7N4AFZD.js";
 import "../chunk-44FY2YZL.js";
 import "../chunk-6JKECOZ2.js";
 import "../chunk-6HLWZR3X.js";
 import "../chunk-QVYBRD6U.js";
 import "../chunk-NNKIM73H.js";
 import "../chunk-O7QPPJAK.js";
-import "../chunk-EIOGJBJ5.js";
-import "../chunk-P5JCOFK3.js";
-import "../chunk-NYA26GV2.js";
 import "../chunk-DDNUPFPE.js";
-import "../chunk-L7N4AFZD.js";
 import "../chunk-LL2BWQPM.js";
 import "../chunk-DVRNW33K.js";
 import "../chunk-RGVNXES5.js";

package/dist/form/Autocomplete.js

@@ -4,8 +4,8 @@ import {
   Autocomplete_default
 } from "../chunk-CFDWKQZT.js";
 import "../chunk-SY5FYBAF.js";
-import "../chunk-SAKSIN7E.js";
 import "../chunk-PELRSZFU.js";
+import "../chunk-SAKSIN7E.js";
 import "../chunk-JXS56EW5.js";
 import "../chunk-RGVNXES5.js";
 import "../chunk-GDN2LUTZ.js";

package/dist/form/Calendar.js

@@ -1,20 +1,20 @@
 import "../chunk-BO6S47KI.js";
 import {
   Calendar
-} from "../chunk-YQMJJ7AL.js";
-import "../chunk-ZDLC4BN4.js";
+} from "../chunk-6G2RAZTS.js";
 import "../chunk-ZZGG6AUD.js";
 import "../chunk-4I2SDWSF.js";
 import "../chunk-LZOCNAUA.js";
-import "../chunk-F7JRQ2EI.js";
-import "../chunk-J6LIZXSF.js";
+import "../chunk-ZDLC4BN4.js";
+import "../chunk-5YX2VQFP.js";
 import "../chunk-66TCKXOB.js";
-import "../chunk-WQEGPSGD.js";
 import "../chunk-WN6LR4HX.js";
 import "../chunk-UXYCBPCE.js";
 import "../chunk-X5GCAXZS.js";
 import "../chunk-3PWDVJWD.js";
+import "../chunk-WQEGPSGD.js";
 import "../chunk-JV2JIUDT.js";
+import "../chunk-J6LIZXSF.js";
 import "../chunk-QWOI5BZV.js";
 import "../chunk-LL2BWQPM.js";
 import "../chunk-VWKMN3ZZ.js";

package/dist/form/CategorySelect.js

@@ -1,19 +1,19 @@
 import "../chunk-N5ZWC6CB.js";
 import {
   CategorySelect
-} from "../chunk-MKHNLRVX.js";
-import "../chunk-FZZMNKVF.js";
-import "../chunk-WDSJ6SVY.js";
-import "../chunk-PGGYZU7Q.js";
+} from "../chunk-VPPD2AJN.js";
 import "../chunk-QYY37ECA.js";
+import "../chunk-6TAPAIRR.js";
 import "../chunk-5F7HYYGM.js";
-import "../chunk-S5VIN3EB.js";
 import "../chunk-Y46R26TE.js";
+import "../chunk-WDSJ6SVY.js";
+import "../chunk-GHP5JLL3.js";
+import "../chunk-S5VIN3EB.js";
+import "../chunk-PGGYZU7Q.js";
 import "../chunk-RZVUY2MO.js";
 import "../chunk-USJPZ5Q7.js";
-import "../chunk-XHHR6G35.js";
 import "../chunk-R2AZOWEZ.js";
-import "../chunk-GHP5JLL3.js";
+import "../chunk-XHHR6G35.js";
 import "../chunk-VPGDYI63.js";
 import "../chunk-DMNZD3Q7.js";
 import {

package/dist/form/CodeEditor.js

@@ -1,13 +1,13 @@
 import "../chunk-IDMG332I.js";
 import {
   CodeEditor
-} from "../chunk-Z2J4MRTF.js";
+} from "../chunk-MKNW4FRR.js";
+import "../chunk-3TVUW7QE.js";
 import "../chunk-OXXIGHZK.js";
 import {
   configureCodeEditor
 } from "../chunk-EYDQV55H.js";
 import "../chunk-X3OWMTLO.js";
-import "../chunk-3TVUW7QE.js";
 import "../chunk-GDN2LUTZ.js";
 import "../chunk-7ZADLRLP.js";
 import "../chunk-3NGE6NE6.js";

package/dist/form/DateRangePicker.js

@@ -1,7 +1,8 @@
 import "../chunk-BN6POCYF.js";
 import {
   DateRangePicker
-} from "../chunk-KNW63H63.js";
+} from "../chunk-6PQZIZMN.js";
+import "../chunk-EASEJDBQ.js";
 import {
   DEFAULT_QUICK_RANGES,
   DEFAULT_QUICK_RANGE_LABELS,
@@ -9,30 +10,29 @@ import {
   createQuickRanges
 } from "../chunk-R26WP22N.js";
 import "../chunk-K62L5JFC.js";
-import "../chunk-SIY64A6O.js";
-import "../chunk-QAF76E6U.js";
-import "../chunk-6KKQHJE7.js";
-import "../chunk-EASEJDBQ.js";
 import {
   resolveDayRange
 } from "../chunk-IXXB7CTR.js";
+import "../chunk-SIY64A6O.js";
+import "../chunk-QAF76E6U.js";
+import "../chunk-6KKQHJE7.js";
 import "../chunk-VCYYL23C.js";
 import "../chunk-SUTOAW7I.js";
 import "../chunk-BO6S47KI.js";
-import "../chunk-YQMJJ7AL.js";
-import "../chunk-ZDLC4BN4.js";
+import "../chunk-6G2RAZTS.js";
 import "../chunk-ZZGG6AUD.js";
 import "../chunk-4I2SDWSF.js";
 import "../chunk-LZOCNAUA.js";
-import "../chunk-F7JRQ2EI.js";
-import "../chunk-J6LIZXSF.js";
+import "../chunk-ZDLC4BN4.js";
+import "../chunk-5YX2VQFP.js";
 import "../chunk-66TCKXOB.js";
-import "../chunk-WQEGPSGD.js";
 import "../chunk-WN6LR4HX.js";
 import "../chunk-UXYCBPCE.js";
 import "../chunk-X5GCAXZS.js";
 import "../chunk-3PWDVJWD.js";
+import "../chunk-WQEGPSGD.js";
 import "../chunk-JV2JIUDT.js";
+import "../chunk-J6LIZXSF.js";
 import "../chunk-QWOI5BZV.js";
 import "../chunk-LL2BWQPM.js";
 import "../chunk-HDBP55R3.js";

package/dist/form/InputOTP.js

@@ -1,9 +1,11 @@
 import "../chunk-3VMXOGGI.js";
 import {
   InputOTP
-} from "../chunk-QZOQVJ5L.js";
-import "../chunk-NQYC7V5N.js";
-import "../chunk-R6L376KR.js";
+} from "../chunk-645GGNTW.js";
+import "../chunk-BAYCMSMI.js";
+import "../chunk-VAHJCRNW.js";
+import "../chunk-M6R32IBO.js";
+import "../chunk-IH6DZXTG.js";
 import "../chunk-HPK33ACY.js";
 import "../chunk-RGVNXES5.js";
 import "../chunk-GDN2LUTZ.js";

package/dist/form/total-form.js

@@ -9,7 +9,7 @@ import {
 } from "../chunk-CPAJYJUD.js";
 import {
   Fields_exports
-} from "../chunk-HAWOS4SF.js";
+} from "../chunk-TPDN3B5T.js";
 import "../chunk-RLTYBV4N.js";
 import {
   TextField
@@ -20,7 +20,7 @@ import {
 import "../chunk-QZRWOF4R.js";
 import {
   CategoryField
-} from "../chunk-ERAMSYPR.js";
+} from "../chunk-7N4O632I.js";
 import {
   FormContext,
   useFormContext
@@ -42,19 +42,19 @@ import "../chunk-QYKDY4EI.js";
 import "../chunk-ZJY7OK6H.js";
 import "../chunk-ZLMKGVB2.js";
 import "../chunk-N5ZWC6CB.js";
-import "../chunk-MKHNLRVX.js";
-import "../chunk-FZZMNKVF.js";
-import "../chunk-WDSJ6SVY.js";
-import "../chunk-PGGYZU7Q.js";
+import "../chunk-VPPD2AJN.js";
 import "../chunk-QYY37ECA.js";
+import "../chunk-6TAPAIRR.js";
 import "../chunk-5F7HYYGM.js";
-import "../chunk-S5VIN3EB.js";
 import "../chunk-Y46R26TE.js";
+import "../chunk-WDSJ6SVY.js";
+import "../chunk-GHP5JLL3.js";
+import "../chunk-S5VIN3EB.js";
+import "../chunk-PGGYZU7Q.js";
 import "../chunk-RZVUY2MO.js";
 import "../chunk-USJPZ5Q7.js";
-import "../chunk-XHHR6G35.js";
 import "../chunk-R2AZOWEZ.js";
-import "../chunk-GHP5JLL3.js";
+import "../chunk-XHHR6G35.js";
 import "../chunk-VPGDYI63.js";
 import "../chunk-DMNZD3Q7.js";
 import "../chunk-PN4HVM43.js";

package/dist/native/form/InputOTP.js

@@ -0,0 +1,192 @@
+import {
+  resolveFieldEdge
+} from "../chunks/chunk-3JBZE4I6.js";
+import {
+  webAria,
+  webDisabled
+} from "../chunks/chunk-DN73KYIZ.js";
+import {
+  useUiTheme
+} from "../chunks/chunk-ZYSOBULX.js";
+import {
+  fieldHeightPx
+} from "../chunks/chunk-DNTO2D5M.js";
+
+// src/components/form/InputOTP/InputOTP.native.tsx
+import * as React from "react";
+import { Platform, StyleSheet, TextInput, View } from "react-native";
+
+// src/components/form/InputOTP/InputOTP.hooks.native.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+
+// src/components/form/InputOTP/InputOTP.core.ts
+var PATTERNS = {
+  numeric: /^\d*$/,
+  alphanumeric: /^[a-zA-Z0-9]*$/
+};
+var isAllowed = (variant, text) => (PATTERNS[variant] ?? /.*/).test(text);
+var padTo = (digits, length) => Array.from({ length }, (_, i) => digits[i] ?? "");
+function firstSlotFill(variant, index, inputValue, current) {
+  if (variant !== "numeric" || index !== 0 || inputValue.length < 2) return null;
+  const overtype = inputValue.length === 2 && current !== "" && inputValue.includes(current);
+  return overtype ? "overtype" : "code";
+}
+var codeOfFill = (inputValue, current, length) => inputValue.length > length && current !== "" && inputValue.startsWith(current) ? inputValue.slice(1) : inputValue;
+
+// src/components/form/InputOTP/InputOTP.hooks.native.ts
+var useNativeOtpDigits = ({ variant, length, value, onChange, onComplete }) => {
+  const [digits, setDigits] = useState(() => padTo([], length));
+  const boxRefs = useRef([]);
+  useEffect(() => {
+    setDigits(padTo(value.split("").slice(0, length), length));
+  }, [value, length]);
+  const focusBox = useCallback((index) => boxRefs.current[index]?.focus(), []);
+  const publish = useCallback(
+    (next) => {
+      onChange?.(next);
+      if (next.length === length) onComplete?.(next);
+    },
+    [length, onChange, onComplete]
+  );
+  const spread = useCallback(
+    (text) => {
+      const code = text.slice(0, length);
+      if (!code || !isAllowed(variant, code)) return;
+      setDigits(padTo(code.split(""), length));
+      publish(code);
+      focusBox(Math.min(code.length, length - 1));
+    },
+    [variant, length, publish, focusBox]
+  );
+  const handleChangeText = useCallback(
+    (index, text) => {
+      const fill = firstSlotFill(variant === "alphanumeric" ? "numeric" : variant, index, text, digits[0] ?? "");
+      if (fill) return fill === "code" ? spread(codeOfFill(text, digits[0] ?? "", length)) : void 0;
+      if (!isAllowed(variant, text)) return;
+      const next = [...digits];
+      next[index] = text.slice(-1);
+      setDigits(next);
+      publish(next.join(""));
+      if (text && index < length - 1) focusBox(index + 1);
+    },
+    [variant, digits, length, publish, focusBox, spread]
+  );
+  const handleKey = useCallback(
+    (index, key) => {
+      if (key === "Backspace" && !digits[index] && index > 0) focusBox(index - 1);
+    },
+    [digits, focusBox]
+  );
+  return { digits, boxRefs, handleChangeText, handleKey };
+};
+
+// src/components/form/InputOTP/InputOTP.metrics.ts
+var OTP_FONT_PX = {
+  xs: 12,
+  sm: 14,
+  md: 16,
+  lg: 18,
+  xl: 20
+};
+var OTP_GAP_PX = 8;
+var OTP_BORDER = { rest: 1, focused: 2 };
+
+// src/components/form/InputOTP/InputOTP.native.tsx
+import { jsx } from "react/jsx-runtime";
+var PALETTE_KEYS = ["primary", "secondary", "success", "warning", "info", "danger", "neutral"];
+function accentOf(theme, color) {
+  const key = PALETTE_KEYS.find((candidate) => candidate === color) ?? "primary";
+  return theme.palette[key].main;
+}
+function keypadProps(variant, index) {
+  if (variant !== "numeric") return { autoCapitalize: "none", autoCorrect: false, spellCheck: false };
+  const fill = index === 0 ? Platform.select({
+    ios: { textContentType: "oneTimeCode", autoComplete: "one-time-code" },
+    android: { autoComplete: "sms-otp" },
+    default: { autoComplete: "one-time-code" }
+  }) : {};
+  return { keyboardType: "number-pad", inputMode: "numeric", ...fill };
+}
+var boxMaxLength = (variant, index, length) => variant !== "masked" && index === 0 ? length + 1 : 1;
+function boxStyle(theme, size, accent, state) {
+  const side = fieldHeightPx(theme.fieldHeight, size);
+  const edge = resolveFieldEdge(theme.palette.divider, theme.palette.background.paper);
+  const borderColor = state.error ? theme.palette.danger.main : state.disabled ? theme.palette.action.disabled : state.focused ? accent : edge;
+  return {
+    width: side,
+    height: side,
+    borderRadius: theme.radius.field,
+    borderWidth: state.focused ? OTP_BORDER.focused : OTP_BORDER.rest,
+    borderColor,
+    backgroundColor: theme.palette.background.paper,
+    color: state.disabled ? theme.palette.text.disabled : theme.palette.text.primary,
+    fontFamily: theme.typography.fontFamily,
+    fontSize: OTP_FONT_PX[size],
+    fontWeight: "600",
+    textAlign: "center",
+    padding: 0
+  };
+}
+var InputOTP = React.forwardRef((props, ref) => {
+  const {
+    variant = "numeric",
+    color = "primary",
+    size = "md",
+    length = 6,
+    value = "",
+    onChange,
+    onComplete,
+    autoFocus = false,
+    error = false,
+    disabled = false,
+    dataTestId,
+    style,
+    "aria-label": ariaLabel
+  } = props;
+  const theme = useUiTheme();
+  const accent = accentOf(theme, color);
+  const [focusedIndex, setFocusedIndex] = React.useState(null);
+  const { digits, boxRefs, handleChangeText, handleKey } = useNativeOtpDigits({
+    variant,
+    length,
+    value,
+    onChange,
+    onComplete
+  });
+  return /* @__PURE__ */ jsx(View, { ref, testID: dataTestId, role: "group", "aria-label": ariaLabel, style: [styles.row, style], children: digits.map((digit, index) => /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      ref: (element) => {
+        boxRefs.current[index] = element;
+      },
+      testID: dataTestId ? `${dataTestId}-slot-${index}` : void 0,
+      value: variant === "masked" ? digit ? "\u2022" : "" : digit,
+      onChangeText: (text) => handleChangeText(index, text),
+      onKeyPress: (event) => handleKey(index, event.nativeEvent.key),
+      onFocus: () => setFocusedIndex(index),
+      onBlur: () => setFocusedIndex((current) => current === index ? null : current),
+      autoFocus: autoFocus && index === 0,
+      editable: !disabled,
+      "aria-disabled": disabled,
+      ...webAria({ "aria-invalid": error }),
+      maxLength: boxMaxLength(variant, index, length),
+      style: boxStyle(theme, size, accent, { focused: focusedIndex === index && !disabled, error, disabled }),
+      ...webDisabled(disabled),
+      ...keypadProps(variant, index)
+    },
+    index
+  )) });
+});
+InputOTP.displayName = "InputOTP";
+var styles = StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: OTP_GAP_PX
+  }
+});
+export {
+  InputOTP
+};
+//# sourceMappingURL=InputOTP.js.map

package/dist/native/form/InputOTP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/form/InputOTP/InputOTP.native.tsx","../../../src/components/form/InputOTP/InputOTP.hooks.native.ts","../../../src/components/form/InputOTP/InputOTP.core.ts","../../../src/components/form/InputOTP/InputOTP.metrics.ts"],"sourcesContent":["import * as React from 'react';\nimport { Platform, StyleSheet, TextInput, View, type TextInputProps, type TextStyle } from 'react-native';\n\nimport { useNativeOtpDigits } from './InputOTP.hooks.native';\nimport { OTP_BORDER, OTP_FONT_PX, OTP_GAP_PX } from './InputOTP.metrics';\nimport type { InputOTPProps } from './InputOTP.types.native';\nimport { webAria, webDisabled } from '../../../platform/aria';\nimport { resolveFieldEdge } from '../../../tokens/field-edge.core';\nimport { fieldHeightPx } from '../../../tokens/field-height.core';\nimport type { UiPaletteKey, UiTheme } from '../../../tokens/theme';\nimport type { SizeValue } from '../../../tokens/vocabulary';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\n\nconst PALETTE_KEYS: readonly UiPaletteKey[] = ['primary', 'secondary', 'success', 'warning', 'info', 'danger', 'neutral'];\n\n/** The palette slot a `color` names; anything else is `primary`, as on the web. */\nfunction accentOf(theme: UiTheme, color: string): string {\n  const key = PALETTE_KEYS.find((candidate) => candidate === color) ?? 'primary';\n  return theme.palette[key].main;\n}\n\n/**\n * The keypad and the one-time-code fill, the web's `keypadProps` in React\n * Native's words: digits only for `numeric`, and on the FIRST box the hint that\n * lets the phone offer the code from an SMS — `oneTimeCode` on iOS,\n * `sms-otp` on Android.\n */\nfunction keypadProps(variant: string, index: number): Partial<TextInputProps> {\n  // A code is not prose: no capital on the first letter, no autocorrect.\n  if (variant !== 'numeric') return { autoCapitalize: 'none', autoCorrect: false, spellCheck: false };\n  const fill: Partial<TextInputProps> =\n    index === 0\n      ? Platform.select<Partial<TextInputProps>>({\n          ios: { textContentType: 'oneTimeCode', autoComplete: 'one-time-code' },\n          android: { autoComplete: 'sms-otp' },\n          default: { autoComplete: 'one-time-code' },\n        })\n      : {};\n  return { keyboardType: 'number-pad', inputMode: 'numeric', ...fill };\n}\n\n/** The first box takes a whole code in one change (see the web's `slotMaxLength`), except `masked`'s. */\nconst boxMaxLength = (variant: string, index: number, length: number): number =>\n  variant !== 'masked' && index === 0 ? length + 1 : 1;\n\ninterface BoxState {\n  focused: boolean;\n  error: boolean;\n  disabled: boolean;\n}\n\n/** One box's paint: the web slot's square, border and type, from the same numbers. */\nfunction boxStyle(theme: UiTheme, size: SizeValue, accent: string, state: BoxState): TextStyle {\n  const side = fieldHeightPx(theme.fieldHeight, size);\n  const edge = resolveFieldEdge(theme.palette.divider, theme.palette.background.paper);\n  // Error and disabled outrank focus, as in MUI's outlined input (and the native `Input`).\n  const borderColor = state.error\n    ? theme.palette.danger.main\n    : state.disabled\n      ? theme.palette.action.disabled\n      : state.focused\n        ? accent\n        : edge;\n  return {\n    width: side,\n    height: side,\n    borderRadius: theme.radius.field,\n    borderWidth: state.focused ? OTP_BORDER.focused : OTP_BORDER.rest,\n    borderColor,\n    backgroundColor: theme.palette.background.paper,\n    color: state.disabled ? theme.palette.text.disabled : theme.palette.text.primary,\n    fontFamily: theme.typography.fontFamily,\n    fontSize: OTP_FONT_PX[size],\n    fontWeight: '600',\n    textAlign: 'center',\n    padding: 0,\n  };\n}\n\n/**\n * The native `InputOTP`: one row of boxes, one character each, that moves\n * forward as it is typed, steps back on Backspace in an empty box, and spreads\n * a code the phone fills (or a paste) across every box from the first.\n *\n * The same props as the web one; the row is a `group` named by `aria-label`,\n * each box is `${dataTestId}-slot-${index}`. Gaps against the web:\n * `NATIVE-NOTES.md`.\n */\nexport const InputOTP = React.forwardRef<View, InputOTPProps>((props, ref) => {\n  const {\n    variant = 'numeric',\n    color = 'primary',\n    size = 'md',\n    length = 6,\n    value = '',\n    onChange,\n    onComplete,\n    autoFocus = false,\n    error = false,\n    disabled = false,\n    dataTestId,\n    style,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const theme = useUiTheme();\n  const accent = accentOf(theme, color);\n  const [focusedIndex, setFocusedIndex] = React.useState<number | null>(null);\n  const { digits, boxRefs, handleChangeText, handleKey } = useNativeOtpDigits({\n    variant,\n    length,\n    value,\n    onChange,\n    onComplete,\n  });\n\n  return (\n    <View ref={ref} testID={dataTestId} role=\"group\" aria-label={ariaLabel} style={[styles.row, style]}>\n      {digits.map((digit, index) => (\n        <TextInput\n          key={index}\n          ref={(element) => {\n            boxRefs.current[index] = element;\n          }}\n          testID={dataTestId ? `${dataTestId}-slot-${index}` : undefined}\n          value={variant === 'masked' ? (digit ? '•' : '') : digit}\n          onChangeText={(text) => handleChangeText(index, text)}\n          onKeyPress={(event) => handleKey(index, event.nativeEvent.key)}\n          onFocus={() => setFocusedIndex(index)}\n          onBlur={() => setFocusedIndex((current) => (current === index ? null : current))}\n          autoFocus={autoFocus && index === 0}\n          editable={!disabled}\n          aria-disabled={disabled}\n          {...webAria({ 'aria-invalid': error })}\n          maxLength={boxMaxLength(variant, index, length)}\n          style={boxStyle(theme, size, accent, { focused: focusedIndex === index && !disabled, error, disabled })}\n          {...webDisabled(disabled)}\n          {...keypadProps(variant, index)}\n        />\n      ))}\n    </View>\n  );\n});\n\nInputOTP.displayName = 'InputOTP';\n\nconst styles = StyleSheet.create({\n  row: {\n    flexDirection: 'row',\n    justifyContent: 'center',\n    alignItems: 'center',\n    gap: OTP_GAP_PX,\n  },\n});\n","import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { codeOfFill, firstSlotFill, isAllowed, padTo } from './InputOTP.core';\n\n/** What a box needs from the element behind it: to take the focus. */\ninterface Focusable {\n  focus: () => void;\n}\n\ninterface NativeOtpInput {\n  variant: string;\n  length: number;\n  value: string;\n  onChange?: (value: string) => void;\n  onComplete?: (value: string) => void;\n}\n\n/**\n * The native boxes' digits — the web hook's rules (`InputOTP.hooks.ts`) over\n * React Native's events: `onChangeText` carries the box's whole new text and\n * `onKeyPress` carries only the key's name, and there is no paste event at\n * all. A pasted or SMS-filled code arrives as a change of the FIRST box, whose\n * `maxLength` is the code's length plus one for exactly that reason, and is\n * spread across the boxes by the same `firstSlotFill` / `codeOfFill` the web\n * uses.\n */\nexport const useNativeOtpDigits = ({ variant, length, value, onChange, onComplete }: NativeOtpInput) => {\n  const [digits, setDigits] = useState<string[]>(() => padTo([], length));\n  const boxRefs = useRef<(Focusable | null)[]>([]);\n\n  useEffect(() => {\n    setDigits(padTo(value.split('').slice(0, length), length));\n  }, [value, length]);\n\n  const focusBox = useCallback((index: number) => boxRefs.current[index]?.focus(), []);\n\n  const publish = useCallback(\n    (next: string) => {\n      onChange?.(next);\n      if (next.length === length) onComplete?.(next);\n    },\n    [length, onChange, onComplete],\n  );\n\n  /** A whole code laid across the boxes from the first one. */\n  const spread = useCallback(\n    (text: string) => {\n      const code = text.slice(0, length);\n      if (!code || !isAllowed(variant, code)) return;\n      setDigits(padTo(code.split(''), length));\n      publish(code);\n      focusBox(Math.min(code.length, length - 1));\n    },\n    [variant, length, publish, focusBox],\n  );\n\n  const handleChangeText = useCallback(\n    (index: number, text: string) => {\n      // The web's paste spreads a code for EVERY variant; React Native has no\n      // paste event, so a code arrives as a change of the first box, read by\n      // the numeric rule for `alphanumeric` too (`masked` shows a bullet, whose\n      // text no longer holds the digit it hides: it keeps one character a box).\n      const fill = firstSlotFill(variant === 'alphanumeric' ? 'numeric' : variant, index, text, digits[0] ?? '');\n      if (fill) return fill === 'code' ? spread(codeOfFill(text, digits[0] ?? '', length)) : undefined;\n      if (!isAllowed(variant, text)) return;\n      const next = [...digits];\n      next[index] = text.slice(-1);\n      setDigits(next);\n      publish(next.join(''));\n      if (text && index < length - 1) focusBox(index + 1);\n    },\n    [variant, digits, length, publish, focusBox, spread],\n  );\n\n  /** Backspace in a box that is already empty steps back to the one before. */\n  const handleKey = useCallback(\n    (index: number, key: string) => {\n      if (key === 'Backspace' && !digits[index] && index > 0) focusBox(index - 1);\n    },\n    [digits, focusBox],\n  );\n\n  return { digits, boxRefs, handleChangeText, handleKey };\n};\n","/**\n * The digits' arithmetic, shared by both renderers' hooks (`InputOTP.hooks.ts`\n * on the web, `InputOTP.hooks.native.ts` on React Native). Pure: no React, no\n * DOM, no react-native.\n */\n\n/**\n * What each variant accepts. `masked` constrains nothing — it only changes what\n * is drawn — so it has no pattern here.\n */\nexport const PATTERNS: Record<string, RegExp> = {\n  numeric: /^\\d*$/,\n  alphanumeric: /^[a-zA-Z0-9]*$/,\n};\n\n/** Whether `text` is something this variant will take. */\nexport const isAllowed = (variant: string, text: string) => (PATTERNS[variant] ?? /.*/).test(text);\n\n/** The digit array is always `length` long, blank-padded on the right. */\nexport const padTo = (digits: string[], length: number) =>\n  Array.from({ length }, (_, i) => digits[i] ?? '');\n\n/**\n * What a change to the numeric FIRST slot is, now that its `maxLength` is the\n * code's length rather than 1 (FUT-4144).\n *\n * That slot carries `one-time-code`, and the phone's SMS fill (or a password\n * manager) writes the WHOLE code into it as one change, not a paste — kept to\n * one character, the code lost every digit but the last. So:\n *\n * - `overtype`: a keystroke into the already-filled slot (its old character\n *   plus the new one). Ignored, exactly as `maxLength={1}` refused it before.\n * - `code`: anything else longer than one character, written in one go.\n *   Spread across the slots like a paste.\n *\n * Every other slot and variant keeps `maxLength={1}` and never gets here.\n */\nexport function firstSlotFill(variant: string, index: number, inputValue: string, current: string) {\n  if (variant !== 'numeric' || index !== 0 || inputValue.length < 2) return null;\n  const overtype = inputValue.length === 2 && current !== '' && inputValue.includes(current);\n  return overtype ? 'overtype' : 'code';\n}\n\n/**\n * The code inside a first-slot fill. A phone that INSERTS the SMS code at the\n * caret rather than replacing the slot leaves the digit already there in\n * front: `4` + `482913` arrives as `4482913`, which spread as-is would give\n * `448291`. Longer than the code and led by that digit: the digit is dropped.\n */\nexport const codeOfFill = (inputValue: string, current: string, length: number): string =>\n  inputValue.length > length && current !== '' && inputValue.startsWith(current) ? inputValue.slice(1) : inputValue;\n","/**\n * The numbers both renderers read (see `NATIVE.md`, \"Numbers\").\n *\n * Each box's type size, in design px, per size step; its side is the theme's\n * field height for that step (a square), its weight 600.\n */\nexport const OTP_FONT_PX: Record<'xs' | 'sm' | 'md' | 'lg' | 'xl', number> = {\n  xs: 12,\n  sm: 14,\n  md: 16,\n  lg: 18,\n  xl: 20,\n};\n\n/** The gap between two boxes: MUI's `gap: 1`, one 8px spacing unit. */\nexport const OTP_GAP_PX = 8;\n\n/** The border: 1px at rest, 2px focused (MUI's focused outline). */\nexport const OTP_BORDER = { rest: 1, focused: 2 } as const;\n"],"mappings":"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","names":[]}

package/dist/navigation/AppHeader.js

@@ -1,7 +1,7 @@
 import "../chunk-5CUKSNWG.js";
 import {
   AppHeaderDetails
-} from "../chunk-VMACQT3T.js";
+} from "../chunk-XH7UDC5Y.js";
 import {
   AppHeader,
   AppHeader_default
@@ -18,19 +18,19 @@ import {
   highlightOf,
   initialsOf
 } from "../chunk-IQU4HKND.js";
-import "../chunk-7TENMQNQ.js";
+import "../chunk-XZMSRHFD.js";
+import "../chunk-3ROCD7XF.js";
 import "../chunk-LYVTJLCF.js";
 import "../chunk-CRN4KKNI.js";
 import "../chunk-OHA2PAAA.js";
-import "../chunk-3ROCD7XF.js";
 import "../chunk-ABZJNKR6.js";
 import "../chunk-IM4DMKH4.js";
 import "../chunk-MDU5Q2HW.js";
-import "../chunk-KWBMM6MJ.js";
+import "../chunk-RZKKWIGQ.js";
+import "../chunk-GYXUCS37.js";
 import "../chunk-5UX5QAFJ.js";
-import "../chunk-Z2JH5KW5.js";
 import "../chunk-AL5E624U.js";
-import "../chunk-GYXUCS37.js";
+import "../chunk-Z2JH5KW5.js";
 import "../chunk-LV7LSPBF.js";
 import "../chunk-YOXYSAUI.js";
 import "../chunk-PPEHBI5O.js";

package/dist/navigation/SectionNav.js

@@ -1,27 +1,27 @@
 import "../chunk-R26KYJHK.js";
 import {
   SectionNav
-} from "../chunk-IJVBLU25.js";
+} from "../chunk-KJZ4PINO.js";
 import {
   sectionNavBarInset
-} from "../chunk-ULC4SCFC.js";
-import "../chunk-7MLT66DE.js";
-import "../chunk-SNWCT6JN.js";
-import "../chunk-ILJ3FXIC.js";
+} from "../chunk-NLJ7LL6H.js";
+import "../chunk-K33X3PDT.js";
+import "../chunk-AMIUZRDQ.js";
+import "../chunk-MM3QESLI.js";
 import {
   RaisedActionButton
-} from "../chunk-UKUGSU3Y.js";
-import "../chunk-24HHUCWB.js";
+} from "../chunk-L4V7FZJI.js";
+import "../chunk-LDCZPZPD.js";
 import "../chunk-YCCWJ5XQ.js";
 import "../chunk-TMSWLFL4.js";
 import "../chunk-JJTJ7DCV.js";
 import "../chunk-PUFA7FQ7.js";
 import "../chunk-5AK2EZG5.js";
-import "../chunk-N5PVD4J5.js";
-import "../chunk-6C5D6O3D.js";
+import "../chunk-6DO672AG.js";
 import "../chunk-ZNCYCE7L.js";
 import "../chunk-2L3VRVRE.js";
 import "../chunk-BJE3XHD4.js";
+import "../chunk-6C5D6O3D.js";
 import "../chunk-3UIDKLML.js";
 import "../chunk-PYC4CWCQ.js";
 import "../chunk-VWKMN3ZZ.js";

package/dist/types/components/form/InputOTP/InputOTP.base.d.ts

@@ -0,0 +1,63 @@
+import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
+/**
+ * THE CONTRACT BOTH RENDERERS HONOUR (see `Button.base.ts`).
+ *
+ * No MUI and no react-native here: this file ships in both declaration
+ * outputs, and a native consumer has no `@mui/material` to resolve against.
+ */
+export interface InputOTPBaseProps {
+    /**
+     * The variant of the OTP input
+     */
+    variant?: 'numeric' | 'alphanumeric' | 'masked';
+    /**
+     * The color theme of the OTP input
+     */
+    color?: ColorValue;
+    /**
+     * The size of the OTP input
+     */
+    size?: SizeValue;
+    /**
+     * Number of OTP digits
+     */
+    length?: number;
+    /**
+     * Current value
+     */
+    value?: string;
+    /**
+     * Called when value changes
+     */
+    onChange?: (value: string) => void;
+    /**
+     * Called when OTP is complete
+     */
+    onComplete?: (value: string) => void;
+    /**
+     * Whether the input should have glass morphism effect
+     */
+    glass?: boolean;
+    /**
+     * Whether the input should have gradient effects
+     */
+    gradient?: boolean;
+    /**
+     * Whether to auto-focus first input
+     */
+    autoFocus?: boolean;
+    /**
+     * Error state
+     */
+    error?: boolean;
+    /**
+     * Disabled state
+     */
+    disabled?: boolean;
+    /**
+     * Test ID for automated testing
+     * Container will have this ID, and individual slots will have {dataTestId}-slot-{index}
+     */
+    dataTestId?: string;
+}
+//# sourceMappingURL=InputOTP.base.d.ts.map

package/dist/types/components/form/InputOTP/InputOTP.base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputOTP.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAExE;;;;;GAKG;AAEH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,cAAc,GAAG,QAAQ,CAAC;IAEhD;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB"}

package/dist/types/components/form/InputOTP/InputOTP.core.d.ts

@@ -0,0 +1,38 @@
+/**
+ * The digits' arithmetic, shared by both renderers' hooks (`InputOTP.hooks.ts`
+ * on the web, `InputOTP.hooks.native.ts` on React Native). Pure: no React, no
+ * DOM, no react-native.
+ */
+/**
+ * What each variant accepts. `masked` constrains nothing — it only changes what
+ * is drawn — so it has no pattern here.
+ */
+export declare const PATTERNS: Record<string, RegExp>;
+/** Whether `text` is something this variant will take. */
+export declare const isAllowed: (variant: string, text: string) => boolean;
+/** The digit array is always `length` long, blank-padded on the right. */
+export declare const padTo: (digits: string[], length: number) => string[];
+/**
+ * What a change to the numeric FIRST slot is, now that its `maxLength` is the
+ * code's length rather than 1 (FUT-4144).
+ *
+ * That slot carries `one-time-code`, and the phone's SMS fill (or a password
+ * manager) writes the WHOLE code into it as one change, not a paste — kept to
+ * one character, the code lost every digit but the last. So:
+ *
+ * - `overtype`: a keystroke into the already-filled slot (its old character
+ *   plus the new one). Ignored, exactly as `maxLength={1}` refused it before.
+ * - `code`: anything else longer than one character, written in one go.
+ *   Spread across the slots like a paste.
+ *
+ * Every other slot and variant keeps `maxLength={1}` and never gets here.
+ */
+export declare function firstSlotFill(variant: string, index: number, inputValue: string, current: string): "code" | "overtype" | null;
+/**
+ * The code inside a first-slot fill. A phone that INSERTS the SMS code at the
+ * caret rather than replacing the slot leaves the digit already there in
+ * front: `4` + `482913` arrives as `4482913`, which spread as-is would give
+ * `448291`. Longer than the code and led by that digit: the digit is dropped.
+ */
+export declare const codeOfFill: (inputValue: string, current: string, length: number) => string;
+//# sourceMappingURL=InputOTP.core.d.ts.map

package/dist/types/components/form/InputOTP/InputOTP.core.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputOTP.core.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.core.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAG3C,CAAC;AAEF,0DAA0D;AAC1D,eAAO,MAAM,SAAS,GAAI,SAAS,MAAM,EAAE,MAAM,MAAM,YAA2C,CAAC;AAEnG,0EAA0E;AAC1E,eAAO,MAAM,KAAK,GAAI,QAAQ,MAAM,EAAE,EAAE,QAAQ,MAAM,aACH,CAAC;AAEpD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,8BAIhG;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU,GAAI,YAAY,MAAM,EAAE,SAAS,MAAM,EAAE,QAAQ,MAAM,KAAG,MACkC,CAAC"}

package/dist/types/components/form/InputOTP/InputOTP.d.ts

@@ -1,4 +1,3 @@
 import React from 'react';
-import type { InputOTPProps } from './InputOTP.types';
-export declare const InputOTP: React.ForwardRefExoticComponent<InputOTPProps & React.RefAttributes<HTMLDivElement>>;
+export declare const InputOTP: React.ForwardRefExoticComponent<import("./InputOTP.base").InputOTPBaseProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=InputOTP.d.ts.map

package/dist/types/components/form/InputOTP/InputOTP.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAO1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAyDtD,eAAO,MAAM,QAAQ,sFAsDnB,CAAC"}
+{"version":3,"file":"InputOTP.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAgE1C,eAAO,MAAM,QAAQ,oHAsDnB,CAAC"}

package/dist/types/components/form/InputOTP/InputOTP.hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.hooks.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.hooks.ts"],"names":[],"mappings":"AAiDA,UAAU,QAAQ;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,GAAI,kDAAkD,QAAQ;;;+BAqC3E,MAAM,cAAc,MAAM;2BAkB1B,MAAM,KAAK,KAAK,CAAC,aAAa;qBAelC,KAAK,CAAC,cAAc;CAQ3B,CAAC"}
+{"version":3,"file":"InputOTP.hooks.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/InputOTP/InputOTP.hooks.ts"],"names":[],"mappings":"AAIA,UAAU,QAAQ;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,GAAI,kDAAkD,QAAQ;;;+BAqC3E,MAAM,cAAc,MAAM;2BAkB1B,MAAM,KAAK,KAAK,CAAC,aAAa;qBAelC,KAAK,CAAC,cAAc;CAQ3B,CAAC"}