@kelvininc/ui-components
Version:
Kelvin UI Components
116 lines (115 loc) • 3.66 kB
TypeScript
import { EventEmitter } from '../../stencil-public-runtime';
import { EComponentSize } from '../../utils/types';
import { EInputFieldType, EValidationState, ITextFieldEvents, ITextField } from './text-field.types';
import { EIconName } from '../icon/icon.types';
import { ITooltip } from '../tooltip/tooltip.types';
import { HostAttributes } from '../../stencil-public-runtime';
/**
* @part input-container - container that includes the input, right and left slot
* @part badge - badge rendered at the right of the text field
*/
export declare class KvTextField implements ITextField, ITextFieldEvents {
private nativeInput?;
private maskInstance;
el: HTMLKvTextFieldElement;
/** @inheritdoc */
type: EInputFieldType;
/** @inheritdoc */
label?: string;
/** @inheritdoc */
examples?: string[];
/** @inheritdoc */
icon?: EIconName;
/** @inheritdoc */
actionIcon?: EIconName;
/** @inheritdoc */
inputName?: string;
/** @inheritdoc */
placeholder?: string;
/** @inheritdoc */
maxLength?: number;
/** @inheritdoc */
minLength?: number;
/** @inheritdoc */
max?: string | number;
/** @inheritdoc */
min?: string | number;
/** @inheritdoc */
step?: string | number;
/** @inheritdoc */
size?: EComponentSize;
/** @inheritdoc */
inputDisabled: boolean;
/** @inheritdoc */
inputRequired: boolean;
/** @inheritdoc */
loading: boolean;
/** @inheritdoc */
state: EValidationState;
/** @inheritdoc */
inputReadonly: boolean;
/** @inheritdoc */
helpText: string | string[];
/** @inheritdoc */
forcedFocus: boolean;
/** @inheritdoc */
tooltipConfig?: Partial<ITooltip>;
/** @inheritdoc */
value?: string | number | null;
/** @inheritdoc */
valuePrefix?: string;
/** @inheritdoc */
badge?: string;
/** @inheritdoc */
isDirty?: boolean;
/** @inheritdoc */
useInputMask?: boolean;
/** @inheritdoc */
inputMaskRegex?: string;
/** @inheritdoc */
fitContent?: boolean;
/** @inheritdoc */
customStyle?: HostAttributes['style'];
/** @inheritdoc */
hideBadge?: boolean;
/** Focuses the input */
focusInput(): Promise<void>;
/** Watch `value` property for changes and update native input element accordingly */
valueChangeHandler(newValue: string | number | null): void;
/** Internal help texts state */
_helpTexts: string[];
/** Watch the `helpText` property and update internal state accordingly */
helpTextChangeHandler(newValue: string | string[]): void;
/** Watch the `forcedFocus` property and update internal state accordingly */
forcedFocusChangeHandler(newValue: boolean): void;
handleUseInputMask(newValue?: boolean): void;
componentWillLoad(): void;
componentDidLoad(): void;
/** Text field focus state */
focused: boolean;
/** @inheritdoc */
textChange: EventEmitter<string>;
/** @inheritdoc */
textFieldBlur: EventEmitter<string>;
/** @inheritdoc */
textFieldFocus: EventEmitter<string>;
/** @inheritdoc */
rightActionClick: EventEmitter<MouseEvent>;
/** @inheritdoc */
fieldClick: EventEmitter<MouseEvent>;
private onHostClick;
private onRightActionClick;
private onInputHandler;
private onPasteHandler;
private onBlurHandler;
private onFocusHandler;
private updateAndEmitValue;
private buildHelpTextMessages;
private getValue;
private getType;
private getTooltipConfig;
private getMinValue;
private getMaxValue;
private getUseInputMask;
render(): any;
}