@mozaic-ds/vue 2.13.1 → 2.15.0

package/dist/mozaic-vue.d.ts

@@ -15,6 +15,7 @@ import { GlobalDirectives } from 'vue';
 import { nextTick } from 'vue';
 import { OnCleanup } from '@vue/reactivity';
 import { PublicProps } from 'vue';
+import { ShallowRef } from 'vue';
 import { ShallowUnwrapRef } from 'vue';
 import { Slot } from 'vue';
 import { VNode } from 'vue';
@@ -31,7 +32,13 @@ appearance: "standard" | "ghost";
 behavior: "multiple" | "single";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-declare const __VLS_component_10: DefineComponent<__VLS_Props_18, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+declare const __VLS_component_10: DefineComponent<__VLS_Props_17, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_17> & Readonly<{}>, {
+appearance: "primary" | "secondary" | "tertiary" | "inverse";
+size: "s" | "m" | "l";
+orientation: "vertical" | "horizontal";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_11: DefineComponent<__VLS_Props_18, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 back: () => any;
 "update:open": (value: boolean) => any;
 }, string, PublicProps, Readonly<__VLS_Props_18> & Readonly<{
@@ -43,11 +50,11 @@ scroll: boolean;
 titleRef: HTMLHeadingElement;
 }, any>;
 
-declare const __VLS_component_11: DefineComponent<__VLS_Props_19, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_19> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component_12: DefineComponent<__VLS_Props_19, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_19> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-declare const __VLS_component_12: DefineComponent<__VLS_Props_20, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_20> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLFieldSetElement>;
+declare const __VLS_component_13: DefineComponent<__VLS_Props_20, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_20> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLFieldSetElement>;
 
-declare const __VLS_component_13: DefineComponent<FileUploaderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+declare const __VLS_component_14: DefineComponent<FileUploaderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (v: NormalizedFile[]) => any;
 validation: (validationState: FilesValidationState) => any;
 }, string, PublicProps, Readonly<FileUploaderProps> & Readonly<{
@@ -63,40 +70,167 @@ uploadButtonLabel: string;
 fileInput: HTMLInputElement;
 }, HTMLDivElement>;
 
-declare const __VLS_component_14: DefineComponent<__VLS_Props_22, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_22> & Readonly<{}>, {
+declare const __VLS_component_15: DefineComponent<__VLS_Props_21, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+delete: () => any;
+}, string, PublicProps, Readonly<__VLS_Props_21> & Readonly<{
+onDelete?: (() => any) | undefined;
+}>, {
+format: "inline" | "stacked";
+deleteButtonLabel: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_16: DefineComponent<__VLS_Props_23, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_23> & Readonly<{}>, {
 appearance: "standard" | "accent" | "danger" | "inverse";
 type: "button" | "reset" | "submit";
 size: "s" | "m" | "l";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
 
-declare const __VLS_component_15: DefineComponent<__VLS_Props_26, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_26> & Readonly<{}>, {
+declare const __VLS_component_17: DefineComponent<__VLS_Props_27, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_27> & Readonly<{}>, {
 appearance: "secondary" | "accent" | "inverse" | "standard";
 size: "s" | "m";
 iconPosition: "left" | "right";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_16: DefineComponent<__VLS_Props_29, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+declare const __VLS_component_18: DefineComponent<__VLS_Props_30, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:open": (value: boolean) => any;
-}, string, PublicProps, Readonly<__VLS_Props_29> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_30> & Readonly<{
 "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
 scroll: boolean;
 closable: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_17: DefineComponent<__VLS_Props_31, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_31> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component_19: DefineComponent<__VLS_Props_33, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_33> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_2: DefineComponent<__VLS_Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_2> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_20: DefineComponent<__VLS_Props_34, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+back: () => any;
+"toggle-menu": () => any;
+}, string, PublicProps, Readonly<__VLS_Props_34> & Readonly<{
+onBack?: (() => any) | undefined;
+"onToggle-menu"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_21: DefineComponent<__VLS_Props_39, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_39> & Readonly<{}>, {
+appearance: "standard" | "inverse";
+size: "s" | "m" | "l";
+position: "top" | "right" | "bottom" | "left";
+closable: boolean;
+pointer: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_18: DefineComponent<__VLS_Props_45, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+declare const __VLS_component_22: DefineComponent<__VLS_Props_45, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value: boolean) => any;
 close: () => any;
 }, string, PublicProps, Readonly<__VLS_Props_45> & Readonly<{
+"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
+
+declare const __VLS_component_23: DefineComponent<__VLS_Props_46, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_46> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+trigger: HTMLButtonElement;
+listbox: HTMLDivElement;
+}, any>;
+
+declare const __VLS_component_24: DefineComponent<__VLS_Props_47, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"log-out": () => any;
+}, string, PublicProps, Readonly<__VLS_Props_47> & Readonly<{
+"onLog-out"?: (() => any) | undefined;
+}>, {
+logOutLabel: string;
+expendable: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+listbox: ({
+$: ComponentInternalInstance;
+$data: {};
+$props: {
+readonly expanded: boolean;
+readonly logOutLabel: string;
+readonly onListboxKeydown: (event: KeyboardEvent) => void;
+readonly hideFloatingItem: () => void;
+readonly "onLog-out"?: (() => any) | undefined;
+} & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+$attrs: {
+[x: string]: unknown;
+};
+$refs: {
+[x: string]: unknown;
+} & {
+container: HTMLDivElement;
+};
+$slots: Readonly<{
+[name: string]: Slot<any> | undefined;
+}>;
+$root: ComponentPublicInstance | null;
+$parent: ComponentPublicInstance | null;
+$host: Element | null;
+$emit: (event: "log-out") => void;
+$el: HTMLDivElement;
+$options: ComponentOptionsBase<Readonly<{
+expanded: boolean;
+logOutLabel: string;
+onListboxKeydown: (event: KeyboardEvent) => void;
+hideFloatingItem: () => void;
+}> & Readonly<{
+"onLog-out"?: (() => any) | undefined;
+}>, {
+container: Readonly<ShallowRef<HTMLDivElement | null>>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"log-out": () => any;
+}, string, {}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
+beforeCreate?: (() => void) | (() => void)[];
+created?: (() => void) | (() => void)[];
+beforeMount?: (() => void) | (() => void)[];
+mounted?: (() => void) | (() => void)[];
+beforeUpdate?: (() => void) | (() => void)[];
+updated?: (() => void) | (() => void)[];
+activated?: (() => void) | (() => void)[];
+deactivated?: (() => void) | (() => void)[];
+beforeDestroy?: (() => void) | (() => void)[];
+beforeUnmount?: (() => void) | (() => void)[];
+destroyed?: (() => void) | (() => void)[];
+unmounted?: (() => void) | (() => void)[];
+renderTracked?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+renderTriggered?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+errorCaptured?: ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void)[];
+};
+$forceUpdate: () => void;
+$nextTick: nextTick;
+$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, OnCleanup]) => any : (...args: [any, any, OnCleanup]) => any, options?: WatchOptions): WatchStopHandle;
+} & Readonly<{}> & Omit<Readonly<{
+expanded: boolean;
+logOutLabel: string;
+onListboxKeydown: (event: KeyboardEvent) => void;
+hideFloatingItem: () => void;
+}> & Readonly<{
+"onLog-out"?: (() => any) | undefined;
+}>, "container"> & ShallowUnwrapRef<    {
+container: Readonly<ShallowRef<HTMLDivElement | null>>;
+}> & {} & ComponentCustomProperties & {} & {
+$slots: {
+default?(_: {}): any;
+};
+}) | null;
+trigger: HTMLButtonElement;
+}, HTMLElement>;
+
+declare const __VLS_component_25: DefineComponent<__VLS_Props_51, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_51> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+trigger: HTMLButtonElement;
+listbox: HTMLDivElement;
+}, any>;
+
+declare const __VLS_component_26: DefineComponent<__VLS_Props_56, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+close: () => any;
+}, string, PublicProps, Readonly<__VLS_Props_56> & Readonly<{
 onClose?: (() => any) | undefined;
 }>, {
 status: "info" | "success" | "warning" | "error";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-declare const __VLS_component_19: DefineComponent<__VLS_Props_52, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+declare const __VLS_component_27: DefineComponent<__VLS_Props_63, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string | number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_52> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_63> & Readonly<{
 "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
 size: "s" | "m";
@@ -104,52 +238,86 @@ clearLabel: string;
 inputType: "date" | "email" | "number" | "password" | "search" | "tel" | "text";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_2: DefineComponent<__VLS_Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_2> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component_28: DefineComponent<__VLS_Props_64, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_64> & Readonly<{}>, {
+appearance: "primary" | "secondary" | "inverse";
+bordered: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_29: DefineComponent<__VLS_Props_65, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+action: () => any;
+}, string, PublicProps, Readonly<__VLS_Props_65> & Readonly<{
+onAction?: (() => any) | undefined;
+}>, {
+appearance: "primary" | "secondary" | "inverse";
+iconPosition: "bottom" | "right";
+bordered: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+declare const __VLS_component_3: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-declare const __VLS_component_20: DefineComponent<__VLS_Props_53, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+declare const __VLS_component_30: DefineComponent<__VLS_Props_66, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_66> & Readonly<{}>, {
+appearance: "primary" | "secondary";
+label: string;
+trigger: "container" | "icon" | "button";
+bordered: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_31: DefineComponent<__VLS_Props_67, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value: boolean) => any;
+}, string, PublicProps, Readonly<__VLS_Props_67> & Readonly<{
+"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {
+inputType: "checkbox" | "radio";
+bordered: boolean;
+inputPosition: "left" | "right";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_32: DefineComponent<__VLS_Props_68, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:open": (value: boolean) => any;
-}, string, PublicProps, Readonly<__VLS_Props_53> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_68> & Readonly<{
 "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
 status: "info" | "success" | "warning" | "error";
 closable: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-declare const __VLS_component_21: DefineComponent<__VLS_Props_56, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_56> & Readonly<{}>, {
+declare const __VLS_component_33: DefineComponent<__VLS_Props_71, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_71> & Readonly<{}>, {
 position: "top" | "bottom" | "left" | "right";
 pointer: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-declare const __VLS_component_3: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component_4: DefineComponent<__VLS_Props_4, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+close: () => any;
+}, string, PublicProps, Readonly<__VLS_Props_4> & Readonly<{
+onClose?: (() => any) | undefined;
+}>, {
+position: "top" | "bottom" | "left" | "right";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+popover: HTMLDivElement;
+}, any>;
 
-declare const __VLS_component_4: DefineComponent<__VLS_Props_5, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_5> & Readonly<{}>, {
+declare const __VLS_component_5: DefineComponent<__VLS_Props_5, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_5> & Readonly<{}>, {
 size: "s" | "m" | "l";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>;
 
-declare const __VLS_component_5: DefineComponent<__VLS_Props_8, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_8> & Readonly<{}>, {
+declare const __VLS_component_6: DefineComponent<__VLS_Props_8, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_8> & Readonly<{}>, {
 appearance: "standard" | "accent" | "danger" | "inverse";
 type: "button" | "reset" | "submit";
 size: "s" | "m" | "l";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
 
-declare const __VLS_component_6: DefineComponent<__VLS_Props_9, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_9> & Readonly<{}>, {
+declare const __VLS_component_7: DefineComponent<__VLS_Props_9, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_9> & Readonly<{}>, {
 appearance: "standard" | "accent" | "tips" | "inverse";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-declare const __VLS_component_7: DefineComponent<__VLS_Props_10, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_10> & Readonly<{}>, {
+declare const __VLS_component_8: DefineComponent<__VLS_Props_10, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_10> & Readonly<{}>, {
 previousButtonAriaLabel: string;
 nextButtonAriaLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {
 contentContainer: HTMLDivElement;
 }, HTMLDivElement>;
 
-declare const __VLS_component_8: DefineComponent<__VLS_Props_15, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_15> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
-
-declare const __VLS_component_9: DefineComponent<__VLS_Props_17, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_17> & Readonly<{}>, {
-appearance: "primary" | "secondary" | "tertiary" | "inverse";
-size: "s" | "m" | "l";
-orientation: "vertical" | "horizontal";
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component_9: DefineComponent<__VLS_Props_15, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_15> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
 /**
  * An Accordion List is a component that organizes content into collapsible sections, allowing users to show or hide related information within a vertically stacked layout. This structure helps optimize space and improve readability by displaying only relevant content when needed. Accordion Lists are commonly used in FAQs, settings menus, and structured content navigation to enhance user experience and reduce visual clutter.
@@ -507,9 +675,39 @@ declare type __VLS_Props_20 = {
 };
 
 /**
- * A flag is used to display meta-information about a product or service, acting as a visual indicator of the main category of content. It is typically placed at the top of an element to ensure immediate visibility.
+ * A file uploader allows users to upload one or multiple files by either dragging and dropping files into a dedicated area or selecting them manually through their local folders. It provides real-time feedback on upload progress and file status, including file name, size, and success or error indicators. File uploaders are commonly used in forms, content management systems, and document submission processes to facilitate seamless file handling.
  */
 declare type __VLS_Props_21 = {
+    /**
+     * Represents the file to be displayed in the file uploader item.
+     */
+    file: NormalizedFile;
+    /**
+     * Layout format of the item.
+     */
+    format?: 'inline' | 'stacked';
+    /**
+     * Indicates if the file is valid according to the uploader's validation rules.
+     */
+    valid?: boolean;
+    /**
+     * Custom error message for the file.
+     */
+    errorMessage?: string;
+    /**
+     * Label for the delete button.
+     */
+    deleteButtonLabel?: string;
+    /**
+     * Optional informational text displayed under the file name.
+     */
+    information?: string;
+};
+
+/**
+ * A flag is used to display meta-information about a product or service, acting as a visual indicator of the main category of content. It is typically placed at the top of an element to ensure immediate visibility.
+ */
+declare type __VLS_Props_22 = {
     /**
      * Label of the Flag.
      */
@@ -523,7 +721,7 @@ declare type __VLS_Props_21 = {
 /**
  * Buttons are key interactive elements used to perform actions and can be used as standalone element, or as part of another component. Their appearance depends on the type of action required from the user and the context in which they are used.
  */
-declare type __VLS_Props_22 = {
+declare type __VLS_Props_23 = {
     /**
      * Defines the visual style of the icon button.
      */
@@ -548,12 +746,16 @@ declare type __VLS_Props_22 = {
      * Specifies the button's HTML `type` attribute.
      */
     type?: 'button' | 'reset' | 'submit';
+    /**
+     * If `true`, a loading state is displayed.
+     */
+    isLoading?: boolean;
 };
 
 /**
  * A KPI Item is used to display Key Performance Indicators (KPIs) within an interface, providing a quick and clear visualization of essential data. It often includes contextual elements such as labels, trends, or status indicators to help users interpret the information at a glance. KPI Items are commonly used in dashboards, reports, and analytics tools to highlight critical metrics and facilitate data-driven decision-making.
  */
-declare type __VLS_Props_23 = {
+declare type __VLS_Props_24 = {
     /**
      * The current value of the kpi item.
      */
@@ -583,7 +785,7 @@ declare type __VLS_Props_23 = {
 /**
  * A linear progress bar (Buffer) visually represents the progress of a task along a horizontal track, often indicating both current progress and a secondary buffered state. This type of progress bar is commonly used for loading processes, file uploads, or streaming indicators, where part of the task is completed while another portion is preloaded or buffered. It provides users with real-time feedback on task advancement.
  */
-declare type __VLS_Props_24 = {
+declare type __VLS_Props_25 = {
     /**
      * Allows to define the progress bar size.
      */
@@ -597,7 +799,7 @@ declare type __VLS_Props_24 = {
 /**
  * A linear progress bar (Percentage) visually represents the completion of a task along a horizontal track, displaying the exact progress in percentage within the bar. It is commonly used for file uploads, installations, form completion, or any process requiring user awareness of progress. The percentage label provides clear and immediate feedback, helping users track progress with precision.
  */
-declare type __VLS_Props_25 = {
+declare type __VLS_Props_26 = {
     /**
      * The current value of the progress bar.
      */
@@ -607,7 +809,7 @@ declare type __VLS_Props_25 = {
 /**
  * A link is an interactive text element used to navigate between pages, sections, or external resources. It is typically underlined and styled to indicate its clickable nature. Links can be standalone or embedded within text, and they may include icons to reinforce their purpose. They are essential for navigation and content referencing in web and application interfaces.
  */
-declare type __VLS_Props_26 = {
+declare type __VLS_Props_27 = {
     /**
      * Position of the icon relative to the text.
      */
@@ -641,7 +843,7 @@ declare type __VLS_Props_26 = {
 /**
  * A loader is a visual indicator used to inform users that a process is in progress, typically during data fetching, page loading, or background operations. It provides feedback that the system is working, helping to manage user expectations and reduce perceived wait time.
  */
-declare type __VLS_Props_27 = {
+declare type __VLS_Props_28 = {
     /**
      * Specifies the visual appearance of the loader.
      */
@@ -659,7 +861,7 @@ declare type __VLS_Props_27 = {
 /**
  * A loading overlay is a full-screen or container-level layer that indicates a process is in progress, preventing user interaction until the task is completed. It includes a progress indicator, and a message to inform users about the loading state. Loading Overlays are commonly used in data-heavy applications, form submissions, and page transitions to enhance user experience by managing wait times effectively.
  */
-declare type __VLS_Props_28 = {
+declare type __VLS_Props_29 = {
     /**
      * Controls the visibility of the loading overlay.
      */
@@ -670,10 +872,20 @@ declare type __VLS_Props_28 = {
     text?: string;
 };
 
+/**
+ * An action bottom bar is a fixed element positioned at the bottom of the screen or section, providing persistent access to key actions. It is commonly used for confirmations, validations, warnings, or bulk actions in forms, editing workflows, or data management. This component ensures that primary and secondary actions remain visible and accessible, even when scrolling.
+ */
+declare type __VLS_Props_3 = {
+    /**
+     * If `true`, adds a shadow to the action bottom bar.
+     */
+    shadow?: boolean;
+};
+
 /**
  * A modal is a dialog window that appears on top of the main content, requiring user interaction before returning to the main interface. It is used to focus attention on a specific task, provide important information, or request confirmation for an action. Modals typically include a title, description, and primary/secondary actions and should be used for single, focused tasks to avoid disrupting the user experience.
  */
-declare type __VLS_Props_29 = {
+declare type __VLS_Props_30 = {
     /**
      * if `true`, display the modal.
      */
@@ -701,19 +913,35 @@ declare type __VLS_Props_29 = {
 };
 
 /**
- * An action bottom bar is a fixed element positioned at the bottom of the screen or section, providing persistent access to key actions. It is commonly used for confirmations, validations, warnings, or bulk actions in forms, editing workflows, or data management. This component ensures that primary and secondary actions remain visible and accessible, even when scrolling.
+ * A navigation indicator visually represents the current position within a sequence or step-based process, helping users track progress or navigate through a series of items. It is commonly used in carousels, onboarding flows, or media players. Navigation indicators can be interactive, allowing users to jump between steps, or passive, simply showing progress.
  */
-declare type __VLS_Props_3 = {
+declare type __VLS_Props_31 = {
     /**
-     * If `true`, adds a shadow to the action bottom bar.
+     * The total number of steps to display.
      */
-    shadow?: boolean;
+    steps: number;
+    /**
+     * The index of the currently active step (zero-based).
+     */
+    modelValue: number;
+    /**
+     * The current action state of the button. Can be "pause" to show the pause icon or "resume" to show the play icon.
+     */
+    action?: 'pause' | 'resume';
+    /**
+     * The text label displayed in the Resume or Pause button.
+     */
+    label?: string;
+    /**
+     * If `true`, hides the Resume or Pause button next to the steps.
+     */
+    player?: boolean;
 };
 
 /**
  * A Number Badge represents a numeric count, often used to indicate notifications, updates, or items requiring attention. Its distinct appearance makes it easy to spot changes at a glance, ensuring users stay informed without breaking their workflow. Badges are commonly attached to icons, buttons, or tabs to provide contextual awareness.
  */
-declare type __VLS_Props_30 = {
+declare type __VLS_Props_32 = {
     /**
      * Content of the badge.
      */
@@ -731,7 +959,7 @@ declare type __VLS_Props_30 = {
 /**
  * An overlay is a semi-transparent layer that appears on top of the main content, typically used to dim the background and focus user attention on a specific element. It is often combined with modals, popovers, or loading states to create a visual separation between the foreground and background. Overlays help prevent unintended interactions while keeping the primary content accessible.
  */
-declare type __VLS_Props_31 = {
+declare type __VLS_Props_33 = {
     /**
      * Controls the visibility of the overlay.
      */
@@ -742,10 +970,40 @@ declare type __VLS_Props_31 = {
     dialogLabel?: string;
 };
 
+/**
+ * The Page Header is a fundamental component that structures the top part of an interface, serving as a cognitive anchor point for users. It establishes page context, facilitates navigation, and provides the main actions available within the current scope.
+ */
+declare type __VLS_Props_34 = {
+    /**
+     * Main title displayed in the page header.
+     */
+    title: string;
+    /**
+     * Enables a drop shadow under the page header.
+     */
+    shadow?: boolean;
+    /**
+     * Displays a back icon button in the header.
+     */
+    backButton?: boolean;
+    /**
+     * Component status.
+     */
+    status?: 'info' | 'success' | 'warning' | 'error' | 'neutral';
+    /**
+     * Label text displayed inside the status badge.
+     */
+    statusLabel?: string;
+    /**
+     * Additional information text shown below the title.
+     */
+    extraInfo?: string;
+};
+
 /**
  * Pagination is a navigation component that allows users to browse through large sets of content by dividing it into discrete pages. It typically includes previous and next buttons, numeric page selectors, or dropdowns to jump between pages efficiently. Pagination improves usability and performance in content-heavy applications such as tables, search results, and articles by preventing long scrolls and reducing page load times.
  */
-declare type __VLS_Props_32 = {
+declare type __VLS_Props_35 = {
     /**
      * A unique identifier for the pagination.
      */
@@ -775,7 +1033,7 @@ declare type __VLS_Props_32 = {
 /**
  * A password input is a specialized input field used to securely enter and manage passwords. It typically masks the characters entered to protect sensitive information from being seen. It includes a toggle button to show or hide the password, improving usability while maintaining security. Password inputs are commonly used in login forms, account creation, and authentication flows.
  */
-declare type __VLS_Props_33 = {
+declare type __VLS_Props_36 = {
     /**
      * A unique identifier for the password input element, used to associate the label with the form element.
      */
@@ -824,7 +1082,7 @@ declare type __VLS_Props_33 = {
 /**
  * A phone number input is a specialized input field designed to capture and validate phone numbers, ensuring correct formatting based on country-specific dialing codes. It often includes a country selector that automatically adjusts the international dialing code. This component improves user experience by standardizing phone number entries, reducing errors, and facilitating global compatibility. It is commonly used in registration forms, authentication flows, and contact information fields.
  */
-declare type __VLS_Props_34 = {
+declare type __VLS_Props_37 = {
     /**
      * A unique identifier for the phone number input element, used to associate the label with the form element.
      */
@@ -878,7 +1136,7 @@ declare type __VLS_Props_34 = {
 /**
  * A pincode input is a specialized input field used to enter short numeric codes, such as verification codes, security PINs, or authentication tokens. It typically separates each digit into individual fields to improve readability and ease of entry. This component is commonly used in two-factor authentication (2FA), password recovery, and secure access flows, ensuring a structured and user-friendly experience.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field section](/docs/form-elements-field--docs#input).
  */
-declare type __VLS_Props_35 = {
+declare type __VLS_Props_38 = {
     /**
      * A unique identifier for the pincode element, used to associate the label with the form element.
      */
@@ -910,67 +1168,141 @@ declare type __VLS_Props_35 = {
 };
 
 /**
- * A quantity selector is an input component that allows users to increment or decrement a numeric value, typically using plus (+) and minus (−) buttons. It provides a simple and efficient way to adjust quantities without manual typing, ensuring controlled input. This component is commonly used in e-commerce, inventory management, and settings where users need to specify amounts.
+ * A popover is a small overlay that appears above other content, typically triggered by a user interaction such as clicking or hovering over an element. It is used to display contextual information, additional actions, or interactive content without navigating away from the main interface. Popovers often include a title, description, and action buttons, and they automatically close when clicking outside or selecting an action.
  */
-declare type __VLS_Props_36 = {
-    /**
-     * A unique identifier for the quantity selector element, used to associate the label with the form element.
-     */
-    id: string;
-    /**
-     * The name attribute for the quantity selector element, typically used for form submission.
-     */
-    name?: string;
-    /**
-     * The current value of the quantity selector field.
-     */
-    modelValue?: number;
-    /**
-     * If `true`, applies an invalid state to the quantity selector.
-     */
-    isInvalid?: boolean;
-    /**
-     * If `true`, disables the quantity selector, making it non-interactive.
-     */
-    disabled?: boolean;
+declare type __VLS_Props_39 = {
     /**
-     * Determines the size of the quantity selector.
+     * Allows to define the popover appearance.
      */
-    size?: 's' | 'm';
+    appearance?: 'standard' | 'inverse';
     /**
-     * Minimum acceptable value for the quantity selector.
+     * Defines the preferred position of the popover relative to its activator.
      */
-    min?: number;
+    position?: 'top' | 'right' | 'bottom' | 'left';
     /**
-     * Maximum acceptable value for the quantity selector.
+     * Controls the visibility of the popover pointer (arrow).
      */
-    max?: number;
+    pointer?: boolean;
     /**
-     * Determines how much the value will change per click when the quantity is increased or decreased.
+     * Sets the overall size of the popover.
      */
-    step?: number;
+    size?: 's' | 'm' | 'l';
     /**
-     * If `true`, the quantity selector is read-only (cannot be edited).
+     * Displays a close icon button inside the popover.
+     * Clicking the button will close the popover.
      */
-    readonly?: boolean;
+    closable?: boolean;
     /**
-     * The label text for the increment button.
+     * Title displayed at the top of the popover.
      */
-    incrementlabel?: string;
+    title?: string;
     /**
-     * The label text for the decrement button.
+     * Supplementary text displayed below the title.
      */
-    decrementLabel?: string;
+    description?: string;
 };
 
 /**
- * A radio button is a selection control that allows users to choose a single option from a list of mutually exclusive choices. Unlike checkboxes, only one option can be selected at a time within the same group. Radio Buttons are commonly used in forms, surveys, and settings where a single choice must be made.
+ * An action list is a contextual menu that presents a list of available actions related to a specific element or interface area. It allows users to quickly access functions such as editing, sharing, deleting, or navigating to sub-actions. Action Lists are commonly triggered by buttons, icons (e.g., three-dot menus), or right-click interactions, ensuring a clean and efficient UI.
  */
-declare type __VLS_Props_37 = {
+declare type __VLS_Props_4 = {
     /**
-     * A unique identifier for the radio, used to associate the label with the form element.
+     * title displayed in mobile version.
      */
-    id: string;
+    title?: string;
+    /**
+     * Defines the position of the listbox relative to its trigger or container.
+     */
+    position?: 'top' | 'bottom' | 'left' | 'right';
+    /**
+     * An array of objects that allows you to provide all the data needed to generate the content for each item.
+     */
+    items: Array<{
+        /**
+         * The icon displayed for the item from Mozaic-icon-vue.
+         */
+        icon?: Component;
+        /**
+         * The label displayed for the item.
+         */
+        label: string;
+        /**
+         * If `true`, the item will be disabled.
+         */
+        disabled?: boolean;
+        /**
+         * Allows to define the item appearance.
+         */
+        appearance?: 'standard' | 'danger';
+        /**
+         * Add a divider on top of the item.
+         */
+        divider?: boolean;
+    }>;
+};
+
+/**
+ * A quantity selector is an input component that allows users to increment or decrement a numeric value, typically using plus (+) and minus (−) buttons. It provides a simple and efficient way to adjust quantities without manual typing, ensuring controlled input. This component is commonly used in e-commerce, inventory management, and settings where users need to specify amounts.
+ */
+declare type __VLS_Props_40 = {
+    /**
+     * A unique identifier for the quantity selector element, used to associate the label with the form element.
+     */
+    id: string;
+    /**
+     * The name attribute for the quantity selector element, typically used for form submission.
+     */
+    name?: string;
+    /**
+     * The current value of the quantity selector field.
+     */
+    modelValue?: number;
+    /**
+     * If `true`, applies an invalid state to the quantity selector.
+     */
+    isInvalid?: boolean;
+    /**
+     * If `true`, disables the quantity selector, making it non-interactive.
+     */
+    disabled?: boolean;
+    /**
+     * Determines the size of the quantity selector.
+     */
+    size?: 's' | 'm';
+    /**
+     * Minimum acceptable value for the quantity selector.
+     */
+    min?: number;
+    /**
+     * Maximum acceptable value for the quantity selector.
+     */
+    max?: number;
+    /**
+     * Determines how much the value will change per click when the quantity is increased or decreased.
+     */
+    step?: number;
+    /**
+     * If `true`, the quantity selector is read-only (cannot be edited).
+     */
+    readonly?: boolean;
+    /**
+     * The label text for the increment button.
+     */
+    incrementlabel?: string;
+    /**
+     * The label text for the decrement button.
+     */
+    decrementLabel?: string;
+};
+
+/**
+ * A radio button is a selection control that allows users to choose a single option from a list of mutually exclusive choices. Unlike checkboxes, only one option can be selected at a time within the same group. Radio Buttons are commonly used in forms, surveys, and settings where a single choice must be made.
+ */
+declare type __VLS_Props_41 = {
+    /**
+     * A unique identifier for the radio, used to associate the label with the form element.
+     */
+    id: string;
     /**
      * The name attribute for the radio element, typically used for form submission.
      */
@@ -996,7 +1328,7 @@ declare type __VLS_Props_37 = {
 /**
  * A radio button is a selection control that allows users to choose a single option from a list of mutually exclusive choices. Unlike checkboxes, only one option can be selected at a time within the same group. Radio Buttons are commonly used in forms, surveys, and settings where a single choice must be made.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field Group section](/docs/form-elements-field-group--docs#radio-group).
  */
-declare type __VLS_Props_38 = {
+declare type __VLS_Props_42 = {
     /**
      * The name attribute for the radio element, typically used for form submission.
      */
@@ -1028,11 +1360,14 @@ declare type __VLS_Props_38 = {
 /**
  * A Segmented Control allows users to switch between multiple options or views within a single container. It provides a compact and efficient way to toggle between sections without requiring a dropdown or separate navigation. Segmented Controls are commonly used in filters, tabbed navigation, and content selection to enhance user interaction and accessibility.
  */
-declare type __VLS_Props_39 = {
+declare type __VLS_Props_43 = {
     /**
-     * The selected segment index, bound via v-model.
+     * Defines the currently active tab.
+     *
+     * - If a `number` is provided, it represents the index of the segment.
+     * - If a `string` is provided, it must match the `id` of one of the segments.
      */
-    modelValue?: number;
+    modelValue?: string | number;
     /**
      * if `true`, the segmented control take the full width.
      */
@@ -1046,51 +1381,20 @@ declare type __VLS_Props_39 = {
      */
     segments: Array<{
         /**
-         * The label displayed for the segment.
-         */
-        label: string;
-    }>;
-};
-
-/**
- * An action list is a contextual menu that presents a list of available actions related to a specific element or interface area. It allows users to quickly access functions such as editing, sharing, deleting, or navigating to sub-actions. Action Lists are commonly triggered by buttons, icons (e.g., three-dot menus), or right-click interactions, ensuring a clean and efficient UI.
- */
-declare type __VLS_Props_4 = {
-    /**
-     * title displayed in mobile version.
-     */
-    title?: string;
-    /**
-     * An array of objects that allows you to provide all the data needed to generate the content for each item.
-     */
-    items: Array<{
-        /**
-         * The icon displayed for the item from Mozaic-icon-vue.
+         * Unique identifier for the segment.
          */
-        icon?: Component;
+        id?: string;
         /**
-         * The label displayed for the item.
+         * The label displayed for the segment.
          */
         label: string;
-        /**
-         * If `true`, the item will be disabled.
-         */
-        disabled?: boolean;
-        /**
-         * Allows to define the item appearance.
-         */
-        appearance?: 'standard' | 'danger';
-        /**
-         * Add a divider on top of the item.
-         */
-        divider?: boolean;
     }>;
 };
 
 /**
  * A select component allows users to choose a single option from a predefined list within a native dropdown menu. It helps simplify input by displaying only relevant choices, reducing the need for manual text entry. Select components are commonly used in forms, settings, and filters where structured selection is required.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field section](/docs/form-elements-field--docs#select).
  */
-declare type __VLS_Props_40 = {
+declare type __VLS_Props_44 = {
     /**
      * A unique identifier for the select, used to associate the label with the form element.
      */
@@ -1135,10 +1439,147 @@ declare type __VLS_Props_40 = {
     readonly?: boolean;
 };
 
+/**
+ * A sidebar is a vertical navigation component that provides quick access to key sections and functionalities within an application or website. It contains expandable menus, and shortcuts, allowing users to navigate efficiently while keeping the main content area uncluttered. Sidebars can be collapsible or persistent, adapting to different screen sizes and user preferences. They are commonly used in dashboards, content management systems, and productivity tools.
+ */
+declare type __VLS_Props_45 = {
+    /**
+     * the state of the expanded sidebar, bound via v-model.
+     */
+    modelValue: boolean;
+};
+
+/**
+ * SidebarExpandableItem is a component that renders a sidebar item which can either expand to show a nested submenu or display a floating menu when the sidebar is collapsed. It supports optional icons, keyboard navigation, and accessibility attributes, and allows for custom submenu items via slots.
+ */
+declare type __VLS_Props_46 = {
+    /**
+     * The text displayed for the sidebar item in its expanded state.
+     */
+    label: string;
+    /**
+     * The title shown at the top of the floating menu when the sidebar is collapsed.
+     */
+    menuLabel: string;
+    /**
+     * A Vue component used to display an icon alongside the sidebar item.
+     */
+    icon?: Component;
+};
+
+/**
+ * SidebarFooter is a component that renders the footer of a sidebar. It can display a user profile with an optional avatar, title, subtitle, and link, and includes a button to expand or collapse the sidebar.
+ */
+declare type __VLS_Props_47 = {
+    /**
+     * The main text or name displayed in the sidebar footer profile.
+     */
+    title?: string;
+    /**
+     * Secondary text or description displayed under the title in the footer.
+     */
+    subtitle?: string;
+    /**
+     * URL of the avatar image displayed in the footer profile.
+     */
+    avatar?: string;
+    /**
+     * if `true`, hides the sidebar expand/collapse button.
+     */
+    expendable?: boolean;
+    /**
+     * Text to display for the log out button.
+     */
+    logOutLabel?: string;
+};
+
+/**
+ * SidebarHeader is a component that renders the header of a sidebar, displaying a logo and a main title.
+ */
+declare type __VLS_Props_48 = {
+    /**
+     * The main title text displayed in the sidebar header.
+     */
+    title: string;
+    /**
+     * URL of the logo image displayed in the sidebar header.
+     */
+    logo: string;
+};
+
+/**
+ * SidebarNavItem is a component that renders a sidebar navigation item with optional icon support. It handles active, locked, and external states, shows tooltips or floating items when the sidebar is collapsed, and supports click events.
+ */
+declare type __VLS_Props_49 = {
+    tag?: string;
+    /**
+     * The text label displayed for the navigation item.
+     */
+    label: string;
+    /**
+     * Optional icon component displayed alongside the label.
+     */
+    icon?: Component;
+    /**
+     * The URL the navigation item links to.
+     */
+    href?: string;
+    /**
+     * Marks the item as locked. Shows a lock icon and prevents interaction.
+     */
+    locked?: boolean;
+    /**
+     * Indicates the link is external. Opens in a new tab and shows an external link icon.
+     */
+    external?: boolean;
+    /**
+     * Marks the item as active, applying the active styling.
+     */
+    active?: boolean;
+};
+
+/**
+ * An avatar is a graphical representation of a user, entity, or group, commonly displayed as an image, initials, or an icon. It helps identify individuals or accounts in profiles, comments, chat interfaces, and user lists. Avatars can be customized with different styles, sizes, and fallback options (such as initials or placeholders) to ensure consistency and recognition across interfaces. When multiple users are represented, Avatar groups provide a compact way to display them collectively.
+ */
+declare type __VLS_Props_5 = {
+    /**
+     * Allows to define the avatar size.
+     */
+    size?: 's' | 'm' | 'l';
+};
+
+/**
+ * SidebarShortcutItem is a component that renders a sidebar shortcut link with an optional icon and label, providing quick access to a specific URL.
+ */
+declare type __VLS_Props_50 = {
+    /**
+     * The text label displayed for the shortcut item.
+     */
+    label: string;
+    /**
+     * The URL the shortcut item links to.
+     */
+    href: string;
+    /**
+     * Optional icon component displayed alongside the label.
+     */
+    icon?: Component;
+};
+
+/**
+ * SidebarShortcuts is a component that displays a list of sidebar shortcut items. It supports stacked or grid layouts, shows a floating overlay when the sidebar is collapsed, and allows custom shortcut items via slots.
+ */
+declare type __VLS_Props_51 = {
+    /**
+     * Determines the layout of the sidebar shortcuts. When true, the shortcuts are displayed in a vertical stacked list. When false or not provided, the shortcuts are arranged in a grid layout.
+     */
+    stacked?: boolean;
+};
+
 /**
  * A Star rating visually represents a score or evaluation and can be used to display a rating or allow users to rate an item, such as a product or service. It serves two main purposes: collecting user feedback by enabling individuals to express their experience and providing social proof by displaying ratings from other users to assist decision-making. Rating Stars are commonly found in e-commerce, review systems, and feedback interfaces, offering a quick and intuitive way to assess quality or satisfaction.
  */
-declare type __VLS_Props_41 = {
+declare type __VLS_Props_52 = {
     /**
      * Determines whether the rating is interactive or read-only.
      * When true, all user interactions (click, hover, keyboard) are disabled.
@@ -1185,7 +1626,7 @@ declare type __VLS_Props_41 = {
 /**
  * A Status Badge is used to indicate the current status of an element, providing a clear and concise visual cue. The status can change dynamically based on updates, events, or conditions within the system. Status Badges help users quickly identify the state of an item, such as an order status, system health, or process completion. They are often color-coded to enhance readability and recognition.
  */
-declare type __VLS_Props_42 = {
+declare type __VLS_Props_53 = {
     /**
      * Content of the status badge
      */
@@ -1199,7 +1640,7 @@ declare type __VLS_Props_42 = {
 /**
  * A Status dot is a small visual indicator used to represent the state or condition of an element. It is often color-coded to convey different statuses at a glance, such as availability, activity, or urgency. Status Dots are commonly found in user presence indicators, system statuses, or process tracking to provide quick, unobtrusive feedback.
  */
-declare type __VLS_Props_43 = {
+declare type __VLS_Props_54 = {
     /**
      * Allows to define the status dot type.
      */
@@ -1213,7 +1654,7 @@ declare type __VLS_Props_43 = {
 /**
  * A Status Message is a compact component that combines an icon and concise text to communicate system states or user feedback in limited interface space. The icon and message work together as a unified structure to provide clear, immediate understanding of the current status. Status Messages are designed for contexts where space is constrained but clear communication is essential, offering quick recognition through color-coded icons paired with brief, actionable text.
  */
-declare type __VLS_Props_44 = {
+declare type __VLS_Props_55 = {
     /**
      * Allows to define the status message style.
      */
@@ -1227,7 +1668,7 @@ declare type __VLS_Props_44 = {
 /**
  * A Status Notification is used to draw the user’s attention to important information that needs to be acknowledged. It often provides feedback on a process, highlights a status update, or alerts users about an issue. Notifications are typically triggered by user actions or system events and are designed to be easily noticeable while maintaining a non-intrusive experience.
  */
-declare type __VLS_Props_45 = {
+declare type __VLS_Props_56 = {
     /**
      * Title of the status notification.
      */
@@ -1249,7 +1690,7 @@ declare type __VLS_Props_45 = {
 /**
  * A stepper bottom bar is a persistent navigation component used to guide users through a multi-step process. It typically includes “Previous” and “Next” buttons, along with optional actions such as “Cancel” or “Validate”, ensuring a structured flow. This component is commonly used in forms, onboarding sequences, and checkout processes, improving usability by keeping navigation actions always accessible.
  */
-declare type __VLS_Props_46 = {
+declare type __VLS_Props_57 = {
     /**
      * Current step of the stepper compact.
      */
@@ -1283,7 +1724,7 @@ declare type __VLS_Props_46 = {
 /**
  * A stepper is a navigation component that guides users through a sequence of steps in a structured process. It visually represents progress, completed steps, and upcoming steps, helping users understand their position within a workflow. Steppers are commonly used in multi-step forms, onboarding flows, checkout processes, and task completion sequences to improve clarity and reduce cognitive load.
  */
-declare type __VLS_Props_47 = {
+declare type __VLS_Props_58 = {
     /**
      * Current step of the stepper compact.
      */
@@ -1305,15 +1746,23 @@ declare type __VLS_Props_47 = {
 /**
  * A stepper is a navigation component that guides users through a sequence of steps in a structured process. It visually represents progress, completed steps, and upcoming steps, helping users understand their position within a workflow. Steppers are commonly used in multi-step forms, onboarding flows, checkout processes, and task completion sequences to improve clarity and reduce cognitive load.
  */
-declare type __VLS_Props_48 = {
+declare type __VLS_Props_59 = {
     /**
-     * Current step of the stepper compact.
+     * Defines the currently active step.
+     *
+     * - If a `number` is provided, it represents the 1-based position of the step
+     *   in the `steps` array (e.g. `1` for the first step).
+     * - If a `string` is provided, it must match the `id` of one of the steps.
      */
-    currentStep?: number;
+    currentStep?: string | number;
     /**
      * Steps of the stepper inline.
      */
     steps?: Array<{
+        /**
+         * Uniquer identifier for the step.
+         */
+        id?: string;
         /**
          * Label of the step.
          */
@@ -1326,9 +1775,36 @@ declare type __VLS_Props_48 = {
 };
 
 /**
- * Tabs are a navigation component that allows users to switch between different sections within the same context. They help organize content efficiently by displaying only one section at a time, reducing clutter and improving accessibility. Tabs can include icons, labels, and notification badges to provide additional context. They are commonly used in dashboards, product management, and settings interfaces.
+ * A breadcrumb is a navigation help that displays the hierarchical path of the current page within a website or application. It helps users understand their location and allows them to navigate back to previous levels easily. Breadcrumbs improve usability and accessibility, especially in multi-level websites, dashboards, and e-commerce platforms.
  */
-declare type __VLS_Props_49 = {
+declare type __VLS_Props_6 = {
+    /**
+     * Allows to define the breadcrumb appearance.
+     */
+    appearance?: 'standard' | 'inverse';
+    /**
+     * Links of the breadcrumb.
+     */
+    links: Array<{
+        /**
+         * The label displayed for the link.
+         */
+        label: string;
+        /**
+         * URL for the link (for external links or the `to` prop for `router-link`).
+         */
+        href: string;
+        /**
+         * If `true`, the link will be rendered as a `router-link` for internal navigation (Vue Router).
+         */
+        router?: boolean;
+    }>;
+};
+
+/**
+ * Tabs are a navigation component that allows users to switch between different sections within the same context. They help organize content efficiently by displaying only one section at a time, reducing clutter and improving accessibility. Tabs can include icons, labels, and notification badges to provide additional context. They are commonly used in dashboards, product management, and settings interfaces.
+ */
+declare type __VLS_Props_60 = {
     /**
      * A description indicating the purpose of the set of tabs. Useful for improving the accessibility of the component.
      */
@@ -1342,13 +1818,20 @@ declare type __VLS_Props_49 = {
      */
     centered?: boolean;
     /**
-     * The selected tab index, bound via v-model.
+     * Defines the currently active tab.
+     *
+     * - If a `number` is provided, it represents the index of the tab.
+     * - If a `string` is provided, it must match the `id` of one of the tabs.
      */
-    modelValue?: number;
+    modelValue?: string | number;
     /**
      * An array of objects that allows you to provide all the data needed to generate the content for each tab.
      */
     tabs: Array<{
+        /**
+         * Unique identifier for the tab.
+         */
+        id?: string;
         /**
          * The icon displayed for the tab from Mozaic-icon-vue.
          */
@@ -1368,20 +1851,10 @@ declare type __VLS_Props_49 = {
     }>;
 };
 
-/**
- * An avatar is a graphical representation of a user, entity, or group, commonly displayed as an image, initials, or an icon. It helps identify individuals or accounts in profiles, comments, chat interfaces, and user lists. Avatars can be customized with different styles, sizes, and fallback options (such as initials or placeholders) to ensure consistency and recognition across interfaces. When multiple users are represented, Avatar groups provide a compact way to display them collectively.
- */
-declare type __VLS_Props_5 = {
-    /**
-     * Allows to define the avatar size.
-     */
-    size?: 's' | 'm' | 'l';
-};
-
 /**
  * A Tag is a UI element used to filter data, categorize, select or deselect an option. It can appear standalone, in a group, or embedded within other components. Depending on its use, a tag can be interactive (clickable, removable, selectable) or static (serving as a visual indicator).
  */
-declare type __VLS_Props_50 = {
+declare type __VLS_Props_61 = {
     /**
      * Defines the behavior and layout of the tag.
      */
@@ -1423,7 +1896,7 @@ declare type __VLS_Props_50 = {
 /**
  * A text area is an input designed for multi-line text entry, allowing users to input longer content compared to a standard text input. It is commonly used for comments, feedback, descriptions, and messaging. Text areas can be resizable or fixed in height, depending on the context, and often include placeholder text, character limits, and validation messages to guide users.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field section](/docs/form-elements-field--docs#textarea).
  */
-declare type __VLS_Props_51 = {
+declare type __VLS_Props_62 = {
     /**
      * A unique identifier for the textarea, used to associate the label with the form element.
      */
@@ -1469,7 +1942,7 @@ declare type __VLS_Props_51 = {
 /**
  * A text input is a single-line input that allows users to enter and edit short text-based content. It is commonly used for names, email addresses, search queries, and form entries. Text Inputs often include placeholders, validation rules, and assistive text to guide users and ensure accurate data entry.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field section](/docs/form-elements-field--docs#input).
  */
-declare type __VLS_Props_52 = {
+declare type __VLS_Props_63 = {
     /**
      * A unique identifier for the input element, used to associate the label with the form element.
      */
@@ -1514,12 +1987,118 @@ declare type __VLS_Props_52 = {
      * The label text for the clear button.
      */
     clearLabel?: string;
+    /**
+     * Displays additional text inside the component, before the input.
+     */
+    prefix?: string;
+    /**
+     * Displays additional text inside the component, after the input.
+     */
+    suffix?: string;
+};
+
+/**
+ * A tile is a container component used to group related content and actions within a structured layout. It provides a clickable or static area that can display text, images, icons, or interactive elements. Tiles are commonly used to present key information, navigate to detailed views, or trigger specific actions in dashboards, cards, and grid-based layouts. Their adaptable design allows them to accommodate various content types while maintaining a consistent and organized interface.
+ */
+declare type __VLS_Props_64 = {
+    /**
+     * Defines the visual style of the tile.
+     */
+    appearance?: 'primary' | 'secondary' | 'inverse';
+    /**
+     * Adds a border around the tile.
+     */
+    bordered?: boolean;
+};
+
+/**
+ * A tile is a container component used to group related content and actions within a structured layout. It provides a clickable or static area that can display text, images, icons, or interactive elements. Tiles are commonly used to present key information, navigate to detailed views, or trigger specific actions in dashboards, cards, and grid-based layouts. Their adaptable design allows them to accommodate various content types while maintaining a consistent and organized interface.
+ */
+declare type __VLS_Props_65 = {
+    /**
+     * Defines the visual style of the tile.
+     */
+    appearance?: 'primary' | 'secondary' | 'inverse';
+    /**
+     * Adds a border around the tile.
+     */
+    bordered?: boolean;
+    /**
+     * If set, the tile becomes an external link (`<a>`).
+     * Used to navigate to a full URL.
+     */
+    href?: string;
+    /**
+     * If set, the tile becomes an internal link (Vue Router route).
+     * Used for navigation within the app.
+     */
+    to?: string;
+    /**
+     * Where to open the link.
+     */
+    target?: '_self' | '_blank' | '_parent' | '_top';
+    /**
+     * Position of the icon relative to the content.
+     */
+    iconPosition?: 'bottom' | 'right';
+};
+
+/**
+ * A tile is a container component used to group related content and actions within a structured layout. It provides a clickable or static area that can display text, images, icons, or interactive elements. Tiles are commonly used to present key information, navigate to detailed views, or trigger specific actions in dashboards, cards, and grid-based layouts. Their adaptable design allows them to accommodate various content types while maintaining a consistent and organized interface.
+ */
+declare type __VLS_Props_66 = {
+    /**
+     * Defines the visual style of the tile.
+     */
+    appearance?: 'primary' | 'secondary';
+    /**
+     * Adds a border around the tile.
+     */
+    bordered?: boolean;
+    /**
+     * Determines how the tile expansion is triggered.
+     */
+    trigger?: 'container' | 'icon' | 'button';
+    /**
+     * Label for the action button (only used when trigger is 'button').
+     */
+    label?: string;
+};
+
+/**
+ * A tile is a container component used to group related content and actions within a structured layout. It provides a clickable or static area that can display text, images, icons, or interactive elements. Tiles are commonly used to present key information, navigate to detailed views, or trigger specific actions in dashboards, cards, and grid-based layouts. Their adaptable design allows them to accommodate various content types while maintaining a consistent and organized interface.
+ */
+declare type __VLS_Props_67 = {
+    /**
+     * The current value of the tile (selected or not).
+     */
+    modelValue: boolean;
+    /**
+     * Adds a border around the tile.
+     */
+    bordered?: boolean;
+    /**
+     * Type of input used for selection.
+     */
+    inputType?: 'checkbox' | 'radio';
+    /**
+     * Position of the input relative to the tile content.
+     */
+    inputPosition?: 'left' | 'right';
+    /**
+     * Vertical alignment of the input.
+     */
+    centered?: boolean;
+    /**
+     * If `true`, hides the input and makes the whole tile selectable.
+     */
+    hideInput?: boolean;
 };
 
 /**
  * A toaster is a temporary notification that appears briefly on the screen to provide feedback or updates without interrupting the user’s workflow. It is commonly used for success messages, warnings, errors, or informational updates. Toasters can disappear automatically after a few seconds, be dismissed manually via a close button, or be removed when the user performs a relevant action. They typically include an icon, a short message, and an optional close button for better usability.
  */
-declare type __VLS_Props_53 = {
+declare type __VLS_Props_68 = {
     /**
      * If `true`, display the Toaster.
      */
@@ -1553,7 +2132,7 @@ declare type __VLS_Props_53 = {
 /**
  * A toggle is a switch component that allows users to enable or disable a setting, representing a binary state such as on/off or active/inactive. It provides a quick and intuitive way to control preferences or system settings. Toggles are commonly used in settings menus, dark mode switches, and feature activations, offering an alternative to checkboxes for immediate visual feedback.
  */
-declare type __VLS_Props_54 = {
+declare type __VLS_Props_69 = {
     /**
      * A unique identifier for the toggle, used to associate the label with the form element.
      */
@@ -1580,10 +2159,25 @@ declare type __VLS_Props_54 = {
     disabled?: boolean;
 };
 
+declare type __VLS_Props_7 = {
+    /**
+     * Specifies the key of the currently selected menu item. It allows the component to highlight or style the corresponding item to indicate it is selected or currently in use.
+     */
+    modelValue?: number;
+    /**
+     * Defines the menu items, each of which can include an icon and act as a button, link, or router-link.
+     */
+    items: MenuItem[];
+    /**
+     * When enabled, adds a visible border around the wrapper to highlight or separate its content.
+     */
+    outlined?: boolean;
+};
+
 /**
  * A toggle is a switch component that allows users to enable or disable a setting, representing a binary state such as on/off or active/inactive. It provides a quick and intuitive way to control preferences or system settings. Toggles are commonly used in settings menus, dark mode switches, and feature activations, offering an alternative to checkboxes for immediate visual feedback.<br><br> To put a label, requierement text, help text or to apply a valid or invalid message, the examples are available in the [Field Group section](/docs/form-elements-field-group--docs#toggle-group).
  */
-declare type __VLS_Props_55 = {
+declare type __VLS_Props_70 = {
     /**
      * The name attribute for the toggle element, typically used for form submission.
      */
@@ -1612,7 +2206,7 @@ declare type __VLS_Props_55 = {
 /**
  * A tooltip is a small, contextual message that appears when users hover over, focus on, or tap an element, providing additional information or guidance without cluttering the interface. Tooltips are commonly used to explain icons, abbreviations, or complex actions. They typically disappear automatically when the user moves away from the trigger element.
  */
-declare type __VLS_Props_56 = {
+declare type __VLS_Props_71 = {
     /**
      * A unique identifier for the tooltip, used to describe the tooltip.
      */
@@ -1629,48 +2223,10 @@ declare type __VLS_Props_56 = {
      * If `true`, the tooltip display a pointer.
      */
     pointer?: boolean;
-};
-
-/**
- * A breadcrumb is a navigation help that displays the hierarchical path of the current page within a website or application. It helps users understand their location and allows them to navigate back to previous levels easily. Breadcrumbs improve usability and accessibility, especially in multi-level websites, dashboards, and e-commerce platforms.
- */
-declare type __VLS_Props_6 = {
-    /**
-     * Allows to define the breadcrumb appearance.
-     */
-    appearance?: 'standard' | 'inverse';
-    /**
-     * Links of the breadcrumb.
-     */
-    links: Array<{
-        /**
-         * The label displayed for the link.
-         */
-        label: string;
-        /**
-         * URL for the link (for external links or the `to` prop for `router-link`).
-         */
-        href: string;
-        /**
-         * If `true`, the link will be rendered as a `router-link` for internal navigation (Vue Router).
-         */
-        router?: boolean;
-    }>;
-};
-
-declare type __VLS_Props_7 = {
-    /**
-     * Specifies the key of the currently selected menu item. It allows the component to highlight or style the corresponding item to indicate it is selected or currently in use.
-     */
-    modelValue?: number;
-    /**
-     * Defines the menu items, each of which can include an icon and act as a button, link, or router-link.
-     */
-    items: MenuItem[];
     /**
-     * When enabled, adds a visible border around the wrapper to highlight or separate its content.
+     * Standalone tooltip
      */
-    outlined?: boolean;
+    standalone?: boolean;
 };
 
 /**
@@ -1731,7 +2287,7 @@ declare type __VLS_Props_9 = {
 
 declare type __VLS_PublicProps = {
     modelValue: number;
-} & __VLS_Props_41;
+} & __VLS_Props_52;
 
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -1751,6 +2307,23 @@ declare function __VLS_template(): {
 };
 
 declare function __VLS_template_10(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert the content who need a vertical divider
+         */
+        default?: VNode;
+    }> & {
+        /**
+         * Use this slot to insert the content who need a vertical divider
+         */
+        default?: VNode;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_11(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -1777,7 +2350,7 @@ declare function __VLS_template_10(): {
     rootEl: any;
 };
 
-declare function __VLS_template_11(): {
+declare function __VLS_template_12(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -1794,7 +2367,7 @@ declare function __VLS_template_11(): {
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_12(): {
+declare function __VLS_template_13(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -1811,7 +2384,7 @@ declare function __VLS_template_12(): {
     rootEl: HTMLFieldSetElement;
 };
 
-declare function __VLS_template_13(): {
+declare function __VLS_template_14(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -1854,41 +2427,434 @@ declare function __VLS_template_13(): {
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_14(): {
+declare function __VLS_template_15(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Slot for customizing the file name display.
+         * Receives `{ file: { name: string; size?: number;} }` as slot props.
+         */
+        name: VNode;
+        /**
+         * Slot for displaying additional file information.
+         */
+        information: VNode;
+        /**
+         * Slot for providing a custom error message display.
+         */
+        errorMessage: VNode;
+    }> & {
+        /**
+         * Slot for customizing the file name display.
+         * Receives `{ file: { name: string; size?: number;} }` as slot props.
+         */
+        name: VNode;
+        /**
+         * Slot for displaying additional file information.
+         */
+        information: VNode;
+        /**
+         * Slot for providing a custom error message display.
+         */
+        errorMessage: VNode;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_16(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
          * Use this slot to insert an icon for the Button.
          */
-        icon: VNode;
+        icon: VNode;
+    }> & {
+        /**
+         * Use this slot to insert an icon for the Button.
+         */
+        icon: VNode;
+    };
+    refs: {};
+    rootEl: HTMLButtonElement;
+};
+
+declare function __VLS_template_17(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert the textual content of the Link.
+         */
+        default: string;
+        /**
+         * Use this slot to insert an icon for the Link.
+         */
+        icon?: VNode;
+    }> & {
+        /**
+         * Use this slot to insert the textual content of the Link.
+         */
+        default: string;
+        /**
+         * Use this slot to insert an icon for the Link.
+         */
+        icon?: VNode;
+    };
+    refs: {};
+    rootEl: any;
+};
+
+declare function __VLS_template_18(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert an icon next to the title of the modal.
+         */
+        icon?: VNode;
+        /**
+         * Use this slot to insert the content of the modal.
+         */
+        default?: VNode;
+        /**
+         * Use this slot to insert a link in the footer.
+         */
+        link?: VNode;
+        /**
+         * Use this slot to insert buttons in the footer.
+         */
+        footer?: VNode;
+    }> & {
+        /**
+         * Use this slot to insert an icon next to the title of the modal.
+         */
+        icon?: VNode;
+        /**
+         * Use this slot to insert the content of the modal.
+         */
+        default?: VNode;
+        /**
+         * Use this slot to insert a link in the footer.
+         */
+        link?: VNode;
+        /**
+         * Use this slot to insert buttons in the footer.
+         */
+        footer?: VNode;
+    };
+    refs: {};
+    rootEl: any;
+};
+
+declare function __VLS_template_19(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert a centered content inside the overlay.
+         */
+        default?: VNode;
+    }> & {
+        /**
+         * Use this slot to insert a centered content inside the overlay.
+         */
+        default?: VNode;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_2(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to display custom content.
+         */
+        default: VNode;
+    }> & {
+        /**
+         * Use this slot to display custom content.
+         */
+        default: VNode;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_20(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert action items in the top content.
+         */
+        actions?: VNode;
+        /**
+         * Use this slot to insert any content below the Page Header top content.
+         */
+        content?: VNode;
+        /**
+         * Use this slot to insert a tab in the header.
+         */
+        tabs?: VNode;
+    }> & {
+        /**
+         * Use this slot to insert action items in the top content.
+         */
+        actions?: VNode;
+        /**
+         * Use this slot to insert any content below the Page Header top content.
+         */
+        content?: VNode;
+        /**
+         * Use this slot to insert a tab in the header.
+         */
+        tabs?: VNode;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_21(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Main content of the popover.
+         */
+        default?: () => VNode[];
+        /**
+         * Activator element that triggers the popover.
+         * Must contain a single <button> or element with [type="button"] attribute.
+         * Receives the popover `id` as a slot prop and must bind it
+         * to the `popovertarget` attribute.
+         */
+        activator?: (props: {
+            id: string;
+        }) => VNode[];
+        /**
+         * Use this slot to insert buttons or link in the footer.
+         */
+        footer?: VNode;
+    }> & {
+        /**
+         * Main content of the popover.
+         */
+        default?: () => VNode[];
+        /**
+         * Activator element that triggers the popover.
+         * Must contain a single <button> or element with [type="button"] attribute.
+         * Receives the popover `id` as a slot prop and must bind it
+         * to the `popovertarget` attribute.
+         */
+        activator?: (props: {
+            id: string;
+        }) => VNode[];
+        /**
+         * Use this slot to insert buttons or link in the footer.
+         */
+        footer?: VNode;
+    };
+    refs: {};
+    rootEl: any;
+};
+
+declare function __VLS_template_22(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Slot for the sidebar header. Should contain an `MSidebarHeader` component.
+         */
+        header: VNode[];
+        /**
+         * Slot for sidebar shortcuts. Should contain an `MSidebarShortcuts` component
+         * with one or more `MSidebarShortcutItem` components inside.
+         */
+        shortcuts: VNode[];
+        /**
+         * Slot for the main navigation items. Should contain one or more `MSidebarNavItem` components.
+         */
+        nav: VNode[];
+        /**
+         * Slot for the sidebar footer. Should contain an `MSidebarFooter` component.
+         */
+        footer: VNode[];
+    }> & {
+        /**
+         * Slot for the sidebar header. Should contain an `MSidebarHeader` component.
+         */
+        header: VNode[];
+        /**
+         * Slot for sidebar shortcuts. Should contain an `MSidebarShortcuts` component
+         * with one or more `MSidebarShortcutItem` components inside.
+         */
+        shortcuts: VNode[];
+        /**
+         * Slot for the main navigation items. Should contain one or more `MSidebarNavItem` components.
+         */
+        nav: VNode[];
+        /**
+         * Slot for the sidebar footer. Should contain an `MSidebarFooter` component.
+         */
+        footer: VNode[];
+    };
+    refs: {};
+    rootEl: HTMLElement;
+};
+
+declare function __VLS_template_23(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Contains one or more MSidebarNavItem components used to render the submenu items.
+         */
+        default: VNode[];
+    }> & {
+        /**
+         * Contains one or more MSidebarNavItem components used to render the submenu items.
+         */
+        default: VNode[];
+    };
+    refs: {
+        trigger: HTMLButtonElement;
+        listbox: HTMLDivElement;
+    };
+    rootEl: any;
+};
+
+declare function __VLS_template_24(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Contains one or more MSidebarNavItem components used to render the profile items.
+         */
+        default: VNode[];
+    }> & {
+        /**
+         * Contains one or more MSidebarNavItem components used to render the profile items.
+         */
+        default: VNode[];
+    };
+    refs: {
+        listbox: ({
+            $: ComponentInternalInstance;
+            $data: {};
+            $props: {
+                readonly expanded: boolean;
+                readonly logOutLabel: string;
+                readonly onListboxKeydown: (event: KeyboardEvent) => void;
+                readonly hideFloatingItem: () => void;
+                readonly "onLog-out"?: (() => any) | undefined;
+            } & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            } & {
+                container: HTMLDivElement;
+            };
+            $slots: Readonly<{
+                [name: string]: Slot<any> | undefined;
+            }>;
+            $root: ComponentPublicInstance | null;
+            $parent: ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: "log-out") => void;
+            $el: HTMLDivElement;
+            $options: ComponentOptionsBase<Readonly<{
+            expanded: boolean;
+            logOutLabel: string;
+            onListboxKeydown: (event: KeyboardEvent) => void;
+            hideFloatingItem: () => void;
+            }> & Readonly<{
+            "onLog-out"?: (() => any) | undefined;
+            }>, {
+            container: Readonly<ShallowRef<HTMLDivElement | null>>;
+            }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+            "log-out": () => any;
+            }, string, {}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+                renderTriggered?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, OnCleanup]) => any : (...args: [any, any, OnCleanup]) => any, options?: WatchOptions): WatchStopHandle;
+        } & Readonly<{}> & Omit<Readonly<{
+            expanded: boolean;
+            logOutLabel: string;
+            onListboxKeydown: (event: KeyboardEvent) => void;
+            hideFloatingItem: () => void;
+        }> & Readonly<{
+            "onLog-out"?: (() => any) | undefined;
+        }>, "container"> & ShallowUnwrapRef<    {
+        container: Readonly<ShallowRef<HTMLDivElement | null>>;
+        }> & {} & ComponentCustomProperties & {} & {
+            $slots: {
+                default?(_: {}): any;
+            };
+        }) | null;
+        trigger: HTMLButtonElement;
+    };
+    rootEl: HTMLElement;
+};
+
+declare function __VLS_template_25(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Slot for sidebar shortcut items. Should contain one or more `MSidebarShortcutItem` components.
+         */
+        default: VNode[];
+    }> & {
+        /**
+         * Slot for sidebar shortcut items. Should contain one or more `MSidebarShortcutItem` components.
+         */
+        default: VNode[];
+    };
+    refs: {
+        trigger: HTMLButtonElement;
+        listbox: HTMLDivElement;
+    };
+    rootEl: any;
+};
+
+declare function __VLS_template_26(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Use this slot to insert a button or a link in the footer
+         */
+        footer?: VNode;
     }> & {
         /**
-         * Use this slot to insert an icon for the Button.
+         * Use this slot to insert a button or a link in the footer
          */
-        icon: VNode;
+        footer?: VNode;
     };
     refs: {};
-    rootEl: HTMLButtonElement;
+    rootEl: HTMLElement;
 };
 
-declare function __VLS_template_15(): {
+declare function __VLS_template_27(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to insert the textual content of the Link.
-         */
-        default: string;
-        /**
-         * Use this slot to insert an icon for the Link.
+         * Use this slot to insert an icon in the input.
          */
         icon?: VNode;
     }> & {
         /**
-         * Use this slot to insert the textual content of the Link.
-         */
-        default: string;
-        /**
-         * Use this slot to insert an icon for the Link.
+         * Use this slot to insert an icon in the input.
          */
         icon?: VNode;
     };
@@ -1896,116 +2862,140 @@ declare function __VLS_template_15(): {
     rootEl: any;
 };
 
-declare function __VLS_template_16(): {
+declare function __VLS_template_28(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to insert an icon next to the title of the modal.
-         */
-        icon?: VNode;
-        /**
-         * Use this slot to insert the content of the modal.
+         * Default slot for the main content of the tile.
          */
-        default?: VNode;
+        default?: VNode[];
         /**
-         * Use this slot to insert a link in the footer.
+         * Named slot for additional content shown below the main content.
          */
-        link?: VNode;
+        details?: VNode[];
         /**
-         * Use this slot to insert buttons in the footer.
+         * Named slot for action element, such as a button or link.
          */
-        footer?: VNode;
+        action?: VNode[];
     }> & {
         /**
-         * Use this slot to insert an icon next to the title of the modal.
-         */
-        icon?: VNode;
-        /**
-         * Use this slot to insert the content of the modal.
+         * Default slot for the main content of the tile.
          */
-        default?: VNode;
+        default?: VNode[];
         /**
-         * Use this slot to insert a link in the footer.
+         * Named slot for additional content shown below the main content.
          */
-        link?: VNode;
+        details?: VNode[];
         /**
-         * Use this slot to insert buttons in the footer.
+         * Named slot for action element, such as a button or link.
          */
-        footer?: VNode;
+        action?: VNode[];
     };
     refs: {};
-    rootEl: any;
+    rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_17(): {
+declare function __VLS_template_29(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to insert a centered content inside the overlay.
+         * Default slot for the main content of the tile.
          */
-        default?: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for the action icon.
+         */
+        icon?: VNode[];
     }> & {
         /**
-         * Use this slot to insert a centered content inside the overlay.
+         * Default slot for the main content of the tile.
          */
-        default?: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for the action icon.
+         */
+        icon?: VNode[];
     };
     refs: {};
-    rootEl: HTMLDivElement;
+    rootEl: any;
 };
 
-declare function __VLS_template_18(): {
+declare function __VLS_template_3(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to insert a button or a link in the footer
+         * The content displayed left side of the action bottom bar (e.g. StatusNotification or any element).
          */
-        footer?: VNode;
+        left: VNode[];
+        /**
+         * Use this slot to insert buttons of the action bottom bar.
+         */
+        right?: VNode[];
     }> & {
         /**
-         * Use this slot to insert a button or a link in the footer
+         * The content displayed left side of the action bottom bar (e.g. StatusNotification or any element).
          */
-        footer?: VNode;
+        left: VNode[];
+        /**
+         * Use this slot to insert buttons of the action bottom bar.
+         */
+        right?: VNode[];
     };
     refs: {};
-    rootEl: HTMLElement;
+    rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_19(): {
+declare function __VLS_template_30(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to insert an icon in the input.
+         * Default slot for the main content of the tile.
          */
-        icon?: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for expandable content shown when the tile is opened.
+         */
+        details?: VNode[];
     }> & {
         /**
-         * Use this slot to insert an icon in the input.
+         * Default slot for the main content of the tile.
          */
-        icon?: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for expandable content shown when the tile is opened.
+         */
+        details?: VNode[];
     };
     refs: {};
-    rootEl: any;
+    rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_2(): {
+declare function __VLS_template_31(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * Use this slot to display custom content.
+         * Default slot for the main content of the tile.
          */
-        default: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for additional content shown below the main content.
+         */
+        details?: VNode[];
     }> & {
         /**
-         * Use this slot to display custom content.
+         * Default slot for the main content of the tile.
          */
-        default: VNode;
+        default?: VNode[];
+        /**
+         * Named slot for additional content shown below the main content.
+         */
+        details?: VNode[];
     };
     refs: {};
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_20(): {
+declare function __VLS_template_32(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2022,7 +3012,7 @@ declare function __VLS_template_20(): {
     rootEl: HTMLElement;
 };
 
-declare function __VLS_template_21(): {
+declare function __VLS_template_33(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2039,32 +3029,26 @@ declare function __VLS_template_21(): {
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_3(): {
+declare function __VLS_template_4(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
-         * The content displayed left side of the action bottom bar (e.g. StatusNotification or any element).
-         */
-        left: VNode[];
-        /**
-         * Use this slot to insert buttons of the action bottom bar.
+         * Activator element that triggers the listbox.
          */
-        right?: VNode[];
+        activator?: VNode[];
     }> & {
         /**
-         * The content displayed left side of the action bottom bar (e.g. StatusNotification or any element).
-         */
-        left: VNode[];
-        /**
-         * Use this slot to insert buttons of the action bottom bar.
+         * Activator element that triggers the listbox.
          */
-        right?: VNode[];
+        activator?: VNode[];
     };
-    refs: {};
-    rootEl: HTMLDivElement;
+    refs: {
+        popover: HTMLDivElement;
+    };
+    rootEl: any;
 };
 
-declare function __VLS_template_4(): {
+declare function __VLS_template_5(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2081,7 +3065,7 @@ declare function __VLS_template_4(): {
     rootEl: HTMLSpanElement;
 };
 
-declare function __VLS_template_5(): {
+declare function __VLS_template_6(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2106,7 +3090,7 @@ declare function __VLS_template_5(): {
     rootEl: HTMLButtonElement;
 };
 
-declare function __VLS_template_6(): {
+declare function __VLS_template_7(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2131,7 +3115,7 @@ declare function __VLS_template_6(): {
     rootEl: HTMLElement;
 };
 
-declare function __VLS_template_7(): {
+declare function __VLS_template_8(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2158,7 +3142,7 @@ declare function __VLS_template_7(): {
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_8(): {
+declare function __VLS_template_9(): {
     attrs: Partial<{}>;
     slots: Readonly<{
         /**
@@ -2175,23 +3159,6 @@ declare function __VLS_template_8(): {
     rootEl: HTMLDivElement;
 };
 
-declare function __VLS_template_9(): {
-    attrs: Partial<{}>;
-    slots: Readonly<{
-        /**
-         * Use this slot to insert the content who need a vertical divider
-         */
-        default?: VNode;
-    }> & {
-        /**
-         * Use this slot to insert the content who need a vertical divider
-         */
-        default?: VNode;
-    };
-    refs: {};
-    rootEl: HTMLDivElement;
-};
-
 declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 
 declare type __VLS_TemplateResult_10 = ReturnType<typeof __VLS_template_10>;
@@ -2220,8 +3187,32 @@ declare type __VLS_TemplateResult_20 = ReturnType<typeof __VLS_template_20>;
 
 declare type __VLS_TemplateResult_21 = ReturnType<typeof __VLS_template_21>;
 
+declare type __VLS_TemplateResult_22 = ReturnType<typeof __VLS_template_22>;
+
+declare type __VLS_TemplateResult_23 = ReturnType<typeof __VLS_template_23>;
+
+declare type __VLS_TemplateResult_24 = ReturnType<typeof __VLS_template_24>;
+
+declare type __VLS_TemplateResult_25 = ReturnType<typeof __VLS_template_25>;
+
+declare type __VLS_TemplateResult_26 = ReturnType<typeof __VLS_template_26>;
+
+declare type __VLS_TemplateResult_27 = ReturnType<typeof __VLS_template_27>;
+
+declare type __VLS_TemplateResult_28 = ReturnType<typeof __VLS_template_28>;
+
+declare type __VLS_TemplateResult_29 = ReturnType<typeof __VLS_template_29>;
+
 declare type __VLS_TemplateResult_3 = ReturnType<typeof __VLS_template_3>;
 
+declare type __VLS_TemplateResult_30 = ReturnType<typeof __VLS_template_30>;
+
+declare type __VLS_TemplateResult_31 = ReturnType<typeof __VLS_template_31>;
+
+declare type __VLS_TemplateResult_32 = ReturnType<typeof __VLS_template_32>;
+
+declare type __VLS_TemplateResult_33 = ReturnType<typeof __VLS_template_33>;
+
 declare type __VLS_TemplateResult_4 = ReturnType<typeof __VLS_template_4>;
 
 declare type __VLS_TemplateResult_5 = ReturnType<typeof __VLS_template_5>;
@@ -2318,12 +3309,84 @@ declare type __VLS_WithTemplateSlots_21<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_22<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_23<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_24<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_25<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_26<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_27<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_28<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_29<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare type __VLS_WithTemplateSlots_3<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
 
+declare type __VLS_WithTemplateSlots_30<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_31<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_32<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_33<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare type __VLS_WithTemplateSlots_4<T, S> = T & {
     new (): {
         $slots: S;
@@ -2449,9 +3512,9 @@ export declare const MAccordionListItem: __VLS_WithTemplateSlots_2<typeof __VLS_
 
 export declare const MActionBottomBar: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
 
-export declare const MActionListbox: DefineComponent<__VLS_Props_4, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_4> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+export declare const MActionListbox: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
 
-export declare const MAvatar: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
+export declare const MAvatar: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
 
 export declare const MBreadcrumb: DefineComponent<__VLS_Props_6, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_6> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
@@ -2461,11 +3524,11 @@ export declare const MBuiltInMenu: DefineComponent<__VLS_Props_7, {}, {}, {}, {}
 "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-export declare const MButton: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
+export declare const MButton: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
 
-export declare const MCallout: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
+export declare const MCallout: __VLS_WithTemplateSlots_7<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
 
-export declare const MCarousel: __VLS_WithTemplateSlots_7<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
+export declare const MCarousel: __VLS_WithTemplateSlots_8<typeof __VLS_component_8, __VLS_TemplateResult_8["slots"]>;
 
 export declare const MCheckbox: DefineComponent<__VLS_Props_11, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: boolean) => any;
@@ -2490,7 +3553,7 @@ type: "percentage" | "content";
 value: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MContainer: __VLS_WithTemplateSlots_8<typeof __VLS_component_8, __VLS_TemplateResult_8["slots"]>;
+export declare const MContainer: __VLS_WithTemplateSlots_9<typeof __VLS_component_9, __VLS_TemplateResult_9["slots"]>;
 
 export declare const MDatepicker: DefineComponent<__VLS_Props_16, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string | number) => any;
@@ -2501,9 +3564,9 @@ size: "s" | "m";
 clearLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MDivider: __VLS_WithTemplateSlots_9<typeof __VLS_component_9, __VLS_TemplateResult_9["slots"]>;
+export declare const MDivider: __VLS_WithTemplateSlots_10<typeof __VLS_component_10, __VLS_TemplateResult_10["slots"]>;
 
-export declare const MDrawer: __VLS_WithTemplateSlots_10<typeof __VLS_component_10, __VLS_TemplateResult_10["slots"]>;
+export declare const MDrawer: __VLS_WithTemplateSlots_11<typeof __VLS_component_11, __VLS_TemplateResult_11["slots"]>;
 
 /**
  * A built-in menu is a structured list of navigational or interactive options, typically displayed as a vertical stack. It allows users to browse categories, access settings, or navigate through different sections of an interface.
@@ -2516,56 +3579,71 @@ declare type MenuItem = {
     target?: '_self' | '_blank' | '_parent' | '_top';
 };
 
-export declare const MField: __VLS_WithTemplateSlots_11<typeof __VLS_component_11, __VLS_TemplateResult_11["slots"]>;
+export declare const MField: __VLS_WithTemplateSlots_12<typeof __VLS_component_12, __VLS_TemplateResult_12["slots"]>;
+
+export declare const MFieldGroup: __VLS_WithTemplateSlots_13<typeof __VLS_component_13, __VLS_TemplateResult_13["slots"]>;
 
-export declare const MFieldGroup: __VLS_WithTemplateSlots_12<typeof __VLS_component_12, __VLS_TemplateResult_12["slots"]>;
+export declare const MFileUploader: __VLS_WithTemplateSlots_14<typeof __VLS_component_14, __VLS_TemplateResult_14["slots"]>;
 
-export declare const MFileUploader: __VLS_WithTemplateSlots_13<typeof __VLS_component_13, __VLS_TemplateResult_13["slots"]>;
+export declare const MFileUploaderItem: __VLS_WithTemplateSlots_15<typeof __VLS_component_15, __VLS_TemplateResult_15["slots"]>;
 
-export declare const MFlag: DefineComponent<__VLS_Props_21, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_21> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+export declare const MFlag: DefineComponent<__VLS_Props_22, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_22> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MIconButton: __VLS_WithTemplateSlots_14<typeof __VLS_component_14, __VLS_TemplateResult_14["slots"]>;
+export declare const MIconButton: __VLS_WithTemplateSlots_16<typeof __VLS_component_16, __VLS_TemplateResult_16["slots"]>;
 
-export declare const MKpiItem: DefineComponent<__VLS_Props_23, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_23> & Readonly<{}>, {
+export declare const MKpiItem: DefineComponent<__VLS_Props_24, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_24> & Readonly<{}>, {
 size: "s" | "m" | "l";
 status: "info" | "warning" | "error" | "success" | "neutral";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MLinearProgressbarBuffer: DefineComponent<__VLS_Props_24, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_24> & Readonly<{}>, {
+export declare const MLinearProgressbarBuffer: DefineComponent<__VLS_Props_25, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_25> & Readonly<{}>, {
 value: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MLinearProgressbarPercentage: DefineComponent<__VLS_Props_25, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_25> & Readonly<{}>, {
+export declare const MLinearProgressbarPercentage: DefineComponent<__VLS_Props_26, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_26> & Readonly<{}>, {
 value: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MLink: __VLS_WithTemplateSlots_15<typeof __VLS_component_15, __VLS_TemplateResult_15["slots"]>;
+export declare const MLink: __VLS_WithTemplateSlots_17<typeof __VLS_component_17, __VLS_TemplateResult_17["slots"]>;
 
-export declare const MLoader: DefineComponent<__VLS_Props_27, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_27> & Readonly<{}>, {
+export declare const MLoader: DefineComponent<__VLS_Props_28, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_28> & Readonly<{}>, {
 appearance: "standard" | "accent" | "inverse";
 size: "xs" | "s" | "m" | "l";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MLoadingOverlay: DefineComponent<__VLS_Props_28, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_28> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export declare const MLoadingOverlay: DefineComponent<__VLS_Props_29, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_29> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MModal: __VLS_WithTemplateSlots_16<typeof __VLS_component_16, __VLS_TemplateResult_16["slots"]>;
+export declare const MModal: __VLS_WithTemplateSlots_18<typeof __VLS_component_18, __VLS_TemplateResult_18["slots"]>;
 
-export declare const MNumberBadge: DefineComponent<__VLS_Props_30, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_30> & Readonly<{}>, {
+export declare const MNavigationIndicator: DefineComponent<__VLS_Props_31, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value: number) => any;
+action: () => any;
+}, string, PublicProps, Readonly<__VLS_Props_31> & Readonly<{
+"onUpdate:modelValue"?: ((value: number) => any) | undefined;
+onAction?: (() => any) | undefined;
+}>, {
+action: "pause" | "resume";
+player: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+export declare const MNumberBadge: DefineComponent<__VLS_Props_32, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_32> & Readonly<{}>, {
 appearance: "danger" | "accent" | "inverse" | "standard";
 size: "s" | "m";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>;
 
-export declare const MOverlay: __VLS_WithTemplateSlots_17<typeof __VLS_component_17, __VLS_TemplateResult_17["slots"]>;
+export declare const MOverlay: __VLS_WithTemplateSlots_19<typeof __VLS_component_19, __VLS_TemplateResult_19["slots"]>;
+
+export declare const MPageHeader: __VLS_WithTemplateSlots_20<typeof __VLS_component_20, __VLS_TemplateResult_20["slots"]>;
 
-export declare const MPagination: DefineComponent<__VLS_Props_32, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MPagination: DefineComponent<__VLS_Props_35, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_32> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_35> & Readonly<{
 "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-export declare const MPasswordInput: DefineComponent<__VLS_Props_33, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MPasswordInput: DefineComponent<__VLS_Props_36, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string | number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_33> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_36> & Readonly<{
 "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
 clearLabel: string;
@@ -2658,10 +3736,10 @@ icon?: VNode;
 }) | null;
 }, any>;
 
-export declare const MPhoneNumber: DefineComponent<__VLS_Props_34, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+export declare const MPhoneNumber: DefineComponent<__VLS_Props_37, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (value: string) => any;
 valid: (isValid: boolean) => any;
-}, string, PublicProps, Readonly<__VLS_Props_34> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_37> & Readonly<{
 "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 onValid?: ((isValid: boolean) => any) | undefined;
 }>, {
@@ -2673,17 +3751,19 @@ flag: boolean;
 locale: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MPincode: DefineComponent<__VLS_Props_35, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MPincode: DefineComponent<__VLS_Props_38, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string) => any;
-}, string, PublicProps, Readonly<__VLS_Props_35> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_38> & Readonly<{
 "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
 length: 4 | 5 | 6;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MQuantitySelector: DefineComponent<__VLS_Props_36, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MPopover: __VLS_WithTemplateSlots_21<typeof __VLS_component_21, __VLS_TemplateResult_21["slots"]>;
+
+export declare const MQuantitySelector: DefineComponent<__VLS_Props_40, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_36> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_40> & Readonly<{
 "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {
 modelValue: number;
@@ -2696,35 +3776,56 @@ incrementlabel: string;
 decrementLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MRadio: DefineComponent<__VLS_Props_37, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MRadio: DefineComponent<__VLS_Props_41, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: boolean) => any;
-}, string, PublicProps, Readonly<__VLS_Props_37> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_41> & Readonly<{
 "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MRadioGroup: DefineComponent<__VLS_Props_38, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MRadioGroup: DefineComponent<__VLS_Props_42, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string) => any;
-}, string, PublicProps, Readonly<__VLS_Props_38> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_42> & Readonly<{
 "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MSegmentedControl: DefineComponent<__VLS_Props_39, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-"update:modelValue": (value: number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_39> & Readonly<{
-"onUpdate:modelValue"?: ((value: number) => any) | undefined;
+export declare const MSegmentedControl: DefineComponent<__VLS_Props_43, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value?: string | number | undefined) => any;
+}, string, PublicProps, Readonly<__VLS_Props_43> & Readonly<{
+"onUpdate:modelValue"?: ((value?: string | number | undefined) => any) | undefined;
 }>, {
-modelValue: number;
+modelValue: string | number;
 size: "s" | "m";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MSelect: DefineComponent<__VLS_Props_40, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MSelect: DefineComponent<__VLS_Props_44, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string | number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_40> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_44> & Readonly<{
 "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
 size: "s" | "m";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
+export declare const MSidebar: __VLS_WithTemplateSlots_22<typeof __VLS_component_22, __VLS_TemplateResult_22["slots"]>;
+
+export declare const MSidebarExpandableItem: __VLS_WithTemplateSlots_23<typeof __VLS_component_23, __VLS_TemplateResult_23["slots"]>;
+
+export declare const MSidebarFooter: __VLS_WithTemplateSlots_24<typeof __VLS_component_24, __VLS_TemplateResult_24["slots"]>;
+
+export declare const MSidebarHeader: DefineComponent<__VLS_Props_48, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_48> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
+
+export declare const MSidebarNavItem: DefineComponent<__VLS_Props_49, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+click: (value: MouseEvent) => any;
+}, string, PublicProps, Readonly<__VLS_Props_49> & Readonly<{
+onClick?: ((value: MouseEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+trigger: unknown;
+tooltip: HTMLDivElement;
+}, any>;
+
+export declare const MSidebarShortcutItem: DefineComponent<__VLS_Props_50, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_50> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLLIElement>;
+
+export declare const MSidebarShortcuts: __VLS_WithTemplateSlots_25<typeof __VLS_component_25, __VLS_TemplateResult_25["slots"]>;
+
 export declare const MStarRating: DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (value: number) => any;
 }, string, PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
@@ -2736,25 +3837,25 @@ readonly: boolean;
 compact: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MStatusBadge: DefineComponent<__VLS_Props_42, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_42> & Readonly<{}>, {
+export declare const MStatusBadge: DefineComponent<__VLS_Props_53, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_53> & Readonly<{}>, {
 status: "info" | "success" | "warning" | "error" | "neutral";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MStatusDot: DefineComponent<__VLS_Props_43, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_43> & Readonly<{}>, {
+export declare const MStatusDot: DefineComponent<__VLS_Props_54, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_54> & Readonly<{}>, {
 status: "info" | "success" | "warning" | "error" | "neutral";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>;
 
-export declare const MStatusMessage: DefineComponent<__VLS_Props_44, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_44> & Readonly<{}>, {
+export declare const MStatusMessage: DefineComponent<__VLS_Props_55, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_55> & Readonly<{}>, {
 status: "info" | "success" | "warning" | "error" | "neutral" | "inprogress";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MStatusNotification: __VLS_WithTemplateSlots_18<typeof __VLS_component_18, __VLS_TemplateResult_18["slots"]>;
+export declare const MStatusNotification: __VLS_WithTemplateSlots_26<typeof __VLS_component_26, __VLS_TemplateResult_26["slots"]>;
 
-export declare const MStepperBottomBar: DefineComponent<__VLS_Props_46, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MStepperBottomBar: DefineComponent<__VLS_Props_57, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: number) => any;
 cancel: () => any;
 validate: () => any;
-}, string, PublicProps, Readonly<__VLS_Props_46> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_57> & Readonly<{
 "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 onCancel?: (() => any) | undefined;
 onValidate?: (() => any) | undefined;
@@ -2768,14 +3869,18 @@ nextLabel: string;
 validateLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MStepperCompact: DefineComponent<__VLS_Props_47, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_47> & Readonly<{}>, {
+export declare const MStepperCompact: DefineComponent<__VLS_Props_58, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_58> & Readonly<{}>, {
 value: number;
 maxSteps: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MStepperInline: DefineComponent<__VLS_Props_48, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_48> & Readonly<{}>, {
+export declare const MStepperInline: DefineComponent<__VLS_Props_59, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_59> & Readonly<{}>, {
 steps: Array<{
 /**
+* Uniquer identifier for the step.
+*/
+id?: string;
+/**
 * Label of the step.
 */
 label: string;
@@ -2784,24 +3889,24 @@ label: string;
 */
 additionalInfo?: string;
 }>;
-currentStep: number;
+currentStep: string | number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-export declare const MTabs: DefineComponent<__VLS_Props_49, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-"update:modelValue": (value: number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_49> & Readonly<{
-"onUpdate:modelValue"?: ((value: number) => any) | undefined;
+export declare const MTabs: DefineComponent<__VLS_Props_60, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value?: string | number | undefined) => any;
+}, string, PublicProps, Readonly<__VLS_Props_60> & Readonly<{
+"onUpdate:modelValue"?: ((value?: string | number | undefined) => any) | undefined;
 }>, {
-modelValue: number;
+modelValue: string | number;
 divider: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {
 tab: HTMLButtonElement;
 }, HTMLElement>;
 
-export declare const MTag: DefineComponent<__VLS_Props_50, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MTag: DefineComponent<__VLS_Props_61, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: boolean) => any;
 "remove-tag": (id: string) => any;
-}, string, PublicProps, Readonly<__VLS_Props_50> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_61> & Readonly<{
 "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 "onRemove-tag"?: ((id: string) => any) | undefined;
 }>, {
@@ -2810,33 +3915,41 @@ contextualisedNumber: number;
 removableLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MTextArea: DefineComponent<__VLS_Props_51, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MTextArea: DefineComponent<__VLS_Props_62, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string | number) => any;
-}, string, PublicProps, Readonly<__VLS_Props_51> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_62> & Readonly<{
 "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
 rows: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MTextInput: __VLS_WithTemplateSlots_19<typeof __VLS_component_19, __VLS_TemplateResult_19["slots"]>;
+export declare const MTextInput: __VLS_WithTemplateSlots_27<typeof __VLS_component_27, __VLS_TemplateResult_27["slots"]>;
+
+export declare const MTile: __VLS_WithTemplateSlots_28<typeof __VLS_component_28, __VLS_TemplateResult_28["slots"]>;
+
+export declare const MTileClickable: __VLS_WithTemplateSlots_29<typeof __VLS_component_29, __VLS_TemplateResult_29["slots"]>;
+
+export declare const MTileExpandable: __VLS_WithTemplateSlots_30<typeof __VLS_component_30, __VLS_TemplateResult_30["slots"]>;
+
+export declare const MTileSelectable: __VLS_WithTemplateSlots_31<typeof __VLS_component_31, __VLS_TemplateResult_31["slots"]>;
 
-export declare const MToaster: __VLS_WithTemplateSlots_20<typeof __VLS_component_20, __VLS_TemplateResult_20["slots"]>;
+export declare const MToaster: __VLS_WithTemplateSlots_32<typeof __VLS_component_32, __VLS_TemplateResult_32["slots"]>;
 
-export declare const MToggle: DefineComponent<__VLS_Props_54, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MToggle: DefineComponent<__VLS_Props_69, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: boolean) => any;
-}, string, PublicProps, Readonly<__VLS_Props_54> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_69> & Readonly<{
 "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {
 size: "s" | "m";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-export declare const MToggleGroup: DefineComponent<__VLS_Props_55, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const MToggleGroup: DefineComponent<__VLS_Props_70, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string[]) => any;
-}, string, PublicProps, Readonly<__VLS_Props_55> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_70> & Readonly<{
 "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
-export declare const MTooltip: __VLS_WithTemplateSlots_21<typeof __VLS_component_21, __VLS_TemplateResult_21["slots"]>;
+export declare const MTooltip: __VLS_WithTemplateSlots_33<typeof __VLS_component_33, __VLS_TemplateResult_33["slots"]>;
 
 declare type NormalizedFile = {
     name: string;