Skip to content

feat: add the party id input component - #77

Open
gabitoesmiapodo wants to merge 11 commits into
feat/explorer-linkfrom
feat/8-party-id-input-component
Open

feat: add the party id input component#77
gabitoesmiapodo wants to merge 11 commits into
feat/explorer-linkfrom
feat/8-party-id-input-component

Conversation

@gabitoesmiapodo

@gabitoesmiapodo gabitoesmiapodo commented Aug 6, 2026

Copy link
Copy Markdown
Collaborator

Closes #8

Note: this merges into #74 so review that one first.

Summary

A dApp had no way to let a user enter a Canton party id, so every form rolled its own shape check.

Changes

  • Controlled PartyIdInput reports every change and its validation error to the caller
  • A malformed value is flagged with aria-invalid from the first blur onward, never while first typing
  • Pasted whitespace is trimmed on blur
  • validatePartyId and isValidPartyId are exported so a form can gate submit on the same check
  • The grant form's receiver field uses the new input and supplies its own error wording
  • Demo seed party ids now carry full 68-character fingerprints

Deviations

Against the issue's requirements

  • A valid value stays as typed; truncating inside an editable field would fight the caret, so <Identifier> still owns formatted display
  • No TextInput primitive exists in the kit, so the field renders a plain <input>; the issue's note assumed one that was never built

Rode along with the work

  • Dropped the unused ref prop from Identifier and ExplorerLink, never consumed by anyone
  • Added scripts/add-component.mjs, a component scaffolder written while making this one
  • The explorer link now requires a well-formed party id, so the package holds one definition of the shape instead of two

Acceptance criteria

  • Controlled component: value in via prop, changes reported via callback
  • Flags input that doesn't match the basic party id shape
  • Displays a valid value in truncated/formatted form
  • Built on the existing text input primitive, not a new input from scratch

Test plan

Automated tests

  1. Run pnpm install from the repo root
  2. Run pnpm -C canton-dappbooster test
  3. Expect 103 passing tests across 9 files
  4. Run pnpm lint and pnpm typecheck from the root and expect no errors

Manual verification

  1. Check out this branch and run pnpm run app:dev
  2. Open http://localhost:3012, pick a party, and go to the create-grant page
  3. Type nico into Receiver party id, then click elsewhere
  4. Expect a red field and "Use a full party id (hint::fingerprint)."
  5. Paste a full hint::fingerprint id with a leading space, then click elsewhere
  6. Expect the space gone, the red state cleared, and Create enabled

Breaking changes

Identifier and ExplorerLink no longer accept a ref prop.
Nothing in this repo passed one; a consumer that does should drop it or request it back.

Checklist

  • Self-reviewed my own diff
  • Tests added or updated
  • Docs updated (if applicable)
  • No unrelated changes bundled in

Screenshots

image image image image

Identifier and ExplorerLink both declared and forwarded a ref no consumer
passes. Adding it back later is non-breaking; keeping it published is a
contract we would owe forever for a case nothing has needed yet.
detectEntity classified on a bare '::' check, so a half-typed id linked to a
party page that cannot exist. It now uses the same validator the input does.
- Blur reports the reason it starts flagging, so the caller can render a
  message for the state the field just painted.
- A consumer-supplied aria-invalid wins, for errors the kit cannot know about;
  the demo uses it for a grant to your own party.
- Blur trims the whitespace a paste brings, rather than calling it a bad
  fingerprint.
- The invalid state is applied and asserted through anatomy.states.
- Corrects the theme comment: flagging goes live from the first blur.
The rule covered how to take a ref but not whether to publish one, which is
the decision the kit components actually made.
@gabitoesmiapodo gabitoesmiapodo self-assigned this Aug 6, 2026
@gabitoesmiapodo gabitoesmiapodo linked an issue Aug 6, 2026 that may be closed by this pull request
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Party id input component

1 participant