@ui5/webcomponents 2.7.0-rc.1 → 2.7.0

package/dist/custom-elements-internal.json

@@ -730,6 +730,58 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "dist/types/ButtonBadgeDesign.js",
+      "declarations": [
+        {
+          "kind": "enum",
+          "name": "ButtonBadgeDesign",
+          "description": "Determines where the badge will be placed and how it will be styled.",
+          "_ui5privacy": "public",
+          "_ui5since": "2.7.0",
+          "members": [
+            {
+              "kind": "field",
+              "static": true,
+              "privacy": "public",
+              "description": "The badge is displayed after the text, inside the button.",
+              "default": "InlineText",
+              "name": "InlineText",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "static": true,
+              "privacy": "public",
+              "description": "The badge is displayed at the top-end corner of the button.\n\n**Note:** It's highly recommended to use the OverlayText design mode only in cozy density.",
+              "default": "OverlayText",
+              "name": "OverlayText",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "static": true,
+              "privacy": "public",
+              "description": "The badge is displayed as an attention dot.",
+              "default": "AttentionDot",
+              "name": "AttentionDot",
+              "readonly": true
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ButtonBadgeDesign",
+            "module": "dist/types/ButtonBadgeDesign.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "dist/types/ButtonDesign.js",
@@ -3074,7 +3126,7 @@
               "kind": "field",
               "static": true,
               "privacy": "public",
-              "description": "Scroll to load more data.",
+              "description": "Scroll to load more data.\n\n**Note:** If the table is not scrollable, a growing button will be rendered instead to ensure growing functionality.",
               "default": "Scroll",
               "name": "Scroll",
               "readonly": true
@@ -4838,6 +4890,14 @@
             {
               "description": "Used to style the native button element",
               "name": "button"
+            },
+            {
+              "description": "Used to style the icon in the native button element",
+              "name": "icon"
+            },
+            {
+              "description": "Used to style the end icon in the native button element",
+              "name": "endIcon"
             }
           ],
           "slots": [
@@ -4849,6 +4909,22 @@
                 "text": "Array<Node>"
               },
               "_ui5privacy": "public"
+            },
+            {
+              "name": "badge",
+              "description": "Adds a badge to the button.",
+              "_ui5since": "2.7.0",
+              "_ui5type": {
+                "text": "Array<ButtonBadge>",
+                "references": [
+                  {
+                    "name": "ButtonBadge",
+                    "package": "@ui5/webcomponents",
+                    "module": "dist/ButtonBadge.js"
+                  }
+                ]
+              },
+              "_ui5privacy": "public"
             }
           ],
           "members": [
@@ -5169,6 +5245,95 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "dist/ButtonBadge.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `ui5-button-badge` component defines a badge that appears in the `ui5-button`.\n\n * ### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/ButtonBadge.js\";`",
+          "name": "ButtonBadge",
+          "members": [
+            {
+              "kind": "field",
+              "name": "design",
+              "type": {
+                "text": "BadgeDesign",
+                "references": [
+                  {
+                    "name": "BadgeDesign",
+                    "package": "@ui5/webcomponents",
+                    "module": "dist/types/ButtonBadgeDesign.js"
+                  }
+                ]
+              },
+              "default": "\"AttentionDot\"",
+              "description": "Determines where the badge should be placed and how it should be styled.",
+              "privacy": "public",
+              "_ui5since": "2.7.0"
+            },
+            {
+              "kind": "field",
+              "name": "text",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "description": "Defines the text of the component.\n\n**Note:** Text is not needed when the `design` property is set to `AttentionDot`.",
+              "privacy": "public",
+              "_ui5since": "2.7.0"
+            }
+          ],
+          "attributes": [
+            {
+              "description": "Determines where the badge should be placed and how it should be styled.",
+              "name": "design",
+              "default": "\"AttentionDot\"",
+              "fieldName": "design",
+              "type": {
+                "text": "\"InlineText\" | \"OverlayText\" | \"AttentionDot\""
+              }
+            },
+            {
+              "description": "Defines the text of the component.\n\n**Note:** Text is not needed when the `design` property is set to `AttentionDot`.",
+              "name": "text",
+              "default": "\"\"",
+              "fieldName": "text",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "UI5Element",
+            "package": "@ui5/webcomponents-base",
+            "module": "dist/UI5Element.js"
+          },
+          "tagName": "ui5-button-badge",
+          "customElement": true,
+          "_ui5since": "2.7.0",
+          "_ui5privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ButtonBadge",
+            "module": "dist/ButtonBadge.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ui5-button-badge",
+          "declaration": {
+            "name": "ButtonBadge",
+            "module": "dist/ButtonBadge.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "dist/Calendar.js",
@@ -7425,7 +7590,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Defines whether the user can choose a custom color from a component.\n\n**Note:** In order to use this property you need to import the following module: `\"@ui5/webcomponents/dist/features/ColorPaletteMoreColors.js\"`",
+              "description": "Defines whether the user can choose a custom color from a component.",
               "privacy": "public"
             },
             {
@@ -7524,7 +7689,7 @@
               }
             },
             {
-              "description": "Defines whether the user can choose a custom color from a component.\n\n**Note:** In order to use this property you need to import the following module: `\"@ui5/webcomponents/dist/features/ColorPaletteMoreColors.js\"`",
+              "description": "Defines whether the user can choose a custom color from a component.",
               "name": "show-more-colors",
               "default": "false",
               "fieldName": "showMoreColors",
@@ -12534,7 +12699,7 @@
         },
         {
           "kind": "class",
-          "description": "### Overview\n\nThe `ui5-input` component allows the user to enter and edit text or numeric values in one line.\n\nAdditionally, you can provide `suggestionItems`,\nthat are displayed in a popover right under the input.\n\nThe text field can be editable or read-only (`readonly` property),\nand it can be enabled or disabled (`disabled` property).\nTo visualize semantic states, such as \"Negative\" or \"Critical\", the `valueState` property is provided.\nWhen the user makes changes to the text, the change event is fired,\nwhich enables you to react on any text change.\n\n**Note:** If you are using the `ui5-input` as a single npm module,\ndon't forget to import the `InputSuggestions` module from\n\"@ui5/webcomponents/dist/features/InputSuggestions.js\"\nto enable the suggestions functionality.\n\n### Keyboard Handling\nThe `ui5-input` provides the following keyboard shortcuts:\n\n- [Escape] - Closes the suggestion list, if open. If closed or not enabled, cancels changes and reverts to the value which the Input field had when it got the focus.\n- [Enter] or [Return] - If suggestion list is open takes over the current matching item and closes it. If value state or group header is focused, does nothing.\n- [Down] - Focuses the next matching item in the suggestion list. Selection-change event is fired.\n- [Up] - Focuses the previous matching item in the suggestion list. Selection-change event is fired.\n- [Home] - If focus is in the text input, moves caret before the first character. If focus is in the list, highlights the first item and updates the input accordingly.\n- [End] - If focus is in the text input, moves caret after the last character. If focus is in the list, highlights the last item and updates the input accordingly.\n- [Page Up] - If focus is in the list, moves highlight up by page size (10 items by default). If focus is in the input, does nothing.\n- [Page Down] - If focus is in the list, moves highlight down by page size (10 items by default). If focus is in the input, does nothing.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Input.js\";`\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";` (optional - for input suggestions support)",
+          "description": "### Overview\n\nThe `ui5-input` component allows the user to enter and edit text or numeric values in one line.\n\nAdditionally, you can provide `suggestionItems`,\nthat are displayed in a popover right under the input.\n\nThe text field can be editable or read-only (`readonly` property),\nand it can be enabled or disabled (`disabled` property).\nTo visualize semantic states, such as \"Negative\" or \"Critical\", the `valueState` property is provided.\nWhen the user makes changes to the text, the change event is fired,\nwhich enables you to react on any text change.\n\n### Keyboard Handling\nThe `ui5-input` provides the following keyboard shortcuts:\n\n- [Escape] - Closes the suggestion list, if open. If closed or not enabled, cancels changes and reverts to the value which the Input field had when it got the focus.\n- [Enter] or [Return] - If suggestion list is open takes over the current matching item and closes it. If value state or group header is focused, does nothing.\n- [Down] - Focuses the next matching item in the suggestion list. Selection-change event is fired.\n- [Up] - Focuses the previous matching item in the suggestion list. Selection-change event is fired.\n- [Home] - If focus is in the text input, moves caret before the first character. If focus is in the list, highlights the first item and updates the input accordingly.\n- [End] - If focus is in the text input, moves caret after the last character. If focus is in the list, highlights the last item and updates the input accordingly.\n- [Page Up] - If focus is in the list, moves highlight up by page size (10 items by default). If focus is in the input, does nothing.\n- [Page Down] - If focus is in the list, moves highlight down by page size (10 items by default). If focus is in the input, does nothing.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Input.js\";`",
           "name": "Input",
           "cssParts": [
             {
@@ -12553,7 +12718,7 @@
           "slots": [
             {
               "name": "default",
-              "description": "Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.\n\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.",
+              "description": "Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.",
               "_ui5propertyName": "suggestionItems",
               "_ui5type": {
                 "text": "Array<IInputSuggestionItem>",
@@ -12708,7 +12873,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
+              "description": "Defines whether the component should show suggestions, if such are present.",
               "privacy": "public"
             },
             {
@@ -12939,7 +13104,7 @@
               }
             },
             {
-              "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
+              "description": "Defines whether the component should show suggestions, if such are present.",
               "name": "show-suggestions",
               "default": "false",
               "fieldName": "showSuggestions",
@@ -13812,7 +13977,7 @@
                   }
                 ]
               },
-              "description": "Fired when an item is activated, unless the item's `type` property\nis set to `Inactive`.",
+              "description": "Fired when an item is activated, unless the item's `type` property\nis set to `Inactive`.\n\n**Note**: This event is not triggered by interactions with selection components such as the checkboxes and radio buttons,\nassociated with non-default `selectionMode` values, or if any other **interactive** component\n(such as a button or input) within the list item is directly clicked.",
               "_ui5Cancelable": true,
               "_ui5allowPreventDefault": true,
               "_ui5Bubbles": true,
@@ -15450,7 +15615,7 @@
         },
         {
           "kind": "class",
-          "description": "### Overview\n\n`ui5-menu` component represents a hierarchical menu structure.\n\n### Structure\n\nThe `ui5-menu` can hold two types of entities:\n\n- `ui5-menu-item` components\n- `ui5-menu-separator` - used to separate menu items with a line\n\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Keyboard Handling\n\nThe `ui5-menu` provides advanced keyboard handling.\nThe user can use the following keyboard shortcuts in order to navigate trough the tree:\n\n- `Arrow Up` / `Arrow Down` - Navigates up and down the menu items that are currently visible.\n- `Arrow Right`, `Space` or `Enter` - Opens a sub-menu if there are menu items nested\nin the currently clicked menu item.\n- `Arrow Left` or `Escape` - Closes the currently opened sub-menu.\n\nNote: if the text ditrection is set to Right-to-left (RTL), `Arrow Right` and `Arrow Left` functionality is swapped.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Menu.js\";`",
+          "description": "### Overview\n\n`ui5-menu` component represents a hierarchical menu structure.\n\n### Structure\n\nThe `ui5-menu` can hold two types of entities:\n\n- `ui5-menu-item` components\n- `ui5-menu-separator` - used to separate menu items with a line\n\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Keyboard Handling\n\nThe `ui5-menu` provides advanced keyboard handling.\nThe user can use the following keyboard shortcuts in order to navigate trough the tree:\n\n- `Arrow Up` / `Arrow Down` - Navigates up and down the menu items that are currently visible.\n- `Arrow Right`, `Space` or `Enter` - Opens a sub-menu if there are menu items nested\nin the currently clicked menu item.\n- `Arrow Left` or `Escape` - Closes the currently opened sub-menu.\n\nwhen there is `endContent` :\n- `Arrow Left` or `ArrowRight` - Navigate between the menu item actions and the menu item itself\n- `Arrow Up` / `Arrow Down` - Navigates up and down the currently visible menu items\n\nNote: if the text ditrection is set to Right-to-left (RTL), `Arrow Right` and `Arrow Left` functionality is swapped.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Menu.js\";`",
           "name": "Menu",
           "slots": [
             {
@@ -16361,7 +16526,7 @@
               "description": "Fired when the close button is pressed either with a\nclick/tap or by using the Enter or Space key.",
               "_ui5Cancelable": false,
               "_ui5allowPreventDefault": false,
-              "_ui5Bubbles": true
+              "_ui5Bubbles": false
             }
           ],
           "attributes": [
@@ -17449,7 +17614,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
+              "description": "Defines whether the component should show suggestions, if such are present.",
               "privacy": "public",
               "inheritedFrom": {
                 "name": "Input",
@@ -17812,7 +17977,7 @@
               }
             },
             {
-              "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
+              "description": "Defines whether the component should show suggestions, if such are present.",
               "name": "show-suggestions",
               "default": "false",
               "fieldName": "showSuggestions",
@@ -17920,36 +18085,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "dist/NavigationMenu.js",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "NavigationMenu",
-            "module": "dist/NavigationMenu.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "dist/NavigationMenuItem.js",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "NavigationMenuItem",
-            "module": "dist/NavigationMenuItem.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "dist/Option.js",
@@ -22462,6 +22597,20 @@
           "kind": "class",
           "description": "### Overview\n\n`ui5-split-button` enables users to trigger actions. It is constructed of two separate actions -\ndefault action and arrow action that can be activated by clicking or tapping, or by\npressing certain keyboard keys - `Space` or `Enter` for default action,\nand `Arrow Down` or `Arrow Up` for arrow action.\n\n### Usage\n\n`ui5-split-button` consists two separate buttons:\n\n- for the first one (default action) you can define some `text` or an `icon`, or both.\n- the second one (arrow action) contains only `slim-arrow-down` icon.\n\nYou can choose a `design` from a set of predefined types (the same as for ui5-button) that offer\ndifferent styling to correspond to the triggered action. Both text and arrow actions have the same design.\n\nYou can set the `ui5-split-button` as enabled or disabled. Both parts of an enabled\n`ui5-split-button` can be pressed by clicking or tapping it, or by certain keys, which changes\nthe style to provide visual feedback to the user that it is pressed or hovered over with\nthe mouse cursor. A disabled `ui5-split-button` appears inactive and any of the two buttons\ncannot be pressed.\n\n### Keyboard Handling\n\n- `Space` or `Enter` - triggers the default action\n- `Shift` or `Escape` - if `Space` is pressed, releases the default action button without triggering the click event.\n- `Arrow Down`, `Arrow Up`, `Alt`+`Arrow Down`, `Alt`+`Arrow Up`, or `F4` - triggers the arrow action\nThere are separate events that are fired on activating of `ui5-split-button` parts:\n\n- `click` for the first button (default action)\n- `arrow-click` for the second button (arrow action)\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/SplitButton.js\";`",
           "name": "SplitButton",
+          "cssParts": [
+            {
+              "description": "Used to style the native button element",
+              "name": "button"
+            },
+            {
+              "description": "Used to style the icon in the native button element",
+              "name": "icon"
+            },
+            {
+              "description": "Used to style the end icon in the native button element",
+              "name": "endIcon"
+            }
+          ],
           "slots": [
             {
               "name": "default",
@@ -24905,7 +25054,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "### Overview\n\nThe `ui5-table-growing` component is used inside the `ui5-table` to add a growing/data loading functionalities\nto the table.\n\nThe component offers two options:\n* Button - a More button is displayed, clicking it will load more data.\n* Scroll - additional data is loaded automatically when the user scrolls to the end of the table.\n\n### Usage\n\nThe `ui5-table-growing` component is only used inside the `ui5-table` component as a feature.\nIt has to be slotted inside the `ui5-table` in the `features` slot.\nThe component is not intended to be used as a standalone component.\n\n```html\n<ui5-table>\n\t<ui5-table-growing type=\"Button\" growing-text=\"More\" slot=\"features\"></ui5-table-growing>\n</ui5-table>\n```\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/TableGrowing.js\";`",
+          "description": "### Overview\n\nThe `ui5-table-growing` component is used inside the `ui5-table` to add a growing/data loading functionalities\nto the table.\n\nThe component offers two options:\n* Button - a More button is displayed, clicking it will load more data.\n* Scroll - additional data is loaded automatically when the user scrolls to the end of the table.\n\n### Usage\n\nThe `ui5-table-growing` component is only used inside the `ui5-table` component as a feature.\nIt has to be slotted inside the `ui5-table` in the `features` slot.\nThe component is not intended to be used as a standalone component.\n\n```html\n<ui5-table>\n\t<ui5-table-growing type=\"Button\" growing-text=\"More\" slot=\"features\"></ui5-table-growing>\n</ui5-table>\n```\n\n**Notes**:\n* When the `ui5-table-growing` component is used with the `Scroll` type and the table is currently not scrollable,\nthe component will render a growing button instead to ensure growing capabilities until the table becomes scrollable.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/TableGrowing.js\";`",
           "name": "TableGrowing",
           "members": [
             {
@@ -24922,7 +25071,7 @@
                 ]
               },
               "default": "\"Button\"",
-              "description": "Defines the mode of the <code>ui5-table</code> growing.\n\nAvailable options are:\n\nButton - Shows a More button at the bottom of the table, pressing it will load more rows.\n\nScroll - The rows are loaded automatically by scrolling to the bottom of the table. If the table is not scrollable, this option is the same as the Button.",
+              "description": "Defines the mode of the <code>ui5-table</code> growing.\n\nAvailable options are:\n\nButton - Shows a More button at the bottom of the table, pressing it will load more rows.\n\nScroll - The rows are loaded automatically by scrolling to the bottom of the table. If the table is not scrollable,\na growing button will be rendered instead to ensure growing functionality.",
               "privacy": "public"
             },
             {
@@ -24961,7 +25110,7 @@
           ],
           "attributes": [
             {
-              "description": "Defines the mode of the <code>ui5-table</code> growing.\n\nAvailable options are:\n\nButton - Shows a More button at the bottom of the table, pressing it will load more rows.\n\nScroll - The rows are loaded automatically by scrolling to the bottom of the table. If the table is not scrollable, this option is the same as the Button.",
+              "description": "Defines the mode of the <code>ui5-table</code> growing.\n\nAvailable options are:\n\nButton - Shows a More button at the bottom of the table, pressing it will load more rows.\n\nScroll - The rows are loaded automatically by scrolling to the bottom of the table. If the table is not scrollable,\na growing button will be rendered instead to ensure growing functionality.",
               "name": "type",
               "default": "\"Button\"",
               "fieldName": "type",
@@ -26022,6 +26171,12 @@
           "kind": "class",
           "description": "### Overview\n\nThe `ui5-tag` is a component which serves\nthe purpose to attract the user attention to some piece\nof information (state, quantity, condition, etc.).\nIt can contain icon and text information, and its design can be chosen from specific design types.\n\n### Usage Guidelines\n\n- If the text is longer than the width of the component, it can wrap, or it can show ellipsis, depending on the `wrappingType` property.\n- Colors can be semantic or not semantic.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Tag.js\";`",
           "name": "Tag",
+          "cssParts": [
+            {
+              "description": "Used to style the root element.",
+              "name": "root"
+            }
+          ],
           "slots": [
             {
               "name": "default",