@openui5/sap.ui.webc.main 1.111.0 → 1.112.0

package/src/sap/ui/webc/main/thirdparty/Select.js

@@ -24,10 +24,9 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
   _ResponsivePopoverCommon = _interopRequireDefault(_ResponsivePopoverCommon);
   _ValueStateMessage = _interopRequireDefault(_ValueStateMessage);
   _SelectPopover = _interopRequireDefault(_SelectPopover);
-
   function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
   // Templates
+
   // Styles
 
   /**
@@ -37,9 +36,7 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
     tag: "ui5-select",
     languageAware: true,
     managedSlots: true,
-    slots:
-    /** @lends sap.ui.webcomponents.main.Select.prototype */
-    {
+    slots: /** @lends sap.ui.webcomponents.main.Select.prototype */{
       /**
        * Defines the component options.
        *
@@ -58,7 +55,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         type: HTMLElement,
         invalidateOnChildChange: true
       },
-
       /**
        * Defines the value state message that will be displayed as pop up under the component.
        * <br><br>
@@ -75,7 +71,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       valueStateMessage: {
         type: HTMLElement
       },
-
       /**
        * The slot is used to render native <code>input</code> HTML element within Light DOM to enable form submit,
        * when <code>name</code> property is set.
@@ -87,9 +82,7 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         type: HTMLElement
       }
     },
-    properties:
-    /** @lends sap.ui.webcomponents.main.Select.prototype */
-    {
+    properties: /** @lends sap.ui.webcomponents.main.Select.prototype */{
       /**
        * Defines whether the component is in disabled state.
        * <br><br>
@@ -102,7 +95,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       disabled: {
         type: Boolean
       },
-
       /**
        * Determines the name with which the component will be submitted in an HTML form.
        * The value of the component will be the value of the currently selected <code>ui5-option</code>.
@@ -123,7 +115,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       name: {
         type: String
       },
-
       /**
        * Defines the value state of the component.
        * <br><br>
@@ -144,7 +135,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         type: _ValueState.default,
         defaultValue: _ValueState.default.None
       },
-
       /**
        * Defines whether the component is required.
        *
@@ -156,7 +146,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       required: {
         type: Boolean
       },
-
       /**
        * Defines the accessible aria name of the component.
        *
@@ -168,7 +157,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       accessibleName: {
         type: String
       },
-
       /**
        * Receives id(or many ids) of the elements that label the select.
        *
@@ -189,7 +177,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         type: Boolean,
         noAttribute: true
       },
-
       /**
        * @private
        */
@@ -201,7 +188,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         defaultValue: 0,
         noAttribute: true
       },
-
       /**
        * @private
        */
@@ -209,9 +195,7 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         type: Boolean
       }
     },
-    events:
-    /** @lends sap.ui.webcomponents.main.Select.prototype */
-    {
+    events: /** @lends sap.ui.webcomponents.main.Select.prototype */{
       /**
        * Fired when the selected option changes.
        *
@@ -226,6 +210,7 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       }
     }
   };
+
   /**
    * @class
    *
@@ -259,32 +244,25 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
    * @public
    * @since 0.8.0
    */
-
   class Select extends _UI5Element.default {
     static get metadata() {
       return metadata;
     }
-
     static get render() {
       return _LitRenderer.default;
     }
-
     static get template() {
       return _SelectTemplate.default;
     }
-
     static get staticAreaTemplate() {
       return _SelectPopoverTemplate.default;
     }
-
     static get styles() {
       return _Select.default;
     }
-
     static get staticAreaStyles() {
       return [_ResponsivePopoverCommon.default, _ValueStateMessage.default, _SelectPopover.default];
     }
-
     constructor() {
       super();
       this._syncedOptions = [];
@@ -295,89 +273,72 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       this._typedChars = "";
       this._typingTimeoutID = -1;
     }
-
     onBeforeRendering() {
       this._syncSelection();
-
       this._enableFormSupport();
     }
-
     onAfterRendering() {
       this.toggleValueStatePopover(this.shouldOpenValueStateMessagePopover);
-
       if (this._isPickerOpen) {
         if (!this._listWidth) {
           this._listWidth = this.responsivePopover.offsetWidth;
         }
       }
-
       this._attachRealDomRefs();
     }
-
     _onfocusin() {
       this.focused = true;
     }
-
     _onfocusout() {
       this.focused = false;
     }
-
     get _isPickerOpen() {
       return !!this.responsivePopover && this.responsivePopover.opened;
     }
-
     async _respPopover() {
       const staticAreaItem = await this.getStaticAreaItemDomRef();
       return staticAreaItem.querySelector("[ui5-responsive-popover]");
     }
+
     /**
      * Currently selected option.
      * @readonly
      * @type { sap.ui.webcomponents.main.ISelectOption }
      * @public
      */
-
-
     get selectedOption() {
       return this._filteredItems.find(option => option.selected);
     }
-
     async _toggleRespPopover() {
       this._iconPressed = true;
       this.responsivePopover = await this._respPopover();
-
       if (this.disabled) {
         return;
       }
-
       if (this._isPickerOpen) {
         this.responsivePopover.close();
       } else {
         this.responsivePopover.showAt(this);
       }
     }
-
     async _attachRealDomRefs() {
       this.responsivePopover = await this._respPopover();
       this.options.forEach(option => {
         option._getRealDomRef = () => this.responsivePopover.querySelector(`*[data-ui5-stable=${option.stableDomRef}]`);
       });
     }
-
     _syncSelection() {
       let lastSelectedOptionIndex = -1,
-          firstEnabledOptionIndex = -1;
+        firstEnabledOptionIndex = -1;
       const options = this._filteredItems;
       const syncOpts = options.map((opt, index) => {
         if (opt.selected || opt.textContent === this.value) {
           // The second condition in the IF statement is added because of Angular Reactive Forms Support(Two way data binding)
           lastSelectedOptionIndex = index;
         }
-
         if (firstEnabledOptionIndex === -1) {
           firstEnabledOptionIndex = index;
         }
-
         opt.selected = false;
         opt._focused = false;
         return {
@@ -392,7 +353,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
           stableDomRef: opt.stableDomRef
         };
       });
-
       if (lastSelectedOptionIndex > -1 && !syncOpts[lastSelectedOptionIndex].disabled) {
         syncOpts[lastSelectedOptionIndex].selected = true;
         syncOpts[lastSelectedOptionIndex]._focused = true;
@@ -403,7 +363,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       } else {
         this._text = "";
         this._selectedIndex = -1;
-
         if (syncOpts[firstEnabledOptionIndex]) {
           syncOpts[firstEnabledOptionIndex].selected = true;
           syncOpts[firstEnabledOptionIndex]._focused = true;
@@ -413,13 +372,10 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
           this._text = options[firstEnabledOptionIndex].textContent;
         }
       }
-
       this._syncedOptions = syncOpts;
     }
-
     _enableFormSupport() {
       const FormSupport = (0, _FeaturesRegistry.getFeature)("FormSupport");
-
       if (FormSupport) {
         FormSupport.syncNativeHiddenInput(this, (element, nativeInput) => {
           nativeInput.disabled = element.disabled;
@@ -432,14 +388,11 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
 
     _onkeydown(event) {
       const isTab = (0, _Keys.isTabNext)(event) || (0, _Keys.isTabPrevious)(event);
-
       if (isTab && this.responsivePopover && this.responsivePopover.opened) {
         this.responsivePopover.close();
       }
-
       if ((0, _Keys.isShow)(event)) {
         event.preventDefault();
-
         this._toggleRespPopover();
       } else if ((0, _Keys.isSpace)(event)) {
         event.preventDefault();
@@ -455,14 +408,14 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         this._handleArrowNavigation(event);
       }
     }
-
     _handleKeyboardNavigation(event) {
       if ((0, _Keys.isEnter)(event)) {
         return;
       }
-
       const typedCharacter = event.key.toLowerCase();
-      this._typedChars += typedCharacter; // We check if we have more than one characters and they are all duplicate, we set the
+      this._typedChars += typedCharacter;
+
+      // We check if we have more than one characters and they are all duplicate, we set the
       // text to be the last input character (typedCharacter). If not, we set the text to be
       // the whole input string.
 
@@ -472,48 +425,35 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         this._typedChars = "";
         this._typingTimeoutID = -1;
       }, 1000);
-
       this._selectTypedItem(text);
     }
-
     _selectTypedItem(text) {
       const currentIndex = this._selectedIndex;
-
       const itemToSelect = this._searchNextItemByText(text);
-
       if (itemToSelect) {
         const nextIndex = this._filteredItems.indexOf(itemToSelect);
-
         this._changeSelectedItem(this._selectedIndex, nextIndex);
-
         if (currentIndex !== this._selectedIndex) {
           this.itemSelectionAnnounce();
         }
       }
     }
-
     _searchNextItemByText(text) {
       let orderedOptions = this._filteredItems.slice(0);
-
       const optionsAfterSelected = orderedOptions.splice(this._selectedIndex + 1, orderedOptions.length - this._selectedIndex);
       const optionsBeforeSelected = orderedOptions.splice(0, orderedOptions.length - 1);
       orderedOptions = optionsAfterSelected.concat(optionsBeforeSelected);
       return orderedOptions.find(option => option.textContent.toLowerCase().startsWith(text));
     }
-
     _handleHomeKey(event) {
       event.preventDefault();
-
       this._changeSelectedItem(this._selectedIndex, 0);
     }
-
     _handleEndKey(event) {
       const lastIndex = this._filteredItems.length - 1;
       event.preventDefault();
-
       this._changeSelectedItem(this._selectedIndex, lastIndex);
     }
-
     _onkeyup(event) {
       if ((0, _Keys.isSpace)(event)) {
         if (this._isPickerOpen) {
@@ -523,66 +463,52 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         }
       }
     }
-
     _getSelectedItemIndex(item) {
       return this._filteredItems.findIndex(option => `${option._id}-li` === item.id);
     }
-
     _select(index) {
       this._filteredItems[this._selectedIndex].selected = false;
       this._selectedIndex = index;
       this._filteredItems[index].selected = true;
     }
+
     /**
      * The user clicked on an item from the list
      * @private
      */
-
-
     _handleItemPress(event) {
       const item = event.detail.selectedItems[0];
-
       const selectedItemIndex = this._getSelectedItemIndex(item);
-
       this._handleSelectionChange(selectedItemIndex);
     }
-
     _itemMousedown(event) {
       // prevent actual focus of items
       event.preventDefault();
     }
-
     _onclick(event) {
       this.getFocusDomRef().focus();
-
       this._toggleRespPopover();
     }
+
     /**
      * The user selected an item with Enter or Space
      * @private
      */
-
-
     _handleSelectionChange(index = this._selectedIndex) {
       this._select(index);
-
       this._toggleRespPopover();
     }
-
     _handleArrowNavigation(event) {
       let nextIndex = -1;
       const currentIndex = this._selectedIndex;
       const isDownKey = (0, _Keys.isDown)(event);
       event.preventDefault();
-
       if (isDownKey) {
         nextIndex = this._getNextOptionIndex();
       } else {
         nextIndex = this._getPreviousOptionIndex();
       }
-
       this._changeSelectedItem(this._selectedIndex, nextIndex);
-
       if (currentIndex !== this._selectedIndex) {
         // Announce new item even if picker is opened.
         // The aria-activedescendents attribute can't be used,
@@ -590,7 +516,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         this.itemSelectionAnnounce();
       }
     }
-
     _changeSelectedItem(oldIndex, newIndex) {
       const options = this._filteredItems;
       options[oldIndex].selected = false;
@@ -598,57 +523,47 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       options[newIndex].selected = true;
       options[newIndex]._focused = true;
       this._selectedIndex = newIndex;
-
       if (!this._isPickerOpen) {
         // arrow pressed on closed picker - do selection change
         this._fireChangeEvent(options[newIndex]);
       }
     }
-
     _getNextOptionIndex() {
       return this._selectedIndex === this.options.length - 1 ? this._selectedIndex : this._selectedIndex + 1;
     }
-
     _getPreviousOptionIndex() {
       return this._selectedIndex === 0 ? this._selectedIndex : this._selectedIndex - 1;
     }
-
     _beforeOpen() {
       this._selectedIndexBeforeOpen = this._selectedIndex;
       this._lastSelectedOption = this._filteredItems[this._selectedIndex];
       this.focused = false;
     }
-
     _afterOpen() {
       this.opened = true;
     }
-
     _afterClose() {
       this.opened = false;
       this.focused = true;
       this._iconPressed = false;
       this._listWidth = 0;
-
       if (this._escapePressed) {
         this._select(this._selectedIndexBeforeOpen);
-
         this._escapePressed = false;
       } else if (this._lastSelectedOption !== this._filteredItems[this._selectedIndex]) {
         this._fireChangeEvent(this._filteredItems[this._selectedIndex]);
-
         this._lastSelectedOption = this._filteredItems[this._selectedIndex];
       }
     }
-
     _fireChangeEvent(selectedOption) {
       this.fireEvent("change", {
         selectedOption
-      }); //  Angular two way data binding
+      });
 
+      //  Angular two way data binding
       this.selectedItem = selectedOption.textContent;
       this.fireEvent("selected-item-changed");
     }
-
     get valueStateTextMappings() {
       return {
         "Success": Select.i18nBundle.getText(_i18nDefaults.VALUE_STATE_SUCCESS),
@@ -657,44 +572,35 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         "Warning": Select.i18nBundle.getText(_i18nDefaults.VALUE_STATE_WARNING)
       };
     }
-
     get valueStateText() {
       return this.valueStateTextMappings[this.valueState];
     }
-
     get hasValueState() {
       return this.valueState !== _ValueState.default.None;
     }
-
     get valueStateTextId() {
       return this.hasValueState ? `${this._id}-valueStateDesc` : undefined;
     }
-
     get isDisabled() {
       return this.disabled || undefined;
     }
-
     get _headerTitleText() {
       return Select.i18nBundle.getText(_i18nDefaults.INPUT_SUGGESTIONS_TITLE);
     }
-
     get _currentSelectedItem() {
       return this.shadowRoot.querySelector(`#${this._filteredItems[this._selectedIndex]._id}-li`);
     }
-
     get _currentlySelectedOption() {
       return this._filteredItems[this._selectedIndex];
     }
-
     get tabIndex() {
       return this.disabled || this.responsivePopover // Handles focus on Tab/Shift + Tab when the popover is opened
       && this.responsivePopover.opened ? "-1" : "0";
     }
+
     /**
     * This method is relevant for sap_horizon theme only
     */
-
-
     get _valueStateMessageInputIcon() {
       const iconPerValueState = {
         Error: "error",
@@ -704,7 +610,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
       };
       return this.valueState !== _ValueState.default.None ? iconPerValueState[this.valueState] : "";
     }
-
     get classes() {
       return {
         popoverValueState: {
@@ -719,7 +624,6 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         }
       };
     }
-
     get styles() {
       return {
         popoverHeader: {
@@ -734,62 +638,48 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         }
       };
     }
-
     get ariaLabelText() {
       return (0, _AriaLabelHelper.getEffectiveAriaLabelText)(this);
     }
-
     get valueStateMessageText() {
       return this.getSlottedNodes("valueStateMessage").map(el => el.cloneNode(true));
     }
-
     get shouldDisplayDefaultValueStateMessage() {
       return !this.valueStateMessage.length && this.hasValueStateText;
     }
-
     get hasValueStateText() {
       return this.hasValueState && this.valueState !== _ValueState.default.Success;
     }
-
     get shouldOpenValueStateMessagePopover() {
       return this.focused && this.hasValueStateText && !this._iconPressed && !this._isPickerOpen && !this._isPhone;
     }
-
     get _ariaRoleDescription() {
       return Select.i18nBundle.getText(_i18nDefaults.SELECT_ROLE_DESCRIPTION);
     }
-
     get _isPhone() {
       return (0, _Device.isPhone)();
     }
-
     get _filteredItems() {
       return this.options.filter(option => !option.disabled);
     }
-
     itemSelectionAnnounce() {
       let text;
       const optionsCount = this._filteredItems.length;
       const itemPositionText = Select.i18nBundle.getText(_i18nDefaults.LIST_ITEM_POSITION, this._selectedIndex + 1, optionsCount);
-
       if (this.focused && this._currentlySelectedOption) {
         text = `${this._currentlySelectedOption.textContent} ${this._isPickerOpen ? itemPositionText : ""}`;
         (0, _InvisibleMessage.default)(text, "Polite");
       }
     }
-
     async openValueStatePopover() {
       this.popover = await this._getPopover();
-
       if (this.popover) {
         this.popover.showAt(this);
       }
     }
-
     closeValueStatePopover() {
       this.popover && this.popover.close();
     }
-
     toggleValueStatePopover(open) {
       if (open) {
         this.openValueStatePopover();
@@ -797,26 +687,20 @@ sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/
         this.closeValueStatePopover();
       }
     }
-
     get selectedOptionIcon() {
       return this.selectedOption && this.selectedOption.icon;
     }
-
     async _getPopover() {
       const staticAreaItem = await this.getStaticAreaItemDomRef();
       return staticAreaItem.querySelector("[ui5-popover]");
     }
-
     static get dependencies() {
       return [_Option.default, _Label.default, _ResponsivePopover.default, _Popover.default, _List.default, _StandardListItem.default, _Icon.default, _Button.default];
     }
-
     static async onDefine() {
       Select.i18nBundle = await (0, _i18nBundle.getI18nBundle)("@ui5/webcomponents");
     }
-
   }
-
   Select.define();
   var _default = Select;
   _exports.default = _default;