JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 7335
  • Score
    100M100P100Q129742F
  • License EUPL-1.2

Textbox component for the Municipality of Utrecht based on the NL Design System architecture

Package Exports

  • @utrecht/textbox-css
  • @utrecht/textbox-css/dist/index.css

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@utrecht/textbox-css) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Text box

Metadata van veelgebruikte formuliervelden

Data type autocomplete spellcheck translate value component input direction
Naam name false no bdi auto
Voornaam (1 of meerdere) given-name false no bdi leeg of auto
Voorvoegsel false no bdi auto
Achternaam family-name false no bdi auto
Adresregel 1 address-line1 no - -
Adresregel 2 address-line2 no - -
Adresregel 3 address-line3 no - -
Postcode postal-code false no - -
Straatnaam no - -
Huisnummer no - -
Huisletter no - -
Huisnummer toevoeging false no - -
Woonplaats - -
Burgerservicenummer false no - -
E-mailadres email false no URLData ltr
Website url false no URLData ltr
Bestandsnaam no URLData -
Wachtwoord password / new-password / current-password false no URLData -
Geboortedatum bday -
Telefoonnummer (Europa en internationaal) tel false ltr
Mobiel telefoonnummer (Europa en internationaal) mobile tel false ltr
Telefoonnummer thuis (Europa en internationaal) home tel false ltr
Telefoonnummer werk (Europa en internationaal) work tel false ltr
Faxnummer (Europa en internationaal) fax tel false ltr
Telefoonnummer binnen Nederland tel-national false ltr
Mobiel telefoonnummer binnen Nederland mobile tel-national false ltr
Telefoonnummer thuis binnen Nederland home tel-national false ltr
Telefoonnummer werk binnen Nederland work tel-national false ltr
Faxnummer binnen Nederland fax tel-national false ltr
Kenteken false -

Let op:

  • Straatnaam moet niet autocomplete="street-address" gebruiken, street-address is voor een textarea.

Terminologie

Class names

  • .utrecht-textbox
  • .utrecht-textbox--invalid
  • .utrecht-textbox--disabled
  • .utrecht-textbox--read-only

Design Tokens

  • Textbox:
    • --utrecht-textbox-border-bottom-width
    • --utrecht-textbox-border-color
    • --utrecht-textbox-border-radius
    • --utrecht-textbox-border-width
    • --utrecht-textbox-color
    • --utrecht-textbox-font-family
    • --utrecht-textbox-font-size
    • --utrecht-textbox-max-inline-size
    • --utrecht-textbox-padding-block-end
    • --utrecht-textbox-padding-block-start
    • --utrecht-textbox-padding-inline-end
    • --utrecht-textbox-padding-inline-start
    • Modifier: disabled
      • --utrecht-textbox-disabled-border-color
      • --utrecht-textbox-disabled-color
    • Modifier: invalid
      • --utrecht-textbox-invalid-border-color
      • --utrecht-textbox-invalid-border-width
    • Modifier: read-only:
      • --utrecht-textbox-read-only-border-color
      • --utrecht-textbox-read-only-color

Privacy

Gebruik spellcheck="false" voor velden die gevoelige informatie kunnen bevatten, zoals wachtwoorden en persoonsgegevens. Sommige browser extensions voor spellingcontrole sturen deze informatie naar externe servers.