@fluentui/react-charts 9.3.5 → 9.3.6

package/lib-commonjs/AnnotationOnlyChart.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/AnnotationOnlyChart/index"), exports);

package/lib-commonjs/AnnotationOnlyChart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/AnnotationOnlyChart.ts"],"sourcesContent":["export * from './components/AnnotationOnlyChart/index';\n"],"names":[],"mappings":";;;;;uBAAc,yCAAyC"}

package/lib-commonjs/components/AnnotationOnlyChart/AnnotationOnlyChart.js

@@ -0,0 +1,219 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "AnnotationOnlyChart", {
+    enumerable: true,
+    get: function() {
+        return AnnotationOnlyChart;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _ChartAnnotationLayer = require("../CommonComponents/Annotations/ChartAnnotationLayer");
+const _imageexportutils = require("../../utilities/image-export-utils");
+const _utilities = require("../../utilities");
+const _useAnnotationOnlyChartStylesstyles = require("./useAnnotationOnlyChartStyles.styles");
+const DEFAULT_HEIGHT = 650;
+const FALLBACK_WIDTH = 400;
+const buildPadding = (margin)=>{
+    if (!margin) {
+        return undefined;
+    }
+    var _margin_t;
+    const top = (_margin_t = margin.t) !== null && _margin_t !== void 0 ? _margin_t : 0;
+    var _margin_r;
+    const right = (_margin_r = margin.r) !== null && _margin_r !== void 0 ? _margin_r : 0;
+    var _margin_b;
+    const bottom = (_margin_b = margin.b) !== null && _margin_b !== void 0 ? _margin_b : 0;
+    var _margin_l;
+    const left = (_margin_l = margin.l) !== null && _margin_l !== void 0 ? _margin_l : 0;
+    if (top === 0 && right === 0 && bottom === 0 && left === 0) {
+        return undefined;
+    }
+    return `${top}px ${right}px ${bottom}px ${left}px`;
+};
+const AnnotationOnlyChart = (props)=>{
+    const { annotations, chartTitle, description, width, height, paperBackgroundColor, plotBackgroundColor, fontColor, fontFamily, margin, componentRef } = props;
+    const isRtl = (0, _utilities.useRtl)();
+    const classes = (0, _useAnnotationOnlyChartStylesstyles.useAnnotationOnlyChartStyles)();
+    const containerRef = _react.useRef(null);
+    const contentRef = _react.useRef(null);
+    const [measuredWidth, setMeasuredWidth] = _react.useState(width !== null && width !== void 0 ? width : 0);
+    const [contentHeight, setContentHeight] = _react.useState(height !== null && height !== void 0 ? height : DEFAULT_HEIGHT);
+    _react.useEffect(()=>{
+        if (typeof width === 'number' && width > 0) {
+            setMeasuredWidth(width);
+            return;
+        }
+        const node = containerRef.current;
+        if (!node || typeof ResizeObserver === 'undefined') {
+            const rect = node === null || node === void 0 ? void 0 : node.getBoundingClientRect();
+            if (rect && rect.width > 0) {
+                setMeasuredWidth(rect.width);
+            } else {
+                setMeasuredWidth((prev)=>prev > 0 ? prev : FALLBACK_WIDTH);
+            }
+            return;
+        }
+        const observer = new ResizeObserver((entries)=>{
+            const entry = entries[0];
+            if (!entry) {
+                return;
+            }
+            const newWidth = entry.contentRect.width;
+            if (newWidth > 0 && Math.abs(newWidth - measuredWidth) > 0.5) {
+                setMeasuredWidth(newWidth);
+            }
+        });
+        const rect = node.getBoundingClientRect();
+        if (rect.width > 0) {
+            setMeasuredWidth(rect.width);
+        }
+        observer.observe(node);
+        return ()=>observer.disconnect();
+    }, [
+        width,
+        measuredWidth
+    ]);
+    const resolvedWidth = Math.max(measuredWidth || FALLBACK_WIDTH, 1);
+    const resolvedHeight = Math.max(height !== null && height !== void 0 ? height : DEFAULT_HEIGHT, 1);
+    _react.useEffect(()=>{
+        const node = contentRef.current;
+        if (!node) {
+            setContentHeight((prev)=>prev > 0 ? prev : resolvedHeight);
+            return;
+        }
+        if (typeof ResizeObserver === 'undefined') {
+            const rect = node.getBoundingClientRect();
+            setContentHeight((prev)=>rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight);
+            return;
+        }
+        const observer = new ResizeObserver((entries)=>{
+            const entry = entries[0];
+            if (!entry) {
+                return;
+            }
+            const newHeight = entry.contentRect.height;
+            if (newHeight > 0) {
+                setContentHeight((prev)=>Math.abs(prev - newHeight) > 0.5 ? newHeight : prev);
+            }
+        });
+        const rect = node.getBoundingClientRect();
+        setContentHeight((prev)=>rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight);
+        observer.observe(node);
+        return ()=>observer.disconnect();
+    }, [
+        resolvedHeight,
+        resolvedWidth,
+        annotations,
+        chartTitle,
+        description,
+        margin,
+        plotBackgroundColor,
+        paperBackgroundColor,
+        fontColor,
+        fontFamily
+    ]);
+    const svgHeight = Math.max(Math.ceil(contentHeight || 0), resolvedHeight);
+    const context = {
+        plotRect: {
+            x: 0,
+            y: 0,
+            width: resolvedWidth,
+            height: resolvedHeight
+        },
+        svgRect: {
+            width: resolvedWidth,
+            height: resolvedHeight
+        },
+        isRtl
+    };
+    const padding = buildPadding(margin);
+    // Inline styles for dynamic values that can't be in makeStyles
+    const rootStyle = _react.useMemo(()=>({
+            width: width ? `${width}px` : '100%',
+            minHeight: resolvedHeight,
+            ...paperBackgroundColor && {
+                backgroundColor: paperBackgroundColor
+            },
+            ...fontColor && {
+                color: fontColor
+            },
+            ...fontFamily && {
+                fontFamily
+            },
+            ...padding && {
+                padding
+            }
+        }), [
+        fontColor,
+        fontFamily,
+        paperBackgroundColor,
+        padding,
+        resolvedHeight,
+        width
+    ]);
+    const contentStyle = _react.useMemo(()=>({
+            ...plotBackgroundColor && {
+                backgroundColor: plotBackgroundColor
+            }
+        }), [
+        plotBackgroundColor
+    ]);
+    const resolvedAnnotations = annotations !== null && annotations !== void 0 ? annotations : [];
+    const hasAnnotations = resolvedAnnotations.length > 0;
+    const ariaLabel = hasAnnotations ? description !== null && description !== void 0 ? description : chartTitle : undefined;
+    _react.useImperativeHandle(componentRef, ()=>{
+        const chartHandle = {
+            chartContainer: containerRef.current,
+            toImage: (opts)=>{
+                if (!containerRef.current) {
+                    return Promise.reject(new Error('Chart container is not defined'));
+                }
+                return (0, _imageexportutils.toImage)(containerRef.current, undefined, isRtl, opts);
+            }
+        };
+        return chartHandle;
+    }, [
+        isRtl
+    ]);
+    return /*#__PURE__*/ _react.createElement("div", {
+        ref: containerRef,
+        "data-chart-annotation-container": "true"
+    }, /*#__PURE__*/ _react.createElement("svg", {
+        width: resolvedWidth,
+        height: svgHeight,
+        viewBox: `0 0 ${resolvedWidth} ${svgHeight}`,
+        style: {
+            width: width ? `${width}px` : '100%',
+            height: `${svgHeight}px`,
+            display: 'block'
+        },
+        role: ariaLabel ? 'img' : undefined,
+        "aria-label": ariaLabel
+    }, /*#__PURE__*/ _react.createElement("foreignObject", {
+        x: 0,
+        y: 0,
+        width: resolvedWidth,
+        height: svgHeight
+    }, /*#__PURE__*/ _react.createElement("div", {
+        ref: contentRef,
+        className: classes.root,
+        style: rootStyle,
+        "data-chart-annotation-only": "true",
+        "aria-label": ariaLabel
+    }, chartTitle && /*#__PURE__*/ _react.createElement("span", {
+        className: classes.title,
+        "aria-hidden": "true"
+    }, chartTitle), /*#__PURE__*/ _react.createElement("div", {
+        className: classes.content,
+        style: contentStyle,
+        role: "presentation"
+    }, hasAnnotations ? /*#__PURE__*/ _react.createElement(_ChartAnnotationLayer.ChartAnnotationLayer, {
+        annotations: resolvedAnnotations,
+        context: context
+    }) : null)))));
+};
+AnnotationOnlyChart.displayName = 'AnnotationOnlyChart';

package/lib-commonjs/components/AnnotationOnlyChart/AnnotationOnlyChart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AnnotationOnlyChart/AnnotationOnlyChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ChartAnnotationLayer } from '../CommonComponents/Annotations/ChartAnnotationLayer';\nimport { toImage as exportToImage } from '../../utilities/image-export-utils';\nimport { useRtl } from '../../utilities';\nimport { useAnnotationOnlyChartStyles } from './useAnnotationOnlyChartStyles.styles';\nimport type { AnnotationOnlyChartProps } from './AnnotationOnlyChart.types';\nimport type { Chart, ImageExportOptions } from '../../types/index';\nimport type { ChartAnnotationContext } from '../CommonComponents/Annotations/ChartAnnotationLayer.types';\n\nconst DEFAULT_HEIGHT = 650;\nconst FALLBACK_WIDTH = 400;\n\nconst buildPadding = (margin: AnnotationOnlyChartProps['margin']): string | undefined => {\n  if (!margin) {\n    return undefined;\n  }\n\n  const top = margin.t ?? 0;\n  const right = margin.r ?? 0;\n  const bottom = margin.b ?? 0;\n  const left = margin.l ?? 0;\n\n  if (top === 0 && right === 0 && bottom === 0 && left === 0) {\n    return undefined;\n  }\n\n  return `${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nexport const AnnotationOnlyChart: React.FC<AnnotationOnlyChartProps> = props => {\n  const {\n    annotations,\n    chartTitle,\n    description,\n    width,\n    height,\n    paperBackgroundColor,\n    plotBackgroundColor,\n    fontColor,\n    fontFamily,\n    margin,\n    componentRef,\n  } = props;\n\n  const isRtl = useRtl();\n  const classes = useAnnotationOnlyChartStyles();\n  const containerRef = React.useRef<HTMLDivElement | null>(null);\n  const contentRef = React.useRef<HTMLDivElement | null>(null);\n  const [measuredWidth, setMeasuredWidth] = React.useState<number>(width ?? 0);\n  const [contentHeight, setContentHeight] = React.useState<number>(height ?? DEFAULT_HEIGHT);\n\n  React.useEffect(() => {\n    if (typeof width === 'number' && width > 0) {\n      setMeasuredWidth(width);\n      return;\n    }\n\n    const node = containerRef.current;\n    if (!node || typeof ResizeObserver === 'undefined') {\n      const rect = node?.getBoundingClientRect();\n      if (rect && rect.width > 0) {\n        setMeasuredWidth(rect.width);\n      } else {\n        setMeasuredWidth(prev => (prev > 0 ? prev : FALLBACK_WIDTH));\n      }\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n      const newWidth = entry.contentRect.width;\n      if (newWidth > 0 && Math.abs(newWidth - measuredWidth) > 0.5) {\n        setMeasuredWidth(newWidth);\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    if (rect.width > 0) {\n      setMeasuredWidth(rect.width);\n    }\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [width, measuredWidth]);\n\n  const resolvedWidth = Math.max(measuredWidth || FALLBACK_WIDTH, 1);\n  const resolvedHeight = Math.max(height ?? DEFAULT_HEIGHT, 1);\n\n  React.useEffect(() => {\n    const node = contentRef.current;\n    if (!node) {\n      setContentHeight(prev => (prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    if (typeof ResizeObserver === 'undefined') {\n      const rect = node.getBoundingClientRect();\n      setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n\n      const newHeight = entry.contentRect.height;\n      if (newHeight > 0) {\n        setContentHeight(prev => (Math.abs(prev - newHeight) > 0.5 ? newHeight : prev));\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [\n    resolvedHeight,\n    resolvedWidth,\n    annotations,\n    chartTitle,\n    description,\n    margin,\n    plotBackgroundColor,\n    paperBackgroundColor,\n    fontColor,\n    fontFamily,\n  ]);\n\n  const svgHeight = Math.max(Math.ceil(contentHeight || 0), resolvedHeight);\n\n  const context: ChartAnnotationContext = {\n    plotRect: { x: 0, y: 0, width: resolvedWidth, height: resolvedHeight },\n    svgRect: { width: resolvedWidth, height: resolvedHeight },\n    isRtl,\n  };\n\n  const padding = buildPadding(margin);\n\n  // Inline styles for dynamic values that can't be in makeStyles\n  const rootStyle: React.CSSProperties = React.useMemo(\n    () => ({\n      width: width ? `${width}px` : '100%',\n      minHeight: resolvedHeight,\n      ...(paperBackgroundColor && { backgroundColor: paperBackgroundColor }),\n      ...(fontColor && { color: fontColor }),\n      ...(fontFamily && { fontFamily }),\n      ...(padding && { padding }),\n    }),\n    [fontColor, fontFamily, paperBackgroundColor, padding, resolvedHeight, width],\n  );\n\n  const contentStyle: React.CSSProperties = React.useMemo(\n    () => ({\n      ...(plotBackgroundColor && { backgroundColor: plotBackgroundColor }),\n    }),\n    [plotBackgroundColor],\n  );\n\n  const resolvedAnnotations = annotations ?? [];\n  const hasAnnotations = resolvedAnnotations.length > 0;\n  const ariaLabel = hasAnnotations ? description ?? chartTitle : undefined;\n\n  React.useImperativeHandle(\n    componentRef,\n    () => {\n      const chartHandle: Chart = {\n        chartContainer: containerRef.current,\n        toImage: (opts?: ImageExportOptions) => {\n          if (!containerRef.current) {\n            return Promise.reject(new Error('Chart container is not defined'));\n          }\n\n          return exportToImage(containerRef.current, undefined, isRtl, opts);\n        },\n      };\n\n      return chartHandle;\n    },\n    [isRtl],\n  );\n\n  return (\n    <div ref={containerRef} data-chart-annotation-container=\"true\">\n      <svg\n        width={resolvedWidth}\n        height={svgHeight}\n        viewBox={`0 0 ${resolvedWidth} ${svgHeight}`}\n        style={{ width: width ? `${width}px` : '100%', height: `${svgHeight}px`, display: 'block' }}\n        role={ariaLabel ? 'img' : undefined}\n        aria-label={ariaLabel}\n      >\n        <foreignObject x={0} y={0} width={resolvedWidth} height={svgHeight}>\n          <div\n            ref={contentRef}\n            className={classes.root}\n            style={rootStyle}\n            data-chart-annotation-only=\"true\"\n            aria-label={ariaLabel}\n          >\n            {chartTitle && (\n              <span className={classes.title} aria-hidden=\"true\">\n                {chartTitle}\n              </span>\n            )}\n            <div className={classes.content} style={contentStyle} role=\"presentation\">\n              {hasAnnotations ? <ChartAnnotationLayer annotations={resolvedAnnotations} context={context} /> : null}\n            </div>\n          </div>\n        </foreignObject>\n      </svg>\n    </div>\n  );\n};\n\nAnnotationOnlyChart.displayName = 'AnnotationOnlyChart';\n"],"names":["React","ChartAnnotationLayer","toImage","exportToImage","useRtl","useAnnotationOnlyChartStyles","DEFAULT_HEIGHT","FALLBACK_WIDTH","buildPadding","margin","undefined","top","t","right","r","bottom","b","left","l","AnnotationOnlyChart","props","annotations","chartTitle","description","width","height","paperBackgroundColor","plotBackgroundColor","fontColor","fontFamily","componentRef","isRtl","classes","containerRef","useRef","contentRef","measuredWidth","setMeasuredWidth","useState","contentHeight","setContentHeight","useEffect","node","current","ResizeObserver","rect","getBoundingClientRect","prev","observer","entries","entry","newWidth","contentRect","Math","abs","observe","disconnect","resolvedWidth","max","resolvedHeight","newHeight","svgHeight","ceil","context","plotRect","x","y","svgRect","padding","rootStyle","useMemo","minHeight","backgroundColor","color","contentStyle","resolvedAnnotations","hasAnnotations","length","ariaLabel","useImperativeHandle","chartHandle","chartContainer","opts","Promise","reject","Error","div","ref","data-chart-annotation-container","svg","viewBox","style","display","role","aria-label","foreignObject","className","root","data-chart-annotation-only","span","title","aria-hidden","content","displayName"],"mappings":"AAAA;;;;;+BA+BamB;;;;;;;iEA7BU,QAAQ;sCACM,uDAAuD;kCACnD,qCAAqC;2BACvD,kBAAkB;oDACI,wCAAwC;AAKrF,MAAMb,iBAAiB;AACvB,MAAMC,iBAAiB;AAEvB,MAAMC,eAAe,CAACC;IACpB,IAAI,CAACA,QAAQ;QACX,OAAOC;IACT;QAEYD;IAAZ,MAAME,MAAMF,CAAAA,YAAAA,QAAOG,AAAC,MAAA,QAARH,cAAAA,KAAAA,IAAAA,YAAY;QACVA;IAAd,MAAMI,QAAQJ,aAAAA,OAAOK,CAAC,MAAA,QAARL,cAAAA,KAAAA,IAAAA,YAAY;QACXA;IAAf,MAAMM,SAASN,CAAAA,YAAAA,OAAOO,CAAC,MAAA,QAARP,cAAAA,KAAAA,IAAAA,YAAY;QACdA;IAAb,MAAMQ,OAAOR,CAAAA,YAAAA,OAAOS,CAAC,MAAA,QAART,cAAAA,KAAAA,IAAAA,YAAY;IAEzB,IAAIE,QAAQ,KAAKE,UAAU,KAAKE,WAAW,KAAKE,SAAS,GAAG;QAC1D,OAAOP;IACT;IAEA,OAAO,GAAGC,IAAI,GAAG,EAAEE,MAAM,GAAG,EAAEE,OAAO,GAAG,EAAEE,KAAK,EAAE,CAAC;AACpD;AAEO,4BAAgEG,CAAAA;IACrE,MAAM,EACJC,WAAW,EACXC,UAAU,EACVC,WAAW,EACXC,KAAK,EACLC,MAAM,EACNC,oBAAoB,EACpBC,mBAAmB,EACnBC,SAAS,EACTC,UAAU,EACVpB,MAAM,EACNqB,YAAY,EACb,GAAGV;IAEJ,MAAMW,YAAQ3B,iBAAAA;IACd,MAAM4B,cAAU3B,gEAAAA;IAChB,MAAM4B,eAAejC,OAAMkC,MAAM,CAAwB;IACzD,MAAMC,aAAanC,OAAMkC,MAAM,CAAwB;IACvD,MAAM,CAACE,eAAeC,iBAAiB,GAAGrC,OAAMsC,QAAQ,CAASd,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,QAAS;IAC1E,MAAM,CAACe,eAAeC,iBAAiB,GAAGxC,OAAMsC,QAAQ,CAASb,WAAAA,QAAAA,WAAAA,KAAAA,IAAAA,SAAUnB;IAE3EN,OAAMyC,SAAS,CAAC;QACd,IAAI,OAAOjB,UAAU,YAAYA,QAAQ,GAAG;YAC1Ca,iBAAiBb;YACjB;QACF;QAEA,MAAMkB,OAAOT,aAAaU,OAAO;QACjC,IAAI,CAACD,QAAQ,OAAOE,mBAAmB,aAAa;YAClD,MAAMC,OAAOH,SAAAA,QAAAA,SAAAA,KAAAA,IAAAA,KAAAA,IAAAA,KAAMI,qBAAqB;YACxC,IAAID,QAAQA,KAAKrB,KAAK,GAAG,GAAG;gBAC1Ba,iBAAiBQ,KAAKrB,KAAK;YAC7B,OAAO;gBACLa,iBAAiBU,CAAAA,OAASA,OAAO,IAAIA,OAAOxC;YAC9C;YACA;QACF;QAEA,MAAMyC,WAAW,IAAIJ,eAAeK,CAAAA;YAClC,MAAMC,QAAQD,OAAO,CAAC,EAAE;YACxB,IAAI,CAACC,OAAO;gBACV;YACF;YACA,MAAMC,WAAWD,MAAME,WAAW,CAAC5B,KAAK;YACxC,IAAI2B,WAAW,KAAKE,KAAKC,GAAG,CAACH,WAAWf,iBAAiB,KAAK;gBAC5DC,iBAAiBc;YACnB;QACF;QAEA,MAAMN,OAAOH,KAAKI,qBAAqB;QACvC,IAAID,KAAKrB,KAAK,GAAG,GAAG;YAClBa,iBAAiBQ,KAAKrB,KAAK;QAC7B;QAEAwB,SAASO,OAAO,CAACb;QACjB,OAAO,IAAMM,SAASQ,UAAU;IAClC,GAAG;QAAChC;QAAOY;KAAc;IAEzB,MAAMqB,gBAAgBJ,KAAKK,GAAG,CAACtB,iBAAiB7B,gBAAgB;IAChE,MAAMoD,iBAAiBN,KAAKK,GAAG,CAACjC,WAAAA,QAAAA,WAAAA,KAAAA,IAAAA,SAAUnB,gBAAgB;IAE1DN,OAAMyC,SAAS,CAAC;QACd,MAAMC,OAAOP,WAAWQ,OAAO;QAC/B,IAAI,CAACD,MAAM;YACTF,iBAAiBO,CAAAA,OAASA,OAAO,IAAIA,OAAOY;YAC5C;QACF;QAEA,IAAI,OAAOf,mBAAmB,aAAa;YACzC,MAAMC,OAAOH,KAAKI,qBAAqB;YACvCN,iBAAiBO,CAAAA,OAASF,KAAKpB,MAAM,GAAG,IAAIoB,KAAKpB,MAAM,GAAGsB,OAAO,IAAIA,OAAOY;YAC5E;QACF;QAEA,MAAMX,WAAW,IAAIJ,eAAeK,CAAAA;YAClC,MAAMC,QAAQD,OAAO,CAAC,EAAE;YACxB,IAAI,CAACC,OAAO;gBACV;YACF;YAEA,MAAMU,YAAYV,MAAME,WAAW,CAAC3B,MAAM;YAC1C,IAAImC,YAAY,GAAG;gBACjBpB,iBAAiBO,CAAAA,OAASM,KAAKC,GAAG,CAACP,OAAOa,aAAa,MAAMA,YAAYb;YAC3E;QACF;QAEA,MAAMF,OAAOH,KAAKI,qBAAqB;QACvCN,iBAAiBO,CAAAA,OAASF,KAAKpB,MAAM,GAAG,IAAIoB,KAAKpB,MAAM,GAAGsB,OAAO,IAAIA,OAAOY;QAE5EX,SAASO,OAAO,CAACb;QACjB,OAAO,IAAMM,SAASQ,UAAU;IAClC,GAAG;QACDG;QACAF;QACApC;QACAC;QACAC;QACAd;QACAkB;QACAD;QACAE;QACAC;KACD;IAED,MAAMgC,YAAYR,KAAKK,GAAG,CAACL,KAAKS,IAAI,CAACvB,iBAAiB,IAAIoB;IAE1D,MAAMI,UAAkC;QACtCC,UAAU;YAAEC,GAAG;YAAGC,GAAG;YAAG1C,OAAOiC;YAAehC,QAAQkC;QAAe;QACrEQ,SAAS;YAAE3C,OAAOiC;YAAehC,QAAQkC;QAAe;QACxD5B;IACF;IAEA,MAAMqC,UAAU5D,aAAaC;IAE7B,+DAA+D;IAC/D,MAAM4D,YAAiCrE,OAAMsE,OAAO,CAClD,IAAO,CAAA;YACL9C,OAAOA,QAAQ,GAAGA,MAAM,EAAE,CAAC,GAAG;YAC9B+C,WAAWZ;YACX,GAAIjC,wBAAwB;gBAAE8C,iBAAiB9C;YAAqB,CAAC;YACrE,GAAIE,aAAa;gBAAE6C,OAAO7C;YAAU,CAAC;YACrC,GAAIC,cAAc;gBAAEA;YAAW,CAAC;YAChC,GAAIuC,WAAW;gBAAEA;YAAQ,CAAC;SAC5B,CAAA,EACA;QAACxC;QAAWC;QAAYH;QAAsB0C;QAAST;QAAgBnC;KAAM;IAG/E,MAAMkD,eAAoC1E,OAAMsE,OAAO,CACrD,IAAO,CAAA;YACL,GAAI3C,uBAAuB;gBAAE6C,iBAAiB7C;YAAoB,CAAC;QACrE,CAAA,GACA;QAACA;KAAoB;IAGvB,MAAMgD,sBAAsBtD,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAe,EAAE;IAC7C,MAAMuD,iBAAiBD,oBAAoBE,MAAM,GAAG;IACpD,MAAMC,YAAYF,iBAAiBrD,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAeD,aAAaZ;IAE/DV,OAAM+E,mBAAmB,CACvBjD,cACA;QACE,MAAMkD,cAAqB;YACzBC,gBAAgBhD,aAAaU,OAAO;YACpCzC,SAAS,CAACgF;gBACR,IAAI,CAACjD,aAAaU,OAAO,EAAE;oBACzB,OAAOwC,QAAQC,MAAM,CAAC,IAAIC,MAAM;gBAClC;gBAEA,WAAOlF,yBAAAA,EAAc8B,aAAaU,OAAO,EAAEjC,WAAWqB,OAAOmD;YAC/D;QACF;QAEA,OAAOF;IACT,GACA;QAACjD;KAAM;IAGT,OAAA,WAAA,GACE,OAAA,aAAA,CAACuD,OAAAA;QAAIC,KAAKtD;QAAcuD,mCAAgC;qBACtD,OAAA,aAAA,CAACC,OAAAA;QACCjE,OAAOiC;QACPhC,QAAQoC;QACR6B,SAAS,CAAC,IAAI,EAAEjC,cAAc,CAAC,EAAEI,WAAW;QAC5C8B,OAAO;YAAEnE,OAAOA,QAAQ,GAAGA,MAAM,EAAE,CAAC,GAAG;YAAQC,QAAQ,GAAGoC,UAAU,EAAE,CAAC;YAAE+B,SAAS;QAAQ;QAC1FC,MAAMf,YAAY,QAAQpE;QAC1BoF,cAAYhB;qBAEZ,OAAA,aAAA,CAACiB,iBAAAA;QAAc9B,GAAG;QAAGC,GAAG;QAAG1C,OAAOiC;QAAehC,QAAQoC;qBACvD,OAAA,aAAA,CAACyB,OAAAA;QACCC,KAAKpD;QACL6D,WAAWhE,QAAQiE,IAAI;QACvBN,OAAOtB;QACP6B,8BAA2B;QAC3BJ,cAAYhB;OAEXxD,cAAAA,WAAAA,GACC,OAAA,aAAA,CAAC6E,QAAAA;QAAKH,WAAWhE,QAAQoE,KAAK;QAAEC,eAAY;OACzC/E,aAAAA,WAAAA,GAGL,OAAA,aAAA,CAACgE,OAAAA;QAAIU,WAAWhE,QAAQsE,OAAO;QAAEX,OAAOjB;QAAcmB,MAAK;OACxDjB,iBAAAA,WAAAA,GAAiB,OAAA,aAAA,CAAC3E,0CAAAA,EAAAA;QAAqBoB,aAAasD;QAAqBZ,SAASA;SAAc;AAO/G,EAAE;AAEF5C,oBAAoBoF,WAAW,GAAG"}

package/lib-commonjs/components/AnnotationOnlyChart/AnnotationOnlyChart.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

package/lib-commonjs/components/AnnotationOnlyChart/AnnotationOnlyChart.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AnnotationOnlyChart/AnnotationOnlyChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ChartAnnotation } from '../../types/ChartAnnotation';\nimport type { Chart } from '../../types/index';\nimport type { Margin } from '@fluentui/chart-utilities';\n\n/**\n * Props for the annotation-only chart renderer.\n */\nexport interface AnnotationOnlyChartProps {\n  /**\n   * Collection of annotations to render.\n   */\n  annotations: ChartAnnotation[];\n  /** Optional layout title extracted from the Plotly schema. */\n  chartTitle?: string;\n  /** Optional descriptive text for accessibility. */\n  description?: string;\n  /** Desired width in pixels (if absent the chart will grow to fit the container). */\n  width?: number;\n  /** Desired height in pixels. */\n  height?: number;\n  /** Paper/background colour specified in the Plotly layout. */\n  paperBackgroundColor?: string;\n  /** Plot area background colour specified in the Plotly layout. */\n  plotBackgroundColor?: string;\n  /** Global layout font colour. */\n  fontColor?: string;\n  /** Global layout font family. */\n  fontFamily?: string;\n  /** Layout margin converted to padding for the outer wrapper. */\n  margin?: Partial<Margin>;\n  /** Component ref propagated by the DeclarativeChart surface. */\n  componentRef?: React.RefObject<Chart>;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

package/lib-commonjs/components/AnnotationOnlyChart/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./AnnotationOnlyChart"), exports);
+_export_star._(require("./AnnotationOnlyChart.types"), exports);

package/lib-commonjs/components/AnnotationOnlyChart/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AnnotationOnlyChart/index.ts"],"sourcesContent":["export * from './AnnotationOnlyChart';\nexport * from './AnnotationOnlyChart.types';\n"],"names":[],"mappings":";;;;;uBAAc,wBAAwB;uBACxB,8BAA8B"}

package/lib-commonjs/components/AnnotationOnlyChart/useAnnotationOnlyChartStyles.styles.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAnnotationOnlyChartStyles", {
+    enumerable: true,
+    get: function() {
+        return useAnnotationOnlyChartStyles;
+    }
+});
+const _react = require("@griffel/react");
+const useAnnotationOnlyChartStyles = /*#__PURE__*/ (0, _react.__styles)({
+    root: {
+        qhf8xq: "f10pi13n",
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1vx9l62",
+        Belr9w4: "fn67r4l",
+        De3pzq: "fxugw4r",
+        sj55zd: "f19n0e5",
+        Bahqtrf: "fk6fouc"
+    },
+    content: {
+        qhf8xq: "f10pi13n",
+        Bh6795r: "fqerorx",
+        De3pzq: "f3rmtva",
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "ft85np5",
+        B7ck84d: "f1ewtqcl"
+    },
+    title: {
+        fsow6f: "f17mccla"
+    }
+}, {
+    d: [
+        ".f10pi13n{position:relative;}",
+        ".f22iagw{display:flex;}",
+        ".f1vx9l62{flex-direction:column;}",
+        ".fn67r4l{row-gap:8px;}",
+        ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
+        ".f19n0e5{color:var(--colorNeutralForeground1);}",
+        ".fk6fouc{font-family:var(--fontFamilyBase);}",
+        ".fqerorx{flex-grow:1;}",
+        ".f3rmtva{background-color:transparent;}",
+        [
+            ".ft85np5{border-radius:var(--borderRadiusMedium);}",
+            {
+                p: -1
+            }
+        ],
+        ".f1ewtqcl{box-sizing:border-box;}",
+        ".f17mccla{text-align:center;}"
+    ]
+});

package/lib-commonjs/components/AnnotationOnlyChart/useAnnotationOnlyChartStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAnnotationOnlyChartStyles.styles.js"],"sourcesContent":["import { makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const useAnnotationOnlyChartStyles = makeStyles({\n    root: {\n        position: 'relative',\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '8px',\n        backgroundColor: tokens.colorNeutralBackground1,\n        color: tokens.colorNeutralForeground1,\n        fontFamily: typographyStyles.body1.fontFamily\n    },\n    content: {\n        position: 'relative',\n        flexGrow: 1,\n        backgroundColor: 'transparent',\n        borderRadius: tokens.borderRadiusMedium,\n        boxSizing: 'border-box'\n    },\n    title: {\n        textAlign: 'center'\n    }\n});\n"],"names":["__styles","tokens","typographyStyles","useAnnotationOnlyChartStyles","root","qhf8xq","mc9l5x","Beiy3e4","Belr9w4","De3pzq","sj55zd","Bahqtrf","content","Bh6795r","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","B7ck84d","title","fsow6f","d","p"],"mappings":";;;;+BAEaG,4BAA4B;;;;;;uBAFd,gBAAgB;AAEpC,qCAAkC,WAAA,OAAGH,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,OAAA,EAAA;QAAAP,MAAA,EAAA;QAAAQ,OAAA,EAAA;QAAAJ,MAAA,EAAA;QAAAK,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;AAAA,CAoB3C,CAAC"}

package/lib-commonjs/components/AnnotationOnlyChart/useAnnotationOnlyChartStyles.styles.raw.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAnnotationOnlyChartStyles", {
+    enumerable: true,
+    get: function() {
+        return useAnnotationOnlyChartStyles;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const useAnnotationOnlyChartStyles = (0, _react.makeStyles)({
+    root: {
+        position: 'relative',
+        display: 'flex',
+        flexDirection: 'column',
+        rowGap: '8px',
+        backgroundColor: _reacttheme.tokens.colorNeutralBackground1,
+        color: _reacttheme.tokens.colorNeutralForeground1,
+        fontFamily: _reacttheme.typographyStyles.body1.fontFamily
+    },
+    content: {
+        position: 'relative',
+        flexGrow: 1,
+        backgroundColor: 'transparent',
+        borderRadius: _reacttheme.tokens.borderRadiusMedium,
+        boxSizing: 'border-box'
+    },
+    title: {
+        textAlign: 'center'
+    }
+});

package/lib-commonjs/components/AnnotationOnlyChart/useAnnotationOnlyChartStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AnnotationOnlyChart/useAnnotationOnlyChartStyles.styles.ts"],"sourcesContent":["import { makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const useAnnotationOnlyChartStyles = makeStyles({\n  root: {\n    position: 'relative',\n    display: 'flex',\n    flexDirection: 'column',\n    rowGap: '8px',\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    fontFamily: typographyStyles.body1.fontFamily,\n  },\n  content: {\n    position: 'relative',\n    flexGrow: 1,\n    backgroundColor: 'transparent',\n    borderRadius: tokens.borderRadiusMedium,\n    boxSizing: 'border-box',\n  },\n  title: {\n    textAlign: 'center',\n  },\n});\n"],"names":["makeStyles","tokens","typographyStyles","useAnnotationOnlyChartStyles","root","position","display","flexDirection","rowGap","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","fontFamily","body1","content","flexGrow","borderRadius","borderRadiusMedium","boxSizing","title","textAlign"],"mappings":";;;;+BAGaG;;;;;;uBAHc,iBAAiB;4BACH,wBAAwB;AAE1D,yCAAqCH,iBAAAA,EAAW;IACrDI,MAAM;QACJC,UAAU;QACVC,SAAS;QACTC,eAAe;QACfC,QAAQ;QACRC,iBAAiBR,kBAAAA,CAAOS,uBAAuB;QAC/CC,OAAOV,kBAAAA,CAAOW,uBAAuB;QACrCC,YAAYX,4BAAAA,CAAiBY,KAAK,CAACD,UAAU;IAC/C;IACAE,SAAS;QACPV,UAAU;QACVW,UAAU;QACVP,iBAAiB;QACjBQ,cAAchB,kBAAAA,CAAOiB,kBAAkB;QACvCC,WAAW;IACb;IACAC,OAAO;QACLC,WAAW;IACb;AACF,GAAG"}

package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js

@@ -33,7 +33,9 @@ const areaChartClassNames = {
     chartWrapper: '',
     svgTooltip: '',
     chart: '',
-    axisAnnotation: ''
+    axisAnnotation: '',
+    plotContainer: '',
+    annotationLayer: ''
 };
 const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     tooltip: {
@@ -43,16 +45,11 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
         Bg96gwp: "f1i3iumi",
         mc9l5x: "f22iagw",
         Beiy3e4: "f1vx9l62",
-        z8tnut: "f17mpqex",
-        z189sj: [
-            "f1vdfbxk",
-            "f1f5gg8d"
-        ],
-        Byoj8tv: "fdvome7",
-        uwmqm3: [
-            "f1f5gg8d",
-            "f1vdfbxk"
-        ],
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f1bnz8pu",
         qhf8xq: "f1euv43f",
         fsow6f: "f17mccla",
         Bhzewxz: "fr6rvge",
@@ -73,10 +70,12 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
         ".f1i3iumi{line-height:var(--lineHeightBase300);}",
         ".f22iagw{display:flex;}",
         ".f1vx9l62{flex-direction:column;}",
-        ".f17mpqex{padding-top:var(--spacingHorizontalS);}",
-        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
-        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
-        ".fdvome7{padding-bottom:var(--spacingHorizontalS);}",
+        [
+            ".f1bnz8pu{padding:var(--spacingHorizontalS);}",
+            {
+                p: -1
+            }
+        ],
         ".f1euv43f{position:absolute;}",
         ".f17mccla{text-align:center;}",
         ".fr6rvge{top:var(--spacingVerticalNone);}",

package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAreaChartStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { getTooltipStyle } from '../../utilities/index';\nexport const areaChartClassNames = {\n    tooltip: 'fui-ac__tooltip',\n    root: '',\n    xAxis: '',\n    yAxis: '',\n    legendContainer: '',\n    hover: '',\n    descriptionMessage: '',\n    axisTitle: '',\n    chartTitle: '',\n    opacityChangeOnHover: '',\n    shapeStyles: '',\n    chartWrapper: '',\n    svgTooltip: '',\n    chart: '',\n    axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n    tooltip: getTooltipStyle()\n});\n/**\n * Apply styling to the AreaChart slots based on the state\n */ export const useAreaChartStyles = (props)=>{\n    const baseStyles = useStyles();\n    return {\n        tooltip: mergeClasses(areaChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ )\n    };\n};\n"],"names":["__styles","mergeClasses","getTooltipStyle","areaChartClassNames","tooltip","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","d","p","useAreaChartStyles","props","baseStyles"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,mBAAmB;;;sBAsBG;;;;uBAxBM,gBAAgB;AAElD,4BAA4B;IAC/BC,OAAO,EAAE,iBAAiB;IAC1BC,IAAI,EAAE,EAAE;IACRC,KAAK,EAAE,EAAE;IACTC,KAAK,EAAE,EAAE;IACTC,eAAe,EAAE,EAAE;IACnBC,KAAK,EAAE,EAAE;IACTC,kBAAkB,EAAE,EAAE;IACtBC,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,oBAAoB,EAAE,EAAE;IACxBC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE,EAAE;IAChBC,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE,EAAE;IACTC,cAAc,EAAE;AACpB,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGnB,eAAA,EAAA;IAAAI,OAAA,EAAA;QAAAgB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;AAAA,CAEjB,CAAC;AAGS,MAAMC,sBAAsBC,KAAK,IAAG;IAC3C,MAAMC,UAAU,GAAG1B,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHf,OAAO,MAAEH,mBAAY,EAACE,mBAAmB,CAACC,OAAO,EAAEyC,UAAU,CAACzC,OAAO,CAAC,uBAAA,EAA0B;IACpG,CAAC;AACL,CAAC"}
+{"version":3,"sources":["useAreaChartStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { getTooltipStyle } from '../../utilities/index';\nexport const areaChartClassNames = {\n    tooltip: 'fui-ac__tooltip',\n    root: '',\n    xAxis: '',\n    yAxis: '',\n    legendContainer: '',\n    hover: '',\n    descriptionMessage: '',\n    axisTitle: '',\n    chartTitle: '',\n    opacityChangeOnHover: '',\n    shapeStyles: '',\n    chartWrapper: '',\n    svgTooltip: '',\n    chart: '',\n    axisAnnotation: '',\n    plotContainer: '',\n    annotationLayer: ''\n};\nconst useStyles = makeStyles({\n    tooltip: getTooltipStyle()\n});\n/**\n * Apply styling to the AreaChart slots based on the state\n */ export const useAreaChartStyles = (props)=>{\n    const baseStyles = useStyles();\n    return {\n        tooltip: mergeClasses(areaChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ )\n    };\n};\n"],"names":["__styles","mergeClasses","getTooltipStyle","areaChartClassNames","tooltip","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","plotContainer","annotationLayer","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","qhf8xq","fsow6f","Bhzewxz","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","d","p","useAreaChartStyles","props","baseStyles"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,mBAAmB;;;sBAwBG;;;;uBA1BM,gBAAgB;AAElD,4BAA4B;IAC/BC,OAAO,EAAE,iBAAiB;IAC1BC,IAAI,EAAE,EAAE;IACRC,KAAK,EAAE,EAAE;IACTC,KAAK,EAAE,EAAE;IACTC,eAAe,EAAE,EAAE;IACnBC,KAAK,EAAE,EAAE;IACTC,kBAAkB,EAAE,EAAE;IACtBC,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,oBAAoB,EAAE,EAAE;IACxBC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE,EAAE;IAChBC,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE,EAAE;IACTC,cAAc,EAAE,EAAE;IAClBC,aAAa,EAAE,EAAE;IACjBC,eAAe,EAAE;AACrB,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,GAAGrB,mBAAA,EAAA;IAAAI,OAAA,EAAA;QAAAkB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;AAAA,CAEjB,CAAC;AAGS,MAAMC,sBAAsBC,KAAK,IAAG;IAC3C,MAAMC,UAAU,GAAG3B,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHjB,OAAO,MAAEH,mBAAY,EAACE,mBAAmB,CAACC,OAAO,EAAE4C,UAAU,CAAC5C,OAAO,CAAC,uBAAA,EAA0B;IACpG,CAAC;AACL,CAAC"}

package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js

@@ -34,7 +34,9 @@ const areaChartClassNames = {
     chartWrapper: '',
     svgTooltip: '',
     chart: '',
-    axisAnnotation: ''
+    axisAnnotation: '',
+    plotContainer: '',
+    annotationLayer: ''
 };
 const useStyles = (0, _react.makeStyles)({
     tooltip: (0, _index.getTooltipStyle)()

package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AreaChart/useAreaChartStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { GriffelStyle, makeStyles, mergeClasses } from '@griffel/react';\nimport { AreaChartProps, AreaChartStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { getTooltipStyle } from '../../utilities/index';\n\nexport const areaChartClassNames: SlotClassNames<AreaChartStyles> = {\n  tooltip: 'fui-ac__tooltip',\n  root: '',\n  xAxis: '',\n  yAxis: '',\n  legendContainer: '',\n  hover: '',\n  descriptionMessage: '',\n  axisTitle: '',\n  chartTitle: '',\n  opacityChangeOnHover: '',\n  shapeStyles: '',\n  chartWrapper: '',\n  svgTooltip: '',\n  chart: '',\n  axisAnnotation: '',\n};\n\nconst useStyles = makeStyles({\n  tooltip: getTooltipStyle() as GriffelStyle,\n});\n\n/**\n * Apply styling to the AreaChart slots based on the state\n */\nexport const useAreaChartStyles = (props: AreaChartProps): AreaChartStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    tooltip: mergeClasses(areaChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n  };\n};\n"],"names":["makeStyles","mergeClasses","getTooltipStyle","areaChartClassNames","tooltip","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","useAreaChartStyles","props","baseStyles"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,mBAAAA;;;sBAyBAiB;;;;uBA9B0C,iBAAiB;uBAGxC,wBAAwB;AAEjD,4BAA6D;IAClEhB,SAAS;IACTC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,gBAAYnB,iBAAAA,EAAW;IAC3BI,aAASF,sBAAAA;AACX;AAKO,MAAMkB,qBAAqB,CAACC;IACjC,MAAMC,aAAaH;IAEnB,OAAO;QACLf,aAASH,mBAAAA,EAAaE,oBAAoBC,OAAO,EAAEkB,WAAWlB,OAAO,CAAC,uBAAuB;IAC/F;AACF,EAAE"}
+{"version":3,"sources":["../src/components/AreaChart/useAreaChartStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { GriffelStyle, makeStyles, mergeClasses } from '@griffel/react';\nimport { AreaChartProps, AreaChartStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { getTooltipStyle } from '../../utilities/index';\n\nexport const areaChartClassNames: SlotClassNames<AreaChartStyles> = {\n  tooltip: 'fui-ac__tooltip',\n  root: '',\n  xAxis: '',\n  yAxis: '',\n  legendContainer: '',\n  hover: '',\n  descriptionMessage: '',\n  axisTitle: '',\n  chartTitle: '',\n  opacityChangeOnHover: '',\n  shapeStyles: '',\n  chartWrapper: '',\n  svgTooltip: '',\n  chart: '',\n  axisAnnotation: '',\n  plotContainer: '',\n  annotationLayer: '',\n};\n\nconst useStyles = makeStyles({\n  tooltip: getTooltipStyle() as GriffelStyle,\n});\n\n/**\n * Apply styling to the AreaChart slots based on the state\n */\nexport const useAreaChartStyles = (props: AreaChartProps): AreaChartStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    tooltip: mergeClasses(areaChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n  };\n};\n"],"names":["makeStyles","mergeClasses","getTooltipStyle","areaChartClassNames","tooltip","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","plotContainer","annotationLayer","useStyles","useAreaChartStyles","props","baseStyles"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,mBAAAA;;;sBA2BAmB;;;;uBAhC0C,iBAAiB;uBAGxC,wBAAwB;AAEjD,4BAA6D;IAClElB,SAAS;IACTC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;IAChBC,eAAe;IACfC,iBAAiB;AACnB,EAAE;AAEF,MAAMC,gBAAYrB,iBAAAA,EAAW;IAC3BI,aAASF,sBAAAA;AACX;AAKO,MAAMoB,qBAAqB,CAACC;IACjC,MAAMC,aAAaH;IAEnB,OAAO;QACLjB,aAASH,mBAAAA,EAAaE,oBAAoBC,OAAO,EAAEoB,WAAWpB,OAAO,CAAC,uBAAuB;IAC/F;AACF,EAAE"}