@oracle/oraclejet 11.0.6 → 11.1.1

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

@@ -17945,47 +17945,57 @@ var __oj_data_grid_metadata =
    * Handles focus on the root and its children by setting focus class on the root
    * @param {Event} event
    */
-  DvtDataGrid.prototype.handleRootFocus = function (event) {
+  DvtDataGrid.prototype.handleRootFocus = function (event, isPopupFocusin) {
     this.m_utils.addCSSClassName(this.m_root, this.getMappedStyle('focus'));
     this._clearFocusoutTimeout();
     this._clearFocusoutBusyState();
     // if nothing is active, and came from the outside of the datagrid, activate first cell
-    if (!this.m_root.contains(document.activeElement) ||
-        (document.activeElement === this.m_root &&
-         this.m_root.tabIndex === 0) ||
-        (document.activeElement === this.m_databody &&
-         this.m_scrollbarFocus &&
-         this.m_root.tabIndex === 0)) {
-      this.m_externalFocus = true;
+    if (!isPopupFocusin) {
+      this._clearOpenPopupListeners();
+      if (!this.m_root.contains(document.activeElement) ||
+          (document.activeElement === this.m_root &&
+          this.m_root.tabIndex === 0) ||
+          (document.activeElement === this.m_databody &&
+          this.m_scrollbarFocus &&
+          this.m_root.tabIndex === 0)) {
+        this.m_externalFocus = true;
 
-      if (this._isCellEditable()) {
-        this._setAccInfoText('accessibleEditableMode');
-      } else if (this._isGridEditable()) {
-        this._setAccInfoText('accessibleNavigationMode');
-      }
+        if (this._isCellEditable()) {
+          this._setAccInfoText('accessibleEditableMode');
+        } else if (this._isGridEditable()) {
+          this._setAccInfoText('accessibleNavigationMode');
+        }
 
-      var shouldNotScroll = false;
-      if (this.m_scrollbarFocus === true) {
-        this.m_shouldFocus = false;
-        this.m_scrollbarFocus = false;
-        shouldNotScroll = true;
-      }
+        var shouldNotScroll = false;
+        if (this.m_scrollbarFocus === true) {
+          this.m_shouldFocus = false;
+          this.m_scrollbarFocus = false;
+          shouldNotScroll = true;
+        }
 
-      if (this.m_active == null && !this._databodyEmpty()) {
-        var newCellIndex = this.createIndex(0, 0);
+        if (this.m_active == null && !this._databodyEmpty()) {
+          var newCellIndex = this.createIndex(0, 0);
 
-        if (!shouldNotScroll) {
-          // make sure it's visible
-          this.scrollToIndex(newCellIndex);
+          if (!shouldNotScroll) {
+            // make sure it's visible
+            this.scrollToIndex(newCellIndex);
+          }
+          // focus a cell, do not select it unless user actively selects something
+          this._setActiveByIndex(newCellIndex, event, null, null, shouldNotScroll);
+        } else if (this.m_active != null) {
+          this._highlightActive();
         }
-
-        // focus a cell, do not select it unless user actively selects something
-        this._setActiveByIndex(newCellIndex, event, null, null, shouldNotScroll);
-      } else if (this.m_active != null) {
-        this._highlightActive();
       }
+      this.m_root.tabIndex = -1;
     }
-    this.m_root.tabIndex = -1;
+  };
+
+  DvtDataGrid.prototype._handlePopupFocusout = function (event) {
+    this.handleRootBlur(event, true);
+  };
+
+  DvtDataGrid.prototype._handlePopupFocusin = function (event) {
+    this.handleRootFocus(event, true);
   };
 
   /**
@@ -17993,22 +18003,40 @@ var __oj_data_grid_metadata =
    * @param {Event} event
    */
   // eslint-disable-next-line no-unused-vars
-  DvtDataGrid.prototype.handleRootBlur = function (event) {
+  DvtDataGrid.prototype.handleRootBlur = function (event, isPopupFocusout) {
     // There is no cross-browser way to tell if the whole grid is out of focus on blur today.
     // document.activeElement returns null in chrome and firefox on blur events.
     // relatedTarget doesn't return a value in firefox and IE though there a tickets to fix.
     // We could implement a non-timeout solution that exiting and re-entering
     // the grid via tab key would not read the summary text upon re-entry (initial would work)
     this._clearFocusoutTimeout();
+    if (!isPopupFocusout) {
+      // Components that open popups (such as ojSelect, ojCombobox, ojInputDate, etc.) will trigger
+      // focusout, but we don't want to change mode in those cases since the user is still editing.
+      this._clearOpenPopupListeners();
+      var openPopup = DataCollectionUtils.getLogicalChildPopup(this.m_root);
+      if (openPopup != null) {
+        // setup focus listeners on popup
+        this._openPopup = openPopup;
+        // eslint-disable-next-line no-param-reassign
+        isPopupFocusout = false;
+        this._handlePopupFocusinListener = this._handlePopupFocusin.bind(this);
+        this._handlePopupFocusoutListener = this._handlePopupFocusout.bind(this);
+        openPopup.addEventListener('focusin', this._handlePopupFocusinListener);
+        openPopup.addEventListener('focusout', this._handlePopupFocusoutListener);
+        return;
+      }
+    }
     this._setFocusoutBusyState();
-    setTimeout(function () { // @HTMLUpdateOK
-      if (!this.m_root.contains(document.activeElement)) {
+    this.m_focusoutTimeout = setTimeout(function () { // @HTMLUpdateOK
+      if (!this.m_root.contains(document.activeElement) ||
+        isPopupFocusout === true) {
         this.m_root.tabIndex = 0;
         var active = this._getActiveElement();
         if (active != null) {
           this._unsetAriaProperties(active);
           if (this._isEditOrEnter()) {
-            this._leaveEditing(event, active, false);
+            this._leaveEditing(event, active, false, false);
           }
         }
       }
@@ -18021,6 +18049,30 @@ var __oj_data_grid_metadata =
     }
   };
 
+  DvtDataGrid.prototype._clearOpenPopupListeners = function () {
+    if (this._openPopup != null) {
+      this._openPopup.removeEventListener('focusin', this._handlePopupFocusinListener);
+      this._openPopup.removeEventListener('focusout', this._handlePopupFocusoutListener);
+      this._openPopup = null;
+    }
+    this._handlePopupFocusinListener = null;
+    this._handlePopupFocusoutListener = null;
+  };
+
+  /**
+   * @private
+   */
+  DvtDataGrid.prototype._handlePopupFocusout = function (event) {
+    this.handleRootBlur(event, true);
+  };
+
+  /**
+   * @private
+   */
+  DvtDataGrid.prototype._handlePopupFocusin = function (event) {
+    this.handleRootFocus(event, true);
+  };
+
   DvtDataGrid.prototype._clearFocusoutTimeout = function () {
     if (this.m_focusoutTimeout) {
       clearTimeout(this.m_focusoutTimeout);
@@ -18806,9 +18858,11 @@ var __oj_data_grid_metadata =
    * Leave editing
    * @param {Event} event the event triggering actionable mode
    * @param {Element|undefined|null} element
+   * @param {boolean} cancel
+   * @param {boolean} shouldFocus
    * @returns {boolean} false
    */
-  DvtDataGrid.prototype._leaveEditing = function (event, element, cancel) {
+  DvtDataGrid.prototype._leaveEditing = function (event, element, cancel, shouldFocus) {
     var details = {
       event: event,
       ui: {
@@ -18819,15 +18873,21 @@ var __oj_data_grid_metadata =
     };
     if (!cancel) {
       DataCollectionUtils.disableAllFocusableElements(element);
+      if (shouldFocus === false) {
+        this.m_shouldFocus = shouldFocus;
+      }
       this._highlightActive();
     }
     var rerender = this.fireEvent('beforeEditEnd', details);
     if (rerender) {
       this.m_currentMode = 'navigation';
       DataCollectionUtils.disableAllFocusableElements(element);
-        this._highlightActive();
-        this._reRenderCell(element, 'navigation',
-                         this.getMappedStyle('cellEdit'), this.m_editableClone);
+      if (shouldFocus === false) {
+        this.m_shouldFocus = shouldFocus;
+      }
+      this._highlightActive();
+      this._reRenderCell(element, 'navigation',
+                        this.getMappedStyle('cellEdit'), this.m_editableClone);
     } else {
       rerender = false;
       this._scrollToActive(this.m_active);
@@ -24261,7 +24321,7 @@ var __oj_data_grid_metadata =
       metadata: item.metadata,
       keys: {
         row: this.rowKeyMap.get(item.rowIndex),
-        column: this.rowKeyMap.get(item.columnIndex)
+        column: this.columnKeyMap.get(item.columnIndex)
       }
     };
   };

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

@@ -125,6 +125,22 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojeventtarget'], function (exports, o
      *     </tr>
      *     <tr>
      *       <td>
+     *         {@link RESTDataProvider}
+     *       </td>
+     *       <td>
+     *         DataProvider implementation that fetches data from a JSON-based REST API.
+     *       </td>
+     *     </tr>
+     *     <tr>
+     *       <td>
+     *         {@link RESTTreeDataProvider}
+     *       </td>
+     *       <td>
+     *         TreeDataProvider implementation that fetches hierarchical data from a JSON-based REST API.
+     *       </td>
+     *     </tr>
+     *     <tr>
+     *       <td>
      *         {@link TreeDataProviderView}
      *       </td>
      *       <td>
@@ -145,10 +161,12 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojeventtarget'], function (exports, o
      *     <li>{@link FlattenedTreeDataProviderView}</li>
      *     <li>{@link ListDataProviderView}</li>
      *     <li>{@link PagingDataProviderView}</li>
+     *     <li>{@link RESTDataProvider}</li>
      *     <li><b>Interface {@link TreeDataProvider}</b></li>
      *       <ul>
      *         <li>{@link ArrayTreeDataProvider}</li>
      *         <li>{@link IndexerModelTreeDataProvider}</li>
+     *         <li>{@link RESTTreeDataProvider}</li>
      *         <li>{@link TreeDataProviderView}</li>
      *       </ul>
      *     </li>

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

@@ -1411,7 +1411,7 @@ var __oj_diagram_link_metadata =
            * @instance
            * @type {(function(Object))=}
            * @default null
-           * @ojsignature {target: "Type", value: "((context: {portElement: Element, dataContext: oj.ojDiagram.NodeItemContext<K1,D1>}) => ({svgStyle?: CSSStyleDeclaration, svgClassName?: string} | null))", jsdocOverride: true}
+           * @ojsignature {target: "Type", value: "((context: {portElement: Element, dataContext: oj.ojDiagram.NodeItemContext<K1,D1>}) => ({svgStyle?: Partial<CSSStyleDeclaration>, svgClassName?: string} | null))", jsdocOverride: true}
            */
           /**
            * A string, containing a selector expression, that will be used to identify the descendant DOM element in a diagram node that can be used for link creation. This property is requred.
@@ -3014,7 +3014,7 @@ var __oj_diagram_link_metadata =
              * @memberof! oj.ojDiagram
              * @instance
              * @type {Object=}
-             * @ojsignature {target: "Type", value: "CSSStyleDeclaration", jsdocOverride: true}
+             * @ojsignature {target: "Type", value: "Partial<CSSStyleDeclaration>", jsdocOverride: true}
              * @default {}
              */
             labelStyle: {},
@@ -3175,7 +3175,7 @@ var __oj_diagram_link_metadata =
                * @memberof! oj.ojDiagram
                * @instance
                * @type {Object=}
-               * @ojsignature {target: "Type", value: "CSSStyleDeclaration", jsdocOverride: true}
+               * @ojsignature {target: "Type", value: "Partial<CSSStyleDeclaration>", jsdocOverride: true}
                * @default {}
                */
               /**
@@ -3218,7 +3218,7 @@ var __oj_diagram_link_metadata =
              * @memberof! oj.ojDiagram
              * @instance
              * @type {Object=}
-             * @ojsignature {target: "Type", value: "CSSStyleDeclaration", jsdocOverride: true}
+             * @ojsignature {target: "Type", value: "Partial<CSSStyleDeclaration>", jsdocOverride: true}
              * @default {}
              */
             /**
@@ -3252,7 +3252,7 @@ var __oj_diagram_link_metadata =
              * @memberof! oj.ojDiagram
              * @instance
              * @type {Object=}
-             * @ojsignature {target: "Type", value: "CSSStyleDeclaration", jsdocOverride: true}
+             * @ojsignature {target: "Type", value: "Partial<CSSStyleDeclaration>", jsdocOverride: true}
              */
             labelStyle: {},
             /**
@@ -3318,7 +3318,7 @@ var __oj_diagram_link_metadata =
              * @memberof! oj.ojDiagram
              * @instance
              * @type {Object=}
-             * @ojsignature {target: "Type", value: "CSSStyleDeclaration", jsdocOverride: true}
+             * @ojsignature {target: "Type", value: "Partial<CSSStyleDeclaration>", jsdocOverride: true}
              * @default {}
              */
             /**

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

@@ -15,10 +15,11 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
         else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
         return c > 3 && r && Object.defineProperty(target, key, r), r;
     };
+    var DrawerLayout_1;
     const ojet = oj;
     const PopupService = ojet.PopupService;
     const ZOrderUtils = ojet.ZOrderUtils;
-    exports.DrawerLayout = class DrawerLayout extends preact.Component {
+    exports.DrawerLayout = DrawerLayout_1 = class DrawerLayout extends preact.Component {
         constructor() {
             super(...arguments);
             this.rootRef = preact.createRef();
@@ -98,7 +99,8 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
         getDrawer(edge) {
             if (this.isDrawerOpened(edge)) {
                 const resolvedMode = this.getResolvedDrawerDisplayMode(edge);
-                const isOverlay = resolvedMode === ojdrawerutils.DrawerConstants.stringOverlay || resolvedMode === ojdrawerutils.DrawerConstants.stringFullOverlay;
+                const isOverlay = resolvedMode === ojdrawerutils.DrawerConstants.stringOverlay ||
+                    resolvedMode === ojdrawerutils.DrawerConstants.stringFullOverlay;
                 const roleAttr = this.props.role || (isOverlay && 'dialog');
                 const tabIndexAttr = isOverlay ? -1 : undefined;
                 return (preact.h("div", { ref: this.getDrawerRef(edge), key: this.getResolvedDrawerDisplayMode(edge), role: roleAttr, tabIndex: tabIndexAttr, class: this.getDrawerStyleClasses(edge), onKeyDown: (event) => this.handleKeyDown(edge, event) }, this.getDrawerContent(edge)));
@@ -187,21 +189,29 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
             firstFocusableElem.focus();
         }
         componentDidUpdate(prevProps, prevState) {
-            this.afterUpdateCheck(prevState);
+            this.handleComponentUpdate(prevState);
         }
         componentDidMount() {
             window.addEventListener('resize', () => {
                 this.resizeHandler();
             });
+            if (DrawerLayout_1.defaultProps.startOpened != this.props.startOpened ||
+                DrawerLayout_1.defaultProps.endOpened != this.props.endOpened) {
+                const stateCopy = Object.assign({}, this.state);
+                stateCopy.startOpened = false;
+                stateCopy.endOpened = false;
+                this.handleComponentUpdate(stateCopy);
+            }
         }
         componentWillUnmount() {
             window.removeEventListener('resize', () => {
                 this.resizeHandler();
             });
         }
-        afterUpdateCheck(prevState) {
-            const firstDrawerToOpen = this.state.lastlyOpenedDrawer === ojdrawerutils.DrawerConstants.stringStart ?
-                ojdrawerutils.DrawerConstants.stringEnd : ojdrawerutils.DrawerConstants.stringStart;
+        handleComponentUpdate(prevState) {
+            const firstDrawerToOpen = this.state.lastlyOpenedDrawer === ojdrawerutils.DrawerConstants.stringStart
+                ? ojdrawerutils.DrawerConstants.stringEnd
+                : ojdrawerutils.DrawerConstants.stringStart;
             this.openDrawerIfNeeded(firstDrawerToOpen, prevState);
             this.openDrawerIfNeeded(this.state.lastlyOpenedDrawer, prevState);
         }
@@ -228,7 +238,6 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
                 if (surrogate.querySelectorAll(`.${ojdrawerutils.DrawerConstants.stringOjDrawer}${ojdrawerutils.DrawerConstants.charDash}${edge}`).length > 0) {
                     drawerExists = true;
                 }
-                ;
             });
             const drawerEl = this.getDrawerRef(edge).current;
             if (drawerExists === false && ZOrderUtils.getStatus(drawerEl) === ZOrderUtils.STATUS.OPEN) {
@@ -303,7 +312,7 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
         endDisplay: 'auto'
     };
     exports.DrawerLayout.metadata = { "slots": { "": {}, "start": {}, "end": {} }, "properties": { "startOpened": { "type": "boolean", "writeback": true }, "endOpened": { "type": "boolean", "writeback": true }, "startDisplay": { "type": "string", "enumValues": ["reflow", "overlay", "auto"] }, "endDisplay": { "type": "string", "enumValues": ["reflow", "overlay", "auto"] } }, "extension": { "_WRITEBACK_PROPS": ["startOpened", "endOpened"], "_READ_ONLY_PROPS": [], "_OBSERVED_GLOBAL_PROPS": ["role"] } };
-    exports.DrawerLayout = __decorate([
+    exports.DrawerLayout = DrawerLayout_1 = __decorate([
         ojvcomponent.customElement('oj-drawer-layout')
     ], exports.DrawerLayout);
 

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

@@ -16,9 +16,10 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
         else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
         return c > 3 && r && Object.defineProperty(target, key, r), r;
     };
+    var DrawerPopup_1;
     const PopupService = oj.PopupService;
     const targetElement = window;
-    exports.DrawerPopup = class DrawerPopup extends preact.Component {
+    exports.DrawerPopup = DrawerPopup_1 = class DrawerPopup extends preact.Component {
         constructor() {
             super(...arguments);
             this.state = {
@@ -201,6 +202,16 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
             }
         }
         componentDidUpdate(prevProps, prevState) {
+            this.handleComponentUpdate(prevState);
+        }
+        componentDidMount() {
+            if (DrawerPopup_1.defaultProps.opened != this.props.opened) {
+                const stateCopy = Object.assign({}, this.state);
+                stateCopy.opened = false;
+                this.handleComponentUpdate(stateCopy);
+            }
+        }
+        handleComponentUpdate(prevState) {
             this.renderDrawer(prevState);
             if (this.isDrawerOpened() && this.props.closeGesture === 'swipe') {
                 this.registerCloseWithSwipeListener();
@@ -245,7 +256,7 @@ define(['exports', 'ojs/ojvcomponent', 'preact', 'jquery', 'ojs/ojanimation', 'o
         closeGesture: 'swipe'
     };
     exports.DrawerPopup.metadata = { "slots": { "": {} }, "properties": { "opened": { "type": "boolean", "writeback": true }, "edge": { "type": "string", "enumValues": ["start", "end", "bottom"] }, "modality": { "type": "string", "enumValues": ["modal", "modeless"] }, "autoDismiss": { "type": "string", "enumValues": ["focus-loss", "none"] }, "closeGesture": { "type": "string", "enumValues": ["swipe", "none"] } }, "extension": { "_WRITEBACK_PROPS": ["opened"], "_READ_ONLY_PROPS": [], "_OBSERVED_GLOBAL_PROPS": ["role"] } };
-    exports.DrawerPopup = __decorate([
+    exports.DrawerPopup = DrawerPopup_1 = __decorate([
         ojvcomponent.customElement('oj-drawer-popup')
     ], exports.DrawerPopup);
 

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

@@ -17982,8 +17982,13 @@ define(['exports', 'ojs/ojthemeutils'], function (exports, ThemeUtils) { 'use st
     if (popupLaunched) event.preventDefault();
 
     // Process selection only for selectable objects so that generating context menu on empty area doesn't deselect ()
-    if (obj && obj.isSelectable && obj.isSelectable())
-      this.ProcessSelectionEventHelper(obj, event.ctrlKey);
+    if (obj && obj.isSelectable && obj.isSelectable()) {
+      // prevent deselection in mac ctrl + click
+      var skip = Agent.os === 'mac' && obj.isSelected();
+      if (!skip) {
+        this.ProcessSelectionEventHelper(obj, event.ctrlKey);
+      }
+    }
   };
 
   /**
@@ -20375,7 +20380,10 @@ define(['exports', 'ojs/ojthemeutils'], function (exports, ThemeUtils) { 'use st
    */
   Context.prototype.removeSizingSvg = function () {
     if (this._sizingSvg) {
-      ToolkitUtils.removeAttrNullNS(this._root, 'style');
+      this._root.style.removeProperty('position');
+      this._root.style.removeProperty('left');
+      this._root.style.removeProperty('top');
+      this._root.style.removeProperty('padding');
       this.getContainer().removeChild(this._sizingSvg);
       this._sizingSvg = null;
     }

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

@@ -101,6 +101,22 @@ define(function () { 'use strict';
 	 * @type {string}
 	 */
 
+	/**
+	 * The position of the label relative to its time interval. This only takes effect on horizontal time axes. The behavior of "auto" varies based on consuming component and theme.
+	 * @since 11.1.0
+	 * @export
+	 * @expose
+	 * @memberof DvtTimeComponentScale
+	 * @instance
+	 * @name labelPosition
+	 * @type {?string}
+	 * @ojvalue {string} "start"
+	 * @ojvalue {string} "center"
+	 * @ojvalue {string} "auto"
+	 * @ojsignature {target: "Type", value: '?("start"|"center"|"auto")'}
+	 * @default "auto"
+	 */
+
 	/**
 	 * Formats the given date into a label used for display.
 	 * @param {string} date The date to be formatted.

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

@@ -865,6 +865,9 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
     let readonlyElem = this._getReadonlyDiv();
     if (!readonlyElem && createConditions) {
       readonlyElem = this._createReadonlyDiv(input);
+      if (!readonlyElem) {
+        return;
+      }
       if (this.options.labelledBy) {
         this._setReadonlyDivLabelledBy(this.options.labelledBy);
       }
@@ -873,6 +876,19 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
 
     if (readonlyElem) {
       readonlyElem.textContent = this._GetDisplayValue();
+      EditableValueUtils._setTabIndex(input, readonlyElem);
+    }
+  };
+
+  /**
+   * @ignore
+   * @private
+   */
+   EditableValueUtils._setTabIndex = function (input, readonlyElem) {
+    let tabIndex = input.tabIndex;
+    let readonlyElemToSet = readonlyElem;
+    if (tabIndex !== null) {
+      readonlyElemToSet.tabIndex = tabIndex;
     }
   };
 
@@ -1561,8 +1577,6 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
       // to have the text vertically centered in the div.
       var readonlyInnerElem = document.createElement('div');
       readonlyInnerElem.classList.add('oj-text-field-readonly');
-      // for accessibility you need to be able to tab into a readonly field.
-      readonlyInnerElem.setAttribute('tabindex', '0');
       readonlyInnerElem.setAttribute('role', 'textbox');
       readonlyInnerElem.setAttribute('aria-readonly', true);
 
@@ -9235,6 +9249,26 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
       clearTimeout(this._timeoutId);
     }
 
+    // JET-46567 - JAWS is reading out error message even after selecting correct value
+    // allow a component to opt-in to receive notification before and after the timer fires
+    // so that it can wait until after messages have been updated to finish processing,
+    // for example to change focus after screen reader text has been updated
+    var component = this.GetComponent();
+    if (component && component._NotifyMessagingStrategyQueueAction) {
+      if (!this._notifyQueueActionPromise) {
+        var promiseResolve;
+        this._notifyQueueActionPromise = new Promise(function (resolve) {
+          promiseResolve = resolve;
+        });
+        this._notifyQueueActionPromiseResolve = function () {
+          this._notifyQueueActionPromise = null;
+          this._notifyQueueActionPromiseResolve = null;
+          promiseResolve();
+        }.bind(this);
+      }
+      component._NotifyMessagingStrategyQueueAction(this._notifyQueueActionPromise);
+    }
+
     this._timeoutId = setTimeout(function () {
       self._timeoutId = null;
 
@@ -9254,6 +9288,10 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
           rootElem[0].innerHTML = contentToShow;// @HTMLUpdateOK
           self._addRemoveOjHasMessagesClass(contentToShow);
           self._clearBusyState();
+
+          if (self._notifyQueueActionPromiseResolve) {
+            self._notifyQueueActionPromiseResolve();
+          }
         } else {
           // aria-live polite is needed so a screen reader will read the inline message without the
           // user needing to set focus to the input field. aria-live: 'off' is needed before
@@ -9303,6 +9341,10 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
                   self._addRemoveOjHasMessagesClass(contentToShow);
                 }
                 self._clearBusyState();
+
+                if (self._notifyQueueActionPromiseResolve) {
+                  self._notifyQueueActionPromiseResolve();
+                }
               }
             });
         }
@@ -9310,6 +9352,10 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
         // Just clear the busy state if $messagingContentRoot no longer exists
         self._addRemoveOjHasMessagesClass('');
         self._clearBusyState();
+
+        if (self._notifyQueueActionPromiseResolve) {
+          self._notifyQueueActionPromiseResolve();
+        }
       }
     }, 0);
   };