@oliasoft-open-source/charts-library 3.3.6-beta-4 → 3.3.6-beta-5

package/index.js

@@ -0,0 +1,14 @@
+/*
+ Components
+ */
+
+import ScatterChart from './src/components/scatter-chart/scatter-chart';
+
+export { LineChart } from './src/components/line-chart/line-chart';
+export { initializeLineChart } from './src/components/line-chart/initialize/initialize-line-chart';
+
+export { PieChart } from './src/components/pie-chart/pie-chart';
+
+export { BarChart } from './src/components/bar-chart/bar-chart';
+
+export { ScatterChart };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/charts-library",
-  "version": "3.3.6-beta-4",
+  "version": "3.3.6-beta-5",
   "description": "React Chart Library (based on Chart.js and react-chart-js-2)",
   "homepage": "https://gitlab.com/oliasoft-open-source/charts-library",
   "bugs": {
@@ -12,11 +12,6 @@
   },
   "license": "MIT",
   "author": "Oliasoft AS and contributors",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "files": [
-    "dist"
-  ],
   "scripts": {
     "build": "yarn run build:storybook",
     "build:package": "vite build --config vite.config.mjs",

package/release-notes.md

@@ -0,0 +1,378 @@
+# Charts Library Release Notes
+
+## 3.3.5
+
+- Upgrade version of units package to resolve number display bugs
+
+## 3.3.4
+
+- Fixed legends hidden by default
+
+## 3.3.3
+
+- Update legend layout on chart resize ([OW-12426](https://oliasoft.atlassian.net/browse/OW-12426))
+
+## 3.3.2
+
+- Fixed rounding in pie chart tooltips [OW-12129](https://oliasoft.atlassian.net/browse/OW-12129)
+
+## 3.3.1
+
+- Fix annotation error in PieChart
+
+## 3.3.0
+
+- Draggable on-canvas legend [OW-11861](https://oliasoft.atlassian.net/browse/OW-11861)
+
+## 3.2.5
+
+- Fix bug in where reseting axes in linechart made the units selectors disappear. ([OW-12370](https://oliasoft.atlassian.net/browse/OW-12370))
+
+## 3.2.4
+
+- improve axis tick label number formatting (upstream fixes from units package) ([OW-12287](https://oliasoft.atlassian.net/browse/OW-12287))
+
+## 3.2.3
+
+- Updated zoom/pan button style to match other buttons [OW-11866](https://oliasoft.atlassian.net/browse/OW-11866)
+
+## 3.2.2
+
+- Added option to portal controls outside of chart ([OW-11865](https://oliasoft.atlassian.net/browse/OW-11865))
+
+## 3.2.1
+
+- Fix "ghost"-axis bug in multi-axis charts [OW-12061](https://oliasoft.atlassian.net/browse/OW-12061)
+
+## 3.2.0
+
+- Added sourcemap for building the package ([OW-12175](https://oliasoft.atlassian.net/browse/OW-12175))
+
+## 3.1.0
+
+- Improve axis tick number formatting ([OW-9589](https://oliasoft.atlassian.net/browse/OW-9589))
+
+## 3.0.4
+
+- Updated UI Library to fix custom SVG handling ([OW-12065](https://oliasoft.atlassian.net/browse/OW-12065))
+
+## 3.0.3
+
+- add axis label formatting test case stories
+
+## 3.0.2
+
+- Fix `dependencies` and `peerDependencies` ([OW-12046](https://oliasoft.atlassian.net/browse/OW-12046))
+
+## 3.0.1
+
+- upgrade version of `react-ui-library` to resolve a `NumberInput` bug ([OW-12040](https://oliasoft.atlassian.net/browse/OW-12040))
+
+## 3.0.0
+
+- Switched over to Vite and Vitest.
+  ([OW-11983](https://oliasoft.atlassian.net/browse/OW-11983))
+
+## 2.17.6
+
+- Fix `NumberInput` bug that prevented users typing decimal values with trailing zeros in charts controls
+  ([OW-11920](https://oliasoft.atlassian.net/browse/OW-11920))
+
+## 2.17.5
+
+- Support disabling `usePointStyle` to show dashed lines in legend ([OW-11786](https://oliasoft.atlassian.net/browse/OW-11786))
+
+## 2.17.4
+
+- Use new `<NumberInput>` component from GUI Library in charts controls, to simplify validation ([OW-11773](https://oliasoft.atlassian.net/browse/OW-11773))
+
+## 2.17.3
+
+- Replace legacy internal implementation of `isEqualWithTolerance` with `isCloseTo` from units package ([OW-11767](https://oliasoft.atlassian.net/browse/OW-11767))
+
+## 2.17.2
+
+- Fix release CI/CD pipeline ([OW-11691](https://oliasoft.atlassian.net/browse/OW-11691))
+
+## 2.17.1
+
+- Added debounce to prevent maximum call stack size exceeded
+
+## 2.17.0
+
+- Added initialize logic, for improve translations
+
+## 2.16.0
+
+- Added common chart area text plugin
+
+## 2.15.0
+
+- Added translation, by provider handled([OW-11237](https://oliasoft.atlassian.net/browse/OW-11237))
+
+## 2.14.1
+
+- Fix save initAxesRange when dataset changed by parent component([OW-11332](https://oliasoft.atlassian.net/browse/OW-11332))
+
+## 2.14.0
+
+- Refactored line chart, for better performance, readable and reduce not needed re-renders
+
+## 2.13.5
+
+- Fixed reset range when subComponent update data, prevent extra re-renders when range have same deep values but different reference
+
+## 2.13.4
+
+- Fixed legend state
+
+## 2.13.3
+
+- Added story for point styling to support ([OW-11107](https://oliasoft.atlassian.net/browse/OW-11107))
+
+## 2.13.2
+
+- Changed default value for zoom to true
+
+## 2.13.1
+
+- Text label for drag options trigger, to make current behaviour more obvious ([OW-11102](https://oliasoft.atlassian.net/browse/OW-11102))
+
+## 2.13.0
+
+- Added feature to save state to localStorage and clean when expired, fixed panEnable(state) bug.
+
+## 2.12.0
+
+- Add unit selector and depth selector to axes options ([OW-9496](https://oliasoft.atlassian.net/browse/OW-9496))
+
+## 2.11.3
+
+- Submit Axes option on keyboard Enter ([OW-10995](https://oliasoft.atlassian.net/browse/OW-10995))
+
+## 2.11.2
+
+- remove number handling functions that were duplicated from units package
+  ([OW-11062](https://oliasoft.atlassian.net/browse/OW-11062))
+
+## 2.11.1
+
+- updated icon import
+
+## 2.11.0
+
+- added `dragData` feature ([chartjs-plugin-dragdata](https://github.com/chrispahm/chartjs-plugin-dragdata))
+
+## 2.10.2
+
+- remove dead `less-vars-to-js` package ([OW-11017](https://oliasoft.atlassian.net/browse/OW-11017))
+
+## 2.10.1
+
+- Use `peerDependencies` for common versions of shared packages like `units` and `react-ui-library` so reduce double
+  installs and conflicting versions in parent apps ([OW-10974](https://oliasoft.atlassian.net/browse/OW-10974))
+
+## 2.10.0
+
+- Switch to standard `round()` function from units repo [OW-10972](https://oliasoft.atlassian.net/browse/OW-10972)
+
+## 2.9.4
+
+- Updated version of UI Library
+
+## 2.9.3
+
+- Add @oliasoft-open-source/units package and update pase method in BarChart ([OW-10670](https://oliasoft.atlassian.net/browse/OW-10670))
+
+## 2.9.2
+
+- Fix missing axis scale when in dataset is one point with negative values ([OW-10616](https://oliasoft.atlassian.net/browse/OW-10616))
+
+## 2.9.1
+
+- Fix decimal values in BarChart in tooltips for locales with comma decimal ([OW-10632](https://oliasoft.atlassian.net/browse/OW-10632))
+
+## 2.9.0
+
+- Add double-click event on chart area, change reset chart ranges from one click to double click ([OW-10412](https://oliasoft.atlassian.net/browse/OW-10412))
+
+## 2.8.0
+
+- Simplify dist-tag strategy for beta version releases (to reduce cleanup effort) ([OW-10003](https://oliasoft.atlassian.net/browse/OW-10003))
+
+## 2.7.0
+
+- Add optional CI pipeline that automates publishing of beta releases ([OW-10003](https://oliasoft.atlassian.net/browse/OW-10003))
+
+## 2.6.2
+
+- Fix asis range update correctly ([OW-10534](https://oliasoft.atlassian.net/browse/OW-10534), and [OW-10457](https://oliasoft.atlassian.net/browse/OW-10457))
+
+## 2.6.1
+
+- Added Box and Ellipse annotations ([OW-10519](https://oliasoft.atlassian.net/browse/OW-10519))
+
+## 2.6.0
+
+- Add support for optional `autoAxisPadding` prop, which autoscales 5% padding around data ([OW-10398](https://oliasoft.atlassian.net/browse/OW-10398))
+- Fix bug in default scales when all data points similar values ([OW-4327](https://oliasoft.atlassian.net/browse/OW-4327))
+
+## 2.5.27
+
+- Add guard to useEffect in line-chart
+
+## 2.5.26
+
+- Add guard to getLineChartAxis method
+
+## 2.5.25
+
+- Fix axis ranges updating when new chart data and ranges is passed
+
+## 2.5.24
+
+- Add performance test case
+
+## 2.5.23
+
+- Patch minor regression in axis limits introduced in 2.5.22
+
+## 2.5.22
+
+- Improve UX and input validation for axes range inputs ([OW-10305](https://oliasoft.atlassian.net/browse/OW-10305))
+
+## 2.5.21
+
+- Revert changes from `2.5.12` / [OW-10320](https://oliasoft.atlassian.net/browse/OW-10320)
+- Changing thousands separators broke decimal separators in some locales
+- Resolves [OW-10320](https://oliasoft.atlassian.net/browse/OW-10320)
+
+## 2.5.20
+
+- Minor refactor (code cleanup)
+
+## 2.5.19
+
+- Hide irregular major axis ticks ([OW-10088](https://oliasoft.atlassian.net/browse/OW-10088))
+
+## 2.5.18
+
+- Fixed minor gridlines when last major tick does not reach axis bounds ([OW-10296](https://oliasoft.atlassian.net/browse/OW-10296))
+
+## 2.5.17
+
+- Added some (realistic) test case stories from our app
+
+## 2.5.16
+
+- Remove test artefacts from published package
+
+## 2.5.15
+
+- Changed GUI library version to `^3.1`
+
+## 2.5.14
+
+- Sync axis labels in chart Controls with props
+
+## 2.5.13
+
+- fixed custom range inputs reset, multi-axis range placeholder values missing
+
+## 2.5.12
+
+- change thousand separators in axis label from comma to space
+
+## 2.5.11
+
+- Allow headerComponent and chart title to coexist
+
+## 2.5.10
+
+- Fix zoom / pan bug at < 0.1 scale on charts
+
+## 2.5.9
+
+- Fix validation for two and more decimal places in charts settings
+
+## 2.5.8
+
+- Disable tooltip animations in `performanceMode`
+
+## 2.5.7
+
+- Allow stretchy headerComponent in controls
+
+## 2.5.6
+
+- Removed resizeDelay, fixed double data labels set position
+
+## 2.5.5
+
+- Removed empty label annotations
+
+## 2.5.4
+
+- Fixed onPointHover event
+
+## 2.5.3
+
+- Fixed datalabels position, set labels position inside chart area
+
+## 2.5.2
+
+- Fix crashes when type a non number into the axis range - add validation in getLinechartAxis method
+
+## 2.5.1
+
+- Added resize delay for performance
+
+## 2.5.0
+
+- Separate controls for points/lines, axes options, legend, download
+- Standard control for table
+- Box zoom
+
+## 2.4.6
+
+- Fix Multiple X Axes example in LineChart
+
+## 2.4.5
+
+- Fix zooming issue from OW-9960
+
+## 2.4.4
+
+- Updated GUI Library version
+
+## 2.4.3
+
+- Fix crashes when type a non-number into the axis range OW-9924
+
+## 2.4.2
+
+- Square aspect ratio charts can fill height/width
+
+## 2.4.1
+
+- Remove dependency on http-server (moved to dev dependencies)
+
+## 2.4.0
+
+- Switch package manager from NPM to Yarn
+
+## 2.3.4
+
+- RollBack changes regarding OW-4327
+
+## 2.3.3
+
+- restrict suggestedMin/Max by X axe OW-4327
+
+## 2.3.2
+
+- added default values for axis ticks (suggestedMin/Max) OW-4327
+
+## 2.3.0
+
+- Text annotations in lin

package/src/assets/circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="12" fill="currentColor" /></svg>

package/src/assets/icons/line-and-point.svg

@@ -0,0 +1 @@
+<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h12v12h-12z"/></clipPath><g clip-path="url(#a)"><path d="m7.937 6.5c-.11122.42912-.36179.80916-.71237 1.08047-.35058.2713-.78133.4185-1.22463.4185s-.87405-.1472-1.22463-.4185c-.35058-.27131-.60115-.65135-.71237-1.08047h-3.563v-1h3.563c.11122-.42912.36179-.80916.71237-1.08046s.78133-.41851 1.22463-.41851.87405.14721 1.22463.41851.60115.65134.71237 1.08046h3.563v1z" fill="currentColor"/></g></svg>

package/src/assets/icons/line-only.svg

@@ -0,0 +1 @@
+<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h12v12h-12z"/></clipPath><g clip-path="url(#a)"><path d="m.5 6.5v-1h11v1c-4.16104 0-6.63549 0-11 0z" fill="currentColor"/></g></svg>

package/src/assets/icons/list-hide.svg

@@ -0,0 +1 @@
+<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h12v12h-12z"/></clipPath><g clip-path="url(#a)"><path clip-rule="evenodd" d="m1.85351 1.14645-.35356-.353558-.707103.707108.353553.35355.39645.39645c-.02813.07955-.0429.16401-.0429.25 0 .19891.07902.38968.21967.53033.14066.14065.33142.21967.53033.21967.08599 0 .17045-.01477.25-.04289l2.2929 2.29289h-.7929v1h1.7929l2.5 2.5h-4.2929v1h5.2929l.85355.8536.3536.3535.7071-.7071-.3536-.3536-.3535-.35351v-.79289h-.79294l-2.5-2.5h3.29294v-1h-4.29294l-3.25-3.25c-.03694-.10448-.09692-.20048-.17678-.28033-.07985-.07985-.17585-.13984-.28033-.17678zm8.64649.85355h-6.50005v1h6.50005zm-8.78038 4.53033c.14066.14065.33142.21967.53033.21967.19892 0 .38968-.07902.53033-.21967.14066-.14065.21967-.33142.21967-.53033s-.07901-.38968-.21967-.53033c-.14065-.14065-.33141-.21967-.53033-.21967-.19891 0-.38967.07902-.53033.21967-.14065.14065-.21967.33142-.21967.53033s.07902.38968.21967.53033zm0 3.45c.14066.14067.33142.21967.53033.21967.19892 0 .38968-.079.53033-.21967.14066-.14065.21967-.33142.21967-.53033s-.07901-.38968-.21967-.53033c-.14065-.14065-.33141-.21967-.53033-.21967-.19891 0-.38967.07902-.53033.21967-.14065.14065-.21967.33142-.21967.53033s.07902.38968.21967.53033z" fill="currentColor" fill-rule="evenodd"/></g></svg>

package/src/assets/icons/point-only.svg

@@ -0,0 +1 @@
+<svg fill="none" height="12" viewBox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg"><circle cx="6" cy="6" fill="currentColor" r="2"/></svg>

package/src/assets/rect.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="2" y="2" width="20" height="20" fill="currentColor" /></svg>

package/src/assets/rectRot.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="3" y="3" width="18" height="18" fill="currentColor" transform='rotate(45 12 12)' /></svg>

package/src/assets/triangle.svg

@@ -0,0 +1 @@
+<svg  height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h24v24h-24z"/></clipPath><g clip-path="url(#a)"><path d="m22.7998 22.0623h-21.5996c-.21066.0001-.417617-.0554-.600067-.1607-.182451-.1053-.333965-.2567-.439311-.4392-.1053464-.1824-.16081228-.3893-.160822-.6s.0554372-.4176.160767-.6l10.799833-18.70518c.1139-.17137.2684-.31191.4497-.40913.1814-.09722.3839-.14809.5897-.14809s.4083.05087.5897.14809c.1813.09722.3358.23776.4497.40913l10.7998 18.70518c.1054.1824.1608.3893.1608.6s-.0555.4176-.1608.6c-.1054.1825-.2569.3339-.4393.4392-.1825.1053-.3894.1608-.6001.1607z" fill="currentColor"/></g></svg>

package/src/components/bar-chart/bar-chart-prop-types.js

@@ -0,0 +1,209 @@
+import PropTypes from 'prop-types';
+
+export const BarChartPropTypes = {
+  chart: PropTypes.shape({
+    testId: PropTypes.string,
+    data: PropTypes.object.isRequired,
+    options: PropTypes.shape({
+      title: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.arrayOf(PropTypes.string),
+      ]),
+      direction: PropTypes.oneOf(['vertical', 'horizontal']),
+      axes: PropTypes.shape({
+        x: PropTypes.arrayOf(
+          PropTypes.shape({
+            label: PropTypes.string,
+            position: PropTypes.oneOf(['top', 'bottom']),
+            color: PropTypes.string,
+            unit: PropTypes.string,
+          }),
+        ),
+        y: PropTypes.arrayOf(
+          PropTypes.shape({
+            label: PropTypes.string,
+            position: PropTypes.oneOf(['left', 'right']),
+            color: PropTypes.string,
+            unit: PropTypes.string,
+          }),
+        ),
+      }),
+      additionalAxesOptions: PropTypes.shape({
+        chartScaleType: PropTypes.oneOf(['linear', 'logarithmic']),
+        reverse: PropTypes.bool,
+        beginAtZero: PropTypes.bool,
+        stepSize: PropTypes.number,
+        stacked: PropTypes.bool,
+        suggestedMin: PropTypes.number,
+        suggestedMax: PropTypes.number,
+        min: PropTypes.number,
+        max: PropTypes.number,
+      }),
+      chartStyling: PropTypes.shape({
+        width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+        height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+        maintainAspectRatio: PropTypes.bool,
+        staticChartHeight: PropTypes.bool,
+        performanceMode: PropTypes.bool,
+      }),
+      tooltip: PropTypes.shape({
+        tooltips: PropTypes.bool,
+        showLabelsInTooltips: PropTypes.bool,
+      }),
+      graph: PropTypes.shape({
+        showDataLabels: PropTypes.bool,
+        showMinorGridlines: PropTypes.bool,
+      }),
+      annotations: PropTypes.shape({
+        showAnnotations: PropTypes.bool,
+        controlAnnotation: PropTypes.bool,
+        annotationsData: PropTypes.arrayOf(
+          PropTypes.shape({
+            annotationAxis: PropTypes.oneOf(['x', 'y']),
+            label: PropTypes.string,
+            color: PropTypes.string,
+            value: PropTypes.number,
+            endValue: PropTypes.number,
+          }),
+        ),
+      }),
+      legend: PropTypes.shape({
+        display: PropTypes.bool,
+        position: PropTypes.oneOf(['top', 'bottom', 'right']),
+        align: PropTypes.oneOf(['start', 'center', 'end']),
+        customLegend: PropTypes.shape({
+          customLegendPlugin: PropTypes.object,
+          customLegendContainerID: PropTypes.string,
+        }),
+      }),
+      chartOptions: PropTypes.shape({
+        enableZoom: PropTypes.bool,
+        enablePan: PropTypes.bool,
+      }),
+      interactions: PropTypes.shape({
+        onLegendClick: PropTypes.func,
+        onBarHover: PropTypes.func,
+        onBarUnhover: PropTypes.func,
+      }),
+      dragData: PropTypes.shape({
+        enableDragData: PropTypes.bool,
+        showTooltip: PropTypes.bool,
+        roundPoints: PropTypes.bool,
+        dragX: PropTypes.bool,
+        dragY: PropTypes.bool,
+        onDragStart: PropTypes.func,
+        onDrag: PropTypes.func,
+        onDragEnd: PropTypes.func,
+      }),
+    }),
+  }).isRequired,
+};
+
+export const getDefaultProps = (props) => {
+  // Add missing nested objects
+  props.chart.options = props.chart.options || {};
+  props.chart.options.axes = props.chart.options.axes || {};
+  props.chart.options.additionalAxesOptions =
+    props.chart.options.additionalAxesOptions || {};
+  props.chart.options.chartStyling = props.chart.options.chartStyling || {};
+  props.chart.options.tooltip = props.chart.options.tooltip || {};
+  props.chart.options.graph = props.chart.options.graph || {};
+  props.chart.options.annotations = props.chart.options.annotations || {};
+  props.chart.options.legend = props.chart.options.legend || {};
+  props.chart.options.legend.customLegend = props.chart.options.legend
+    .customLegend || { customLegendPlugin: null, customLegendContainerID: '' };
+  props.chart.options.chartOptions = props.chart.options.chartOptions || {};
+  props.chart.options.interactions = props.chart.options.interactions || {};
+  props.chart.options.dragData = props.chart.options.dragData || {};
+  // Set defaults for missing properties
+  const chart = {
+    testId: props.chart.testId ?? null,
+    data: props.chart.data,
+    options: {
+      title: props.chart.options.title || '',
+      direction: props.chart.options.direction || 'vertical',
+      axes: {
+        x: props.chart.options.axes.x || [{}],
+        y: props.chart.options.axes.y || [{}],
+      },
+      additionalAxesOptions: {
+        chartScaleType:
+          props.chart.options.additionalAxesOptions.chartScaleType || 'linear',
+        reverse: props.chart.options.additionalAxesOptions.reverse || false,
+        stacked: props.chart.options.additionalAxesOptions.stacked || false,
+        beginAtZero:
+          props.chart.options.additionalAxesOptions.beginAtZero != null
+            ? props.chart.options.additionalAxesOptions.beginAtZero
+            : true,
+        stepSize: props.chart.options.additionalAxesOptions.stepSize,
+        suggestedMin: props.chart.options.additionalAxesOptions.suggestedMin,
+        suggestedMax: props.chart.options.additionalAxesOptions.suggestedMax,
+        min: props.chart.options.additionalAxesOptions.min,
+        max: props.chart.options.additionalAxesOptions.max,
+      },
+      chartStyling: {
+        width: props.chart.options.chartStyling.width,
+        height: props.chart.options.chartStyling.height,
+        maintainAspectRatio:
+          props.chart.options.chartStyling.maintainAspectRatio || false,
+        staticChartHeight:
+          props.chart.options.chartStyling.staticChartHeight || false,
+        performanceMode:
+          props.chart.options.chartStyling.performanceMode != null
+            ? props.chart.options.chartStyling.performanceMode
+            : true,
+      },
+      tooltip: {
+        tooltips:
+          props.chart.options.tooltip.tooltips != null
+            ? props.chart.options.tooltip.tooltips
+            : true,
+        showLabelsInTooltips:
+          props.chart.options.tooltip.showLabelsInTooltips || false,
+      },
+      graph: {
+        showDataLabels: props.chart.options.graph.showDataLabels || false,
+        showMinorGridlines:
+          props.chart.options.graph.showMinorGridlines || false,
+      },
+      annotations: {
+        showAnnotations:
+          props.chart.options.annotations.showAnnotations != null
+            ? props.chart.options.annotations.showAnnotations
+            : true,
+        controlAnnotation:
+          props.chart.options.annotations.controlAnnotation || false,
+        annotationsData: props.chart.options.annotations.annotationsData || [],
+      },
+      legend: {
+        display:
+          props.chart.options.legend.display != null
+            ? props.chart.options.legend.display
+            : true,
+        position: props.chart.options.legend.position || 'bottom',
+        align: props.chart.options.legend.align || 'center',
+        customLegend: props.chart.options.legend.customLegend,
+      },
+      chartOptions: {
+        enableZoom: props.chart.options.chartOptions.enableZoom || false,
+        enablePan: props.chart.options.chartOptions.enablePan || false,
+      },
+      interactions: {
+        onLegendClick: props.chart.options.interactions.onLegendClick,
+        onBarHover: props.chart.options.interactions.onBarHover,
+        onBarUnhover: props.chart.options.interactions.onBarUnhover,
+      },
+      dragData: {
+        enableDragData: props.chart.options.dragData.enableDragData || false,
+        showTooltip: props.chart.options.dragData.showTooltip || true,
+        roundPoints: props.chart.options.dragData.roundPoints || true,
+        dragX: props.chart.options.dragData.dragX || true,
+        dragY: props.chart.options.dragData.dragY || true,
+        onDragStart: props.chart.options.dragData.onDragStart,
+        onDrag: props.chart.options.dragData.onDrag,
+        onDragEnd: props.chart.options.dragData.onDragEnd,
+      },
+    },
+  };
+  return chart;
+};