@sapudex/web-components 0.117.1 → 0.138.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.117.1",
+  "version": "0.138.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 \"@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.",
           "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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
@@ -54,7 +54,7 @@
             },
             {
               "name": "title",
-              "description": "Defines the title of the accordion item component.",
+              "description": "Defines the title of the accordion item component.\nTODO: With transition to UI5 2.x, change \"title\" attribute name.\nTitle property is also valid HTML attribute that results in showing hover tooltip and is read by screen readers.",
               "value": { "type": "string", "default": "\"\"" }
             },
             {
@@ -89,7 +89,7 @@
               },
               {
                 "name": "title",
-                "description": "Defines the title of the accordion item component.",
+                "description": "Defines the title of the accordion item component.\nTODO: With transition to UI5 2.x, change \"title\" attribute name.\nTitle property is also valid HTML attribute that results in showing hover tooltip and is read by screen readers.",
                 "value": { "type": "string" }
               },
               {
@@ -245,6 +245,14 @@
             "events": []
           }
         },
+        {
+          "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",
+          "doc-url": "",
+          "attributes": [],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
         {
           "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.",
@@ -469,7 +477,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 \"@udex/web-components/dist/Checkbox.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [],
           "events": [],
@@ -513,7 +521,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.",
+          "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.",
           "doc-url": "",
           "attributes": [
             {
@@ -571,6 +579,19 @@
               "description": "Defines the placeholder of the search.",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "value-state",
+              "description": "Defines the value state of the component.",
+              "value": {
+                "type": "\"Success\" | \"Error\" | \"Warning\" | \"Standard\"",
+                "default": "\"Standard\""
+              }
+            },
+            {
+              "name": "supporting-text",
+              "description": "Defines supporting text under the country selector.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "hide-flag-images",
               "value": { "type": "boolean | undefined" }
@@ -691,6 +712,18 @@
                 "description": "Defines the placeholder of the search.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "value-state",
+                "description": "Defines the value state of the component.",
+                "value": {
+                  "type": "\"Success\" | \"Error\" | \"Warning\" | \"Standard\""
+                }
+              },
+              {
+                "name": "supporting-text",
+                "description": "Defines supporting text under the country selector.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "hide-flag-images",
                 "value": { "type": "boolean | undefined" }
@@ -941,7 +974,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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
@@ -975,9 +1008,14 @@
               "description": "Allows setting a custom role.",
               "value": {
                 "type": "\"None\" | \"Dialog\" | \"AlertDialog\"",
-                "default": "\"Dialog\""
+                "default": "\"None\""
               }
             },
+            {
+              "name": "trigger-accessible-role",
+              "description": "Allows setting a custom role for dropdown trigger.",
+              "value": { "type": "string", "default": "\"combobox\"" }
+            },
             {
               "name": "open",
               "description": "Indicates if the dropdown pane is open",
@@ -1060,6 +1098,11 @@
                 "description": "Allows setting a custom role.",
                 "value": { "type": "\"None\" | \"Dialog\" | \"AlertDialog\"" }
               },
+              {
+                "name": "trigger-accessible-role",
+                "description": "Allows setting a custom role for dropdown trigger.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "open",
                 "description": "Indicates if the dropdown pane is open",
@@ -1184,9 +1227,14 @@
               "description": "Allows setting a custom role.",
               "value": {
                 "type": "\"None\" | \"Dialog\" | \"AlertDialog\"",
-                "default": "\"Dialog\""
+                "default": "\"None\""
               }
             },
+            {
+              "name": "trigger-accessible-role",
+              "description": "Allows setting a custom role for dropdown trigger.",
+              "value": { "type": "string", "default": "\"combobox\"" }
+            },
             {
               "name": "no-result-text",
               "description": "Defines the \"no result\" text of the component.",
@@ -1334,6 +1382,11 @@
                 "description": "Allows setting a custom role.",
                 "value": { "type": "\"None\" | \"Dialog\" | \"AlertDialog\"" }
               },
+              {
+                "name": "trigger-accessible-role",
+                "description": "Allows setting a custom role for dropdown trigger.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "no-result-text",
                 "description": "Defines the \"no result\" text of the component.",
@@ -1799,9 +1852,14 @@
         },
         {
           "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 \"@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",
           "doc-url": "",
           "attributes": [
+            {
+              "name": "logo-title",
+              "description": "Defines the Logo default title",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "logo-url",
               "description": "Defines the Logo URL",
@@ -1861,6 +1919,11 @@
               "name": "logo-alt",
               "description": "Alt for Logo",
               "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "logo-aria-label",
+              "description": "Defines an aria label for the logo link",
+              "value": { "type": "string" }
             }
           ],
           "events": [
@@ -1911,6 +1974,11 @@
           ],
           "js": {
             "properties": [
+              {
+                "name": "logo-title",
+                "description": "Defines the Logo default title",
+                "value": { "type": "string" }
+              },
               {
                 "name": "logo-url",
                 "description": "Defines the Logo URL",
@@ -1970,6 +2038,11 @@
                 "name": "logo-alt",
                 "description": "Alt for Logo",
                 "value": { "type": "string" }
+              },
+              {
+                "name": "logo-aria-label",
+                "description": "Defines an aria label for the logo link",
+                "value": { "type": "string" }
               }
             ],
             "events": [
@@ -2171,7 +2244,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 \"@udex/web-components/dist/Link.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2207,7 +2280,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 \"@udex/web-components/dist/List.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Slot for list items.",
           "doc-url": "",
           "attributes": [
             {
@@ -2302,7 +2375,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 \"@udex/web-components/dist/ListGroupHeader.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2434,13 +2507,13 @@
         },
         {
           "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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
               "name": "accessible-name",
               "description": "Defines the accessible name of the item.",
-              "value": { "type": "string | undefined" }
+              "value": { "type": "string | undefined", "default": "\"\"" }
             },
             {
               "name": "flag-position",
@@ -2717,7 +2790,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 \"@udex/web-components/dist/ListSelectAll.js\";</code>\n---\n",
           "doc-url": "",
           "attributes": [
             {
@@ -2849,7 +2922,7 @@
         },
         {
           "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 - **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 \"@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",
           "doc-url": "",
           "attributes": [
             {
@@ -2913,7 +2986,10 @@
             { "name": "default", "description": "Slot for any content" }
           ],
           "events": [
-            { "name": "click", "description": "Fires when item is clicked" }
+            {
+              "name": "item-click",
+              "description": "Fires when item is clicked"
+            }
           ],
           "js": {
             "properties": [
@@ -2974,13 +3050,16 @@
               }
             ],
             "events": [
-              { "name": "click", "description": "Fires when item is clicked" }
+              {
+                "name": "item-click",
+                "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",
+          "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",
           "doc-url": "",
           "attributes": [
             {
@@ -2994,142 +3073,36 @@
               "value": { "type": "string", "default": "\"[]\"" }
             }
           ],
-          "events": [],
-          "js": {
-            "properties": [
-              {
-                "name": "menu-title",
-                "description": "Defines a menu heading",
-                "value": { "type": "string" }
-              },
-              {
-                "name": "sub-items",
-                "description": "List of the menu items",
-                "value": { "type": "string" }
-              }
-            ],
-            "events": []
-          }
-        },
-        {
-          "name": "udex-masthead-menu-item",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>masthead-menu-item</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadMenuItem.js\";</code>\n---\n\n\n### **Events:**\n - **click** - Fires when item button is clicked",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "type",
-              "description": "Defines the type of the item.",
-              "value": {
-                "type": "\"Heading\" | \"Button\" | \"Link\"",
-                "default": "\"Link\""
-              }
-            },
-            {
-              "name": "accessible-role",
-              "description": "Controls the ARIA role of the item",
-              "value": { "type": "string", "default": "\"\"" }
-            },
-            {
-              "name": "label",
-              "description": "Defines the label of the component.",
-              "value": { "type": "string", "default": "\"\"" }
-            },
-            {
-              "name": "url",
-              "description": "Defines the url of the component.",
-              "value": { "type": "string | undefined", "default": "\"\"" }
-            },
-            {
-              "name": "badge",
-              "description": "Defines the badge of the component.",
-              "value": { "type": "string | undefined", "default": "\"\"" }
-            },
-            {
-              "name": "external-link",
-              "description": "Defines the externalLink of the component.",
-              "value": { "type": "boolean | undefined", "default": "false" }
-            },
-            {
-              "name": "has-border",
-              "description": "Defines the border for component.",
-              "value": { "type": "boolean | undefined", "default": "false" }
-            },
-            {
-              "name": "icon-start",
-              "description": "Defines the start position of icon arrow.",
-              "value": { "type": "boolean | undefined", "default": "false" }
-            },
-            {
-              "name": "icon-end",
-              "description": "Defines the end position of icon arrow.",
-              "value": { "type": "boolean | undefined", "default": "false" }
-            }
-          ],
           "events": [
             {
-              "name": "click",
-              "description": "Fires when item button is clicked"
+              "name": "menu-item-click",
+              "description": "Fires when menu item is clicked"
             }
           ],
           "js": {
             "properties": [
               {
-                "name": "type",
-                "description": "Defines the type of the item.",
-                "value": { "type": "\"Heading\" | \"Button\" | \"Link\"" }
-              },
-              {
-                "name": "accessible-role",
-                "description": "Controls the ARIA role of the item",
+                "name": "menu-title",
+                "description": "Defines a menu heading",
                 "value": { "type": "string" }
               },
               {
-                "name": "label",
-                "description": "Defines the label of the component.",
+                "name": "sub-items",
+                "description": "List of the menu items",
                 "value": { "type": "string" }
-              },
-              {
-                "name": "url",
-                "description": "Defines the url of the component.",
-                "value": { "type": "string | undefined" }
-              },
-              {
-                "name": "badge",
-                "description": "Defines the badge of the component.",
-                "value": { "type": "string | undefined" }
-              },
-              {
-                "name": "external-link",
-                "description": "Defines the externalLink of the component.",
-                "value": { "type": "boolean | undefined" }
-              },
-              {
-                "name": "has-border",
-                "description": "Defines the border for component.",
-                "value": { "type": "boolean | undefined" }
-              },
-              {
-                "name": "icon-start",
-                "description": "Defines the start position of icon arrow.",
-                "value": { "type": "boolean | undefined" }
-              },
-              {
-                "name": "icon-end",
-                "description": "Defines the end position of icon arrow.",
-                "value": { "type": "boolean | undefined" }
               }
             ],
             "events": [
               {
-                "name": "click",
-                "description": "Fires when item button is clicked"
+                "name": "menu-item-click",
+                "description": "Fires when menu item is clicked"
               }
             ]
           }
         },
         {
           "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### **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 \"@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",
           "doc-url": "",
           "attributes": [],
           "slots": [
@@ -3140,12 +3113,33 @@
               "description": "Slot for explore Sap mobile button"
             }
           ],
-          "events": [],
-          "js": { "properties": [], "events": [] }
+          "events": [
+            {
+              "name": "item-click",
+              "description": "Fires when item is clicked"
+            },
+            {
+              "name": "explorer-menu-click",
+              "description": "Fires when explorer menu button is clicked"
+            }
+          ],
+          "js": {
+            "properties": [],
+            "events": [
+              {
+                "name": "item-click",
+                "description": "Fires when item is clicked"
+              },
+              {
+                "name": "explorer-menu-click",
+                "description": "Fires when explorer menu button is clicked"
+              }
+            ]
+          }
         },
         {
           "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\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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
@@ -3174,6 +3168,10 @@
             {
               "name": "logout",
               "description": "Fired when use click Logout link"
+            },
+            {
+              "name": "profile-item-click",
+              "description": "Fires when profile ment item is clicked"
             }
           ],
           "js": {
@@ -3198,13 +3196,17 @@
               {
                 "name": "logout",
                 "description": "Fired when use click Logout link"
+              },
+              {
+                "name": "profile-item-click",
+                "description": "Fires when profile ment 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 - **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\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 \"@udex/web-components/dist/MastheadShell.js\";</code>\n---\n\n\n### **Events:**\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",
           "doc-url": "",
           "attributes": [
             {
@@ -3232,6 +3234,11 @@
               "description": "Defines the Logo image URL",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "logo-title",
+              "description": "Defines the Logo default title",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "site-label",
               "description": "Defines a site label. It will be displayed next to a logo.",
@@ -3284,6 +3291,14 @@
             {
               "name": "profile-click",
               "description": "Fired event when the user clicks the profile button trigger."
+            },
+            {
+              "name": "logo-click",
+              "description": "Fired event when the user clicks the logo."
+            },
+            {
+              "name": "site-label-click",
+              "description": "Fired event when the user clicks the site label."
             }
           ],
           "js": {
@@ -3313,6 +3328,11 @@
                 "description": "Defines the Logo image URL",
                 "value": { "type": "string" }
               },
+              {
+                "name": "logo-title",
+                "description": "Defines the Logo default title",
+                "value": { "type": "string" }
+              },
               {
                 "name": "site-label",
                 "description": "Defines a site label. It will be displayed next to a logo.",
@@ -3351,13 +3371,21 @@
               {
                 "name": "profile-click",
                 "description": "Fired event when the user clicks the profile button trigger."
+              },
+              {
+                "name": "logo-click",
+                "description": "Fired event when the user clicks the logo."
+              },
+              {
+                "name": "site-label-click",
+                "description": "Fired event when the user clicks the site label."
               }
             ]
           }
         },
         {
           "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 \"@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",
           "doc-url": "",
           "attributes": [
             {
@@ -3911,11 +3939,6 @@
           "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",
           "doc-url": "",
           "attributes": [
-            {
-              "name": "type",
-              "description": "Defines supporting text under the input field.",
-              "value": { "type": "string", "default": "\"\"" }
-            },
             {
               "name": "disabled",
               "description": "Defines whether the component is in disabled state.\n<br><br>\n<b>Note:</b> A disabled component is completely noninteractive.",
@@ -3944,10 +3967,7 @@
             {
               "name": "value-state",
               "description": "Defines the value state of the component.",
-              "value": {
-                "type": "\"Success\" | \"Error\" | \"Warning\" | \"Standard\"",
-                "default": "\"Standard\""
-              }
+              "value": { "type": "ValueState", "default": "\"Standard\"" }
             },
             {
               "name": "supporting-text",
@@ -3988,11 +4008,6 @@
           "events": [],
           "js": {
             "properties": [
-              {
-                "name": "type",
-                "description": "Defines supporting text under the input field.",
-                "value": { "type": "string" }
-              },
               {
                 "name": "disabled",
                 "description": "Defines whether the component is in disabled state.\n<br><br>\n<b>Note:</b> A disabled component is completely noninteractive.",
@@ -4021,9 +4036,7 @@
               {
                 "name": "value-state",
                 "description": "Defines the value state of the component.",
-                "value": {
-                  "type": "\"Success\" | \"Error\" | \"Warning\" | \"Standard\""
-                }
+                "value": { "type": "ValueState" }
               },
               {
                 "name": "supporting-text",
@@ -4321,6 +4334,49 @@
           "events": [],
           "js": { "properties": [], "events": [] }
         },
+        {
+          "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",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "rating",
+              "description": "Defines the associated rating.",
+              "value": { "type": "number", "default": "0" }
+            },
+            {
+              "name": "percentage",
+              "description": "Defines the percentage.",
+              "value": { "type": "number", "default": "0" }
+            },
+            {
+              "name": "show-percentage",
+              "description": "Defines wether the percentage is shown or not.",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "rating",
+                "description": "Defines the associated rating.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "percentage",
+                "description": "Defines the percentage.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "show-percentage",
+                "description": "Defines wether the percentage is shown or not.",
+                "value": { "type": "boolean" }
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "udex-rating-indicator",
           "description": "### Overview\n\n### ES6 Module Import\n\n`import @udex/web-components/dist/RatingIndicator.js\";`\n---\n",
@@ -4358,23 +4414,120 @@
           }
         },
         {
-          "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.",
+          "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.",
           "doc-url": "",
           "attributes": [
             {
-              "name": "value",
-              "description": "Defines the value of the component.",
-              "value": { "type": "string", "default": "\"\"" }
+              "name": "rating",
+              "description": "Defines the rating.",
+              "value": { "type": "number", "default": "0" }
             },
             {
-              "name": "label",
-              "description": "Defines label text for the input field.",
-              "value": { "type": "string", "default": "\"\"" }
+              "name": "reviews",
+              "description": "Defines the total number of reviews.",
+              "value": { "type": "number", "default": "0" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "reviewButton",
+              "description": "Slot for a button for writing a review."
             },
             {
-              "name": "label-animation-disabled",
-              "description": "Defines if the label animation is disabled for the search field.",
+              "name": "defaultText",
+              "description": "Slot for the default text when there are no reviews or rating."
+            },
+            { "name": "default", "description": "Slot for rating bars." }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "rating",
+                "description": "Defines the rating.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "reviews",
+                "description": "Defines the total number of reviews.",
+                "value": { "type": "number" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "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",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "show-rating-top",
+              "description": "Defines the position of the rating in review.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "rating",
+              "description": "Defines the rating in the review.",
+              "value": { "type": "number", "default": "0" }
+            },
+            {
+              "name": "review-title",
+              "description": "Defines the title of the review.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "text",
+              "description": "Defines the text of the review.",
+              "value": { "type": "string", "default": "\"\"" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "show-rating-top",
+                "description": "Defines the position of the rating in review.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "rating",
+                "description": "Defines the rating in the review.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "review-title",
+                "description": "Defines the title of the review.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "text",
+                "description": "Defines the text of the review.",
+                "value": { "type": "string" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "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.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "value",
+              "description": "Defines the value of the component.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "label",
+              "description": "Defines label text for the input field.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "label-animation-disabled",
+              "description": "Defines if the label animation is disabled for the search field.",
               "value": { "type": "boolean", "default": "false" }
             },
             {
@@ -4427,6 +4580,31 @@
               "description": "Defines the accessible ARIA name of the component.",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "accessible-name-reset-icon",
+              "description": "Defines the accessible ARIA name of the reset icon.",
+              "value": { "type": "string", "default": "\"Clear\"" }
+            },
+            {
+              "name": "accessible-name-search-icon",
+              "description": "Defines the accessible ARIA name of the search icon (applied just when \"nonInteractiveSubmitButton\" is active).",
+              "value": { "type": "string", "default": "\"Search\"" }
+            },
+            {
+              "name": "tooltip-reset-button",
+              "description": "Defines the tooltip of the clear button.",
+              "value": { "type": "string", "default": "\"Clear\"" }
+            },
+            {
+              "name": "tooltip-voice-button",
+              "description": "Defines the tooltip of the voice button.",
+              "value": { "type": "string", "default": "\"Voice\"" }
+            },
+            {
+              "name": "tooltip-submit-button",
+              "description": "Defines the tooltip of the submit button.",
+              "value": { "type": "string", "default": "\"Search\"" }
+            },
             {
               "name": "no-result-text",
               "description": "Defines the text if the suggestion list doesn't return results.",
@@ -4532,6 +4710,31 @@
                 "description": "Defines the accessible ARIA name of the component.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "accessible-name-reset-icon",
+                "description": "Defines the accessible ARIA name of the reset icon.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "accessible-name-search-icon",
+                "description": "Defines the accessible ARIA name of the search icon (applied just when \"nonInteractiveSubmitButton\" is active).",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "tooltip-reset-button",
+                "description": "Defines the tooltip of the clear button.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "tooltip-voice-button",
+                "description": "Defines the tooltip of the voice button.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "tooltip-submit-button",
+                "description": "Defines the tooltip of the submit button.",
+                "value": { "type": "string" }
+              },
               {
                 "name": "no-result-text",
                 "description": "Defines the text if the suggestion list doesn't return results.",
@@ -4568,7 +4771,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- **sub-item-click** - Fires when sub 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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
@@ -4600,10 +4803,6 @@
             {
               "name": "item-click",
               "description": "Fires when item is clicked"
-            },
-            {
-              "name": "sub-item-click",
-              "description": "Fires when sub item is clicked"
             }
           ],
           "js": {
@@ -4633,10 +4832,6 @@
               {
                 "name": "item-click",
                 "description": "Fires when item is clicked"
-              },
-              {
-                "name": "sub-item-click",
-                "description": "Fires when sub item is clicked"
               }
             ]
           }
@@ -4656,6 +4851,11 @@
               "description": "Defines back item.",
               "value": { "type": "boolean", "default": "false" }
             },
+            {
+              "name": "mobile-link-title",
+              "description": "Defines an aria label for item",
+              "value": { "type": "string" }
+            },
             {
               "name": "active",
               "description": "Defines active state for the item",
@@ -4669,7 +4869,7 @@
             {
               "name": "target",
               "description": "Defines target for the item",
-              "value": { "type": "string" }
+              "value": { "type": "Target" }
             },
             {
               "name": "sub-title",
@@ -4709,6 +4909,11 @@
                 "description": "Defines back item.",
                 "value": { "type": "boolean" }
               },
+              {
+                "name": "mobile-link-title",
+                "description": "Defines an aria label for item",
+                "value": { "type": "string" }
+              },
               {
                 "name": "active",
                 "description": "Defines active state for the item",
@@ -4722,7 +4927,7 @@
               {
                 "name": "target",
                 "description": "Defines target for the item",
-                "value": { "type": "string" }
+                "value": { "type": "Target" }
               },
               {
                 "name": "sub-title",
@@ -5807,9 +6012,105 @@
             ]
           }
         },
+        {
+          "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.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "label",
+              "description": "Defines the label near switch.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "color",
+              "description": "Defines the color of the component.",
+              "value": {
+                "type": "\"Non-Semantic\" | \"Semantic\"",
+                "default": "\"Non-Semantic\""
+              }
+            },
+            {
+              "name": "accessible-name",
+              "description": "Sets the accessible ARIA name of the component.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "accessible-name-ref",
+              "description": "Receives id (or many ids) of the elements that label the component.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "checked",
+              "description": "Defines if the component is checked.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "disabled",
+              "description": "Defines whether the component is disabled.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "tooltip",
+              "description": "Defines the tooltip of the component.",
+              "value": { "type": "string", "default": "\"\"" }
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "description": "Fired when the component checked state changes."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "label",
+                "description": "Defines the label near switch.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "color",
+                "description": "Defines the color of the component.",
+                "value": { "type": "\"Non-Semantic\" | \"Semantic\"" }
+              },
+              {
+                "name": "accessible-name",
+                "description": "Sets the accessible ARIA name of the component.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "accessible-name-ref",
+                "description": "Receives id (or many ids) of the elements that label the component.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "checked",
+                "description": "Defines if the component is checked.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "disabled",
+                "description": "Defines whether the component is disabled.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "tooltip",
+                "description": "Defines the tooltip of the component.",
+                "value": { "type": "string" }
+              }
+            ],
+            "events": [
+              {
+                "name": "change",
+                "description": "Fired when the component checked state changes."
+              }
+            ]
+          }
+        },
         {
           "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 \"@udex/web-components/dist/Tab.js\";</code>\n---\n\n\n### **Slots:**\n - **default** - Defines the content of the tab.",
           "doc-url": "",
           "attributes": [
             {
@@ -5912,7 +6213,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 \"@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.",
           "doc-url": "",
           "attributes": [
             {
@@ -6265,7 +6566,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",
+          "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",
           "doc-url": "",
           "attributes": [
             {
@@ -6273,6 +6574,11 @@
               "description": "Defines the text of the tag",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "href",
+              "description": "Defines the href for behavior of the tag as a link",
+              "value": { "type": "string", "default": "\"\"" }
+            },
             {
               "name": "design",
               "description": "Defines the design type of tag",
@@ -6331,6 +6637,10 @@
             {
               "name": "iconClick",
               "description": "Emitted when icon in tag was clicked"
+            },
+            {
+              "name": "tagLinkClick",
+              "description": "Emitted when tag link was clicked"
             }
           ],
           "js": {
@@ -6340,6 +6650,11 @@
                 "description": "Defines the text of the tag",
                 "value": { "type": "string" }
               },
+              {
+                "name": "href",
+                "description": "Defines the href for behavior of the tag as a link",
+                "value": { "type": "string" }
+              },
               {
                 "name": "design",
                 "description": "Defines the design type of tag",
@@ -6391,6 +6706,113 @@
               {
                 "name": "iconClick",
                 "description": "Emitted when icon in tag was clicked"
+              },
+              {
+                "name": "tagLinkClick",
+                "description": "Emitted when tag link was clicked"
+              }
+            ]
+          }
+        },
+        {
+          "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.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "tokenizer-expanded",
+              "description": "Defines whether the UI5Tokenizer is expanded.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "disabled",
+              "description": "Defines whether the component is in disabled state.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "readonly",
+              "description": "Defines whether the component is readonly.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "displayonly",
+              "description": "Defines whether the component is displayonly.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "tooltip-placement",
+              "description": "Determines on which side of the component the Tooltip is displayed.",
+              "value": {
+                "type": "\"Left\" | \"Right\" | \"Top\" | \"Bottom\"",
+                "default": "\"Bottom\""
+              }
+            }
+          ],
+          "slots": [{ "name": "default", "description": "Defines the tags." }],
+          "events": [
+            {
+              "name": "tag-click",
+              "description": "Emitted when tag was clicked"
+            },
+            {
+              "name": "tag-icon-click",
+              "description": "Emitted when icon in tag was clicked"
+            },
+            {
+              "name": "show-more-tags",
+              "description": "Emitted when the tooltip was opened, can be canceled"
+            },
+            {
+              "name": "tag-keydown",
+              "description": "Emitted  when a keydown event occurs on a tag, can be canceled\nEmitted custom event with keycode and tag details"
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "tokenizer-expanded",
+                "description": "Defines whether the UI5Tokenizer is expanded.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "disabled",
+                "description": "Defines whether the component is in disabled state.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "readonly",
+                "description": "Defines whether the component is readonly.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "displayonly",
+                "description": "Defines whether the component is displayonly.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "tooltip-placement",
+                "description": "Determines on which side of the component the Tooltip is displayed.",
+                "value": {
+                  "type": "\"Left\" | \"Right\" | \"Top\" | \"Bottom\""
+                }
+              }
+            ],
+            "events": [
+              {
+                "name": "tag-click",
+                "description": "Emitted when tag was clicked"
+              },
+              {
+                "name": "tag-icon-click",
+                "description": "Emitted when icon in tag was clicked"
+              },
+              {
+                "name": "show-more-tags",
+                "description": "Emitted when the tooltip was opened, can be canceled"
+              },
+              {
+                "name": "tag-keydown",
+                "description": "Emitted  when a keydown event occurs on a tag, can be canceled\nEmitted custom event with keycode and tag details"
               }
             ]
           }
@@ -6896,7 +7318,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 \"@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.",
           "doc-url": "",
           "attributes": [
             {