{
  "schemaVersion": "1.0",
  "id": "verify-otp",
  "title": "Nhập mã đăng nhập",
  "purpose": "Nhập mã một trường, đếm ngược gửi lại và xử lý OTP sai/hết hạn.",
  "roles": [
    "public"
  ],
  "group": "authentication-home-setup",
  "variantOf": null,
  "layout": {
    "canvas": {
      "width": 390,
      "height": 844
    },
    "responsive": {
      "minimumWidth": 360,
      "maximumWidth": 430,
      "scroll": "vertical",
      "safeAreaBottom": true,
      "fontScale": "native dynamic type; reflow without clipping",
      "keyboard": "composer sticky within resized viewport; dialog scrolls; no fixed keyboard overlay"
    },
    "regions": [
      {
        "id": "header",
        "order": 0,
        "type": "safe-area/header",
        "height": "intrinsic"
      },
      {
        "id": "content",
        "order": 1,
        "type": "purpose-specific auth",
        "componentIds": [
          "screen-header",
          "verify-otp-0",
          "verify-otp-1",
          "verify-otp-2",
          "verify-otp-3",
          "screen-actions"
        ]
      },
      {
        "id": "actions",
        "order": 2,
        "type": "one primary + secondary controls"
      },
      {
        "id": "navigation",
        "order": 3,
        "type": "none"
      }
    ]
  },
  "components": [
    {
      "id": "screen-header",
      "type": "Header",
      "props": {
        "homeLabel": "Nhà Lá",
        "scopeGate": "U",
        "backTarget": null,
        "settingsTarget": null
      },
      "tokens": {
        "foreground": "{semantic.light.fg}",
        "darkForeground": "{semantic.dark.fg}"
      },
      "accessibility": {
        "label": "Thanh đầu màn hình",
        "readingOrder": 0,
        "focusOrder": "back then settings"
      }
    },
    {
      "id": "verify-otp-0",
      "type": "OtpContext",
      "props": {
        "contentText": "Email:  an@example.invalid"
      },
      "tokens": {
        "background": "{semantic.light.surface}",
        "foreground": "{semantic.light.fg}",
        "darkBackground": "{semantic.dark.surface}",
        "darkForeground": "{semantic.dark.fg}",
        "bodySize": "{primitive.type.body}",
        "touchTarget": "{primitive.space.48}"
      },
      "accessibility": {
        "label": "Nhập mã đăng nhập · OtpContext",
        "readingOrder": 1,
        "colorOnly": false,
        "fontScaling": true,
        "minimumTouchTarget": 48,
        "instructions": "Đọc theo thứ tự; công bố nhãn trạng thái và lỗi, không chỉ màu."
      }
    },
    {
      "id": "verify-otp-1",
      "type": "Field",
      "props": {
        "name": "otp",
        "label": "Mã 6 chữ số",
        "type": "text",
        "value": "",
        "required": true,
        "min": null,
        "max": null,
        "options": null,
        "hint": "Dùng 123456 để thử đăng nhập.",
        "pattern": "[0-9]{6}"
      },
      "tokens": {
        "background": "{semantic.light.surface}",
        "foreground": "{semantic.light.fg}",
        "darkBackground": "{semantic.dark.surface}",
        "darkForeground": "{semantic.dark.fg}",
        "bodySize": "{primitive.type.body}",
        "touchTarget": "{primitive.space.48}"
      },
      "accessibility": {
        "label": "Mã 6 chữ số",
        "readingOrder": 2,
        "colorOnly": false,
        "fontScaling": true,
        "minimumTouchTarget": 48,
        "instructions": "Đọc theo thứ tự; công bố nhãn trạng thái và lỗi, không chỉ màu."
      }
    },
    {
      "id": "verify-otp-2",
      "type": "ResendTimer",
      "props": {
        "contentText": "Gửi lại sau  30 s"
      },
      "tokens": {
        "background": "{semantic.light.surface}",
        "foreground": "{semantic.light.fg}",
        "darkBackground": "{semantic.dark.surface}",
        "darkForeground": "{semantic.dark.fg}",
        "bodySize": "{primitive.type.body}",
        "touchTarget": "{primitive.space.48}"
      },
      "accessibility": {
        "label": "Nhập mã đăng nhập · ResendTimer",
        "readingOrder": 3,
        "colorOnly": false,
        "fontScaling": true,
        "minimumTouchTarget": 48,
        "instructions": "Đọc theo thứ tự; công bố nhãn trạng thái và lỗi, không chỉ màu."
      }
    },
    {
      "id": "verify-otp-3",
      "type": "Notice",
      "props": {
        "text": "Không thấy mã? Kiểm tra thư mục thư rác hoặc gửi lại.",
        "tone": "warn"
      },
      "tokens": {
        "background": "{semantic.light.surface}",
        "foreground": "{semantic.light.fg}",
        "darkBackground": "{semantic.dark.surface}",
        "darkForeground": "{semantic.dark.fg}",
        "bodySize": "{primitive.type.body}",
        "touchTarget": "{primitive.space.48}"
      },
      "accessibility": {
        "label": "Nhập mã đăng nhập · Notice",
        "readingOrder": 4,
        "colorOnly": false,
        "fontScaling": true,
        "minimumTouchTarget": 48,
        "instructions": "Đọc theo thứ tự; công bố nhãn trạng thái và lỗi, không chỉ màu."
      }
    },
    {
      "id": "screen-actions",
      "type": "ActionGroup",
      "props": {
        "actions": [
          {
            "id": "navigate-0",
            "label": "Đăng nhập",
            "kind": "submit",
            "target": "household-start",
            "confirmationRequired": false
          },
          {
            "id": "navigate-1",
            "label": "Đổi email",
            "kind": "navigate",
            "target": "login-email",
            "confirmationRequired": false
          },
          {
            "id": "resend",
            "label": "Gửi lại mã",
            "kind": "select",
            "target": null,
            "confirmationRequired": false
          }
        ],
        "primaryCount": 1
      },
      "tokens": {
        "lightBackground": "{component.light.button.background}",
        "lightForeground": "{component.light.button.foreground}",
        "darkBackground": "{component.dark.button.background}",
        "darkForeground": "{component.dark.button.foreground}",
        "height": "{primitive.space.48}"
      },
      "accessibility": {
        "label": "Hành động của màn hình",
        "keyboard": true,
        "focusVisible": true,
        "disabledOnlyLowContrast": true
      }
    }
  ],
  "fields": [
    {
      "id": "otp",
      "label": "Mã 6 chữ số",
      "control": "text",
      "default": "",
      "options": null,
      "validation": {
        "required": true,
        "trim": true,
        "type": "text",
        "min": null,
        "max": null,
        "pattern": "[0-9]{6}",
        "serverAuthoritative": true,
        "errorMessage": "Kiểm tra mã 6 chữ số."
      },
      "binding": "otp",
      "keyboard": "numeric",
      "accessibleErrorAssociation": "form error summary via role alert; native bind field-specific error ID"
    }
  ],
  "states": [
    {
      "id": "waiting",
      "when": "Mã đã yêu cầu",
      "visibleUI": "Một trường có autocomplete one-time-code và resend cooldown",
      "availableActions": [
        "navigate-0",
        "navigate-1",
        "resend"
      ],
      "mutationPolicy": "Actor, exact capability and current versions must still pass; this state never grants rights."
    },
    {
      "id": "invalid",
      "when": "OTP không khớp",
      "visibleUI": "Thông báo lỗi, không xóa trường",
      "availableActions": [
        "navigate-0",
        "navigate-1",
        "resend"
      ],
      "mutationPolicy": "Actor, exact capability and current versions must still pass; this state never grants rights."
    },
    {
      "id": "expired",
      "when": "OTP hết hạn",
      "visibleUI": "Cho yêu cầu mã mới",
      "availableActions": [
        "navigate-1",
        "resend"
      ],
      "mutationPolicy": "Actor, exact capability and current versions must still pass; this state never grants rights."
    },
    {
      "id": "replayed",
      "when": "Mã đã sử dụng",
      "visibleUI": "Không tạo thêm phiên; yêu cầu mã khác",
      "availableActions": [
        "navigate-0",
        "navigate-1",
        "resend"
      ],
      "mutationPolicy": "Actor, exact capability and current versions must still pass; this state never grants rights."
    }
  ],
  "actions": [
    {
      "id": "navigate-0",
      "label": "Đăng nhập",
      "kind": "submit",
      "targetScreenId": "household-start",
      "permission": "U",
      "confirmationRequired": false,
      "contractRef": "local draft/navigation",
      "localBehavior": "Only validated draft/local domain where supported; remote adapters never report success.",
      "idempotency": null
    },
    {
      "id": "navigate-1",
      "label": "Đổi email",
      "kind": "navigate",
      "targetScreenId": "login-email",
      "permission": "U",
      "confirmationRequired": false,
      "contractRef": "local draft/navigation",
      "localBehavior": "Only validated draft/local domain where supported; remote adapters never report success.",
      "idempotency": null
    },
    {
      "id": "resend",
      "label": "Gửi lại mã",
      "kind": "select",
      "targetScreenId": null,
      "permission": "U",
      "confirmationRequired": false,
      "contractRef": "local view context"
    }
  ],
  "dataBindings": [
    {
      "source": "/api/auth/*",
      "shape": {
        "email": "string",
        "otp": "6 digit string",
        "retry_after": "seconds",
        "session": "server only"
      },
      "sample": {
        "email": "an@example.invalid",
        "otp": "not stored",
        "retry_after": 30
      },
      "sampleOnly": true,
      "actorConstraint": "exact actor allowlist",
      "envelope": "API refs use CommandEnvelope; local review context is not an API property."
    }
  ],
  "copy": {
    "heading": "Nhập mã đăng nhập",
    "primary": "Đăng nhập",
    "empty": null,
    "notices": [
      "Không thấy mã? Kiểm tra thư mục thư rác hoặc gửi lại."
    ],
    "locale": "vi",
    "demoLabel": "Bản thiết kế · dữ liệu mẫu · không kết nối dịch vụ"
  },
  "implementation": {
    "nativeRoute": "/design/verify-otp",
    "nativeRouteStatus": "proposed mapping, verify against implementing native navigator",
    "copyAuthority": "Use copy and component UI props for interface text; permission, state conditions and implementation notes are not user-facing copy",
    "apiRefs": [
      "/api/auth/*"
    ],
    "newContractRefs": [],
    "notes": [
      "Tất cả ví dụ là dữ liệu thiết kế, không bằng chứng native/API/store đã chạy.",
      "Native route dưới đây là đề xuất mapping cho agent, không tuyên bố route source đã tồn tại.",
      "Mọi mutation dùng envelope {data,version,household_revision,replayed}, stable Idempotency-Key và expected_version khi sửa."
    ],
    "integrationStatus": "design complete; local static/draft interactions; native/API adapters pending",
    "sourceAuthority": [
      "docs/product-brief.md",
      "plans/261013-1409-sweepy-vietnam-mobile/mobile-flows.md",
      "plans/261013-1409-sweepy-vietnam-mobile/api-contracts.md",
      "packages/domain/src/contracts/phase2.ts",
      "packages/domain/src/index.ts",
      "packages/domain/src/contracts/phase3.ts",
      "packages/domain/src/contracts/billing.ts",
      "apps/mobile/src/lib/api.ts"
    ],
    "capability": "U",
    "errors": {
      "401": "Stop queue; adult login or child re-pair without parent account.",
      "403": "Do not retry lost capability. FEATURE_REQUIRED never grants Pro.",
      "409": "Fetch canonical scoped state; review/reconfirm new intent, do not rewrite old replay payload.",
      "422": "Field error with retained draft.",
      "429": "Respect Retry-After.",
      "503": "Backoff only retryable commands with original key."
    }
  }
}