Input Password Table of Contents

• Props
• Events
• Slots
• CSS Variables

Propertiestype BreakpointCustomizable<T> = { base: T; xs?: T; s?: T; m?: T; l?: T; xl?: T; xxl?: T; };PropertyAttributeDescriptionTypeDefaultautoComplete auto-completeSpecifies whether the input can be autofilled by the browsertype InputPasswordAutoComplete =
'off'
'on'
''
'current-password'
'new-password'''compact compactDisplays as compact version.booleanfalsedescription descriptionThe description text.string''disabled disabledMarks the password input as disabled.booleanfalseform formThe id of a form element the password input 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''maxLength max-lengthThe max length of the password input.numberundefinedmessage messageThe message styled depending on validation state.string''minLength min-lengthThe min length of the password input.numberundefinedname nameThe name of the password input.stringundefinedplaceholder placeholderThe placeholder text.string''readOnly read-onlySpecifies whether the password input should be read-only.booleanfalserequired requiredMarks the password input as required.booleanfalsestate stateThe validation state.type InputPasswordState =
'none'
'error'
'success''none'theme themeAdapts the color depending on the theme.type Theme =
'light'
'dark'
'auto''light'toggle toggleShow or hide password toggle for input type="password".booleanfalsevalue valueThe password input value.string''EventsEventDescriptionTypeblur Emitted when the password input has lost focus.type InputPasswordBlurEventDetail = Event
CustomEvent<InputPasswordBlurEventDetail>change Emitted when the password input loses focus after its value was changed.type InputPasswordChangeEventDetail = Event
CustomEvent<InputPasswordChangeEventDetail>input Emitted when the value has been changed as a direct result of a user action.type InputPasswordInputEventDetail = InputEvent
CustomEvent<InputPasswordInputEventDetail>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.<slot name="start"> Shows content at the start of the input (e.g. unit prefix).<slot name="end"> Shows content at the end of the input (e.g. toggle button, unit suffix).CSS VariablesCSS VariableDescriptiondefaultValue--ref-p-input-slotted-padding When slotting a `p-button-pure` or `p-link-pure` this variable needs to be set as `padding` in oder to adjust the alignment correctly.--ref-p-input-slotted-margin When slotting a `p-button-pure` or `p-link-pure` this variable needs to be set as `margin` in oder to adjust the spacings correctly.