primevue
Version:
PrimeVue is a premium UI library for Vue featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, wh
209 lines (196 loc) • 5.9 kB
TypeScript
/**
*
* InputPassword is a minimal password input with a controllable mask state.
*
* [Live Demo](https://www.primevue.dev/inputpassword/)
*
* @module inputpassword
*
*/
import type { DefineComponent, DesignToken, EmitFn, HintedString, Nullable, PassThrough } from '@primevue/core';
import type { ComponentHooks } from '@primevue/core/basecomponent';
import type { InputTextPassThroughOptions } from 'primevue/inputtext';
import type { PassThroughOptions } from 'primevue/passthrough';
import { InputHTMLAttributes } from 'vue';
export declare type InputPasswordPassThroughOptionType = InputPasswordPassThroughAttributes | ((options: InputPasswordPassThroughMethodOptions) => InputPasswordPassThroughAttributes | string) | string | null | undefined;
/**
* Custom passthrough(pt) option method.
*/
export interface InputPasswordPassThroughMethodOptions {
/**
* Defines instance.
*/
instance: any;
/**
* Defines valid properties.
*/
props: InputPasswordProps;
/**
* Defines current inline state.
*/
state: Record<string, never>;
/**
* Defines valid attributes.
*/
attrs: any;
/**
* Defines parent options.
*/
parent: any;
/**
* Defines passthrough(pt) options in global config.
*/
global: object | undefined;
}
/**
* Custom shared passthrough(pt) option method.
*/
export interface InputPasswordSharedPassThroughMethodOptions {
/**
* Defines valid properties.
*/
props: InputPasswordProps;
/**
* Defines current inline state.
*/
state: Record<string, never>;
}
/**
* Custom passthrough(pt) options.
* @see {@link InputPasswordProps.pt}
*/
export interface InputPasswordPassThroughOptions {
/**
* Used to pass attributes to the root's DOM element.
*/
root?: InputPasswordPassThroughOptionType;
/**
* Used to pass attributes to the InputText component.
* @see {@link InputTextPassThroughOptions}
*/
pcInputText?: InputTextPassThroughOptions<InputPasswordSharedPassThroughMethodOptions>;
/**
* Used to manage all lifecycle hooks.
* @see {@link BaseComponent.ComponentHooks}
*/
hooks?: ComponentHooks;
}
/**
* Custom passthrough attributes for each DOM elements
*/
export interface InputPasswordPassThroughAttributes {
[key: string]: any;
}
/**
* Defines valid properties in InputPassword component.
*/
export interface InputPasswordProps extends Omit<InputHTMLAttributes, 'size'> {
/**
* Value of the component.
*/
modelValue?: Nullable<string>;
/**
* The default value for the input when not controlled by `modelValue`.
*/
defaultValue?: Nullable<string>;
/**
* The name attribute for the element, typically used in form submissions.
*/
name?: string | undefined;
/**
* Whether the password is rendered as masked. Use `v-model:mask` to make it two-way bindable.
* @defaultValue true
*/
mask?: boolean | undefined;
/**
* Defines the size of the component.
*/
size?: HintedString<'small' | 'large'> | undefined | null;
/**
* When present, it specifies that the component should have invalid state style.
* @defaultValue false
*/
invalid?: boolean | undefined | null;
/**
* When present, it specifies that the component should be disabled.
* @defaultValue false
*/
disabled?: boolean | undefined;
/**
* Specifies the input variant of the component.
* @defaultValue null
*/
variant?: HintedString<'outlined' | 'filled'> | undefined | null;
/**
* Spans 100% width of the container when enabled.
* @defaultValue null
*/
fluid?: boolean | undefined | null;
/**
* Form control object, typically used for handling validation and form state.
*/
formControl?: Record<string, any> | undefined;
/**
* It generates scoped CSS variables using design tokens for the component.
*/
dt?: DesignToken<any>;
/**
* Used to pass attributes to DOM elements inside the component.
* @type {InputPasswordPassThroughOptions}
*/
pt?: PassThrough<InputPasswordPassThroughOptions>;
/**
* Used to configure passthrough(pt) options of the component.
* @type {PassThroughOptions}
*/
ptOptions?: PassThroughOptions;
/**
* When enabled, it removes component related styles in the core.
* @defaultValue false
*/
unstyled?: boolean;
}
/**
* Defines valid slots in InputPassword component.
*/
export interface InputPasswordSlots {}
/**
* Defines valid emits in InputPassword component.
*/
export interface InputPasswordEmitsOptions {
/**
* Emitted when the value changes.
* @param {string} value - New value.
*/
'update:modelValue'(value: string | undefined): void;
/**
* Emitted when the value changes in uncontrolled mode.
* @param {string} value - New value.
*/
'value-change'(value: string | undefined): void;
/**
* Emitted when the mask state changes via `toggleMask()`.
* @param {boolean} value - New mask state.
*/
'update:mask'(value: boolean): void;
}
export declare type InputPasswordEmits = EmitFn<InputPasswordEmitsOptions>;
/**
* **PrimeVue - InputPassword**
*
* _InputPassword is a minimal password input with a controllable mask state._
*
* [Live Demo](https://www.primevue.dev/inputpassword/)
* --- ---
* 
*
* @group Component
*
*/
declare const InputPassword: DefineComponent<InputPasswordProps, InputPasswordSlots, InputPasswordEmits>;
declare module 'vue' {
export interface GlobalComponents {
InputPassword: DefineComponent<InputPasswordProps, InputPasswordSlots, InputPasswordEmits>;
}
}
export default InputPassword;