Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA canonical-URL field that validates the address as you type, reports whether it is self-referencing and resets to the page's own URL.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it in page settings next to the slug. Most pages should be self-referencing; the note says so, and a mistake (http, a fragment, a query) is caught before publishing.
Do not use it when: canonicals are set globally by a rule rather than per page.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
pageUrl | string | required | The page's own URL, the default and the reset target. |
defaultValue | string | pageUrl | Starting value. |
onChange | (value: string, valid: boolean) => void | - | Called with every value and whether it passed. |
A labelled input type="url". The verdict is a polite live region linked by aria-describedby, and an invalid value sets aria-invalid. The reset is a button.
The pattern ships with a test (canonical-url-field.test.tsx). It covers the validation rules, aria-invalid and the reset.