import { LitElement, PropertyValues } from '../../../../../node_modules/lit'; import { PasswordFieldAutocomplete, PasswordFieldPart, PasswordFieldRule, PasswordFieldRuleName, PasswordFieldValidation, PasswordFieldVariant, SbPasswordFieldProps as Props } from './field.types'; /** * Self-validating password input field for use in auth widget forms. * * @part password-field - rtg-field: root * @part password-field-label - rtg-field-label * @part password-field-mark - span: decorative marker text/caret in label * @part password-field-forgot - rtg-button: forgot password button * @part password-field-description - rtg-field-description * @part password-field-input - rtg-input/rtg-password-input * @part password-field-error - rtg-field-error: inline validation error message * * @event sb-password-field:validate - Fired when validation runs, on form submit or via the public `validate()` method. * Detail: `{ id: string; inputId: string; name: string; value: string; valid: boolean; type: PasswordFieldValidateType; message: string }` * - type: `"success" | "required" | "minlength" | "maxlength" | "format"` * @event sb-password-field:forgot-click - Fired when the forgot button is clicked, before the auth call. * Detail: `{ id: string; forgotId: string; event?: string }` * - `event` is the `forgotEvent` prop * @event sb-password-field:forgot-success - Fired after the auth call resolves successfully. * Detail: `{ id: string; forgotId: string; event: string; result: ProcessEventResponse }` * @event sb-password-field:forgot-error - Fired when the auth call fails. * Detail: `{ id: string; forgotId: string; event: string; message: string }` */ export declare class SbPasswordField extends LitElement implements Props { static readonly ROOT = "password-field"; static readonly LABEL = "label"; static readonly MARK = "mark"; static readonly FORGOT = "forgot"; static readonly DESCRIPTION = "description"; static readonly INPUT = "input"; static readonly ERROR = "error"; static readonly TAG: string; static readonly VALIDATE_EVENT: string; static readonly FORGOT_CLICK_EVENT: string; static readonly FORGOT_SUCCESS_EVENT: string; static readonly FORGOT_ERROR_EVENT: string; static readonly PARTS: Record; static readonly INPUT_SELECTORS: string; static readonly RULE_PATTERNS: Record; /** * Substring used in generated part IDs. */ seed: string; /** * Custom ID used as the root part ID and as the base of subpart IDs. */ customId?: string; /** * ID given to the input part, forwarded to its inner input element. */ private _inputId?; private get _defaultInputId(); get inputId(): string; set inputId(value: string | null | undefined); /** * HTML `name` attribute forwarded to the inner input, used as the form data * key on submission. */ private _name; get name(): string; set name(value: string); /** * Pre-fills the input until the user types and their input takes over. * Resetting the form restores this value. */ defaultValue?: string; /** * Text used in the label part of the field. */ private _label; get label(): string; set label(value: string); /** * Placeholder text shown inside the input when empty. */ placeholder?: string; /** * Text used in the description part of the field. */ description?: string; /** * Controls the variation of input element rendered. * When `"toggle"`, a toggleable input with a hide/show button is rendered. */ variant: PasswordFieldVariant; /** * Custom text used in the mark part of the field label. */ mark?: string; /** * When provided with `required`, the mark part is rendered with an asterisk. * Has no effect if a custom `mark` text is provided. */ caret?: boolean; /** * HTML `autocomplete` hint forwarded to the inner input element. */ autocomplete?: PasswordFieldAutocomplete; /** * Disables the field, forgot button, and inner input, preventing interaction. */ disabled?: boolean; /** * Marks the field as required: validation fails if field is empty. */ required?: boolean; /** * Minimum number of characters required for a valid password. */ private _minlength?; get minlength(): number | undefined; set minlength(value: number | undefined); /** * Maximum number of characters accepted for a valid password. */ private _maxlength?; get maxlength(): number | undefined; set maxlength(value: number | undefined); /** * Format rules evaluated against the password during validation. * Each rule specifies either a predefined `name` mapped to a built-in regex * or a custom regex `pattern`, and an optional rule-specific `error` message. */ rules: PasswordFieldRule[]; /** * Controls validation depth, only enforcing the required check if `"simple"`. */ validation: PasswordFieldValidation; /** * Error message used when the field is required but empty. */ private _requiredError?; private get _defaultRequiredError(); get requiredError(): string; set requiredError(value: string | null | undefined); /** * Error message used when the field is shorter than `minlength`. */ private _minlengthError?; private get _defaultMinlengthError(); get minlengthError(): string; set minlengthError(value: string | null | undefined); /** * Error message used when the field is longer than `maxlength`. */ private _maxlengthError?; private get _defaultMaxlengthError(); get maxlengthError(): string; set maxlengthError(value: string | null | undefined); /** * Fallback error message used when field does not satisfy password format * rules and the unmet rules have not specified an `error` message. */ private _formatError?; private get _defaultFormatError(); get formatError(): string; set formatError(value: string | null | undefined); /** * Whether the forgot part button is rendered. */ forgot?: boolean; /** * Text used as the label of the forgot part button. */ private _forgotLabel; get forgotLabel(): string; set forgotLabel(value: string); /** * Event identifier forwarded to the auth service on click of the forgot part. * When omitted, only the custom forgot click event is dispatched. */ forgotEvent?: string; /** * Tracks whether the field is currently in an invalid state. */ private _invalid; /** * Error message(s) displayed in the error part when the field is invalid. */ private _errors; /** * Raw value of the password field input, synced on each input event. */ private _value; /** * Indicates that the forgot button is dispatching or emitting an event. */ private _loading; /** * Gates whether `defaultValue` or `_value` is authoritative for `this.value`. * True once the user has typed into the input. */ private _dirty; /** * Reference to the nearest `
` ancestor. */ private _form; protected createRenderRoot(): this; get rootId(): string; get labelId(): string; get markId(): string; get forgotId(): string; get descriptionId(): string; get errorId(): string; /** * Normalized value of the password field input. */ get value(): string; get isDisabled(): boolean; updated(changed: PropertyValues): void; connectedCallback(): void; disconnectedCallback(): void; /** * Triggers validation and returns `true` if the current value is valid, * `false` otherwise. */ validate(): boolean; private _dispatchValidate; private _onValidateSuccess; private _onValidateError; private _validate; private _handleInput; private _handleFormSubmit; private _handleFormReset; private _handleForgotClick; private _renderMark; private _renderForgot; render(): import('../../../../../node_modules/lit-html').TemplateResult<1>; }