@oruga-ui/oruga-next

import type { ClassDefinition, ComponentConfigBase, DynamicComponent, } from "@/types"; // Auto generated component theme config definition declare module "../index" { interface OrugaOptions { autocomplete?: ComponentConfigBase & Partial<{ /** Options won't be filtered based on the input value on clientside */ backendFiltering: boolean; /** Menu tag name */ menuTag: DynamicComponent; /** Menu item tag name */ itemTag: DynamicComponent; /** Size of the input control */ size: string; /** Position of the dropdown */ position: "auto" | "bottom" | "top"; /** Makes input full width when inside a grouped or addon field */ expanded: boolean; /** Number of milliseconds to delay before to emit input event */ debounce: number; /** The first option will always be focused (easier to just hit enter or tab) */ keepFirst: boolean; /** Keep open dropdown list after select */ keepOpen: boolean; /** Clear input text on select */ clearOnSelect: boolean; /** Open dropdown list on focus */ openOnFocus: boolean; /** Max height of dropdown content */ maxHeight: number | string; /** Makes the component check if list reached scroll start or end and emit scroll events */ checkScroll: boolean; /** Icon pack to use */ iconPack: string; /** Icon to be shown */ icon: string; /** Icon to be added on the right side */ iconRight: string; /** Add a button/icon to clear the inputed text */ clearable: boolean; /** Icon name to be added on the clear button */ clearIcon: string; /** Dropdown content (items) are shown into a modal on mobile */ mobileModal: boolean; /** Dropdown content (items) are shown into a modal on desktop */ desktopModal: boolean; /** Transition name to apply on dropdown list */ animation: string; /** Native options to use in HTML5 validation */ autocomplete: string; /** Append the component to another part of the DOM. Set `true` to append the component to the body. In addition, any CSS selector string or an actual DOM node can be used. */ teleport: boolean | object | string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the menu items */ itemClass: ClassDefinition; /** Class of the menu items group title */ itemGroupTitleClass: ClassDefinition; /** Class of the empty menu placeholder item */ itemEmptyClass: ClassDefinition; /** Class of the menu header item */ itemHeaderClass: ClassDefinition; /** Class of the menu footer item */ itemFooterClass: ClassDefinition; /** Class configuration for the internal input component */ inputClasses: Record<string, any>; }>; breadcrumb?: ComponentConfigBase & Partial<{ /** Size of the breadcrumb */ size: string; /** Color variant of the breadcrumb */ variant: string; /** Position of the breadcrumb */ position: "centered" | "left" | "right"; /** The separator between breadcrumb items */ separator: string; /** Accessibility aria-label to be passed to the nav wrapper element */ ariaLabel: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element with alignment */ positionClass: ClassDefinition; /** Class of the list element */ listClass: ClassDefinition; /** Icon pack to use */ iconPack: string; /** Icon size */ iconSize: string; /** Item tag name */ tag: DynamicComponent; /** Class of the item element */ itemClass: ClassDefinition; /** Class of the item element when disabled */ disabledClass: ClassDefinition; /** Class of the item element when active */ activeClass: ClassDefinition; /** Class of the item seperator element */ seperatorClass: ClassDefinition; /** Class of the item link element */ linkClass: ClassDefinition; /** Class of the item icon element */ iconClass: ClassDefinition; /** Class of the item left icon element */ iconLeftClass: ClassDefinition; /** Class of the item right icon element */ iconRightClass: ClassDefinition; }>; button?: ComponentConfigBase & Partial<{ /** Button tag name */ tag: DynamicComponent; /** Color variant of the control */ variant: string; /** Size of the control */ size: string; /** Icon pack to use */ iconPack: string; /** Enable rounded style */ rounded: boolean; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when outlined */ outlinedClass: ClassDefinition; /** Class of the root element when inverted */ invertedClass: ClassDefinition; /** Class of the root element when loading */ loadingClass: ClassDefinition; /** Class of the root element when expanded */ expandedClass: ClassDefinition; /** Class of the root element when rounded */ roundedClass: ClassDefinition; /** Class of the root element when disabled */ disabledClass: ClassDefinition; /** Class of the inner wrapper element */ wrapperClass: ClassDefinition; /** Class of the icon element */ iconClass: ClassDefinition; /** Class of the icon element on the left */ iconLeftClass: ClassDefinition; /** Class of the icon element on the right */ iconRightClass: ClassDefinition; /** Class of the label element */ labelClass: ClassDefinition; }>; carousel?: ComponentConfigBase & Partial<{ /** Timer interval for `autoplay` */ interval: number; /** Position of the indicator - depends on used theme */ indicatorPosition: string; /** Style of the indicator - depends on used theme */ indicatorStyle: string; /** Number of items to show at once */ itemsToShow: number; /** Number of items to switch at once */ itemsToList: number; /** Show next / prev arrows */ arrows: boolean; /** Show next / prev arrows only on hover */ arrowsHover: boolean; /** Icon pack to use */ iconPack: string; /** Icon size */ iconSize: string; /** Icon name for previous button */ iconPrev: string; /** Icon name for next button */ iconNext: string; /** Icon name for autoplay pause button */ iconAutoplayPause: string; /** Icon name for autoplay resume button */ iconAutoplayResume: string; /** Accessibility autoplay pause button aria label */ ariaAutoplayPauseLabel: string; /** Accessibility autoplay resume button aria label */ ariaAutoplayResumeLabel: string; /** Accessibility next button aria label */ ariaNextLabel: string; /** Accessibility previous button aria label */ ariaPreviousLabel: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element in overlay */ overlayClass: ClassDefinition; /** Class of the inner wrapper element */ wrapperClass: ClassDefinition; /** Class of items container element */ itemsClass: ClassDefinition; /** */ itemsDraggingClass: ClassDefinition; /** Class of icon button elements */ iconClass: ClassDefinition; /** Class of prev icon button element */ iconPrevClass: ClassDefinition; /** Class of next icon button element */ iconNextClass: ClassDefinition; /** Class of autoplay icon button element */ iconAutoplayClass: ClassDefinition; /** Class of indicators tablist element */ indicatorsClass: ClassDefinition; /** Class of indicators tablist element when inside */ indicatorsInsideClass: ClassDefinition; /** Class of indicators tablist element with position */ indicatorsPositionClass: ClassDefinition; /** Class of indicator tab element */ indicatorClass: ClassDefinition; /** Class of indicator item element */ indicatorItemClass: ClassDefinition; /** Class of indicator element when active */ indicatorItemActiveClass: ClassDefinition; /** Class of indicator element to separate different styles */ indicatorItemStyleClass: ClassDefinition; /** Class of item element */ itemClass: ClassDefinition; /** Class of item element when active */ itemActiveClass: ClassDefinition; /** Class of item element when clickable */ itemClickableClass: ClassDefinition; }>; checkbox?: ComponentConfigBase & Partial<{ /** Color of the control */ variant: string; /** Size of the control */ size: string; /** Same as native autocomplete options to use in HTML5 validation */ autocomplete: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when disabled */ disabledClass: ClassDefinition; /** Class of the root element when checked */ checkedClass: ClassDefinition; /** Class of the the root element when indeterminate */ indeterminateClass: ClassDefinition; /** Class of the native input element */ inputClass: ClassDefinition; /** Class of the label element */ labelClass: ClassDefinition; }>; collapse?: ComponentConfigBase & Partial<{ /** Custom animation (transition name) */ animation: string; /** Trigger position */ position: "bottom" | "top"; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when expanded */ expandedClass: ClassDefinition; /** Clas of the root element with position */ positionClass: ClassDefinition; /** Class of the trigger element */ triggerClass: ClassDefinition; /** Class of the content */ contentClass: ClassDefinition; }>; datepicker?: ComponentConfigBase & Partial<{ /** Set custom day names, else use names based on locale */ dayNames: string[]; /** Set custom month names, else use names based on locale */ monthNames: string[]; /** Size of the control input */ size: string; /** Makes input full width when inside a grouped or addon field */ expanded: boolean; /** Open dropdown on focus */ openOnFocus: boolean; /** Close dropdown on click */ closeOnClick: boolean; /** Custom function to format a date into a string */ formatter: ((date: Date | [] | Date[] | [Date, Date]) => string) | undefined; /** Custom function to parse a string into a date */ parser: ((date: string) => Date | [] | Date[] | [Date, Date]) | undefined; /** Date creator function, default is `new Date()` */ creator: (() => Date); /** Define a list of weeks which can not be selected */ unselectableDaysOfWeek: number[]; /** Show nearby month days */ nearbyMonthDays: boolean; /** Define if nearby month days can be selected */ nearbySelectableMonthDays: boolean; /** Show week numbers */ showWeekNumber: boolean; /** Define if week numbers are clickable */ weekNumberClickable: boolean; /** Set the first day of a week */ firstDayOfWeek: number; /** Define the range of years to show */ yearsRange: number[]; /** Icon pack to use */ iconPack: string; /** Icon to be shown */ icon: string; /** Icon to be added on the right side */ iconRight: string; /** Icon name for previous icon */ iconPrev: string; /** Icon name for next icon */ iconNext: string; /** Dropdown content is shown into a modal on mobile */ mobileModal: boolean; /** Dropdown content is shown into a modal on desktop */ desktopModal: boolean; /** Enable mobile native input if mobile agent */ mobileNative: boolean; /** Mobile breakpoint as `max-width` value */ mobileBreakpoint: string; /** Append the component to another part of the DOM. Set `true` to append the component to the body. In addition, any CSS selector string or an actual DOM node can be used. */ teleport: boolean | object | string; /** Accessibility next button aria label */ ariaNextLabel: string; /** Accessibility month select aria label */ ariaSelectMonthLabel: string; /** Accessibility year select aria label */ ariaSelectYearLabel: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when on mobile */ mobileClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element when expanded */ expandedClass: ClassDefinition; /** Class of the box container element where you choose the date */ boxClass: ClassDefinition; /** Class of the header element inside the box */ headerClass: ClassDefinition; /** Class of the prev button element inside the box */ prevButtonClass: ClassDefinition; /** Class of the next button element inside the box */ nextButtonClass: ClassDefinition; /** Class of the month and year selects container inside the box */ listsClass: ClassDefinition; /** Class of the footer element */ footerClass: ClassDefinition; /** Class of the dates table element inside the box */ tableClass: ClassDefinition; /** Class of dates table header element with days of the week */ tableHeadClass: ClassDefinition; /** Class of the cell element inside the table header */ tableHeadCellClass: ClassDefinition; /** Class of the table body element inside the box */ tableBodyClass: ClassDefinition; /** Class of the table row element */ tableRowClass: ClassDefinition; /** Class of the table cell element */ tableCellClass: ClassDefinition; /** Class of the table cell element when nearby month days are hidden */ tableCellInvisibleClass: ClassDefinition; /** Class of table cell element when selected */ tableCellSelectedClass: ClassDefinition; /** Class of the first selected table cell element when in range */ tableCellFirstSelectedClass: ClassDefinition; /** Class of the table cell elements within the range when the range is selected */ tableCellWithinSelectedClass: ClassDefinition; /** Class of the last selected table cell element during range selection */ tableCellLastSelectedClass: ClassDefinition; /** Class of the first hovered table cell element during range selection */ tableCellFirstHoveredClass: ClassDefinition; /** Class of the table cell element when hovered during range selection */ tableCellWithinHoveredClass: ClassDefinition; /** Class of the last table cell element hovered during range selection */ tableCellLastHoveredClass: ClassDefinition; /** Class of the table cell element of the current day */ tableCellTodayClass: ClassDefinition; /** Class of the table cell element when selectable */ tableCellSelectableClass: ClassDefinition; /** Class of the table cell element when unselectable */ tableCellUnselectableClass: ClassDefinition; /** Class of the table cell element when nearby days (prev/next month) are selectable */ tableCellNearbyClass: ClassDefinition; /** Class of the cell element of a row when at least one event is present */ tableCellEventsClass: ClassDefinition; /** Class of the events container element */ tableEventsClass: ClassDefinition; /** Class of the event element */ tableEventClass: ClassDefinition; /** Class of the event element with variant */ tableEventVariantClass: ClassDefinition; /** Class of the event element with indicator */ tableEventIndicatorClass: ClassDefinition; /** Class of the month table element inside the box when type is `month` */ monthClass: ClassDefinition; /** Class of the table container when type is `month` */ monthTableClass: ClassDefinition; /** Class of the table cell element when type is `month` */ monthCellClass: ClassDefinition; /** Class of table cell element when selected when type is `month` */ monthCellSelectedClass: ClassDefinition; /** Class of the first selected table cell element when in range when type is `month` */ monthCellFirstSelectedClass: ClassDefinition; /** Class of the table cell elements within the range when the range is selected when type is `month` */ monthCellWithinSelectedClass: ClassDefinition; /** Class of the last selected table cell element during range selection when type is `month` */ monthCellLastSelectedClass: ClassDefinition; /** Class of the first hovered table cell element during range selection when type is `month` */ monthCellWithinHoveredRangeClass: ClassDefinition; /** Class of the table cell element when hovered during range selection when type is `month` */ monthCellFirstHoveredClass: ClassDefinition; /** Class of the table cell element when hovered during range selection and cell is in range when type is `month` */ monthCellWithinHoveredClass: ClassDefinition; /** Class of the last table cell element when hovered during range selection when type is `month` */ monthCellLastHoveredClass: ClassDefinition; /** Class of the table cell element of the current day when type is `month` */ monthCellTodayClass: ClassDefinition; /** Class of the table cell element whis is selectable when type is `month` */ monthCellSelectableClass: ClassDefinition; /** Class of the table cell element whis is unselectable when type is `month` */ monthCellUnselectableClass: ClassDefinition; /** Class of the events container when type is `month` */ monthCellEventsClass: ClassDefinition; /** Class of the events container element when type is `month` */ monthEventsClass: ClassDefinition; /** Class of the event element when type is `month` */ monthEventClass: ClassDefinition; /** Class of the event element with variant when type is `month` */ monthEventVariantClass: ClassDefinition; /** Class of the event element with indicator when type is `month` */ monthEventIndicatorClass: ClassDefinition; /** Class for the underlaying dropdown component */ dropdownClass: ClassDefinition; /** Class for the HTML input element */ inputClass: ClassDefinition; /** Class configuration for the internal input component */ inputClasses: Record<string, any>; /** Class configuration for the internal dropdown component */ dropdownClasses: Record<string, any>; /** Class configuration for the internal select component */ selectClasses: Record<string, any>; }>; datetimepicker?: ComponentConfigBase & Partial<{ /** Size of the input control */ size: string; /** Makes input full width when inside a grouped or addon field */ expanded: boolean; /** Open dropdown on focus */ openOnFocus: boolean; /** Custom function to format a date into a string */ dateFormatter: ((date: Date) => string) | undefined; /** Custom function to parse a string into a date */ dateParser: ((date: string) => Date) | undefined; /** Date creator function, default is `new Date()` */ datetimeCreator: (() => Date); /** Icon pack to use */ iconPack: string; /** Icon to be shown */ icon: string; /** Icon to be added on the right side */ iconRight: string; /** Dropdown content is shown into a modal on mobile */ mobileModal: boolean; /** Dropdown content is shown into a modal on desktop */ desktopModal: boolean; /** Enable mobile native input if mobile agent */ mobileNative: boolean; /** Append the component to another part of the DOM. Set `true` to append the component to the body. In addition, any CSS selector string or an actual DOM node can be used. */ teleport: boolean | object | string; /** Class of the Datepicker component wrapper element */ datepickerWrapperClass: ClassDefinition; /** Class of the Timepicker component wrapper element */ timepickerWrapperClass: ClassDefinition; }>; dropdown?: ComponentConfigBase & Partial<{ /** Makes the component check if menu reached scroll start or end and emit scroll events */ checkScroll: boolean; /** Max height of dropdown content */ maxHeight: number | string; /** Position of the dropdown relative to the trigger */ position: "auto" | "bottom-left" | "bottom-right" | "bottom" | "left" | "right" | "top-left" | "top-right" | "top"; /** Custom animation (transition name) */ animation: string; /** Dropdown menu tag name */ menuTag: DynamicComponent; /** Dropdown trigger tag name */ triggerTag: DynamicComponent; /** Dropdown will be triggered by any events */ triggers: ("click" | "contextmenu" | "focus" | "keydown" | "hover")[]; /** Keep dropdown list open when item get selected */ keepOpen: boolean; /** The first option will always be pre-selected (easier to just hit enter or tab) */ keepFirst: boolean; /** Close Dropdown when clicked outside */ closeOnOutside: boolean; /** Close Dropdown when page get scrolled */ closeOnScroll: boolean; /** Select current focused item when focused */ selectOnFocus: boolean; /** Select current focused item when closed */ selectOnClose: boolean; /** Dropdown content (items) are shown into a modal on mobile */ mobileModal: boolean; /** Dropdown content (items) are shown into a modal on desktop */ desktopModal: boolean; /** Mobile breakpoint as `max-width` value */ mobileBreakpoint: string; /** Append the component to another part of the DOM. Set `true` to append the component to the body. In addition, any CSS selector string or an actual DOM node can be used. */ teleport: boolean | object | string; /** Set `true` to remove the body scrollbar. When `false`, a non-scrollable scrollbar will be kept to avoid moving the background, but will set the body to a fixed position, which may break some layouts. */ clipScroll: boolean; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when on mobile */ mobileClass: ClassDefinition; /** Class of the root element when shown as modal */ modalClass: ClassDefinition; /** Class of the root element when teleported */ teleportClass: ClassDefinition; /** Class of the root element when inlined */ inlineClass: ClassDefinition; /** Class of the root element when disabled */ disabledClass: ClassDefinition; /** Class of the root element when expanded */ expandedClass: ClassDefinition; /** Class for the root element with position */ positionClass: ClassDefinition; /** Class for the root element when active or inline */ activeClass: ClassDefinition; /** Class for the root element when trigger is hoverable */ hoverableClass: ClassDefinition; /** Class of the trigger element */ triggerClass: ClassDefinition; /** Class of the menu element */ menuClass: ClassDefinition; /** Class of the menu element with position */ menuPositionClass: ClassDefinition; /** Class of the menu element when active or inline */ menuActiveClass: ClassDefinition; /** Class of the overlay when is shown as modal */ overlayClass: ClassDefinition; /** Class of the body when dropdown is open and scroll is clipped */ scrollClipClass: ClassDefinition; /** Class of the body when dropdown is open and scroll is keeped */ scrollKeepClass: ClassDefinition; /** Dropdown item tag name */ itemTag: DynamicComponent; /** Class of the item element. */ itemClass: ClassDefinition; /** Class of the item element when selected */ itemSelectedClass: ClassDefinition; /** Class of the item element when focused */ itemFocusedClass: ClassDefinition; /** Class of the item element when clickable */ itemClickableClass: ClassDefinition; /** Class of the item element when disabled */ itemDisabledClass: ClassDefinition; }>; field?: ComponentConfigBase & Partial<{ /** Vertical size of input */ labelsize: string; /** Message element tag name */ messageTag: DynamicComponent; /** Mobile breakpoint as `max-width` value */ mobileBreakpoint: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when on mobile */ mobileClass: ClassDefinition; /** Class of the root element when the form element is focused */ focusedClass: ClassDefinition; /** Class of the root element when the form element is filled */ filledClass: ClassDefinition; /** Class for the body wrapper element */ bodyClass: ClassDefinition; /** Class for inner wrapper element when grouped */ groupedClass: ClassDefinition; /** Class of the inner wrapper element when element get automatically attached together inside a field */ addonsClass: ClassDefinition; /** Class for inner body wrapper element to fill up multiple lines */ multilineClass: ClassDefinition; /** Class to align label and control in horizontal forms */ horizontalClass: ClassDefinition; /** Class for the label element when horizontal */ horizontalLabelClass: ClassDefinition; /** Class for the body element when horizontal */ horizontalBodyClass: ClassDefinition; /** Class for the label element */ labelClass: ClassDefinition; /** Class for the label element with size */ labelSizeClass: ClassDefinition; /** Class for the label element with variant */ labelVariantClass: ClassDefinition; /** Class for the message element */ messageClass: ClassDefinition; /** Class for the message element with variant */ messageVariantClass: ClassDefinition; }>; icon?: ComponentConfigBase & Partial<{ /** Color of the icon */ variant: string; /** Icon size */ size: string; /** Add class to icon font. See icon library documentation for custom classes. */ customClass: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when clickable */ clickableClass: ClassDefinition; /** Class of the root element when spin */ spinClass: ClassDefinition; }>; input?: ComponentConfigBase & Partial<{ /** Size of the control */ size: string; /** Color of the control */ variant: string; /** Makes input full width when inside a grouped or addon field */ expanded: boolean; /** Show character counter when maxlength prop is passed */ counter: boolean; /** Icon pack to use */ iconPack: string; /** Icon to be shown */ icon: string; /** Icon to be added on the right side */ iconRight: string; /** Add a button/icon to clear the inputed text */ clearable: boolean; /** Icon name to be added on the clear button */ clearIcon: string; /** Number of milliseconds to delay before to emit input event */ debounce: number; /** Native options to use in HTML5 validation */ autocomplete: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when expanded */ expandedClass: ClassDefinition; /** Class of the root element when rounded */ roundedClass: ClassDefinition; /** Class of the root element when disabled */ disabledClass: ClassDefinition; /** Class of the root element when type `textarea` */ textareaClass: ClassDefinition; /** Class to the root element when has a right icon */ hasIconRightClass: ClassDefinition; /** Class of the native input element */ inputClass: ClassDefinition; /** Class of the native input element with left icon space */ iconLeftSpaceClass: ClassDefinition; /** Class of the native input element with right icon space */ iconRightSpaceClass: ClassDefinition; /** Class of the native input element with placeholder */ placeholderClass: ClassDefinition; /** Class of the left icon element */ iconLeftClass: ClassDefinition; /** Class of the right icon element */ iconRightClass: ClassDefinition; /** Class of the counter element */ counterClass: ClassDefinition; }>; loading?: ComponentConfigBase & Partial<{ /** Custom animation (transition name) */ animation: string; /** Icon name to show, unnecessary when default slot is used. */ icon: string; /** Enable spin effect on icon */ iconSpin: boolean; /** Icon size */ iconSize: string; /** Set `true` to remove the body scrollbar. When `false`, a non-scrollable scrollbar will be kept to avoid moving the background, but will set the body to a fixed position, which may break some layouts. */ clipScroll: boolean; /** Class of the root element */ rootClass: ClassDefinition; /** Class for the root element when fullpage */ fullPageClass: ClassDefinition; /** Class of the overlay element */ overlayClass: ClassDefinition; /** Class for the icon element */ iconClass: ClassDefinition; /** Class for the label element */ labelClass: ClassDefinition; /** Class of the body when fullpage and scroll is clipped */ scrollClipClass: ClassDefinition; /** Class of the body when fullpage and scroll is keeped */ scrollKeepClass: ClassDefinition; }>; menu?: ComponentConfigBase & Partial<{ /** Role attribute to be passed to the list container for better accessibility. Use menu only in situations where your dropdown is related to a navigation menu. */ role: "menu" | "tree"; /** Icon pack to use */ iconPack: string; /** Icon size */ iconSize: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the menu list element */ listClass: ClassDefinition; /** Class of the menu label element */ labelClass: ClassDefinition; /** Transition name to apply on menu list */ animation: string; /** Menu item tag name */ itemTag: DynamicComponent; /** Class of the menu item root element */ itemClass: ClassDefinition; /** Class of the menu item root element when active */ itemActiveClass: ClassDefinition; /** Class of the menu item root element when focused */ itemFocusedClass: ClassDefinition; /** Class of the menu item root element when disabled */ itemDisabledClass: ClassDefinition; /** Class of the menu button element */ itemButtonClass: ClassDefinition; /** Class of the menu button element when active */ itemButtonActiveClass: ClassDefinition; /** Class of the menu button element when focused */ itemButtonFocusedClass: ClassDefinition; /** Class of the menu button element when disabled */ itemButtonDisabledClass: ClassDefinition; /** Class of the menu button element with icon */ itemButtonIconClass: ClassDefinition; /** Class of the menu item submenu element */ itemSubmenuClass: ClassDefinition; }>; modal?: ComponentConfigBase & Partial<{ /** Width of the Modal */ width: number | string; /** Custom animation (transition name) */ animation: string; /** Show an overlay */ overlay: boolean; /** Is Modal cancleable by clicking 'X', pressing escape or clicking outside */ cancelable: boolean | string[]; /** Set `true` to remove the body scrollbar. When `false`, a non-scrollable scrollbar will be kept to avoid moving the background, but will set the body to a fixed position, which may break some layouts. */ clipScroll: boolean; /** Trap focus inside the modal */ trapFocus: boolean; /** This enables the `alertdialog` role, allowing assistive technologies and browsers to distinguish alert modals from other modals. Alert modals interrupt the user's workflow to communicate an important messages and acquire an explicit response. */ alert: boolean; /** Accessibility aria-label to be passed to the div wrapper element */ ariaLabel: string; /** Automatically focus modal when active */ autoFocus: boolean; /** Close icon name */ closeIcon: string; /** Size of close icon */ closeIconSize: string; /** Accessibility label for the close button */ ariaCloseLabel: string; /** Mobile breakpoint as `max-width` value */ mobileBreakpoint: string; /** Append the component to another part of the DOM. Set `true` to append the component to the body. In addition, any CSS selector string or an actual DOM node can be used. */ teleport: boolean | object | string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when on mobile */ mobileClass: ClassDefinition; /** Class of the root element when active */ activeClass: ClassDefinition; /** Class of the overlay element */ overlayClass: ClassDefinition; /** Class of the content element */ contentClass: ClassDefinition; /** Class of the content element when fullscreen */ fullScreenClass: ClassDefinition; /** Class of the close button element */ closeClass: ClassDefinition; /** Class of the body when modal is open and scroll is clipped */ scrollClipClass: ClassDefinition; /** Class of the body when modal is open and scroll is keeped */ scrollKeepClass: ClassDefinition; }>; notification?: ComponentConfigBase & Partial<{ /** Color of the control */ variant: string; /** Enable rounded style */ rounded: boolean; /** Which position the notification will appear when programmatically */ position: "bottom-left" | "bottom-right" | "bottom" | "top-left" | "top-right" | "top"; /** Custom animation (transition name) */ animation: string; /** Icon pack to use */ iconPack: string; /** Icon size */ iconSize: string; /** Close icon name */ closeIcon: string; /** Size of close icon */ closeIconSize: string; /** Accessibility label for the close button */ ariaCloseLabel: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when positioned */ positionClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when rounded */ roundedClass: ClassDefinition; /** Class of the close button element */ closeClass: ClassDefinition; /** Class of the content element */ contentClass: ClassDefinition; /** Class of the icon element on the left */ iconClass: ClassDefinition; /** Class of the wrapper element */ wrapperClass: ClassDefinition; /** Hide notification after duration (in miliseconds) */ duration: number; /** If notice should queue with others notices. */ queue: boolean; /** Class of the notice wrapper element */ noticeClass: ClassDefinition; /** Class of the notice wrapper element when positioned */ noticePositionClass: ClassDefinition; /** Class of the notice container element */ noticeContainerClass: ClassDefinition; }>; pagination?: ComponentConfigBase & Partial<{ /** Items count for each page */ perPage: number | string; /** Pagination size */ size: string; /** Enable simple style */ simple: boolean; /** Enable rounded button style */ rounded: boolean; /** Buttons order */ order: "centered" | "left" | "right"; /** Pagination button tag name */ buttonTag: DynamicComponent; /** Icon pack to use */ iconPack: string; /** Icon to use for previous button */ iconPrev: string; /** Icon to use for next button */ iconNext: string; /** Mobile breakpoint as `max-width` value */ mobileBreakpoint: string; /** Accessibility label for the next page button. */ ariaNextLabel: string; /** Accessibility label for the previous page button. */ ariaPreviousLabel: string; /** Accessibility label for the page button. */ ariaPageLabel: string; /** Accessibility label for the current page button. */ ariaCurrentLabel: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element when on mobile */ mobileClass: ClassDefinition; /** Class of the root element with order */ orderClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element when in `simple` mode */ simpleClass: ClassDefinition; /** Class of the page info in `simple` mode */ infoClass: ClassDefinition; /** Class of the items list element */ listClass: ClassDefinition; /** Class of the list item element */ listItemClass: ClassDefinition; /** Class of the ellipsis element */ ellipsisClass: ClassDefinition; /** Class of the button element */ buttonClass: ClassDefinition; /** Class of the button element when rounded */ roundedClass: ClassDefinition; /** Class of the current button element */ buttonCurrentClass: ClassDefinition; /** Class of the prev button element */ buttonPrevClass: ClassDefinition; /** Class of the next button element */ buttonNextClass: ClassDefinition; /** Class of the prev or next button when disabled */ buttonDisabledClass: ClassDefinition; }>; radio?: ComponentConfigBase & Partial<{ /** Color of the control */ variant: string; /** Size of the control */ size: string; /** Same as native autocomplete options to use in HTML5 validation */ autocomplete: string; /** Class of the root element */ rootClass: ClassDefinition; /** Class of the root element with size */ sizeClass: ClassDefinition; /** Class of the root element with variant */ variantClass: ClassDefinition; /** Class of the root element when disabled */ disabledClass: ClassDefinition; /** Class of the root element when checked */ checkedClass: ClassDefinition; /** Class of the native input element */ inputClass: ClassDefinition; /** Class of the label element */ labelClass: ClassDefinition; }>; select?: ComponentConfigBase & Partial<{ /** Vertical size of input */ size: string; /** Color of the control */ variant: string;