@ebrains/components 0.0.1-alpha.0 → 0.3.0-alpha.0

package/dist/types/components.d.ts

@@ -202,11 +202,11 @@ export namespace Components {
         /**
           * The visual intent or style of the button. Options include 'primary', 'secondary', 'tertiary', 'ghost', and 'ghostInverse'.
          */
-        "intent"?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'ghostInverse';
+        "intent": 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'ghostInverse';
         /**
           * The label text to be displayed inside the button.
          */
-        "label"?: string;
+        "label": string;
         /**
           * A boolean indicating whether the button is in a loading state.
          */
@@ -352,7 +352,7 @@ export namespace Components {
         /**
           * JSON string representing an array of card objects. Each card object can contain properties like `title`, `description`, `avatar`, `headingLevel`, `tags`, `url`, `bg`, `tiny`, and `image`.  Example: ```json '[{"title": "Card Title", "description": "Description", "avatar": "/path/to/avatar.jpg", "url": "http://example.com"}]' ```
          */
-        "cards": string;
+        "cards": string | { title: string; description: string; tags: string; url: string }[];
         /**
           * Number of columns to span for each card in the grid layout. This value sets the column span on medium (md) and larger screen sizes. Default is `4`.
          */
@@ -644,6 +644,10 @@ export namespace Components {
           * If `true`, includes a submit button in the form.
          */
         "submitBtn"?: boolean;
+        /**
+          * The message displayed when the form submission fails.
+         */
+        "submitBtnHintMessage"?: string;
         /**
           * If `true`, includes a submit button in the form.
          */
@@ -680,7 +684,7 @@ export namespace Components {
      * `eds-fullscreen-menu` is a fullscreen menu component designed for the EBRAINS platform.
      * It provides a responsive, full-window overlay menu with navigation links and additional options.
      * This component is suitable for mobile and small screens, where a fullscreen menu enhances user navigation.
-     * ## Key Features:
+     * ## Key Features
      * - **Links and Menu Links**: Allows configurable primary and secondary navigation links.
      * - **Event-Driven Open/Close**: Listens for a `toggleMenu` event to open or close the menu, emitted by the `eds-header` component.
      * - **Responsive Behavior**: Automatically closes the menu when the screen width is larger than a specified breakpoint (1024px).
@@ -692,7 +696,7 @@ export namespace Components {
         /**
           * JSON string representing the links for primary navigation. Each link should include `label`, `url`, and optionally an `icon`.
          */
-        "links": string;
+        "links": string | { label: string; url: string; icon?: string; external?: boolean }[];
         /**
           * JSON string representing the extra menu links a user wants for smaill screens navigation. Each link should include `label`, `url`.
          */
@@ -733,9 +737,9 @@ export namespace Components {
         /**
           * JSON string representing the links for primary navigation. Each link should include `label`, `url`, and optionally an `icon`.
          */
-        "links": string;
+        "links": string | { label: string; url: string; icon?: string; external?: boolean }[];
         /**
-          * Flag to enable or disable header menu toggle feature. When true, displays the toggle in the header.
+          * Flag to enable or disable header menu toggle feature. When true, displays the toggle in the header. Requires the <eds-fullscreen-menu> to properly work.
          */
         "menuEnabled": boolean;
         /**
@@ -1083,16 +1087,67 @@ export namespace Components {
         "required": boolean;
         "value"?: string;
     }
+    /**
+     * A custom select input component that supports both static and dynamic options.
+     * Options can be provided in two formats:
+     * 1. Dynamic fetch configuration:
+     *    [
+     *      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }
+     *    ]
+     * 2. Static options:
+     *    [
+     *      { value: "react", label: "React" },
+     *      { value: "angular", label: "Angular" },
+     *      { value: "vue", label: "Vue.js" },
+     *      // etc.
+     *    ]
+     * The component will automatically fetch data if a dynamic configuration is provided.
+     */
     interface EdsInputSelect {
+        /**
+          * If true, the select input will be disabled.
+         */
         "disabled": boolean;
+        /**
+          * If true, the select input is in an error state.
+         */
         "error": boolean;
+        /**
+          * If true, indicates that there is an associated message (help or error).
+         */
         "hasMessage": boolean;
+        /**
+          * Optional id for the input. If not provided, the component uses the `name` property.
+         */
         "inputId"?: string;
+        /**
+          * For static options, this property defines the key used to retrieve the display label.
+         */
+        "labelKey": string;
+        /**
+          * The name attribute of the select input. Also used as the fallback id.
+         */
         "name": string;
-        "options": { label: string; value: string }[];
+        /**
+          * Options can be provided in two formats:  1. Dynamic fetch configuration:    [      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }    ]  2. Static options:    [      { value: "react", label: "React" },      { value: "angular", label: "Angular" },      { value: "vue", label: "Vue.js" },      // etc.    ]
+         */
+        "options": { [key: string]: any }[];
+        /**
+          * Placeholder text (not used in the native select, but can be used for custom implementations).
+         */
         "placeholder"?: string;
+        /**
+          * If true, the select input is marked as required.
+         */
         "required": boolean;
+        /**
+          * The currently selected value.
+         */
         "value"?: string | number;
+        /**
+          * For static options, this property defines the key used to retrieve the option value.
+         */
+        "valueKey": string;
     }
     /**
      * `EdsLink` is a versatile link component offering different styles and behaviors.
@@ -1214,6 +1269,12 @@ export namespace Components {
          */
         "type": 'color' | 'black' | 'color-white' | 'white' | 'no-bg';
     }
+    interface EdsLogoVariations {
+        /**
+          * Active tab index to determine the content to display
+         */
+        "tabIndex": number;
+    }
     /**
      * A Stencil component for displaying a Matomo analytics consent notice.
      * Provides users with the option to opt in or opt out of anonymous analytics.
@@ -1457,6 +1518,10 @@ export namespace Components {
      * This component is versatile for displaying data with flexible configuration, and integrates with pagination and search functionalities.
      */
     interface EdsTable {
+        /**
+          * Optional property to control the column sizing mode. - 'default' uses containerWidth / visibleColumns. - 'medium' divides that result by 2. - 'large' divides that result by 4.
+         */
+        "columnSize"?: 'default' | 'medium' | 'large';
         /**
           * Config object to hide or format columns
          */
@@ -1475,6 +1540,7 @@ export namespace Components {
           * Endpoint to fetch data dynamically
          */
         "endpoint": string | null;
+        "hostWidth"?: string;
         /**
           * Enable or disable pagination explicitly
          */
@@ -1508,7 +1574,7 @@ export namespace Components {
         /**
           * JSON string for tabs data
          */
-        "tabs": string;
+        "tabs": string | { label: string; url: string; active: boolean; ariaLabel: string }[];
     }
     interface EdsTabsContent {
         /**
@@ -1538,6 +1604,12 @@ export namespace Components {
          */
         "label": string;
     }
+    interface EdsTimeline {
+        /**
+          * Accepts a JSON string or object of timeline events.
+         */
+        "events": string | any[];
+    }
     interface EdsToast {
         /**
           * Determines the duration before the toast auto-dismisses (in milliseconds). Defaults to 5000ms (5 seconds).
@@ -1567,6 +1639,12 @@ export namespace Components {
          */
         "position": 'above' | 'below';
     }
+    interface EdsTrl {
+        /**
+          * Accepts a JSON string or an array of application objects.
+         */
+        "applications": string | any[];
+    }
     /**
      * `EdsUser` is a user authentication component for managing and displaying
      * the user's authentication state using Keycloak. It provides login and logout
@@ -1613,11 +1691,6 @@ export namespace Components {
     interface LogoSpace {
     }
     interface LogoVariationsHorizontal {
-        "orientation": 'horizontal' | 'vertical';
-        /**
-          * The type of logo variation to display. Available options: "coloured", "mono", "dark".
-         */
-        "type": 'coloured' | 'black' | 'color-white';
     }
     interface LogoVariationsVertical {
         "orientation": 'horizontal' | 'vertical';
@@ -2001,7 +2074,7 @@ declare global {
      * `eds-fullscreen-menu` is a fullscreen menu component designed for the EBRAINS platform.
      * It provides a responsive, full-window overlay menu with navigation links and additional options.
      * This component is suitable for mobile and small screens, where a fullscreen menu enhances user navigation.
-     * ## Key Features:
+     * ## Key Features
      * - **Links and Menu Links**: Allows configurable primary and secondary navigation links.
      * - **Event-Driven Open/Close**: Listens for a `toggleMenu` event to open or close the menu, emitted by the `eds-header` component.
      * - **Responsive Behavior**: Automatically closes the menu when the screen width is larger than a specified breakpoint (1024px).
@@ -2277,6 +2350,22 @@ declare global {
     interface HTMLEdsInputSelectElementEventMap {
         "changeEvent": string | number;
     }
+    /**
+     * A custom select input component that supports both static and dynamic options.
+     * Options can be provided in two formats:
+     * 1. Dynamic fetch configuration:
+     *    [
+     *      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }
+     *    ]
+     * 2. Static options:
+     *    [
+     *      { value: "react", label: "React" },
+     *      { value: "angular", label: "Angular" },
+     *      { value: "vue", label: "Vue.js" },
+     *      // etc.
+     *    ]
+     * The component will automatically fetch data if a dynamic configuration is provided.
+     */
     interface HTMLEdsInputSelectElement extends Components.EdsInputSelect, HTMLStencilElement {
         addEventListener<K extends keyof HTMLEdsInputSelectElementEventMap>(type: K, listener: (this: HTMLEdsInputSelectElement, ev: EdsInputSelectCustomEvent<HTMLEdsInputSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2307,7 +2396,10 @@ declare global {
         new (): HTMLEdsLinkElement;
     };
     interface HTMLEdsLoginElementEventMap {
-        "authStatusChanged": { authenticated: boolean; user: any };
+        "authStatusChanged": {
+    authenticated: boolean;
+    user: any;
+  };
     }
     /**
      * `EdsLogin` is a login component that integrates Keycloak authentication,
@@ -2349,6 +2441,12 @@ declare global {
         prototype: HTMLEdsLogoElement;
         new (): HTMLEdsLogoElement;
     };
+    interface HTMLEdsLogoVariationsElement extends Components.EdsLogoVariations, HTMLStencilElement {
+    }
+    var HTMLEdsLogoVariationsElement: {
+        prototype: HTMLEdsLogoVariationsElement;
+        new (): HTMLEdsLogoVariationsElement;
+    };
     /**
      * A Stencil component for displaying a Matomo analytics consent notice.
      * Provides users with the option to opt in or opt out of anonymous analytics.
@@ -2482,7 +2580,11 @@ declare global {
         new (): HTMLEdsTableElement;
     };
     interface HTMLEdsTabsElementEventMap {
-        "tabChange": { tabId: string; index: number; name?: string };
+        "tabChange": {
+    tabId: string;
+    index: number;
+    name?: string;
+  };
     }
     /**
      * `EdsTabs` is a tabs component that renders a navigational tab bar.
@@ -2537,6 +2639,12 @@ declare global {
         prototype: HTMLEdsTagElement;
         new (): HTMLEdsTagElement;
     };
+    interface HTMLEdsTimelineElement extends Components.EdsTimeline, HTMLStencilElement {
+    }
+    var HTMLEdsTimelineElement: {
+        prototype: HTMLEdsTimelineElement;
+        new (): HTMLEdsTimelineElement;
+    };
     interface HTMLEdsToastElement extends Components.EdsToast, HTMLStencilElement {
     }
     var HTMLEdsToastElement: {
@@ -2558,6 +2666,12 @@ declare global {
         prototype: HTMLEdsTooltipElement;
         new (): HTMLEdsTooltipElement;
     };
+    interface HTMLEdsTrlElement extends Components.EdsTrl, HTMLStencilElement {
+    }
+    var HTMLEdsTrlElement: {
+        prototype: HTMLEdsTrlElement;
+        new (): HTMLEdsTrlElement;
+    };
     interface HTMLEdsUserElementEventMap {
         "authStatusChanged": {
     authenticated: boolean;
@@ -2738,6 +2852,7 @@ declare global {
         "eds-link": HTMLEdsLinkElement;
         "eds-login": HTMLEdsLoginElement;
         "eds-logo": HTMLEdsLogoElement;
+        "eds-logo-variations": HTMLEdsLogoVariationsElement;
         "eds-matomo-notice": HTMLEdsMatomoNoticeElement;
         "eds-modal": HTMLEdsModalElement;
         "eds-navigator": HTMLEdsNavigatorElement;
@@ -2753,9 +2868,11 @@ declare global {
         "eds-tabs": HTMLEdsTabsElement;
         "eds-tabs-content": HTMLEdsTabsContentElement;
         "eds-tag": HTMLEdsTagElement;
+        "eds-timeline": HTMLEdsTimelineElement;
         "eds-toast": HTMLEdsToastElement;
         "eds-toast-manager": HTMLEdsToastManagerElement;
         "eds-tooltip": HTMLEdsTooltipElement;
+        "eds-trl": HTMLEdsTrlElement;
         "eds-user": HTMLEdsUserElement;
         "eds-user-modal": HTMLEdsUserModalElement;
         "gradient-primary-palette": HTMLGradientPrimaryPaletteElement;
@@ -3125,7 +3242,7 @@ declare namespace LocalJSX {
         /**
           * JSON string representing an array of card objects. Each card object can contain properties like `title`, `description`, `avatar`, `headingLevel`, `tags`, `url`, `bg`, `tiny`, and `image`.  Example: ```json '[{"title": "Card Title", "description": "Description", "avatar": "/path/to/avatar.jpg", "url": "http://example.com"}]' ```
          */
-        "cards"?: string;
+        "cards"?: string | { title: string; description: string; tags: string; url: string }[];
         /**
           * Number of columns to span for each card in the grid layout. This value sets the column span on medium (md) and larger screen sizes. Default is `4`.
          */
@@ -3421,6 +3538,10 @@ declare namespace LocalJSX {
           * If `true`, includes a submit button in the form.
          */
         "submitBtn"?: boolean;
+        /**
+          * The message displayed when the form submission fails.
+         */
+        "submitBtnHintMessage"?: string;
         /**
           * If `true`, includes a submit button in the form.
          */
@@ -3457,7 +3578,7 @@ declare namespace LocalJSX {
      * `eds-fullscreen-menu` is a fullscreen menu component designed for the EBRAINS platform.
      * It provides a responsive, full-window overlay menu with navigation links and additional options.
      * This component is suitable for mobile and small screens, where a fullscreen menu enhances user navigation.
-     * ## Key Features:
+     * ## Key Features
      * - **Links and Menu Links**: Allows configurable primary and secondary navigation links.
      * - **Event-Driven Open/Close**: Listens for a `toggleMenu` event to open or close the menu, emitted by the `eds-header` component.
      * - **Responsive Behavior**: Automatically closes the menu when the screen width is larger than a specified breakpoint (1024px).
@@ -3469,7 +3590,7 @@ declare namespace LocalJSX {
         /**
           * JSON string representing the links for primary navigation. Each link should include `label`, `url`, and optionally an `icon`.
          */
-        "links"?: string;
+        "links"?: string | { label: string; url: string; icon?: string; external?: boolean }[];
         /**
           * JSON string representing the extra menu links a user wants for smaill screens navigation. Each link should include `label`, `url`.
          */
@@ -3514,9 +3635,9 @@ declare namespace LocalJSX {
         /**
           * JSON string representing the links for primary navigation. Each link should include `label`, `url`, and optionally an `icon`.
          */
-        "links"?: string;
+        "links"?: string | { label: string; url: string; icon?: string; external?: boolean }[];
         /**
-          * Flag to enable or disable header menu toggle feature. When true, displays the toggle in the header.
+          * Flag to enable or disable header menu toggle feature. When true, displays the toggle in the header. Requires the <eds-fullscreen-menu> to properly work.
          */
         "menuEnabled"?: boolean;
         /**
@@ -3867,17 +3988,72 @@ declare namespace LocalJSX {
         "required"?: boolean;
         "value"?: string;
     }
+    /**
+     * A custom select input component that supports both static and dynamic options.
+     * Options can be provided in two formats:
+     * 1. Dynamic fetch configuration:
+     *    [
+     *      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }
+     *    ]
+     * 2. Static options:
+     *    [
+     *      { value: "react", label: "React" },
+     *      { value: "angular", label: "Angular" },
+     *      { value: "vue", label: "Vue.js" },
+     *      // etc.
+     *    ]
+     * The component will automatically fetch data if a dynamic configuration is provided.
+     */
     interface EdsInputSelect {
+        /**
+          * If true, the select input will be disabled.
+         */
         "disabled"?: boolean;
+        /**
+          * If true, the select input is in an error state.
+         */
         "error"?: boolean;
+        /**
+          * If true, indicates that there is an associated message (help or error).
+         */
         "hasMessage"?: boolean;
+        /**
+          * Optional id for the input. If not provided, the component uses the `name` property.
+         */
         "inputId"?: string;
+        /**
+          * For static options, this property defines the key used to retrieve the display label.
+         */
+        "labelKey"?: string;
+        /**
+          * The name attribute of the select input. Also used as the fallback id.
+         */
         "name": string;
+        /**
+          * Emitted when the value of the select input changes.
+          * @event changeEvent
+         */
         "onChangeEvent"?: (event: EdsInputSelectCustomEvent<string | number>) => void;
-        "options"?: { label: string; value: string }[];
+        /**
+          * Options can be provided in two formats:  1. Dynamic fetch configuration:    [      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }    ]  2. Static options:    [      { value: "react", label: "React" },      { value: "angular", label: "Angular" },      { value: "vue", label: "Vue.js" },      // etc.    ]
+         */
+        "options"?: { [key: string]: any }[];
+        /**
+          * Placeholder text (not used in the native select, but can be used for custom implementations).
+         */
         "placeholder"?: string;
+        /**
+          * If true, the select input is marked as required.
+         */
         "required"?: boolean;
+        /**
+          * The currently selected value.
+         */
         "value"?: string | number;
+        /**
+          * For static options, this property defines the key used to retrieve the option value.
+         */
+        "valueKey"?: string;
     }
     /**
      * `EdsLink` is a versatile link component offering different styles and behaviors.
@@ -3974,7 +4150,10 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the authentication status changes. It emits a boolean value indicating the new authentication status.
          */
-        "onAuthStatusChanged"?: (event: EdsLoginCustomEvent<{ authenticated: boolean; user: any }>) => void;
+        "onAuthStatusChanged"?: (event: EdsLoginCustomEvent<{
+    authenticated: boolean;
+    user: any;
+  }>) => void;
     }
     /**
      * `EdsLogo` is a logo component designed to display a clickable logo that can link to a specified URL.
@@ -4003,6 +4182,12 @@ declare namespace LocalJSX {
          */
         "type"?: 'color' | 'black' | 'color-white' | 'white' | 'no-bg';
     }
+    interface EdsLogoVariations {
+        /**
+          * Active tab index to determine the content to display
+         */
+        "tabIndex"?: number;
+    }
     /**
      * A Stencil component for displaying a Matomo analytics consent notice.
      * Provides users with the option to opt in or opt out of anonymous analytics.
@@ -4233,6 +4418,10 @@ declare namespace LocalJSX {
      * This component is versatile for displaying data with flexible configuration, and integrates with pagination and search functionalities.
      */
     interface EdsTable {
+        /**
+          * Optional property to control the column sizing mode. - 'default' uses containerWidth / visibleColumns. - 'medium' divides that result by 2. - 'large' divides that result by 4.
+         */
+        "columnSize"?: 'default' | 'medium' | 'large';
         /**
           * Config object to hide or format columns
          */
@@ -4251,6 +4440,7 @@ declare namespace LocalJSX {
           * Endpoint to fetch data dynamically
          */
         "endpoint"?: string | null;
+        "hostWidth"?: string;
         /**
           * Enable or disable pagination explicitly
          */
@@ -4281,11 +4471,15 @@ declare namespace LocalJSX {
           * Aria label for the navigation
          */
         "navAriaLabel"?: string;
-        "onTabChange"?: (event: EdsTabsCustomEvent<{ tabId: string; index: number; name?: string }>) => void;
+        "onTabChange"?: (event: EdsTabsCustomEvent<{
+    tabId: string;
+    index: number;
+    name?: string;
+  }>) => void;
         /**
           * JSON string for tabs data
          */
-        "tabs"?: string;
+        "tabs"?: string | { label: string; url: string; active: boolean; ariaLabel: string }[];
     }
     interface EdsTabsContent {
         /**
@@ -4316,6 +4510,12 @@ declare namespace LocalJSX {
          */
         "label": string;
     }
+    interface EdsTimeline {
+        /**
+          * Accepts a JSON string or object of timeline events.
+         */
+        "events"?: string | any[];
+    }
     interface EdsToast {
         /**
           * Determines the duration before the toast auto-dismisses (in milliseconds). Defaults to 5000ms (5 seconds).
@@ -4345,6 +4545,12 @@ declare namespace LocalJSX {
          */
         "position"?: 'above' | 'below';
     }
+    interface EdsTrl {
+        /**
+          * Accepts a JSON string or an array of application objects.
+         */
+        "applications"?: string | any[];
+    }
     /**
      * `EdsUser` is a user authentication component for managing and displaying
      * the user's authentication state using Keycloak. It provides login and logout
@@ -4398,11 +4604,6 @@ declare namespace LocalJSX {
     interface LogoSpace {
     }
     interface LogoVariationsHorizontal {
-        "orientation"?: 'horizontal' | 'vertical';
-        /**
-          * The type of logo variation to display. Available options: "coloured", "mono", "dark".
-         */
-        "type"?: 'coloured' | 'black' | 'color-white';
     }
     interface LogoVariationsVertical {
         "orientation"?: 'horizontal' | 'vertical';
@@ -4489,6 +4690,7 @@ declare namespace LocalJSX {
         "eds-link": EdsLink;
         "eds-login": EdsLogin;
         "eds-logo": EdsLogo;
+        "eds-logo-variations": EdsLogoVariations;
         "eds-matomo-notice": EdsMatomoNotice;
         "eds-modal": EdsModal;
         "eds-navigator": EdsNavigator;
@@ -4504,9 +4706,11 @@ declare namespace LocalJSX {
         "eds-tabs": EdsTabs;
         "eds-tabs-content": EdsTabsContent;
         "eds-tag": EdsTag;
+        "eds-timeline": EdsTimeline;
         "eds-toast": EdsToast;
         "eds-toast-manager": EdsToastManager;
         "eds-tooltip": EdsTooltip;
+        "eds-trl": EdsTrl;
         "eds-user": EdsUser;
         "eds-user-modal": EdsUserModal;
         "gradient-primary-palette": GradientPrimaryPalette;
@@ -4688,7 +4892,7 @@ declare module "@stencil/core" {
              * `eds-fullscreen-menu` is a fullscreen menu component designed for the EBRAINS platform.
              * It provides a responsive, full-window overlay menu with navigation links and additional options.
              * This component is suitable for mobile and small screens, where a fullscreen menu enhances user navigation.
-             * ## Key Features:
+             * ## Key Features
              * - **Links and Menu Links**: Allows configurable primary and secondary navigation links.
              * - **Event-Driven Open/Close**: Listens for a `toggleMenu` event to open or close the menu, emitted by the `eds-header` component.
              * - **Responsive Behavior**: Automatically closes the menu when the screen width is larger than a specified breakpoint (1024px).
@@ -4771,6 +4975,22 @@ declare module "@stencil/core" {
             "eds-input-label": LocalJSX.EdsInputLabel & JSXBase.HTMLAttributes<HTMLEdsInputLabelElement>;
             "eds-input-range": LocalJSX.EdsInputRange & JSXBase.HTMLAttributes<HTMLEdsInputRangeElement>;
             "eds-input-search": LocalJSX.EdsInputSearch & JSXBase.HTMLAttributes<HTMLEdsInputSearchElement>;
+            /**
+             * A custom select input component that supports both static and dynamic options.
+             * Options can be provided in two formats:
+             * 1. Dynamic fetch configuration:
+             *    [
+             *      { endpoint: "http://localhost/api/applications", value: "_id", label: "title" }
+             *    ]
+             * 2. Static options:
+             *    [
+             *      { value: "react", label: "React" },
+             *      { value: "angular", label: "Angular" },
+             *      { value: "vue", label: "Vue.js" },
+             *      // etc.
+             *    ]
+             * The component will automatically fetch data if a dynamic configuration is provided.
+             */
             "eds-input-select": LocalJSX.EdsInputSelect & JSXBase.HTMLAttributes<HTMLEdsInputSelectElement>;
             /**
              * `EdsLink` is a versatile link component offering different styles and behaviors.
@@ -4804,6 +5024,7 @@ declare module "@stencil/core" {
              * This component is ideal for navigation and branding, with options for style customization and interaction tracking.
              */
             "eds-logo": LocalJSX.EdsLogo & JSXBase.HTMLAttributes<HTMLEdsLogoElement>;
+            "eds-logo-variations": LocalJSX.EdsLogoVariations & JSXBase.HTMLAttributes<HTMLEdsLogoVariationsElement>;
             /**
              * A Stencil component for displaying a Matomo analytics consent notice.
              * Provides users with the option to opt in or opt out of anonymous analytics.
@@ -4884,12 +5105,14 @@ declare module "@stencil/core" {
              * This component is useful for creating distinguishable tags or labels with consistent styling.
              */
             "eds-tag": LocalJSX.EdsTag & JSXBase.HTMLAttributes<HTMLEdsTagElement>;
+            "eds-timeline": LocalJSX.EdsTimeline & JSXBase.HTMLAttributes<HTMLEdsTimelineElement>;
             "eds-toast": LocalJSX.EdsToast & JSXBase.HTMLAttributes<HTMLEdsToastElement>;
             "eds-toast-manager": LocalJSX.EdsToastManager & JSXBase.HTMLAttributes<HTMLEdsToastManagerElement>;
             /**
              * `EdsTooltip` dynamically positions a tooltip centered above the slotted element.
              */
             "eds-tooltip": LocalJSX.EdsTooltip & JSXBase.HTMLAttributes<HTMLEdsTooltipElement>;
+            "eds-trl": LocalJSX.EdsTrl & JSXBase.HTMLAttributes<HTMLEdsTrlElement>;
             /**
              * `EdsUser` is a user authentication component for managing and displaying
              * the user's authentication state using Keycloak. It provides login and logout

package/dist/types/eds-docs-ui/colors/use-of-colors/incorrect-use-of-colors.d.ts

@@ -1,7 +1,3 @@
-/**
- * `CorrectUseOfColors` is a component that combines the primary palette and support palette
- * to display the correct use of colors.
- */
 /**
  * @internal
  */

package/dist/types/eds-docs-ui/eds-logo-variations/eds-logo-variations.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @internal
+ */
+export declare class EdsLogoVariations {
+    /** Active tab index to determine the content to display */
+    tabIndex: number;
+    renderContent(): any;
+    render(): any;
+}

package/dist/types/eds-docs-ui/eds-svg-repository/eds-svg-repository.d.ts

@@ -2,6 +2,8 @@
  * @internal
  */
 export declare class EdsSvgRepository {
+    hostEl: HTMLElement;
     private getSvgData;
+    get hostWidth(): number;
     render(): any;
 }

package/dist/types/eds-docs-ui/logo/logo-variations/horizontal/logo-variations-horizontal.d.ts

@@ -1,12 +1,6 @@
 /**
  * @internal
  */
-export declare class LogoVariations {
-    orientation: 'horizontal' | 'vertical';
-    /**
-     * The type of logo variation to display.
-     * Available options: "coloured", "mono", "dark".
-     */
-    type: 'coloured' | 'black' | 'color-white';
+export declare class LogoVariationsHorizontal {
     render(): any;
 }

package/dist/types/eds-docs-ui/logo/logo-variations/vertical/logo-variations-vertical.d.ts

@@ -1,7 +1,7 @@
 /**
  * @internal
  */
-export declare class LogoVariations {
+export declare class LogoVariationsVertical {
     orientation: 'horizontal' | 'vertical';
     /**
      * The type of logo variation to display.