HITL support for react-package

[dcruzeneil2]

Note

Medium Risk
Embeds a backend-provided URL in an iframe during login, which affects trust boundaries and UX in the auth flow though session logic is mostly mapping and presentation.

Overview
Adds human-in-the-loop (HITL) handling when the backend reports AWAITING_HUMAN_INTERVENTION: the session maps that flow step to a new awaiting_human_intervention UI state and KernelManagedAuth renders a dedicated step instead of the normal form or external-action waiters.

The new HumanInterventionStep shows localized copy (with an appearance slot on the message), embeds state.live_view_url in a 4:3 iframe when present (with a “Live” badge and clipboard-write), or falls back to bouncing dots while the URL is missing. Default English strings and optional localization keys were added for this step.

Styles widen the shell/card via :has(.kma-human-intervention) and animate max-width so the live view has room (up to ~960px).

^{Reviewed by Cursor Bugbot for commit 956c8b1. Bugbot is set up for automated code reviews on this repo. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
managed-auth-react-demo	Ready	Preview, Comment	Jun 3, 2026 2:27pm

[firetiger-agent]

Firetiger deploy monitoring skipped

This PR didn't match the auto-monitor filter configured on your GitHub connection:

PRs in the kernel, infra, hypeman, and hypeship repos. kernel is a ~mono repo with many logical services underneath, ensure to focus on the implicated service for the PR

Reason: PR is for react-package, which is not one of the specified monitored repos (kernel, infra, hypeman, hypeship).

To monitor this PR anyway, reply with @firetiger monitor this.

[vercel]

Additional Suggestion:

HumanInterventionStep component is not exported from the package's main index.ts file, breaking consistency with other step components and preventing headless usage.

[vercel]

The iframe element in HumanInterventionStep.tsx is missing the sandbox attribute, which lacks protection against potential XSS and script injection attacks

[masnwilliams]

reviewed alongside the server side (kernel/kernel#2117). the flow lines up well — the AWAITING_HUMAN_INTERVENTION enum and live_view_url match both ends, the SSE merge already propagates the url, and the bouncing-dots fallback handles the timing gap nicely. but the PR doesn't currently compile, and a few user-facing bits need to route through the customization systems:

blocking

• src/components/HumanInterventionStep.tsx:18 — slot("humanInterventionMessage", ...) references an appearance key that was never added to AppearanceElements. since AppearanceElementKey = keyof AppearanceElements (no index signature), bun run typecheck fails:
  error TS2345: Argument of type '"humanInterventionMessage"' is not assignable to parameter of type 'keyof AppearanceElements'.
  register humanInterventionMessage in src/appearance/types.ts to fix the build and actually expose the slot.

customization / localization / styling

• src/appearance/types.ts — also add a slot for the live-view iframe wrap (e.g. humanInterventionFrame) and apply it on .kma-human-intervention__iframe-wrap. it's this step's distinctive visual element (the way externalActionIcon is for the external-action step), so customers should be able to theme it.
• src/components/HumanInterventionStep.tsx — the Live badge label is a hardcoded literal; it's the only string in the component not going through l.*. add a humanInterventionLiveBadge localization key (localization/types.ts + defaults.ts) and render {l.humanInterventionLiveBadge}.
• src/styles/styles.css — hardcoded colors should use design tokens: live dot oklch(0.704 0.191 22.216) → var(--kma-color-danger) (red live indicator = that semantic); badge rgba(0,0,0,0.65) / #fff → prefer tokens for the overlay foreground at least.

note (no action)

• the iframe has no sandbox. fine here — live_view_url is built entirely server-side (kernel-controlled origin) and the live view needs full interactivity to solve the captcha, so a restrictive sandbox would break it. flagging only because the trust boundary was raised in the summary.