@coreui/vue-pro
Version:
UI Components Library for Vue.js
501 lines (500 loc) • 12.8 kB
TypeScript
import { PropType } from 'vue';
import type { Option, OptionsGroup } from './types';
declare const CMultiSelect: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
/**
* Allow users to create options if they are not in the list of options.
*
* @since 4.9.0
*/
allowCreateOptions: BooleanConstructor;
/**
* Enables selection cleaner element.
*
* @default true
*/
cleaner: {
type: BooleanConstructor;
default: boolean;
};
/**
* Clear current search on selecting an item.
*
* @since 4.9.0
*/
clearSearchOnSelect: BooleanConstructor;
/**
* Toggle the disabled state for the component.
*/
disabled: BooleanConstructor;
/**
* Provide valuable, actionable feedback.
*
* @since 4.6.0
*/
feedback: StringConstructor;
/**
* Provide valuable, actionable feedback.
*
* @since 4.6.0
*/
feedbackInvalid: StringConstructor;
/**
* Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
*
* @since 4.6.0
*/
feedbackValid: StringConstructor;
/**
* Set the id attribute for the native select element.
*
* **[Deprecated since v5.3.0]** The name attribute for the native select element is generated based on the `id` property:
* - `<select name="\{id\}-multi-select" />`
*/
id: StringConstructor;
/**
* Set component validation state to invalid.
*
* @since 4.6.0
*/
invalid: BooleanConstructor;
/**
* Add a caption for a component.
*
* @since 4.6.0
*/
label: StringConstructor;
/**
* When set, the options list will have a loading style: loading spinner and reduced opacity.
*
* @since 4.9.0
*/
loading: BooleanConstructor;
/**
* It specifies that multiple options can be selected at once.
*
* @default true
*/
multiple: {
type: BooleanConstructor;
default: boolean;
};
/**
* The name attribute for the select element.
*
* @since 5.3.0
*/
name: StringConstructor;
/**
* List of option elements.
*/
options: {
type: PropType<(Option | OptionsGroup)[]>;
default: () => never[];
};
/**
* Sets maxHeight of options list.
*
* @default 'auto'
*/
optionsMaxHeight: {
type: (NumberConstructor | StringConstructor)[];
default: string;
};
/**
* Sets option style.
*
* @values 'checkbox', 'text'
* @default 'checkbox'
*/
optionsStyle: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Specifies a short hint that is visible in the search input.
*
* @default 'Select...''
*/
placeholder: {
type: StringConstructor;
default: string;
};
/**
* When it is present, it indicates that the user must choose a value before submitting the form.
*/
required: BooleanConstructor;
/**
* Determines whether the selected options should be cleared when the options list is updated. When set to true, any previously selected options will be reset whenever the options list undergoes a change. This ensures that outdated selections are not retained when new options are provided.
*
* @since 5.3.0
*/
resetSelectionOnOptionsChange: BooleanConstructor;
/**
* Enables search input element.
*/
search: {
type: (StringConstructor | BooleanConstructor)[];
default: boolean;
validator: (value: boolean | string) => boolean;
};
/**
* Sets the label for no results when filtering.
*/
searchNoResultsLabel: {
type: StringConstructor;
default: string;
};
/**
* Enables select all button.
*
* @default true
*/
selectAll: {
type: BooleanConstructor;
default: boolean;
};
/**
* Sets the select all button label.
*
* @default 'Select all options'
*/
selectAllLabel: {
type: StringConstructor;
default: string;
};
/**
* Sets the selection style.
*
* @values 'counter', 'tags', 'text'
* @default 'tags'
*/
selectionType: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Sets the counter selection label.
*
* @default 'item(s) selected'
*/
selectionTypeCounterText: {
type: StringConstructor;
default: string;
};
/**
* Size the component small or large.
*
* @values 'sm', 'lg'
*/
size: {
type: StringConstructor;
validator: (value: string) => boolean;
};
/**
* Add helper text to the component.
*
* @since 4.6.0
*/
text: StringConstructor;
/**
* Display validation feedback in a styled tooltip.
*
* @since 4.6.0
*/
tooltipFeedback: BooleanConstructor;
/**
* Set component validation state to valid.
*
* @since 4.6.0
*/
valid: BooleanConstructor;
/**
* Enable virtual scroller for the options list.
*
* @since 4.8.0
*/
virtualScroller: BooleanConstructor;
/**
* Toggle the visibility of multi select dropdown.
*
* @default false
*/
visible: BooleanConstructor;
/**
*
* Amount of visible items when virtualScroller is set to `true`.
*
* @since 4.8.0
*/
visibleItems: {
type: NumberConstructor;
default: number;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "hide" | "show" | "filterChange")[], "change" | "hide" | "show" | "filterChange", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
/**
* Allow users to create options if they are not in the list of options.
*
* @since 4.9.0
*/
allowCreateOptions: BooleanConstructor;
/**
* Enables selection cleaner element.
*
* @default true
*/
cleaner: {
type: BooleanConstructor;
default: boolean;
};
/**
* Clear current search on selecting an item.
*
* @since 4.9.0
*/
clearSearchOnSelect: BooleanConstructor;
/**
* Toggle the disabled state for the component.
*/
disabled: BooleanConstructor;
/**
* Provide valuable, actionable feedback.
*
* @since 4.6.0
*/
feedback: StringConstructor;
/**
* Provide valuable, actionable feedback.
*
* @since 4.6.0
*/
feedbackInvalid: StringConstructor;
/**
* Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
*
* @since 4.6.0
*/
feedbackValid: StringConstructor;
/**
* Set the id attribute for the native select element.
*
* **[Deprecated since v5.3.0]** The name attribute for the native select element is generated based on the `id` property:
* - `<select name="\{id\}-multi-select" />`
*/
id: StringConstructor;
/**
* Set component validation state to invalid.
*
* @since 4.6.0
*/
invalid: BooleanConstructor;
/**
* Add a caption for a component.
*
* @since 4.6.0
*/
label: StringConstructor;
/**
* When set, the options list will have a loading style: loading spinner and reduced opacity.
*
* @since 4.9.0
*/
loading: BooleanConstructor;
/**
* It specifies that multiple options can be selected at once.
*
* @default true
*/
multiple: {
type: BooleanConstructor;
default: boolean;
};
/**
* The name attribute for the select element.
*
* @since 5.3.0
*/
name: StringConstructor;
/**
* List of option elements.
*/
options: {
type: PropType<(Option | OptionsGroup)[]>;
default: () => never[];
};
/**
* Sets maxHeight of options list.
*
* @default 'auto'
*/
optionsMaxHeight: {
type: (NumberConstructor | StringConstructor)[];
default: string;
};
/**
* Sets option style.
*
* @values 'checkbox', 'text'
* @default 'checkbox'
*/
optionsStyle: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Specifies a short hint that is visible in the search input.
*
* @default 'Select...''
*/
placeholder: {
type: StringConstructor;
default: string;
};
/**
* When it is present, it indicates that the user must choose a value before submitting the form.
*/
required: BooleanConstructor;
/**
* Determines whether the selected options should be cleared when the options list is updated. When set to true, any previously selected options will be reset whenever the options list undergoes a change. This ensures that outdated selections are not retained when new options are provided.
*
* @since 5.3.0
*/
resetSelectionOnOptionsChange: BooleanConstructor;
/**
* Enables search input element.
*/
search: {
type: (StringConstructor | BooleanConstructor)[];
default: boolean;
validator: (value: boolean | string) => boolean;
};
/**
* Sets the label for no results when filtering.
*/
searchNoResultsLabel: {
type: StringConstructor;
default: string;
};
/**
* Enables select all button.
*
* @default true
*/
selectAll: {
type: BooleanConstructor;
default: boolean;
};
/**
* Sets the select all button label.
*
* @default 'Select all options'
*/
selectAllLabel: {
type: StringConstructor;
default: string;
};
/**
* Sets the selection style.
*
* @values 'counter', 'tags', 'text'
* @default 'tags'
*/
selectionType: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Sets the counter selection label.
*
* @default 'item(s) selected'
*/
selectionTypeCounterText: {
type: StringConstructor;
default: string;
};
/**
* Size the component small or large.
*
* @values 'sm', 'lg'
*/
size: {
type: StringConstructor;
validator: (value: string) => boolean;
};
/**
* Add helper text to the component.
*
* @since 4.6.0
*/
text: StringConstructor;
/**
* Display validation feedback in a styled tooltip.
*
* @since 4.6.0
*/
tooltipFeedback: BooleanConstructor;
/**
* Set component validation state to valid.
*
* @since 4.6.0
*/
valid: BooleanConstructor;
/**
* Enable virtual scroller for the options list.
*
* @since 4.8.0
*/
virtualScroller: BooleanConstructor;
/**
* Toggle the visibility of multi select dropdown.
*
* @default false
*/
visible: BooleanConstructor;
/**
*
* Amount of visible items when virtualScroller is set to `true`.
*
* @since 4.8.0
*/
visibleItems: {
type: NumberConstructor;
default: number;
};
}>> & Readonly<{
onChange?: ((...args: any[]) => any) | undefined;
onHide?: ((...args: any[]) => any) | undefined;
onShow?: ((...args: any[]) => any) | undefined;
onFilterChange?: ((...args: any[]) => any) | undefined;
}>, {
search: string | boolean;
invalid: boolean;
visible: boolean;
disabled: boolean;
required: boolean;
selectionType: string;
valid: boolean;
tooltipFeedback: boolean;
options: (Option | OptionsGroup)[];
cleaner: boolean;
placeholder: string;
multiple: boolean;
loading: boolean;
visibleItems: number;
virtualScroller: boolean;
optionsMaxHeight: string | number;
optionsStyle: string;
searchNoResultsLabel: string;
selectionTypeCounterText: string;
allowCreateOptions: boolean;
clearSearchOnSelect: boolean;
resetSelectionOnOptionsChange: boolean;
selectAll: boolean;
selectAllLabel: string;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export { CMultiSelect };