chore: add sap_belize_hcw switch, public imports and other stuff (#1384)

- add sap_belize_hcw switch - provide public imports for the newly added components - unify type naming - in most of the places we use "boolean" and "string", but in several palces we can see "Boolean" and "String"
SAP · Mar 30, 2020 · a0a2589 · a0a2589
1 parent 98c96f5
commit a0a2589
Show file tree

Hide file tree

Showing 17 changed files with 95 additions and 71 deletions.
diff --git a/docs/Configuration.md b/docs/Configuration.md
@@ -7,7 +7,7 @@ There are several configuration settings that affect all UI5 Web Components glob
 
   Setting    |                     Values                      | Default value |                          Description
 ------------ | ----------------------------------------------- | ------------- | -------------------------------------------------------------
-[theme](#theme)        | sap_fiori_3, sap_fiori_3_dark, sap_belize, sap_belize_hcb         | sap_fiori_3   | Visual theme
+[theme](#theme)        | sap_fiori_3, sap_fiori_3_dark, sap_belize, sap_belize_hcb, sap_belize_hcw | sap_fiori_3   | Visual theme
 language     | en, de, es, etc...                              | en            | Language to be used for translatable texts
 [RTL](#rtl)          | true, false                                     | false         | When true, sets global text direction to right-to-left
 [animationMode](#animationMode)  | full, basic, minimal, none  | full          | Defines different animation scenarios or levels
@@ -23,9 +23,10 @@ UI5 Web Components contain different content densities for certain controls that
 ### Theme
 The `theme` setting values above are the technical names of our themes.
 - The `sap_fiori_3` is known as `Quartz Light` and it`s the default theme.
-- The `sap_fiori_3_dark` is known as `Quartz Dark`. 
-- The `sap_belize` is known as `Belize`. 
-- The `sap_belize_hcb` is known as `High Contrast Black`. 
+- The `sap_fiori_3_dark` is known as `Quartz Dark`.
+- The `sap_belize` is known as `Belize`.
+- The `sap_belize_hcb` is known as `High Contrast Black`.
+- The `sap_belize_hcw` is known as `High Contrast White`.
 
 <a name="rtl"></a>
 ### RTL

diff --git a/docs/Public Module Imports.md b/docs/Public Module Imports.md
@@ -23,40 +23,51 @@ For API documentation and samples, please check the [UI5 Web Components Playgrou
 
 |      Web Component       |       Tag name       |                       Module import                        |
 | ------------------------ | -------------------- | ---------------------------------------------------------- |
+| Avatar                   | `ui5-avatar`         | `import "@ui5/webcomponents/dist/Avatar.js";`              |
 | Badge                    | `ui5-badge`          | `import "@ui5/webcomponents/dist/Badge.js";`               |
 | Busy Indicator           | `ui5-busyindicator`  | `import "@ui5/webcomponents/dist/BusyIndicator.js";`       |
 | Button                   | `ui5-button`         | `import "@ui5/webcomponents/dist/Button.js";`              |
 | Card                     | `ui5-card`           | `import "@ui5/webcomponents/dist/Card.js";`                |
+| Carousel                 | `ui5-carousel`       | `import "@ui5/webcomponents/dist/Carousel.js";`            |
 | Checkbox                 | `ui5-checkbox`       | `import "@ui5/webcomponents/dist/CheckBox.js";`            |
+| ComboBox                 | `ui5-combobox`       | `import "@ui5/webcomponents/dist/ComboBox.js";`            |
+| ComboBox Item            | `ui5-cb-item`        | comes with ui5-combobox                                    |
 | Date Picker              | `ui5-datepicker`     | `import "@ui5/webcomponents/dist/DatePicker.js";`          |
 | Dialog                   | `ui5-dialog`         | `import "@ui5/webcomponents/dist/Dialog.js";`              |
+| File Uploader            | `ui5-file-uploader`  | `import "@ui5/webcomponents/dist/FileUploader.js";`        |
 | Icon                     | `ui5-icon`           | `import "@ui5/webcomponents/dist/Icon.js";`                |
 | Input                    | `ui5-input`          | `import "@ui5/webcomponents/dist/Input.js";`               |
 | Label                    | `ui5-label`          | `import "@ui5/webcomponents/dist/Label.js";`               |
 | Link                     | `ui5-link`           | `import "@ui5/webcomponents/dist/Link.js";`                |
 | List                     | `ui5-list`           | `import "@ui5/webcomponents/dist/List.js";`                |
-| List - Standard Item     | `ui5-li`             | `import "@ui5/webcomponents/dist/StandardListItem.js";`   |
+| List - Standard Item     | `ui5-li`             | `import "@ui5/webcomponents/dist/StandardListItem.js";`    |
 | List - Custom Item       | `ui5-li-custom`      | `import "@ui5/webcomponents/dist/CustomListItem.js";`      |
 | List - Group Header Item | `ui5-li-groupheader` | `import "@ui5/webcomponents/dist/GroupHeaderListItem.js";` |
 | Message Strip            | `ui5-messagestrip`   | `import "@ui5/webcomponents/dist/MessageStrip.js";`        |
-| Multi Combo Box          | `ui5-multi-combobox`  | `import "@ui5/webcomponents/dist/MultiComboBox.js";`       |
+| Multi ComboBox           | `ui5-multi-combobox` | `import "@ui5/webcomponents/dist/MultiComboBox.js";`       |
+| Multi ComboBox Item      | `ui5-mcb-item`       | `import "@ui5/webcomponents/dist/MultiComboBoxItem.js";`   |
 | Panel                    | `ui5-panel`          | `import "@ui5/webcomponents/dist/Panel.js";`               |
 | Popover                  | `ui5-popover`        | `import "@ui5/webcomponents/dist/Popover.js";`             |
 | Radio Button             | `ui5-radiobutton`    | `import "@ui5/webcomponents/dist/RadioButton.js";`         |
+| Responsive Popover       | `ui5-responsive-popover`| `import "@ui5/webcomponents/dist/ResponsivePopover.js";`|
 | Select                   | `ui5-select`         | `import "@ui5/webcomponents/dist/Select.js";`              |
-| Select Option            | `ui5-option`         | comes with ui5-select              |
+| Select Option            | `ui5-option`         | comes with ui5-select                                      |
+| Segmented Button         | `ui5-segmentedbutton`|`import "@ui5/webcomponents/dist/SegmentedButton.js";`      |
+| Suggestion Item          | `ui5-suggestion-item`|`import "@ui5/webcomponents/dist/SuggestionItem.js";`       |
 | Switch                   | `ui5-switch`         | `import "@ui5/webcomponents/dist/Switch.js";`              |
 | Tab Container            | `ui5-tabcontainer`   | `import "@ui5/webcomponents/dist/TabContainer.js";`        |
 | Tab                      | `ui5-tab`            | `import "@ui5/webcomponents/dist/Tab.js";`                 |
 | Tab Separator            | `ui5-tab-separator`  | `import "@ui5/webcomponents/dist/TabSeparator.js";`        |
 | Table                    | `ui5-table`          | `import "@ui5/webcomponents/dist/Table.js";`               |
-| Table Column             | `ui5-table-column`   | `import "@ui5/webcomponents/dist/TableColumn.js";`               |
-| Table Row                | `ui5-table-row`      | `import "@ui5/webcomponents/dist/TableRow.js";`               |
-| Table Cell               | `ui5-table-cell`     | `import "@ui5/webcomponents/dist/TableCell.js";`               |
+| Table Column             | `ui5-table-column`   | `import "@ui5/webcomponents/dist/TableColumn.js";`         |
+| Table Row                | `ui5-table-row`      | `import "@ui5/webcomponents/dist/TableRow.js";`            |
+| Table Cell               | `ui5-table-cell`     | `import "@ui5/webcomponents/dist/TableCell.js";`           |
 | Textarea                 | `ui5-textarea`       | `import "@ui5/webcomponents/dist/TextArea.js";`            |
+| TimePicker               | `ui5-timepicker`     | `import "@ui5/webcomponents/dist/TimePicker.js";`          |
 | Timeline                 | `ui5-timeline`       | `import "@ui5/webcomponents/dist/Timeline.js";`            |
 | Timeline Item            | `ui5-timeline-item`  | comes with ui5-timeline                                    |
 | Title                    | `ui5-title`          | `import "@ui5/webcomponents/dist/Title.js";`               |
+| Toast                    | `ui5-toast`          | `import "@ui5/webcomponents/dist/Toast.js";`               |
 | Toggle Button            | `ui5-togglebutton`   | `import "@ui5/webcomponents/dist/ToggleButton.js";`        |
 
 ### 2. Assets

diff --git a/packages/main/README.md b/packages/main/README.md
@@ -7,43 +7,54 @@
 
 Provides general purpose UI building blocks such as buttons, labels, inputs and popups.
 
- |      Web Component       |       Tag name       |                       Module import                        |
- | ------------------------ | -------------------- | ---------------------------------------------------------- |
- | Badge                    | `ui5-badge`          | `import "@ui5/webcomponents/dist/Badge.js";`               |
- | Busy Indicator           | `ui5-busyindicator`  | `import "@ui5/webcomponents/dist/BusyIndicator.js";`       |
- | Button                   | `ui5-button`         | `import "@ui5/webcomponents/dist/Button.js";`              |
- | Card                     | `ui5-card`           | `import "@ui5/webcomponents/dist/Card.js";`                |
- | Checkbox                 | `ui5-checkbox`       | `import "@ui5/webcomponents/dist/CheckBox.js";`            |
- | Date Picker              | `ui5-datepicker`     | `import "@ui5/webcomponents/dist/DatePicker.js";`          |
- | Dialog                   | `ui5-dialog`         | `import "@ui5/webcomponents/dist/Dialog.js";`              |
- | Icon                     | `ui5-icon`           | `import "@ui5/webcomponents/dist/Icon.js";`                |
- | Input                    | `ui5-input`          | `import "@ui5/webcomponents/dist/Input.js";`               |
- | Label                    | `ui5-label`          | `import "@ui5/webcomponents/dist/Label.js";`               |
- | Link                     | `ui5-link`           | `import "@ui5/webcomponents/dist/Link.js";`                |
- | List                     | `ui5-list`           | `import "@ui5/webcomponents/dist/List.js";`                |
- | List - Standard Item     | `ui5-li`             | `import "@ui5/webcomponents/dist/StandardListItem.js";`   |
- | List - Custom Item       | `ui5-li-custom`      | `import "@ui5/webcomponents/dist/CustomListItem.js";`      |
- | List - Group Header Item | `ui5-li-groupheader` | `import "@ui5/webcomponents/dist/GroupHeaderListItem.js";` |
- | Message Strip            | `ui5-messagestrip`   | `import "@ui5/webcomponents/dist/MessageStrip.js";`        |
- | Multi Combo Box          | `ui5-multicombobox`  | `import "@ui5/webcomponents/dist/MultiComboBox.js";`       |
- | Panel                    | `ui5-panel`          | `import "@ui5/webcomponents/dist/Panel.js";`               |
- | Popover                  | `ui5-popover`        | `import "@ui5/webcomponents/dist/Popover.js";`             |
- | Radio Button             | `ui5-radiobutton`    | `import "@ui5/webcomponents/dist/RadioButton.js";`         |
- | Select                   | `ui5-select`         | `import "@ui5/webcomponents/dist/Select.js";`              |
- | Select Option            | `ui5-option`         | comes with ui5-select              |
- | Switch                   | `ui5-switch`         | `import "@ui5/webcomponents/dist/Switch.js";`              |
- | Tab Container            | `ui5-tabcontainer`   | `import "@ui5/webcomponents/dist/TabContainer.js";`        |
- | Tab                      | `ui5-tab`            | `import "@ui5/webcomponents/dist/Tab.js";`                 |
- | Tab Separator            | `ui5-tab-separator`  | `import "@ui5/webcomponents/dist/TabSeparator.js";`        |
- | Table                    | `ui5-table`          | `import "@ui5/webcomponents/dist/Table.js";`               |
- | Table Column             | `ui5-table-column`   | `import "@ui5/webcomponents/dist/TableColumn.js";`               |
- | Table Row                | `ui5-table-row`      | `import "@ui5/webcomponents/dist/TableRow.js";`               |
- | Table Cell               | `ui5-table-cell`     | `import "@ui5/webcomponents/dist/TableCell.js";`               |
- | Textarea                 | `ui5-textarea`       | `import "@ui5/webcomponents/dist/TextArea.js";`            |
- | Timeline                 | `ui5-timeline`       | `import "@ui5/webcomponents/dist/Timeline.js";`            |
- | Timeline Item            | `ui5-timeline-item`  | comes with ui5-timeline                                    |
- | Title                    | `ui5-title`          | `import "@ui5/webcomponents/dist/Title.js";`               |
- | Toggle Button            | `ui5-togglebutton`   | `import "@ui5/webcomponents/dist/ToggleButton.js";`        |
+|      Web Component       |       Tag name       |                       Module import                        |
+| ------------------------ | -------------------- | ---------------------------------------------------------- |
+| Avatar                   | `ui5-avatar`         | `import "@ui5/webcomponents/dist/Avatar.js";`              |
+| Badge                    | `ui5-badge`          | `import "@ui5/webcomponents/dist/Badge.js";`               |
+| Busy Indicator           | `ui5-busyindicator`  | `import "@ui5/webcomponents/dist/BusyIndicator.js";`       |
+| Button                   | `ui5-button`         | `import "@ui5/webcomponents/dist/Button.js";`              |
+| Card                     | `ui5-card`           | `import "@ui5/webcomponents/dist/Card.js";`                |
+| Carousel                 | `ui5-carousel`       | `import "@ui5/webcomponents/dist/Carousel.js";`            |
+| Checkbox                 | `ui5-checkbox`       | `import "@ui5/webcomponents/dist/CheckBox.js";`            |
+| ComboBox                 | `ui5-combobox`       | `import "@ui5/webcomponents/dist/ComboBox.js";`            |
+| ComboBox Item            | `ui5-cb-item`        | comes with ui5-combobox                                    |
+| Date Picker              | `ui5-datepicker`     | `import "@ui5/webcomponents/dist/DatePicker.js";`          |
+| Dialog                   | `ui5-dialog`         | `import "@ui5/webcomponents/dist/Dialog.js";`              |
+| File Uploader            | `ui5-file-uploader`  | `import "@ui5/webcomponents/dist/FileUploader.js";`        |
+| Icon                     | `ui5-icon`           | `import "@ui5/webcomponents/dist/Icon.js";`                |
+| Input                    | `ui5-input`          | `import "@ui5/webcomponents/dist/Input.js";`               |
+| Label                    | `ui5-label`          | `import "@ui5/webcomponents/dist/Label.js";`               |
+| Link                     | `ui5-link`           | `import "@ui5/webcomponents/dist/Link.js";`                |
+| List                     | `ui5-list`           | `import "@ui5/webcomponents/dist/List.js";`                |
+| List - Standard Item     | `ui5-li`             | `import "@ui5/webcomponents/dist/StandardListItem.js";`    |
+| List - Custom Item       | `ui5-li-custom`      | `import "@ui5/webcomponents/dist/CustomListItem.js";`      |
+| List - Group Header Item | `ui5-li-groupheader` | `import "@ui5/webcomponents/dist/GroupHeaderListItem.js";` |
+| Message Strip            | `ui5-messagestrip`   | `import "@ui5/webcomponents/dist/MessageStrip.js";`        |
+| Multi ComboBox           | `ui5-multi-combobox` | `import "@ui5/webcomponents/dist/MultiComboBox.js";`       |
+| Multi ComboBox Item      | `ui5-mcb-item`       | `import "@ui5/webcomponents/dist/MultiComboBoxItem.js";`   |
+| Panel                    | `ui5-panel`          | `import "@ui5/webcomponents/dist/Panel.js";`               |
+| Popover                  | `ui5-popover`        | `import "@ui5/webcomponents/dist/Popover.js";`             |
+| Radio Button             | `ui5-radiobutton`    | `import "@ui5/webcomponents/dist/RadioButton.js";`         |
+| Responsive Popover       | `ui5-responsive-popover`| `import "@ui5/webcomponents/dist/ResponsivePopover.js";`|
+| Select                   | `ui5-select`         | `import "@ui5/webcomponents/dist/Select.js";`              |
+| Select Option            | `ui5-option`         | comes with ui5-select                                      |
+| Segmented Button         | `ui5-segmentedbutton`|`import "@ui5/webcomponents/dist/SegmentedButton.js";`      |
+| Suggestion Item          | `ui5-suggestion-item`|`import "@ui5/webcomponents/dist/SuggestionItem.js";`       |
+| Switch                   | `ui5-switch`         | `import "@ui5/webcomponents/dist/Switch.js";`              |
+| Tab Container            | `ui5-tabcontainer`   | `import "@ui5/webcomponents/dist/TabContainer.js";`        |
+| Tab                      | `ui5-tab`            | `import "@ui5/webcomponents/dist/Tab.js";`                 |
+| Tab Separator            | `ui5-tab-separator`  | `import "@ui5/webcomponents/dist/TabSeparator.js";`        |
+| Table                    | `ui5-table`          | `import "@ui5/webcomponents/dist/Table.js";`               |
+| Table Column             | `ui5-table-column`   | `import "@ui5/webcomponents/dist/TableColumn.js";`         |
+| Table Row                | `ui5-table-row`      | `import "@ui5/webcomponents/dist/TableRow.js";`            |
+| Table Cell               | `ui5-table-cell`     | `import "@ui5/webcomponents/dist/TableCell.js";`           |
+| Textarea                 | `ui5-textarea`       | `import "@ui5/webcomponents/dist/TextArea.js";`            |
+| TimePicker               | `ui5-timepicker`     | `import "@ui5/webcomponents/dist/TimePicker.js";`          |
+| Timeline                 | `ui5-timeline`       | `import "@ui5/webcomponents/dist/Timeline.js";`            |
+| Timeline Item            | `ui5-timeline-item`  | comes with ui5-timeline                                    |
+| Title                    | `ui5-title`          | `import "@ui5/webcomponents/dist/Title.js";`               |
+| Toast                    | `ui5-toast`          | `import "@ui5/webcomponents/dist/Toast.js";`               |
+| Toggle Button            | `ui5-togglebutton`   | `import "@ui5/webcomponents/dist/ToggleButton.js";`        |
 
 For a complete list of all public module imports from the `main` package, click [here](../../docs/Public%20Module%20Imports.md#main):
 

diff --git a/packages/main/src/Avatar.js b/packages/main/src/Avatar.js
@@ -108,7 +108,7 @@ const metadata = {
 		 * <li><code>Cover</code></li>
 		 * <li><code>Contain</code></li>
 		 * <ul>
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue "Cover"
 		 * @public
 		 */
@@ -134,7 +134,7 @@ const metadata = {
 		 * <li><code>Accent10</code></li>
 		 * <li><code>Placeholder</code></li>
 		 * <ul>
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue "Accent6"
 		 * @public
 		 */

diff --git a/packages/main/src/Calendar.js b/packages/main/src/Calendar.js
@@ -61,7 +61,7 @@ const metadata = {
 		/**
 		 * Determines the мinimum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public
@@ -73,7 +73,7 @@ const metadata = {
 		/**
 		 * Determines the maximum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public

diff --git a/packages/main/src/Carousel.js b/packages/main/src/Carousel.js
@@ -36,7 +36,7 @@ const metadata = {
 	properties: /** @lends sap.ui.webcomponents.main.Carousel.prototype */ {
 		/**
 		 * Defines whether the carousel should loop, i.e show the first page after the last page is reached and vice versa.
-		 * @type {Boolean}
+		 * @type {boolean}
 		 * @defaultvalue false
 		 * @public
 		 */
@@ -57,7 +57,7 @@ const metadata = {
 
 		/**
 		 * If set to true the navigation is hidden.
-		 * @type {Boolean}
+		 * @type {boolean}
 		 * @defaultvalue false
 		 * @public
 		 */

diff --git a/packages/main/src/DatePicker.js b/packages/main/src/DatePicker.js
@@ -84,7 +84,7 @@ const metadata = {
 		/**
 		 * Determines the minimum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public
@@ -96,7 +96,7 @@ const metadata = {
 		/**
 		 * Determines the maximum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public

diff --git a/packages/main/src/DayPicker.js b/packages/main/src/DayPicker.js
@@ -67,7 +67,7 @@ const metadata = {
 		/**
 		 * Determines the мinimum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public
@@ -79,7 +79,7 @@ const metadata = {
 		/**
 		 * Determines the maximum date available for selection.
 		 *
-		 * @type {String}
+		 * @type {string}
 		 * @defaultvalue ""
 		 * @since 1.0.0-rc.6
 		 * @public

diff --git a/packages/main/src/Dialog.js b/packages/main/src/Dialog.js
@@ -20,7 +20,7 @@ const metadata = {
 		 * <b>Note:</b> The <code>ui5-dialog</code> will be stretched to aproximetly
 		 * 90% of the viewport.
 		 *
-		 * @type {Boolean}
+		 * @type {boolean}
 		 * @defaultvalue false
 		 * @public
 		 */