Pin Code Table of Contents

• Props
• Events
• Slots

Propertiestype BreakpointCustomizable<T> = { base: T; xs?: T; s?: T; m?: T; l?: T; xl?: T; xxl?: T; };PropertyAttributeDescriptionTypeDefaultdescription descriptionThe description text.string''disabled disabledDisables the Pin Code. No events will be triggered while disabled state is active.booleanfalseform formThe id of a form element the pin-code should be associated with.stringundefinedhideLabel 🛠hide-labelShow or hide label and description text. For better accessibility it is recommended to show the label.boolean
BreakpointCustomizable<boolean>falselabel labelThe label text.string''length lengthNumber of characters of the Pin Code.type PinCodeLength =
1
2
3
4
5
64loading loadingDisables the Pin Code and shows a loading indicator. No events will be triggered while loading state is active.booleanfalsemessage messageThe message styled depending on validation state.string''name nameName of the control.stringundefinedrequired requiredMarks the Pin Code as required.booleanfalsestate stateThe validation state.type PinCodeState =
'none'
'error'
'success''none'theme themeAdapts the color depending on the theme.type Theme =
'light'
'dark'
'auto''light'type typePin Code type.type PinCodeType =
number
'password''number'value valueSets the initial value of the Pin Code.string''EventsEventDescriptionTypeupdate Emitted when selected element changes.type PinCodeUpdateEventDetail = {
  value: string;
  isComplete: boolean;
}
CustomEvent<PinCodeUpdateEventDetail>SlotsSlotDescriptionisRequiredaltPropallowedTagNames<slot name="label"> Shows a label. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.<slot name="description"> Shows a description. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.<slot name="message"> Shows a state message. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.