@oracle/oraclejet 10.1.1 → 10.1.6

package/dist/js/libs/oj/debug_esm/ojgroupingdataprovider.js

@@ -313,7 +313,10 @@ class GroupingDataProvider {
                 let doneOrSkip = skipFetch || self._parent._dataFetchComplete;
                 return this._parent
                     ._getDataFromDataProvider(this._params, 'root', doneOrSkip)
-                    .then(function () {
+                    .then(function (res) {
+                    if (res === 'error') {
+                        return Promise.reject("Fetch interrupted due to refresh event");
+                    }
                     self._parent._updateSectionIndex();
                     let updatedParams = new self._parent.FetchByOffsetParameters(self._parent, self._parent._currentBaseOffset, self._params.size, self._params.sortCriteria, self._params.filterCriterion);
                     return self._dataprovider.fetchByOffset(updatedParams).then(function (res) {
@@ -356,7 +359,10 @@ class GroupingDataProvider {
                 return this._parent
                     ._getDataFromDataProvider(this._params, this._parentKey, doneOrSkip)
                     .then(function (value) {
-                    if (value === undefined) {
+                    if (value === 'error') {
+                        return Promise.reject("Fetch interrupted due to refresh event");
+                    }
+                    else if (value === undefined) {
                         self._parent._updateSectionIndex();
                     }
                     return self._dataprovider.fetchByOffset(updatedParams).then(function (res) {
@@ -651,42 +657,51 @@ class GroupingDataProvider {
         return this;
     }
     _getDataFromDataProvider(params, source, skipFetch) {
-        let self = this;
         if (!this._inCurrentFetchingSection(source) || skipFetch) {
-            return Promise.resolve(true);
-        }
-        if (!self._internalIterator) {
-            self._internalIterator = this._dataProvider.fetchFirst(params)[Symbol.asyncIterator]();
-            self._previousTotalSize = 0;
-            self._internalIteratorCacheLength = 0;
-        }
-        if (self._previousTotalSize != self._treeData.length) {
-            self._internalIteratorCacheLength = 0;
-        }
-        let helperFunction = (storedDataLength) => {
-            return self._internalIterator.next().then((result) => {
-                self._treeData = self._treeData.concat(result['value']['data']);
-                self._treeMetadata = self._treeMetadata.concat(result['value']['metadata']);
-                result['value']['metadata'].forEach(function (val) {
-                    self._treeKeyMap.push(val.key);
+            return Promise.resolve('skip');
+        }
+        let iterator = this._internalIterator;
+        if (!this._internalIterator) {
+            iterator = this._dataProvider.fetchFirst(params)[Symbol.asyncIterator]();
+            this._internalIterator = iterator;
+            this._previousTotalSize = 0;
+            this._internalIteratorCacheLength = 0;
+        }
+        if (this._previousTotalSize != this._treeData.length) {
+            this._internalIteratorCacheLength = 0;
+        }
+        return new Promise((resolve) => {
+            this._internalIteratorResolve = resolve;
+            const helperFunction = (storedDataLength, iterator) => {
+                return this._internalIterator.next().then((result) => {
+                    if (this._internalIterator != null && this._internalIterator === iterator) {
+                        this._treeData = this._treeData.concat(result['value']['data']);
+                        this._treeMetadata = this._treeMetadata.concat(result['value']['metadata']);
+                        result['value']['metadata'].forEach((val) => {
+                            this._treeKeyMap.push(val.key);
+                        });
+                        storedDataLength += result['value']['data'].length;
+                        if (result['done']) {
+                            this._dataFetchComplete = true;
+                        }
+                        else {
+                            this._dataFetchComplete = false;
+                        }
+                        if (result['done'] || storedDataLength >= result['value']['fetchParameters']['size']) {
+                            const remainder = storedDataLength - result['value']['fetchParameters']['size'];
+                            this._internalIteratorCacheLength = Math.max(0, remainder);
+                            this._previousTotalSize = this._treeData.length;
+                            this._internalIteratorResolve(undefined);
+                            this._internalIteratorResolve = null;
+                        }
+                        else {
+                            return helperFunction(storedDataLength, iterator);
+                        }
+                    }
                 });
-                storedDataLength += result['value']['data'].length;
-                if (result['done']) {
-                    self._dataFetchComplete = true;
-                }
-                else {
-                    self._dataFetchComplete = false;
-                }
-                if (result['done'] || storedDataLength >= result['value']['fetchParameters']['size']) {
-                    let remainder = storedDataLength - result['value']['fetchParameters']['size'];
-                    self._internalIteratorCacheLength = Math.max(0, remainder);
-                    self._previousTotalSize = self._treeData.length;
-                    return;
-                }
-                return helperFunction(storedDataLength);
-            });
-        };
-        return helperFunction(self._internalIteratorCacheLength);
+            };
+            return helperFunction(this._internalIteratorCacheLength, iterator);
+        });
     }
     _inCurrentFetchingSection(source) {
         if (source === 'root') {
@@ -1606,9 +1621,18 @@ class GroupingDataProvider {
     }
     _addEventListeners(dataprovider) {
         let self = this;
-        dataprovider.addEventListener('refresh', function (event) {
-            self._initialize();
-            self.dispatchEvent(new DataProviderRefreshEvent());
+        dataprovider.addEventListener('refresh', (event) => {
+            this._initialize();
+            if (this._internalIteratorResolve != null) {
+                this._internalIteratorResolve('error');
+                this._internalIteratorResolve = null;
+                window.requestAnimationFrame(() => {
+                    this.dispatchEvent(new DataProviderRefreshEvent());
+                });
+            }
+            else {
+                this.dispatchEvent(new DataProviderRefreshEvent());
+            }
         });
         dataprovider.addEventListener('mutate', function (event) {
             if (event.detail.add) {

package/dist/js/libs/oj/debug_esm/ojinputsearch.js

@@ -206,6 +206,8 @@ let InputSearch = InputSearch_1 = class InputSearch extends ElementVComponent {
         if (props.suggestions) {
             this._dataProvider = this._wrapDataProviderIfNeeded(this.props.suggestions);
         }
+        const agentInfo = oj.AgentUtils.getAgentInfo();
+        this._isAndroidDevice = agentInfo.os === oj.AgentUtils.OS.ANDROID;
         this.state = {
             dropdownOpen: false,
             dropdownAbove: false,
@@ -419,7 +421,7 @@ let InputSearch = InputSearch_1 = class InputSearch extends ElementVComponent {
         });
     }
     _handleInput(event) {
-        if (!this._isComposing) {
+        if (!this._isComposing || this._isAndroidDevice) {
             let autocomplete;
             const filterText = this.state.filterText || '';
             const lowercaseFilter = filterText.toLowerCase();

package/dist/js/libs/oj/debug_esm/ojinputtext.js

@@ -1568,6 +1568,10 @@ oj.__registerWidget('oj.inputBase', $.oj.editableValue,
       var readOnly = this.options.readOnly;
 
       this._rtl = this._GetReadingDirection() === 'rtl';
+      // JET-39086 - raw-value is not getting updated until space in android devices
+      // In android device we need to update rawValue even for composition events
+      // Get and store agent info
+      this._isAndroidDevice = (oj.AgentUtils.getAgentInfo().os === oj.AgentUtils.OS.ANDROID);
 
       // update element state using options
       if (typeof readOnly === 'boolean') {
@@ -2195,7 +2199,20 @@ oj.__registerWidget('oj.inputBase', $.oj.editableValue,
       // The keystroke sequence is bracketed by compositionstart and compositionend events,
       // and each keystroke also fires the input event.  Including the intermediate input
       // in rawValue makes it hard to do meaningful validation.
-      if (!this._isComposing) {
+      // JET-39086 - raw-value is not getting updated until space in android devices
+      // In android devices, typing in an English word will behave similar to what one
+      // would see when they compose a CJK character in desktop devices. So, we need to
+      // update the raw-value for all the input events in Android devices without considering
+      // composition events so that the property gets updated for each english character and not
+      // only for delimiters. In GBoard all the CJK keyboard layouts directly allow users
+      // to input a CJK character, so we do not need to rely on composition events for that.
+      // In Japanese keyboard, one of the three available layouts uses english chars
+      // to compose a Japanese character in which case circumventing the logic would end up
+      // updating the property with garbage values. But, it is highly unlikely for one to
+      // use this layout as the other two layouts would allow users to directly type in Japanese
+      // characters. So, for now we will not have to worry about composition events in
+      // Android devices.
+      if (!this._isComposing || this._isAndroidDevice) {
         if (this._hasMaxLength()) {
           this._filterTextAndSetValues(this.lastFilteredText,
             this._GetContentElement().val(), false, true);

package/dist/js/libs/oj/debug_esm/ojlistdataproviderview.js

@@ -577,6 +577,7 @@ class ListDataProviderView {
         cachedData[ListDataProviderView._ITEMS] = [];
         cachedData[ListDataProviderView._DONE] = false;
         cachedData[ListDataProviderView._STARTINDEX] = 0;
+        cachedData[ListDataProviderView._LASTDONEHASDATA] = false;
         let size = params != null ? params[ListDataProviderView._SIZE] : null;
         let sortCriteria = params != null ? params[ListDataProviderView._SORTCRITERIA] : null;
         if (sortCriteria == null) {
@@ -630,9 +631,17 @@ class ListDataProviderView {
             let cachedAsyncIterator = this.dataProvider[ListDataProviderView._FETCHFIRST](updatedParams)[Symbol.asyncIterator]();
             return new this.AsyncIterable(this, new this.AsyncIterator(this, (function (cachedData, cachedAsyncIterator) {
                 return function () {
+                    if (cachedData[ListDataProviderView._LASTDONEHASDATA]) {
+                        cachedData[ListDataProviderView._LASTDONEHASDATA] = false;
+                        return Promise.resolve(new self.AsyncIteratorReturnResult(self, new self.FetchListResult(this, params, [], [])));
+                    }
                     return cachedAsyncIterator.next().then(function (result) {
-                        let data = result[ListDataProviderView._VALUE][ListDataProviderView._DATA];
-                        let metadata = result[ListDataProviderView._VALUE][ListDataProviderView._METADATA];
+                        let resultValue = result[ListDataProviderView._VALUE];
+                        if (!resultValue) {
+                            resultValue = { data: [], metadata: [], fetchParameters: null };
+                        }
+                        const data = resultValue[ListDataProviderView._DATA];
+                        const metadata = resultValue[ListDataProviderView._METADATA];
                         let items = data.map(function (value, index) {
                             return new self.Item(self, metadata[index], data[index]);
                         });
@@ -644,7 +653,7 @@ class ListDataProviderView {
                         cachedData[ListDataProviderView._DONE] = result[ListDataProviderView._DONE];
                         let size = params != null ? params[ListDataProviderView._SIZE] : null;
                         let offset = params != null ? params[ListDataProviderView._OFFSET] : null;
-                        let resultFetchParams = result[ListDataProviderView._VALUE][ListDataProviderView._FETCHPARAMETERS];
+                        let resultFetchParams = resultValue[ListDataProviderView._FETCHPARAMETERS];
                         let resultSortCriteria = resultFetchParams != null
                             ? resultFetchParams[ListDataProviderView._SORTCRITERIA]
                             : null;
@@ -748,7 +757,7 @@ class ListDataProviderView {
             let mappedFilterCriterion = this._getMappedFilterCriterion(params[ListDataProviderView._FILTERCRITERION]);
             this._filterResult(mappedFilterCriterion, cachedItems);
         }
-        if (cachedItems.length < fetchSize) {
+        if (params && params[ListDataProviderView._SIZE] > 0 && cachedItems.length < fetchSize) {
             if (!cachedData[ListDataProviderView._DONE]) {
                 return cachedAsyncIterator.next().then(function (nextResult) {
                     let data = nextResult[ListDataProviderView._VALUE][ListDataProviderView._DATA];
@@ -763,10 +772,7 @@ class ListDataProviderView {
                     let mappedResult = self._getMappedItems(items);
                     self._cacheResult(cachedData, mappedResult);
                     cachedData[ListDataProviderView._DONE] = nextResult[ListDataProviderView._DONE];
-                    if (data.length === 0) {
-                        return self._createResultPromise(params, cachedData, cachedItems);
-                    }
-                    return self._fetchUntilOffset(nextResult[ListDataProviderView._VALUE][ListDataProviderView._FETCHPARAMETERS], offset, data.length, cachedData, cachedAsyncIterator);
+                    return self._fetchUntilOffset(params, offset, data.length, cachedData, cachedAsyncIterator);
                 });
             }
         }
@@ -781,7 +787,16 @@ class ListDataProviderView {
         let metadata = cachedItems.map(function (item) {
             return item[ListDataProviderView._METADATA];
         });
-        if (data.length === 0) {
+        let isDone = false;
+        if (cachedData[ListDataProviderView._DONE]) {
+            if (data.length === 0) {
+                isDone = true;
+            }
+            else {
+                cachedData[ListDataProviderView._LASTDONEHASDATA] = true;
+            }
+        }
+        if (isDone) {
             return Promise.resolve(new this.AsyncIteratorReturnResult(this, new this.FetchListResult(this, params, data, metadata)));
         }
         return Promise.resolve(new this.AsyncIteratorYieldResult(this, new this.FetchListResult(this, params, data, metadata)));
@@ -915,6 +930,7 @@ ListDataProviderView._SIZE = 'size';
 ListDataProviderView._FETCHPARAMETERS = 'fetchParameters';
 ListDataProviderView._VALUE = 'value';
 ListDataProviderView._DONE = 'done';
+ListDataProviderView._LASTDONEHASDATA = 'lastDoneHasData';
 ListDataProviderView._DATAMAPPING = 'dataMapping';
 ListDataProviderView._MAPFIELDS = 'mapFields';
 ListDataProviderView._MAPSORTCRITERIA = 'mapSortCriteria';

package/dist/js/libs/oj/debug_esm/ojlistview.js

@@ -5096,7 +5096,22 @@ const _ojListView = _ListViewUtils.clazz(Object, /** @lends oj._ojListView.proto
         event.preventDefault();
       } else {
         // click on item
-        var item = this._findItem(target);
+        var item = this._findItem(target, true);
+        if (item != null && this._isClickthroughDisabled(item)) {
+          // if the target is an input element and also a descendent of an element with
+          // clickthrough disabled (only when data-oj-clickthrough syntax is used), we'll still
+          // need to make it as current and enter actionable mode
+          if (isClickthroughDisabled(item.get(0)) &&
+            this._isInputElement(target.get(0))) {
+            item = this.FindItem(target.get(0));
+            if (item != null) {
+              this.HandleClickActive(item, event);
+              this._enterActionableMode();
+            }
+          }
+          item = null;
+        }
+
         if (item == null || item.length === 0) {
           // can't find item
           return;

package/dist/js/libs/oj/debug_esm/ojnavigationlist.js

@@ -6799,13 +6799,6 @@ SlidingNavListHandler.prototype.HandleClick = function (event) {
 SlidingNavListHandler.prototype.IsSelectable = function (item) {
   // Slider items don't have Aria-selected tag, overrding selction for slider navlist
   var itemSelectionMarkerAttr = 'aria-selected';
-  var prevAnchorTag;
-  var anchor = this.m_widget.getFocusItem($(item))[0];
-  var collapseClass = this.m_widget.getCollapseIconStyleClass();
-  prevAnchorTag = anchor.previousElementSibling;
- if (prevAnchorTag && prevAnchorTag.classList.contains(collapseClass)) {
-    return false;
- }
   return (this.m_widget.getFocusItem($(item))[0].getAttribute('role') === 'menuitem' &&
    !this.m_widget.getFocusItem($(item))[0].hasAttribute(itemSelectionMarkerAttr));
 };

package/dist/js/libs/oj/debug_esm/ojselectcombobox.js

@@ -3190,7 +3190,10 @@ const _AbstractOjChoice = _ComboUtils.clazz(Object,
       this.headerInitialized = false;
       this.isOjOption = this.ojContext._IsCustomElement() && !opts.options &&
                           opts.element.find('oj-option').length > 0;
-
+      // JET-39086 - raw-value is not getting updated until space in android devices
+      // In android device we need to update rawValue even for composition events
+      // Get and store agent info
+      this._isAndroidDevice = (oj$1.AgentUtils.getAgentInfo().os === oj$1.AgentUtils.OS.ANDROID);
       // 'opts.element' is initialized in _setup() method in component files
       // ojcombobox.js, ojselect.js and ojInputSearch.js.
       // destroy if called on an existing component
@@ -5964,6 +5967,7 @@ const _AbstractOjChoice = _ComboUtils.clazz(Object,
      */
     _selectItemFromArray: function (values, options) {
       const optionsArray = this.ojContext.options.options;
+      const optionsKeys = this.ojContext.options.optionsKeys || {};
       let foundItems = new Map();
       let items = [];
 
@@ -5972,9 +5976,10 @@ const _AbstractOjChoice = _ComboUtils.clazz(Object,
       }
 
       for (let i = 0; i < optionsArray.length; i++) {
-        const _item = optionsArray[i];
-        if (values.includes(this.id(_item))) {
-          foundItems.set(this.id(_item), _item);
+        const item = optionsArray[i];
+        const value = _ComboUtils.lookupOptionKeys(item, optionsKeys, 'value');
+        if (values.includes(value)) {
+          foundItems.set(value, item);
 
           // prematurely break the loop if all values are found
           if (values.length === foundItems.size) {
@@ -5995,7 +6000,16 @@ const _AbstractOjChoice = _ComboUtils.clazz(Object,
         }
 
         // Push the created item in the array if it is not null
-        if (_item != null) items.push(_item);
+        if (_item != null) {
+          // Map using optionsKeys if specified
+          if (optionsKeys.value != null) {
+            _item.value = _item[optionsKeys.value];
+          }
+          if (optionsKeys.label != null) {
+            _item.label = _item[optionsKeys.label];
+          }
+          items.push(_item);
+        }
       }));
 
       return this._InvokeSelection(items, options);
@@ -6521,7 +6535,20 @@ const _AbstractMultiChoice = _ComboUtils.clazz(_AbstractOjChoice,
       }));
 
       this.search.on('input', this._bind(function (e) {
-        if (!this.ojContext._isComposing) {
+        // JET-39086 - raw-value is not getting updated until space in android devices
+        // In android devices, typing in an English word will behave similar to what one
+        // would see when they compose a CJK character in desktop devices. So, we need to
+        // update the raw-value for all the input events in Android devices without considering
+        // composition events so that the property gets updated for each english character and not
+        // only for delimiters. In GBoard all the CJK keyboard layouts directly allow users
+        // to input a CJK character, so we do not need to rely on composition events for that.
+        // In Japanese keyboard, one of the three available layouts uses english chars
+        // to compose a Japanese character in which case circumventing the logic would end up
+        // updating the property with garbage values. But, it is highly unlikely for one to
+        // use this layout as the other two layouts would allow users to directly type in Japanese
+        // characters. So, for now we will not have to worry about composition events in
+        // Android devices.
+        if (!this.ojContext._isComposing || this._isAndroidDevice) {
           this._onSearchInputHandler(e);
         }
       }));
@@ -7523,24 +7550,34 @@ const _AbstractMultiChoice = _ComboUtils.clazz(_AbstractOjChoice,
       const opts = _ComboUtils.getOpts(this.ojContext);
       const isDataProvider = opts ? _ComboUtils.isDataProvider(opts.options) : false;
 
-      let valueOptionsData = [];
-      let valueOptionsMetadata = [];
+      const values = [];
+      const valueOptions = [];
+      const valueOptionsData = [];
+      const valueOptionsMetadata = [];
+
+      // Iterate through the items and generate value and valueOptions
+      items.forEach(function (item) {
+        values.push(this.id(item));
+        valueOptions.push({
+          label: item.label,
+          value: this.id(item)
+        });
 
-      if (isDataProvider) {
-        items.forEach(function (item) {
+        // populate data and metadata only when using a data provider
+        if (isDataProvider) {
           valueOptionsData.push(item.data);
           valueOptionsMetadata.push(item.metadata);
-        });
-      }
+        }
+      }.bind(this));
+
       let context = { optionMetadata: { trigger: options.trigger } };
       context = _ComboUtils.getContextWithExtraData(context, opts, valueOptionsData,
         valueOptionsMetadata);
 
       // set valueOptions
-      this.setValOpts(items);
+      this.setValOpts(valueOptions);
       this._skipSetValueOptions = true;
 
-      const values = items.map(this.id);
       const setValueReturn = this.setVal(values, null, context);
 
       if (setValueReturn instanceof Promise) {
@@ -7631,7 +7668,7 @@ const _OjMultiCombobox = _ComboUtils.clazz(_AbstractMultiChoice,
       // combobox many in most of situations (since we do not call this method unless
       // we know for a fact that the value is not present), when having label-edge=inside,
       // this method will be called unconditionally on focus events. Since the placeholder
-      // is being updated programatically for label animations.
+      // is being updated programmatically for label animations.
       // This results in the placeholder being set even when there is a value which
       // is causing issues.
       // In oj-combobox-one, this is not a problem as the placeholder is set on the input
@@ -7639,11 +7676,26 @@ const _OjMultiCombobox = _ComboUtils.clazz(_AbstractMultiChoice,
       // will not be shown when there is a value selected.
       // To fix this in oj-combobox-many, we will be setting the placeholder only when there is
       // no value.
-      if (_ComboUtils.isValueForPlaceholder(true, this.getVal()) &&
-        _ComboUtils.isValueOptionsForPlaceholder(true, this.getValOpts())) {
-        // Now that we know, there is no value selected, call the superclass' method to
+      // JET-45520 - [jet10] oj-combobox-many: placeholder text is missing is if "required" turned on
+      // A regression from the fix for JET-39650. When the component is in invalid state, the
+      // this.getVal() might not reflect the actual displayValue. So, in those cases we need to
+      // use this.currentValue instead.
+      const isValid = this.ojContext.isValid();
+      const isValidValueForPlaceholder = _ComboUtils.isValueForPlaceholder(true, this.getVal()) &&
+        _ComboUtils.isValueOptionsForPlaceholder(true, this.getValOpts());
+      const isCurrentValueForPlaceholder =
+        _ComboUtils.isValueForPlaceholder(true, this.currentValue) &&
+        _ComboUtils.isValueOptionsForPlaceholder(true, this.currentItem);
+      if (
+        (isValid && isValidValueForPlaceholder) ||
+        (!isValid && isCurrentValueForPlaceholder)
+      ) {
+        // Now that we know, there are no selected pills, call the superclass' method to
         // apply the placeholder.
         _OjMultiCombobox.superclass._setPlaceholder.apply(this, arguments);
+        // After setting the placeholder, resize the input field to make sure it has proper
+        // width
+        this._resizeSearch();
       }
     },
 
@@ -8034,7 +8086,20 @@ const _AbstractSingleChoice = _ComboUtils.clazz(_AbstractOjChoice,
       }));
 
       this.search.on('input', this._bind(function (e) {
-        if (!this.ojContext._isComposing) {
+        // JET-39086 - raw-value is not getting updated until space in android devices
+        // In android devices, typing in an English word will behave similar to what one
+        // would see when they compose a CJK character in desktop devices. So, we need to
+        // update the raw-value for all the input events in Android devices without considering
+        // composition events so that the property gets updated for each english character and not
+        // only for delimiters. In GBoard all the CJK keyboard layouts directly allow users
+        // to input a CJK character, so we do not need to rely on composition events for that.
+        // In Japanese keyboard, one of the three available layouts uses english chars
+        // to compose a Japanese character in which case circumventing the logic would end up
+        // updating the property with garbage values. But, it is highly unlikely for one to
+        // use this layout as the other two layouts would allow users to directly type in Japanese
+        // characters. So, for now we will not have to worry about composition events in
+        // Android devices.
+        if (!this.ojContext._isComposing || this._isAndroidDevice) {
           this._onSearchInputHandler(e);
         }
       }));