@connectif/ui-components 2.0.9 → 2.0.10

package/dist/components/chart/BarChart.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import './EchartsConfig';
 import ReactEChartsCore from 'echarts-for-react/lib/core';
 import { sizes } from '../../theme/Typography';
@@ -42,6 +43,10 @@ export type BarChartProps = {
      * Formatter function used to format values shown in tooltip.
      */
     tooltipEntryFormatter?: ChartTooltipEntryFormatter;
+    /**
+     * Reference to chart component
+     */
+    chartRef?: React.RefObject<ReactEChartsCore>;
     /**
      * The series to display in the chart.
      */
@@ -97,5 +102,5 @@ export type BarChartProps = {
 /**
  * A bar chart component to display numeric data grouped by categories and series.
  */
-declare const BarChart: ({ style, isLoading, series, categories, labelColor, gridLineColor, gridLabelSize, yAxisLabelFormatter, tooltipEntryFormatter, onClick }: BarChartProps) => import("react/jsx-runtime").JSX.Element;
+declare const BarChart: ({ style, isLoading, series, categories, labelColor, gridLineColor, gridLabelSize, chartRef, yAxisLabelFormatter, tooltipEntryFormatter, onClick }: BarChartProps) => import("react/jsx-runtime").JSX.Element;
 export default BarChart;

package/dist/components/chart/LineChart.d.ts

@@ -1,4 +1,6 @@
+import * as React from 'react';
 import './EchartsConfig';
+import ReactEChartsCore from 'echarts-for-react/lib/core';
 import { CategorizedChartProps } from './CategorizedChartProps';
 import { IconId } from '../icon/Icon';
 import { IncrementLabelType } from '../../propTypes/IncrementLabel';
@@ -110,10 +112,14 @@ export type LineChartProps = CategorizedChartProps & {
      * Margin to add between labels and x axis. It will be in px
      */
     xAxisMargin?: number;
+    /**
+     * Reference to chart component
+     */
+    chartRef?: React.RefObject<ReactEChartsCore>;
 };
 /**
  * A line chart component to display numeric data grouped by categories and series.
  * Commonly, categories use to be sorted dates.
  */
-declare const LineChart: ({ style, isLoading, series, categories, yAxisLabelFormatter, ySecondaryAxisLabelFormatter, onClick, disableSeriesNames, disableAxes, disableSplitLine, fullGrid, axisFontSize, axisFontColor, yAxisPosition, xAxisMargin }: LineChartProps) => import("react/jsx-runtime").JSX.Element;
+declare const LineChart: ({ style, isLoading, series, categories, yAxisLabelFormatter, ySecondaryAxisLabelFormatter, onClick, disableSeriesNames, disableAxes, disableSplitLine, fullGrid, axisFontSize, axisFontColor, yAxisPosition, xAxisMargin, chartRef }: LineChartProps) => import("react/jsx-runtime").JSX.Element;
 export default LineChart;

package/dist/index.js

@@ -12020,6 +12020,7 @@ var BarChart2 = ({
   labelColor = grey400,
   gridLineColor = grey200,
   gridLabelSize = "sm",
+  chartRef,
   yAxisLabelFormatter = (value) => `${value}`,
   tooltipEntryFormatter = ({ data }) => ({
     text: `${data.tooltipName}: ${data.tooltipValue}`
@@ -12271,6 +12272,7 @@ var BarChart2 = ({
   ) : /* @__PURE__ */ jsx67(AutoSizer, { style: { height: "100%", width: "100%" }, children: ({ width: width2 }) => /* @__PURE__ */ jsx67(
     ReactEChartsCore,
     {
+      ref: chartRef,
       style: style3,
       echarts: echarts2,
       option: getEchartsOptions(width2),
@@ -12304,7 +12306,8 @@ var LineChart2 = ({
   axisFontSize = "11px",
   axisFontColor = grey400,
   yAxisPosition = "right",
-  xAxisMargin
+  xAxisMargin,
+  chartRef
 }) => {
   const theme2 = useTheme3();
   const cursor2 = onClick ? "pointer" : "default";
@@ -12674,6 +12677,7 @@ var LineChart2 = ({
             children: /* @__PURE__ */ jsx68(
               ReactEChartsCore2,
               {
+                ref: chartRef,
                 notMerge: true,
                 style: style3,
                 echarts: echarts3,