@oracle/oraclejet 16.0.5 → 16.0.7

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

@@ -12582,65 +12582,75 @@ DvtDataGrid.prototype.handleLongScroll = function (scrollLeft, scrollTop) {
     const startRowPixel = this.m_longScrollRowPixel;
     const startCol = this.m_longScrollColumn;
     const startColPixel = this.m_longScrollColumnPixel;
-
-    // reset ranges, just cleaned up to only set if the header is present
-    if (this.m_hasCells) {
-      this.m_startRow = startRow;
-      this.m_endRow = -1;
-      this.m_startRowPixel = startRowPixel;
-      this.m_endRowPixel = startRowPixel;
-      this.m_startCol = startCol;
-      this.m_endCol = -1;
-      this.m_startColPixel = startColPixel;
-      this.m_endColPixel = startColPixel;
-    }
-
-    if (this.m_hasRowHeader) {
-      this.m_startRowHeader = startRow;
-      this.m_endRowHeader = -1;
-      this.m_startRowHeaderPixel = startRowPixel;
-      this.m_endRowHeaderPixel = startRowPixel;
-    }
-    if (this.m_hasRowEndHeader) {
-      this.m_startRowEndHeader = startRow;
-      this.m_endRowEndHeader = -1;
-      this.m_startRowEndHeaderPixel = startRowPixel;
-      this.m_endRowEndHeaderPixel = startRowPixel;
-    }
-    if (this.m_hasColHeader) {
-      this.m_startColHeader = startCol;
-      this.m_endColHeader = -1;
-      this.m_startColHeaderPixel = startColPixel;
-      this.m_endColHeaderPixel = startColPixel;
-    }
-    if (this.m_hasColEndHeader) {
-      this.m_startColEndHeader = startCol;
-      this.m_endColEndHeader = -1;
-      this.m_startColEndHeaderPixel = startColPixel;
-      this.m_endColEndHeaderPixel = startColPixel;
-    }
-
-    this.m_stopRowFetch = false;
-    this.m_stopRowHeaderFetch = false;
-    this.m_stopRowEndHeaderFetch = false;
-    this.m_stopColumnFetch = false;
-    this.m_stopColumnHeaderFetch = false;
-    this.m_stopColumnEndHeaderFetch = false;
-
+    let needsResetVars = true;
+    // reset vars after fetch return to handle component resize in the intermediate
+    let resetVars = () => {
+      if (needsResetVars) {
+        needsResetVars = false;
+        // need to redraw header borders
+        this.m_resizeRequired = true;
+        // reset ranges, just cleaned up to only set if the header is present
+        if (this.m_hasCells) {
+          this.m_startRow = startRow;
+          this.m_endRow = -1;
+          this.m_startRowPixel = startRowPixel;
+          this.m_endRowPixel = startRowPixel;
+          this.m_startCol = startCol;
+          this.m_endCol = -1;
+          this.m_startColPixel = startColPixel;
+          this.m_endColPixel = startColPixel;
+        }
+
+        if (this.m_hasRowHeader) {
+          this.m_startRowHeader = startRow;
+          this.m_endRowHeader = -1;
+          this.m_startRowHeaderPixel = startRowPixel;
+          this.m_endRowHeaderPixel = startRowPixel;
+        }
+        if (this.m_hasRowEndHeader) {
+          this.m_startRowEndHeader = startRow;
+          this.m_endRowEndHeader = -1;
+          this.m_startRowEndHeaderPixel = startRowPixel;
+          this.m_endRowEndHeaderPixel = startRowPixel;
+        }
+        if (this.m_hasColHeader) {
+          this.m_startColHeader = startCol;
+          this.m_endColHeader = -1;
+          this.m_startColHeaderPixel = startColPixel;
+          this.m_endColHeaderPixel = startColPixel;
+        }
+        if (this.m_hasColEndHeader) {
+          this.m_startColEndHeader = startCol;
+          this.m_endColEndHeader = -1;
+          this.m_startColEndHeaderPixel = startColPixel;
+          this.m_endColEndHeaderPixel = startColPixel;
+        }
+
+        this.m_stopRowFetch = false;
+        this.m_stopRowHeaderFetch = false;
+        this.m_stopRowEndHeaderFetch = false;
+        this.m_stopColumnFetch = false;
+        this.m_stopColumnHeaderFetch = false;
+        this.m_stopColumnEndHeaderFetch = false;
+      }
+    };
     // custom success callback so that we can reset all ranges and fields
     // initiate fetch of headers and cells
     this.fetchHeaders('row', startRow, this.m_rowHeader, this.m_rowEndHeader, undefined, {
       success: function (headerSet, headerRange, endHeaderSet) {
+        resetVars();
         this.handleHeadersFetchSuccessForLongScroll(headerSet, headerRange, endHeaderSet);
       }
     });
     this.fetchHeaders('column', startCol, this.m_colHeader, this.m_colEndHeader, undefined, {
       success: function (headerSet, headerRange, endHeaderSet) {
+        resetVars();
         this.handleHeadersFetchSuccessForLongScroll(headerSet, headerRange, endHeaderSet);
       }
     });
     this.fetchCells(this.m_databody, startRow, startCol, null, null, {
       success: function (cellSet, cellRange) {
+        resetVars();
         this.handleCellsFetchSuccessForLongScroll(
           cellSet,
           cellRange,
@@ -13113,6 +13123,7 @@ DvtDataGrid.prototype.removeHeadersFromStartOfContainer = function (
   dir,
   scrollPosition
 ) {
+  const context = this.getResources().getMappedAttribute('context');
   var removedHeaders = 0;
   var removedDimensionValue = 0;
   // To make sure we don't get other children divs (like visual indicator)
@@ -13136,7 +13147,6 @@ DvtDataGrid.prototype.removeHeadersFromStartOfContainer = function (
   while (startPixel + dimensionValue < scrollPosition - threshold) {
     this._remove(element);
     if (isHeader) {
-      const context = this.getResources().getMappedAttribute('context');
       let axis = element[context].axis;
       let elementIndex = element[context].index;
       // remove header/endHeader hidden indicator div belonging to element (if any)
@@ -13190,6 +13200,9 @@ DvtDataGrid.prototype.removeHeadersFromStartOfContainer = function (
       dimension
     );
 
+    header[context].index += returnVal.extentChange;
+    header[context].extent -= returnVal.extentChange;
+
     removedHeaders += returnVal.extentChange;
     removedDimensionValue += returnVal.dimensionChange;
   }
@@ -13216,6 +13229,7 @@ DvtDataGrid.prototype.removeHeadersFromEndOfContainer = function (
   className,
   dimension
 ) {
+  const context = this.getResources().getMappedAttribute('context');
   var removedHeaders = 0;
   var removedHeadersDimension = 0;
   // for hidden columns, visual indicator is appended as a child to the header container, so to avoid having them as a last child,
@@ -13236,7 +13250,6 @@ DvtDataGrid.prototype.removeHeadersFromEndOfContainer = function (
     this._remove(element);
 
     if (isHeader) {
-      const context = this.getResources().getMappedAttribute('context');
       let axis = element[context].axis;
       let elementIndex = element[context].index;
       if (this.isHidden(axis, elementIndex)) {
@@ -13277,6 +13290,8 @@ DvtDataGrid.prototype.removeHeadersFromEndOfContainer = function (
       dimension
     );
 
+    header[context].extent -= returnVal.extentChange;
+
     removedHeaders += returnVal.extentChange;
     removedHeadersDimension += returnVal.dimensionChange;
   }

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

@@ -4850,6 +4850,9 @@ oj.__registerWidget('oj.ojSelectBase', $.oj.editableValue, {
     this._bReleasedResources = true;
 
     this._ReleaseSelectResources();
+
+    this._superSetOptions = null;
+    this._setOptionsQueue = null;
   },
 
   /**
@@ -4944,6 +4947,126 @@ oj.__registerWidget('oj.ojSelectBase', $.oj.editableValue, {
     oj.Assert.failedInAbstractFunction();
   },
 
+  /**
+   * Queue a microtask to finish processing a _setOptions call.
+   * @memberof! oj.ojSelectBase
+   * @instance
+   * @private
+   */
+  _queueSetOptionsMicrotask: function () {
+    // In vdom architecture, there are multiple issues with value and valueItem properties,
+    // as well as other properties, that we need to handle.
+    //
+    // JET-51307 - Wrapping select single with value item and value integrations going into loop
+    // with multiple instances of LOV in a page
+    // If we're wrapped by a VComponent and there are multiple instances on the page
+    // all bound to the same valueItem, then if the user selects a new value in one instance,
+    // the page can go into an infinite loop.
+    // If we synchronously update the value on our DOM element here, then when the next preact
+    // render compares the stale vcomp value property against the new value in the DOM, preact
+    // determines it must push the stale value property back down onto us, which then causes
+    // the valueItem to get sync'ed again, and the loop goes on.
+    //
+    // JET-55775 - oj-select-single initiates fetch even when valueItem is provided in preact
+    // wrapper
+    // In preact, when value & valueItem are set at the same time, we will receive them one after
+    // the other.  So, if we process the value when we get it, then we might initiate an
+    // unnecessary fetch as we will later get the data from valueItem.
+    //
+    // JET-64359 - select - single handling of mutation on both value and valueItem properties
+    // coming from preact
+    // Also, when either value or valueItem property is ignored when updating props in the wrapper
+    // vcomponent, we will get a setOption call with a null / default value for that property.
+    // In these cases, depending on the order we receive the call, we might incorrectly end up
+    // setting the null / default value.
+    //
+    // JET-66896 - Value is not displayed when provider and value are set together
+    // When value and data were set together, the valueItem ended up with null data and metadata,
+    // so the label for the selected value was not displayed.
+    //
+    // JET-65611 - Form is in invalid state though the values are populated correctly
+    // This bug was related to the fact that the framework introduced changes in JET 16 so that
+    // the component gets batched property sets in VDOM, similar to knockout.js, whereas before
+    // each property was set individually.  For some property sets, like readonly, the code
+    // internally does a refresh.  For a valueItem change, in VDOM only, the code processed it
+    // in a microtask (to fix other issues encountered in VDOM).  With the previous, individual
+    // property setting behavior in VDOM, an internal refresh would happen before the new
+    // valueItem was even set on the component.  With the batching property setting behavior,
+    // the valueItem started to be processed before the internal refresh and then finished after
+    // the refresh, such that the changes were interfering with each other.
+    //
+    // In order to address all these cases, if we know we are in VDOM, we will queue a
+    // microtask to process the options.  Since preact calls setOptions synchronously for each
+    // option, our microtask callback will have access to all the accumulated options at once,
+    // similar to what would happen in MVVM.
+
+    var microtaskFunc = () => {
+      // reset the queue first so that any new _setOptions calls made during processing of
+      // this microtask will start a new queue
+      var setOptionsQueue = this._setOptionsQueue;
+      this._setOptionsQueue = null;
+
+      // JET-66038 - REGRESSION FOR EXPENSETYPEID FIELD 'GETINPUTELEM' ERROR
+      // When this function is executed in a microtask, it's possible that the element has been
+      // removed from the DOM and its resources released since the microtask was queued.  If so,
+      // simply return without doing anything; otherwise we may throw an NPE because we've
+      // already destroyed our internal structures.
+      if (this._bReleasedResources) {
+        // Ideally we would let the set proceed and simply guard against NPE due to released
+        // internal structures so that if we're ever reconnected, we can re-establish the
+        // previous state.
+        return;
+      }
+
+      // Collapse the individual _setOptions calls into a single options object so we can process
+      // all the properties at once.
+      // Use the first flags object because we shouldn't need to accumulate different flags across
+      // the _setOptions calls.  Preact doesn't pass any flags, and any that we use internally
+      // would not be intermingled with other _setOptions calls in the same microtask.
+      var queuedOptions = setOptionsQueue.reduce((accum, curr, index) => {
+        return {
+          options: { ...accum.options, ...curr.options },
+          flags: index === 0 ? curr.flags : accum.flags
+        };
+      }, {});
+      var options = queuedOptions.options;
+      var flags = queuedOptions.flags;
+
+      // eslint-disable-next-line no-prototype-builtins
+      var hasValue = options.hasOwnProperty('value');
+      // eslint-disable-next-line no-prototype-builtins
+      var hasValueItem = options.hasOwnProperty(this._GetValueItemPropertyName());
+      // Get the latest value and valueItem
+      const _valueItem = options[this._GetValueItemPropertyName()];
+      const _value = options.value;
+      // Determine empty states
+      // Note that _Is*****ForPlaceholder simply checks whether the value/valueItem
+      // represents the empty/null state.
+      const isEmptyValue = this._IsValueForPlaceholder(_value);
+      const isEmptyValueItem = this._IsValueItemForPlaceholder(_valueItem);
+      // If both value and valueItem are provided, then compare them to decide what to do
+      if (hasValue && hasValueItem) {
+        // if valueItem and value are not null, and they are conflicting then throw an error
+        if (!isEmptyValue && !isEmptyValueItem && _valueItem.key !== _value) {
+          throw new Error('Select Single: conflicting value-item and value');
+        }
+
+        // At this point, either one of them is empty or they both have the same
+        // key. So, if valueItem is not empty, use it (and delete the value from the options).
+        // Otherwise, use the value (and delete the valueItem from the options).
+        if (!isEmptyValueItem) {
+          delete options.value;
+        } else {
+          delete options[this._GetValueItemPropertyName()];
+        }
+      }
+
+      this._setOptionsHelper(options, flags, this._superSetOptions);
+    };
+
+    window.queueMicrotask(microtaskFunc);
+  },
+
   /**
    * Sets multiple options
    * @param {Object} options the options object
@@ -4953,6 +5076,28 @@ oj.__registerWidget('oj.ojSelectBase', $.oj.editableValue, {
    * @memberof! oj.ojSelectBase
    */
   _setOptions: function (options, flags) {
+    const elemState = CustomElementUtils.getElementState(this.OuterWrapper);
+    if (elemState.getBindingProviderType() === 'preact') {
+      // If we're in preact and we haven't already queued a microtask to process the options,
+      // queue one now.  We will handle all the accumulated options at once in the microtask.
+      if (!this._setOptionsQueue) {
+        this._setOptionsQueue = [];
+        this._superSetOptions = this._super.bind(this);
+        this._queueSetOptionsMicrotask();
+      }
+      this._setOptionsQueue.push({ options: { ...options }, flags: { ...flags } });
+    } else {
+      this._setOptionsHelper(options, flags, this._super.bind(this));
+    }
+  },
+
+  /**
+   * Helper function to set options.
+   * @memberof! oj.ojSelectBase
+   * @instance
+   * @private
+   */
+  _setOptionsHelper: function (options, flags, superSetOptions) {
     // JET-42413: set flag while we're processing a value change so that if an app makes
     // changes to the component from within the change listener, we can defer processing the
     // new change until after we're done processing the current change
@@ -5046,75 +5191,51 @@ oj.__registerWidget('oj.ojSelectBase', $.oj.editableValue, {
     }
 
     try {
-      this._super(options, flags);
+      superSetOptions(options, flags);
 
       // grab the latest processSetOptions object and remove it from the array
       var processSetOptions = this._processSetOptions.pop();
 
-      const finishProcessingSetOptions = () => {
-        // JET-34601 - SELECT SINGLE- CHANGING DISABLED PROPERTY GIVES A GLOWING EFFECT
-        // if we need to refresh, do that before setting a new value
-        if (processSetOptions.forRefresh) {
-          processSetOptions.forRefresh();
-        }
+      // JET-34601 - SELECT SINGLE- CHANGING DISABLED PROPERTY GIVES A GLOWING EFFECT
+      // if we need to refresh, do that before setting a new value
+      if (processSetOptions.forRefresh) {
+        processSetOptions.forRefresh();
+      }
 
-        // turn off the flag now, after refreshing but before processing the new value,
-        // only if we set the flag during this call to _setOptions
-        if (resolveBusyState) {
-          this._deferSettingValue = false;
-        }
+      // turn off the flag now, after refreshing but before processing the new value,
+      // only if we set the flag during this call to _setOptions
+      if (resolveBusyState) {
+        this._deferSettingValue = false;
+      }
 
-        if (processSetOptions.value) {
-          processSetOptions.value();
-        } else if (needToUpdateValueItem) {
-          // JET-42413: set flag while we're processing a value change so that if an app makes
-          // changes to the component from within the change listener, we can defer processing the
-          // new change until after we're done processing the current change
-          var resolveValueChangeFunc = this._StartMakingInternalValueChange();
-
-          // JET-38441 - WHEN GENERATOR VARIABLE OF TYPE 'OJS/OJARRAYDATAPROVIDER' IS BOUND TO
-          // SELECT-SINGLE, IT FAILS TO SHOW THE SELECTED VALUE
-          // if setting new data and the current valueItem was set internally, then it needs to be
-          // updated for the new data, which will happen when we re-set the existing value
-          this._setOption('value', this.options.value);
-
-          resolveValueChangeFunc();
-        }
+      if (processSetOptions.value) {
+        processSetOptions.value();
+      } else if (needToUpdateValueItem) {
+        // JET-42413: set flag while we're processing a value change so that if an app makes
+        // changes to the component from within the change listener, we can defer processing the
+        // new change until after we're done processing the current change
+        var resolveValueChangeFunc = this._StartMakingInternalValueChange();
 
-        // JET-42353 - SELECT SINGLE FOCUS LOST ON CHANGE OF THE DEPENDENT VALUE
-        // if the filter field was shown before processing the new options, but is no longer shown,
-        // show it again
-        if (showFilterField && this._filterInputText.style.visibility === 'hidden') {
-          // need to wait for the new filter oj-input-text to be upgraded
-          var busyContext = Context.getContext(this._filterInputText).getBusyContext();
-          busyContext.whenReady().then(
-            function () {
-              this._ShowFilterField();
-            }.bind(this)
-          );
-        }
-      };
+        // JET-38441 - WHEN GENERATOR VARIABLE OF TYPE 'OJS/OJARRAYDATAPROVIDER' IS BOUND TO
+        // SELECT-SINGLE, IT FAILS TO SHOW THE SELECTED VALUE
+        // if setting new data and the current valueItem was set internally, then it needs to be
+        // updated for the new data, which will happen when we re-set the existing value
+        this._setOption('value', this.options.value);
 
-      // JET-65611 - Form is in invalid state though the values are populated correctly
-      // This bug was related to the fact that the framework introduced changes in JET 16 so that
-      // the component gets batched property sets in VDOM, similar to knockout.js, whereas before
-      // each property was set individually.  For some property sets, like readonly, the code
-      // internally does a refresh.  For a valueItem change, in VDOM only, the code processes it
-      // in a microtask (to fix other issues encountered in VDOM).  With the previous, individual
-      // property setting behavior in VDOM, an internal refresh would happen before the new
-      // valueItem was even set on the component.  With the batching property setting behavior,
-      // the valueItem started to be processed before the internal refresh and then finished after
-      // the refresh, such that the changes were interfering with each other.  The fix defers
-      // finishing processing of the _setOptions call, including the refresh, to a microtask that
-      // is queued after the microtask to finish handling the valueItem change.  So when the
-      // refresh happens, it is after the valueItem change has finished.  This ordering is not the
-      // same as what happened before in VDOM, but it is the same as what happens outside of VDOM,
-      // like in the cookbook MVVM app.
-      const elemState = CustomElementUtils.getElementState(this.OuterWrapper);
-      if (elemState.getBindingProviderType() === 'preact') {
-        window.queueMicrotask(finishProcessingSetOptions);
-      } else {
-        finishProcessingSetOptions();
+        resolveValueChangeFunc();
+      }
+
+      // JET-42353 - SELECT SINGLE FOCUS LOST ON CHANGE OF THE DEPENDENT VALUE
+      // if the filter field was shown before processing the new options, but is no longer shown,
+      // show it again
+      if (showFilterField && this._filterInputText.style.visibility === 'hidden') {
+        // need to wait for the new filter oj-input-text to be upgraded
+        var busyContext = Context.getContext(this._filterInputText).getBusyContext();
+        busyContext.whenReady().then(
+          function () {
+            this._ShowFilterField();
+          }.bind(this)
+        );
       }
     } finally {
       if (resolveBusyState) {
@@ -5150,133 +5271,6 @@ oj.__registerWidget('oj.ojSelectBase', $.oj.editableValue, {
       this._super(key, value, flags);
     }
 
-    // In vdom architecture, there are multiple issues with value and valueItem property that we need to
-    // handle.
-    //
-    // JET-51307 - Wrapping select single with value item and value integrations going into loop
-    // with multiple instances of LOV in a page
-    // If we're wrapped by a VComponent and there are multiple instances on the page
-    // all bound to the same valueItem, then if the user selects a new value in one instance,
-    // the page can go into an infinite loop.
-    // If we synchronously update the value on our DOM element here, then when the next preact
-    // render compares the stale vcomp value property against the new value in the DOM, preact
-    // determines it must push the stale value property back down onto us, which then causes
-    // the valueItem to get sync'ed again, and the loop goes on.
-    //
-    // JET-55775 - oj-select-single initiates fetch even when valueItem is provided in preact wrapper
-    // In preact, when value & valueItem are set at the same time, we will receive them one after the other.
-    // So, if we process the value when we get it, then we might initiate an unnecessary fetch as we will
-    // later get the data from valueItem.
-    //
-    // JET-64359 - select - single handling of mutation on both value and valueItem properties coming from preact
-    // Also, when either value or valueItem property is ignored when updating props in the wrapper vcomponent,
-    // we will get a setOption call with a null / default value for that property. In these cases, depending on the
-    // order we receive the call, we might incorrectly end up setting the null / default value.
-    //
-    // In order to address all these cases, if we know we are in the vdom land, we will queue a microtask to process
-    // the value and valueItem. Since, preact calls setOptions synchronously for each option, in our microtask callback
-    // we will have access to the latest value for all the properties. We will be setting some flags here to determine
-    // which properties are set by the preact. Then we can use the flags as well as the latest value to determine
-    // how to process the value and valueItem correctly.
-    const elemState = CustomElementUtils.getElementState(this.OuterWrapper);
-    if (
-      elemState.getBindingProviderType() === 'preact' &&
-      (key === 'value' || key === this._GetValueItemPropertyName())
-    ) {
-      const processValueAndValueItem = () => {
-        // Get the latest value and valueItem
-        const _valueItem = this.options[this._GetValueItemPropertyName()];
-        const _value = this.options.value;
-        // Determine empty states
-        // Note that _Is*****ForPlaceholder simply checks whether the value/valueItem
-        // represents the empty/null state.
-        const isEmptyValue = this._IsValueForPlaceholder(_value);
-        const isEmptyValueItem = this._IsValueItemForPlaceholder(_valueItem);
-
-        // Cleanup function - things to do when exiting the microtask
-        const cleanup = () => {
-          // reset all the flags
-          this._processingSetOptionsMicroTask = false;
-          this._processingValue = false;
-          this._processingValueItem = false;
-        };
-
-        // This will use the value for updating the component
-        const updateUsingValue = () => {
-          abstractLovBase.setValue(_value);
-
-          //  - placeholder is not displayed after removing selections from select many
-          //  - resetting value when value-item and placeholder are set throws exception
-          if (isEmptyValue) {
-            // Note that _GetDefaultValueItemForPlaceholder is just a getter for the
-            // valueItem representing the empty state.
-            this._SetValueItem(this._GetDefaultValueItemForPlaceholder());
-          } else {
-            // update valueItem
-            this._UpdateValueItem(_value);
-          }
-
-          // need to update display value again after valueItem is set correctly
-          this._SetDisplayValue();
-        };
-        // This will use the valueItem for updating the component
-        const updateUsingValueItem = () => {
-          this._valueItemSetInternally = false;
-          this._SyncValueWithValueItem(_valueItem, _value);
-        };
-
-        // If both value and valueItem are provided, then compare them to decide
-        // what to do
-        if (this._processingValue && this._processingValueItem) {
-          // if valueItem and value are not null, and they are conflicting then
-          // throw an error
-          if (!isEmptyValue && !isEmptyValueItem && _valueItem.key !== _value) {
-            // make sure to clean up before throwing an error
-            cleanup();
-            throw new Error('Select Single: conflicting value-item and value');
-          }
-
-          // At this point, either one of them is empty or they both have the same
-          // key. So, if valueItem is not empty, use it. Otherwise, use the value.
-          if (!isEmptyValueItem) {
-            updateUsingValueItem();
-          } else {
-            updateUsingValue();
-          }
-        }
-        // If only value is provided, then use the value
-        else if (this._processingValue) {
-          updateUsingValue();
-        }
-        // If only valueItem is provided then use the valueItem for updating the value
-        else if (this._processingValueItem) {
-          updateUsingValueItem();
-        }
-
-        // Finally clean things up
-        cleanup();
-      };
-
-      // If we receive a value or valueItem setOption call, set the flag and
-      // defer processing them
-      if (key === 'value') {
-        this._processingValue = true;
-      } else if (key === this._GetValueItemPropertyName()) {
-        this._processingValueItem = true;
-      }
-
-      // if we are processing value or valueItem, then queue a microtask to
-      // process them together. Do this only if it is not already queued. Then
-      // return early without doing anything else.
-      if (this._processingValue || this._processingValueItem) {
-        if (!this._processingSetOptionsMicroTask) {
-          this._processingSetOptionsMicroTask = true;
-          window.queueMicrotask(processValueAndValueItem);
-        }
-        return;
-      }
-    }
-
     var processSetOptions;
     if (this._processSetOptions && this._processSetOptions.length > 0) {
       // use the last processSetOptions object, which is the one for the current _setOptions call

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

@@ -163,7 +163,8 @@ class VCellGenerator extends Component {
                     if (_isVNode(child) && String(child['type']).toLowerCase().startsWith('oj-c-')) {
                         const corePackFormComp = child;
                         corePackFormComp.props['containerReadonly'] = props.containerReadonly;
-                        if (corePackFormComp.props['readonly'] === undefined) {
+                        if (corePackFormComp.props['readonly'] === undefined &&
+                            corePackFormComp.props['READONLY'] === undefined) {
                             corePackFormComp.props['readonly'] = props.containerReadonly;
                         }
                     }

package/dist/js/libs/oj/main-template.js

@@ -15,9 +15,9 @@
   requirejs.config({
     // Path mappings for the logical module names
     paths: {
-      'ojs': 'libs/oj/16.0.5/min@insertESLevelPath@',
-      'ojL10n': 'libs/oj/16.0.5/ojL10n',
-      'ojtranslations': 'libs/oj/16.0.5/resources',
+      'ojs': 'libs/oj/16.0.7/min@insertESLevelPath@',
+      'ojL10n': 'libs/oj/16.0.7/ojL10n',
+      'ojtranslations': 'libs/oj/16.0.7/resources',
       
   'knockout': 'libs/knockout/knockout-3.5.1',
   'jquery': 'libs/jquery/jquery-3.6.4.min',