@lekseek/ui
Version:
Vue 3 components library
838 lines (837 loc) • 26.9 kB
TypeScript
import { nextTick, PropType } from 'vue';
import { CssClass } from '../../helpers/css-classes';
import { SelectItem, SelectItemKey, SelectValue } from './models';
declare const _default: import("vue").DefineComponent<{
error: {
type: PropType<boolean>;
default: boolean;
};
size: {
type: PropType<"sm" | "md" | "lg">;
default: string;
};
rounded: {
type: PropType<boolean>;
default: boolean;
};
roundedLg: {
type: PropType<boolean>;
default: boolean;
};
round: {
type: PropType<boolean>;
default: boolean;
};
bordered: {
type: PropType<boolean>;
default: boolean;
};
dark: {
type: PropType<boolean>;
default: boolean;
};
light: {
type: PropType<boolean>;
default: boolean;
};
modelValue: {
type: PropType<SelectValue>;
default: null;
};
multiple: {
type: PropType<boolean>;
default: boolean;
};
items: {
type: PropType<SelectItem[]>;
required: true;
};
hideArrow: {
type: PropType<boolean>;
default: boolean;
};
label: {
type: PropType<string | null>;
default: null;
};
placeholder: {
type: PropType<string | null>;
default: null;
};
maxHeight: {
type: PropType<number>;
default: number;
};
persistent: {
type: PropType<boolean>;
default: boolean;
};
disabled: {
type: PropType<boolean>;
default: boolean;
};
labelColor: {
type: PropType<string>;
default: string;
};
search: {
type: PropType<boolean>;
default: boolean;
};
searchPlaceholder: {
type: PropType<string | null>;
default: null;
};
leftIcon: {
type: PropType<string | null>;
default: null;
};
leftIconClickable: {
type: PropType<boolean>;
default: boolean;
};
leftIconColor: {
type: PropType<string | null>;
default: null;
};
clearable: {
type: PropType<boolean>;
default: boolean;
};
externalSearch: {
type: PropType<boolean>;
default: boolean;
};
}, {
themeClass: import("vue").ComputedRef<{
'is-dark': any;
'is-light': any;
}>;
borderedClass: import("vue").ComputedRef<{
'is-bordered': any;
}>;
roundedClass: import("vue").ComputedRef<{
'is-rounded': any;
'is-rounded-lg': any;
'is-round': any;
}>;
bem: ({ b, e, m }: import("../../models").BemItem) => string[];
selectedItems: import("vue").ComputedRef<SelectItem[]>;
isItemSelected: (key: SelectItemKey) => boolean;
selectedItem: import("vue").ComputedRef<SelectItem | null>;
isExpanded: import("vue").Ref<boolean>;
searchQuery: import("vue").Ref<string>;
handleItemClick: (item: SelectItem) => void;
clearSelection: () => void;
removeItemFromSelected: (key: SelectItemKey) => void;
toggle: () => void;
searchInput: import("vue").Ref<({
$: import("vue").ComponentInternalInstance;
$data: {
isFocused: boolean;
};
$props: Partial<{
error: boolean;
bordered: boolean;
dark: boolean;
light: boolean;
type: string;
size: "sm" | "md" | "lg";
modelValue: string | number | null;
placeholder: string | null;
required: boolean;
min: string | number | null;
max: string | number | null;
maxlength: string | number | null;
step: number;
label: string | null;
width: number | null;
leftIcon: string | null;
rightIcon: string | null;
leftIconClickable: boolean;
rightIconClickable: boolean;
leftIconColor: string | null;
rightIconColor: string | null;
rememberCaretPosition: boolean;
disabled: boolean;
autofocus: boolean;
readonly: boolean;
depressed: boolean;
rounded: boolean;
roundedLg: boolean;
round: boolean;
}> & Omit<Readonly<import("vue").ExtractPropTypes<{
size: {
type: PropType<"sm" | "md" | "lg">;
default: string;
};
depressed: {
type: PropType<boolean>;
default: boolean;
};
error: {
type: PropType<boolean>;
default: boolean;
};
rounded: {
type: PropType<boolean>;
default: boolean;
};
roundedLg: {
type: PropType<boolean>;
default: boolean;
};
round: {
type: PropType<boolean>;
default: boolean;
};
bordered: {
type: PropType<boolean>;
default: boolean;
};
dark: {
type: PropType<boolean>;
default: boolean;
};
light: {
type: PropType<boolean>;
default: boolean;
};
modelValue: {
type: PropType<string | number | null>;
default: null;
};
placeholder: {
type: PropType<string | null>;
default: null;
};
type: {
type: PropType<string>;
default: string;
};
required: {
type: PropType<boolean>;
default: boolean;
};
min: {
type: PropType<string | number | null>;
default: null;
};
max: {
type: PropType<string | number | null>;
default: null;
};
maxlength: {
type: PropType<string | number | null>;
default: null;
};
step: {
type: PropType<number>;
default: number;
};
label: {
type: PropType<string | null>;
default: null;
};
width: {
type: PropType<number | null>;
default: null;
};
leftIcon: {
type: PropType<string | null>;
default: null;
};
rightIcon: {
type: PropType<string | null>;
default: null;
};
leftIconClickable: {
type: PropType<boolean>;
default: boolean;
};
rightIconClickable: {
type: PropType<boolean>;
default: boolean;
};
leftIconColor: {
type: PropType<string | null>;
default: null;
};
rightIconColor: {
type: PropType<string | null>;
default: null;
};
rememberCaretPosition: {
type: PropType<boolean>;
default: boolean;
};
disabled: {
type: PropType<boolean>;
default: boolean;
};
autofocus: {
type: PropType<boolean>;
default: boolean;
};
readonly: {
type: PropType<boolean>;
default: boolean;
};
}>> & {
onClick?: ((...args: any[]) => any) | undefined;
onBlur?: ((...args: any[]) => any) | undefined;
onFocus?: ((...args: any[]) => any) | undefined;
onInput?: ((...args: any[]) => any) | undefined;
onMouseenter?: ((...args: any[]) => any) | undefined;
onMouseleave?: ((...args: any[]) => any) | undefined;
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
onEnter?: ((...args: any[]) => any) | undefined;
"onClick-left-icon"?: ((...args: any[]) => any) | undefined;
"onClick-right-icon"?: ((...args: any[]) => any) | undefined;
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "error" | "bordered" | "dark" | "light" | "type" | "size" | "modelValue" | "placeholder" | "required" | "min" | "max" | "maxlength" | "step" | "label" | "width" | "leftIcon" | "rightIcon" | "leftIconClickable" | "rightIconClickable" | "leftIconColor" | "rightIconColor" | "rememberCaretPosition" | "disabled" | "autofocus" | "readonly" | "depressed" | "rounded" | "roundedLg" | "round">;
$attrs: {
[x: string]: unknown;
};
$refs: {
[x: string]: unknown;
};
$slots: Readonly<{
[name: string]: import("vue").Slot | undefined;
}>;
$root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
$parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
$emit: (event: "click" | "blur" | "focus" | "input" | "mouseenter" | "mouseleave" | "update:modelValue" | "enter" | "click-left-icon" | "click-right-icon", ...args: any[]) => void;
$el: any;
$options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
size: {
type: PropType<"sm" | "md" | "lg">;
default: string;
};
depressed: {
type: PropType<boolean>;
default: boolean;
};
error: {
type: PropType<boolean>;
default: boolean;
};
rounded: {
type: PropType<boolean>;
default: boolean;
};
roundedLg: {
type: PropType<boolean>;
default: boolean;
};
round: {
type: PropType<boolean>;
default: boolean;
};
bordered: {
type: PropType<boolean>;
default: boolean;
};
dark: {
type: PropType<boolean>;
default: boolean;
};
light: {
type: PropType<boolean>;
default: boolean;
};
modelValue: {
type: PropType<string | number | null>;
default: null;
};
placeholder: {
type: PropType<string | null>;
default: null;
};
type: {
type: PropType<string>;
default: string;
};
required: {
type: PropType<boolean>;
default: boolean;
};
min: {
type: PropType<string | number | null>;
default: null;
};
max: {
type: PropType<string | number | null>;
default: null;
};
maxlength: {
type: PropType<string | number | null>;
default: null;
};
step: {
type: PropType<number>;
default: number;
};
label: {
type: PropType<string | null>;
default: null;
};
width: {
type: PropType<number | null>;
default: null;
};
leftIcon: {
type: PropType<string | null>;
default: null;
};
rightIcon: {
type: PropType<string | null>;
default: null;
};
leftIconClickable: {
type: PropType<boolean>;
default: boolean;
};
rightIconClickable: {
type: PropType<boolean>;
default: boolean;
};
leftIconColor: {
type: PropType<string | null>;
default: null;
};
rightIconColor: {
type: PropType<string | null>;
default: null;
};
rememberCaretPosition: {
type: PropType<boolean>;
default: boolean;
};
disabled: {
type: PropType<boolean>;
default: boolean;
};
autofocus: {
type: PropType<boolean>;
default: boolean;
};
readonly: {
type: PropType<boolean>;
default: boolean;
};
}>> & {
onClick?: ((...args: any[]) => any) | undefined;
onBlur?: ((...args: any[]) => any) | undefined;
onFocus?: ((...args: any[]) => any) | undefined;
onInput?: ((...args: any[]) => any) | undefined;
onMouseenter?: ((...args: any[]) => any) | undefined;
onMouseleave?: ((...args: any[]) => any) | undefined;
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
onEnter?: ((...args: any[]) => any) | undefined;
"onClick-left-icon"?: ((...args: any[]) => any) | undefined;
"onClick-right-icon"?: ((...args: any[]) => any) | undefined;
}, {
themeClass: import("vue").ComputedRef<{
'is-dark': any;
'is-light': any;
}>;
borderedClass: import("vue").ComputedRef<{
'is-bordered': any;
}>;
roundedClass: import("vue").ComputedRef<{
'is-rounded': any;
'is-rounded-lg': any;
'is-round': any;
}>;
depressedClass: import("vue").ComputedRef<{
'is-depressed': any;
}>;
validationBorderClass: import("vue").ComputedRef<{
'is-bordered': any;
'has-border-color-error': any;
}>;
}, {
isFocused: boolean;
}, {
widthStyle(): {
[x: string]: any;
};
styles(): {
[x: string]: any;
};
classes(): CssClass[];
}, {
setFocusStatus(isFocused: boolean): void;
onFocus(): void;
onBlur(e: any): void;
onInput(e: any): void;
enter(e: any): void;
onLeftIconClick(): void;
onRightIconClick(): void;
focus(): void;
}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "blur" | "focus" | "input" | "mouseenter" | "mouseleave" | "update:modelValue" | "enter" | "click-left-icon" | "click-right-icon")[], string, {
error: boolean;
bordered: boolean;
dark: boolean;
light: boolean;
type: string;
size: "sm" | "md" | "lg";
modelValue: string | number | null;
placeholder: string | null;
required: boolean;
min: string | number | null;
max: string | number | null;
maxlength: string | number | null;
step: number;
label: string | null;
width: number | null;
leftIcon: string | null;
rightIcon: string | null;
leftIconClickable: boolean;
rightIconClickable: boolean;
leftIconColor: string | null;
rightIconColor: string | null;
rememberCaretPosition: boolean;
disabled: boolean;
autofocus: boolean;
readonly: boolean;
depressed: boolean;
rounded: boolean;
roundedLg: boolean;
round: boolean;
}> & {
beforeCreate?: ((() => void) | (() => void)[]) | undefined;
created?: ((() => void) | (() => void)[]) | undefined;
beforeMount?: ((() => void) | (() => void)[]) | undefined;
mounted?: ((() => void) | (() => void)[]) | undefined;
beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
updated?: ((() => void) | (() => void)[]) | undefined;
activated?: ((() => void) | (() => void)[]) | undefined;
deactivated?: ((() => void) | (() => void)[]) | undefined;
beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
destroyed?: ((() => void) | (() => void)[]) | undefined;
unmounted?: ((() => void) | (() => void)[]) | undefined;
renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
};
$forceUpdate: () => void;
$nextTick: typeof nextTick;
$watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
} & Readonly<import("vue").ExtractPropTypes<{
size: {
type: PropType<"sm" | "md" | "lg">;
default: string;
};
depressed: {
type: PropType<boolean>;
default: boolean;
};
error: {
type: PropType<boolean>;
default: boolean;
};
rounded: {
type: PropType<boolean>;
default: boolean;
};
roundedLg: {
type: PropType<boolean>;
default: boolean;
};
round: {
type: PropType<boolean>;
default: boolean;
};
bordered: {
type: PropType<boolean>;
default: boolean;
};
dark: {
type: PropType<boolean>;
default: boolean;
};
light: {
type: PropType<boolean>;
default: boolean;
};
modelValue: {
type: PropType<string | number | null>;
default: null;
};
placeholder: {
type: PropType<string | null>;
default: null;
};
type: {
type: PropType<string>;
default: string;
};
required: {
type: PropType<boolean>;
default: boolean;
};
min: {
type: PropType<string | number | null>;
default: null;
};
max: {
type: PropType<string | number | null>;
default: null;
};
maxlength: {
type: PropType<string | number | null>;
default: null;
};
step: {
type: PropType<number>;
default: number;
};
label: {
type: PropType<string | null>;
default: null;
};
width: {
type: PropType<number | null>;
default: null;
};
leftIcon: {
type: PropType<string | null>;
default: null;
};
rightIcon: {
type: PropType<string | null>;
default: null;
};
leftIconClickable: {
type: PropType<boolean>;
default: boolean;
};
rightIconClickable: {
type: PropType<boolean>;
default: boolean;
};
leftIconColor: {
type: PropType<string | null>;
default: null;
};
rightIconColor: {
type: PropType<string | null>;
default: null;
};
rememberCaretPosition: {
type: PropType<boolean>;
default: boolean;
};
disabled: {
type: PropType<boolean>;
default: boolean;
};
autofocus: {
type: PropType<boolean>;
default: boolean;
};
readonly: {
type: PropType<boolean>;
default: boolean;
};
}>> & {
onClick?: ((...args: any[]) => any) | undefined;
onBlur?: ((...args: any[]) => any) | undefined;
onFocus?: ((...args: any[]) => any) | undefined;
onInput?: ((...args: any[]) => any) | undefined;
onMouseenter?: ((...args: any[]) => any) | undefined;
onMouseleave?: ((...args: any[]) => any) | undefined;
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
onEnter?: ((...args: any[]) => any) | undefined;
"onClick-left-icon"?: ((...args: any[]) => any) | undefined;
"onClick-right-icon"?: ((...args: any[]) => any) | undefined;
} & import("vue").ShallowUnwrapRef<{
themeClass: import("vue").ComputedRef<{
'is-dark': any;
'is-light': any;
}>;
borderedClass: import("vue").ComputedRef<{
'is-bordered': any;
}>;
roundedClass: import("vue").ComputedRef<{
'is-rounded': any;
'is-rounded-lg': any;
'is-round': any;
}>;
depressedClass: import("vue").ComputedRef<{
'is-depressed': any;
}>;
validationBorderClass: import("vue").ComputedRef<{
'is-bordered': any;
'has-border-color-error': any;
}>;
}> & {
isFocused: boolean;
} & {
widthStyle: {
[x: string]: any;
};
styles: {
[x: string]: any;
};
classes: CssClass[];
} & {
setFocusStatus(isFocused: boolean): void;
onFocus(): void;
onBlur(e: any): void;
onInput(e: any): void;
enter(e: any): void;
onLeftIconClick(): void;
onRightIconClick(): void;
focus(): void;
} & import("vue").ComponentCustomProperties) | null>;
handleBlur: () => void;
}, unknown, {
computedSearchPlaceholder(): string;
classes(): CssClass[];
labelClasses(): CssClass[];
arrowClasses(): CssClass[];
dropdownClasses(): CssClass[];
computedPlaceholder(): string | null;
selectedItemText(): string | null;
filteredItems(): SelectItem[];
}, {
itemClasses(item: SelectItem): CssClass[];
onClickOutside(): void;
onLeftIconClick(): void;
}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "select" | "click-left-icon" | "update:model-value" | "search")[], "change" | "select" | "search" | "click-left-icon" | "update:model-value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
error: {
type: PropType<boolean>;
default: boolean;
};
size: {
type: PropType<"sm" | "md" | "lg">;
default: string;
};
rounded: {
type: PropType<boolean>;
default: boolean;
};
roundedLg: {
type: PropType<boolean>;
default: boolean;
};
round: {
type: PropType<boolean>;
default: boolean;
};
bordered: {
type: PropType<boolean>;
default: boolean;
};
dark: {
type: PropType<boolean>;
default: boolean;
};
light: {
type: PropType<boolean>;
default: boolean;
};
modelValue: {
type: PropType<SelectValue>;
default: null;
};
multiple: {
type: PropType<boolean>;
default: boolean;
};
items: {
type: PropType<SelectItem[]>;
required: true;
};
hideArrow: {
type: PropType<boolean>;
default: boolean;
};
label: {
type: PropType<string | null>;
default: null;
};
placeholder: {
type: PropType<string | null>;
default: null;
};
maxHeight: {
type: PropType<number>;
default: number;
};
persistent: {
type: PropType<boolean>;
default: boolean;
};
disabled: {
type: PropType<boolean>;
default: boolean;
};
labelColor: {
type: PropType<string>;
default: string;
};
search: {
type: PropType<boolean>;
default: boolean;
};
searchPlaceholder: {
type: PropType<string | null>;
default: null;
};
leftIcon: {
type: PropType<string | null>;
default: null;
};
leftIconClickable: {
type: PropType<boolean>;
default: boolean;
};
leftIconColor: {
type: PropType<string | null>;
default: null;
};
clearable: {
type: PropType<boolean>;
default: boolean;
};
externalSearch: {
type: PropType<boolean>;
default: boolean;
};
}>> & {
"onClick-left-icon"?: ((...args: any[]) => any) | undefined;
onSelect?: ((...args: any[]) => any) | undefined;
onSearch?: ((...args: any[]) => any) | undefined;
onChange?: ((...args: any[]) => any) | undefined;
"onUpdate:model-value"?: ((...args: any[]) => any) | undefined;
}, {
error: boolean;
bordered: boolean;
dark: boolean;
light: boolean;
size: "sm" | "md" | "lg";
search: boolean;
modelValue: SelectValue;
placeholder: string | null;
label: string | null;
leftIcon: string | null;
leftIconClickable: boolean;
leftIconColor: string | null;
disabled: boolean;
rounded: boolean;
roundedLg: boolean;
round: boolean;
maxHeight: number;
multiple: boolean;
clearable: boolean;
persistent: boolean;
hideArrow: boolean;
labelColor: string;
searchPlaceholder: string | null;
externalSearch: boolean;
}>;
export default _default;