import { MazUiTranslationsNestedSchema } from '@maz-ui/translations'; import { HTMLAttributes } from 'vue'; import { MazInputValue } from './MazInput.vue'; import { MazPopoverProps } from './MazPopover.vue'; import { MazColor, MazSize } from './types'; export interface MazSelectNormalizedOption { [key: string]: MazInputValue; } export interface MazSelectOptionWithOptGroup { label: string; options: (MazSelectNormalizedOption | string | number | boolean)[]; } export type MazSelectOption = MazSelectNormalizedOption | string | number | boolean | MazSelectOptionWithOptGroup; export interface MazSelectProps { /** * Style attribut of the component root element * @type {HTMLAttributes['style']} */ style?: HTMLAttributes['style']; /** * Class attribut of the component root element * @type {HTMLAttributes['class']} */ class?: HTMLAttributes['class']; /** The id of the select */ id?: string; /** * The label of the select */ label?: string; /** * The placeholder of the select */ placeholder?: string; /** * The value of the select * @type {Value | Value[]} */ modelValue?: Multiple extends true ? Value[] : Value; /** * The options of the select * @type {Option[]} */ options: Option[]; /** * The key of the option value * @default 'value' */ optionValueKey?: string; /** * The key of the option label * @default 'label' */ optionLabelKey?: string; /** * The key of the option input value * @default 'label' */ optionInputValueKey?: string; /** * The position of the list (auto by default - will switch between bottom-start and top-start) * @type {MazPopoverProps['position']} * @default 'auto' */ listPosition?: MazPopoverProps['position']; /** * The prefer position of the list * @type {MazPopoverProps['preferPosition']} * @default 'bottom-start' */ preferPosition?: MazPopoverProps['preferPosition']; /** * The fallback position of the list * @type {MazPopoverProps['fallbackPosition']} * @default 'top-start' */ fallbackPosition?: MazPopoverProps['fallbackPosition']; /** The height of the option list item */ itemHeight?: number; /** * The max height of the option list * @default 240 */ maxListHeight?: number; /** The max width of the option list */ maxListWidth?: number; /** The min height of the option list */ minListHeight?: number; /** The min width of the option list */ minListWidth?: number; /** * The size of the select * @default 'md' */ size?: MazSize; /** * The color of the select * @default 'primary' */ color?: MazColor; /** Display search input in option list */ search?: boolean; /** * Replace the default search function to provide a custom search function * @default undefined */ searchFunction?: (query: string, options: Option[]) => Option[] | undefined; /** * The threshold for the search input where 1 is a perfect match and 0 is a match with any character * @default 0.75 */ searchThreshold?: number; /** Enable the multiple selection */ multiple?: Multiple; /** Make the input required in the form */ required?: boolean; /** Disable the component */ disabled?: boolean; /** The input will be displayed in full width */ block?: boolean; /** * The autocomplete attribute of the input * @default 'off' */ autocomplete?: string; /** * The translations of the component * @type {Partial} * @default { * searchPlaceholder: 'Search in options', * } */ translations?: Partial; /** * The function to format the input value * @type {(value: Multiple extends true ? Value[] : Value) => string} * @default undefined */ formatInputValue?: (value: Multiple extends true ? Value[] : Value) => string; /** * The transition name of the panel list options * @type {MazPopoverProps['transition']} * @default 'scale-fade' */ transition?: MazPopoverProps['transition']; } declare const _default: