@g9tm/lynxcontrols 0.0.0-stage → 1.4.0

package/dist/fields/outlined-field.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"fields/outlined-field.jsx","sources":["../../src/fields/outlined-field.tsx"],"sourcesContent":["import './fields.css';\nimport { G9FilledValueHighlight, type G9ImageSource, G9Metrics } from '@g9tm/lynxcontrols-foundation';\nimport type { ReactNode } from '@lynx-js/react';\nimport { g9RowStyle } from '../base/control';\nimport { g9KeyboardTargetProps } from '../host/keyboard';\nimport type { G9IconInput } from '../icon/icon';\nimport { G9IconSlot, hasIconSlot } from '../icon/slot';\nimport { useG9Direction, useG9Settings } from '../provider/hooks';\nimport { type G9PhysicalPadding, resolveFieldSlotLayout } from './slot-layout';\n\n// MAUI `G9OutlinedFieldBase` (Controls/Shared/G9OutlinedFieldBase.cs) as composition (plan/specs/03 §5): the\n// props every outlined input shares, a pure state resolver, `useOutlinedField`, and the `<G9OutlinedField>` frame the\n// inputs put their element into.\n\n/** Props every outlined field shares (the public members of MAUI `G9OutlinedFieldBase`). */\nexport interface G9OutlinedFieldProps {\n  /** Floating label. Without it the placeholder is the label (MAUI `Label ?? Placeholder`). */\n  readonly label?: string | null;\n  /** Placeholder; shown as the label when `label` is not set. */\n  readonly placeholder?: string | null;\n  /** Helper line under the field; replaced by `errorText` while the field has an error. */\n  readonly helperText?: string | null;\n  /** Error message, shown (in the error colour) while `hasError`. */\n  readonly errorText?: string | null;\n  /** Error state: error outline, label and helper colour. Validation can also set it (`validate()`). Default false. */\n  readonly hasError?: boolean;\n  /** Keep the label floated even when empty and unfocused. Default false. */\n  readonly alwaysFloat?: boolean;\n  /** Value visible and selectable but not editable (MAUI `IsReadOnly`). Default false. */\n  readonly readOnly?: boolean;\n  /** Not interactive and dimmed (MAUI `IsEnabled = false`). Default false. */\n  readonly disabled?: boolean;\n  /** Maximum characters; `-1` (default) or `0` means unlimited. */\n  readonly maxLength?: number;\n  /** Show the `n / max` counter (only when `maxLength > 0`). Default false. */\n  readonly showCharacterCounter?: boolean;\n  /** Status colour (any CSS colour or `g9Token(...)`); used while `useStatusColor`. Default the primary colour. */\n  readonly statusColor?: string | null;\n  /** Draw the outline in `statusColor` (emphasised) whatever the focus. Default false. */\n  readonly useStatusColor?: boolean;\n  /** Soft inner halo while focused (no error, no status colour). Default false. */\n  readonly showFocusHalo?: boolean;\n  /** Filled-value accent of this field; `'inherit'` (default) takes `settings.fields.highlightFilledValue`. */\n  readonly filledValueHighlight?: G9FilledValueHighlight;\n  readonly leadingEmoji?: string | null;\n  readonly leadingIcon?: G9IconInput;\n  readonly leadingImagePath?: string | null;\n  readonly leadingImage?: G9ImageSource | null;\n  readonly trailingEmoji?: string | null;\n  readonly trailingIcon?: G9IconInput;\n  readonly trailingImagePath?: string | null;\n  readonly trailingImage?: G9ImageSource | null;\n  /** Spinner in the trailing slot (wins over every trailing icon). Default false. */\n  readonly isTrailingBusy?: boolean;\n  /** Keep the trailing icon on the physical right in RTL too. Default false. */\n  readonly forceTrailingIconRight?: boolean;\n  /** Keep the leading icon on the physical left in RTL too. Default false. */\n  readonly forceLeadingIconLeft?: boolean;\n  /** Box height; `0` (default) uses `G9Metrics.ControlHeight` (52). */\n  readonly fieldHeight?: number;\n  /** Reserve the floated label's overhang above the box (MAUI `FloatingLabelClearance`, 6). Default false. */\n  readonly reserveFloatingLabelClearance?: boolean;\n  /** Leading icon tap (MAUI `LeadingCommand` + `CommandParameter`). Makes the icon actionable. */\n  readonly onLeadingPress?: () => void;\n  /** Trailing icon tap when no built-in affordance claims it (MAUI `TrailingCommand`). */\n  readonly onTrailingPress?: () => void;\n  /** Extra padding of the inner content (MAUI `InnerContentPadding`), physical sides. */\n  readonly innerContentPadding?: Partial<G9PhysicalPadding>;\n  /** Class of the root element. */\n  readonly className?: string;\n}\n\n/** What {@link resolveOutlinedFieldState} needs besides the props. */\nexport interface G9OutlinedFieldStateInput {\n  readonly focused: boolean;\n  readonly hasValue: boolean;\n  /** A value the field shows without text (a picker's selection): floats the label like a value. */\n  readonly valueFloated?: boolean;\n  /** App-wide filled-value accent (`settings.fields.highlightFilledValue`). */\n  readonly highlightFilledValue: boolean;\n  /** Characters of the value, for the counter. */\n  readonly textLength: number;\n  /** Resting chrome tone: `'outline'` (default) or `'placeholder'` (search). */\n  readonly restingTone?: 'outline' | 'placeholder';\n}\n\n/** The resolved look of an outlined field (colours are CSS colour values). */\nexport interface G9OutlinedFieldState {\n  readonly floated: boolean;\n  /** Outline, floated label and trailing icon colour. */\n  readonly stateColor: string;\n  readonly labelColor: string;\n  /** Leading icon and resting label colour. */\n  readonly restingContentColor: string;\n  readonly labelText: string;\n  /** Helper line text (`errorText` while in error), `''` when hidden. */\n  readonly helperText: string;\n  readonly helperColor: string;\n  /** Counter text (`'n / max'`), `''` when hidden. */\n  readonly counterText: string;\n  readonly footerVisible: boolean;\n  readonly strokeWidth: number;\n  /** Focus halo thickness, 0 when off. */\n  readonly haloWidth: number;\n  readonly fieldHeight: number;\n}\n\nconst v = (token: string): string => `var(--g9-${token})`;\n\n/**\n * Resolves the field's state colours and footer (MAUI `ResolveStateColor`, `ResolveFloatingLabelColor`, the footer\n * part of `Refresh`). Precedence: error > status colour > focus > accented filled value > resting.\n */\nexport function resolveOutlinedFieldState(\n  props: G9OutlinedFieldProps,\n  input: G9OutlinedFieldStateInput,\n): G9OutlinedFieldState {\n  const hasError = props.hasError === true;\n  const useStatus = props.useStatusColor === true;\n  const filled = input.hasValue || input.valueFloated === true;\n  const highlight = props.filledValueHighlight ?? G9FilledValueHighlight.Inherit;\n  const accentFilled =\n    highlight === G9FilledValueHighlight.Accent\n      ? true\n      : highlight === G9FilledValueHighlight.Neutral\n        ? false\n        : input.highlightFilledValue;\n  const placeholderTone = input.restingTone === 'placeholder';\n  const restingOutline = placeholderTone ? v('input-placeholder') : v('outline');\n  const restingContentColor = placeholderTone ? v('input-placeholder') : v('text-tertiary');\n  let stateColor: string;\n  if (hasError) stateColor = v('error');\n  else if (useStatus) stateColor = props.statusColor ?? v('primary');\n  else if (input.focused) stateColor = v('primary');\n  else stateColor = filled && accentFilled ? v('primary') : restingOutline;\n\n  const floated = props.alwaysFloat === true || input.valueFloated === true || input.focused || input.hasValue;\n  const neutralFilledRest = filled && !input.focused && !hasError && !useStatus && !accentFilled;\n  const labelColor = floated && !neutralFilledRest ? stateColor : restingContentColor;\n\n  const helperRaw = hasError ? (props.errorText ?? '') : (props.helperText ?? '');\n  const helperText = helperRaw.trim() === '' ? '' : helperRaw;\n  const maxLength = props.maxLength ?? -1;\n  const counterText = props.showCharacterCounter === true && maxLength > 0 ? `${input.textLength} / ${maxLength}` : '';\n  const emphasis = input.focused || hasError || useStatus;\n  const halo = props.showFocusHalo === true && input.focused && !hasError && !useStatus;\n  const labelRaw = props.label ?? props.placeholder ?? '';\n  return {\n    floated,\n    stateColor,\n    labelColor,\n    restingContentColor,\n    labelText: labelRaw.trim() === '' ? '' : labelRaw,\n    helperText,\n    helperColor: hasError ? v('error') : v('text-tertiary'),\n    counterText,\n    footerVisible: helperText !== '' || counterText !== '',\n    strokeWidth: emphasis ? G9Metrics.OutlinedFieldEmphasisStrokeThickness : G9Metrics.OutlinedFieldStrokeThickness,\n    haloWidth: halo ? G9Metrics.OutlinedFieldFocusHaloThickness : 0,\n    fieldHeight: props.fieldHeight && props.fieldHeight > 0 ? props.fieldHeight : G9Metrics.ControlHeight,\n  };\n}\n\n/** {@link resolveOutlinedFieldState} with the app-wide settings read from the provider. */\nexport function useOutlinedField(\n  props: G9OutlinedFieldProps,\n  input: Omit<G9OutlinedFieldStateInput, 'highlightFilledValue'>,\n): G9OutlinedFieldState {\n  const settings = useG9Settings();\n  return resolveOutlinedFieldState(props, { ...input, highlightFilledValue: settings.fields.highlightFilledValue });\n}\n\n/** A built-in trailing affordance an input puts in the trailing slot (password eye, microphone, clear). */\nexport interface G9TrailingAffordance {\n  /** What it shows. */\n  readonly icon: G9IconInput;\n  /** Icon colour; default the state colour. */\n  readonly color?: string;\n  /** Accessibility label. */\n  readonly label?: string;\n  /** Stable key (MAUI `ResolveTrailingIconSignature`): the slot is rebuilt only when it changes. */\n  readonly signature: string;\n  readonly onPress: () => void;\n}\n\n/** Props of {@link G9OutlinedField}: the shared props plus what the composing input supplies. */\nexport interface G9OutlinedFieldFrameProps extends G9OutlinedFieldProps {\n  readonly focused: boolean;\n  readonly hasValue: boolean;\n  readonly valueFloated?: boolean;\n  readonly textLength?: number;\n  /** The input element (or any content) inside the box. */\n  readonly children?: ReactNode;\n  /** A built-in trailing affordance; replaces the trailing icon props (busy still wins). */\n  readonly trailingAffordance?: G9TrailingAffordance | null;\n  /** Tapping the box (outside the icons) focuses the content (MAUI `FocusTarget`). */\n  readonly onFocusRequest?: () => void;\n  /** Resting tone (`'placeholder'` for search, MAUI `ResolveRestingOutlineColor` override). */\n  readonly restingTone?: 'outline' | 'placeholder';\n  /** Vertical placement of the icons and the resting label: centred (entries) or top/bottom (editor). */\n  readonly multiline?: boolean;\n  /** Accessibility label of the box (defaults to the label text). */\n  readonly accessibilityLabel?: string;\n}\n\nfunction physicalSide(column: 0 | 2): 'left' | 'right' {\n  return column === 0 ? 'left' : 'right';\n}\n\n/**\n * The outlined field frame (MAUI `G9OutlinedFieldBase`): outline with a notched floating label, leading and\n * trailing icon slots, helper/error line and counter. Inputs (`G9TextEntry`, `G9Editor`, `G9SearchEntry`, the pickers)\n * put their element in `children`. Direction is set on the root from the culture (labels, icons, helper follow it;\n * the input decides its own text direction). A tap on an icon never focuses the content; a tap elsewhere on the box\n * calls `onFocusRequest`.\n *\n * Look: colours come from the theme variables (`--g9-primary`, `--g9-outline`, `--g9-error`, …). The floated label\n * sits on the outline with the background `--g9-field-notch-background` (default `--g9-background`), which hides the\n * outline under it.\n */\nexport function G9OutlinedField(props: G9OutlinedFieldFrameProps): ReactNode {\n  const direction = useG9Direction();\n  const isRtl = direction === 'rtl';\n  const state = useOutlinedField(props, {\n    focused: props.focused,\n    hasValue: props.hasValue,\n    valueFloated: props.valueFloated ?? false,\n    textLength: props.textLength ?? 0,\n    restingTone: props.restingTone ?? 'outline',\n  });\n  const leading = {\n    emoji: props.leadingEmoji ?? null,\n    icon: props.leadingIcon,\n    imagePath: props.leadingImagePath ?? null,\n    image: props.leadingImage ?? null,\n  };\n  const trailing = {\n    emoji: props.trailingEmoji ?? null,\n    icon: props.trailingIcon,\n    imagePath: props.trailingImagePath ?? null,\n    image: props.trailingImage ?? null,\n  };\n  const busy = props.isTrailingBusy === true;\n  const affordance = props.trailingAffordance ?? null;\n  const hasLeading = hasIconSlot(leading);\n  const hasTrailing = busy || affordance !== null || hasIconSlot(trailing);\n  const pad = props.innerContentPadding ?? {};\n  const slot = resolveFieldSlotLayout(\n    {\n      hasLeadingIcon: hasLeading,\n      hasTrailingIcon: hasTrailing,\n      isRtl,\n      forceTrailingIconRight: props.forceTrailingIconRight === true,\n      forceLeadingIconLeft: props.forceLeadingIconLeft === true,\n    },\n    { left: pad.left ?? 0, top: pad.top ?? 0, right: pad.right ?? 0, bottom: pad.bottom ?? 0 },\n  );\n  const disabled = props.disabled === true;\n  const leadingActionable = props.onLeadingPress !== undefined;\n  const trailingActionable = affordance !== null || props.onTrailingPress !== undefined;\n  const onLeadingTap = () => {\n    if (disabled || !leadingActionable) return;\n    props.onLeadingPress?.();\n  };\n  const onTrailingTap = () => {\n    if (disabled || busy || !trailingActionable) return;\n    if (affordance) affordance.onPress();\n    else props.onTrailingPress?.();\n  };\n  const onBoxTap = () => {\n    if (!disabled) props.onFocusRequest?.();\n  };\n\n  const multiline = props.multiline === true;\n  const labelHeight = G9Metrics.FloatingLabelHeight;\n  const restTop = multiline ? (G9Metrics.ControlHeight - labelHeight) / 2 : (state.fieldHeight - labelHeight) / 2;\n  const labelX = slot.labelRestX + (state.floated ? slot.labelFloatedX : 0);\n  const labelAnchor = isRtl ? 'right' : 'left';\n  const iconSize = G9Metrics.InputIconSize;\n  const slotStyle = (column: 0 | 2, width: number, bottomAligned: boolean) => ({\n    [physicalSide(column)]: '0px',\n    width: `${width}px`,\n    ...(bottomAligned\n      ? { bottom: '0px', height: `${G9Metrics.EditorTrailingSlotHeight}px` }\n      : { top: '0px', bottom: '0px' }),\n  });\n\n  const trailingContent = busy ? (\n    <view className=\"g9-field__busy\" style={{ borderColor: state.stateColor, borderTopColor: 'transparent' }} />\n  ) : affordance ? (\n    <G9IconSlot icon={affordance.icon} color={affordance.color ?? state.stateColor} size={iconSize} />\n  ) : (\n    <G9IconSlot {...trailing} color={state.stateColor} size={iconSize} />\n  );\n\n  return (\n    <view\n      className={`g9-field g9-dir-${direction}${disabled ? ' g9-field--disabled' : ''}${props.className ? ` ${props.className}` : ''}`}\n    >\n      <view\n        {...g9KeyboardTargetProps}\n        className={`g9-field__box${state.floated ? ' g9-field__box--floated' : ''}${props.focused ? ' g9-field__box--focused' : ''}`}\n        accessibility-element={false}\n        style={{\n          height: multiline ? undefined : `${state.fieldHeight}px`,\n          minHeight: multiline ? `${state.fieldHeight}px` : undefined,\n          marginTop: props.reserveFloatingLabelClearance ? `${G9Metrics.FloatingLabelClearance}px` : '0px',\n          borderColor: state.stateColor,\n          borderWidth: `${state.strokeWidth}px`,\n          borderRadius: `${G9Metrics.RadiusMd}px`,\n        }}\n        bindtap={onBoxTap}\n      >\n        {state.haloWidth > 0 ? (\n          <view\n            className=\"g9-field__halo\"\n            style={{\n              borderColor: state.stateColor,\n              borderWidth: `${state.haloWidth}px`,\n              opacity: G9Metrics.FocusRingOpacity,\n              borderRadius: `${G9Metrics.RadiusMd}px`,\n            }}\n          />\n        ) : null}\n        <view\n          className=\"g9-field__content\"\n          style={{\n            paddingLeft: `${slot.innerPadding.left + (hasLeading && slot.leadingColumn === 0 ? G9Metrics.LeadingIconSlotWidth : 0) + (hasTrailing && slot.trailingColumn === 0 ? G9Metrics.TrailingIconSlotWidth : 0)}px`,\n            paddingRight: `${slot.innerPadding.right + (hasLeading && slot.leadingColumn === 2 ? G9Metrics.LeadingIconSlotWidth : 0) + (hasTrailing && slot.trailingColumn === 2 ? G9Metrics.TrailingIconSlotWidth : 0)}px`,\n            paddingTop: `${slot.innerPadding.top}px`,\n            paddingBottom: `${slot.innerPadding.bottom}px`,\n          }}\n        >\n          {props.children}\n        </view>\n        {hasLeading ? (\n          <view\n            className=\"g9-field__slot g9-field__slot--leading\"\n            style={slotStyle(slot.leadingColumn, G9Metrics.LeadingIconSlotWidth, false)}\n            catchtap={onLeadingTap}\n            {...(leadingActionable ? { 'accessibility-element': true, 'accessibility-traits': 'button' } : {})}\n          >\n            <G9IconSlot {...leading} color={state.restingContentColor} size={iconSize} />\n          </view>\n        ) : null}\n        {hasTrailing ? (\n          <view\n            key={busy ? 'busy' : affordance ? affordance.signature : 'icon'}\n            className=\"g9-field__slot g9-field__slot--trailing\"\n            style={slotStyle(slot.trailingColumn, G9Metrics.TrailingIconSlotWidth, multiline && !busy)}\n            catchtap={onTrailingTap}\n            {...(trailingActionable\n              ? {\n                  'accessibility-element': true,\n                  'accessibility-traits': 'button',\n                  ...(affordance?.label ? { 'accessibility-label': affordance.label } : {}),\n                }\n              : {})}\n          >\n            {trailingContent}\n          </view>\n        ) : null}\n        {state.labelText ? (\n          <text\n            className={`g9-field__label${state.floated ? ' g9-field__label--floated' : ''}`}\n            style={{\n              [labelAnchor]: `${G9Metrics.InputHorizontalPadding}px`,\n              top: `${state.floated ? G9Metrics.FloatingLabelFloatedY : restTop}px`,\n              fontSize: `${state.floated ? G9Metrics.FloatingLabelFontSizeFloat : G9Metrics.FloatingLabelFontSizeRest}px`,\n              color: state.labelColor,\n              transform: `translateX(${labelX}px)`,\n            }}\n          >\n            {state.labelText}\n          </text>\n        ) : null}\n      </view>\n      {state.footerVisible ? (\n        <view className=\"g9-field__footer\" style={g9RowStyle(direction)}>\n          {state.helperText ? (\n            <text\n              className=\"g9-field__helper\"\n              style={{ color: state.helperColor, textAlign: isRtl ? 'right' : 'left' }}\n            >\n              {state.helperText}\n            </text>\n          ) : (\n            <view className=\"g9-field__helper\" />\n          )}\n          {state.counterText ? <text className=\"g9-field__counter\">{state.counterText}</text> : null}\n        </view>\n      ) : null}\n    </view>\n  );\n}\n"],"names":["v","token","resolveOutlinedFieldState","props","input","_props_filledValueHighlight","_props_statusColor","_props_errorText","_props_helperText","_props_maxLength","_ref","hasError","useStatus","filled","highlight","G9FilledValueHighlight","accentFilled","placeholderTone","restingOutline","restingContentColor","stateColor","floated","neutralFilledRest","labelColor","helperRaw","helperText","maxLength","counterText","emphasis","halo","labelRaw","G9Metrics","useOutlinedField","settings","useG9Settings","physicalSide","column","G9OutlinedField","_props_valueFloated","_props_textLength","_props_restingTone","_props_leadingEmoji","_props_leadingImagePath","_props_leadingImage","_props_trailingEmoji","_props_trailingImagePath","_props_trailingImage","_props_trailingAffordance","_props_innerContentPadding","_pad_left","_pad_top","_pad_right","_pad_bottom","_affordance_color","direction","useG9Direction","isRtl","state","leading","trailing","busy","affordance","hasLeading","hasIconSlot","hasTrailing","pad","slot","resolveFieldSlotLayout","disabled","leadingActionable","undefined","trailingActionable","onLeadingTap","onTrailingTap","onBoxTap","multiline","labelHeight","restTop","labelX","labelAnchor","iconSize","slotStyle","width","bottomAligned","trailingContent","view","G9IconSlot","g9KeyboardTargetProps","text","g9RowStyle"],"mappings":"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"}

package/dist/fields/pin-entry.d.ts

@@ -0,0 +1,63 @@
+import './fields.css';
+import { G9PinEntryType } from '@g9tm/lynxcontrols-foundation';
+/** Props of {@link G9PinEntry} (MAUI `G9PinEntry`). */
+export interface G9PinEntryProps {
+    /** Number of cells when `groupSizes` is not set (at least 1). Default 4. */
+    readonly length?: number;
+    /** The code (controlled; MAUI `Value`). */
+    readonly value?: string;
+    /** Initial code while uncontrolled. Default `''`. */
+    readonly defaultValue?: string;
+    /** Once per change of the code (MAUI `ValueChanged`): typing, paste, `clear()`, a re-filter after a type change. */
+    readonly onValueChange?: (value: string) => void;
+    /** Once each time the code becomes complete (MAUI `Completed`); not for a complete value the parent pushes in. */
+    readonly onComplete?: (value: string) => void;
+    /** Accepted characters; `'password'` is digits shown masked. Default `'number'`. */
+    readonly type?: G9PinEntryType;
+    /** Filler glyph of an empty cell. Default none. */
+    readonly placeholder?: string | null;
+    /** Glyph of a masked cell. Default `'●'`. */
+    readonly maskCharacter?: string;
+    /** Cell groups such as `'4-4-4-4'`; when set, their sum is the cell count and `separator` sits between groups. */
+    readonly groupSizes?: string | null;
+    /** Text between groups. Default `'-'`. */
+    readonly separator?: string | null;
+    /** Cell width. Default 44 (`G9Metrics.PinCellWidth`). */
+    readonly cellWidth?: number;
+    /** Cell height. Default 52 (`G9Metrics.PinCellHeight`). */
+    readonly cellHeight?: number;
+    /** Focus once when mounted. Default false. */
+    readonly autoFocus?: boolean;
+    readonly disabled?: boolean;
+    /** Accessibility label of the row (the progress `n / total` is always announced). */
+    readonly accessibilityLabel?: string;
+    readonly className?: string;
+}
+/** Imperative handle of {@link G9PinEntry}. */
+export interface G9PinEntryHandle {
+    /** Focuses the hidden input; typing appends after the last character (MAUI `FocusFirstEmpty`). */
+    focusFirstEmpty(): void;
+    /** Empties every cell (MAUI `Clear`). */
+    clear(): void;
+    /** Every cell is filled (MAUI `IsComplete`). */
+    readonly isComplete: boolean;
+}
+/** Parses `'4-3-3-2'` into positive group sizes; blanks and non-numbers are skipped (MAUI `ParseGroupSizes`). */
+export declare function parsePinGroupSizes(raw: string | null | undefined): number[];
+/** Cell count: the groups' sum, else `max(1, length)`. */
+export declare function pinCellCount(length: number, groups: readonly number[]): number;
+/** Whether the PIN type accepts a character (MAUI `IsAllowed`: `char.IsDigit` / `IsLetter` / `IsLetterOrDigit`). */
+export declare function isPinCharAllowed(type: G9PinEntryType, ch: string): boolean;
+/**
+ * Filters and clamps a code (MAUI `FilterAndClamp`): Persian and Arabic-Indic digits become ASCII, disallowed
+ * characters are dropped, the rest is cut to `cells`.
+ */
+export declare function filterPin(raw: string | null | undefined, type: G9PinEntryType, cells: number): string;
+/**
+ * One-time-code / PIN entry (MAUI `G9PinEntry`): a row of cells over one hidden `<input>` (the lynx-ui `InputOTP`
+ * pattern). Append-only: typing fills the next cell, backspace empties the last, a tap anywhere focuses the end.
+ * Paste is filtered and clamped. Digits are stored as ASCII whatever keyboard produced them. Masked with
+ * `type: 'password'`. Requires the host's `xelement-input` registration.
+ */
+export declare const G9PinEntry: import("react").ForwardRefExoticComponent<G9PinEntryProps & import("react").RefAttributes<G9PinEntryHandle>>;
+//# sourceMappingURL=pin-entry.d.ts.map

package/dist/fields/pin-entry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pin-entry.d.ts","sourceRoot":"","sources":["../../src/fields/pin-entry.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAa,cAAc,EAAoB,MAAM,+BAA+B,CAAC;AAiB5F,uDAAuD;AACvD,MAAM,WAAW,eAAe;IAC9B,4EAA4E;IAC5E,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,2CAA2C;IAC3C,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,oHAAoH;IACpH,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,kHAAkH;IAClH,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,oFAAoF;IACpF,QAAQ,CAAC,IAAI,CAAC,EAAE,cAAc,CAAC;IAC/B,mDAAmD;IACnD,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,6CAA6C;IAC7C,QAAQ,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC;IAChC,kHAAkH;IAClH,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC,0CAA0C;IAC1C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,yDAAyD;IACzD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,2DAA2D;IAC3D,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAC7B,8CAA8C;IAC9C,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,qFAAqF;IACrF,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IACrC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,+CAA+C;AAC/C,MAAM,WAAW,gBAAgB;IAC/B,kGAAkG;IAClG,eAAe,IAAI,IAAI,CAAC;IACxB,yCAAyC;IACzC,KAAK,IAAI,IAAI,CAAC;IACd,gDAAgD;IAChD,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;CAC9B;AAED,iHAAiH;AACjH,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM,EAAE,CAU3E;AAED,0DAA0D;AAC1D,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,CAE9E;AAoCD,oHAAoH;AACpH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,GAAG,OAAO,CAS1E;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CASrG;AAgBD;;;;;GAKG;AACH,eAAO,MAAM,UAAU,8GA8KrB,CAAC"}

package/dist/fields/pin-entry.jsx

@@ -0,0 +1,293 @@
+import "./fields.css";
+import { G9Metrics, G9PinEntryType, normalizeToAscii } from "@g9tm/lynxcontrols-foundation";
+import { KeyboardAwareTriggerContext } from "@lynx-js/lynx-ui-input";
+import { forwardRef, useContext, useEffect, useImperativeHandle, useRef, useState } from "@lynx-js/react";
+import { startTimer } from "../base/timers.jsx";
+import { useControllableState } from "../base/use-controllable-state.jsx";
+import { g9KeyboardTargetProps } from "../host/keyboard.jsx";
+import { invokeNode, invokeNodeWhenReady } from "./use-text-input.jsx";
+function parsePinGroupSizes(raw) {
+    if (null == raw || '' === raw.trim()) return [];
+    const out = [];
+    for (const part of raw.split('-')){
+        const trimmed = part.trim();
+        if (!/^[+]?\d+$/.test(trimmed)) continue;
+        const n = Number(trimmed);
+        if (n > 0) out.push(n);
+    }
+    return out;
+}
+function pinCellCount(length, groups) {
+    return groups.length > 0 ? groups.reduce((a, b)=>a + b, 0) : Math.max(1, length);
+}
+const digitZeros = [
+    0x30,
+    0x660,
+    0x6f0,
+    0x7c0,
+    0x966,
+    0x9e6,
+    0xa66,
+    0xae6,
+    0xb66,
+    0xbe6,
+    0xc66,
+    0xce6,
+    0xd66,
+    0xde6,
+    0xe50,
+    0xed0,
+    0xf20,
+    0x1040,
+    0x1090,
+    0x17e0,
+    0x1810,
+    0x1946,
+    0x19d0,
+    0x1a80,
+    0x1a90,
+    0x1b50,
+    0x1bb0,
+    0x1c40,
+    0x1c50,
+    0xa620,
+    0xa8d0,
+    0xa900,
+    0xa9d0,
+    0xa9f0,
+    0xaa50,
+    0xabf0,
+    0xff10
+];
+const uncasedLetterRanges = [
+    [
+        0x5d0,
+        0x5ea
+    ],
+    [
+        0x620,
+        0x64a
+    ],
+    [
+        0x66e,
+        0x6d3
+    ],
+    [
+        0x6fa,
+        0x6ff
+    ],
+    [
+        0x904,
+        0x939
+    ],
+    [
+        0xe01,
+        0xe30
+    ],
+    [
+        0x3041,
+        0x30ff
+    ],
+    [
+        0x3400,
+        0x4dbf
+    ],
+    [
+        0x4e00,
+        0x9fff
+    ],
+    [
+        0xac00,
+        0xd7a3
+    ]
+];
+function isUnicodeDigit(ch) {
+    const c = ch.charCodeAt(0);
+    for (const zero of digitZeros)if (c >= zero && c <= zero + 9) return true;
+    return false;
+}
+function isUnicodeLetter(ch) {
+    if (ch.toLowerCase() !== ch.toUpperCase()) return true;
+    const c = ch.charCodeAt(0);
+    for (const [from, to] of uncasedLetterRanges)if (c >= from && c <= to) return true;
+    return false;
+}
+function isPinCharAllowed(type, ch) {
+    switch(type){
+        case G9PinEntryType.Letters:
+            return isUnicodeLetter(ch);
+        case G9PinEntryType.Alphanumeric:
+            return isUnicodeLetter(ch) || isUnicodeDigit(ch);
+        default:
+            return isUnicodeDigit(ch);
+    }
+}
+function filterPin(raw, type, cells) {
+    if (!raw) return '';
+    let out = '';
+    for (const typed of Array.from(raw)){
+        if (Array.from(out).length >= cells) break;
+        const ch = normalizeToAscii(typed);
+        if (isPinCharAllowed(type, ch)) out += ch;
+    }
+    return out;
+}
+const hiddenInputStyle = {
+    position: 'absolute',
+    top: '0px',
+    left: '0px',
+    width: '1px',
+    height: '1px',
+    padding: '0px',
+    borderWidth: '0px',
+    opacity: 0,
+    color: 'transparent',
+    caretColor: 'transparent',
+    backgroundColor: 'transparent'
+};
+const pin_entry_G9PinEntry = forwardRef(function(props, ref) {
+    var _props_type, _props_length, _props_defaultValue, _props_separator;
+    const keyboardAware = useContext(KeyboardAwareTriggerContext);
+    const type = null != (_props_type = props.type) ? _props_type : G9PinEntryType.Number;
+    const groups = parsePinGroupSizes(props.groupSizes);
+    const cells = pinCellCount(null != (_props_length = props.length) ? _props_length : 4, groups);
+    const [value, setValue] = useControllableState({
+        value: props.value,
+        defaultValue: null != (_props_defaultValue = props.defaultValue) ? _props_defaultValue : '',
+        onChange: props.onValueChange,
+        name: 'G9PinEntry.value'
+    });
+    const clean = filterPin(value, type, cells);
+    const chars = Array.from(clean);
+    const complete = chars.length === cells;
+    const [focused, setFocused] = useState(false);
+    const inputRef = useRef(null);
+    const native = useRef('');
+    const completedFired = useRef(complete);
+    const latest = useRef(clean);
+    latest.current = clean;
+    const [, bump] = useState(0);
+    const refiltered = useRef(null);
+    useEffect(()=>{
+        if (clean !== value && refiltered.current !== value) {
+            refiltered.current = value;
+            setValue(clean);
+        }
+    });
+    const lastSeen = useRef(clean);
+    if (lastSeen.current !== clean) {
+        lastSeen.current = clean;
+        if (!complete) completedFired.current = false;
+    }
+    const retries = useRef(0);
+    const sync = ()=>{
+        const current = latest.current;
+        if (native.current === current) return;
+        if (invokeNode(inputRef, 'setValue', {
+            value: current
+        })) {
+            native.current = current;
+            retries.current = 0;
+        } else if (inputRef.current && retries.current < 5) {
+            retries.current += 1;
+            startTimer(()=>syncRef.current(), 0);
+        }
+    };
+    const syncRef = useRef(sync);
+    syncRef.current = sync;
+    const attach = useRef((node)=>{
+        inputRef.current = node;
+        if (node) syncRef.current();
+    }).current;
+    useEffect(()=>{
+        sync();
+    });
+    const focus = ()=>{
+        if (props.disabled) return;
+        invokeNode(inputRef, 'focus');
+        invokeNode(inputRef, 'setSelectionRange', {
+            selectionStart: chars.length,
+            selectionEnd: chars.length
+        });
+    };
+    const clear = ()=>{
+        latest.current = '';
+        completedFired.current = false;
+        setValue('');
+        bump((n)=>n + 1);
+    };
+    useImperativeHandle(ref, ()=>({
+            focusFirstEmpty: focus,
+            clear,
+            get isComplete () {
+                return Array.from(latest.current).length === cells;
+            }
+        }));
+    const autoFocused = useRef(false);
+    useEffect(()=>{
+        if (props.autoFocus && !autoFocused.current && !props.disabled) {
+            autoFocused.current = true;
+            invokeNodeWhenReady(inputRef, 'focus');
+        }
+    });
+    const onInput = (event)=>{
+        var _ref;
+        var _event_detail;
+        const raw = null != (_ref = null == (_event_detail = event.detail) ? void 0 : _event_detail.value) ? _ref : '';
+        native.current = raw;
+        const next = filterPin(raw, type, cells);
+        latest.current = next;
+        lastSeen.current = next;
+        setValue(next);
+        const ready = Array.from(next).length === cells;
+        if (ready && !completedFired.current) {
+            var _props_onComplete;
+            completedFired.current = true;
+            null == (_props_onComplete = props.onComplete) || _props_onComplete.call(props, next);
+        } else if (!ready) completedFired.current = false;
+        bump((n)=>n + 1);
+    };
+    const cellWidth = props.cellWidth && props.cellWidth > 0 ? props.cellWidth : G9Metrics.PinCellWidth;
+    const cellHeight = props.cellHeight && props.cellHeight > 0 ? props.cellHeight : G9Metrics.PinCellHeight;
+    const active = focused ? Math.min(chars.length, cells - 1) : -1;
+    const separator = null != (_props_separator = props.separator) ? _props_separator : '';
+    const row = [];
+    let groupIndex = 0;
+    let inGroup = 0;
+    for(let i = 0; i < cells; i++){
+        var _props_maskCharacter, _props_placeholder;
+        const ch = chars[i];
+        const state = i === active ? 'active' : void 0 !== ch ? 'filled' : 'empty';
+        row.push(<view key={`c${i}`} className={`g9-pin__cell g9-pin__cell--${state}`} style={{
+            width: `${cellWidth}px`,
+            height: `${cellHeight}px`
+        }}>
+        <text className={void 0 !== ch ? 'g9-pin__char' : 'g9-pin__placeholder'}>
+          {void 0 !== ch ? type === G9PinEntryType.Password ? null != (_props_maskCharacter = props.maskCharacter) ? _props_maskCharacter : '●' : ch : null != (_props_placeholder = props.placeholder) ? _props_placeholder : ''}
+        </text>
+      </view>);
+        inGroup++;
+        if (groups.length > 0 && groupIndex < groups.length - 1 && inGroup === groups[groupIndex]) {
+            if ('' !== separator) row.push(<text key={`s${groupIndex}`} className="g9-pin__separator">
+            {separator}
+          </text>);
+            groupIndex++;
+            inGroup = 0;
+        }
+    }
+    return <view {...g9KeyboardTargetProps} className={`g9-pin g9-dir-ltr${props.disabled ? ' g9-pin--disabled' : ''}${complete ? ' g9-pin--complete' : ''}${props.className ? ` ${props.className}` : ''}`} accessibility-element={true} accessibility-label={`${props.accessibilityLabel ? `${props.accessibilityLabel}, ` : ''}${chars.length} / ${cells}`} bindtap={focus}>
+      {row}
+      <input {...g9KeyboardTargetProps} ref={attach} className="g9-pin__input" android-fullscreen-mode={false} ignore-focus={true} confirm-type="done" disabled={true === props.disabled} maxlength={cells} ios-auto-correct={false} ios-spell-check={false} type={type === G9PinEntryType.Number || type === G9PinEntryType.Password ? 'number' : 'text'} style={hiddenInputStyle} bindinput={onInput} bindfocus={()=>{
+        var _keyboardAware_onInputFocused;
+        setFocused(true);
+        null == (_keyboardAware_onInputFocused = keyboardAware.onInputFocused) || _keyboardAware_onInputFocused.call(keyboardAware);
+    }} bindblur={()=>{
+        var _keyboardAware_onInputBlurred;
+        setFocused(false);
+        null == (_keyboardAware_onInputBlurred = keyboardAware.onInputBlurred) || _keyboardAware_onInputBlurred.call(keyboardAware);
+    }}/>
+    </view>;
+});
+export { filterPin, isPinCharAllowed, parsePinGroupSizes, pinCellCount, pin_entry_G9PinEntry as G9PinEntry };
+
+//# sourceMappingURL=pin-entry.jsx.map

package/dist/fields/pin-entry.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"fields/pin-entry.jsx","sources":["../../src/fields/pin-entry.tsx"],"sourcesContent":["import './fields.css';\nimport { G9Metrics, G9PinEntryType, normalizeToAscii } from '@g9tm/lynxcontrols-foundation';\nimport { KeyboardAwareTriggerContext } from '@lynx-js/lynx-ui-input';\nimport {\n  forwardRef,\n  type ReactNode,\n  useContext,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from '@lynx-js/react';\nimport type { NodesRef } from '@lynx-js/types';\nimport { startTimer } from '../base/timers';\nimport { useControllableState } from '../base/use-controllable-state';\nimport { g9KeyboardTargetProps } from '../host/keyboard';\nimport { invokeNode, invokeNodeWhenReady } from './use-text-input';\n\n/** Props of {@link G9PinEntry} (MAUI `G9PinEntry`). */\nexport interface G9PinEntryProps {\n  /** Number of cells when `groupSizes` is not set (at least 1). Default 4. */\n  readonly length?: number;\n  /** The code (controlled; MAUI `Value`). */\n  readonly value?: string;\n  /** Initial code while uncontrolled. Default `''`. */\n  readonly defaultValue?: string;\n  /** Once per change of the code (MAUI `ValueChanged`): typing, paste, `clear()`, a re-filter after a type change. */\n  readonly onValueChange?: (value: string) => void;\n  /** Once each time the code becomes complete (MAUI `Completed`); not for a complete value the parent pushes in. */\n  readonly onComplete?: (value: string) => void;\n  /** Accepted characters; `'password'` is digits shown masked. Default `'number'`. */\n  readonly type?: G9PinEntryType;\n  /** Filler glyph of an empty cell. Default none. */\n  readonly placeholder?: string | null;\n  /** Glyph of a masked cell. Default `'●'`. */\n  readonly maskCharacter?: string;\n  /** Cell groups such as `'4-4-4-4'`; when set, their sum is the cell count and `separator` sits between groups. */\n  readonly groupSizes?: string | null;\n  /** Text between groups. Default `'-'`. */\n  readonly separator?: string | null;\n  /** Cell width. Default 44 (`G9Metrics.PinCellWidth`). */\n  readonly cellWidth?: number;\n  /** Cell height. Default 52 (`G9Metrics.PinCellHeight`). */\n  readonly cellHeight?: number;\n  /** Focus once when mounted. Default false. */\n  readonly autoFocus?: boolean;\n  readonly disabled?: boolean;\n  /** Accessibility label of the row (the progress `n / total` is always announced). */\n  readonly accessibilityLabel?: string;\n  readonly className?: string;\n}\n\n/** Imperative handle of {@link G9PinEntry}. */\nexport interface G9PinEntryHandle {\n  /** Focuses the hidden input; typing appends after the last character (MAUI `FocusFirstEmpty`). */\n  focusFirstEmpty(): void;\n  /** Empties every cell (MAUI `Clear`). */\n  clear(): void;\n  /** Every cell is filled (MAUI `IsComplete`). */\n  readonly isComplete: boolean;\n}\n\n/** Parses `'4-3-3-2'` into positive group sizes; blanks and non-numbers are skipped (MAUI `ParseGroupSizes`). */\nexport function parsePinGroupSizes(raw: string | null | undefined): number[] {\n  if (raw == null || raw.trim() === '') return [];\n  const out: number[] = [];\n  for (const part of raw.split('-')) {\n    const trimmed = part.trim();\n    if (!/^[+]?\\d+$/.test(trimmed)) continue;\n    const n = Number(trimmed);\n    if (n > 0) out.push(n);\n  }\n  return out;\n}\n\n/** Cell count: the groups' sum, else `max(1, length)`. */\nexport function pinCellCount(length: number, groups: readonly number[]): number {\n  return groups.length > 0 ? groups.reduce((a, b) => a + b, 0) : Math.max(1, length);\n}\n\n// Lynx's JavaScript engine rejects Unicode property escapes (`/\\p{Nd}/u`), so `char.IsDigit` / `char.IsLetter` are\n// spelled out: the zero code points of every BMP decimal-digit block (Unicode category Nd), and \"letter\" as a cased\n// character or one of the uncased letter blocks forms meet (Arabic/Persian, Hebrew, Indic, Thai, CJK, kana, Hangul).\nconst digitZeros = [\n  0x30, 0x660, 0x6f0, 0x7c0, 0x966, 0x9e6, 0xa66, 0xae6, 0xb66, 0xbe6, 0xc66, 0xce6, 0xd66, 0xde6, 0xe50, 0xed0, 0xf20,\n  0x1040, 0x1090, 0x17e0, 0x1810, 0x1946, 0x19d0, 0x1a80, 0x1a90, 0x1b50, 0x1bb0, 0x1c40, 0x1c50, 0xa620, 0xa8d0,\n  0xa900, 0xa9d0, 0xa9f0, 0xaa50, 0xabf0, 0xff10,\n];\nconst uncasedLetterRanges: ReadonlyArray<readonly [number, number]> = [\n  [0x5d0, 0x5ea],\n  [0x620, 0x64a],\n  [0x66e, 0x6d3],\n  [0x6fa, 0x6ff],\n  [0x904, 0x939],\n  [0xe01, 0xe30],\n  [0x3041, 0x30ff],\n  [0x3400, 0x4dbf],\n  [0x4e00, 0x9fff],\n  [0xac00, 0xd7a3],\n];\n\nfunction isUnicodeDigit(ch: string): boolean {\n  const c = ch.charCodeAt(0);\n  for (const zero of digitZeros) if (c >= zero && c <= zero + 9) return true;\n  return false;\n}\n\nfunction isUnicodeLetter(ch: string): boolean {\n  if (ch.toLowerCase() !== ch.toUpperCase()) return true;\n  const c = ch.charCodeAt(0);\n  for (const [from, to] of uncasedLetterRanges) if (c >= from && c <= to) return true;\n  return false;\n}\n\n/** Whether the PIN type accepts a character (MAUI `IsAllowed`: `char.IsDigit` / `IsLetter` / `IsLetterOrDigit`). */\nexport function isPinCharAllowed(type: G9PinEntryType, ch: string): boolean {\n  switch (type) {\n    case G9PinEntryType.Letters:\n      return isUnicodeLetter(ch);\n    case G9PinEntryType.Alphanumeric:\n      return isUnicodeLetter(ch) || isUnicodeDigit(ch);\n    default:\n      return isUnicodeDigit(ch);\n  }\n}\n\n/**\n * Filters and clamps a code (MAUI `FilterAndClamp`): Persian and Arabic-Indic digits become ASCII, disallowed\n * characters are dropped, the rest is cut to `cells`.\n */\nexport function filterPin(raw: string | null | undefined, type: G9PinEntryType, cells: number): string {\n  if (!raw) return '';\n  let out = '';\n  for (const typed of Array.from(raw)) {\n    if (Array.from(out).length >= cells) break;\n    const ch = normalizeToAscii(typed);\n    if (isPinCharAllowed(type, ch)) out += ch;\n  }\n  return out;\n}\n\nconst hiddenInputStyle = {\n  position: 'absolute',\n  top: '0px',\n  left: '0px',\n  width: '1px',\n  height: '1px',\n  padding: '0px',\n  borderWidth: '0px',\n  opacity: 0,\n  color: 'transparent',\n  caretColor: 'transparent',\n  backgroundColor: 'transparent',\n} as const;\n\n/**\n * One-time-code / PIN entry (MAUI `G9PinEntry`): a row of cells over one hidden `<input>` (the lynx-ui `InputOTP`\n * pattern). Append-only: typing fills the next cell, backspace empties the last, a tap anywhere focuses the end.\n * Paste is filtered and clamped. Digits are stored as ASCII whatever keyboard produced them. Masked with\n * `type: 'password'`. Requires the host's `xelement-input` registration.\n */\nexport const G9PinEntry = forwardRef<G9PinEntryHandle, G9PinEntryProps>(function G9PinEntry(props, ref): ReactNode {\n  const keyboardAware = useContext(KeyboardAwareTriggerContext);\n  const type = props.type ?? G9PinEntryType.Number;\n  const groups = parsePinGroupSizes(props.groupSizes);\n  const cells = pinCellCount(props.length ?? 4, groups);\n  const [value, setValue] = useControllableState<string>({\n    value: props.value,\n    defaultValue: props.defaultValue ?? '',\n    onChange: props.onValueChange,\n    name: 'G9PinEntry.value',\n  });\n  const clean = filterPin(value, type, cells);\n  const chars = Array.from(clean);\n  const complete = chars.length === cells;\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<NodesRef | null>(null);\n  const native = useRef('');\n  const completedFired = useRef(complete);\n  const latest = useRef(clean);\n  latest.current = clean;\n  const [, bump] = useState(0);\n\n  // A pushed value the filter rejects is replaced once; a pushed complete value never fires `onComplete`.\n  const refiltered = useRef<string | null>(null);\n  useEffect(() => {\n    if (clean !== value && refiltered.current !== value) {\n      refiltered.current = value;\n      setValue(clean);\n    }\n  });\n  const lastSeen = useRef(clean);\n  if (lastSeen.current !== clean) {\n    lastSeen.current = clean;\n    if (!complete) completedFired.current = false;\n  }\n  const retries = useRef(0);\n  const sync = () => {\n    const current = latest.current;\n    if (native.current === current) return;\n    if (invokeNode(inputRef, 'setValue', { value: current })) {\n      native.current = current;\n      retries.current = 0;\n    } else if (inputRef.current && retries.current < 5) {\n      retries.current += 1;\n      startTimer(() => syncRef.current(), 0);\n    }\n  };\n  const syncRef = useRef(sync);\n  syncRef.current = sync;\n  const attach = useRef((node: NodesRef | null) => {\n    inputRef.current = node;\n    if (node) syncRef.current();\n  }).current;\n  useEffect(() => {\n    sync();\n  });\n\n  const focus = () => {\n    if (props.disabled) return;\n    invokeNode(inputRef, 'focus');\n    invokeNode(inputRef, 'setSelectionRange', { selectionStart: chars.length, selectionEnd: chars.length });\n  };\n  const clear = () => {\n    latest.current = '';\n    completedFired.current = false;\n    setValue('');\n    bump((n) => n + 1);\n  };\n  useImperativeHandle(ref, () => ({\n    focusFirstEmpty: focus,\n    clear,\n    get isComplete() {\n      return Array.from(latest.current).length === cells;\n    },\n  }));\n\n  const autoFocused = useRef(false);\n  useEffect(() => {\n    if (props.autoFocus && !autoFocused.current && !props.disabled) {\n      autoFocused.current = true;\n      invokeNodeWhenReady(inputRef, 'focus');\n    }\n  });\n\n  const onInput = (event: { detail?: { value?: string } }) => {\n    const raw = event.detail?.value ?? '';\n    native.current = raw;\n    const next = filterPin(raw, type, cells);\n    latest.current = next;\n    lastSeen.current = next;\n    setValue(next);\n    const ready = Array.from(next).length === cells;\n    if (ready && !completedFired.current) {\n      completedFired.current = true;\n      props.onComplete?.(next);\n    } else if (!ready) {\n      completedFired.current = false;\n    }\n    bump((n) => n + 1);\n  };\n\n  const cellWidth = props.cellWidth && props.cellWidth > 0 ? props.cellWidth : G9Metrics.PinCellWidth;\n  const cellHeight = props.cellHeight && props.cellHeight > 0 ? props.cellHeight : G9Metrics.PinCellHeight;\n  const active = focused ? Math.min(chars.length, cells - 1) : -1;\n  const separator = props.separator ?? '';\n  const row: ReactNode[] = [];\n  let groupIndex = 0;\n  let inGroup = 0;\n  for (let i = 0; i < cells; i++) {\n    const ch = chars[i];\n    const state = i === active ? 'active' : ch !== undefined ? 'filled' : 'empty';\n    row.push(\n      <view\n        key={`c${i}`}\n        className={`g9-pin__cell g9-pin__cell--${state}`}\n        style={{ width: `${cellWidth}px`, height: `${cellHeight}px` }}\n      >\n        <text className={ch !== undefined ? 'g9-pin__char' : 'g9-pin__placeholder'}>\n          {ch !== undefined\n            ? type === G9PinEntryType.Password\n              ? (props.maskCharacter ?? '●')\n              : ch\n            : (props.placeholder ?? '')}\n        </text>\n      </view>,\n    );\n    inGroup++;\n    if (groups.length > 0 && groupIndex < groups.length - 1 && inGroup === groups[groupIndex]) {\n      if (separator !== '') {\n        row.push(\n          <text key={`s${groupIndex}`} className=\"g9-pin__separator\">\n            {separator}\n          </text>,\n        );\n      }\n      groupIndex++;\n      inGroup = 0;\n    }\n  }\n\n  return (\n    <view\n      {...g9KeyboardTargetProps}\n      className={`g9-pin g9-dir-ltr${props.disabled ? ' g9-pin--disabled' : ''}${complete ? ' g9-pin--complete' : ''}${props.className ? ` ${props.className}` : ''}`}\n      accessibility-element={true}\n      accessibility-label={`${props.accessibilityLabel ? `${props.accessibilityLabel}, ` : ''}${chars.length} / ${cells}`}\n      bindtap={focus}\n    >\n      {row}\n      <input\n        {...g9KeyboardTargetProps}\n        ref={attach}\n        className=\"g9-pin__input\"\n        android-fullscreen-mode={false}\n        ignore-focus={true}\n        confirm-type=\"done\"\n        disabled={props.disabled === true}\n        maxlength={cells}\n        ios-auto-correct={false}\n        ios-spell-check={false}\n        type={type === G9PinEntryType.Number || type === G9PinEntryType.Password ? 'number' : 'text'}\n        style={hiddenInputStyle}\n        bindinput={onInput}\n        bindfocus={() => {\n          setFocused(true);\n          keyboardAware.onInputFocused?.();\n        }}\n        bindblur={() => {\n          setFocused(false);\n          keyboardAware.onInputBlurred?.();\n        }}\n      />\n    </view>\n  );\n});\n"],"names":["parsePinGroupSizes","raw","out","part","trimmed","n","Number","pinCellCount","length","groups","a","b","Math","digitZeros","uncasedLetterRanges","isUnicodeDigit","ch","c","zero","isUnicodeLetter","from","to","isPinCharAllowed","type","G9PinEntryType","filterPin","cells","typed","Array","normalizeToAscii","hiddenInputStyle","G9PinEntry","forwardRef","props","ref","_props_type","_props_length","_props_defaultValue","_props_separator","keyboardAware","useContext","KeyboardAwareTriggerContext","value","setValue","useControllableState","clean","chars","complete","focused","setFocused","useState","inputRef","useRef","native","completedFired","latest","bump","refiltered","useEffect","lastSeen","retries","sync","current","invokeNode","startTimer","syncRef","attach","node","focus","clear","useImperativeHandle","autoFocused","invokeNodeWhenReady","onInput","event","_event_detail","next","ready","cellWidth","G9Metrics","cellHeight","active","separator","row","groupIndex","inGroup","i","_props_maskCharacter","_props_placeholder","state","undefined","view","text","g9KeyboardTargetProps","input"],"mappings":"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"}

package/dist/fields/search-entry.d.ts

@@ -0,0 +1,35 @@
+import { type G9AbortSignal } from '@g9tm/lynxcontrols-foundation';
+import { type G9TextEntryHandle, type G9TextEntryProps } from './text-entry.js';
+/** Context of one search (`onSearch`). */
+export interface G9SearchContext {
+    /** Aborted when a newer query fires or the field unmounts: drop this query's results. */
+    readonly signal: G9AbortSignal;
+    /** Increases with every fired query; compare to discard a stale result. */
+    readonly version: number;
+}
+/** Props of {@link G9SearchEntry} (MAUI `G9SearchEntry`). */
+export interface G9SearchEntryProps extends G9TextEntryProps {
+    /** Quiet time after the last change before the query fires; `0` fires on every change. Default 250. */
+    readonly debounceMs?: number;
+    /** The debounced text (MAUI `DebouncedTextChanged`). */
+    readonly onDebouncedValueChange?: (value: string) => void;
+    /**
+     * Runs the search (MAUI `SearchCommand`): after the debounce, on the keyboard's search key and on `submit()`.
+     * A newer query aborts the previous one's signal (query versioning). A thrown error or rejected promise (other
+     * than an abort) goes to the provider's diagnostics.
+     */
+    readonly onSearch?: (query: string, context: G9SearchContext) => unknown;
+}
+/** Imperative handle of {@link G9SearchEntry}. */
+export interface G9SearchEntryHandle extends G9TextEntryHandle {
+    /** Fires the current text now, skipping the debounce (MAUI `Submit`). */
+    submit(): void;
+}
+/**
+ * Search field (MAUI `G9SearchEntry`): a `G9TextEntry` with a leading search glyph, the clear button, dictation on,
+ * the localized `search` placeholder, the floating-label clearance reserved, the keyboard's search key, and a
+ * debounced query. Every change of the text (typing, dictation, clear, a new `value` from the parent) restarts the
+ * debounce; the search key and `submit()` fire at once. Pending queries never fire after unmount.
+ */
+export declare const G9SearchEntry: import("react").ForwardRefExoticComponent<G9SearchEntryProps & import("react").RefAttributes<G9SearchEntryHandle>>;
+//# sourceMappingURL=search-entry.d.ts.map

package/dist/fields/search-entry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-entry.d.ts","sourceRoot":"","sources":["../../src/fields/search-entry.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,aAAa,EAGnB,MAAM,+BAA+B,CAAC;AAKvC,OAAO,EAAuB,KAAK,iBAAiB,EAAE,KAAK,gBAAgB,EAAiB,MAAM,cAAc,CAAC;AAGjH,0CAA0C;AAC1C,MAAM,WAAW,eAAe;IAC9B,yFAAyF;IACzF,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC;IAC/B,2EAA2E;IAC3E,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAED,6DAA6D;AAC7D,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;IAC1D,uGAAuG;IACvG,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAC7B,wDAAwD;IACxD,QAAQ,CAAC,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D;;;;OAIG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,KAAK,OAAO,CAAC;CAC1E;AAED,kDAAkD;AAClD,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,yEAAyE;IACzE,MAAM,IAAI,IAAI,CAAC;CAChB;AAED;;;;;GAKG;AACH,eAAO,MAAM,aAAa,oHAmHzB,CAAC"}

package/dist/fields/search-entry.jsx

@@ -0,0 +1,118 @@
+import { G9StringKey, createAbortController, isAbortError } from "@g9tm/lynxcontrols-foundation";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from "@lynx-js/react";
+import { startTimer, stopTimer } from "../base/timers.jsx";
+import { useControllableState } from "../base/use-controllable-state.jsx";
+import { useG9Diagnostics, useG9Settings, useG9Strings } from "../provider/hooks.jsx";
+import { TextEntryBody } from "./text-entry.jsx";
+const search_entry_G9SearchEntry = forwardRef(function(props, ref) {
+    var _props_defaultValue, _props_clearButton, _props_voiceEnabled, _props_reserveFloatingLabelClearance;
+    const glyphs = useG9Settings().glyphs;
+    const strings = useG9Strings();
+    const diagnostics = useG9Diagnostics();
+    const [text, setText] = useControllableState({
+        value: props.value,
+        defaultValue: null != (_props_defaultValue = props.defaultValue) ? _props_defaultValue : '',
+        onChange: props.onValueChange,
+        name: 'G9SearchEntry.value'
+    });
+    const latest = useRef({
+        text,
+        props
+    });
+    latest.current = {
+        text,
+        props
+    };
+    const timer = useRef(null);
+    const current = useRef(null);
+    const version = useRef(0);
+    const inner = useRef(null);
+    const stopDebounce = ()=>{
+        if (null !== timer.current) {
+            stopTimer(timer.current);
+            timer.current = null;
+        }
+    };
+    const report = (error)=>{
+        if (isAbortError(error)) return;
+        diagnostics.log({
+            level: 'error',
+            message: 'G9SearchEntry.onSearch failed.',
+            source: 'G9SearchEntry',
+            error
+        });
+    };
+    const fire = (value)=>{
+        var _current_current;
+        const p = latest.current.props;
+        null == (_current_current = current.current) || _current_current.abort();
+        const controller = createAbortController();
+        current.current = controller;
+        version.current += 1;
+        try {
+            var _p_onDebouncedValueChange, _p_onSearch;
+            null == (_p_onDebouncedValueChange = p.onDebouncedValueChange) || _p_onDebouncedValueChange.call(p, value);
+            const result = null == (_p_onSearch = p.onSearch) ? void 0 : _p_onSearch.call(p, value, {
+                signal: controller.signal,
+                version: version.current
+            });
+            if (result && 'function' == typeof result.then) result.then(void 0, report);
+        } catch (error) {
+            report(error);
+        }
+    };
+    const submit = ()=>{
+        stopDebounce();
+        fire(latest.current.text);
+    };
+    const first = useRef(true);
+    useEffect(()=>{
+        var _latest_current_props_debounceMs;
+        if (first.current) {
+            first.current = false;
+            return;
+        }
+        const ms = null != (_latest_current_props_debounceMs = latest.current.props.debounceMs) ? _latest_current_props_debounceMs : 250;
+        stopDebounce();
+        if (ms <= 0) return void fire(text);
+        timer.current = startTimer(()=>{
+            timer.current = null;
+            fire(latest.current.text);
+        }, ms);
+    }, [
+        text
+    ]);
+    useEffect(()=>()=>{
+            var _current_current;
+            stopDebounce();
+            null == (_current_current = current.current) || _current_current.abort();
+        }, []);
+    useImperativeHandle(ref, ()=>{
+        const base = inner.current;
+        return {
+            focus: ()=>base.focus(),
+            blur: ()=>base.blur(),
+            validate: ()=>base.validate(),
+            get isListening () {
+                return base.isListening;
+            },
+            toggleVoice: ()=>base.toggleVoice(),
+            startVoice: ()=>base.startVoice(),
+            stopVoice: ()=>base.stopVoice(),
+            get element () {
+                return base.element;
+            },
+            submit
+        };
+    });
+    const variant = {
+        name: 'G9SearchEntry.value',
+        restingTone: 'placeholder',
+        confirmType: 'search',
+        onConfirm: submit
+    };
+    return <TextEntryBody {...props} leadingIcon={void 0 === props.leadingIcon ? glyphs.search : props.leadingIcon} clearButton={null != (_props_clearButton = props.clearButton) ? _props_clearButton : true} voiceEnabled={null != (_props_voiceEnabled = props.voiceEnabled) ? _props_voiceEnabled : true} placeholder={void 0 === props.placeholder ? strings.get(G9StringKey.Search) : props.placeholder} reserveFloatingLabelClearance={null != (_props_reserveFloatingLabelClearance = props.reserveFloatingLabelClearance) ? _props_reserveFloatingLabelClearance : true} value={text} onValueChange={(value, details)=>setText(value, details)} variant={variant} ref={inner}/>;
+});
+export { search_entry_G9SearchEntry as G9SearchEntry };
+
+//# sourceMappingURL=search-entry.jsx.map