@sapudex/web-components 0.199.3 → 0.225.0

package/dist/web-types.json

@@ -1,14 +1,14 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@sapudex/web-components",
-  "version": "0.199.3",
+  "version": "0.225.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
       "elements": [
         {
           "name": "udex-accordion",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-accordion</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Accordion.js\";</code>\n---\n\n\n### **Events:**\n - **toggle-items** - Triggered when the user click on on Expand/Collapse All button.\n\n### **Slots:**\n - **default** - Slot for accordion items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-accordion</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Accordion.js\";</code>\n---\n\n\n### **Events:**\n - **toggle-items** - Triggered when the user click on on Expand/Collapse All button.\n\n### **Slots:**\n - **default** - Slot for accordion items.",
           "doc-url": "",
           "attributes": [
             {
@@ -44,7 +44,7 @@
         },
         {
           "name": "udex-accordion-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-accordion-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/AccordionItem.js\";</code>\n---\n\n\n### **Events:**\n - **accordion-item-focus** - Triggered when the user focuses on an accordion item.\n\n### **Slots:**\n - **default** - Slot for accordion item content.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-accordion-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/AccordionItem.js\";</code>\n---\n\n\n### **Events:**\n - **accordion-item-focus** - Triggered when the user focuses on an accordion item.\n\n### **Slots:**\n - **default** - Slot for accordion item content.",
           "doc-url": "",
           "attributes": [
             {
@@ -113,7 +113,7 @@
         },
         {
           "name": "udex-avatar",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-avatar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Avatar.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Receives the desired <img> tag\n- **badge** - Defines the optional badge that will be used for visual affordance.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-avatar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Avatar.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Receives the desired <img> tag\n- **badge** - Defines the optional badge that will be used for visual affordance.",
           "doc-url": "",
           "attributes": [
             {
@@ -247,7 +247,7 @@
         },
         {
           "name": "udex-avatar-group",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-avatar-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/AvatarGroup.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-avatar-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/AvatarGroup.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -255,7 +255,7 @@
         },
         {
           "name": "udex-badge",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-badge</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Badge.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the content of the component.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-badge</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Badge.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the content of the component.",
           "doc-url": "",
           "attributes": [
             {
@@ -353,7 +353,7 @@
         },
         {
           "name": "udex-breadcrumbs",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-breadcrumbs</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Breadcrumbs.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when a `BreadcrumbsItem` is clicked.\n\n**Note:** You can prevent browser location change by calling `event.preventDefault()`.\n\n### **Slots:**\n - **default** - Defines the component items.\n\n**Note:** Use the `udex-breadcrumbs-item` component to define the desired items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-breadcrumbs</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Breadcrumbs.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when a `BreadcrumbsItem` is clicked.\n\n**Note:** You can prevent browser location change by calling `event.preventDefault()`.\n- **open** - Fired after the dropdown is opened.\n- **close** - Fired after the dropdown is closed.\n\n### **Slots:**\n - **default** - Defines the component items.\n\n**Note:** Use the `udex-breadcrumbs-item` component to define the desired items.",
           "doc-url": "",
           "attributes": [
             {
@@ -372,6 +372,14 @@
             {
               "name": "item-click",
               "description": "Fires when a `BreadcrumbsItem` is clicked.\n\n**Note:** You can prevent browser location change by calling `event.preventDefault()`."
+            },
+            {
+              "name": "open",
+              "description": "Fired after the dropdown is opened."
+            },
+            {
+              "name": "close",
+              "description": "Fired after the dropdown is closed."
             }
           ],
           "js": {
@@ -386,13 +394,21 @@
               {
                 "name": "item-click",
                 "description": "Fires when a `BreadcrumbsItem` is clicked.\n\n**Note:** You can prevent browser location change by calling `event.preventDefault()`."
+              },
+              {
+                "name": "open",
+                "description": "Fired after the dropdown is opened."
+              },
+              {
+                "name": "close",
+                "description": "Fired after the dropdown is closed."
               }
             ]
           }
         },
         {
           "name": "udex-breadcrumbs-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-breadcrumbs-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/BreadcrumbsItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-breadcrumbs-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/BreadcrumbsItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -505,7 +521,7 @@
         },
         {
           "name": "udex-checkbox",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-checkbox</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Checkbox.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-checkbox</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Checkbox.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -513,7 +529,7 @@
         },
         {
           "name": "udex-control-button",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-control-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ControlButton.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-control-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ControlButton.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -549,7 +565,7 @@
         },
         {
           "name": "udex-country-selector",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-country-selector</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/CountrySelector.js\";</code>\n---\n\n\n### **Events:**\n - **before-open** - Fired before the dropdown paneis opened.\n- **after-open** - Fired after the dropdown pane is opened.\n- **before-close** - Fired before the dropdown pane is closed.\n- **after-close** - Fired after the dropdown pane is closed.\n- **change-search** - Fired event when the user submitted the value in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **selection-change** - \n- **select-all** - Fired event when the user clicks on the Select All header.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-country-selector</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/CountrySelector.js\";</code>\n---\n\n\n### **Events:**\n - **before-open** - Fired before the dropdown paneis opened.\n- **after-open** - Fired after the dropdown pane is opened.\n- **before-close** - Fired before the dropdown pane is closed.\n- **after-close** - Fired after the dropdown pane is closed.\n- **change-search** - Fired event when the user submitted the value in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **selection-change** - \n- **select-all** - Fired event when the user clicks on the Select All header.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
           "doc-url": "",
           "attributes": [
             {
@@ -624,6 +640,16 @@
               "name": "hide-flag-images",
               "value": { "type": "boolean | undefined" }
             },
+            {
+              "name": "busy",
+              "description": "Defines if the component would display a loading indicator.",
+              "value": { "type": "boolean | undefined", "default": "false" }
+            },
+            {
+              "name": "busy-delay",
+              "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+              "value": { "type": "number | undefined", "default": "1000" }
+            },
             {
               "name": "no-result-text",
               "description": "Defines the \"no result\" text of the component.",
@@ -646,6 +672,11 @@
                 "type": "\"SingleSelect\" | \"MultiSelect\" | \"SingleContent\" | \"RadioGroup\"",
                 "default": "\"SingleSelect\""
               }
+            },
+            {
+              "name": "default-accessible-role",
+              "description": "Defines the default accessible role for the list componnet.",
+              "value": { "type": "string", "default": "\"list\"" }
             }
           ],
           "events": [
@@ -756,6 +787,16 @@
                 "name": "hide-flag-images",
                 "value": { "type": "boolean | undefined" }
               },
+              {
+                "name": "busy",
+                "description": "Defines if the component would display a loading indicator.",
+                "value": { "type": "boolean | undefined" }
+              },
+              {
+                "name": "busy-delay",
+                "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+                "value": { "type": "number | undefined" }
+              },
               {
                 "name": "no-result-text",
                 "description": "Defines the \"no result\" text of the component.",
@@ -777,6 +818,11 @@
                 "value": {
                   "type": "\"SingleSelect\" | \"MultiSelect\" | \"SingleContent\" | \"RadioGroup\""
                 }
+              },
+              {
+                "name": "default-accessible-role",
+                "description": "Defines the default accessible role for the list componnet.",
+                "value": { "type": "string" }
               }
             ],
             "events": [
@@ -818,7 +864,7 @@
         },
         {
           "name": "udex-date-picker",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/DatePicker.js\";</code>\n---\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n### **Methods:**\n - **isValid(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isInValidRangeRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/DatePicker.js\";</code>\n---\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n### **Methods:**\n - **isValid(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isInValidRangeRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.",
           "doc-url": "",
           "attributes": [
             {
@@ -982,7 +1028,7 @@
         },
         {
           "name": "udex-dropdown",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-dropdown</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Dropdown.js\";</code>\n---\n\n\n### **Events:**\n - **click-trigger** - Fired event when the user clicks the trigger.\n- **before-open** - Fired before the dropdown is opened.\n- **after-open** - Fired after the dropdown is opened.\n- **before-close** - Fired before the menu is closed.\n- **after-close** - Fired after the menu is closed.\n\n### **Methods:**\n - **onOpen(): _void_** - Open dropdown\n- **onClose(): _void_** - Close dropdown\n\n### **Slots:**\n - **default** - Defines the content of the Dropdown.\n- **header** - Defines the header HTML Element.\n- **footer** - Defines the footer HTML Element.\n- **trigger** - Defines the trigger HTML Element.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-dropdown</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Dropdown.js\";</code>\n---\n\n\n### **Events:**\n - **click-trigger** - Fired event when the user clicks the trigger.\n- **before-open** - Fired before the dropdown is opened.\n- **after-open** - Fired after the dropdown is opened.\n- **before-close** - Fired before the menu is closed.\n- **after-close** - Fired after the menu is closed.\n\n### **Methods:**\n - **onOpen(): _void_** - Open dropdown\n- **onClose(): _void_** - Close dropdown\n\n### **Slots:**\n - **default** - Defines the content of the Dropdown.\n- **header** - Defines the header HTML Element.\n- **footer** - Defines the footer HTML Element.\n- **trigger** - Defines the trigger HTML Element.",
           "doc-url": "",
           "attributes": [
             {
@@ -1148,7 +1194,7 @@
         },
         {
           "name": "udex-filter-menu",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/UDExFilterMenu.js\";</code>\n---\n\n\n### **Events:**\n - **reset-click** - Fired event when the user click on a reset button on the footer.\n- **result-click** - Fired event when the user click on a result button on the footer.\n- **select-all** - Fired event when the user click on Select All header item.\n- **before-open** - Fired before the dropdown pane is opened.\n- **after-open** - Fired after the dropdown pane is opened.\n- **before-close** - Fired before the dropdown pane is closed.\n- **after-close** - Fired after the dropdown pane is closed.\n- **selection-change** - \n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **change-search** - Fired event when the user submitted the value in the search.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/UDExFilterMenu.js\";</code>\n---\n\n\n### **Events:**\n - **reset-click** - Fired event when the user click on a reset button on the footer.\n- **result-click** - Fired event when the user click on a result button on the footer.\n- **select-all** - Fired event when the user click on Select All header item.\n- **before-open** - Fired before the dropdown pane is opened.\n- **after-open** - Fired after the dropdown pane is opened.\n- **before-close** - Fired before the dropdown pane is closed.\n- **after-close** - Fired after the dropdown pane is closed.\n- **selection-change** - \n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **change-search** - Fired event when the user submitted the value in the search.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
           "doc-url": "",
           "attributes": [
             {
@@ -1230,6 +1276,11 @@
               "description": "Defines the accessible ARIA name of the component.",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "accessible-name-ref",
+              "description": "Defines id (or many ids) of the elements that contain the ARIA name of the component.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "accessible-role",
               "description": "Allows setting a custom role.",
@@ -1243,6 +1294,16 @@
               "description": "Allows setting a custom role for dropdown trigger.",
               "value": { "type": "string", "default": "\"combobox\"" }
             },
+            {
+              "name": "busy",
+              "description": "Defines if the component would display a loading indicator.",
+              "value": { "type": "boolean | undefined", "default": "false" }
+            },
+            {
+              "name": "busy-delay",
+              "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+              "value": { "type": "number | undefined", "default": "1000" }
+            },
             {
               "name": "no-result-text",
               "description": "Defines the \"no result\" text of the component.",
@@ -1262,6 +1323,11 @@
               "name": "select-all-label",
               "description": "Defines label text for select all header.",
               "value": { "type": "string", "default": "\"Select All\"" }
+            },
+            {
+              "name": "default-accessible-role",
+              "description": "Defines the default accessible role for the list componnet.",
+              "value": { "type": "string", "default": "\"list\"" }
             }
           ],
           "events": [
@@ -1385,6 +1451,11 @@
                 "description": "Defines the accessible ARIA name of the component.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "accessible-name-ref",
+                "description": "Defines id (or many ids) of the elements that contain the ARIA name of the component.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "accessible-role",
                 "description": "Allows setting a custom role.",
@@ -1395,6 +1466,16 @@
                 "description": "Allows setting a custom role for dropdown trigger.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "busy",
+                "description": "Defines if the component would display a loading indicator.",
+                "value": { "type": "boolean | undefined" }
+              },
+              {
+                "name": "busy-delay",
+                "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+                "value": { "type": "number | undefined" }
+              },
               {
                 "name": "no-result-text",
                 "description": "Defines the \"no result\" text of the component.",
@@ -1414,6 +1495,11 @@
                 "name": "select-all-label",
                 "description": "Defines label text for select all header.",
                 "value": { "type": "string" }
+              },
+              {
+                "name": "default-accessible-role",
+                "description": "Defines the default accessible role for the list componnet.",
+                "value": { "type": "string" }
               }
             ],
             "events": [
@@ -1463,7 +1549,7 @@
         },
         {
           "name": "udex-filter-menu-group-header",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/FilterMenuGroupHeader.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for  list items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/FilterMenuGroupHeader.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for  list items.",
           "doc-url": "",
           "attributes": [
             {
@@ -1598,7 +1684,7 @@
         },
         {
           "name": "udex-filter-menu-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/FilterMenuItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/FilterMenuItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -1728,7 +1814,7 @@
         },
         {
           "name": "udex-filter-menu-select-all",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/FilterMenuSelectAll.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-filter-menu-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/FilterMenuSelectAll.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -1860,7 +1946,7 @@
         },
         {
           "name": "udex-footer",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-footer</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Footer.js\";</code>\n---\n\n\n### **Events:**\n - **logo-click** - Triggered on click interaction with logo in footer\n- **back-to-top-click** - Triggered on click interaction with \"Back to Top\" button\n- **contact-phone-click** - Triggered on click interaction with phone number link in footer\n- **contact-phone-local-numbers-click** - Triggered on click interaction with local country numbers list link\n- **contact-email-click** - Triggered on click interaction with \"Contact us by email\" link\n- **contact-chat-click** - Triggered on click interaction with \"Contact us by chat\" link\n- **quick-links-click** - Triggered on click interaction with a link within \"Quick Links\" category\n- **trending-click** - Triggered on click interaction with a link within \"Trending\" category\n- **about-sap-click** - Triggered on click interaction with a link within \"About SAP\" category\n- **site-information-click** - Triggered on click interaction with a link within \"Site Information\" category\n- **social-media-link-click** - Triggered on click interaction with any of the social media links within footer",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-footer</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Footer.js\";</code>\n---\n\n\n### **Events:**\n - **logo-click** - Triggered on click interaction with logo in footer\n- **back-to-top-click** - Triggered on click interaction with \"Back to Top\" button\n- **contact-phone-click** - Triggered on click interaction with phone number link in footer\n- **contact-phone-local-numbers-click** - Triggered on click interaction with local country numbers list link\n- **contact-email-click** - Triggered on click interaction with \"Contact us by email\" link\n- **contact-chat-click** - Triggered on click interaction with \"Contact us by chat\" link\n- **quick-links-click** - Triggered on click interaction with a link within \"Quick Links\" category\n- **trending-click** - Triggered on click interaction with a link within \"Trending\" category\n- **about-sap-click** - Triggered on click interaction with a link within \"About SAP\" category\n- **site-information-click** - Triggered on click interaction with a link within \"Site Information\" category\n- **social-media-link-click** - Triggered on click interaction with any of the social media links within footer",
           "doc-url": "",
           "attributes": [
             {
@@ -2185,6 +2271,11 @@
               "name": "background-color",
               "description": "Allows control over the background color.\nValue provided should be compatible with standard CSS rendering, e.g:\n - HEX: \"#FFF\", \"#FFFFFF\", \"FFFFFFFF\"\n - RGB/A: \"rgb(255, 255, 255)\", \"rgba(255, 255, 255, 1)\"\n - HSL/A: \"hsl(0, 100%, 100%)\", \"hsla(0, 100%, 100%, 1\"\n - Variables: \"var(--sapShell_Background)\", \"var(--udexColorNeutralWhite)\"\n - Text values: \"white\", \"red\"",
               "value": { "type": "string | undefined" }
+            },
+            {
+              "name": "background-gradient",
+              "description": "Allows control over the background-image to set css gradient.\nValue provided should be compatible with standard CSS linear-gradient rendering, e.g:\n linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%);\n linear-gradient(to bottom, var(--udexColorBlue2) 0%,var(--udexColorBlue4) 100%);",
+              "value": { "type": "string | undefined" }
             }
           ],
           "slots": [
@@ -2230,6 +2321,11 @@
                 "name": "background-color",
                 "description": "Allows control over the background color.\nValue provided should be compatible with standard CSS rendering, e.g:\n - HEX: \"#FFF\", \"#FFFFFF\", \"FFFFFFFF\"\n - RGB/A: \"rgb(255, 255, 255)\", \"rgba(255, 255, 255, 1)\"\n - HSL/A: \"hsl(0, 100%, 100%)\", \"hsla(0, 100%, 100%, 1\"\n - Variables: \"var(--sapShell_Background)\", \"var(--udexColorNeutralWhite)\"\n - Text values: \"white\", \"red\"",
                 "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "background-gradient",
+                "description": "Allows control over the background-image to set css gradient.\nValue provided should be compatible with standard CSS linear-gradient rendering, e.g:\n linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%);\n linear-gradient(to bottom, var(--udexColorBlue2) 0%,var(--udexColorBlue4) 100%);",
+                "value": { "type": "string | undefined" }
               }
             ],
             "events": []
@@ -2237,7 +2333,7 @@
         },
         {
           "name": "udex-input-group",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-input-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/InputGroup.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for input elements items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-input-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/InputGroup.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for input elements items.",
           "doc-url": "",
           "attributes": [
             {
@@ -2302,7 +2398,7 @@
         },
         {
           "name": "udex-link",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-link</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Link.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-link</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Link.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2338,7 +2434,7 @@
         },
         {
           "name": "udex-list",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\\e\n\n<h3>Usage</h3>\n\nFor the <code>udex-list</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/List.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for list items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\\e\n\n<h3>Usage</h3>\n\nFor the <code>udex-list</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/List.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for list items.",
           "doc-url": "",
           "attributes": [
             {
@@ -2433,7 +2529,7 @@
         },
         {
           "name": "udex-list-group-header",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ListGroupHeader.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ListGroupHeader.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2565,9 +2661,19 @@
         },
         {
           "name": "udex-list-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ListItem.js\";</code>\n---\n\n\n### **Events:**\n - **item-press** - Fired event when the user click on a list item.\n- **item-focus** - Fired event when the user focuses on a list item.\n- **delete-press** - Fired event when the user click on the delete icon.\n- **edit-press** - Fired event when the user click on the edit icon.\n\n### **Slots:**\n - **default** - Slot for list item content.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ListItem.js\";</code>\n---\n\n\n### **Events:**\n - **item-press** - Fired event when the user click on a list item.\n- **item-focus** - Fired event when the user focuses on a list item.\n- **delete-press** - Fired event when the user click on the delete icon.\n- **edit-press** - Fired event when the user click on the edit icon.\n\n### **Slots:**\n - **default** - Slot for list item content.\n- **firstIcon** - Slot for first icon.\n- **secondIcon** - Slot for second icon.",
           "doc-url": "",
           "attributes": [
+            {
+              "name": "edit-icon",
+              "description": "Defines the name of the edit icon, displayed in the end of the list item.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "delete-icon",
+              "description": "Defines the name of the delete icon, displayed in the end of the list item.",
+              "value": { "type": "string" }
+            },
             {
               "name": "accessible-name",
               "description": "Defines the accessible name of the item.",
@@ -2615,16 +2721,6 @@
               "description": "Allows control over the size of the image.",
               "value": { "type": "\"XS\" | \"S\" | \"M\" | \"L\" | \"XL\"" }
             },
-            {
-              "name": "edit-icon",
-              "description": "Defines the name of the edit icon, displayed in the end of the list item.",
-              "value": { "type": "string | undefined" }
-            },
-            {
-              "name": "delete-icon",
-              "description": "Defines the name of the delete icon, displayed in the end of the list item.",
-              "value": { "type": "string | undefined" }
-            },
             {
               "name": "accessible-role",
               "description": "Defines the role attribute of component",
@@ -2687,7 +2783,9 @@
             }
           ],
           "slots": [
-            { "name": "default", "description": "Slot for list item content." }
+            { "name": "default", "description": "Slot for list item content." },
+            { "name": "firstIcon", "description": "Slot for first icon." },
+            { "name": "secondIcon", "description": "Slot for second icon." }
           ],
           "events": [
             {
@@ -2709,6 +2807,16 @@
           ],
           "js": {
             "properties": [
+              {
+                "name": "edit-icon",
+                "description": "Defines the name of the edit icon, displayed in the end of the list item.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "delete-icon",
+                "description": "Defines the name of the delete icon, displayed in the end of the list item.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "accessible-name",
                 "description": "Defines the accessible name of the item.",
@@ -2756,16 +2864,6 @@
                 "description": "Allows control over the size of the image.",
                 "value": { "type": "\"XS\" | \"S\" | \"M\" | \"L\" | \"XL\"" }
               },
-              {
-                "name": "edit-icon",
-                "description": "Defines the name of the edit icon, displayed in the end of the list item.",
-                "value": { "type": "string | undefined" }
-              },
-              {
-                "name": "delete-icon",
-                "description": "Defines the name of the delete icon, displayed in the end of the list item.",
-                "value": { "type": "string | undefined" }
-              },
               {
                 "name": "accessible-role",
                 "description": "Defines the role attribute of component",
@@ -2848,7 +2946,7 @@
         },
         {
           "name": "udex-list-select-all",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ListSelectAll.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-list-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ListSelectAll.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2978,9 +3076,108 @@
             "events": []
           }
         },
+        {
+          "name": "udex-masthead-country-selector",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>masthead-country-selector</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadCountrySelector.js\";</code>\n---\n\n\n### **Events:**\n - **region-item-click** - Fires when region item is clicked\n- **country-item-click** - Fires when region item is clicked\n- **country-selector-search** - Fired event when the user typed to search field.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "region-title",
+              "description": "Defines title of the regions menu",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "country-title",
+              "description": "Defines title of the countries menu",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "regions",
+              "description": "Defines the object of the regions",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "search-label",
+              "description": "Defines the label of the search",
+              "value": { "type": "string", "default": "\"en-US\"" }
+            },
+            {
+              "name": "show-search-voice-button",
+              "description": "Defines display the voice button for the search field.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "language-voice",
+              "description": "Defines the language voice of the search",
+              "value": { "type": "string", "default": "\"\"" }
+            }
+          ],
+          "events": [
+            {
+              "name": "region-item-click",
+              "description": "Fires when region item is clicked"
+            },
+            {
+              "name": "country-item-click",
+              "description": "Fires when region item is clicked"
+            },
+            {
+              "name": "country-selector-search",
+              "description": "Fired event when the user typed to search field."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "region-title",
+                "description": "Defines title of the regions menu",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "country-title",
+                "description": "Defines title of the countries menu",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "regions",
+                "description": "Defines the object of the regions",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "search-label",
+                "description": "Defines the label of the search",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "show-search-voice-button",
+                "description": "Defines display the voice button for the search field.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "language-voice",
+                "description": "Defines the language voice of the search",
+                "value": { "type": "string" }
+              }
+            ],
+            "events": [
+              {
+                "name": "region-item-click",
+                "description": "Fires when region item is clicked"
+              },
+              {
+                "name": "country-item-click",
+                "description": "Fires when region item is clicked"
+              },
+              {
+                "name": "country-selector-search",
+                "description": "Fired event when the user typed to search field."
+              }
+            ]
+          }
+        },
         {
           "name": "udex-masthead-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadItem.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n\n### **Slots:**\n - **dropdown** - Slot for the dropdown\n- **default** - Slot for any content",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadItem.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n- **dropdown-closed** - Fires when item is clicked\n- **dropdown-opened** - Fires when item is clicked\n\n### **Slots:**\n - **dropdown** - Slot for the dropdown\n- **default** - Slot for any content",
           "doc-url": "",
           "attributes": [
             {
@@ -3003,11 +3200,26 @@
               "description": "Defines the selected item.",
               "value": { "type": "boolean", "default": "false" }
             },
+            {
+              "name": "hide-arrow-icon",
+              "description": "Defines if the arrow icon is hidden.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             {
               "name": "icon",
               "description": "Defines the icon in the item.",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "image",
+              "description": "Defines the image in the item.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "image-alt",
+              "description": "Defines an alt text for item image",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "href",
               "description": "Defines the href of the item.",
@@ -3031,12 +3243,12 @@
             {
               "name": "icon-alt",
               "description": "Defines an alt text for item icon",
-              "value": { "type": "string | undefined", "default": "\"\"" }
+              "value": { "type": "string", "default": "\"\"" }
             },
             {
               "name": "hide-active-border",
               "description": "Hide active border for item",
-              "value": { "type": "boolean | undefined", "default": "\"\"" }
+              "value": { "type": "boolean", "default": "\"\"" }
             }
           ],
           "slots": [
@@ -3047,6 +3259,14 @@
             {
               "name": "item-click",
               "description": "Fires when item is clicked"
+            },
+            {
+              "name": "dropdown-closed",
+              "description": "Fires when item is clicked"
+            },
+            {
+              "name": "dropdown-opened",
+              "description": "Fires when item is clicked"
             }
           ],
           "js": {
@@ -3071,11 +3291,26 @@
                 "description": "Defines the selected item.",
                 "value": { "type": "boolean" }
               },
+              {
+                "name": "hide-arrow-icon",
+                "description": "Defines if the arrow icon is hidden.",
+                "value": { "type": "boolean" }
+              },
               {
                 "name": "icon",
                 "description": "Defines the icon in the item.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "image",
+                "description": "Defines the image in the item.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "image-alt",
+                "description": "Defines an alt text for item image",
+                "value": { "type": "string" }
+              },
               {
                 "name": "href",
                 "description": "Defines the href of the item.",
@@ -3099,25 +3334,33 @@
               {
                 "name": "icon-alt",
                 "description": "Defines an alt text for item icon",
-                "value": { "type": "string | undefined" }
+                "value": { "type": "string" }
               },
               {
                 "name": "hide-active-border",
                 "description": "Hide active border for item",
-                "value": { "type": "boolean | undefined" }
+                "value": { "type": "boolean" }
               }
             ],
             "events": [
               {
                 "name": "item-click",
                 "description": "Fires when item is clicked"
+              },
+              {
+                "name": "dropdown-closed",
+                "description": "Fires when item is clicked"
+              },
+              {
+                "name": "dropdown-opened",
+                "description": "Fires when item is clicked"
               }
             ]
           }
         },
         {
           "name": "udex-masthead-menu",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadMenu.js\";</code>\n---\n\n\n### **Events:**\n - **menu-item-click** - Fires when menu item is clicked",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadMenu.js\";</code>\n---\n\n\n### **Events:**\n - **menu-item-click** - Fires when menu item is clicked",
           "doc-url": "",
           "attributes": [
             {
@@ -3160,7 +3403,7 @@
         },
         {
           "name": "udex-masthead-mobile-menu",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-mobile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadMobileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n- **explorer-menu-click** - Fires when explorer menu button is clicked\n\n### **Slots:**\n - **search** - Slot for search\n- **default** - List of the menu items\n- **exploreSapMobileButton** - Slot for explore Sap mobile button",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-mobile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadMobileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n- **explorer-menu-click** - Fires when explorer menu button is clicked\n\n### **Slots:**\n - **search** - Slot for search\n- **default** - List of the menu items\n- **exploreSapMobileButton** - Slot for explore Sap mobile button",
           "doc-url": "",
           "attributes": [],
           "slots": [
@@ -3197,7 +3440,7 @@
         },
         {
           "name": "udex-masthead-profile-menu",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadProfileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile ment item is clicked\n\n### **Slots:**\n - **message** - Placeholder for message strip.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadProfileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile menu item is clicked\n\n### **Slots:**\n - **message** - Placeholder for message strip.",
           "doc-url": "",
           "attributes": [
             {
@@ -3229,7 +3472,7 @@
             },
             {
               "name": "profile-item-click",
-              "description": "Fires when profile ment item is clicked"
+              "description": "Fires when profile menu item is clicked"
             }
           ],
           "js": {
@@ -3257,14 +3500,14 @@
               },
               {
                 "name": "profile-item-click",
-                "description": "Fires when profile ment item is clicked"
+                "description": "Fires when profile menu item is clicked"
               }
             ]
           }
         },
         {
           "name": "udex-masthead-shell",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadShell.js\";</code>\n---\n\n\n### **Events:**\n - **mobile-menu-open** - Fired event when the user clicks the mobile menu button opener.\n- **mobile-menu-close** - Fired event when the user clicks the mobile menu button closer.\n- **search-click** - Fired event when the user clicks the search button trigger.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Slots:**\n - **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadShell.js\";</code>\n---\n\n\n### **Events:**\n - **mobile-menu-open** - Fired event when the user clicks the mobile menu button opener.\n- **mobile-menu-close** - Fired event when the user clicks the mobile menu button closer.\n- **search-click** - Fired event when the user clicks the search button trigger.\n- **search-close-click** - Fired event when the user clicks the search close button.\n- **search-opened** - Fired event when the search panel is opened.\n- **search-closed** - Fired event when the search panel is closed.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **country-selector-click** - Fired event when the user clicks the country selector button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Methods:**\n - **closeSearch(): _void_** - Close the search panel.\n- **openSearch(): _void_** - Open the search panel.\n- **openMobileMenu(): _void_** - Open the mobile menu panel.\n- **closeMobileMenu(): _void_** - Close the mobile menu panel.\n\n### **Slots:**\n - **countrySelector** - Slot for country selector item.\n- **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
           "doc-url": "",
           "attributes": [
             {
@@ -3315,7 +3558,7 @@
             {
               "name": "close-button-accessible-name",
               "description": "Defines an accessible name for close icon for the search bar\n\ndefault: \"\"",
-              "value": { "type": "string | undefined" }
+              "value": { "type": "string" }
             },
             {
               "name": "homepage-aria-label",
@@ -3329,6 +3572,10 @@
             }
           ],
           "slots": [
+            {
+              "name": "countrySelector",
+              "description": "Slot for country selector item."
+            },
             { "name": "mobileMenu", "description": "Slot for mobile menu" },
             { "name": "default", "description": "Slot for main menu items." },
             {
@@ -3355,6 +3602,18 @@
               "name": "search-click",
               "description": "Fired event when the user clicks the search button trigger."
             },
+            {
+              "name": "search-close-click",
+              "description": "Fired event when the user clicks the search close button."
+            },
+            {
+              "name": "search-opened",
+              "description": "Fired event when the search panel is opened."
+            },
+            {
+              "name": "search-closed",
+              "description": "Fired event when the search panel is closed."
+            },
             {
               "name": "cart-click",
               "description": "Fired event when the user clicks the cart button trigger."
@@ -3363,6 +3622,10 @@
               "name": "profile-click",
               "description": "Fired event when the user clicks the profile button trigger."
             },
+            {
+              "name": "country-selector-click",
+              "description": "Fired event when the user clicks the country selector button trigger."
+            },
             {
               "name": "logo-click",
               "description": "Fired event when the user clicks the logo."
@@ -3422,7 +3685,7 @@
               {
                 "name": "close-button-accessible-name",
                 "description": "Defines an accessible name for close icon for the search bar\n\ndefault: \"\"",
-                "value": { "type": "string | undefined" }
+                "value": { "type": "string" }
               },
               {
                 "name": "homepage-aria-label",
@@ -3448,6 +3711,18 @@
                 "name": "search-click",
                 "description": "Fired event when the user clicks the search button trigger."
               },
+              {
+                "name": "search-close-click",
+                "description": "Fired event when the user clicks the search close button."
+              },
+              {
+                "name": "search-opened",
+                "description": "Fired event when the search panel is opened."
+              },
+              {
+                "name": "search-closed",
+                "description": "Fired event when the search panel is closed."
+              },
               {
                 "name": "cart-click",
                 "description": "Fired event when the user clicks the cart button trigger."
@@ -3456,6 +3731,10 @@
                 "name": "profile-click",
                 "description": "Fired event when the user clicks the profile button trigger."
               },
+              {
+                "name": "country-selector-click",
+                "description": "Fired event when the user clicks the country selector button trigger."
+              },
               {
                 "name": "logo-click",
                 "description": "Fired event when the user clicks the logo."
@@ -3469,7 +3748,7 @@
         },
         {
           "name": "udex-media-player",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MediaPlayer.js\";</code>\n---\n\n\n### **Events:**\n - **videoStart** - Fires when video is played\n- **videoPause** - Fires when video is paused\n- **videoComplete** - Fires when video is watched\n- **videoReady** - Fires when video is ready\n- **videoProgress** - Fires when video watching progress changed\n- **video25** - Fires when 25% of video is watched\n- **video50** - Fires when 50% of video is watched\n- **video75** - Fires when 75% of video is watched\n\n### **Methods:**\n - **getPlayer(): _HTMLVideoElement | HTMLAudioElement | YT.Player | VimeoPlayer | null_** - Returns video element\n\n### **Slots:**\n - **default** - Placeholder for all html `track` elements to provide video subtitles.\nExample: `<track kind='captions' src='./videoSubtitles.vtt' srclang='en' label='English' default />`\nMore information: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MediaPlayer.js\";</code>\n---\n\n\n### **Events:**\n - **videoStart** - Fires when video is played\n- **videoPause** - Fires when video is paused\n- **videoComplete** - Fires when video is watched\n- **videoReady** - Fires when video is ready\n- **videoProgress** - Fires when video watching progress changed\n- **video25** - Fires when 25% of video is watched\n- **video50** - Fires when 50% of video is watched\n- **video75** - Fires when 75% of video is watched\n\n### **Methods:**\n - **getPlayer(): _HTMLVideoElement | HTMLAudioElement | YT.Player | VimeoPlayer | null_** - Returns video element\n\n### **Slots:**\n - **default** - Placeholder for all html `track` elements to provide video subtitles.\nExample: `<track kind='captions' src='./videoSubtitles.vtt' srclang='en' label='English' default />`\nMore information: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track",
           "doc-url": "",
           "attributes": [
             {
@@ -3679,7 +3958,7 @@
         },
         {
           "name": "udex-media-player-vimeo",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player-vimeo</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MediaPlayerVimeo.js\";</code>\n---\n\n\n### **Events:**\n - **ready** - Fires when video is ready\n- **ended** - Fires when video play ended\n- **pause** - Fires when video is paused\n- **playing** - Fires when video watching progress changed\n\n### **Methods:**\n - **getPlayer(): _VimeoPlayer_** - Returns video element",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player-vimeo</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MediaPlayerVimeo.js\";</code>\n---\n\n\n### **Events:**\n - **ready** - Fires when video is ready\n- **ended** - Fires when video play ended\n- **pause** - Fires when video is paused\n- **playing** - Fires when video watching progress changed\n\n### **Methods:**\n - **getPlayer(): _VimeoPlayer_** - Returns video element",
           "doc-url": "",
           "attributes": [
             {
@@ -3768,7 +4047,7 @@
         },
         {
           "name": "udex-media-player-youtube",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player-youtube</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MediaPlayerYoutube.js\";</code>\n---\n\n\n### **Events:**\n - **ready** - Fires when video is ready\n- **ended** - Fires when video play ended\n- **pause** - Fires when video is paused\n- **playing** - Fires when video watching progress changed\n\n### **Methods:**\n - **getPlayer(): _YT.Player | null_** - Returns video element",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-media-player-youtube</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MediaPlayerYoutube.js\";</code>\n---\n\n\n### **Events:**\n - **ready** - Fires when video is ready\n- **ended** - Fires when video play ended\n- **pause** - Fires when video is paused\n- **playing** - Fires when video watching progress changed\n\n### **Methods:**\n - **getPlayer(): _YT.Player | null_** - Returns video element",
           "doc-url": "",
           "attributes": [
             {
@@ -4020,9 +4299,14 @@
         },
         {
           "name": "udex-password-field",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-password-field</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/UDExPasswordField.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-password-field</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/UDExPasswordField.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
+            {
+              "name": "autocomplete",
+              "description": "Defines the behaviour of autocomplete.",
+              "value": { "type": "\"on\" | \"off\"" }
+            },
             {
               "name": "disabled",
               "description": "Defines whether the component is in disabled state.\n<br><br>\n<b>Note:</b> A disabled component is completely noninteractive.",
@@ -4092,6 +4376,11 @@
           "events": [],
           "js": {
             "properties": [
+              {
+                "name": "autocomplete",
+                "description": "Defines the behaviour of autocomplete.",
+                "value": { "type": "\"on\" | \"off\"" }
+              },
               {
                 "name": "disabled",
                 "description": "Defines whether the component is in disabled state.\n<br><br>\n<b>Note:</b> A disabled component is completely noninteractive.",
@@ -4317,7 +4606,7 @@
         },
         {
           "name": "udex-progress-bar",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-progress-bar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ProgressBar.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-progress-bar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ProgressBar.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -4389,7 +4678,7 @@
         },
         {
           "name": "udex-radio-button",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-radio-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/RadioButton.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-radio-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/RadioButton.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -4412,7 +4701,7 @@
         },
         {
           "name": "udex-range-slider",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-range-slider</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/RangeSlider.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-range-slider</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/RangeSlider.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -4420,7 +4709,7 @@
         },
         {
           "name": "udex-rating-bar",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-rating-bar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/RatingBar.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-rating-bar</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/RatingBar.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -4463,7 +4752,7 @@
         },
         {
           "name": "udex-rating-indicator",
-          "description": "### Overview\n\n### ES6 Module Import\n\n`import @udex/web-components/dist/RatingIndicator.js\";`\n---\n",
+          "description": "### Overview\n\n### ES6 Module Import\n\n`import @sapudex/web-components/dist/RatingIndicator.js\";`\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -4499,7 +4788,7 @@
         },
         {
           "name": "udex-review",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-review</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Review.js\";</code>\n---\n\n\n### **Slots:**\n - **reviewButton** - Slot for a button for writing a review.\n- **defaultText** - Slot for the default text when there are no reviews or rating.\n- **default** - Slot for rating bars.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-review</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Review.js\";</code>\n---\n\n\n### **Slots:**\n - **reviewButton** - Slot for a button for writing a review.\n- **defaultText** - Slot for the default text when there are no reviews or rating.\n- **default** - Slot for rating bars.",
           "doc-url": "",
           "attributes": [
             {
@@ -4543,7 +4832,7 @@
         },
         {
           "name": "udex-review-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-review-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/ReviewItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-review-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/ReviewItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -4596,7 +4885,7 @@
         },
         {
           "name": "udex-search",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-search</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Search.js\";</code>\n---\n\n\n### **Events:**\n - **submit-search-value** - Fired event when the user submitted the value.\n- **handle-value-search** - Fired event when the user typed to search field.\n- **handle-value-reset** - Fired event when the user clicks on the reset button.\n- **handle-close-search** - Fired event when the user presses escape in search field.\n- **dropdown-item-click** - Fired event when the user clicks on the item inside the popover.\n- **prefix-item-click** - Fired event when the user clicks on the intem inside the prefix dropdown.\n\n### **Slots:**\n - **default** - Defines the prefix dropdown of the Search component.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-search</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Search.js\";</code>\n---\n\n\n### **Events:**\n - **submit-search-value** - Fired event when the user submitted the value.\n- **handle-value-search** - Fired event when the user typed to search field.\n- **handle-value-reset** - Fired event when the user clicks on the reset button.\n- **handle-close-search** - Fired event when the user presses escape in search field.\n- **dropdown-item-click** - Fired event when the user clicks on the item inside the popover.\n- **prefix-item-click** - Fired event when the user clicks on the intem inside the prefix dropdown.\n\n### **Slots:**\n - **default** - Defines the prefix dropdown of the Search component.",
           "doc-url": "",
           "attributes": [
             {
@@ -4855,7 +5144,7 @@
         },
         {
           "name": "udex-secondary-navigation",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-secondary-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SecondaryNavigation.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n\n### **Slots:**\n - **breadcrumbs** - Slot for breadcrumbs.\n- **buttons** - Slot for action buttons.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-secondary-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SecondaryNavigation.js\";</code>\n---\n\n\n### **Events:**\n - **item-click** - Fires when item is clicked\n\n### **Slots:**\n - **breadcrumbs** - Slot for breadcrumbs.\n- **buttons** - Slot for action buttons.",
           "doc-url": "",
           "attributes": [
             {
@@ -4877,6 +5166,11 @@
               "name": "title-href",
               "description": "Defines the href of the title.",
               "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "max-dropdown-height",
+              "description": "Defines the height of the dropdown opened on mobile screen.",
+              "value": { "type": "string" }
             }
           ],
           "slots": [
@@ -4910,6 +5204,11 @@
                 "name": "title-href",
                 "description": "Defines the href of the title.",
                 "value": { "type": "string" }
+              },
+              {
+                "name": "max-dropdown-height",
+                "description": "Defines the height of the dropdown opened on mobile screen.",
+                "value": { "type": "string" }
               }
             ],
             "events": [
@@ -4922,14 +5221,9 @@
         },
         {
           "name": "udex-secondary-navigation-sub-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-secondary-navigation-sub-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SecondaryNavigationSubItem.js\";</code>\n---\n\n\n### **Events:**\n - **sub-item-click** - Fires when item is clicked\n- **back-item-click** - Fires when back item is clicked",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-secondary-navigation-sub-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SecondaryNavigationSubItem.js\";</code>\n---\n\n\n### **Events:**\n - **sub-item-click** - Fires when item is clicked\n- **back-item-click** - Fires when back item is clicked",
           "doc-url": "",
           "attributes": [
-            {
-              "name": "is-active",
-              "description": "Defines active item.",
-              "value": { "type": "boolean", "default": "false" }
-            },
             {
               "name": "is-back",
               "description": "Defines back item.",
@@ -4983,11 +5277,6 @@
           ],
           "js": {
             "properties": [
-              {
-                "name": "is-active",
-                "description": "Defines active item.",
-                "value": { "type": "boolean" }
-              },
               {
                 "name": "is-back",
                 "description": "Defines back item.",
@@ -5043,7 +5332,7 @@
         },
         {
           "name": "udex-segmented-button",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-segmented-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SegmentedButton.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-segmented-button</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SegmentedButton.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5069,7 +5358,7 @@
         },
         {
           "name": "udex-segmented-button-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-segmented-button-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SegmentedButtonItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-segmented-button-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SegmentedButtonItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5095,7 +5384,7 @@
         },
         {
           "name": "udex-select-box",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/UDExSelectBox.js\";</code>\n---\n\n\n### **Events:**\n - **remove** - Fired event when the user clicks on the reset button in the search.\n- **show-more** - Fired event when the user clicks on the More button.\n- **selection-change** - \n- **select-all** - Fired event when the user clicks on the Select All header.\n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **change-search** - Fired event when the user submitted the value in the search.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/UDExSelectBox.js\";</code>\n---\n\n\n### **Events:**\n - **remove** - Fired event when the user clicks on the reset button in the search.\n- **show-more** - Fired event when the user clicks on the More button.\n- **selection-change** - \n- **select-all** - Fired event when the user clicks on the Select All header.\n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **change-search** - Fired event when the user submitted the value in the search.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.",
           "doc-url": "",
           "attributes": [
             {
@@ -5164,6 +5453,16 @@
                 "default": "\"Bottom\""
               }
             },
+            {
+              "name": "busy",
+              "description": "Defines if the component would display a loading indicator.",
+              "value": { "type": "boolean | undefined", "default": "false" }
+            },
+            {
+              "name": "busy-delay",
+              "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+              "value": { "type": "number | undefined", "default": "1000" }
+            },
             {
               "name": "no-result-text",
               "description": "Defines the \"no result\" text of the component.",
@@ -5191,6 +5490,11 @@
                 "type": "\"SingleSelect\" | \"MultiSelect\" | \"SingleContent\" | \"RadioGroup\"",
                 "default": "\"SingleSelect\""
               }
+            },
+            {
+              "name": "default-accessible-role",
+              "description": "Defines the default accessible role for the list componnet.",
+              "value": { "type": "string", "default": "\"list\"" }
             }
           ],
           "events": [
@@ -5286,6 +5590,16 @@
                   "type": "\"Left\" | \"Right\" | \"Top\" | \"Bottom\""
                 }
               },
+              {
+                "name": "busy",
+                "description": "Defines if the component would display a loading indicator.",
+                "value": { "type": "boolean | undefined" }
+              },
+              {
+                "name": "busy-delay",
+                "description": "Defines the delay in milliseconds, after which the busy indicator will show up for this component.",
+                "value": { "type": "number | undefined" }
+              },
               {
                 "name": "no-result-text",
                 "description": "Defines the \"no result\" text of the component.",
@@ -5312,6 +5626,11 @@
                 "value": {
                   "type": "\"SingleSelect\" | \"MultiSelect\" | \"SingleContent\" | \"RadioGroup\""
                 }
+              },
+              {
+                "name": "default-accessible-role",
+                "description": "Defines the default accessible role for the list componnet.",
+                "value": { "type": "string" }
               }
             ],
             "events": [
@@ -5345,7 +5664,7 @@
         },
         {
           "name": "udex-select-box-group-header",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SelectBoxGroupHeader.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for dropdown list items.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-group-header</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SelectBoxGroupHeader.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for dropdown list items.",
           "doc-url": "",
           "attributes": [
             {
@@ -5483,7 +5802,7 @@
         },
         {
           "name": "udex-select-box-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SelectBoxItem.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for item content.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SelectBoxItem.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for item content.",
           "doc-url": "",
           "attributes": [
             {
@@ -5608,7 +5927,7 @@
         },
         {
           "name": "udex-select-box-select-all",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SelectBoxSelectAll.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-select-box-select-all</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SelectBoxSelectAll.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5740,7 +6059,7 @@
         },
         {
           "name": "udex-side-navigation",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SideNavigation.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SideNavigation.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5763,7 +6082,7 @@
         },
         {
           "name": "udex-side-navigation-group",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SideNavigationGroup.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SideNavigationGroup.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -5771,7 +6090,7 @@
         },
         {
           "name": "udex-side-navigation-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SideNavigationItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SideNavigationItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -5779,7 +6098,7 @@
         },
         {
           "name": "udex-side-navigation-mobile",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-mobile</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SideNavigation.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the main items of the `ui5-side-navigation`. Use the `ui5-side-navigation-item` component\nfor the top-level items, and the `ui5-side-navigation-sub-item` component for second-level items, nested\ninside the items.\n- **fixedItems** - Defines the fixed items at the bottom of the `ui5-side-navigation`. Use the `ui5-side-navigation-item` component\nfor the fixed items, and optionally the `ui5-side-navigation-sub-item` component to provide second-level items inside them.\n\n**Note:** In order to achieve the best user experience, it is recommended that you keep the fixed items \"flat\" (do not pass sub-items)",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-mobile</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SideNavigation.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the main items of the `ui5-side-navigation`. Use the `ui5-side-navigation-item` component\nfor the top-level items, and the `ui5-side-navigation-sub-item` component for second-level items, nested\ninside the items.\n- **fixedItems** - Defines the fixed items at the bottom of the `ui5-side-navigation`. Use the `ui5-side-navigation-item` component\nfor the fixed items, and optionally the `ui5-side-navigation-sub-item` component to provide second-level items inside them.\n\n**Note:** In order to achieve the best user experience, it is recommended that you keep the fixed items \"flat\" (do not pass sub-items)",
           "doc-url": "",
           "attributes": [],
           "slots": [
@@ -5797,7 +6116,7 @@
         },
         {
           "name": "udex-side-navigation-sub-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-sub-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/SideNavigationSubItem.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-side-navigation-sub-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/SideNavigationSubItem.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -5805,7 +6124,7 @@
         },
         {
           "name": "udex-slider",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-slider</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Slider.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-slider</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Slider.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -5813,7 +6132,7 @@
         },
         {
           "name": "udex-status-badge",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-status-badge</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/StatusBadge.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-status-badge</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/StatusBadge.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5864,7 +6183,7 @@
         },
         {
           "name": "udex-status-message",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-status-message</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/StatusMessage.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-status-message</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/StatusMessage.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -5922,7 +6241,7 @@
         },
         {
           "name": "udex-step-input",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-step-input</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/StepInput.js\";</code>\n---\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-step-input</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/StepInput.js\";</code>\n---\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.",
           "doc-url": "",
           "attributes": [
             {
@@ -6098,7 +6417,7 @@
         },
         {
           "name": "udex-switch",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-switch</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Switch.js\";</code>\n---\n\n\n### **Events:**\n - **change** - Fired when the component checked state changes.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-switch</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Switch.js\";</code>\n---\n\n\n### **Events:**\n - **change** - Fired when the component checked state changes.",
           "doc-url": "",
           "attributes": [
             {
@@ -6194,7 +6513,7 @@
         },
         {
           "name": "udex-tab",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tab</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Tab.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the content of the tab.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tab</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Tab.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the content of the tab.",
           "doc-url": "",
           "attributes": [
             {
@@ -6297,7 +6616,7 @@
         },
         {
           "name": "udex-tab-navigation",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-tab-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TabNavigation.js\";</code>\n---\n\n\n### **Events:**\n - **click** - Fires when the tab was clicked.\n\n### **Slots:**\n - **default** - Defines the tabs and content.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-tab-navigation</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TabNavigation.js\";</code>\n---\n\n\n### **Events:**\n - **click** - Fires when the tab was clicked.\n\n### **Slots:**\n - **default** - Defines the tabs and content.",
           "doc-url": "",
           "attributes": [
             {
@@ -6359,7 +6678,7 @@
         },
         {
           "name": "udex-table",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-table</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Table.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the rows of the table.\n- **headerRow** - Defines the header row of the table.\n- **actions** - Defines the actions of the table.\n- **noData** - Defines the custom visualization if there is no data available.\n- **footnotes** - Defines the footnotes of the table.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-table</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Table.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the rows of the table.\n- **headerRow** - Defines the header row of the table.\n- **actions** - Defines the actions of the table.\n- **noData** - Defines the custom visualization if there is no data available.\n- **footnotes** - Defines the footnotes of the table.",
           "doc-url": "",
           "attributes": [
             {
@@ -6401,6 +6720,11 @@
               "name": "sticky-column",
               "description": "Sticks the first column to the left of the table.",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "custom-columns",
+              "description": "Defines the rows of the table.",
+              "value": { "type": "string" }
             }
           ],
           "slots": [
@@ -6467,6 +6791,11 @@
                 "name": "sticky-column",
                 "description": "Sticks the first column to the left of the table.",
                 "value": { "type": "boolean" }
+              },
+              {
+                "name": "custom-columns",
+                "description": "Defines the rows of the table.",
+                "value": { "type": "string" }
               }
             ],
             "events": []
@@ -6474,7 +6803,7 @@
         },
         {
           "name": "udex-table-cell",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-cell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TableCell.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-cell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TableCell.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -6512,7 +6841,7 @@
         },
         {
           "name": "udex-table-group-row",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-group-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TableGroupRow.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the rows of the group row.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-group-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TableGroupRow.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the rows of the group row.",
           "doc-url": "",
           "attributes": [
             {
@@ -6561,7 +6890,7 @@
         },
         {
           "name": "udex-table-header-cell",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-header-cell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TableHeaderCell.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-header-cell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TableHeaderCell.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -6619,7 +6948,7 @@
         },
         {
           "name": "udex-table-header-row",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-header-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TableHeaderRow.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-header-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TableHeaderRow.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -6627,7 +6956,7 @@
         },
         {
           "name": "udex-table-row",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TableRow.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-table-row</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TableRow.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -6650,7 +6979,7 @@
         },
         {
           "name": "udex-tag",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tag</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Tag.js\";</code>\n---\n\n\n### **Events:**\n - **selectionChange** - Emitted when tag was clicked\n- **iconClick** - Emitted when icon in tag was clicked\n- **tagLinkClick** - Emitted when tag link was clicked",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tag</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Tag.js\";</code>\n---\n\n\n### **Events:**\n - **selectionChange** - Emitted when tag was clicked\n- **iconClick** - Emitted when icon in tag was clicked\n- **tagLinkClick** - Emitted when tag link was clicked",
           "doc-url": "",
           "attributes": [
             {
@@ -6800,7 +7129,7 @@
         },
         {
           "name": "udex-tag-group",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tag-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/TagGroup.js\";</code>\n---\n\n\n### **Events:**\n - **tag-click** - Emitted when tag was clicked\n- **tag-icon-click** - Emitted when icon in tag was clicked\n- **show-more-tags** - Emitted when the tooltip was opened, can be canceled\n- **tag-keydown** - Emitted  when a keydown event occurs on a tag, can be canceled\nEmitted custom event with keycode and tag details\n\n### **Slots:**\n - **default** - Defines the tags.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-tag-group</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/TagGroup.js\";</code>\n---\n\n\n### **Events:**\n - **tag-click** - Emitted when tag was clicked\n- **tag-icon-click** - Emitted when icon in tag was clicked\n- **show-more-tags** - Emitted when the tooltip was opened, can be canceled\n- **tag-keydown** - Emitted  when a keydown event occurs on a tag, can be canceled\nEmitted custom event with keycode and tag details\n\n### **Slots:**\n - **default** - Defines the tags.",
           "doc-url": "",
           "attributes": [
             {
@@ -7061,7 +7390,7 @@
         },
         {
           "name": "udex-text-field",
-          "description": "\n---\n\n\n### **Events:**\n - **click-trigger** - Fired event when the user clicks the trigger.\n- **input** - Fired when the value of the component changes at each keystroke.\n- **change** - Fired when the input operation has finished by pressing Enter or on focusout.",
+          "description": "\n---\n\n\n### **Events:**\n - **input** - Fired when the value of the component changes at each keystroke.\n- **change** - Fired when the input operation has finished by pressing Enter or on focusout.",
           "doc-url": "",
           "attributes": [
             {
@@ -7137,6 +7466,11 @@
               "description": "Defines if the text-field is active",
               "value": { "type": "boolean", "default": "false" }
             },
+            {
+              "name": "autocomplete",
+              "description": "Defines the behaviour of autocomplete.",
+              "value": { "type": "string", "default": "\"off\"" }
+            },
             {
               "name": "direction",
               "description": "Defines direction of the input.",
@@ -7149,10 +7483,6 @@
             }
           ],
           "events": [
-            {
-              "name": "click-trigger",
-              "description": "Fired event when the user clicks the trigger."
-            },
             {
               "name": "input",
               "description": "Fired when the value of the component changes at each keystroke."
@@ -7236,6 +7566,11 @@
                 "description": "Defines if the text-field is active",
                 "value": { "type": "boolean" }
               },
+              {
+                "name": "autocomplete",
+                "description": "Defines the behaviour of autocomplete.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "direction",
                 "description": "Defines direction of the input.",
@@ -7248,10 +7583,6 @@
               }
             ],
             "events": [
-              {
-                "name": "click-trigger",
-                "description": "Fired event when the user clicks the trigger."
-              },
               {
                 "name": "input",
                 "description": "Fired when the value of the component changes at each keystroke."
@@ -7344,7 +7675,7 @@
         },
         {
           "name": "udex-toast",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-toast</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Toast.js\";</code>\n---\n\n\n### **Events:**\n - **close** - Emit when close icon was clicked",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-toast</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Toast.js\";</code>\n---\n\n\n### **Events:**\n - **close** - Emit when close icon was clicked",
           "doc-url": "",
           "attributes": [
             {
@@ -7402,7 +7733,7 @@
         },
         {
           "name": "udex-tooltip",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-tooltip</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Tooltip.js\";</code>\n---\n\n\n### **Methods:**\n - **isOpen(): _boolean_** - Returns whether the tooltip is currently open.\n- **onOpen(opener: _HTMLElement_): _void_** - Used to open tooltip\n- **onClose(): _void_** - Used to close tooltip\n\n### **Slots:**\n - **default** - Defines the content of the component.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n<h3>Usage</h3>\n\nFor the <code>udex-tooltip</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Tooltip.js\";</code>\n---\n\n\n### **Methods:**\n - **isOpen(): _boolean_** - Returns whether the tooltip is currently open.\n- **onOpen(opener: _HTMLElement_): _void_** - Used to open tooltip\n- **onClose(): _void_** - Used to close tooltip\n\n### **Slots:**\n - **default** - Defines the content of the component.",
           "doc-url": "",
           "attributes": [
             {
@@ -7562,7 +7893,7 @@
         },
         {
           "name": "udex-upload",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-upload</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Upload.js\";</code>\n---\n\n\n### **Events:**\n - **file-size-exceed** - Triggered when the uploaded file exceeds the maximum allowed size.\n- **file-delete** - Triggered when the user deletes the uploaded item.\n- **file-change** - Triggered when the user uploads the item.\n\n### **Slots:**\n - **default** - Defines the uploaded files.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-upload</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Upload.js\";</code>\n---\n\n\n### **Events:**\n - **file-size-exceed** - Triggered when the uploaded file exceeds the maximum allowed size.\n- **file-delete** - Triggered when the user deletes the uploaded item.\n- **file-change** - Triggered when the user uploads the item.\n- **file-duplicate** - Triggered when the user attempts to upload a duplicate file.\n- **change** - Triggered when the user attempts to upload a file.\n\n### **Slots:**\n - **default** - Defines the uploaded files.",
           "doc-url": "",
           "attributes": [
             {
@@ -7621,6 +7952,14 @@
             {
               "name": "file-change",
               "description": "Triggered when the user uploads the item."
+            },
+            {
+              "name": "file-duplicate",
+              "description": "Triggered when the user attempts to upload a duplicate file."
+            },
+            {
+              "name": "change",
+              "description": "Triggered when the user attempts to upload a file."
             }
           ],
           "js": {
@@ -7678,13 +8017,21 @@
               {
                 "name": "file-change",
                 "description": "Triggered when the user uploads the item."
+              },
+              {
+                "name": "file-duplicate",
+                "description": "Triggered when the user attempts to upload a duplicate file."
+              },
+              {
+                "name": "change",
+                "description": "Triggered when the user attempts to upload a file."
               }
             ]
           }
         },
         {
           "name": "udex-upload-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-upload-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/UploadItem.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for information about the uploaded file.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-upload-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/UploadItem.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for information about the uploaded file.",
           "doc-url": "",
           "attributes": [
             {
@@ -7746,7 +8093,7 @@
         },
         {
           "name": "udex-wizard",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Wizard.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Wizard.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -7769,7 +8116,7 @@
         },
         {
           "name": "udex-wizard-step",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard-step</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/WizardStep.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard-step</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/WizardStep.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -7792,7 +8139,7 @@
         },
         {
           "name": "udex-wizard-tab",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/Wizard.js\";</code>\n---\n",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-wizard</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/Wizard.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {