@oliasoft-open-source/charts-library 7.0.1-beta-1 → 7.0.1

package/README.md

@@ -1,3 +1,418 @@
 # Chart Library
 
 Reusable charts for use in React applications.
+
+## Usage and defaults
+
+The component JSDoc contains usage examples with sample data, labels and an explicit height.
+Those example values are not defaults.
+
+The sections below show the complete library-normalized configuration for `getDefaultProps({ chart: {} })`.
+You do not need to pass these objects: omitted options receive these values automatically.
+
+- `undefined` means the library leaves that value unspecified; it does not mean zero or false.
+- Empty data is the default. Supply your own DS to draw a chart.
+- These are library defaults, not a dump of Chart.js or plugin defaults. Final rendering can also depend on
+  data, container size, theme, plugin configuration and, for LineChart, persisted control state.
+- Compatibility fields may appear in normalized output without affecting rendering; see their public type documentation.
+- Default unit-selector callbacks are no-ops; consumers own unit selection and data conversion.
+- The snapshots describe the initial empty configuration. Per-item defaults for supplied annotations and DS are
+  applied separately by their normalizers and renderers.
+
+## LineChart
+
+```ts
+const noop = () => {
+  // Default unit selection does not change consumer state.
+};
+
+const defaultChart = {
+  persistenceId: '',
+  controlsPortalId: '',
+  testId: undefined,
+  data: {
+    datasets: [],
+  },
+  options: {
+    title: '',
+    scales: {
+      x: {},
+      y: {},
+    },
+    axes: {
+      x: [
+        {
+          label: '',
+          position: 'bottom',
+          color: '',
+          unit: {
+            options: [],
+            selectedUnit: '',
+            setSelectedUnit: noop,
+          },
+        },
+      ],
+      y: [
+        {
+          label: '',
+          position: 'left',
+          color: '',
+          unit: {
+            options: [],
+            selectedUnit: '',
+            setSelectedUnit: noop,
+          },
+        },
+      ],
+    },
+    additionalAxesOptions: {
+      chartScaleType: 'linear',
+      reverse: false,
+      beginAtZero: false,
+      stepSize: undefined,
+      suggestedMin: undefined,
+      suggestedMax: undefined,
+      range: undefined,
+      autoAxisPadding: false,
+    },
+    chartStyling: {
+      width: undefined,
+      height: undefined,
+      maintainAspectRatio: false,
+      staticChartHeight: false,
+      performanceMode: true,
+      squareAspectRatio: false,
+      layoutPadding: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 0,
+      },
+    },
+    tooltip: {
+      tooltips: true,
+      showLabelsInTooltips: false,
+      hideSimulationName: false,
+      scientificNotation: true,
+      callbacks: undefined,
+    },
+    graph: {
+      lineTension: 0.01,
+      spanGaps: false,
+      showDataLabels: false,
+      showMinorGridlines: false,
+    },
+    annotations: {
+      labelAnnotation: {
+        showLabel: false,
+        text: '',
+        position: 'bottom-right',
+        fontSize: 12,
+        xOffset: 5,
+        yOffset: 5,
+        maxWidth: 300,
+        lineHeight: 12,
+      },
+      showAnnotations: false,
+      controlAnnotation: false,
+      enableDragAnnotation: false,
+      enableCalloutAnnotation: false,
+      lineMarkersAnnotation: {
+        enabled: false,
+        itemGapPx: 4,
+        edgePaddingPx: 8,
+        horizontalLineLengthPx: undefined,
+        lineDirection: undefined,
+        labelCollisionPx: 4,
+        labelCollisionClusterXPx: 36,
+        enableLabelCollisionResolver: true,
+        stickToEdge: true,
+        stickToGroup: false,
+        stickSide: 'right',
+        reverse: false,
+        xValue: undefined,
+        yValue: undefined,
+        yStartValue: undefined,
+        yEndValue: undefined,
+        xStartValue: undefined,
+        xEndValue: undefined,
+        lengthPx: undefined,
+        color: 'rgba(20,20,20,0.9)',
+        opacity: 1,
+        lineWidth: 1,
+        lineDash: [],
+        startTick: undefined,
+        endTick: undefined,
+        items: [],
+      },
+      annotationsData: [],
+    },
+    legend: {
+      display: true,
+      position: 'bottom-left',
+      align: 'center',
+      customLegend: {
+        customLegendPlugin: null,
+        customLegendContainerID: '',
+      },
+      usePointStyle: true,
+    },
+    chartOptions: {
+      showPoints: true,
+      showLine: true,
+      enableZoom: true,
+      enablePan: false,
+      enableDragAnnotation: false,
+      closeOnOutsideClick: false,
+    },
+    interactions: {
+      onLegendClick: undefined,
+      onHover: undefined,
+      onUnhover: undefined,
+      onAnimationComplete: undefined,
+    },
+    dragData: {
+      enableDragData: false,
+      showTooltip: true,
+      roundPoints: true,
+      dragX: true,
+      dragY: true,
+      onDragStart: undefined,
+      onDrag: undefined,
+      onDragEnd: undefined,
+    },
+    depthType: {},
+  },
+};
+```
+
+## BarChart
+
+```ts
+const defaultChart = {
+  testId: '',
+  controlsPortalId: '',
+  data: {
+    labels: [],
+    datasets: [],
+  },
+  options: {
+    title: '',
+    direction: 'vertical',
+    axes: {
+      x: [{}],
+      y: [{}],
+    },
+    additionalAxesOptions: {
+      chartScaleType: 'linear',
+      reverse: false,
+      stacked: false,
+      beginAtZero: true,
+      stepSize: undefined,
+      suggestedMin: undefined,
+      suggestedMax: undefined,
+      min: undefined,
+      max: undefined,
+      stackedX: undefined,
+      stackedY: undefined,
+    },
+    chartStyling: {
+      width: undefined,
+      height: undefined,
+      maintainAspectRatio: false,
+      staticChartHeight: false,
+      performanceMode: true,
+    },
+    tooltip: {
+      tooltips: true,
+      showLabelsInTooltips: false,
+      scientificNotation: true,
+    },
+    graph: {
+      showDataLabels: false,
+      showMinorGridlines: false,
+    },
+    scales: {},
+    annotations: {
+      showAnnotations: true,
+      controlAnnotation: false,
+      annotationsData: [],
+    },
+    legend: {
+      display: true,
+      position: 'top-left',
+      align: 'center',
+      customLegend: {
+        customLegendPlugin: null,
+        customLegendContainerID: '',
+      },
+    },
+    chartOptions: {
+      enableZoom: false,
+      enablePan: false,
+    },
+    interactions: {
+      onLegendClick: undefined,
+      onHover: undefined,
+      onUnhover: undefined,
+    },
+    dragData: {
+      enableDragData: false,
+      showTooltip: true,
+      roundPoints: true,
+      dragX: true,
+      dragY: true,
+      onDragStart: undefined,
+      onDrag: undefined,
+      onDragEnd: undefined,
+    },
+  },
+};
+```
+
+## PieChart
+
+```ts
+const defaultChart = {
+  testId: null,
+  data: {
+    labels: [],
+    datasets: [],
+  },
+  options: {
+    title: '',
+    chartStyling: {
+      width: undefined,
+      height: undefined,
+      maintainAspectRatio: false,
+      staticChartHeight: false,
+      performanceMode: true,
+    },
+    tooltip: {
+      tooltips: true,
+      showLabelsInTooltips: false,
+      scientificNotation: true,
+    },
+    graph: {
+      showDataLabels: false,
+      stacked: false,
+      cutout: 0,
+    },
+    legend: {
+      display: true,
+      useDataset: false,
+      position: 'bottom',
+      align: 'center',
+    },
+    chartOptions: {
+      enableZoom: false,
+      enablePan: false,
+    },
+    interactions: {
+      onLegendClick: undefined,
+      onHover: undefined,
+      onUnhover: undefined,
+    },
+  },
+};
+```
+
+## ScatterChart
+
+```ts
+import { GradientDirection } from '@oliasoft-open-source/charts-library';
+
+const defaultChart = {
+  testId: null,
+  data: {
+    labels: [],
+    datasets: [],
+  },
+  options: {
+    title: '',
+    axes: {
+      x: [{}],
+      y: [{}],
+    },
+    additionalAxesOptions: {
+      chartScaleType: 'linear',
+      reverse: false,
+      stacked: false,
+      beginAtZero: true,
+      stepSize: undefined,
+      suggestedMin: undefined,
+      suggestedMax: undefined,
+      min: undefined,
+      max: undefined,
+    },
+    direction: 'vertical',
+    chartStyling: {
+      width: 'auto',
+      height: 'auto',
+      maintainAspectRatio: false,
+      staticChartHeight: false,
+      performanceMode: true,
+      gradient: {
+        display: false,
+        gradientColors: [
+          {
+            offset: 0,
+            color: 'rgba(144,238,144,0.8)',
+          },
+          {
+            offset: 0.6,
+            color: 'rgba(255,255,224,0.8)',
+          },
+          {
+            offset: 0.8,
+            color: 'rgba(255,255,224,0.8)',
+          },
+          {
+            offset: 0.92,
+            color: 'rgba(255,182,193,0.5)',
+          },
+          {
+            offset: 0.99,
+            color: 'rgba(255,182,193,0.8)',
+          },
+        ],
+        direction: GradientDirection.BottomLeftToTopRight,
+      },
+    },
+    tooltip: {
+      enabled: true,
+      tooltips: true,
+      showLabelsInTooltips: false,
+      backgroundColor: '#333',
+      displayColors: false,
+      scientificNotation: true,
+    },
+    graph: {
+      showMinorGridlines: false,
+      showDataLabels: false,
+    },
+    scales: {},
+    legend: {
+      display: true,
+      useDataset: false,
+      position: 'bottom-left',
+      align: 'center',
+    },
+    annotations: {
+      showAnnotations: true,
+      controlAnnotation: false,
+      annotationsData: [],
+    },
+    chartOptions: {
+      enableZoom: false,
+      enablePan: false,
+    },
+    interactions: {
+      onLegendClick: undefined,
+      onHover: undefined,
+      onUnhover: undefined,
+      onAnimationComplete: undefined,
+    },
+  },
+};
+```

package/dist/index.d.ts

@@ -33,15 +33,41 @@ export declare enum AxisType {
 }
 
 /**
- * Renders a Cartesian bar chart with optional stacking, annotations and interactive controls.
+ * Renders vertical or horizontal bars with optional stacking, annotations and a legend.
  *
- * @param props - Chart data and partial options. `options.direction` selects vertical or horizontal bars.
- * @returns The chart canvas, legend and controls.
+ * Pass partial configuration through `chart`; omitted settings receive component defaults.
+ * The example uses sample data, labels and a height of 320 pixels; these are not default values.
+ *
+ * @remarks
+ * Defaults: vertical bars, a top-left legend, zero included in automatic scale bounds, and annotations enabled.
+ * Zoom, pan, stacking and data labels are disabled. No fixed width or height is assigned.
+ * Performance mode is enabled by default, disabling animations.
+ * The linked reference lists the complete normalized default configuration.
+ *
+ * @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#barchart
+ *
+ * @param props - Chart data and options.
+ * @returns The chart canvas and its associated UI.
  * @example
  * ```tsx
  * <BarChart chart={{
- *   data: { labels: ['A'], datasets: [{ label: 'DS A', data: [{ x: 'A', y: 10 }] }] },
- *   options: { direction: 'vertical' },
+ *   data: {
+ *     labels: ['A', 'B', 'C'],
+ *     datasets: [{
+ *       label: 'DS A',
+ *       data: [{ x: 'A', y: 10 }, { x: 'B', y: 20 }, { x: 'C', y: 15 }],
+ *     }],
+ *   },
+ *   options: {
+ *     direction: 'vertical',
+ *     axes: {
+ *       x: [{ label: 'Category', position: 'bottom' }],
+ *       y: [{ label: 'Value', position: 'left' }],
+ *     },
+ *     chartStyling: { height: 320 },
+ *     legend: { display: true, position: 'top-left' },
+ *     graph: { showDataLabels: false },
+ *   },
  * }} />
  * ```
  */
@@ -1774,19 +1800,40 @@ export declare enum Key {
 }
 
 /**
- * Renders an interactive Cartesian line chart with multiple axes, annotations and chart controls.
+ * Renders an interactive line chart with multiple axes, annotations, a legend and chart controls.
  *
  * Pass partial configuration through `chart`; omitted settings receive component defaults.
- * The default tooltip title uses Y when the first X axis is at the top, and X otherwise.
- * The other coordinate is displayed beside the DS name. Custom callbacks override those defaults.
+ * The example uses sample data, labels and a height of 320 pixels; these are not default values.
  *
- * @param props - Chart configuration and optional header, subheader and table content.
- * @returns The chart canvas, legend and controls.
+ * @remarks
+ * Defaults: bottom X axis, left Y axis, visible lines and points, bottom-left legend, and zoom enabled.
+ * Pan, data labels, minor grid lines and annotations are disabled. No fixed width or height is assigned.
+ * Performance mode is enabled by default, disabling animations.
+ * The linked reference lists the complete normalized default configuration.
+ *
+ * @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#linechart
+ *
+ * @param props - Chart data and options, plus optional header, subheader and table content.
+ * @returns The chart canvas and its associated UI.
  * @example
  * ```tsx
  * <LineChart chart={{
- *   data: { datasets: [{ label: 'DS A', data: [{ x: 10, y: 20 }] }] },
- *   options: { tooltip: { scientificNotation: false } },
+ *   data: {
+ *     datasets: [{
+ *       label: 'DS A',
+ *       data: [{ x: 0, y: 10 }, { x: 1, y: 20 }, { x: 2, y: 15 }],
+ *     }],
+ *   },
+ *   options: {
+ *     axes: {
+ *       x: [{ label: 'X', position: 'bottom' }],
+ *       y: [{ label: 'Y', position: 'left' }],
+ *     },
+ *     chartStyling: { height: 320 },
+ *     legend: { display: true, position: 'bottom-left' },
+ *     graph: { lineTension: 0.01, showDataLabels: false },
+ *     chartOptions: { showLine: true, showPoints: true },
+ *   },
  * }} />
  * ```
  */
@@ -1829,15 +1876,37 @@ export declare enum PanZoomMode {
 }
 
 /**
- * Renders a pie chart with configurable legends, data labels and an optional inner cutout.
+ * Renders pie segments with optional data labels, a legend and an inner cutout.
+ *
+ * Pass partial configuration through `chart`; omitted settings receive component defaults.
+ * The example uses sample data, labels and a height of 320 pixels; these are not default values.
+ *
+ * @remarks
+ * Defaults: a full pie (cutout 0), a bottom legend, and no fixed width or height.
+ * Data labels, stacking, zoom and pan are disabled. Pie charts do not have Cartesian axes.
+ * Performance mode is enabled by default, disabling animations.
+ * The linked reference lists the complete normalized default configuration.
  *
- * @param props - Chart data and partial options. Set `chart.options.graph.cutout` for an inner opening.
- * @returns The chart canvas and legend.
+ * @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#piechart
+ *
+ * @param props - Chart data and options.
+ * @returns The chart canvas and its associated UI.
  * @example
  * ```tsx
  * <PieChart chart={{
- *   data: { labels: ['A', 'B'], datasets: [{ label: 'DS A', data: [10, 20] }] },
- *   options: { graph: { cutout: '50%' } },
+ *   data: {
+ *     labels: ['A', 'B', 'C'],
+ *     datasets: [{
+ *       label: 'DS A',
+ *       data: [10, 20, 15],
+ *       backgroundColor: ['#3366cc', '#dc3912', '#ff9900'],
+ *     }],
+ *   },
+ *   options: {
+ *     chartStyling: { height: 320 },
+ *     legend: { display: true, position: 'bottom' },
+ *     graph: { cutout: 0, showDataLabels: false },
+ *   },
  * }} />
  * ```
  */
@@ -1878,14 +1947,39 @@ export declare enum ScaleType {
 }
 
 /**
- * Renders Cartesian scatter points with optional annotations, data labels and a background gradient.
+ * Renders Cartesian points with a legend, optional annotations and a background gradient.
+ *
+ * Pass partial configuration through `chart`; omitted settings receive component defaults.
+ * The example uses sample data, labels and a height of 320 pixels; these are not default values.
+ *
+ * @remarks
+ * Defaults: automatic width and height, a bottom-left legend, zero included in automatic scale bounds,
+ * and annotations enabled. Zoom, pan, data labels, minor grid lines and the background gradient are disabled.
+ * Performance mode is enabled by default, disabling animations.
+ * The linked reference lists the complete normalized default configuration.
+ *
+ * @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#scatterchart
  *
- * @param props - Chart data and partial options; each point supplies X and Y coordinates.
- * @returns The chart canvas and legend.
+ * @param props - Chart data and options.
+ * @returns The chart canvas and its associated UI.
  * @example
  * ```tsx
  * <ScatterChart chart={{
- *   data: { datasets: [{ label: 'DS A', data: [{ x: 10, y: 20 }, { x: 20, y: 30 }] }] },
+ *   data: {
+ *     datasets: [{
+ *       label: 'DS A',
+ *       data: [{ x: 1, y: 10 }, { x: 2, y: 20 }, { x: 3, y: 15 }],
+ *     }],
+ *   },
+ *   options: {
+ *     axes: {
+ *       x: [{ label: 'X', position: 'bottom' }],
+ *       y: [{ label: 'Y', position: 'left' }],
+ *     },
+ *     chartStyling: { height: 320 },
+ *     legend: { display: true, position: 'bottom-left' },
+ *     graph: { showDataLabels: false, showMinorGridlines: false },
+ *   },
  * }} />
  * ```
  */

package/dist/index.js

@@ -24709,19 +24709,40 @@ var LineChart = (props) => {
 	}, getChartKey(state, languageKey));
 };
 /**
-* Renders an interactive Cartesian line chart with multiple axes, annotations and chart controls.
+* Renders an interactive line chart with multiple axes, annotations, a legend and chart controls.
 *
 * Pass partial configuration through `chart`; omitted settings receive component defaults.
-* The default tooltip title uses Y when the first X axis is at the top, and X otherwise.
-* The other coordinate is displayed beside the DS name. Custom callbacks override those defaults.
+* The example uses sample data, labels and a height of 320 pixels; these are not default values.
 *
-* @param props - Chart configuration and optional header, subheader and table content.
-* @returns The chart canvas, legend and controls.
+* @remarks
+* Defaults: bottom X axis, left Y axis, visible lines and points, bottom-left legend, and zoom enabled.
+* Pan, data labels, minor grid lines and annotations are disabled. No fixed width or height is assigned.
+* Performance mode is enabled by default, disabling animations.
+* The linked reference lists the complete normalized default configuration.
+*
+* @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#linechart
+*
+* @param props - Chart data and options, plus optional header, subheader and table content.
+* @returns The chart canvas and its associated UI.
 * @example
 * ```tsx
 * <LineChart chart={{
-*   data: { datasets: [{ label: 'DS A', data: [{ x: 10, y: 20 }] }] },
-*   options: { tooltip: { scientificNotation: false } },
+*   data: {
+*     datasets: [{
+*       label: 'DS A',
+*       data: [{ x: 0, y: 10 }, { x: 1, y: 20 }, { x: 2, y: 15 }],
+*     }],
+*   },
+*   options: {
+*     axes: {
+*       x: [{ label: 'X', position: 'bottom' }],
+*       y: [{ label: 'Y', position: 'left' }],
+*     },
+*     chartStyling: { height: 320 },
+*     legend: { display: true, position: 'bottom-left' },
+*     graph: { lineTension: 0.01, showDataLabels: false },
+*     chartOptions: { showLine: true, showPoints: true },
+*   },
 * }} />
 * ```
 */
@@ -25018,15 +25039,37 @@ var PieChart = (props) => {
 	});
 };
 /**
-* Renders a pie chart with configurable legends, data labels and an optional inner cutout.
+* Renders pie segments with optional data labels, a legend and an inner cutout.
+*
+* Pass partial configuration through `chart`; omitted settings receive component defaults.
+* The example uses sample data, labels and a height of 320 pixels; these are not default values.
 *
-* @param props - Chart data and partial options. Set `chart.options.graph.cutout` for an inner opening.
-* @returns The chart canvas and legend.
+* @remarks
+* Defaults: a full pie (cutout 0), a bottom legend, and no fixed width or height.
+* Data labels, stacking, zoom and pan are disabled. Pie charts do not have Cartesian axes.
+* Performance mode is enabled by default, disabling animations.
+* The linked reference lists the complete normalized default configuration.
+*
+* @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#piechart
+*
+* @param props - Chart data and options.
+* @returns The chart canvas and its associated UI.
 * @example
 * ```tsx
 * <PieChart chart={{
-*   data: { labels: ['A', 'B'], datasets: [{ label: 'DS A', data: [10, 20] }] },
-*   options: { graph: { cutout: '50%' } },
+*   data: {
+*     labels: ['A', 'B', 'C'],
+*     datasets: [{
+*       label: 'DS A',
+*       data: [10, 20, 15],
+*       backgroundColor: ['#3366cc', '#dc3912', '#ff9900'],
+*     }],
+*   },
+*   options: {
+*     chartStyling: { height: 320 },
+*     legend: { display: true, position: 'bottom' },
+*     graph: { cutout: 0, showDataLabels: false },
+*   },
 * }} />
 * ```
 */
@@ -39388,15 +39431,41 @@ var BarChart = (props) => {
 	}, languageKey);
 };
 /**
-* Renders a Cartesian bar chart with optional stacking, annotations and interactive controls.
+* Renders vertical or horizontal bars with optional stacking, annotations and a legend.
+*
+* Pass partial configuration through `chart`; omitted settings receive component defaults.
+* The example uses sample data, labels and a height of 320 pixels; these are not default values.
+*
+* @remarks
+* Defaults: vertical bars, a top-left legend, zero included in automatic scale bounds, and annotations enabled.
+* Zoom, pan, stacking and data labels are disabled. No fixed width or height is assigned.
+* Performance mode is enabled by default, disabling animations.
+* The linked reference lists the complete normalized default configuration.
 *
-* @param props - Chart data and partial options. `options.direction` selects vertical or horizontal bars.
-* @returns The chart canvas, legend and controls.
+* @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#barchart
+*
+* @param props - Chart data and options.
+* @returns The chart canvas and its associated UI.
 * @example
 * ```tsx
 * <BarChart chart={{
-*   data: { labels: ['A'], datasets: [{ label: 'DS A', data: [{ x: 'A', y: 10 }] }] },
-*   options: { direction: 'vertical' },
+*   data: {
+*     labels: ['A', 'B', 'C'],
+*     datasets: [{
+*       label: 'DS A',
+*       data: [{ x: 'A', y: 10 }, { x: 'B', y: 20 }, { x: 'C', y: 15 }],
+*     }],
+*   },
+*   options: {
+*     direction: 'vertical',
+*     axes: {
+*       x: [{ label: 'Category', position: 'bottom' }],
+*       y: [{ label: 'Value', position: 'left' }],
+*     },
+*     chartStyling: { height: 320 },
+*     legend: { display: true, position: 'top-left' },
+*     graph: { showDataLabels: false },
+*   },
 * }} />
 * ```
 */
@@ -39799,14 +39868,39 @@ var ScatterChart = (props) => {
 	});
 };
 /**
-* Renders Cartesian scatter points with optional annotations, data labels and a background gradient.
+* Renders Cartesian points with a legend, optional annotations and a background gradient.
+*
+* Pass partial configuration through `chart`; omitted settings receive component defaults.
+* The example uses sample data, labels and a height of 320 pixels; these are not default values.
+*
+* @remarks
+* Defaults: automatic width and height, a bottom-left legend, zero included in automatic scale bounds,
+* and annotations enabled. Zoom, pan, data labels, minor grid lines and the background gradient are disabled.
+* Performance mode is enabled by default, disabling animations.
+* The linked reference lists the complete normalized default configuration.
+*
+* @see https://gitlab.com/oliasoft-open-source/charts-library/-/blob/master/README.md#scatterchart
 *
-* @param props - Chart data and partial options; each point supplies X and Y coordinates.
-* @returns The chart canvas and legend.
+* @param props - Chart data and options.
+* @returns The chart canvas and its associated UI.
 * @example
 * ```tsx
 * <ScatterChart chart={{
-*   data: { datasets: [{ label: 'DS A', data: [{ x: 10, y: 20 }, { x: 20, y: 30 }] }] },
+*   data: {
+*     datasets: [{
+*       label: 'DS A',
+*       data: [{ x: 1, y: 10 }, { x: 2, y: 20 }, { x: 3, y: 15 }],
+*     }],
+*   },
+*   options: {
+*     axes: {
+*       x: [{ label: 'X', position: 'bottom' }],
+*       y: [{ label: 'Y', position: 'left' }],
+*     },
+*     chartStyling: { height: 320 },
+*     legend: { display: true, position: 'bottom-left' },
+*     graph: { showDataLabels: false, showMinorGridlines: false },
+*   },
 * }} />
 * ```
 */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/charts-library",
-  "version": "7.0.1-beta-1",
+  "version": "7.0.1",
   "description": "React Chart Library (based on Chart.js and react-chart-js-2)",
   "homepage": "https://gitlab.com/oliasoft-open-source/charts-library",
   "bugs": {