highcharts 9.2.2 → 9.3.0

package/README.md

@@ -1,10 +1,14 @@
-Highcharts is a JavaScript charting library based on SVG, with fallbacks to VML and canvas for old browsers. This package also contains Highstock, the financial charting package, and Highmaps for geo maps.
+Highcharts is a JavaScript charting library based on SVG rendering. This project includes Stock, the financial charting package, the Maps package for geo maps and the Gantt package.
 
-This package is intended for supporting client-side JavaScript charting through bundlers like Parcel or Webpack and environments like Babel or TypeScript. If you indend to generate static charts on the server side, use the [Highcharts node.js Export Server](https://www.npmjs.com/package/highcharts-export-server) instead.
+This package is intended for supporting client-side JavaScript charting through bundlers like Parcel or Webpack and environments like Babel or TypeScript. If you intend to generate static charts on the server side, use the [Highcharts node.js Export Server](https://www.npmjs.com/package/highcharts-export-server) instead.
 
+### License
+Please note that commercial use of Highcharts requires a commercial license. For testing and demonstration purposes (POC), Highcharts can be used free of charge. Non-profit organisations, schools and personal websites are qualified for the free license. Read more about licenses [in the Highcharts shop](https://shop.highsoft.com/?utm_source=npmjs&utm_medium=referral&utm_campaign=highchartspage&utm_content=licenseinfo).
+
+### Links
 * Official website: [www.highcharts.com](http://www.highcharts.com)
 * Download page: [www.highcharts.com/download](http://www.highcharts.com/download)
-* Licensing: [www.highcharts.com/license](http://www.highcharts.com/license)
+* License: [www.highcharts.com/license](http://www.highcharts.com/license)
 * Support: [www.highcharts.com/support](http://www.highcharts.com/support)
 * Issues: [Working repo](https://github.com/highcharts/highcharts/issues)
 
@@ -43,7 +47,8 @@ Highcharts is using an UMD module pattern, as a result it has support for Common
 ```js
 // Load Highcharts
 var Highcharts = require('highcharts');
-// Alternatively, this is how to load Highstock. Highmaps is similar.
+// Alternatively, this is how to load Highcharts Stock. The Maps and Gantt
+// packages are similar.
 // var Highcharts = require('highcharts/highstock');
 
 // Load the exporting module, and initialize it.
@@ -61,7 +66,8 @@ Since Highcharts supports CommonJS, it can be loaded as an ES6 module with the u
 ### Babel
 ```js
 import Highcharts from 'highcharts';
-// Alternatively, this is how to load Highstock. Highmaps is similar.
+// Alternatively, this is how to load Highcharts Stock. The Maps and Gantt
+// packages are similar.
 // import Highcharts from 'highcharts/highstock';
 
 // Load the exporting module.
@@ -77,7 +83,8 @@ Highcharts.chart('container', {
 ### TypeScript
 ```js
 import * as Highcharts from 'highcharts';
-// Alternatively, this is how to load Highstock. Highmaps is similar.
+// Alternatively, this is how to load Highcharts Stock. The Maps and Gantt
+// packages are similar.
 // import Highcharts from 'highcharts/highstock';
 
 // Load the exporting module.

package/bower.json

@@ -1,6 +1,6 @@
 {
   "name": "highcharts",
-  "version": "9.2.2",
+  "version": "9.3.0",
   "main": "highcharts.js",
   "license": "https://www.highcharts.com/license",
   "types": "highcharts.d.ts"

package/css/annotations/popup.css

@@ -19,8 +19,9 @@
 }
 
 .highcharts-popup {
+  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
   background-color: #fff;
-  color: #666;
+  color: #666666;
   display: none;
   font-size: 0.876em;
   max-height: 90%;
@@ -52,6 +53,7 @@
 
 .highcharts-popup input {
   border: 1px solid #e6e6e6;
+  border-radius: 0.3rem;
   padding: 5px;
   width: 100%;
 }
@@ -108,8 +110,8 @@
 .highcharts-bindings-wrapper ul.highcharts-indicator-list,
 .highcharts-indicator-list {
   float: left;
-  color: #666;
-  height: calc(100% - 70px);
+  color: #666666;
+  height: calc(100% - 150px);
   width: 100%;
   overflow-x: hidden;
   margin: 0px;
@@ -128,7 +130,7 @@
 }
 
 .highcharts-indicator-list li:hover {
-  background-color: #e6ebf5;
+  background-color: #e6e6e6;
 }
 
 .highcharts-tab-item {
@@ -142,7 +144,7 @@
 }
 
 .highcharts-tab-item.highcharts-tab-item-active {
-  background-color: #e6ebf5;
+  background-color: #e6e6e6;
 }
 
 .highcharts-tab-item-content {
@@ -175,14 +177,15 @@
 .highcharts-popup button:hover,
 .highcharts-popup button.highcharts-annotation-edit-button:hover,
 .highcharts-popup button.highcharts-annotation-remove-button:hover {
-  background-color: #e6ebf5;
+  background-color: #e6e6e6;
+  cursor: pointer;
 }
 
 .highcharts-popup button {
   float: right;
   border: none;
   background: #f7f7f7;
-  color: #666;
+  color: #666666;
   margin-left: 5px;
   margin-top: 12px;
 }
@@ -192,7 +195,7 @@
 }
 
 .highcharts-tab-disabled {
-  color: #ccc;
+  color: #cccccc;
 }
 
 /* annotation edit small popup */
@@ -234,3 +237,40 @@
   float: left;
   padding-bottom: 15px;
 }
+
+.highcharts-input-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  flex-wrap: wrap;
+}
+
+.highcharts-input-search-indicators-label {
+  text-align: center;
+  font-weight: bold;
+  color: #000000;
+  margin-top: 0.5rem;
+}
+
+input.highcharts-input-search-indicators {
+  width: 80%;
+  margin: 0 auto;
+  float: none;
+  border-color: #949494;
+}
+
+.highcharts-popup a.clear-filter-button {
+  margin: 0 auto;
+  display: none;
+  color: #335cad;
+  background-color: #fff;
+  border: 1px solid #335cad;
+  margin-top: 10px;
+}
+
+.highcharts-popup a.clear-filter-button:hover {
+  color: #fff;
+  background-color: #335cad;
+  cursor: pointer;
+}

package/css/annotations/popup.scss

@@ -1,6 +1,14 @@
-// Colors for buttons.
-$button-background-color: #f7f7f7;
-$button-hover-color: #e6ebf5;
+// Colors, using same names and values as in highcharts.scss
+$background-color: #fff;
+
+$neutral-color-100: #000000;
+$neutral-color-80: #333333;
+$neutral-color-60: #666666;
+$neutral-color-20: #cccccc;
+$neutral-color-10: #e6e6e6;
+$neutral-color-3: #f7f7f7;
+
+$highlight-color-80: #335cad;
 
 
 .highcharts-popup.highcharts-annotation-toolbar {
@@ -25,8 +33,9 @@ $button-hover-color: #e6ebf5;
 
 
 .highcharts-popup {
-  background-color: #fff;
-  color: #666;
+  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
+  background-color: $background-color;
+  color: $neutral-color-60;
   display: none;
   font-size: 0.876em;
   max-height: 90%;
@@ -57,7 +66,8 @@ $button-hover-color: #e6ebf5;
 }
 
 .highcharts-popup input {
-  border: 1px solid #e6e6e6;
+  border: 1px solid $neutral-color-10;
+  border-radius: 0.3rem;
   padding: 5px;
   width: 100%;
 }
@@ -68,7 +78,7 @@ $button-hover-color: #e6ebf5;
   overflow-y: auto;
 }
 
-.highcharts-popup-lhs-col.highcharts-popup-lhs-full { 
+.highcharts-popup-lhs-col.highcharts-popup-lhs-full {
   width: 100%;
   overflow-x: hidden;
   height: calc(100% - 104px);
@@ -84,7 +94,7 @@ $button-hover-color: #e6ebf5;
 .highcharts-popup-lhs-col {
   clear: both;
   width: 30%;
-  border-right: 1px solid #e6e6e6;
+  border-right: 1px solid $neutral-color-10;
 }
 
 .highcharts-popup-bottom-row {
@@ -92,7 +102,7 @@ $button-hover-color: #e6ebf5;
   padding: 0px 20px;
   padding-bottom: 12px;
   width: 100%;
-  border-top: 1px solid #e6e6e6;
+  border-top: 1px solid $neutral-color-10;
 }
 
 .highcharts-popup-rhs-col {
@@ -114,8 +124,8 @@ $button-hover-color: #e6ebf5;
 .highcharts-bindings-wrapper ul.highcharts-indicator-list,
 .highcharts-indicator-list {
   float: left;
-  color: #666;
-  height: calc(100% - 70px);
+  color: $neutral-color-60;
+  height: calc(100% - 150px);
   width: 100%;
   overflow-x: hidden;
   margin: 0px;
@@ -134,11 +144,11 @@ $button-hover-color: #e6ebf5;
 }
 
 .highcharts-indicator-list li:hover {
-  background-color: $button-hover-color;
+  background-color: $neutral-color-10;
 }
 
 .highcharts-tab-item {
-  background-color: $button-background-color;
+  background-color: $neutral-color-3;
   cursor: pointer;
   display: block;
   float:left;
@@ -148,16 +158,16 @@ $button-hover-color: #e6ebf5;
 }
 
 .highcharts-tab-item.highcharts-tab-item-active {
-  background-color: $button-hover-color;
+  background-color: $neutral-color-10;
 }
 
 .highcharts-tab-item-content {
-  display: none; 
+  display: none;
   float: left;
   height: 100%;
   overflow: hidden;
   width: 100%;
-  border-top: 1px solid #e6e6e6;
+  border-top: 1px solid $neutral-color-10;
 }
 
 .highcharts-tab-item-show {
@@ -174,21 +184,22 @@ $button-hover-color: #e6ebf5;
   padding: 10px;
   top: 0%;
   right: 0%;
-  color: #333333;
+  color: $neutral-color-80;
 }
 
 .highcharts-popup-close:hover,
 .highcharts-popup button:hover,
 .highcharts-popup button.highcharts-annotation-edit-button:hover,
 .highcharts-popup button.highcharts-annotation-remove-button:hover {
-  background-color: $button-hover-color;
+  background-color: $neutral-color-10;
+  cursor: pointer;
 }
 
 .highcharts-popup button {
   float: right;
   border: none;
-  background: $button-background-color;
-  color: #666;
+  background: $neutral-color-3;
+  color: $neutral-color-60;
   margin-left:5px;
   margin-top:12px;
 }
@@ -197,7 +208,7 @@ $button-hover-color: #e6ebf5;
 }
 
 .highcharts-tab-disabled {
-  color: #ccc;
+  color: $neutral-color-20;
 }
 
 /* annotation edit small popup */
@@ -230,7 +241,7 @@ $button-hover-color: #e6ebf5;
 }
 
 .highcharts-popup .highcharts-popup-main-title {
-  border-bottom: 1px solid #e6e6e6;
+  border-bottom: 1px solid $neutral-color-10;
   margin: 0px;
   padding: 8px 0px 6px 20px;
 }
@@ -238,4 +249,41 @@ $button-hover-color: #e6ebf5;
 .highcharts-indicator-title {
   float: left;
   padding-bottom: 15px;
+}
+
+.highcharts-input-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  flex-wrap: wrap;
+}
+
+.highcharts-input-search-indicators-label {
+  text-align: center;
+  font-weight: bold;
+  color: $neutral-color-100;
+  margin-top: 0.5rem;
+}
+
+input.highcharts-input-search-indicators {
+  width: 80%;
+  margin: 0 auto;
+  float: none;
+  border-color: #949494;
+}
+
+.highcharts-popup a.clear-filter-button {
+  margin: 0 auto;
+  display: none;
+  color: $highlight-color-80;
+  background-color: $background-color;
+  border: 1px solid $highlight-color-80;
+  margin-top: 10px;
+}
+
+.highcharts-popup a.clear-filter-button:hover {
+  color: $background-color;
+  background-color: $highlight-color-80;
+  cursor: pointer;
 }

package/css/highcharts.css

@@ -950,6 +950,51 @@ text.highcharts-drilldown-data-label,
   fill: #e6e6e6;
 }
 
+/* A11y module */
+.highcharts-a11y-proxy-button {
+  border-width: 0;
+  background-color: transparent;
+  cursor: pointer;
+  outline: none;
+  opacity: 0.001;
+  z-index: 999;
+  overflow: hidden;
+  padding: 0;
+  margin: 0;
+  display: block;
+  position: absolute;
+}
+
+.highcharts-a11y-proxy-group ul {
+  list-style: none;
+}
+
+.highcharts-visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  white-space: nowrap;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin-top: -3px;
+  opacity: 0.01;
+}
+
+.highcharts-a11y-invisible {
+  visibility: hidden;
+}
+
+.highcharts-a11y-proxy-container,
+.highcharts-a11y-proxy-container-before,
+.highcharts-a11y-proxy-container-after {
+  position: absolute;
+  white-space: nowrap;
+}
+
+g.highcharts-series, .highcharts-markers, .highcharts-point {
+  outline: none;
+}
+
 /* Gantt */
 .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded {
   cursor: pointer;

package/css/highcharts.scss

@@ -840,6 +840,46 @@ text.highcharts-drilldown-data-label,
     fill: $neutral-color-10;
 }
 
+/* A11y module */
+.highcharts-a11y-proxy-button {
+    border-width: 0;
+    background-color: transparent;
+    cursor: pointer;
+    outline: none;
+    opacity: 0.001;
+    z-index: 999;
+    overflow: hidden;
+    padding: 0;
+    margin: 0;
+    display: block;
+    position: absolute;
+}
+.highcharts-a11y-proxy-group ul {
+    list-style: none;
+}
+.highcharts-visually-hidden {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    white-space: nowrap;
+    clip: rect(1px, 1px, 1px, 1px);
+    margin-top: -3px;
+    opacity: 0.01;
+}
+.highcharts-a11y-invisible {
+    visibility: hidden;
+}
+.highcharts-a11y-proxy-container,
+.highcharts-a11y-proxy-container-before,
+.highcharts-a11y-proxy-container-after {
+    position: absolute;
+    white-space: nowrap;
+}
+g.highcharts-series, .highcharts-markers, .highcharts-point {
+    outline: none;
+}
+
 /* Gantt */
 .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded {
     cursor: pointer;

package/css/themes/dark-unica.css

@@ -1011,6 +1011,51 @@ text.highcharts-drilldown-data-label,
   fill: #707073;
 }
 
+/* A11y module */
+.highcharts-a11y-proxy-button {
+  border-width: 0;
+  background-color: transparent;
+  cursor: pointer;
+  outline: none;
+  opacity: 0.001;
+  z-index: 999;
+  overflow: hidden;
+  padding: 0;
+  margin: 0;
+  display: block;
+  position: absolute;
+}
+
+.highcharts-a11y-proxy-group ul {
+  list-style: none;
+}
+
+.highcharts-visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  white-space: nowrap;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin-top: -3px;
+  opacity: 0.01;
+}
+
+.highcharts-a11y-invisible {
+  visibility: hidden;
+}
+
+.highcharts-a11y-proxy-container,
+.highcharts-a11y-proxy-container-before,
+.highcharts-a11y-proxy-container-after {
+  position: absolute;
+  white-space: nowrap;
+}
+
+g.highcharts-series, .highcharts-markers, .highcharts-point {
+  outline: none;
+}
+
 /* Gantt */
 .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded {
   cursor: pointer;

package/css/themes/grid-light.css

@@ -964,6 +964,51 @@ text.highcharts-drilldown-data-label,
   fill: #e6e6e6;
 }
 
+/* A11y module */
+.highcharts-a11y-proxy-button {
+  border-width: 0;
+  background-color: transparent;
+  cursor: pointer;
+  outline: none;
+  opacity: 0.001;
+  z-index: 999;
+  overflow: hidden;
+  padding: 0;
+  margin: 0;
+  display: block;
+  position: absolute;
+}
+
+.highcharts-a11y-proxy-group ul {
+  list-style: none;
+}
+
+.highcharts-visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  white-space: nowrap;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin-top: -3px;
+  opacity: 0.01;
+}
+
+.highcharts-a11y-invisible {
+  visibility: hidden;
+}
+
+.highcharts-a11y-proxy-container,
+.highcharts-a11y-proxy-container-before,
+.highcharts-a11y-proxy-container-after {
+  position: absolute;
+  white-space: nowrap;
+}
+
+g.highcharts-series, .highcharts-markers, .highcharts-point {
+  outline: none;
+}
+
 /* Gantt */
 .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded {
   cursor: pointer;

package/css/themes/sand-signika.css

@@ -980,6 +980,51 @@ text.highcharts-drilldown-data-label,
   fill: #e6e6e6;
 }
 
+/* A11y module */
+.highcharts-a11y-proxy-button {
+  border-width: 0;
+  background-color: transparent;
+  cursor: pointer;
+  outline: none;
+  opacity: 0.001;
+  z-index: 999;
+  overflow: hidden;
+  padding: 0;
+  margin: 0;
+  display: block;
+  position: absolute;
+}
+
+.highcharts-a11y-proxy-group ul {
+  list-style: none;
+}
+
+.highcharts-visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  white-space: nowrap;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin-top: -3px;
+  opacity: 0.01;
+}
+
+.highcharts-a11y-invisible {
+  visibility: hidden;
+}
+
+.highcharts-a11y-proxy-container,
+.highcharts-a11y-proxy-container-before,
+.highcharts-a11y-proxy-container-after {
+  position: absolute;
+  white-space: nowrap;
+}
+
+g.highcharts-series, .highcharts-markers, .highcharts-point {
+  outline: none;
+}
+
 /* Gantt */
 .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded {
   cursor: pointer;