# Input Number — Figma Assembly Rules
<!-- figma-assembly.v2
{ "schemaVersion":"figma-assembly.v2", "id":"component.input-number", "level":"atom", "kind":"published", "aliases":["Input Number","wbl-input-number"], "uxSpec":"specs/ux/components/atoms/input-number.md", "inventoryTarget":"input-number", "componentKeys":["109b292804f51203e563c30a4375645781328a50"], "dependencies":[], "optionalDependencies":["component.icon"], "coveredBy":[] }
-->

Status: active Figma assembly contract.

## Scope

Use this contract when placing or revising a WB Logistics Input Number in
Figma. It distinguishes the current canonical set from a known legacy set so
that an explicitly preserved screen does not silently lose existing overrides.

## Source Evidence

- [Input Number UX spec](input-number.md).
- Direct Figma evidence:.
- Canonical component set: `15337:82913`, `Input Number`, key
  `109b292804f51203e563c30a4375645781328a50`.
- Legacy component set: `1878:21838`, `Input Number`, key
  `79da3a76888d6c064d16381dae841348b4d463a0`.

## Canonical Properties

Use these keys exactly, including leading whitespace and symbols. For automated
assembly, read them from `componentPropertyDefinitions` and never reconstruct
their suffixes.

| Exact key | Type | Default / values | Assembly use |
| --- | --- | --- | --- |
| ` Right Icon#15035:14` | Boolean | `true` | Figma-only generic right-icon anatomy; no matching runtime adornment API. |
| ` Left Icon#15035:25` | Boolean | `true` | Figma-only generic left-icon anatomy; no matching runtime adornment API. |
| `   left icon#15035:28` | Instance swap | shared icon | Do not use for numeric step controls. |
| `  right icon#15035:31` | Instance swap | shared icon | Do not use for numeric step controls. |
| `Description#15035:54` | Boolean | `false` | Shows description anatomy. |
| ` ✸ Required#15225:0` | Boolean | `false` | Shows the required marker. |
| `Label#15225:7` | Boolean | `true` | Shows the label. |
| `Placeholder#15225:14` | Boolean | `true` | Shows the placeholder. |
| `Focused#15225:28` | Boolean | `false` | Focus preview only. |
| `→ RightContent#15233:0` | Boolean | `false` | Generic Figma slot; do not treat as a runtime input. |
| ` Clear#15233:7` | Boolean | `true` | Shows the cleaner control. |
| `← LeftContent#15233:14` | Boolean | `false` | Generic Figma slot; do not treat as a runtime input. |
| ` description#15626:0` | Text | `Description` | Description copy. |
| ` label#15626:13` | Text | `Label` | Label copy. |
| ` placeholder#15626:26` | Text | `Placeholder` | Placeholder copy. |
| `Value#15626:39` | Text | `Value` | Displayed numeric value. |
| `Size` | Variant | `L – 56`; `M – 44` | Published canonical sizes. |
| `State` | Variant | `Default`; `Active`; `Disable` | Published canonical visual states. |
| `Filled` | Variant | `on`; `off` | Filled/empty visual state. |

The canonical set exposes no verified `Error` state or error-text property.
Those raw keys are unresolved by design: do not invent them. An error treatment
needs a verified shared-field composition or a future canonical library update.

## Known Legacy Properties

| Exact key | Type | Default / values |
| --- | --- | --- |
| `Value Text#29896:318` | Text | `Value` |
| `Label Text#29896:355` | Text | `Label` |
| `Desciption Text#29897:0` | Text | `Description`; spelling is published as shown |
| `Description#29897:40` | Boolean | `false` |
| `Placeholder Text#29897:80` | Text | `Placeholder` |
| `Placeholder#29897:120` | Boolean | `true` |
| `Error Text#29897:268` | Text | `Error` |
| `Size` | Variant | `L`; `M` |
| `State` | Variant | `Default`, `Hover (value)`, `Error`, `Active`, `Error Active`, `Disabled`, `Hover (icon)`, `Focused (value)`, `Focused (icon)`, `Disabled (icon)`, `Error Focused` |
| `Filled` | Variant | `Off`; `On` |

## Required Assembly

- Dependency classification: `component.icon` is optional because the
  canonical field can render without either generic icon slot; use it only when
  a verified visible icon instance is configured.
- Rule ID: `input-number.canonical` — use the canonical key for new assemblies.
  New v3 runs do not permit a noncanonical Input Number key; migrate it instead
  of applying the Tabs-only legacy exception mechanism.
- Keep the field-wrapper shell, input text, label, placeholder, cleaner, and
  step anatomy inside the library instance. Do not detach to add plus/minus
  controls.
- `Size`, `State`, and `Filled` are variant properties. Text and booleans must
  use their full generated keys.
- Use the runtime-aligned label/value/description properties. Generic side
  content and icon swaps are Figma anatomy, not evidence for new
  `wbl-input-number` APIs.
- Preserve library fills, strokes, typography, radius, focus, and disabled
  bindings. Numeric min/max/postfix/step behavior belongs to the screen/runtime
  contract and is not encoded by visual-only Figma properties.

## Legacy Preservation And Explicit Migration

- A resumed v1/v2 trace may preserve an already-owned baseline with legacy key
  `79da3a76888d6c064d16381dae841348b4d463a0`, clone that exact instance and
  preserve its overrides. Never swap by matching the display name. A new v3
  assembly must migrate to the canonical set before its component gate passes.
- The schemas are not property-compatible: canonical `M – 44` is legacy `M`,
  canonical `Disable` is legacy `Disabled`, and canonical filled values use
  lowercase.
- If migration is explicitly requested, create a canonical instance and remap
  semantic values: legacy value → `Value#15626:39`; label →
  ` label#15626:13`; description → ` description#15626:0`; placeholder →
  ` placeholder#15626:26`. Reapply visibility booleans with their canonical
  keys.
- Legacy `Error Text#29897:268` and the legacy error-state family have no
  verified canonical target. Stop the migration at that gap rather than
  approximating it.

## Verification Checklist

- `input-number.canonical`: a v3 component owner is canonical and is never
  inferred from the layer name; historical preservation is limited to a
  resumed v1/v2 trace.
- Every generated property key is copied exactly from the owning set.
- Legacy error states remain legacy until a canonical equivalent is verified.
- Instance stays undetached and nested controls retain their library bindings.