Add the frontend guides the v2 UI kit and compliance-portal need but
that the first rework left uncovered: forms, routing, client state, and
permission-gated UI.
forms.md documents a tiered approach on Base UI Field/Form -- native
constraints, then a validate function, then zod parsed in onSubmit, and
react-hook-form only for large or dynamic forms -- and drops the custom
useFormWithSchema wrapper. routing.md covers @probo/routes, navigation,
typed params, URL-as-state, redirects, auth/protected routes, and the
folded-in no-outlet-context rule. state-management.md gives a decision
order across Relay, URL, local state, context, and zustand.
permissions.md gates UI on the canUpdate/canDelete permission(action:)
fields without re-encoding authorization in the client.
Rename v2-colors.md to v2-tokens.md and add the typography, radius,
shadow, and native-spacing scales alongside color. Extend ui.md with
user feedback, empty-state, and accessibility sections; standardize
toasts on Base UI's Toast (Toast.useToastManager) and retire the legacy
useToast across ui.md, forms.md, error-handling.md, and relay.md. Add an
Intl formatting section to i18n.md and a non-Relay HTTP / file
upload-download section to ts-style.md. Update the AGENTS.md index and
the v2-color-scale cursor rule for the new and renamed guides.
Signed-off-by: Émile Ré <emile@probo.com>
Introduce a new v2 theme system in packages/ui/src/v2/ using
@radix-ui/colors for sand, gold, red, green, amber, and sky scales.
Colors are imported from the library (with P3 wide-gamut support),
mapped to Tailwind via @theme inline, and scoped under
[data-theme="v2"] for isolation from the existing v1 theme. Dark mode
activates via the .dark class on <html>.
Includes contributor docs (contrib/claude/v2-colors.md) and a Cursor
rule (.cursor/rules/v2-color-scale.mdc) for the color system.
Signed-off-by: Émile Ré <emile@probo.com>
