@connectif/ui-components 2.0.9 → 2.0.11

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';
@@ -90,10 +92,6 @@ export type LineChartProps = CategorizedChartProps & {
      * Option to disable split lines on X axe.
      */
     disableSplitLine?: boolean;
-    /**
-     * Option to enable full grid on the chart.
-     */
-    fullGrid?: boolean;
     /**
      * Font size to format the label of the Y axis.
      */
@@ -110,10 +108,23 @@ 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>;
+    /**
+     * Set grid internal margin
+     */
+    gridMargin?: {
+        left?: number;
+        top?: number;
+        bottom?: number;
+        right?: number;
+    };
 };
 /**
  * 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, axisFontSize, axisFontColor, yAxisPosition, xAxisMargin, chartRef, gridMargin }: 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),
@@ -12300,11 +12302,12 @@ var LineChart2 = ({
   disableSeriesNames = false,
   disableAxes = false,
   disableSplitLine = false,
-  fullGrid = false,
   axisFontSize = "11px",
   axisFontColor = grey400,
   yAxisPosition = "right",
-  xAxisMargin
+  xAxisMargin,
+  chartRef,
+  gridMargin
 }) => {
   const theme2 = useTheme3();
   const cursor2 = onClick ? "pointer" : "default";
@@ -12467,10 +12470,10 @@ var LineChart2 = ({
       formatter: tooltipFormatter
     },
     grid: {
-      left: 0,
-      right: 0,
-      top: fullGrid ? 0 : 16,
-      bottom: 0,
+      left: gridMargin?.left || 0,
+      right: gridMargin?.right || 0,
+      top: gridMargin?.top || 16,
+      bottom: gridMargin?.bottom || 0,
       containLabel: true
     },
     xAxis: {
@@ -12674,6 +12677,7 @@ var LineChart2 = ({
             children: /* @__PURE__ */ jsx68(
               ReactEChartsCore2,
               {
+                ref: chartRef,
                 notMerge: true,
                 style: style3,
                 echarts: echarts3,
@@ -24229,6 +24233,8 @@ var Loader_default = Loader;
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 import { styled as styled8 } from "@mui/material/styles";
+import remarkMath from "remark-math";
+import rehypeKatex from "rehype-katex";
 import { jsx as jsx136 } from "react/jsx-runtime";
 var MarkdownContainer = styled8("div")(
   ({ color: color2, backgroundColor: backgroundColor2 = "transparent", variant }) => ({
@@ -24287,13 +24293,24 @@ var MarkdownContainer = styled8("div")(
     },
     "& a:hover": {
       textDecoration: "underline"
+    },
+    "& .katex .katex-html": {
+      display: "none"
     }
   })
 );
 var MarkdownRenderer = ({
   text,
   ...rest
-}) => /* @__PURE__ */ jsx136(MarkdownContainer, { ...rest, children: /* @__PURE__ */ jsx136(ReactMarkdown, { remarkPlugins: [remarkGfm], skipHtml: true, children: text }) });
+}) => /* @__PURE__ */ jsx136(MarkdownContainer, { ...rest, children: /* @__PURE__ */ jsx136(
+  ReactMarkdown,
+  {
+    remarkPlugins: [remarkGfm, remarkMath],
+    rehypePlugins: [rehypeKatex],
+    skipHtml: true,
+    children: text
+  }
+) });
 var MarkdownRenderer_default = MarkdownRenderer;
 
 // src/components/navbar/Navbar.tsx
@@ -26374,7 +26391,7 @@ react-is/cjs/react-is.development.js:
 
 @mui/styled-engine/esm/index.js:
   (**
-   * @mui/styled-engine v7.2.0
+   * @mui/styled-engine v7.3.0
    *
    * @license MIT
    * This source code is licensed under the MIT license found in the
@@ -26383,7 +26400,7 @@ react-is/cjs/react-is.development.js:
 
 @mui/system/esm/index.js:
   (**
-   * @mui/system v7.2.0
+   * @mui/system v7.3.0
    *
    * @license MIT
    * This source code is licensed under the MIT license found in the