139cdebe51
## Thinking Path > - Paperclip is the open source app people use to manage AI agents for work. > - Human operators sign in through the main auth page and through invite acceptance flows. > - Those forms need to be understandable to assistive technology and password managers. > - The login fields did not consistently expose stable names, ids, autocomplete hints, required state, and error relationships. > - That made it easier for password managers such as 1Password to miss the username/password pairing and harder for screen readers to associate validation errors. > - This pull request tightens the auth and invite form metadata while keeping the visible flow unchanged. > - The benefit is a smoother login and invite-acceptance experience without changing server-side auth behavior. ## Linked Issues or Issue Description No matching GitHub issue found after searching `login accessibility 1Password username password` in `paperclipai/paperclip` issues and PRs. ## What happened? Login and invite auth fields were missing password-manager and accessibility metadata, including stable field identifiers, autocomplete hints, required semantics, and error-region relationships. That made it easier for password managers such as 1Password to miss the username/password pairing and harder for screen readers to associate validation errors. ## Expected behavior Auth fields should be discoverable as username/password fields, distinguish sign-in and sign-up password autocomplete behavior, and expose validation errors through an alert region referenced by invalid inputs. ## Steps to reproduce 1. Open the main `/auth` form or an invite auth form. 2. Inspect the email, password, and sign-up name field attributes. 3. Trigger a validation/auth error and inspect whether invalid inputs reference the displayed error text. ## Paperclip version or commit Prior to this PR on `master`. ## Deployment mode Board UI, all deployments using these forms. ## What Changed - Added stable `id`, `name`, `required`, `aria-required`, `aria-invalid`, `aria-describedby`, and autocomplete metadata to the main auth form. - Added invite auth field metadata so invite sign-up uses `new-password`, invite sign-in uses `current-password`, and the email field is recognized as `username`. - Added alert regions for auth and invite auth errors so invalid fields can reference the displayed error text. - Added focused Vitest coverage for the main auth form and invite auth flow metadata/error behavior. ## Verification - `pnpm exec vitest run ui/src/pages/Auth.test.tsx ui/src/pages/InviteLanding.test.tsx` passes: 2 files, 16 tests. - `pnpm build` passes locally. - PR CI is green on head `3531d1900`, including Build, Canary Dry Run, Typecheck + Release Registry, e2e, general/serialized test shards, policy, commitperclip review, security checks, and aggregate `verify`. - Greptile Review is passing on head `3531d1900`; the P2 alert/live-region review thread was fixed and resolved. - Rebasing onto `public-gh/master` completed cleanly; current base ref is `e50666e4c`. - Confirmed the branch diff does not include `pnpm-lock.yaml`, `.github/workflows`, migrations, or design/image assets. - No screenshots attached: this is a form metadata/accessibility change, and the task specifically asked not to add design screenshots or images unless they are part of the work. ## Risks Low risk. The change is limited to UI form attributes and error wiring. Main risk is password-manager/browser interpretation differences, covered by asserting the emitted DOM metadata rather than a specific vendor integration. > For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and discuss it in `#dev` before opening the PR. Feature PRs that overlap with planned core work may need to be redirected — check the roadmap first. See `CONTRIBUTING.md`. ## Model Used OpenAI Codex, GPT-5-based coding model with repository tool use and shell execution. Exact hosted model ID/context window are not exposed in this runtime. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I have searched GitHub for duplicate or related PRs and linked them above - [x] I have either (a) linked existing issues with `Fixes: #` / `Closes #` / `Refs #` OR (b) described the issue in-PR following the relevant issue template - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] If this change affects the UI, I have included before/after screenshots - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [x] All Paperclip CI gates are green - [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
@paperclipai/ui
Published static assets for the Paperclip board UI.
What gets published
The npm package contains the production build under dist/. It does not ship the UI source tree or workspace-only dependencies.
Storybook
Storybook config, stories, and fixtures live under ui/storybook/.
pnpm --filter @paperclipai/ui storybook
pnpm --filter @paperclipai/ui build-storybook
Typical use
Install the package, then serve or copy the built files from node_modules/@paperclipai/ui/dist.