Release 8.2.0

README.md

@@ -1,4 +1,4 @@
-# Oracle JET version 8.1.0
+# Oracle JET version 8.2.0
 
 ## About Oracle JET
 Oracle JET is targeted at intermediate to advanced JavaScript developers working on client-side applications. It's a collection of open source JavaScript libraries along with a set of Oracle contributed JavaScript libraries that make it as simple and efficient as possible to build applications that consume and interact with Oracle products and services, especially Oracle Cloud services.
@@ -34,13 +34,13 @@ npm install -g @oracle/ojet-cli
 
 ojet create <app name>
 ```
-See the [Oracle JET Developer Guide](http://www.oracle.com/pls/topic/lookup?ctx=jet810&id=homepage) for complete installation details, including prerequisites.
+See the [Oracle JET Developer Guide](http://www.oracle.com/pls/topic/lookup?ctx=jet820&id=homepage) for complete installation details, including prerequisites.
 
 ## Related GitHub Projects
 All related projects on GitHub are associated under the [oracle-jet topic](https://github.com/search?q=topic%3Aoracle-jet+org%3Aoracle&type=Repositories).
 
-## [Documentation](http://www.oracle.com/pls/topic/lookup?ctx=jet810&id=homepage)
-Oracle JET comes with a full [Developers Guide](http://www.oracle.com/pls/topic/lookup?ctx=jet810&id=homepage) to help with Getting Started and many common issues.
+## [Documentation](http://www.oracle.com/pls/topic/lookup?ctx=jet820&id=homepage)
+Oracle JET comes with a full [Developers Guide](http://www.oracle.com/pls/topic/lookup?ctx=jet820&id=homepage) to help with Getting Started and many common issues.
 
 ## [Contributing](https://github.com/oracle/oraclejet/blob/master/CONTRIBUTING.md)
 Oracle JET is an open source project. Pull Requests are currently not being accepted. See 

THIRDPARTYLICENSE.txt

@@ -26,20 +26,20 @@ js/libs/jquery/jqueryui-amd-1.12.1/sortable.js           MIT
 js/libs/jquery/jqueryui-amd-1.12.1/widget.js             MIT
 js/libs/knockout/knockout-3.5.0.js                      MIT
 js/libs/knockout/knockout-mapping-latest.js                             MIT
-js/libs/oj/v8.1.0/min/ojcspexpressionevaluator.js (cspexpressionevaluator.js)   MIT
-js/libs/oj/v8.1.0/min/ojexpparser.js (expparser.js)              MIT
-js/libs/oj/v8.1.0/min/ojknockout.js (knockout-fast-foreach.js)   MIT
-js/libs/oj/v8.1.0/min/ojselectcombobox.js (Select2.js)           Apache 2.0
-js/libs/oj/v8.1.0/min/ojtree.js (jsTree.js)                      MIT
-js/libs/oj/v8.1.0/ojL10n.js (requireJS i18n)                     MIT
+js/libs/oj/v8.2.0/min/ojcspexpressionevaluator.js (cspexpressionevaluator.js)   MIT
+js/libs/oj/v8.2.0/min/ojexpparser.js (expparser.js)              MIT
+js/libs/oj/v8.2.0/min/ojknockout.js (knockout-fast-foreach.js)   MIT
+js/libs/oj/v8.2.0/min/ojselectcombobox.js (Select2.js)           Apache 2.0
+js/libs/oj/v8.2.0/min/ojtree.js (jsTree.js)                      MIT
+js/libs/oj/v8.2.0/ojL10n.js (requireJS i18n)                     MIT
 js/libs/proj4js/dist/proj4.js                                                   Proj4js
 js/libs/require/require.js                                                    MIT
 js/libs/require/text.js                                                    MIT
 js/libs/require-css/css.min.js (require-css)                                MIT
 js/libs/webcomponents/custom-elements.min.js                            custom-elements
-scss/oj/v8.1.0/3rdparty/normalize/normalize.scss                 MIT
+scss/oj/v8.2.0/3rdparty/normalize/normalize.scss                 MIT
 js/libs/touchr/touchr.js                                                  MIT
-js/libs/oj/v8.1.0/min/ojvcomponent.js (petit-dom.js)             MIT
+js/libs/oj/v8.2.0/min/ojvcomponent.js (petit-dom.js)             MIT
 
 /*
  * expression-eval - v2.0.0

dist/css/alta-android/oj-alta.css

@@ -12206,6 +12206,9 @@ html .oj-form-control {
   min-width: 1em;
   height: 100%; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
        100%. Otherwise some components like input text, whose max-width is decided by 
        oj-text-field-lg-max-width looks so different from other components like radioset
@@ -12234,7 +12237,7 @@ html .oj-form-control {
 
 /* consolidating styles - start
     */
-.oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+.oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
   display: inline-block;
   font-size: 1rem;
   /* use a width of 100% and then max and min width so that when 
@@ -12245,7 +12248,7 @@ html .oj-form-control {
   width: 100%;
   box-sizing: border-box; }
   @media screen and (max-width: 767.9px) {
-    .oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+    .oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
       -webkit-text-size-adjust: 100%; } }
 
 .oj-form-control-full-width.oj-text-field,
@@ -13700,7 +13703,8 @@ oj-calendar:not(.oj-complete) {
       -webkit-text-size-adjust: 100%; } }
 
 .oj-inputdatetime-inline {
-  display: inline-block; }
+  display: inline-block;
+  max-width: 277px; }
 
 .oj-form-control-full-width.oj-inputdatetime,
 .oj-form-control-full-width.oj-inputdatetime-date-time,

dist/css/alta-ios/oj-alta.css

@@ -12241,6 +12241,9 @@ html .oj-form-control {
   min-width: 1em;
   height: 100%; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
        100%. Otherwise some components like input text, whose max-width is decided by 
        oj-text-field-lg-max-width looks so different from other components like radioset
@@ -12269,7 +12272,7 @@ html .oj-form-control {
 
 /* consolidating styles - start
     */
-.oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+.oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
   display: inline-block;
   font-size: 1.0625rem;
   /* use a width of 100% and then max and min width so that when 
@@ -12280,7 +12283,7 @@ html .oj-form-control {
   width: 100%;
   box-sizing: border-box; }
   @media screen and (max-width: 767.9px) {
-    .oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+    .oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
       -webkit-text-size-adjust: 100%; } }
 
 .oj-form-control-full-width.oj-text-field,
@@ -13735,7 +13738,8 @@ oj-calendar:not(.oj-complete) {
       -webkit-text-size-adjust: 100%; } }
 
 .oj-inputdatetime-inline {
-  display: inline-block; }
+  display: inline-block;
+  max-width: 277px; }
 
 .oj-form-control-full-width.oj-inputdatetime,
 .oj-form-control-full-width.oj-inputdatetime-date-time,

dist/css/alta-windows/oj-alta.css

@@ -12222,6 +12222,9 @@ html .oj-form-control {
   min-width: 1em;
   height: 100%; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
        100%. Otherwise some components like input text, whose max-width is decided by 
        oj-text-field-lg-max-width looks so different from other components like radioset
@@ -12250,7 +12253,7 @@ html .oj-form-control {
 
 /* consolidating styles - start
     */
-.oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+.oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
   display: inline-block;
   font-size: 1rem;
   /* use a width of 100% and then max and min width so that when 
@@ -12261,7 +12264,7 @@ html .oj-form-control {
   width: 100%;
   box-sizing: border-box; }
   @media screen and (max-width: 767.9px) {
-    .oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+    .oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
       -webkit-text-size-adjust: 107%; } }
 
 .oj-form-control-full-width.oj-text-field,
@@ -13666,7 +13669,8 @@ oj-calendar:not(.oj-complete) {
       -webkit-text-size-adjust: 107%; } }
 
 .oj-inputdatetime-inline {
-  display: inline-block; }
+  display: inline-block;
+  max-width: 277px; }
 
 .oj-form-control-full-width.oj-inputdatetime,
 .oj-form-control-full-width.oj-inputdatetime-date-time,

dist/css/alta/oj-alta-notag.css

@@ -11933,6 +11933,9 @@ html .oj-form-control {
   min-width: 1em;
   height: 100%; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
        100%. Otherwise some components like input text, whose max-width is decided by 
        oj-text-field-lg-max-width looks so different from other components like radioset
@@ -11961,7 +11964,7 @@ html .oj-form-control {
 
 /* consolidating styles - start
     */
-.oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+.oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
   display: inline-block;
   font-size: 1rem;
   /* use a width of 100% and then max and min width so that when 
@@ -11972,7 +11975,7 @@ html .oj-form-control {
   width: 100%;
   box-sizing: border-box; }
   @media screen and (max-width: 767.9px) {
-    .oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+    .oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
       -webkit-text-size-adjust: 115%; } }
 
 .oj-form-control-full-width.oj-text-field,
@@ -13414,7 +13417,8 @@ oj-calendar:not(.oj-complete) {
       -webkit-text-size-adjust: 115%; } }
 
 .oj-inputdatetime-inline {
-  display: inline-block; }
+  display: inline-block;
+  max-width: 277px; }
 
 .oj-form-control-full-width.oj-inputdatetime,
 .oj-form-control-full-width.oj-inputdatetime-date-time,

dist/css/alta/oj-alta.css

@@ -12321,6 +12321,9 @@ html .oj-form-control {
   min-width: 1em;
   height: 100%; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
        100%. Otherwise some components like input text, whose max-width is decided by 
        oj-text-field-lg-max-width looks so different from other components like radioset
@@ -12349,7 +12352,7 @@ html .oj-form-control {
 
 /* consolidating styles - start
     */
-.oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+.oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
   display: inline-block;
   font-size: 1rem;
   /* use a width of 100% and then max and min width so that when 
@@ -12360,7 +12363,7 @@ html .oj-form-control {
   width: 100%;
   box-sizing: border-box; }
   @media screen and (max-width: 767.9px) {
-    .oj-text-field:not(oj-select-one):not(oj-select-many):not(oj-combobox-one):not(oj-combobox-many) {
+    .oj-inputtext, .oj-inputpassword, .oj-textarea, .oj-inputnumber, .oj-inputdatetime, .oj-searchselect {
       -webkit-text-size-adjust: 115%; } }
 
 .oj-form-control-full-width.oj-text-field,
@@ -13787,7 +13790,8 @@ oj-calendar:not(.oj-complete) {
       -webkit-text-size-adjust: 115%; } }
 
 .oj-inputdatetime-inline {
-  display: inline-block; }
+  display: inline-block;
+  max-width: 277px; }
 
 .oj-form-control-full-width.oj-inputdatetime,
 .oj-form-control-full-width.oj-inputdatetime-date-time,

dist/css/redwood/oj-redwood-cssvars.css

@@ -8453,6 +8453,9 @@ html .oj-form-control {
   width: 1em;
   min-width: 1em; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
       100%. Otherwise some components like input text, whose max-width is decided by
       oj-text-field-lg-max-width looks so different from other components like radioset

dist/css/redwood/oj-redwood.css

@@ -7539,6 +7539,9 @@ html .oj-form-control {
   width: 1em;
   min-width: 1em; }
 
+.oj-form-control-inherit:not(.oj-form-control-default) .oj-text-field-middle {
+  width: 100%; }
+
 /* when the label is inside or above, we must set the max-width of the component to
       100%. Otherwise some components like input text, whose max-width is decided by
       oj-text-field-lg-max-width looks so different from other components like radioset

dist/js/libs/oj/debug/internal-deps/dvt/DvtChart.js

@@ -3700,12 +3700,13 @@ DvtChartObjPeer.prototype._findNextNavigable = function(event) {
  * @private
  */
 DvtChartObjPeer.prototype._findNextUpSeries = function(chart, seriesIndex, groupIndex) {
+  var isStacked = DvtChartTypeUtils.isStacked(chart);
   var seriesCount = DvtChartDataUtils.getSeriesCount(chart);
   var currentValue = DvtChartDataUtils.getCumulativeValue(chart, seriesIndex, groupIndex);
   var nextValue = null;
   var nextSeriesIndex = null;
   for (var i = 0; i < seriesCount; i++) {
-    if (!DvtChartStyleUtils.isSeriesRendered(chart, i) || DvtChartDataUtils.getValue(chart, i, groupIndex) == null)
+    if (!DvtChartStyleUtils.isSeriesRendered(chart, i) || DvtChartDataUtils.getValue(chart, i, groupIndex) == null || (isStacked && chart.getObject(i, groupIndex) == null))
       continue;
     var itemValue = DvtChartDataUtils.getCumulativeValue(chart, i, groupIndex);
     if (itemValue > currentValue || (itemValue == currentValue && i > seriesIndex)) {
@@ -3728,12 +3729,13 @@ DvtChartObjPeer.prototype._findNextUpSeries = function(chart, seriesIndex, group
  * @private
  */
 DvtChartObjPeer.prototype._findNextDownSeries = function(chart, seriesIndex, groupIndex) {
+  var isStacked = DvtChartTypeUtils.isStacked(chart);
   var seriesCount = DvtChartDataUtils.getSeriesCount(chart);
   var currentValue = DvtChartDataUtils.getCumulativeValue(chart, seriesIndex, groupIndex);
   var nextValue = null;
   var nextSeriesIndex = null;
   for (var i = seriesCount - 1; i >= 0; i--) {
-    if (!DvtChartStyleUtils.isSeriesRendered(chart, i) || DvtChartDataUtils.getValue(chart, i, groupIndex) == null)
+    if (!DvtChartStyleUtils.isSeriesRendered(chart, i) || DvtChartDataUtils.getValue(chart, i, groupIndex) == null || (isStacked && chart.getObject(i, groupIndex) == null))
       continue;
     var itemValue = DvtChartDataUtils.getCumulativeValue(chart, i, groupIndex);
     if (itemValue < currentValue || (itemValue == currentValue && i < seriesIndex)) {
@@ -4115,7 +4117,7 @@ DvtChartDefaults.getGapHeight = function(chart, defaultHeight) {
  * @override
  */
 DvtChartDefaults.prototype.getNoCloneObject = function(chart) {
-  return {series: {items: {_itemData: true}}};
+  return {series: {items: {_itemData: true}}, data: true};
 };
 
 /**
@@ -12248,6 +12250,7 @@ dvt.Obj.createSubclass(DvtChartOverview, dvt.Overview);
  * @private
  */
 DvtChartOverview.prototype._renderChart = function(options, width, height) {
+  var noCloneOptions = this._parentChart.Defaults.getNoCloneObject();
   this._chartContainer = new dvt.Container(this.getCtx());
   this.addChild(this._chartContainer);
 
@@ -12269,7 +12272,7 @@ DvtChartOverview.prototype._renderChart = function(options, width, height) {
     'layout': {'outerGapWidth': 0, 'outerGapHeight': 0},
     '_isOverview': true
   };
-  options = dvt.JsonUtils.merge(defaultOptions, options);
+  options = dvt.JsonUtils.merge(defaultOptions, options, noCloneOptions);
 
   if (DvtChartAxisUtils.hasGroupAxis(this._parentChart))
     options['xAxis']['tickLabel']['rendered'] = 'off';
@@ -12281,7 +12284,7 @@ DvtChartOverview.prototype._renderChart = function(options, width, height) {
 
   // Set the user options override
   var userOptions = this._parentChart.getOptions()['overview']['content'];
-  options = dvt.JsonUtils.merge(userOptions, options);
+  options = dvt.JsonUtils.merge(userOptions, options, noCloneOptions);
   var isYAxisRendered = options.yAxis.rendered === "on";
   var isY2AxisRendered = options.y2Axis.rendered === "on";
 
@@ -12333,7 +12336,7 @@ DvtChartOverview.prototype._renderChart = function(options, width, height) {
  */
 DvtChartOverview.prototype.render = function(options, width, height) {
   // override styles
-  options['style'] = {
+  options.overview.style = {
     'overviewBackgroundColor': 'rgba(0,0,0,0)',
     'windowBackgroundColor': 'rgba(0,0,0,0)',
     'windowBorderTopColor': '#333333',
@@ -12347,12 +12350,12 @@ DvtChartOverview.prototype.render = function(options, width, height) {
     'handleHeight': 15,
     'handleFillColor': 'rgba(0,0,0,0)'
   };
-  options['animationOnClick'] = 'off';
+  options.overview.animationOnClick = 'off';
 
-  var windowDims = this._renderChart(options['chart'], width, height);
+  var windowDims = this._renderChart(options.chart, width, height);
 
   // now call super to render the scrollbar
-  DvtChartOverview.superclass.render.call(this, options, windowDims.w, windowDims.h);
+  DvtChartOverview.superclass.render.call(this, options.overview, windowDims.w, windowDims.h);
 };
 
 /**
@@ -27037,13 +27040,16 @@ DvtChartRenderer._renderScrollbars = function(chart, horizScrollbarDim, vertScro
 
   // Render x-axis overview scrollbar
   if (chart.overview) {
+    var noCloneOptions = chart.Defaults.getNoCloneObject();
     var ovOptions = {
-      'xMin': chart.xAxis.getLinearGlobalMin(),
-      'xMax': chart.xAxis.getLinearGlobalMax(),
-      'x1': chart.xAxis.getLinearViewportMin(),
-      'x2': chart.xAxis.getLinearViewportMax(),
-      'minimumWindowSize': chart.xAxis.getInfo().getMinimumExtent(),
-      'chart': dvt.JsonUtils.clone(options)
+      'overview': {
+        'xMin': chart.xAxis.getLinearGlobalMin(),
+        'xMax': chart.xAxis.getLinearGlobalMax(),
+        'x1': chart.xAxis.getLinearViewportMin(),
+        'x2': chart.xAxis.getLinearViewportMax(),
+        'minimumWindowSize': chart.xAxis.getInfo().getMinimumExtent()
+      },
+      'chart': dvt.JsonUtils.clone(options, null, noCloneOptions)
     };
 
     if (!DvtChartEventUtils.isZoomable(chart))
@@ -30340,7 +30346,8 @@ DvtChartPlotAreaRenderer._filterPointsForSeries = function(chart, seriesIndex) {
   if (DvtChartTypeUtils.isPolar(chart) || DvtChartStyleUtils.isRangeSeries(chart, seriesIndex))
     return;
 
-  var maxNumPts = chart.__getPlotAreaSpace().w; // one point per pixel
+  var plotAreaDims = chart.__getPlotAreaSpace();
+  var maxNumPts = DvtChartTypeUtils.isHorizontal(chart) ? plotAreaDims.h : plotAreaDims.w; // one point per pixel
   var seriesItems = DvtChartDataUtils.getSeriesItem(chart, seriesIndex)['items'];
   var isBar = DvtChartStyleUtils.getSeriesType(chart, seriesIndex) == 'bar';
   var axisInfo = chart.xAxis.getInfo();