@oracle/oraclejet 14.0.5 → 14.1.0

package/dist/js/libs/oj/debug/ojdvt-toolkit.js

@@ -29938,9 +29938,15 @@ define(['exports', 'ojs/ojthemeutils'], function (exports, ThemeUtils) { 'use st
    * @param {DvtKeyboardNavigable} current
    * @param {DvtKeyboardEvent} event
    * @param {Array} listOfObjects Array of DvtKeyboardNavigable objects
+   * @param {Boolean=} compareCenters if true, will compare centers of the navigable instead of upper left corner
    * @return {DvtKeyboardNavigable}
    */
-  KeyboardHandler.getNextAdjacentNavigable = function (current, event, listOfObjects) {
+  KeyboardHandler.getNextAdjacentNavigable = function (
+    current,
+    event,
+    listOfObjects,
+    compareCenters
+  ) {
     var keycode = event.keyCode;
 
     if (!listOfObjects) return null;
@@ -29965,7 +29971,7 @@ define(['exports', 'ojs/ojthemeutils'], function (exports, ThemeUtils) { 'use st
         continue;
       }
 
-      if (!KeyboardHandler._isValidDestination(object, current, keycode)) continue;
+      if (!KeyboardHandler._isValidDestination(object, current, keycode, compareCenters)) continue;
 
       var inContact = KeyboardHandler._calcInContact(object, current, keycode);
 
@@ -30126,13 +30132,37 @@ define(['exports', 'ojs/ojthemeutils'], function (exports, ThemeUtils) { 'use st
    * @param {DvtKeyboardNavigable} object
    * @param {DvtKeyboardNavigable} current
    * @param {Number} keycode
+   * @param {Boolean} compareCenters if true, will compare centers of the navigable instead of upper left corner
    * @return {Boolean}
    * @private
    */
-  KeyboardHandler._isValidDestination = function (object, current, keycode) {
+  KeyboardHandler._isValidDestination = function (object, current, keycode, compareCenters) {
     var objBB = object.getKeyboardBoundingBox();
     var curBB = current.getKeyboardBoundingBox();
 
+    // compare the centers of the navigable and to be valid, the navigable must be in the right direction
+    // without tolerance
+    if (compareCenters) {
+      var objCenterX = objBB.x + 0.5 * objBB.w;
+      var curCenterX = curBB.x + 0.5 * curBB.w;
+      var objCenterY = objBB.y + 0.5 * objBB.h;
+      var curCenterY = curBB.y + 0.5 * curBB.h;
+
+      switch (keycode) {
+        case KeyboardEvent.UP_ARROW:
+          return objCenterY < curCenterY;
+        case KeyboardEvent.DOWN_ARROW:
+          return objBB.y > curCenterY;
+        case KeyboardEvent.RIGHT_ARROW:
+          return objCenterX > curCenterX;
+        case KeyboardEvent.LEFT_ARROW:
+          return objCenterX < curCenterX;
+        default:
+          break;
+      }
+      return true;
+    }
+
     switch (keycode) {
       case KeyboardEvent.UP_ARROW:
         return objBB.y < curBB.y || KeyboardHandler._areEqualWithinTolerance(objBB.y, curBB.y);

package/dist/js/libs/oj/debug/ojflattenedtreedataproviderview.js

@@ -876,7 +876,7 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
                 return result.fetchResult;
             });
         }
-        _fetchChildrenByOffsetFromAncestors(params, dataprovider, parentKey, finalParams, expandKey) {
+        _fetchChildrenByOffsetFromAncestors(params, dataProvider, parentKey, finalParams, expandKey) {
             const handleFetchFromAncestors = (lastParentKey, result) => {
                 const lastEntry = this._getItemByKey(lastParentKey);
                 if (this._checkCacheByOffset(finalParams, expandKey) ||
@@ -893,7 +893,7 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
                 const childrenPromise = this._fetchChildrenByOffsetFromDataProvider(newParams, childDataProvider, lastEntryParentKey, finalParams, expandKey);
                 return childrenPromise.then(handleFetchFromAncestors.bind(this, lastEntryParentKey));
             };
-            return this._fetchChildrenByOffsetFromDataProvider(params, dataprovider, parentKey, finalParams, expandKey)
+            return this._fetchChildrenByOffsetFromDataProvider(params, dataProvider, parentKey, finalParams, expandKey)
                 .then(handleFetchFromAncestors.bind(this, parentKey))
                 .then(() => {
                 const result = this._getFetchByOffsetResultsFromCache(finalParams);
@@ -914,10 +914,12 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
                     finalParams.filterCriterion = result.fetchParameters.filterCriterion;
                 }
                 if (results.length === 0 || this._checkCacheByOffset(finalParams, expandKey)) {
-                    if (expandKey && result.done === true) {
-                        return Promise.resolve({ expandKey: expandKey, done: result.done });
+                    const returnObject = {};
+                    if (expandKey) {
+                        returnObject.expandKey = expandKey;
                     }
-                    return Promise.resolve({ done: results.length === 0 ? result.done : false });
+                    returnObject.done = results.length === 0 ? result.done : false;
+                    return Promise.resolve(returnObject);
                 }
                 const item = results.shift();
                 const updatedItem = this._updateItemMetadata(item, parentKey);
@@ -925,7 +927,7 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
                 if (this._isExpanded(updatedItem.metadata.key)) {
                     const parentKeyInfo = this._mapParentKeyToInfo.get(updatedItem.metadata.key);
                     const childDataProvider = this.getChildDataProvider(updatedItem.metadata.key);
-                    const remainingSize = this._getRemainingSize(finalParams);
+                    const remainingSize = this._getRemainingSize(finalParams, expandKey);
                     if (childDataProvider != null && !parentKeyInfo.done && remainingSize !== 0) {
                         const newParams = new this.FetchByOffsetParameters(this, 0, remainingSize, params.sortCriteria, params.filterCriterion, params.attributes);
                         yield this._fetchChildrenByOffsetFromDataProvider(newParams, childDataProvider, updatedItem.metadata.key, finalParams, expandKey);
@@ -936,21 +938,46 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
             return dataProvider
                 .fetchByOffset(params)
                 .then(handleNextItemInResults)
-                .then((returnObject) => {
+                .then((nextItemResults) => {
                 this._mapParentKeyToInfo.set(parentKey, {
-                    done: returnObject.done
+                    done: nextItemResults.done
                 });
                 const result = this._getFetchByOffsetResultsFromCache(finalParams);
-                if (returnObject.expandKey) {
-                    return { returnObject: returnObject, fetchResult: result };
+                const validationObject = {
+                    fetchResult: result
+                };
+                if (nextItemResults.expandKey) {
+                    validationObject.returnObject = nextItemResults;
+                    nextItemResults.done =
+                        nextItemResults.done === true
+                            ? this._isDescendentTreeDone(nextItemResults.expandKey)
+                            : false;
                 }
-                return { fetchResult: result };
+                return validationObject;
             });
         }
-        _getRemainingSize(params) {
+        _isDescendentTreeDone(key) {
+            const children = this._getChildrenFromCacheByParentKey(key);
+            if (children.length === 0) {
+                return true;
+            }
+            const itemDone = this._isDone(key);
+            if (!itemDone) {
+                return false;
+            }
+            const childKey = children[children.length - 1].metadata.key;
+            return this._isDescendentTreeDone(childKey);
+        }
+        _isDone(key) {
+            return this._mapParentKeyToInfo.has(key) && this._mapParentKeyToInfo.get(key).done;
+        }
+        _getRemainingSize(params, expandKey) {
             if (params.size === -1) {
                 return -1;
             }
+            if (expandKey) {
+                return params.size - this._getLocalDescendentCount(expandKey);
+            }
             return params.size + params.offset - this._cache.length;
         }
         _isExpanded(key) {
@@ -1020,14 +1047,25 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
                         });
                     }
                     if (previousCacheIndex !== null) {
-                        const removedItems = this._cache.splice(previousCacheIndex + 1, this._cache.length);
-                        removedItems.forEach(() => {
-                            this._decrementIteratorOffset(previousCacheIndex + 1);
+                        const lastDescendentItem = this._getLastDescendentByParentKey(disregardAfterKey);
+                        const lastDescendentIndex = this._getItemIndexByKey(lastDescendentItem.metadata.key);
+                        const removedItems = this._cache.splice(lastDescendentIndex + 1, this._cache.length);
+                        removedItems.forEach((item) => {
+                            this._mapParentKeyToInfo.delete(item.metadata.key);
+                            if (this._mapParentKeyToInfo.has(item.metadata.parentKey)) {
+                                this._mapParentKeyToInfo.set(item.metadata.parentKey, { done: false });
+                            }
                         });
+                        const decrementValueTotal = removedItems.length + fetchedCountMap.get(disregardAfterKey).count;
+                        for (let i = 0; i < decrementValueTotal; i++) {
+                            this._decrementIteratorOffset(previousCacheIndex + 1);
+                        }
                     }
                     if (disregardAfterKey === null) {
                         const mutationEventDetail = new this.DataProviderMutationEventDetail(this, operationAddEventDetail, operationRemoveEventDetail, null);
-                        this.dispatchEvent(new ojdataprovider.DataProviderMutationEvent(mutationEventDetail));
+                        if (operationAddEventDetail.keys.size > 0 || operationRemoveEventDetail.keys.size > 0) {
+                            this.dispatchEvent(new ojdataprovider.DataProviderMutationEvent(mutationEventDetail));
+                        }
                     }
                     if (disregardAfterKey !== null) {
                         const refreshEvent = new ojdataprovider.DataProviderRefreshEvent(new this.DataProviderRefreshEventDetail(disregardAfterKey));
@@ -1101,6 +1139,16 @@ define(['ojs/ojcore-base', 'ojs/ojset', 'ojs/ojeventtarget', 'ojs/ojobservable',
         _getEntry(i) {
             return this._cache[i];
         }
+        _getLastDescendentByParentKey(parentKey) {
+            const lastItem = this._getLastItemByParentKey(parentKey);
+            if (!lastItem) {
+                return this._getItemByKey(parentKey);
+            }
+            if (lastItem.metadata.isLeaf) {
+                return lastItem;
+            }
+            return this._getLastDescendentByParentKey(lastItem.metadata.key);
+        }
         _getLastItemByParentKey(parentKey) {
             let returnItem = null;
             this._cache

package/dist/js/libs/oj/debug/ojgantt-toolkit.js

@@ -7015,9 +7015,8 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
       const svgClassName = this.getSvgClassName(property);
       const svgStyle = this.getSvgStyle(property);
 
-      if (svgClassName) {
-        taskShape.applyStyleClasses(svgClassName);
-      }
+      // JET-48762: We need to ensure updated default style classes are applied on every render.
+      taskShape.applyStyleClasses(svgClassName);
 
       if (svgStyle) {
         taskShape.setStyle(svgStyle);

package/dist/js/libs/oj/debug/ojgantt.js

@@ -2497,6 +2497,97 @@ var __oj_gantt_reference_object_metadata =
    * <oj-gantt-reference-object short-desc="[[$current.data.shortDesc]]"></oj-gantt-reference-object>
    */
 
+  /**
+   * Class to help set css properties on the component root options object
+   * @param {Object} object The root options object from which this path should be resolved
+   * @param {string} path The string path within the options object to resolve
+   * @protected
+   * @constructor
+   * @ignore
+   */
+  const DvtJsonPath = function (object, path) {
+    this._path = path;
+    this._root = object;
+    this._delimiter = '/';
+  };
+
+  /**
+   * Resolves the parameter of the leaf object and the leaf object itself
+   * @param {Object} root The root object to update
+   * @param {string} path The string path within the root object to resolve
+   * @param {string} delimiter The string delimiter for the path string
+   * @param {boolean} createIfMissing Flag to create the hierarchy of the namespaces if they do not exist
+   * @return {Object} The resolved parameter
+   * @private
+   */
+  DvtJsonPath.prototype._resolveLeafObjectAndProperty = function (
+    root,
+    path,
+    delimiter,
+    createIfMissing
+  ) {
+    var result = {};
+    while (root && path.indexOf(delimiter) > -1) {
+      var subProperty = path.substring(0, path.indexOf(delimiter));
+      if (createIfMissing && root[subProperty] === undefined) {
+        // eslint-disable-next-line no-param-reassign
+        root[subProperty] = {};
+      }
+      // eslint-disable-next-line no-param-reassign
+      root = root[subProperty];
+      // eslint-disable-next-line no-param-reassign
+      path = path.substring(path.indexOf(delimiter) + 1, path.length);
+    }
+
+    if (root) {
+      result.object = root;
+      result.parameter = path;
+    }
+
+    return result;
+  };
+
+  /**
+   * Resolves path to the leaf object and parameter of this object
+   * @param {boolean} createIfMissing Flag to create the hierarchy of the namespaces if they do not exist
+   * @private
+   */
+  DvtJsonPath.prototype._resolvePath = function (createIfMissing) {
+    if (this._leaf === undefined) {
+      var result = this._resolveLeafObjectAndProperty(
+        this._root,
+        this._path,
+        this._delimiter,
+        createIfMissing
+      );
+
+      this._leaf = result.object;
+      this._param = result.parameter;
+    }
+  };
+
+  /**
+   * Returns value of the leaf element of the path.
+   * @return {Object} value The value of the leaf element or undefined if path structure is not yet created
+   */
+  DvtJsonPath.prototype.getValue = function () {
+    this._resolvePath(false);
+    return this._leaf === undefined ? undefined : this._leaf[this._param];
+  };
+
+  /**
+   * Sets value of the leaf element of the path.
+   * @param {Object} value The value of the leaf element
+   * @param {boolean} bOverride Whether to override the original value
+   */
+  DvtJsonPath.prototype.setValue = function (value, bOverride) {
+    this._resolvePath(true);
+
+    if (bOverride || !this._leaf[this._param]) {
+      this._leaf[this._param] = value;
+    }
+  };
+
   /**
    * For default date converter
    * @static
@@ -5670,6 +5761,50 @@ var __oj_gantt_reference_object_metadata =
       }
     },
 
+    /**
+     * Recalculate styles on the given childStyleClasses and update the given
+     * options object.
+     * @param {Object} options options object
+     * @param {Array<string>} childStyleClassKeys subset of keys from _GetChildStyleClasses() to target
+     * @private
+     * @instance
+     * @memberof oj.ojGantt
+     */
+    _updateStyles: function (options, childStyleClassKeys) {
+      var childStyleClasses = this._GetChildStyleClasses();
+      var targetChildStyleClasses = {};
+      childStyleClassKeys.forEach((key) => {
+        var definitions = childStyleClasses[key];
+        targetChildStyleClasses[key] = definitions;
+        if (!(definitions instanceof Array)) {
+          definitions = [definitions];
+        }
+        // Clear previous values from options
+        definitions.forEach((definition) => {
+          var stylePath = definition.path;
+          var path = new DvtJsonPath(options, stylePath);
+          path.setValue(undefined, true);
+        });
+        // Clear cached styles
+        this._styleProcessor.clearCache(key);
+      });
+
+      this._styleProcessor.processStyles(
+        this.element,
+        options,
+        this._GetComponentStyleClasses(),
+        targetChildStyleClasses
+      );
+    },
+
+    // inheritdoc
+    _BeforeResizeRender: function () {
+      // JET-54524
+      // We need to recalculate padding related styles during resize
+      var options = this._component.getOptions();
+      this._updateStyles(options, ['oj-gantt-container', 'oj-gantt-row-label']);
+    },
+
     // @inheritdoc
     _GetComponentRendererOptions: function () {
       return [

package/dist/js/libs/oj/debug/ojgauge.js

@@ -1581,8 +1581,8 @@ var __oj_status_meter_gauge_metadata =
    * @ojrole img
    * @ojrole application
    *
-   * @ojpropertylayout [ {propertyGroup: "common", items: ["selectedState.shape", "unselectedState.shape", "hoverState.shape", "changedState.shape", "style"]},
-   *                     {propertyGroup: "data", items: ["value", "min", "max", "step"]} ]
+   * @ojpropertylayout [ {propertyGroup: "common", items: ["style"]},
+   *                     {propertyGroup: "data", items: ["value", "max", "step"]} ]
    * @ojvbdefaultcolumns 4
    * @ojvbmincolumns 1
    *
@@ -3393,12 +3393,13 @@ var __oj_status_meter_gauge_metadata =
    * </p>
    * <h5>track-resize attribute</h5>
    * <p>track-resize attribute is no longer supported. Rating gauges now have fixed sizes. Since we are not supporting the 'fit' enum value for the 'size' api, we no longer need 'track-resize'. </p>
-   * <h5>thresholds attribute</h5>
-   * <p>For the initial release of the oj-c-rating-gauge, we are not supporting thresholds. We plan on supporting this use case in a future release.</p>
    * <h5>tooltip attribute and tooltipTemplate slot </h5>
    * <p> The support for this feature has been split into two attributes, tooltip and datatip. The datatip will be used for interactive gauges only and it will be a function that takes datatipDetail as argument.
    * Tooltip attribute, which will be a string instead of a function, will be used for readonly rating gauge.
    * </p>
+   * <h5>title support</h5>
+   * <p>title will no longer be required to make your rating gauge accessible. Use the datatip or tooltip APIs or the aria-label attribute instead.
+   * </p>
    * @ojfragment migrationDoc
    * @memberof oj.ojRatingGauge
    */
@@ -3731,6 +3732,7 @@ var __oj_status_meter_gauge_metadata =
    * @property {number=} lineWidth=2  The width of the reference line.
    * @property {("dashed"|"dotted"|"solid")=} lineStyle="solid" The line style of the reference line.
    * @ojdeprecated {since: '14.0.0', description: 'This is not recommended in the Redwood design system', target: 'property', for: 'lineStyle' }
+   * @ojdeprecated {since: '14.1.0', description: 'This is not recommended in the Redwood design system', target: 'property', for: 'lineWidth' }
    */
   /**
    * @typedef {Object} oj.ojStatusMeterGauge.Threshold

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

@@ -575,7 +575,7 @@ define(['exports', 'preact/jsx-runtime', 'ojs/ojdomutils', 'ojs/ojlistdataprovid
             if (state.fullScreenPopup) {
                 rootClasses += ' oj-inputsearch-mobile';
             }
-            const inputClasses = 'oj-inputsearch-input oj-text-field-input';
+            const inputClasses = 'oj-inputsearch-input oj-text-field-input ';
             const iconClasses = 'oj-text-field-start-end-icon oj-inputsearch-search-icon oj-component-icon';
             const displayValue = state.displayValue || '';
             return this._renderEnabled(props, state, rootClasses, iconClasses, displayValue, inputClasses);
@@ -912,11 +912,16 @@ define(['exports', 'preact/jsx-runtime', 'ojs/ojdomutils', 'ojs/ojlistdataprovid
         }
         _renderDesktopMainTextFieldContainer(props, state, searchIcon, displayValue, inputClasses, ariaLabel, listboxId, inputType, autocompleteFloatingElem) {
             const containerClasses = 'oj-text-field-container oj-text-field-has-start-slot';
-            return (jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMainInputContainerId(), ref: this._setMainInputContainerElem }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: searchIcon })), jsxRuntime.jsxs("div", Object.assign({ class: "oj-text-field-middle", role: this._dataProvider ? 'combobox' : undefined, "aria-label": this._dataProvider ? ariaLabel : null, "aria-owns": listboxId, "aria-haspopup": this._dataProvider ? 'listbox' : 'false', "aria-expanded": state.dropdownOpen ? 'true' : 'false' }, { children: [jsxRuntime.jsx(ComposingInput, Object.assign({ type: inputType, inputRef: this._setMainInputElem, value: displayValue, class: inputClasses + ' oj-inputsearch-filter', placeholder: props.placeholder, autocomplete: "off", autocorrect: "off" }, { autocapitalize: 'off' }, { spellcheck: false, autofocus: false, "aria-label": ariaLabel, "aria-autocomplete": this._dataProvider ? 'list' : null, "aria-controls": listboxId, "aria-busy": state.dropdownOpen && state.loading, "aria-activedescendant": this._dataProvider ? state.activeDescendantId : null, onfocusin: this._handleFocusin, onfocusout: this._handleFocusout, onInputChanged: this._handleInputChanged, onKeyDown: this._handleDesktopMainInputKeydown })), autocompleteFloatingElem] }))] })));
+            return (jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMainInputContainerId(), ref: this._setMainInputContainerElem }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: searchIcon })), jsxRuntime.jsxs("div", Object.assign({ class: "oj-text-field-middle", role: this._dataProvider ? 'combobox' : undefined, "aria-label": this._dataProvider ? ariaLabel : null, "aria-owns": listboxId, "aria-haspopup": this._dataProvider ? 'listbox' : 'false', "aria-expanded": state.dropdownOpen ? 'true' : 'false' }, { children: [jsxRuntime.jsx(ComposingInput, { type: inputType, inputRef: this._setMainInputElem, value: displayValue, class: inputClasses + ' oj-inputsearch-filter', placeholder: props.placeholder, autocomplete: "off", autocorrect: "off", autocapitalize: "off", spellcheck: false, autofocus: false, "aria-label": ariaLabel, "aria-autocomplete": this._dataProvider ? 'list' : null, "aria-controls": listboxId, "aria-busy": state.dropdownOpen && state.loading, "aria-activedescendant": this._dataProvider ? state.activeDescendantId : null, onfocusin: this._handleFocusin, onfocusout: this._handleFocusout, onInputChanged: this._handleInputChanged, onKeyDown: this._handleDesktopMainInputKeydown }), autocompleteFloatingElem] }))] })));
         }
         _renderMobileMainTextFieldContainer(props, state, searchIcon, inputClasses, ariaLabel, listboxId) {
+            const { placeholder, value } = props;
+            const { dropdownOpen, loading } = state;
             const containerClasses = 'oj-text-field-container oj-text-field-has-start-slot';
-            return (jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMainInputContainerId() }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: searchIcon })), jsxRuntime.jsx("div", Object.assign({ class: "oj-text-field-middle", role: this._dataProvider ? 'combobox' : undefined, "aria-label": this._dataProvider ? ariaLabel : null, "aria-owns": listboxId, "aria-haspopup": this._dataProvider ? 'listbox' : 'false', "aria-expanded": state.dropdownOpen ? 'true' : 'false' }, { children: jsxRuntime.jsx("input", Object.assign({ readOnly: true, ref: this._setMainInputElem, value: props.value, class: inputClasses, placeholder: props.placeholder, autocomplete: "off", autocorrect: "off" }, { autocapitalize: 'off' }, { spellcheck: false, autofocus: false, "aria-label": ariaLabel, "aria-autocomplete": this._dataProvider ? 'list' : null, "aria-controls": listboxId, "aria-busy": state.dropdownOpen && state.loading, onfocusin: this._handleFocusin, onfocusout: this._handleFocusout })) }))] })));
+            const mobileInputClasses = inputClasses +
+                ' oj-inputsearch-input-displayonly ' +
+                (value ? '' : ' oj-inputsearch-placeholder');
+            return (jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMainInputContainerId() }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: searchIcon })), jsxRuntime.jsx("div", Object.assign({ class: "oj-text-field-middle", role: this._dataProvider ? 'combobox' : undefined, "aria-label": this._dataProvider ? ariaLabel : null, "aria-owns": listboxId, "aria-haspopup": this._dataProvider ? 'listbox' : 'false', "aria-expanded": dropdownOpen ? 'true' : 'false' }, { children: jsxRuntime.jsx("div", Object.assign({ ref: this._setMainInputElem, class: mobileInputClasses, "aria-label": ariaLabel, "aria-controls": listboxId, "aria-busy": dropdownOpen && loading, tabIndex: 0, onfocusin: this._handleFocusin, onfocusout: this._handleFocusout }, { children: jsxRuntime.jsx("div", { children: value || placeholder }) })) }))] })));
         }
         _renderMobileDropdownFilterField(props, state, displayValue, inputClasses, ariaLabel, listboxId, inputType, autocompleteFloatingElem) {
             let classes = 'oj-text-field';
@@ -933,7 +938,7 @@ define(['exports', 'preact/jsx-runtime', 'ojs/ojdomutils', 'ojs/ojlistdataprovid
                 containerClasses += ' oj-text-field-has-end-slot';
                 clearIcon = this._renderMobileDropdownClearIcon();
             }
-            return (jsxRuntime.jsx("div", Object.assign({ class: classes }, { children: jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMobileFilterContainerId() }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: backIcon })), jsxRuntime.jsxs("div", Object.assign({ class: "oj-text-field-middle", "aria-label": ariaLabel, "aria-owns": listboxId }, { children: [jsxRuntime.jsx(ComposingInput, Object.assign({ type: inputType, inputRef: this._setMobileFilterInputElem, value: displayValue, class: inputClasses + ' oj-inputsearch-filter', placeholder: props.placeholder, autocomplete: "off", autocorrect: "off" }, { autocapitalize: 'off' }, { spellcheck: false, autofocus: false, "aria-label": ariaLabel, "aria-autocomplete": "list", "aria-controls": listboxId, "aria-busy": state.loading, "aria-activedescendant": state.activeDescendantId, onfocusin: this._handleMobileFilterInputFocusin, onfocusout: this._handleMobileFilterInputFocusout, onInputChanged: this._handleInputChanged, onKeyDown: this._handleMobileFilterInputKeydown, onMouseDown: this._handleFilterInputMousedown })), autocompleteFloatingElem] })), jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-end" }, { children: clearIcon }))] })) })));
+            return (jsxRuntime.jsx("div", Object.assign({ class: classes }, { children: jsxRuntime.jsxs("div", Object.assign({ role: "presentation", class: containerClasses, id: this._getMobileFilterContainerId() }, { children: [jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-start" }, { children: backIcon })), jsxRuntime.jsxs("div", Object.assign({ class: "oj-text-field-middle", "aria-label": ariaLabel, "aria-owns": listboxId }, { children: [jsxRuntime.jsx(ComposingInput, { type: inputType, inputRef: this._setMobileFilterInputElem, value: displayValue, class: inputClasses + ' oj-inputsearch-filter', placeholder: props.placeholder, autocomplete: "off", autocorrect: "off", autocapitalize: "off", spellcheck: false, autofocus: false, "aria-label": ariaLabel, "aria-autocomplete": "list", "aria-controls": listboxId, "aria-busy": state.loading, "aria-activedescendant": state.activeDescendantId, onfocusin: this._handleMobileFilterInputFocusin, onfocusout: this._handleMobileFilterInputFocusout, onInputChanged: this._handleInputChanged, onKeyDown: this._handleMobileFilterInputKeydown, onMouseDown: this._handleFilterInputMousedown }), autocompleteFloatingElem] })), jsxRuntime.jsx("span", Object.assign({ class: "oj-text-field-end" }, { children: clearIcon }))] })) })));
         }
         _renderMobileDropdownBackIcon() {
             const backIconClasses = 'oj-inputsearch-back-icon oj-inputsearch-icon oj-component-icon oj-clickable-icon-nocontext';

package/dist/js/libs/oj/debug/ojknockout.js

@@ -5,7 +5,7 @@
  * as shown at https://oss.oracle.com/licenses/upl/
  * @ignore
  */
-define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', 'knockout', 'ojs/ojdomutils', 'jquery', 'ojs/ojcustomelement-utils', 'ojs/ojbindpropagation', 'ojs/ojkeysetimpl', 'ojs/ojcontext', 'ojs/ojtemplateengine-ko', 'ojs/ojcore-base', 'ojs/ojknockouttemplateutils', 'ojs/ojresponsiveknockoututils'], function (widget, BindingProviderImpl, oj$1, Logger, ko, DomUtils, $, ojcustomelementUtils, ojbindpropagation, KeySetImpl, Context, templateEngine, oj$2, KnockoutTemplateUtils, ResponsiveKnockoutUtils) { 'use strict';
+define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', 'knockout', 'ojs/ojdomutils', 'jquery', 'ojs/ojcustomelement-registry', 'ojs/ojcustomelement-utils', 'ojs/ojbindpropagation', 'ojs/ojkeysetimpl', 'ojs/ojcontext', 'ojs/ojtemplateengine-ko', 'ojs/ojcore-base', 'ojs/ojknockouttemplateutils', 'ojs/ojresponsiveknockoututils'], function (widget, BindingProviderImpl, oj$1, Logger, ko, DomUtils, $, ojcustomelementRegistry, ojcustomelementUtils, ojbindpropagation, KeySetImpl, Context, templateEngine, oj$2, KnockoutTemplateUtils, ResponsiveKnockoutUtils) { 'use strict';
 
   BindingProviderImpl = BindingProviderImpl && Object.prototype.hasOwnProperty.call(BindingProviderImpl, 'default') ? BindingProviderImpl['default'] : BindingProviderImpl;
   oj$1 = oj$1 && Object.prototype.hasOwnProperty.call(oj$1, 'default') ? oj$1['default'] : oj$1;
@@ -1331,24 +1331,21 @@ define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', '
       if (!oj$1.BaseCustomElementBridge) {
         return wrappedReturn;
       }
-      return (
-        wrappedReturn ||
-        (node.nodeType === 1 && ojcustomelementUtils.CustomElementUtils.isElementRegistered(node.nodeName))
-      );
+      return wrappedReturn || (node.nodeType === 1 && ojcustomelementRegistry.isElementRegistered(node.nodeName));
     },
 
     getBindingAccessors: function (node, bindingContext, wrappedReturn) {
       if (node.nodeType === 1) {
         var name = node.nodeName;
 
-        if (ojcustomelementUtils.CustomElementUtils.isElementRegistered(name)) {
+        if (ojcustomelementRegistry.isElementRegistered(name)) {
           // eslint-disable-next-line no-param-reassign
           wrappedReturn = wrappedReturn || {};
 
           // eslint-disable-next-line no-param-reassign
           wrappedReturn._ojCustomElement = function () {
-            const isComposite = ojcustomelementUtils.CustomElementUtils.isComposite(name);
-            const isVComponent = ojcustomelementUtils.CustomElementUtils.isVComponent(name);
+            const isComposite = ojcustomelementRegistry.isComposite(name);
+            const isVComponent = ojcustomelementRegistry.isVComponent(name);
             return { skipThrottling: isComposite || isVComponent };
           };
         }
@@ -2180,7 +2177,7 @@ define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', '
         var attribute = ojcustomelementUtils.AttributeUtils.propertyNameToAttribute(property);
         var message = `Invalid type '${typeof listener}' found for attribute '${attribute}'.\
  Expected value of type 'function'."`;
-        if (ojcustomelementUtils.CustomElementUtils.isElementRegistered(element.tagName)) {
+        if (ojcustomelementRegistry.isElementRegistered(element.tagName)) {
           const elementState = ojcustomelementUtils.CustomElementUtils.getElementState(element);
           elementState.rejectBindingProvider(message);
         }
@@ -2512,7 +2509,7 @@ define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', '
         var _expressionHandler;
         var attributeListener;
 
-        const compMetadata = ojcustomelementUtils.CustomElementUtils.getMetadata(element.tagName);
+        const compMetadata = ojcustomelementRegistry.getMetadata(element.tagName);
         const metadataProps = compMetadata.properties || {};
 
         // Compute data about the provided and consumed properties.
@@ -3412,10 +3409,7 @@ define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', '
 
           // Handle event binding for native HTML elements.
           // The event binding for custom elements is handled by the bridge.
-          if (
-            !ojcustomelementUtils.CustomElementUtils.isElementRegistered(node.nodeName) &&
-            attr.name.substring(0, 3) === 'on-'
-          ) {
+          if (!ojcustomelementRegistry.isElementRegistered(node.nodeName) && attr.name.substring(0, 3) === 'on-') {
             boundEvents.push(attr);
           }
         }

package/dist/js/libs/oj/debug/ojlegend-toolkit.js

@@ -2391,8 +2391,7 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
         // Combine the user options with the defaults and store
         this.Options = this.Defaults.calcOptions(options);
 
-        // Transfer the category visibility properties to the hiddenCategories.
-        this._transferVisibilityProps(this.Options['sections']);
+        this._processData(this.Options['sections']);
       } else if (!this.Options)
         // Create a default options object if none has been specified
         this.Options = this.GetDefaults();
@@ -2641,24 +2640,26 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
     }
 
     /**
-     * Transfer categoryVisibility property from legend item to hiddenCategories on the legend.
+     * Processes the sections data. Transfers categoryVisibility property from legend item to hiddenCategories on the legend.
      * @param {array} sections The array of legend section definitions
      * @private
      */
-    _transferVisibilityProps(sections) {
+    _processData(sections) {
+      let hasCollapsible = false;
       if (!sections || sections.length <= 0) return;
 
       var hiddenCategories = this.getOptions()['hiddenCategories'];
       for (var i = 0; i < sections.length; i++) {
         var section = sections[i];
-
+        hasCollapsible = hasCollapsible || section.collapsible === 'on';
         // If this section has nested sections, recurse.
-        if (section['sections']) this._transferVisibilityProps(section['sections']);
+        if (section['sections']) this._processData(section['sections']);
 
         // Iterate through the items and transfer properties.
         var items = section['items'];
         if (!items || items.length <= 0) continue;
 
+        // Transfer the category visibility properties to the hiddenCategories.
         for (var j = 0; j < items.length; j++) {
           var item = items[j];
           var itemCategory = DvtLegendUtils.getItemCategory(item, this);
@@ -2669,6 +2670,7 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
           item['categoryVisibility'] = null;
         }
       }
+      this.getCache().putToCache('hasCollapsible', hasCollapsible);
     }
 
     /**
@@ -2679,7 +2681,12 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
         var options = this.getOptions();
         var translations = options.translations;
         var hideAndShow = options['hideAndShowBehavior'];
-        if ((hideAndShow != 'off' && hideAndShow != 'none') || options['hoverBehavior'] == 'dim') {
+        const hasCollapsible = this.getCache().getFromCache('hasCollapsible');
+        if (
+          (hideAndShow != 'off' && hideAndShow != 'none') ||
+          options['hoverBehavior'] == 'dim' ||
+          hasCollapsible
+        ) {
           this.getCtx().setAriaRole('application');
           this.getCtx().setAriaLabel(
             dvt.ResourceUtils.format(translations.labelAndValue, [