@oracle/oraclejet 12.0.1 → 12.1.0

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

@@ -5,16 +5,16 @@
  * as shown at https://oss.oracle.com/licenses/upl/
  * @ignore
  */
-define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojlabel', 'ojs/ojthemeutils', 'ojs/ojcontext', 'ojs/ojlogger', 'ojs/ojvalidator-required', 'ojs/ojlabelledbyutils', 'ojs/ojtranslation', 'ojs/ojmessaging', 'ojs/ojconverterutils', 'ojs/ojvalidation-error', 'ojs/ojpopup', 'hammerjs', 'ojs/ojjquery-hammer', 'ojs/ojdomutils', 'ojs/ojanimation', 'ojs/ojfocusutils'], function (exports, oj, Components, $, ojlabel, ojthemeutils, Context, Logger, RequiredValidator, LabelledByUtils, Translations, Message, ConverterUtils, ojvalidationError, ojpopup, Hammer, ojjqueryHammer, DomUtils, AnimationUtils, FocusUtils) { 'use strict';
+define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojlabel', 'ojs/ojthemeutils', 'ojs/ojfocusutils', 'ojs/ojcontext', 'ojs/ojlogger', 'ojs/ojvalidator-required', 'ojs/ojlabelledbyutils', 'ojs/ojtranslation', 'ojs/ojmessaging', 'ojs/ojconverterutils', 'ojs/ojvalidation-error', 'ojs/ojpopup', 'hammerjs', 'ojs/ojjquery-hammer', 'ojs/ojdomutils', 'ojs/ojanimation'], function (exports, oj, Components, $, ojlabel, ojthemeutils, FocusUtils, Context, Logger, RequiredValidator, LabelledByUtils, Translations, Message, ConverterUtils, ojvalidationError, ojpopup, Hammer, ojjqueryHammer, DomUtils, AnimationUtils) { 'use strict';
 
   oj = oj && Object.prototype.hasOwnProperty.call(oj, 'default') ? oj['default'] : oj;
   $ = $ && Object.prototype.hasOwnProperty.call($, 'default') ? $['default'] : $;
+  FocusUtils = FocusUtils && Object.prototype.hasOwnProperty.call(FocusUtils, 'default') ? FocusUtils['default'] : FocusUtils;
   Context = Context && Object.prototype.hasOwnProperty.call(Context, 'default') ? Context['default'] : Context;
   RequiredValidator = RequiredValidator && Object.prototype.hasOwnProperty.call(RequiredValidator, 'default') ? RequiredValidator['default'] : RequiredValidator;
   LabelledByUtils = LabelledByUtils && Object.prototype.hasOwnProperty.call(LabelledByUtils, 'default') ? LabelledByUtils['default'] : LabelledByUtils;
   Message = Message && Object.prototype.hasOwnProperty.call(Message, 'default') ? Message['default'] : Message;
   ConverterUtils = ConverterUtils && Object.prototype.hasOwnProperty.call(ConverterUtils, 'default') ? ConverterUtils['default'] : ConverterUtils;
-  FocusUtils = FocusUtils && Object.prototype.hasOwnProperty.call(FocusUtils, 'default') ? FocusUtils['default'] : FocusUtils;
 
   /**
    * Base class for rendering the 'inside' labels. This is so InsideLabelStrategy
@@ -3069,6 +3069,20 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
             this._placeholderOptionChanged(flags);
             break;
 
+          case 'readOnly':
+            if (this._retainFocusOnReadonlyChange) {
+              // This setTimeout call is needed to allow the dom to update before we
+              // get the focus element (or the element will still be hidden).
+              setTimeout(() => {
+                this.GetFocusElement().focus();
+                if (this._resolveBusyStateFocusRestore) {
+                  this._resolveBusyStateFocusRestore();
+                  delete this._resolveBusyStateFocusRestore;
+                }
+              }, 0);
+            }
+            break;
+
           case 'title':
             // Ignore title attribute for custom element components.
             if (!this._IsCustomElement()) {
@@ -3228,6 +3242,9 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
       },
 
       /**
+       * JET-48463 - If we are in readonly mode, we call _GetReadonlyFocusElement, and fall back to
+       * _GetContentElement()[0] if _GetReadonlyFocusElement happens to return null.
+       * If not readonly, we just return _GetContentElement()[0]
        * @memberof oj.editableValue
        * @instance
        * @override
@@ -3235,7 +3252,20 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
        * @since 5.0.0
        */
       GetFocusElement: function () {
-        return this._GetContentElement()[0];
+        return this.options.readOnly === true ?
+          this._GetReadonlyFocusElement() || this._GetContentElement()[0] :
+          this._GetContentElement()[0];
+      },
+
+      /**
+       * Returns the readonly focus element if there is a readonly specific element, otherwise null
+       * @memberof oj.editableValue
+       * @instance
+       * @protected
+       * @return {Element|null}
+       */
+      _GetReadonlyFocusElement: function () {
+        return this._getReadonlyDiv();
       },
 
       /**
@@ -3289,6 +3319,21 @@ define(['exports', 'ojs/ojcore-base', 'ojs/ojcomponentcore', 'jquery', 'ojs/ojla
             }
             break;
           case 'readOnly':
+            this._retainFocusOnReadonlyChange = FocusUtils.containsFocus(this.widget()[0]);
+            if (this._retainFocusOnReadonlyChange) {
+              if (!this._resolveBusyStateFocusRestore) {
+                var domElem = this.element[0];
+                var busyContext = Context.getContext(domElem).getBusyContext();
+                var description = 'Waiting for focus on the component ';
+
+                if (domElem && domElem.id) {
+                  description += `with id="${domElem.id}" `;
+                }
+                description += 'to be restored.';
+                this._resolveBusyStateFocusRestore =
+                  busyContext.addBusyState({ description: description });
+              }
+            }
             this._addRemoveOjReadOnlyClassOnLabel(document.getElementById(this.options.labelledBy),
               value);
             break;

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

@@ -2974,21 +2974,38 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
     }
   };
 
+  /**
+   * @override
+   */
+  DvtGanttTaskShape.prototype.setClassName = function(className) {
+    DvtGanttTaskShape.superclass.setClassName.call(this, className);
+    // If the task is highlighted, it would have the associated highlight CSS class applied.
+    // However, calls to setClassName blows away the highlight class.
+    // Add the highlight class if that's the case:
+    if (this._isHighlighted) {
+      this.highlight();
+    }
+  };
+
   /**
    * "Highights" the task, i.e. for when selection-behavior is "highlightDependencies".
    */
   DvtGanttTaskShape.prototype.highlight = function()
   {
-    dvt.ToolkitUtils.addClassName(this.getElem(), this._task.getGantt().GetStyleClass('taskHighlight'));
+    // Note this._elem needs to be used instead of this.getElem()
+    // to reference the Path shape element--in touch device, this.getElem() returns
+    // a <g> child group element rather than the shape element.
+    dvt.ToolkitUtils.addClassName(this._elem, this._task.getGantt().GetStyleClass('taskHighlight'));
     this._isHighlighted = true;
   };
 
   /**
-   * "Un-Highights" the task, i.e. for when selection-behavior is "highlightDependencies".
-   */
+  * "Un-Highights" the task, i.e. for when selection-behavior is "highlightDependencies".
+  */
   DvtGanttTaskShape.prototype.unhighlight = function()
   {
-    dvt.ToolkitUtils.removeClassName(this.getElem(), this._task.getGantt().GetStyleClass('taskHighlight'));
+    // See note in hightlight() method regarding this._elem vs this.getElem()
+    dvt.ToolkitUtils.removeClassName(this._elem, this._task.getGantt().GetStyleClass('taskHighlight'));
     this._isHighlighted = false;
   };
 
@@ -5197,22 +5214,6 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
     }
   };
 
-  /**
-   * override
-   */
-  DvtGanttEventManager.prototype.ProcessSelectionEventHelper = function (logicalObj, isMultiSelect) {
-    DvtGanttEventManager.superclass.ProcessSelectionEventHelper.call(this, logicalObj, isMultiSelect);
-
-    // Note that this is handled here because selectionHandler.getSelection() is up-to-date at this point.
-    if (this._gantt.getOptions().selectionBehavior === 'highlightDependencies') {
-      // 'highlightDependencies' behavior: highlight selected tasks and its dependencies,
-      // and dim out all other tasks.
-      var viewport = this._gantt.getViewPort();
-      var dataLayoutManager = this._gantt.getDataLayoutManager();
-      dataLayoutManager.renderViewportDependencyLines(viewport, 'vpc_translate');
-    }
-  };
-
   /**
    * Expands or collapses a row when expand/collapse button is clicked.
    * @param {dvt.BaseEvent} event
@@ -9764,9 +9765,10 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
    * Sets selection state
    * @param {boolean} selected
    * @param {boolean=} enforceDOMLayering Whether to re-layer the DOM, which can be expensive. Defaults to true.
+   * @param {boolean=} isInitial (optional) True if it is an initial selection.
    * @private
    */
-  DvtGanttTaskNode.prototype._setSelected = function(selected, enforceDOMLayering)
+  DvtGanttTaskNode.prototype._setSelected = function(selected, enforceDOMLayering, isInitial)
   {
     this._selected = selected;
 
@@ -9783,10 +9785,9 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
 
     this._gantt.setCurrentRow(this.getRowNode().getId());
 
+    const options = this._gantt.getOptions();
     // Update linear dependency line rendering, because the marker styling depends on task selection state
-    // Note selectionBehavior === 'highlightDependencies' is handled in DvtGanttEventManager.ProcessSelectionEventHelper
-    // because the selectionHandler.getSelection() is not updated yet at this point.
-    if (this._gantt.getOptions().dependencyLineShape === 'straight' && this._gantt.getOptions().selectionBehavior === 'normal') {
+    if (options.dependencyLineShape === 'straight') {
       var dependenciesContainer = this._gantt.getDependenciesContainer();
       var predecessorLines = this.getPredecessorDependencies();
       predecessorLines.forEach(function (line) {
@@ -9797,6 +9798,14 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
         line.render(dependenciesContainer, false);
       });
     }
+
+    // When selection is triggered by user gesture, highlight the relevant dependencies
+    // See also Bug JIRA JET-49382
+    if (!isInitial && options.selectionBehavior === 'highlightDependencies') {
+      var viewport = this._gantt.getViewPort();
+      var dataLayoutManager = this._gantt.getDataLayoutManager();
+      dataLayoutManager.renderViewportDependencyLines(viewport, 'vpc_translate', selected ? this.getLayoutObject() : null);
+    }
   };
 
   /**
@@ -9847,10 +9856,10 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
   /**
    * @override
    */
-  DvtGanttTaskNode.prototype.setSelected = function(selected)
+  DvtGanttTaskNode.prototype.setSelected = function(selected, isInitial)
   {
     // Set selection and ensure proper DOM layering
-    this._setSelected(selected, true);
+    this._setSelected(selected, true, isInitial);
   };
 
   /**
@@ -12584,14 +12593,16 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
 
   /**
    * Based on current task selection, return a set of tasks connected to them
-   * via dependencies.
+   * via dependencies. If targetTaskObj is specified, then that task is ensured to be included in the selection.
    * @param {string} action The action that triggered the viewport change. One of the DvtGanttDataLayoutManager.VPC_X strings.
+   * @param {Object=} targetTaskObj The target selected task. This should only be specified if the target task
+   *    is not in the selectionHandler's current selection (yet), i.e. this rendering is triggered by a task selection gesture
    * @returns {Object} { taskObjs: Array(taskObjs), dependencyObjs: Set(depObjs) }
    * @private
    */
-  DvtGanttDataLayoutManager.prototype._getSelectionDependencies = function (action) {
+  DvtGanttDataLayoutManager.prototype._getSelectionDependencies = function (action, targetTaskObj) {
     var idTaskObjMap = this._createIdObjMap(this._rowObjs, 'taskObjs');
-    var taskObjsSelected = [];
+    var taskObjsSelected;
     if (action === DvtGanttDataLayoutManager.VPC_REFRESH) {
       // If due to (re)-render, selectionHandler.getSelection() is not up to date at this point
       var selection = this._gantt.getOptions()['selection'];
@@ -12599,6 +12610,11 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
     } else {
       taskObjsSelected = this._gantt.getSelectionHandler().getSelection().map(taskNode => taskNode.getLayoutObject());
     }
+    if (targetTaskObj) {
+      // targetTaskObj is specified if this rendering is triggered by a task selection gesture
+      // and so it's not in the selectionHandler's current selection (yet)
+      taskObjsSelected.push(targetTaskObj);
+    }
 
     var visitedTaskObjs = new Set();
     var visitedDependencyObjs = new Set();
@@ -12671,8 +12687,9 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
    * Renders viewport related dependency lines
    * @param {Object} viewport Object describing the viewport, of shape {minRowInd: number, maxRowInd: number, viewStartTime: number, viewEndTime: number}
    * @param {string} action The action that triggered the viewport change. One of the DvtGanttDataLayoutManager.VPC_X strings.
+   * @param {Object=} targetTaskObj The task that got selected by the user that triggered this call (optional)
    */
-   DvtGanttDataLayoutManager.prototype.renderViewportDependencyLines = function (viewport, action) {
+  DvtGanttDataLayoutManager.prototype.renderViewportDependencyLines = function (viewport, action, targetTaskObj) {
     var dependenciesContainer = this._gantt.getDependenciesContainer();
     if (dependenciesContainer) {
       dependenciesContainer.removeChildren();
@@ -12682,7 +12699,7 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-timecomponent', 'ojs/ojtimeax
     if (this._gantt.getOptions()['selectionBehavior'] === 'highlightDependencies') {
       // "highlightDependencies" selection behavior: only dependencies related to the selected tasks are shown
       // and dim all other tasks
-      var selectionDeps = this._getSelectionDependencies(action);
+      var selectionDeps = this._getSelectionDependencies(action, targetTaskObj);
       this.highlightTasks(selectionDeps.taskObjs);
       dependencyObjs = selectionDeps.dependencyObjs;
     } else {

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

@@ -903,6 +903,7 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-axis'], function (exports, dv
         container.setAriaProperty('valuemax', this.Options['max']);
         var value = DvtGaugeRenderer.getFormattedMetricLabel(this.Options['value'], this);
         container.setAriaProperty('valuenow', value);
+        container.setAriaProperty('valuetext', value);
         var tooltip = DvtGaugeRenderer.getTooltipString(this);
 
         if (dvt.Agent.isTouchDevice()) {
@@ -1090,6 +1091,7 @@ define(['exports', 'ojs/ojdvt-toolkit', 'ojs/ojdvt-axis'], function (exports, dv
     UpdateAriaLiveValue(container, value) {
       value = DvtGaugeRenderer.getFormattedMetricLabel(value ? value : this.Options['value'], this);
       container.setAriaProperty('valuenow', value);
+      container.setAriaProperty('valuetext', value);
 
       if (dvt.Agent.isTouchDevice())
         container.setAriaProperty('label', value);

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

@@ -1198,6 +1198,7 @@ var __oj_status_meter_gauge_metadata =
          * @name label
          * @memberof oj.ojLedGauge
          * @instance
+         * @ojdeprecated {since: '12.1.0', description: 'This attribute is deprecated. Use metric-label instead.'}
          * @type {Object=}
          */
         label: {
@@ -1496,6 +1497,7 @@ var __oj_status_meter_gauge_metadata =
          * @name visualEffects
          * @memberof oj.ojLedGauge
          * @instance
+         * @ojdeprecated {since: '12.1.0', description: 'Overlays and gradients are not supported in Redwood theme and are not recommended. As such, this attribute is deprecated.'}
          * @type {string=}
          * @ojvalue {string} "none"
          * @ojvalue {string} "auto"
@@ -2226,6 +2228,7 @@ var __oj_status_meter_gauge_metadata =
          * @name visualEffects
          * @memberof oj.ojRatingGauge
          * @instance
+         * @ojdeprecated {since: '12.1.0', description: 'Overlays and gradients are not supported in Redwood theme and are not recommended. As such, this attribute is deprecated.'}
          * @type {string=}
          * @ojvalue {string} "none"
          * @ojvalue {string} "auto"
@@ -2579,6 +2582,7 @@ var __oj_status_meter_gauge_metadata =
          * @name label
          * @memberof oj.ojStatusMeterGauge
          * @instance
+         * @ojdeprecated {since: '12.1.0', description: 'This attribute is deprecated. Use metric-label instead.'}
          * @type {Object=}
          */
         label: {
@@ -3099,6 +3103,7 @@ var __oj_status_meter_gauge_metadata =
          * @name visualEffects
          * @memberof oj.ojStatusMeterGauge
          * @instance
+         * @ojdeprecated {since: '12.1.0', description: 'Overlays and gradients are not supported in Redwood theme and are not recommended. As such, this attribute is deprecated.'}
          * @type {string=}
          * @ojvalue {string} "none"
          * @ojvalue {string} "auto"

package/dist/js/libs/oj/debug/ojkeyboardfocus-utils.js

@@ -52,13 +52,28 @@ define(['exports', 'jquery', 'ojs/ojcore-base', 'ojs/ojpopupcore', 'ojs/ojdomuti
     return !(element.offsetHeight === 0 || element.offsetWidth === 0);
   };
 
+  /**
+   * @export
+   */
+  const getActionableElementsInNode = function (element) {
+    var actionableElems = [];
+    let nodes = element.querySelectorAll(_ACTIONABLE_ELEMENTS_QUERY);
+    for (var i = 0; i < nodes.length; i++) {
+      var elem = nodes[i];
+      if (!elem.disabled && elem.style.display !== 'none') {
+        actionableElems.push(elem);
+      }
+    }
+    return actionableElems;
+  };
+
   /**
    * @export
    */
   const isActionableElement = function (node) {
     var parentNode = node.parentNode;
     if (parentNode != null) {
-      var nodes = parentNode.querySelectorAll(_ACTIONABLE_ELEMENTS_QUERY);
+      var nodes = getActionableElementsInNode(parentNode);
       for (var i = 0; i < nodes.length; i++) {
         if (nodes[0] === node) {
           return true;
@@ -212,6 +227,7 @@ define(['exports', 'jquery', 'ojs/ojcore-base', 'ojs/ojpopupcore', 'ojs/ojdomuti
   exports.disableAllFocusableElements = disableAllFocusableElements;
   exports.disableElement = disableElement;
   exports.enableAllFocusableElements = enableAllFocusableElements;
+  exports.getActionableElementsInNode = getActionableElementsInNode;
   exports.getFocusableElementsInNode = getFocusableElementsInNode;
   exports.getLogicalChildPopup = getLogicalChildPopup;
   exports.isActionableElement = isActionableElement;

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

@@ -3549,6 +3549,7 @@ define(['jqueryui-amd/widget', 'ojs/ojkoshared', 'ojs/ojcore', 'ojs/ojlogger', '
       this.indexesToDelete = [];
       this.rendering_queued = false;
       this.pendingDeletes = [];
+      this._noDataNodes = null;
       ko.virtualElements.emptyNode(this.element);
       if (changedData.fetchFirst) {
         // refetch data and recreate the child nodes

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

@@ -95,7 +95,7 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
         for (var i = 0; i < this._displayables.length; i++) {
           this._displayables[i].setCursor(dvt.SelectionEffectUtils.getSelectingCursor());
         }
-      } 
+      }
     }
 
 
@@ -240,7 +240,7 @@ define(['exports', 'ojs/ojdvt-toolkit'], function (exports, dvt) { 'use strict';
         return this;
 
       var navigables = this._legend.__getKeyboardObjects();
-      return dvt.KeyboardHandler.getNextNavigable(this, event, navigables, true, this._legend);
+      return dvt.KeyboardHandler.getNextNavigable(this, event, navigables, true, this._legend, true);
     };
 
 

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

@@ -800,8 +800,8 @@ var __oj_legend_section_metadata =
          * @ojshortdesc Specifies whether drilling is enabled. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click. See the Help documentation for more information.
          * @instance
          * @type {string=}
-         * @ojvalue {string} "on"
-         * @ojvalue {string} "off"
+         * @ojvalue {string} "on" Legend items will be drillable.
+         * @ojvalue {string} "off" Legend items will not be drillable.
          * @default "off"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">drilling</code> attribute specified:</caption>
@@ -837,9 +837,9 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "center"
-         * @ojvalue {string} "end"
-         * @ojvalue {string} "start"
+         * @ojvalue {string} "center" Legend contents will be center aligned.
+         * @ojvalue {string} "end" Legend contents will be end aligned.
+         * @ojvalue {string} "start" Legend contents will be start aligned.
          * @default "start"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">halign</code> attribute specified:</caption>
@@ -887,8 +887,8 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "on"
-         * @ojvalue {string} "off"
+         * @ojvalue {string} "on" Legend can be used to initiate hide and show behavior on referenced data items.
+         * @ojvalue {string} "off" legend cannot be used to initiate hide and show behavior on referenced data items
          * @default "off"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">hide-and-show-behavior</code> attribute specified:</caption>
@@ -935,8 +935,8 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "dim"
-         * @ojvalue {string} "none"
+         * @ojvalue {string} "dim" Dimming hover behavior is applied.
+         * @ojvalue {string} "none" No hover behavior will be applied.
          * @default "none"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">hover-behavior</code> attribute specified:</caption>
@@ -982,8 +982,8 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "horizontal"
-         * @ojvalue {string} "vertical"
+         * @ojvalue {string} "horizontal" Legend items will be horizontally placed in available space.
+         * @ojvalue {string} "vertical" Legend items will be vertically stacked.
          * @default "vertical"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">orientation</code> attribute specified:</caption>
@@ -1005,9 +1005,10 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "off"
-         * @ojvalue {string} "asNeeded"
+         * @ojvalue {string} "off" The legend will not be scrollable.
+         * @ojvalue {string} "asNeeded" The legend will be scrollable if legend items cannot fit in the available space.
          * @default "asNeeded"
+         * @ojdeprecated {since: '12.1.0', description: 'Setting scrolling to off is not supported in Redwood theme and it is not recommended. As such, this attribute is deprecated.'}
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">scrolling</code> attribute specified:</caption>
          * &lt;oj-legend scrolling="off">&lt;/oj-legend>
@@ -1141,9 +1142,9 @@ var __oj_legend_section_metadata =
          * @memberof oj.ojLegend
          * @instance
          * @type {string=}
-         * @ojvalue {string} "middle"
-         * @ojvalue {string} "bottom"
-         * @ojvalue {string} "top"
+         * @ojvalue {string} "middle" The legend items will be middle aligned.
+         * @ojvalue {string} "bottom" The legend items will be bottom aligned.
+         * @ojvalue {string} "top" The legend items will be top aligned.
          * @default "top"
          *
          * @example <caption>Initialize the Legend with the <code class="prettyprint">valign</code> attribute specified:</caption>
@@ -1576,10 +1577,10 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendItem
    * @instance
    * @type {string=}
-   * @ojvalue {string} "line"
-   * @ojvalue {string} "lineWithMarker"
-   * @ojvalue {string} "image"
-   * @ojvalue {string} "marker"
+   * @ojvalue {string} "line" The legend symbol will be a line.
+   * @ojvalue {string} "lineWithMarker" The legend symbol will be a line and a marker.
+   * @ojvalue {string} "image" The legend symbol will be an image.
+   * @ojvalue {string} "marker" The legend symbol will be a marker.
    * @default "marker"
    */
   /**
@@ -1617,19 +1618,19 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendItem
    * @instance
    * @type {string=}
-   * @ojvalue {string} "smallChecker"
-   * @ojvalue {string} "smallCrosshatch"
-   * @ojvalue {string} "smallDiagonalLeft"
-   * @ojvalue {string} "smallDiagonalRight"
-   * @ojvalue {string} "smallDiamond"
-   * @ojvalue {string} "smallTriangle"
-   * @ojvalue {string} "largeChecker"
-   * @ojvalue {string} "largeCrosshatch"
-   * @ojvalue {string} "largeDiagonalLeft"
-   * @ojvalue {string} "largeDiagonalRight"
-   * @ojvalue {string} "largeDiamond"
-   * @ojvalue {string} "largeTriangle"
-   * @ojvalue {string} "none"
+   * @ojvalue {string} "smallChecker" Small checker pattern is applied to the data item.
+   * @ojvalue {string} "smallCrosshatch" Small cross hatch pattern is applied to the data item.
+   * @ojvalue {string} "smallDiagonalLeft" Small diagonal left pattern is applied to the data item.
+   * @ojvalue {string} "smallDiagonalRight" Small diagonal right pattern is applied to the data item.
+   * @ojvalue {string} "smallDiamond" Small diamond pattern is applied to the data item.
+   * @ojvalue {string} "smallTriangle" Small triangle pattern is applied to the data item.
+   * @ojvalue {string} "largeChecker" Large checker pattern is applied to the data item.
+   * @ojvalue {string} "largeCrosshatch" Large cross hatch pattern is applied to the data item.
+   * @ojvalue {string} "largeDiagonalLeft" Large diagonal left pattern is applied to the data item.
+   * @ojvalue {string} "largeDiagonalRight" Large diagonal right pattern is applied to the data item.
+   * @ojvalue {string} "largeDiamond" Large diamond pattern is applied to the data item.
+   * @ojvalue {string} "largeTriangle" Large triangle pattern is applied to the data item.
+   * @ojvalue {string} "none" No pattern is applied to data item fill.
    * @default "none"
    */
   /**
@@ -1639,9 +1640,9 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendItem
    * @instance
    * @type {string=}
-   * @ojvalue {string} "dotted"
-   * @ojvalue {string} "dashed"
-   * @ojvalue {string} "solid"
+   * @ojvalue {string} "dotted" Line will have dotted strokes.
+   * @ojvalue {string} "dashed" Line will have dashed strokes.
+   * @ojvalue {string} "solid" Line will have a solid stroke.
    * @default "solid"
    */
   /**
@@ -1722,8 +1723,8 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendItem
    * @instance
    * @type {string=}
-   * @ojvalue {string} "hidden"
-   * @ojvalue {string} "visible"
+   * @ojvalue {string} "hidden" Legend item will have a hollow symbol.
+   * @ojvalue {string} "visible" Legend item will be filled.
    * @default "visible"
    */
   /**
@@ -1734,9 +1735,9 @@ var __oj_legend_section_metadata =
    * @ojshortdesc Specifies whether drilling is enabled on the legend item. See the Help documentation for more information.
    * @instance
    * @type {string=}
-   * @ojvalue {string} "on"
-   * @ojvalue {string} "off"
-   * @ojvalue {string} "inherit"
+   * @ojvalue {string} "on" The legend item will be drillable.
+   * @ojvalue {string} "off" The legend item will not be drillable.
+   * @ojvalue {string} "inherit" The drilling behavior is inherited from legend.
    * @default "inherit"
    */
   /**
@@ -1798,9 +1799,9 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendSection
    * @instance
    * @type {string=}
-   * @ojvalue {string} "center"
-   * @ojvalue {string} "end"
-   * @ojvalue {string} "start"
+   * @ojvalue {string} "center" The section title will be center aligned.
+   * @ojvalue {string} "end" The section title will be end aligned.
+   * @ojvalue {string} "start" The section title will be start aligned.
    * @default "start"
    */
   /**
@@ -1821,8 +1822,8 @@ var __oj_legend_section_metadata =
    * @memberof! oj.ojLegendSection
    * @instance
    * @type {string=}
-   * @ojvalue {string} "on"
-   * @ojvalue {string} "off"
+   * @ojvalue {string} "on" The legend section will be collapsible.
+   * @ojvalue {string} "off" The legend section will not be collapsible.
    * @default "off"
    */