UNPKG

@shopware-ag/meteor-component-library

Version:

The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).

1,482 lines 607 kB
import { PropType, Ref } from 'vue'; import { MtPopoverItemType } from '../../overlay/mt-popover-item/mt-popover-item'; import { DropConfig, DragConfig } from '../../../directives/dragdrop.directive'; import { TextColumnDefinition } from './renderer/mt-data-table-text-renderer'; import { NumberColumnDefinition } from './renderer/mt-data-table-number-renderer'; import { BadgeColumnDefinition } from './renderer/mt-data-table-badge-renderer'; import { PriceColumnDefinition } from './renderer/mt-data-table-price-renderer'; import { SegmentedControlActionsProp } from '../../navigation/mt-segmented-control/mt-segmented-control'; import { Filter } from './mt-data-table.interfaces'; export interface BaseColumnDefinition { label: string; property: string; position: number; sortable?: boolean; width?: number; allowResize?: boolean; cellWrap?: "nowrap" | "normal"; visible?: boolean; } export type ColumnDefinition = BadgeColumnDefinition | TextColumnDefinition | NumberColumnDefinition | PriceColumnDefinition; export interface ColumnChanges { property?: ColumnDefinition["property"]; position?: ColumnDefinition["position"]; width?: ColumnDefinition["width"]; visible?: ColumnDefinition["visible"]; } type DataSourcePropType = { id: string; [key: string]: unknown; }[]; type ColumnProperty = ColumnDefinition[]; /** * @experimental - This component can be used but there are no guarantees for API stability yet. */ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ /** * The data source which contains the data for the current * state of the table. */ dataSource: { type: PropType<DataSourcePropType>; required: true; }; /** * The defintions for the columns which should be displayed in the table. */ columns: { type: PropType<ColumnProperty>; required: true; validator: (columnsValue: Record<string, unknown>[]) => boolean; }; /** * Optional property. When you want to override the current column * information with the given changes, you can pass them here. * The changes will be applied to the current column information. * This is useful for saving and loading the current column configuration * when the user customizes the table. */ columnChanges: { type: PropType<Record<string, ColumnChanges>>; required: false; default: () => {}; }; /** * Define the title of the table. */ title: { type: StringConstructor; required: false; default: string; }; /** * Define the subtitle of the table. */ subtitle: { type: StringConstructor; required: false; default: string; }; /** * The layout of the data table. * @values default, full */ layout: { type: PropType<"default" | "full">; required: false; default: string; }; /** * Activate the reload button at the top right corner of the table. */ enableReload: { type: BooleanConstructor; required: false; default: boolean; }; /** * Define the current page of the table. */ currentPage: { type: NumberConstructor; required: true; }; /** * Define the limit of items per page. */ paginationLimit: { type: NumberConstructor; required: true; }; /** * Define the total amount of items. */ paginationTotalItems: { type: NumberConstructor; required: true; }; /** * Define the available pagination limits. */ paginationOptions: { type: PropType<number[]>; required: false; default: () => number[]; }; /** * Define the current sort by property. */ sortBy: { type: StringConstructor; required: false; default: string; }; /** * Define the current sort direction. */ sortDirection: { type: PropType<"ASC" | "DESC">; required: false; default: string; }; /** * If active then the search input will be disabled. */ disableSearch: { type: BooleanConstructor; required: false; default: boolean; }; /** * Define the current search value. */ searchValue: { type: StringConstructor; required: false; default: string; }; /** * If active then the table will be in loading state. */ isLoading: { type: BooleanConstructor; required: false; default: boolean; }; /** * If active user can select rows and can perform actions on them. */ allowRowSelection: { type: BooleanConstructor; required: false; default: boolean; }; disableRowSelect: { type: PropType<string[]>; required: false; default: () => never[]; }; selectedRows: { type: PropType<string[]>; required: false; default: () => never[]; }; /** * If active user can do bulk edit by selecting items */ allowBulkEdit: { type: BooleanConstructor; required: false; default: boolean; }; /** * If active user can do bulk delete by selecting items */ allowBulkDelete: { type: BooleanConstructor; required: false; default: boolean; }; /** * Add more custom bulk edit actions */ bulkEditMoreActions: { type: PropType<{ id: string; label: string; onClick: () => void; icon?: "default" | "critical" | "active" | string; type?: MtPopoverItemType; metaCopy?: string; contextualDetail?: string; }[]>; required: false; default: () => never[]; }; /*** * Enable numbered rows */ enableRowNumbering: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable the stripe design for the table. */ showStripes: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable outlines for the table. */ showOutlines: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable outline framing on hover */ enableOutlineFraming: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to delete items */ disableDelete: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to edit items */ disableEdit: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to settings table */ disableSettingsTable: { type: BooleanConstructor; required: false; default: boolean; }; /** * Caption for accessibility */ caption: { type: StringConstructor; required: false; default: string; }; /** * All available filters */ filters: { type: PropType<Filter[]>; required: false; default: () => never[]; }; /** * Filters in use by the user */ appliedFilters: { type: PropType<Filter[]>; required: false; default: () => never[]; }; /** * Displays how many results are found */ numberOfResults: { type: NumberConstructor; required: false; default: undefined; }; /** * Additional context buttons to show in the context menu */ additionalContextButtons: { type: PropType<Array<{ type?: "default" | "active" | "critical"; label: string; key: string; }>>; required: false; default: () => never[]; }; }>, { t: import('vue-i18n').ComposerTranslation<{ en: { itemsPerPage: string; filter: { numberOfResults: string; addFilter: string; fetchingFilteredResults: string; }; columnSettings: { sortAscending: string; sortDescending: string; hideColumn: string; }; addColumnIndicator: { popoverTitle: string; tooltipMessage: string; }; contextButtons: { edit: string; delete: string; }; emptyState: { headline: string; description: string; }; bulkEdit: { itemsSelected: string; edit: string; delete: string; more: string; }; reload: { tooltip: string; }; }; de: { itemsPerPage: string; filter: { numberOfResults: string; addFilter: string; fetchingFilteredResults: string; }; columnSettings: { sortAscending: string; sortDescending: string; hideColumn: string; }; addColumnIndicator: { popoverTitle: string; tooltipMessage: string; }; contextButtons: { edit: string; delete: string; }; emptyState: { headline: string; description: string; }; bulkEdit: { itemsSelected: string; edit: string; delete: string; more: string; }; reload: { tooltip: string; }; }; }, "en" | "de", import('@intlify/core-base').RemoveIndexSignature<{ [x: string]: import('vue-i18n').LocaleMessageValue<import('vue-i18n').VueMessageType>; }>, never, "filter" | "reload" | "itemsPerPage" | "columnSettings" | "addColumnIndicator" | "contextButtons" | "emptyState" | "bulkEdit" | "filter.numberOfResults" | "filter.addFilter" | "filter.fetchingFilteredResults" | "reload.tooltip" | "columnSettings.sortAscending" | "columnSettings.sortDescending" | "columnSettings.hideColumn" | "addColumnIndicator.popoverTitle" | "addColumnIndicator.tooltipMessage" | "contextButtons.delete" | "contextButtons.edit" | "emptyState.description" | "emptyState.headline" | "bulkEdit.delete" | "bulkEdit.edit" | "bulkEdit.itemsSelected" | "bulkEdit.more", "filter" | "reload" | "itemsPerPage" | "columnSettings" | "addColumnIndicator" | "contextButtons" | "emptyState" | "bulkEdit" | "filter.numberOfResults" | "filter.addFilter" | "filter.fetchingFilteredResults" | "reload.tooltip" | "columnSettings.sortAscending" | "columnSettings.sortDescending" | "columnSettings.hideColumn" | "addColumnIndicator.popoverTitle" | "addColumnIndicator.tooltipMessage" | "contextButtons.delete" | "contextButtons.edit" | "emptyState.description" | "emptyState.headline" | "bulkEdit.delete" | "bulkEdit.edit" | "bulkEdit.itemsSelected" | "bulkEdit.more">; sortedColumns: import('vue').ComputedRef<ColumnDefinition[]>; isFirstVisibleColumn: (column: ColumnDefinition) => boolean; addColumnOptions: import('vue').ComputedRef<{ id: string; label: string; parentGroup: undefined; position: number; isVisible: boolean; isClickable: boolean; isSortable: boolean; isHidable: boolean; disabled: boolean; }[]>; renderColumnDataCellStyle: (column: ColumnDefinition) => { width: string; "min-width": string; "max-width": string; "white-space": "normal" | "nowrap"; }; renderColumnHeaderStyle: (column: ColumnDefinition) => { "max-width": string; width: string; "min-width": string; "white-space": "normal" | "nowrap"; }; tableWrapper: Ref<any, any>; emitReload: () => void; emitPaginationLimitChange: (limitValue: number) => void; emitPaginationCurrentPageChange: (currentPage: number) => void; emitSearchValueChange: (searchValue: string) => void; paginationOptionsConverted: import('vue').ComputedRef<{ id: number; label: string; value: number; }[]>; startColumnResizing: (column: ColumnDefinition | null) => void; columnHeaderRefs: Ref<Record<string, HTMLElement>, Record<string, HTMLElement>>; columnDataCellRefs: Ref<Record<string, HTMLElement[]>, Record<string, HTMLElement[]>>; setColumnDataCellRefs: ({ el, column, index, }: { el?: HTMLElement; column: ColumnDefinition; index: number; }) => void; dataTable: Ref<HTMLElement | null>; dragConfig: Partial<DragConfig<ColumnDefinition & { dropZone?: "before" | "after"; }>>; dropConfig: Partial<DropConfig<unknown> & { dropZone?: "before" | "after"; }>; resetAllChanges: () => void; changeColumnPosition: (columnId: string, targetColumnId: string, insertPosition?: "before" | "after") => void; isColumnVisible: (column: ColumnDefinition) => boolean; changeColumnVisibility: (columnProperty: string, visibility: boolean) => void; emitSortChange: (property: string, direction: "ASC" | "DESC") => void; onColumnSettingsSortChange: (property: string, direction: "ASC" | "DESC", chainMethod?: () => void) => void; MtDataTableClasses: import('vue').ComputedRef<{ "mt-data-table__layout-default": boolean; "mt-data-table__layout-full": boolean; "mt-data-table__first-column-fixed": boolean; "mt-data-table__last-column-fixed": boolean; "mt-data-table__stripes": boolean; "mt-data-table__outlines": boolean; "mt-data-table__column-outline-framing-active": boolean; }>; tableStylingVariables: import('vue').ComputedRef<{ "--fixed-left-column-width": string; "--fixed-right-column-width": string; }>; getSelectionValue: (dataId: string) => boolean; onRowSelect: (dataId: string) => void; somethingSelected: import('vue').ComputedRef<boolean>; bulkEditSegmentedControlActions: import('vue').ComputedRef<SegmentedControlActionsProp>; handleSelectAll: () => void; highlightedColumn: Ref<string | null, string | null>; setHighlightedColumn: (column: ColumnDefinition | null) => void; getColumnDataCellClasses: (column: ColumnDefinition) => string[]; getColumnHeaderClasses: (column: ColumnDefinition) => string[]; getPreviousVisibleColumn: (column: ColumnDefinition) => ColumnDefinition | null; getColumnDataRowClasses: (rowId: string) => string[]; getColumnHeaderInnerWrapperClasses: (column: ColumnDefinition) => string[]; forceHighlightedColumn: Ref<boolean, boolean>; addColumnOptionsSearch: Ref<string, string>; onAddColumnOptionClick: (columnProperty: string, previousColumnProperty: string) => void; onAddColumnSearch: (value: string) => void; currentHoveredColumn: Ref<string | null, string | null>; currentHoveredRow: Ref<string | null, string | null>; setCurrentHoveredCell: (columnProperty: string | null, rowId: string) => void; isPrimaryColumn: (column: ColumnDefinition) => boolean; emptyData: import('vue').ComputedRef<{}[]>; getRealIndex: (index: number) => number; isDragging: Ref<boolean, boolean>; filterChildViews: import('vue').ComputedRef<{ name: string; title: string; }[]>; removeFilter: (id: string) => void; addOption: (filterId: string, optionId: string) => void; removeOption: (filterId: string, optionId: string) => void; isOptionSelected: (filterId: string, optionId: string) => boolean; handleSearchUpdate: (value: string) => void; }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("change-show-outlines" | "change-show-stripes" | "change-outline-framing" | "change-enable-row-numbering" | "reload" | "pagination-limit-change" | "pagination-current-page-change" | "search-value-change" | "sort-change" | "open-details" | "selection-change" | "multiple-selection-change" | "bulk-edit" | "bulk-delete" | "item-delete" | "update:appliedFilters" | "context-select")[], "change-show-outlines" | "change-show-stripes" | "change-outline-framing" | "change-enable-row-numbering" | "reload" | "pagination-limit-change" | "pagination-current-page-change" | "search-value-change" | "sort-change" | "open-details" | "selection-change" | "multiple-selection-change" | "bulk-edit" | "bulk-delete" | "item-delete" | "update:appliedFilters" | "context-select", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ /** * The data source which contains the data for the current * state of the table. */ dataSource: { type: PropType<DataSourcePropType>; required: true; }; /** * The defintions for the columns which should be displayed in the table. */ columns: { type: PropType<ColumnProperty>; required: true; validator: (columnsValue: Record<string, unknown>[]) => boolean; }; /** * Optional property. When you want to override the current column * information with the given changes, you can pass them here. * The changes will be applied to the current column information. * This is useful for saving and loading the current column configuration * when the user customizes the table. */ columnChanges: { type: PropType<Record<string, ColumnChanges>>; required: false; default: () => {}; }; /** * Define the title of the table. */ title: { type: StringConstructor; required: false; default: string; }; /** * Define the subtitle of the table. */ subtitle: { type: StringConstructor; required: false; default: string; }; /** * The layout of the data table. * @values default, full */ layout: { type: PropType<"default" | "full">; required: false; default: string; }; /** * Activate the reload button at the top right corner of the table. */ enableReload: { type: BooleanConstructor; required: false; default: boolean; }; /** * Define the current page of the table. */ currentPage: { type: NumberConstructor; required: true; }; /** * Define the limit of items per page. */ paginationLimit: { type: NumberConstructor; required: true; }; /** * Define the total amount of items. */ paginationTotalItems: { type: NumberConstructor; required: true; }; /** * Define the available pagination limits. */ paginationOptions: { type: PropType<number[]>; required: false; default: () => number[]; }; /** * Define the current sort by property. */ sortBy: { type: StringConstructor; required: false; default: string; }; /** * Define the current sort direction. */ sortDirection: { type: PropType<"ASC" | "DESC">; required: false; default: string; }; /** * If active then the search input will be disabled. */ disableSearch: { type: BooleanConstructor; required: false; default: boolean; }; /** * Define the current search value. */ searchValue: { type: StringConstructor; required: false; default: string; }; /** * If active then the table will be in loading state. */ isLoading: { type: BooleanConstructor; required: false; default: boolean; }; /** * If active user can select rows and can perform actions on them. */ allowRowSelection: { type: BooleanConstructor; required: false; default: boolean; }; disableRowSelect: { type: PropType<string[]>; required: false; default: () => never[]; }; selectedRows: { type: PropType<string[]>; required: false; default: () => never[]; }; /** * If active user can do bulk edit by selecting items */ allowBulkEdit: { type: BooleanConstructor; required: false; default: boolean; }; /** * If active user can do bulk delete by selecting items */ allowBulkDelete: { type: BooleanConstructor; required: false; default: boolean; }; /** * Add more custom bulk edit actions */ bulkEditMoreActions: { type: PropType<{ id: string; label: string; onClick: () => void; icon?: "default" | "critical" | "active" | string; type?: MtPopoverItemType; metaCopy?: string; contextualDetail?: string; }[]>; required: false; default: () => never[]; }; /*** * Enable numbered rows */ enableRowNumbering: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable the stripe design for the table. */ showStripes: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable outlines for the table. */ showOutlines: { type: BooleanConstructor; required: false; default: boolean; }; /** * Enable or disable outline framing on hover */ enableOutlineFraming: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to delete items */ disableDelete: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to edit items */ disableEdit: { type: BooleanConstructor; required: false; default: boolean; }; /** * Disable the possibility to settings table */ disableSettingsTable: { type: BooleanConstructor; required: false; default: boolean; }; /** * Caption for accessibility */ caption: { type: StringConstructor; required: false; default: string; }; /** * All available filters */ filters: { type: PropType<Filter[]>; required: false; default: () => never[]; }; /** * Filters in use by the user */ appliedFilters: { type: PropType<Filter[]>; required: false; default: () => never[]; }; /** * Displays how many results are found */ numberOfResults: { type: NumberConstructor; required: false; default: undefined; }; /** * Additional context buttons to show in the context menu */ additionalContextButtons: { type: PropType<Array<{ type?: "default" | "active" | "critical"; label: string; key: string; }>>; required: false; default: () => never[]; }; }>> & Readonly<{ "onChange-show-outlines"?: ((...args: any[]) => any) | undefined; "onChange-show-stripes"?: ((...args: any[]) => any) | undefined; "onChange-outline-framing"?: ((...args: any[]) => any) | undefined; "onChange-enable-row-numbering"?: ((...args: any[]) => any) | undefined; onReload?: ((...args: any[]) => any) | undefined; "onPagination-limit-change"?: ((...args: any[]) => any) | undefined; "onPagination-current-page-change"?: ((...args: any[]) => any) | undefined; "onSearch-value-change"?: ((...args: any[]) => any) | undefined; "onSort-change"?: ((...args: any[]) => any) | undefined; "onOpen-details"?: ((...args: any[]) => any) | undefined; "onSelection-change"?: ((...args: any[]) => any) | undefined; "onMultiple-selection-change"?: ((...args: any[]) => any) | undefined; "onBulk-edit"?: ((...args: any[]) => any) | undefined; "onBulk-delete"?: ((...args: any[]) => any) | undefined; "onItem-delete"?: ((...args: any[]) => any) | undefined; "onUpdate:appliedFilters"?: ((...args: any[]) => any) | undefined; "onContext-select"?: ((...args: any[]) => any) | undefined; }>, { caption: string; title: string; filters: Filter[]; isLoading: boolean; subtitle: string; showOutlines: boolean; showStripes: boolean; enableOutlineFraming: boolean; enableRowNumbering: boolean; columnChanges: Record<string, ColumnChanges>; layout: "default" | "full"; enableReload: boolean; paginationOptions: number[]; sortBy: string; sortDirection: "ASC" | "DESC"; disableSearch: boolean; searchValue: string; allowRowSelection: boolean; disableRowSelect: string[]; selectedRows: string[]; allowBulkEdit: boolean; allowBulkDelete: boolean; bulkEditMoreActions: { id: string; label: string; onClick: () => void; icon?: "default" | "critical" | "active" | string; type?: MtPopoverItemType; metaCopy?: string; contextualDetail?: string; }[]; disableDelete: boolean; disableEdit: boolean; disableSettingsTable: boolean; appliedFilters: Filter[]; numberOfResults: number; additionalContextButtons: { type?: "default" | "active" | "critical"; label: string; key: string; }[]; }, {}, { "mt-card": { new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{ title?: string; subtitle?: string; isLoading?: boolean; large?: boolean; inheritance?: boolean; }> & Readonly<{ "onUpdate:inheritance"?: ((value: boolean) => any) | undefined; }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & { "update:inheritance": (value: boolean) => any; }, import('vue').PublicProps, { inheritance: boolean; }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<{ title?: string; subtitle?: string; isLoading?: boolean; large?: boolean; inheritance?: boolean; }> & Readonly<{ "onUpdate:inheritance"?: ((value: boolean) => any) | undefined; }>, {}, {}, {}, {}, { inheritance: boolean; }>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import('vue').ComponentOptionsBase<Readonly<{ title?: string; subtitle?: string; isLoading?: boolean; large?: boolean; inheritance?: boolean; }> & Readonly<{ "onUpdate:inheritance"?: ((value: boolean) => any) | undefined; }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & { "update:inheritance": (value: boolean) => any; }, string, { inheritance: boolean; }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => { $slots: Readonly<{ title(): void; subtitle(): void; avatar(): void; grid(): void; footer(): void; default(): void; toolbar(): void; tabs(): void; "before-card"(): void; "after-card"(): void; headerRight(): void; "context-actions"(): void; }> & { title(): void; subtitle(): void; avatar(): void; grid(): void; footer(): void; default(): void; toolbar(): void; tabs(): void; "before-card"(): void; "after-card"(): void; headerRight(): void; "context-actions"(): void; }; }); "mt-button": { new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{ is?: import('vue').Component | string; disabled?: boolean; variant?: "primary" | "secondary" | "tertiary" | "critical" | "action"; ghost?: boolean; size?: "x-small" | "small" | "default" | "large"; square?: boolean; block?: boolean; link?: string; isLoading?: boolean; }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, { size: "x-small" | "small" | "default" | "large"; link: string; variant: "primary" | "secondary" | "tertiary" | "critical" | "action"; is: import('vue').Component | string; }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<{ is?: import('vue').Component | string; disabled?: boolean; variant?: "primary" | "secondary" | "tertiary" | "critical" | "action"; ghost?: boolean; size?: "x-small" | "small" | "default" | "large"; square?: boolean; block?: boolean; link?: string; isLoading?: boolean; }> & Readonly<{}>, {}, {}, {}, {}, { size: "x-small" | "small" | "default" | "large"; link: string; variant: "primary" | "secondary" | "tertiary" | "critical" | "action"; is: import('vue').Component | string; }>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import('vue').ComponentOptionsBase<Readonly<{ is?: import('vue').Component | string; disabled?: boolean; variant?: "primary" | "secondary" | "tertiary" | "critical" | "action"; ghost?: boolean; size?: "x-small" | "small" | "default" | "large"; square?: boolean; block?: boolean; link?: string; isLoading?: boolean; }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, { size: "x-small" | "small" | "default" | "large"; link: string; variant: "primary" | "secondary" | "tertiary" | "critical" | "action"; is: import('vue').Component | string; }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => { $slots: Readonly<{ default: null; iconFront: { size: number; }; iconBack: { size: number; }; }> & { default: null; iconFront: { size: number; }; iconBack: { size: number; }; }; }); "mt-select": import('vue').DefineComponent<import('vue').ExtractPropTypes<{ options: { type: ArrayConstructor; required: true; }; enableMultiSelection: { type: BooleanConstructor; default: boolean; }; modelValue: { type: PropType<string | number | boolean | unknown[] | null | object | undefined>; required: false; default: null; }; labelProperty: { type: PropType<string | string[]>; required: false; default: string; }; valueProperty: { type: StringConstructor; required: false; default: string; }; valueLimit: { type: NumberConstructor; required: false; default: number; }; label: { type: StringConstructor; required: false; default: string; }; placeholder: { type: StringConstructor; required: false; default: string; }; alwaysShowPlaceholder: { type: BooleanConstructor; required: false; default: boolean; }; isLoading: { type: BooleanConstructor; required: false; default: boolean; }; disabled: { type: BooleanConstructor; required: false; default: boolean; }; hideClearableButton: { type: BooleanConstructor; required: false; default: boolean; }; highlightSearchTerm: { type: BooleanConstructor; required: false; default: boolean; }; searchFunction: { type: FunctionConstructor; required: false; default: ({ options, labelProperty, searchTerm, }: { options: any; labelProperty: string | string[]; searchTerm: string; }) => any; }; error: { type: ObjectConstructor; required: false; default: null; }; isInherited: { type: BooleanConstructor; required: false; default: boolean; }; isInheritanceField: { type: BooleanConstructor; required: false; default: boolean; }; disableInheritanceToggle: { type: BooleanConstructor; required: false; default: boolean; }; small: { type: BooleanConstructor; required: false; default: boolean; }; }>, { t: import('vue-i18n').ComposerTranslation<{ en: { messageNoResults: string; }; de: { messageNoResults: string; }; }, "en" | "de", import('@intlify/core-base').RemoveIndexSignature<{ [x: string]: import('vue-i18n').LocaleMessageValue<import('vue-i18n').VueMessageType>; }>, never, "messageNoResults", "messageNoResults">; getKey: typeof import('../../../utils/object').getPropertyValue; }, { searchTerm: string; limit: number; searchResults: never[]; isSearchResultsLoading: boolean; }, { visibleValues(): any[]; totalValuesCount(): number; invisibleValueCount(): number; currentValue: { get(): string | number | boolean | unknown[] | object | null | undefined; set(newValue: string | number | boolean | unknown[] | null | undefined): void; }; visibleResults(): any[]; componentClasses(): Record<string, boolean>; }, { isSelected(item: any): any; addItem(item: any): void; remove(item: any): void; removeLastItem(): void; expandValueLimit(): void; onSearchTermChange(term: string): void; searchTermDebounced: (...args: any[]) => void; resetActiveItem(): void; onSelectExpanded(): void; onSelectCollapsed(): void; onClearSelection(): void; getFocusElement(): HTMLElement; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("inheritance-remove" | "inheritance-restore" | "update:modelValue" | "change" | "paginate" | "search-term-change" | "item-remove" | "item-add" | "display-values-expand")[], "inheritance-remove" | "inheritance-restore" | "update:modelValue" | "change" | "paginate" | "search-term-change" | "item-remove" | "item-add" | "display-values-expand", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ options: { type: ArrayConstructor; required: true; }; enableMultiSelection: { type: BooleanConstructor; default: boolean; }; modelValue: { type: PropType<string | number | boolean | unknown[] | null | object | undefined>; required: false; default: null; }; labelProperty: { type: PropType<string | string[]>; required: false; default: string; }; valueProperty: { type: StringConstructor; required: false; default: string; }; valueLimit: { type: NumberConstructor; required: false; default: number; }; label: { type: StringConstructor; required: false; default: string; }; placeholder: { type: StringConstructor; required: false; default: string; }; alwaysShowPlaceholder: { type: BooleanConstructor; required: false; default: boolean; }; isLoading: { type: BooleanConstructor; required: false; default: boolean; }; disabled: { type: BooleanConstructor; required: false; default: boolean; }; hideClearableButton: { type: BooleanConstructor; required: false; default: boolean; }; highlightSearchTerm: { type: BooleanConstructor; required: false; default: boolean; }; searchFunction: { type: FunctionConstructor; required: false; default: ({ options, labelProperty, searchTerm, }: { options: any; labelProperty: string | string[]; searchTerm: string; }) => any; }; error: { type: ObjectConstructor; required: false; default: null; }; isInherited: { type: BooleanConstructor; required: false; default: boolean; }; isInheritanceField: { type: BooleanConstructor; required: false; default: boolean; }; disableInheritanceToggle: { type: BooleanConstructor; required: false; default: boolean; }; small: { type: BooleanConstructor; required: false; default: boolean; }; }>> & Readonly<{ onChange?: ((...args: any[]) => any) | undefined; "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; "onInheritance-remove"?: ((...args: any[]) => any) | undefined; "onInheritance-restore"?: ((...args: any[]) => any) | undefined; onPaginate?: ((...args: any[]) => any) | undefined; "onSearch-term-change"?: ((...args: any[]) => any) | undefined; "onItem-remove"?: ((...args: any[]) => any) | undefined; "onItem-add"?: ((...args: any[]) => any) | undefined; "onDisplay-values-expand"?: ((...args: any[]) => any) | undefined; }>, { small: boolean; label: string; disabled: boolean; isInherited: boolean; error: Record<string, any>; modelValue: string | number | boolean | object | unknown[] | null | undefined; placeholder: string; isLoading: boolean; isInheritanceField: boolean; disableInheritanceToggle: boolean; labelProperty: string | string[]; valueProperty: string; alwaysShowPlaceholder: boolean; enableMultiSelection: boolean; valueLimit: number; hideClearableButton: boolean; highlightSearchTerm: boolean; searchFunction: Function; }, {}, { "mt-select-base": import('vue').DefineComponent<import('vue').ExtractPropTypes<{ label: { type: StringConstructor; required: true; }; isLoading: { type: BooleanConstructor; required: false; default: boolean; }; disabled: { type: BooleanConstructor; required: false; default: boolean; }; showClearableButton: { type: BooleanConstructor; required: false; default: boolean; }; error: { type: ObjectConstructor; required: false; default: null; }; isInherited: { type: BooleanConstructor; required: false; default: boolean; }; isInheritanceField: { type: BooleanConstructor; required: false; default: boolean; }; disableInheritanceToggle: { type: BooleanConstructor; required: false; default: boolean; }; }>, {}, { expanded: boolean; suffixWidth: number; }, { mtFieldClasses(): { "has--focus": boolean; }; selectionIndicatorsRight(): string; }, { updateSuffixWidth(): void; toggleExpand(): void; expand(): void; collapse(event?: Event): void; focusPreviousFormElement(): void; listenToClickOutside(event: Event): void; computePath(event: Event): EventTarget[]; emitClear(): void; focusParentSelect(event: KeyboardEvent): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("inheritance-remove" | "inheritance-restore" | "clear" | "select-expanded" | "select-collapsed")[], "inheritance-remove" | "inheritance-restore" | "clear" | "select-expanded" | "select-collapsed", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ label: { type: StringConstructor; required: true; }; isLoading: { type: BooleanConstructor; required: false; default: boolean; }; disabled: { type: BooleanConstructor; required: false; default: boolean; }; showClearableButton: { type: BooleanConstructor; required: false; default: boolean; }; error: { type: ObjectConstructor; required: false; default: null; }; isInherited: { type: BooleanConstructor; required: false; default: boolean; }; isInheritanceField: { type: BooleanConstructor; required: false; default: boolean; }; disableInheritanceToggle: { type: BooleanConstructor; required: false; default: boolean; }; }>> & Readonly<{ "onInheritance-remove"?: ((...args: any[]) => any) | undefined; "onInheritance-restore"?: ((...args: any[]) => any) | undefined; onClear?: ((...args: any[]) => any) | undefined; "onSelect-expanded"?: ((...args: any[]) => any) | undefined; "onSelect-collapsed"?: ((...args: any[]) => any) | undefined; }>, { disabled: boolean; isInherited: boolean; error: Record<string, any>; isLoading: boolean; isInheritanceField: boolean; disableInheritanceToggle: boolean; showClearableButton: boolean; }, {}, { "mt-base-field": import('vue').DefineComponent<import('vue').ExtractPropTypes<{ disabled: { type: BooleanConstructor; required: false; default: boolean; }; required: { type: BooleanConstructor; required: false; default: boolean; }; isInherited: { type: BooleanConstructor; required: false; default: boolean; }; isInheritanceField: { type: BooleanConstructor; required: false; default: boolean; }; disableInheritanceToggle: { type: BooleanConstructor; required: false; default: boolean; }; copyable: { type: BooleanConstructor; required: false; default: boolean; }; copyableTooltip: { type: BooleanConstructor; required: false; default: boolean; }; hasFocus: { type: BooleanConstructor; required: true; }; helpText: { type: StringConstructor; required: false; default: string; }; copyableText: { type: StringConstructor; required: false; default: string; }; size: { type: StringConstructor; required: false; default: string; validator(value: string): boolean; }; name: { type: StringConstructor; required: false; default: null; }; }>, { hasSlotContent: (slot: import('vue').Slot | undefined | null, props?: any) => boolean; future: { removeCardWidth: boolean; removeDefaultMargin: boolean; }; }, { id: string | undefined; }, { identification(): string; showLabel(): boolean; mtFieldLabelClasses(): { "is--required": boolean; }; mtBlockSize(): string; hasError(): boolean; }, {}, import('vue').DefineComponent<import('vue').ExtractPropTypes<{ validation: { type: (BooleanConstructor | ObjectConstructor | StringConstructor | ArrayConstructor)[]; required: false; default: null; }; }>, {}, {}, { isValid(): boolean; }, { validate(value: unknown): boolean; validateRule(value: unknown, rule: string): boolean; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ validation: { type: (BooleanConstructor | ObjectConstructor | StringConstructor | ArrayConstructor)[]; required: false; default: null; }; }>> & Readonly<{}>, { validation: string | boolean | Record<string, any> | unknown[]; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any> | import('vue').DefineComponent<import('vue').ExtractPropTypes<{ mapInheritance: { type: ObjectConstructor; required: false; default: null; }; name: { type: StringConstructor; required: false; default: null; }; }>, {}, {}, { formFieldName(): string | undefined; }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ mapInheritance: { type: ObjectConstructor; required: false; default: null; }; name: { type: StringConstructor; required: false; default: null; }; }>> & Reado