@fluentui/react-charts 0.0.0-nightly-20250514-0406.1 → 0.0.0-nightly-20250514-1518.1

package/lib-commonjs/components/CommonComponents/ChartPopover.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ChartPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: virtualElement, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderInlineStart: `4px solid ${props.color}`,\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>{convertToLocaleString(legend, props.culture)}</div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                  >\n                    {convertToLocaleString(YValue, props.culture)}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>{convertToLocaleString(props.ratio[0], props.culture)}</span>/\n                      <span className={classes.denominator}>\n                        {convertToLocaleString(props.ratio[1], props.culture)}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(props!.hoverXValue, props.culture)}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const { shouldDrawBorderBottom = false } = yValue;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = convertToLocaleString(xValue.y, culture);\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              marginTop: props.XValue ? '13px' : 'unset',\n              ...(!toDrawShape\n                ? {\n                    borderInlineStart: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY}>\n                {convertToLocaleString(\n                  xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                  culture,\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["ChartPopover","React","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","customCallout","customCalloutProps","classes","usePopoverStyles_unstable","legend","xCalloutValue","YValue","yCalloutValue","createElement","div","id","useId","ref","className","calloutContainer","Popover","positioning","target","autoSize","offset","coverTarget","open","isPopoverOpen","inline","PopoverSurface","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderInlineStart","color","calloutBlockContainer","calloutlegendText","convertToLocaleString","culture","calloutContentY","tokens","colorNeutralForeground1","Fragment","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","getAccessibleDataObject","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","fontSize","marginTop","Shape","svgProps","shapeStyles","pathProps","fill","shape","Points","Object","keys","pointTypes","mergeClasses","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","data","subcounts","subcountName","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["ChartPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: virtualElement, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderLeft: `4px solid ${props.color}`,\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>{convertToLocaleString(legend, props.culture)}</div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                  >\n                    {convertToLocaleString(YValue, props.culture)}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>{convertToLocaleString(props.ratio[0], props.culture)}</span>/\n                      <span className={classes.denominator}>\n                        {convertToLocaleString(props.ratio[1], props.culture)}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(props!.hoverXValue, props.culture)}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const { shouldDrawBorderBottom = false } = yValue;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = convertToLocaleString(xValue.y, culture);\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              marginTop: props.XValue ? '13px' : 'unset',\n              ...(!toDrawShape\n                ? {\n                    borderLeft: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY}>\n                {convertToLocaleString(\n                  xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                  culture,\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["ChartPopover","React","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","customCallout","customCalloutProps","classes","usePopoverStyles_unstable","legend","xCalloutValue","YValue","yCalloutValue","createElement","div","id","useId","ref","className","calloutContainer","Popover","positioning","target","autoSize","offset","coverTarget","open","isPopoverOpen","inline","PopoverSurface","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderLeft","color","calloutBlockContainer","calloutlegendText","convertToLocaleString","culture","calloutContentY","tokens","colorNeutralForeground1","Fragment","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","getAccessibleDataObject","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","fontSize","marginTop","Shape","svgProps","shapeStyles","pathProps","fill","shape","Points","Object","keys","pointTypes","mergeClasses","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","data","subcounts","subcountName","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js

@@ -26,9 +26,18 @@ const cartesianchartClassNames = {
     yAxis: 'fui-cart__yAxis',
     opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',
     legendContainer: 'fui-cart__legendContainer',
+    calloutContentRoot: 'fui-cart__calloutContentRoot',
+    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',
+    calloutContentX: 'fui-cart__calloutContentX',
+    calloutBlockContainer: 'fui-cart__calloutBlockContainer',
+    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',
+    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',
     shapeStyles: 'fui-cart__shapeStyles',
+    calloutlegendText: 'fui-cart__calloutlegendText',
+    calloutContentY: 'fui-cart__calloutContentY',
     descriptionMessage: 'fui-cart__descriptionMessage',
     hover: 'fui-cart__hover',
+    calloutInfoContainer: 'fui-cart__calloutInfoContainer',
     tooltip: 'fui-cart__tooltip',
     chartTitle: 'fui-cart__chartTitle'
 };
@@ -69,11 +78,14 @@ const cartesianchartClassNames = {
         D01gh: "f1wvrikb",
         vxuu72: "fidmvdy",
         lclgl4: "f1noc3f3",
-        zp1vxd: "f44ebzg",
+        Dzfv0s: "f1rtcel9",
+        s17mou: "f4w8oyz",
         jxu3ei: "fkuun",
         B3i31d3: "f1u7a78k",
         Bhcy8il: "f1myyn02",
-        z3m6do: "f1oca6e6",
+        t7r2jy: "f1ypwncy",
+        Bpf2t2a: "fs22wna",
+        J19x1g: "f19ju15u",
         se2xxg: "f1x8lysa"
     },
     yAxis: {
@@ -82,10 +94,13 @@ const cartesianchartClassNames = {
         vxuu72: "fidmvdy",
         lclgl4: "f1noc3f3",
         Bifops1: "fk6onyz",
-        zp1vxd: "f44ebzg",
+        Dzfv0s: "f1rtcel9",
+        s17mou: "f4w8oyz",
         jxu3ei: "fkuun",
         B3i31d3: "f1u7a78k",
-        z3m6do: "f1oca6e6",
+        t7r2jy: "f1ypwncy",
+        Bpf2t2a: "fs22wna",
+        J19x1g: "f19ju15u",
         se2xxg: "f1x8lysa"
     },
     rtl: {
@@ -102,6 +117,92 @@ const cartesianchartClassNames = {
             "ff3wqvv",
             "f1l2akhw"
         ]
+    },
+    calloutContentRoot: {
+        mc9l5x: "f13qh94s",
+        B68tc82: 0,
+        Bmxbyg5: 0,
+        Bpg54ce: "f1a3p1vp",
+        z8tnut: "f1dvrhzg",
+        z189sj: [
+            "fjnv7mu",
+            "fae8789"
+        ],
+        Byoj8tv: "f1av7aef",
+        uwmqm3: [
+            "fae8789",
+            "fjnv7mu"
+        ],
+        De3pzq: "fxugw4r",
+        jy2i9i: "fronft5"
+    },
+    calloutDateTimeContainer: {
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1063pyq",
+        Brf1p80: "f1869bpl"
+    },
+    calloutContentX: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm",
+        abs64n: "fp25eh",
+        sj55zd: "fkfq4zb"
+    },
+    calloutBlockContainer: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fod5ikn",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "faaz57k",
+        B6of3ja: "f7jvbu2",
+        sj55zd: "fkfq4zb"
+    },
+    calloutBlockContainertoDrawShapefalse: {
+        B93v9kj: "f15mrrko",
+        ibv6hh: [
+            "frjpdoz",
+            "fm1xp1g"
+        ],
+        uwmqm3: [
+            "f1f5gg8d",
+            "f1vdfbxk"
+        ]
+    },
+    calloutBlockContainertoDrawShapetrue: {
+        mc9l5x: "f22iagw"
+    },
+    shapeStyles: {
+        t21cq0: [
+            "f1vcna3q",
+            "foyynoy"
+        ]
+    },
+    calloutLegendText: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm",
+        sj55zd: "fkfq4zb",
+        Bd6j3yi: "f5klfrb",
+        hbub2c: "f1f0smcx"
+    },
+    calloutContentY: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fod5ikn",
+        Bhrd7zp: "flh3ekv",
+        Bg96gwp: "faaz57k",
+        Bd6j3yi: "f5klfrb",
+        hbub2c: "f1f0smcx"
+    },
+    descriptionMessage: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm",
+        sj55zd: "fkfq4zb",
+        B6of3ja: "f1gaxbfw",
+        z8tnut: "f1ngh7ph",
+        B4j52fo: "f1pgliyk"
     }
 }, {
     d: [
@@ -137,18 +238,97 @@ const cartesianchartClassNames = {
         ".f1wvrikb text{font-size:var(--fontSizeBase100);}",
         ".fidmvdy text{font-weight:var(--fontWeightSemibold);}",
         ".f1noc3f3 text{line-height:var(--lineHeightBase100);}",
-        ".f44ebzg text{forced-color-adjust:auto;}",
         ".fkuun line{opacity:0.2;}",
         ".f1u7a78k line{stroke:var(--colorNeutralForeground1);}",
         ".f1myyn02 line{width:1px;}",
-        ".f1oca6e6 line{forced-color-adjust:auto;}",
         ".f1x8lysa path{display:none;}",
         ".f1j2g1si g{text-anchor:end;}",
         ".f9das1l{opacity:0.1;}",
         ".f158kwzp{cursor:default;}",
         ".frnwi6n{margin-top:var(--spacingVerticalS);}",
         ".ff3wqvv{margin-left:var(--spacingHorizontalXL);}",
-        ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}"
+        ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}",
+        ".f13qh94s{display:grid;}",
+        [
+            ".f1a3p1vp{overflow:hidden;}",
+            {
+                p: -1
+            }
+        ],
+        ".f1dvrhzg{padding-top:11px 16px 10px 16px;}",
+        ".fjnv7mu{padding-right:11px 16px 10px 16px;}",
+        ".fae8789{padding-left:11px 16px 10px 16px;}",
+        ".f1av7aef{padding-bottom:11px 16px 10px 16px;}",
+        ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
+        ".fronft5{background-blend-mode:normal,luminosity;}",
+        ".f1063pyq{flex-direction:row;}",
+        ".f1869bpl{justify-content:space-between;}",
+        ".fy9rknc{font-size:var(--fontSizeBase200);}",
+        ".fwrc4pm{line-height:var(--lineHeightBase200);}",
+        ".fp25eh{opacity:0.8;}",
+        ".fod5ikn{font-size:var(--fontSizeBase400);}",
+        ".faaz57k{line-height:var(--lineHeightBase400);}",
+        ".f7jvbu2{margin-top:13px;}",
+        ".frjpdoz{border-left-width:4px solid;}",
+        ".fm1xp1g{border-right-width:4px solid;}",
+        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
+        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
+        ".f1vcna3q{margin-right:var(--spacingHorizontalS);}",
+        ".foyynoy{margin-left:var(--spacingHorizontalS);}",
+        ".flh3ekv{font-weight:var(--fontWeightBold);}",
+        ".f1gaxbfw{margin-top:var(--spacingVerticalMNudge);}",
+        ".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}",
+        ".f1pgliyk{border-top-width:1px solid var(--colorNeutralStroke2);}"
+    ],
+    m: [
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1rtcel9 text{fill:rgb(179, 179, 179);}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f4w8oyz text{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1ypwncy line{opacity:0.1;}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.fs22wna line{stroke:rgb(179, 179, 179);}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f19ju15u line{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f15mrrko{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f5klfrb{color:rgb(255, 255, 255);}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1f0smcx{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ]
     ]
 });
 const useCartesianChartStyles = (props)=>{
@@ -161,6 +341,16 @@ const useCartesianChartStyles = (props)=>{
         xAxis: (0, _react.mergeClasses)(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),
         yAxis: (0, _react.mergeClasses)(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),
         opacityChangeOnHover: (0, _react.mergeClasses)(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),
-        legendContainer: (0, _react.mergeClasses)(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ )
+        legendContainer: (0, _react.mergeClasses)(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),
+        calloutContentRoot: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),
+        calloutDateTimeContainer: (0, _react.mergeClasses)(cartesianchartClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),
+        calloutContentX: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),
+        calloutBlockContainer: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainer*/ ),
+        calloutBlockContainertoDrawShapefalse: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),
+        calloutBlockContainertoDrawShapetrue: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),
+        shapeStyles: (0, _react.mergeClasses)(cartesianchartClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),
+        calloutlegendText: (0, _react.mergeClasses)(cartesianchartClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),
+        calloutContentY: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentY*/ ),
+        descriptionMessage: (0, _react.mergeClasses)(cartesianchartClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ )
     };
 }; //# sourceMappingURL=useCartesianChartStyles.styles.js.map

package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useRtl } from '../../utilities/utilities';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    shapeStyles: 'fui-cart__shapeStyles',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    tooltip: 'fui-cart__tooltip',\n    chartTitle: 'fui-cart__chartTitle'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: {\n        ...typographyStyles.caption2Strong,\n        fontStyle: 'normal',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground2,\n        fill: tokens.colorNeutralForeground1\n    },\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root /*props.styles?.root*/ ),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, baseStyles.chartWrapper /*props.styles?.chartWrapper*/ ),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ )\n    };\n};\n"],"names":["cartesianchartClassNames","useCartesianChartStyles","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","shapeStyles","descriptionMessage","hover","tooltip","chartTitle","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","B80ckks","fsow6f","sj55zd","Bkfmm31","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","zp1vxd","jxu3ei","B3i31d3","Bhcy8il","z3m6do","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","d","p","props","_useRtl","useRtl","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKiBA,wBAAwB;eAAxBA;;IAmFAC,uBAAuB;eAAvBA;;;uBAxFwB;2BAElB;AAGZ,MAAMD,2BAA2B;IACxCE,MAAM;IACNC,cAAc;IACdC,WAAW;IACXC,OAAO;IACPC,OAAO;IACPC,sBAAsB;IACtBC,iBAAiB;IACjBC,aAAa;IACbC,oBAAoB;IACpBC,OAAO;IACPC,SAAS;IACTC,YAAY;AAChB;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAb,MAAA;QAAAc,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAvB,cAAA;QAAAqB,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAtB,WAAA;QAAAY,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAQ,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;IAAAzB,OAAA;QAAA0B,SAAA;QAAAC,QAAA;QAAAC,OAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAnC,OAAA;QAAA0B,QAAA;QAAAC,OAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAJ,SAAA;QAAAK,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAE,QAAA;QAAAC,QAAA;IAAA;IAAAC,KAAA;QAAAC,SAAA;IAAA;IAAAC,KAAA,CAAA;IAAArC,sBAAA;QAAAsC,QAAA;QAAAC,SAAA;IAAA;IAAAtC,iBAAA;QAAAuC,SAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAmEX,MAAMjD,0BAA2BkD,CAAAA;IACxC,MAAMC,UAAUC,IAAAA,iBAAM;IACtB,MAAMC,aAAaxC;IACnB,OAAO;QACHZ,MAAMqD,IAAAA,mBAAY,EAACvD,yBAAyBE,IAAI,EAAEoD,WAAWpD,IAAI,CAAC,oBAAA;QAClEC,cAAcoD,IAAAA,mBAAY,EAACvD,yBAAyBG,YAAY,EAAEmD,WAAWnD,YAAY,CAAC,4BAAA;QAC1FC,WAAWmD,IAAAA,mBAAY,EAACvD,yBAAyBI,SAAS,EAAEkD,WAAWlD,SAAS,CAAC,yBAAA;QACjFC,OAAOkD,IAAAA,mBAAY,EAACvD,yBAAyBK,KAAK,EAAEiD,WAAWjD,KAAK,CAAC,qBAAA;QACrEC,OAAOiD,IAAAA,mBAAY,EAACvD,yBAAyBM,KAAK,EAAEgD,WAAWhD,KAAK,EAAE8C,UAAUE,WAAWZ,GAAG,GAAGY,WAAWV,GAAG,CAAC,qBAAA;QAChHrC,sBAAsBgD,IAAAA,mBAAY,EAACvD,yBAAyBO,oBAAoB,EAAE+C,WAAW/C,oBAAoB,CAAC,oCAAA;QAClHC,iBAAiB+C,IAAAA,mBAAY,EAACvD,yBAAyBQ,eAAe,EAAE8C,WAAW9C,eAAe,CAAC,+BAAA;IACvG;AACJ"}
+{"version":3,"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { HighContrastSelectorBlack, HighContrastSelector } from '../../utilities/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useRtl } from '../../utilities/utilities';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    calloutContentRoot: 'fui-cart__calloutContentRoot',\n    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',\n    calloutContentX: 'fui-cart__calloutContentX',\n    calloutBlockContainer: 'fui-cart__calloutBlockContainer',\n    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',\n    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',\n    shapeStyles: 'fui-cart__shapeStyles',\n    calloutlegendText: 'fui-cart__calloutlegendText',\n    calloutContentY: 'fui-cart__calloutContentY',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    calloutInfoContainer: 'fui-cart__calloutInfoContainer',\n    tooltip: 'fui-cart__tooltip',\n    chartTitle: 'fui-cart__chartTitle'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: {\n        ...typographyStyles.caption2Strong,\n        fontStyle: 'normal',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground2,\n        fill: tokens.colorNeutralForeground1\n    },\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            [HighContrastSelectorBlack]: {\n                fill: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            [HighContrastSelectorBlack]: {\n                opacity: 0.1,\n                stroke: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            [HighContrastSelectorBlack]: {\n                fill: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            [HighContrastSelectorBlack]: {\n                opacity: 0.1,\n                stroke: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    },\n    calloutContentRoot: {\n        display: 'grid',\n        overflow: 'hidden',\n        ...shorthands.padding('11px 16px 10px 16px'),\n        backgroundColor: tokens.colorNeutralBackground1,\n        backgroundBlendMode: 'normal, luminosity'\n    },\n    calloutDateTimeContainer: {\n        display: 'flex',\n        flexDirection: 'row',\n        justifyContent: 'space-between'\n    },\n    calloutContentX: {\n        ...typographyStyles.caption1,\n        opacity: '0.8',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainer: {\n        ...typographyStyles.body2,\n        marginTop: '13px',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainertoDrawShapefalse: {\n        [HighContrastSelector]: {\n            forcedColorAdjust: 'none'\n        },\n        ...shorthands.borderLeft('4px solid'),\n        paddingLeft: tokens.spacingHorizontalS\n    },\n    calloutBlockContainertoDrawShapetrue: {\n        display: 'flex'\n    },\n    shapeStyles: {\n        marginRight: tokens.spacingHorizontalS\n    },\n    calloutLegendText: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n            forcedColorAdjust: 'none'\n        }\n    },\n    calloutContentY: {\n        ...typographyStyles.subtitle2Stronger,\n        [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n            forcedColorAdjust: 'none'\n        }\n    },\n    descriptionMessage: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        marginTop: tokens.spacingVerticalMNudge,\n        paddingTop: tokens.spacingVerticalMNudge,\n        ...shorthands.borderTop(`1px solid ${tokens.colorNeutralStroke2}`)\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root /*props.styles?.root*/ ),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, baseStyles.chartWrapper /*props.styles?.chartWrapper*/ ),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),\n        calloutContentRoot: mergeClasses(cartesianchartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),\n        calloutDateTimeContainer: mergeClasses(cartesianchartClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),\n        calloutContentX: mergeClasses(cartesianchartClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),\n        calloutBlockContainer: mergeClasses(cartesianchartClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainer*/ ),\n        calloutBlockContainertoDrawShapefalse: mergeClasses(cartesianchartClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),\n        calloutBlockContainertoDrawShapetrue: mergeClasses(cartesianchartClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),\n        shapeStyles: mergeClasses(cartesianchartClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),\n        calloutlegendText: mergeClasses(cartesianchartClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),\n        calloutContentY: mergeClasses(cartesianchartClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentY*/ ),\n        descriptionMessage: mergeClasses(cartesianchartClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ )\n    };\n};\n"],"names":["cartesianchartClassNames","useCartesianChartStyles","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","calloutContentRoot","calloutDateTimeContainer","calloutContentX","calloutBlockContainer","calloutBlockContainertoDrawShapefalse","calloutBlockContainertoDrawShapetrue","shapeStyles","calloutlegendText","calloutContentY","descriptionMessage","hover","calloutInfoContainer","tooltip","chartTitle","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","B80ckks","fsow6f","sj55zd","Bkfmm31","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","Dzfv0s","s17mou","jxu3ei","B3i31d3","Bhcy8il","t7r2jy","Bpf2t2a","J19x1g","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","jy2i9i","Brf1p80","B93v9kj","ibv6hh","t21cq0","calloutLegendText","Bd6j3yi","hbub2c","B4j52fo","d","p","m","props","_useRtl","useRtl","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.js

@@ -76,20 +76,19 @@ const popoverClassNames = {
         Be2twd7: "fy9rknc",
         Bhrd7zp: "figsok6",
         Bg96gwp: "fwrc4pm",
-        B6of3ja: "f7jvbu2",
-        Bvjb7m6: "fdgv6k0"
+        B6of3ja: "f7jvbu2"
     },
     calloutBlockContainerNonCartesian: {
         Be2twd7: "fojgt09",
         Bg96gwp: "f82itaf",
-        Bvjb7m6: "fdgv6k0"
+        bo4z9n: "fg7a56h"
     },
     calloutBlockContainertoDrawShapefalse: {
+        bo4z9n: "fg7a56h",
         uwmqm3: [
             "f1f5gg8d",
             "f1vdfbxk"
-        ],
-        Bvjb7m6: "fdgv6k0"
+        ]
     },
     calloutBlockContainertoDrawShapetrue: {
         mc9l5x: "fwk3njj"
@@ -106,10 +105,10 @@ const popoverClassNames = {
         Bhrd7zp: "figsok6",
         Bg96gwp: "fwrc4pm",
         sj55zd: "fkfq4zb",
-        Bvjb7m6: "fhv2zbx"
+        B1cpy0k: "fig6os7"
     },
     calloutContentY: {
-        Bvjb7m6: "fhv2zbx"
+        B1cpy0k: "fig6os7"
     },
     calloutContentYCartesian: {
         Bahqtrf: "fk6fouc",
@@ -160,10 +159,12 @@ const popoverClassNames = {
         uwmqm3: [
             "f1f5gg8d",
             "f1vdfbxk"
-        ],
-        Bvjb7m6: "fdgv6k0"
+        ]
     },
-    calloutContainer: {}
+    calloutContainer: {
+        a6j6cd: "f1j86lqe",
+        B93v9kj: "f15mrrko"
+    }
 }, {
     d: [
         ".f1bxpd7w{display:contents;}",
@@ -189,7 +190,6 @@ const popoverClassNames = {
         ".fp25eh{opacity:0.8;}",
         ".fkfq4zb{color:var(--colorNeutralForeground2);}",
         ".f7jvbu2{margin-top:13px;}",
-        ".fdgv6k0{forced-color-adjust:none;}",
         ".fojgt09{font-size:var(--fontSizeHero700);}",
         ".f82itaf{line-height:22px;}",
         ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
@@ -197,7 +197,6 @@ const popoverClassNames = {
         ".fwk3njj{display:inline-grid;}",
         ".f1vcna3q{margin-right:var(--spacingHorizontalS);}",
         ".foyynoy{margin-left:var(--spacingHorizontalS);}",
-        ".fhv2zbx{forced-color-adjust:auto;}",
         ".fod5ikn{font-size:var(--fontSizeBase400);}",
         ".flh3ekv{font-weight:var(--fontWeightBold);}",
         ".faaz57k{line-height:var(--lineHeightBase400);}",
@@ -211,6 +210,32 @@ const popoverClassNames = {
         ".f1t5qyk5{margin-left:var(--spacingHorizontalSNudge);}",
         ".f1ikr372{margin-right:var(--spacingHorizontalSNudge);}",
         ".f19n0e5{color:var(--colorNeutralForeground1);}"
+    ],
+    m: [
+        [
+            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.fg7a56h selectors{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.fig6os7 selectors{color:rgb(255, 255, 255);}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1j86lqe{fill:WindowText;}}",
+            {
+                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
+            }
+        ],
+        [
+            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f15mrrko{forced-color-adjust:none;}}",
+            {
+                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
+            }
+        ]
     ]
 });
 const usePopoverStyles_unstable = (props)=>{

package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useChartPopoverStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n/**\n * @internal\n */ export const popoverClassNames = {\n    calloutContentRoot: 'fui-cart__calloutContentRoot',\n    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',\n    calloutContentX: 'fui-cart__calloutContentX',\n    calloutBlockContainer: 'fui-cart__calloutBlockContainer',\n    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',\n    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',\n    shapeStyles: 'fui-cart__shapeStyles',\n    calloutlegendText: 'fui-cart__calloutlegendText',\n    calloutContentY: 'fui-cart__calloutContentY',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    ratio: 'fui-cart__ratio',\n    numerator: 'fui-cart__numerator',\n    denominator: 'fui-cart__denominator',\n    calloutInfoContainer: 'fui-cart__calloutInfoContainer',\n    calloutContainer: 'fui-cart__calloutContainer'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    calloutContentRoot: {\n        display: 'contents',\n        overflow: 'hidden',\n        ...shorthands.padding('11px 16px 10px 16px'),\n        backgroundColor: tokens.colorNeutralBackground1,\n        backgroundBlendMode: 'normal, luminosity'\n    },\n    calloutDateTimeContainer: {\n        display: 'flex',\n        flexDirection: 'row',\n        justifyContent: 'space-between'\n    },\n    calloutContentX: {\n        ...typographyStyles.caption1,\n        opacity: '0.8',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainer: {\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainerCartesian: {\n        ...typographyStyles.caption1,\n        marginTop: '13px',\n        forcedColorAdjust: 'none'\n    },\n    calloutBlockContainerNonCartesian: {\n        fontSize: tokens.fontSizeHero700,\n        lineHeight: '22px',\n        forcedColorAdjust: 'none'\n    },\n    calloutBlockContainertoDrawShapefalse: {\n        paddingLeft: tokens.spacingHorizontalS,\n        forcedColorAdjust: 'none'\n    },\n    calloutBlockContainertoDrawShapetrue: {\n        display: 'inline-grid'\n    },\n    shapeStyles: {\n        marginRight: tokens.spacingHorizontalS\n    },\n    calloutLegendText: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        forcedColorAdjust: 'auto'\n    },\n    calloutContentY: {\n        forcedColorAdjust: 'auto'\n    },\n    calloutContentYCartesian: {\n        ...typographyStyles.subtitle2Stronger\n    },\n    calloutContentYNonCartesian: {\n        ...typographyStyles.title2\n    },\n    descriptionMessage: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        marginTop: tokens.spacingVerticalMNudge,\n        paddingTop: tokens.spacingVerticalMNudge,\n        ...shorthands.borderTop(`1px solid ${tokens.colorNeutralStroke2}`)\n    },\n    ratio: {\n        ...typographyStyles.caption2,\n        marginLeft: tokens.spacingHorizontalSNudge,\n        color: tokens.colorNeutralForeground1\n    },\n    numerator: {\n        ...typographyStyles.caption2Strong\n    },\n    denominator: {\n        ...typographyStyles.caption2Strong\n    },\n    calloutInfoContainer: {\n        paddingLeft: tokens.spacingHorizontalS,\n        forcedColorAdjust: 'none'\n    },\n    calloutContainer: {}\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const usePopoverStyles_unstable = (props)=>{\n    const { isCartesian } = props;\n    const baseStyles = useStyles();\n    return {\n        calloutContentRoot: mergeClasses(popoverClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),\n        calloutDateTimeContainer: mergeClasses(popoverClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),\n        calloutContentX: mergeClasses(popoverClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),\n        calloutBlockContainer: mergeClasses(popoverClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainerCartesian*/ , isCartesian ? baseStyles.calloutBlockContainerCartesian : baseStyles.calloutBlockContainerNonCartesian),\n        calloutBlockContainertoDrawShapefalse: mergeClasses(popoverClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),\n        calloutBlockContainertoDrawShapetrue: mergeClasses(popoverClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),\n        shapeStyles: mergeClasses(popoverClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),\n        calloutlegendText: mergeClasses(popoverClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),\n        calloutContentY: mergeClasses(popoverClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentYNonCartesian*/ , isCartesian ? baseStyles.calloutContentYCartesian : baseStyles.calloutContentYNonCartesian),\n        descriptionMessage: mergeClasses(popoverClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ ),\n        ratio: mergeClasses(popoverClassNames.ratio, baseStyles.ratio /*props.styles?.ratio*/ ),\n        numerator: mergeClasses(popoverClassNames.numerator, baseStyles.numerator /*props.styles?.numerator*/ ),\n        denominator: mergeClasses(popoverClassNames.denominator, baseStyles.denominator /*props.styles?.denominator*/ ),\n        calloutInfoContainer: mergeClasses(popoverClassNames.calloutInfoContainer, baseStyles.calloutInfoContainer),\n        calloutContainer: mergeClasses(popoverClassNames.calloutContainer, baseStyles.calloutContainer)\n    };\n};\n"],"names":["popoverClassNames","usePopoverStyles_unstable","calloutContentRoot","calloutDateTimeContainer","calloutContentX","calloutBlockContainer","calloutBlockContainertoDrawShapefalse","calloutBlockContainertoDrawShapetrue","shapeStyles","calloutlegendText","calloutContentY","descriptionMessage","ratio","numerator","denominator","calloutInfoContainer","calloutContainer","useStyles","__styles","mc9l5x","B68tc82","Bmxbyg5","Bpg54ce","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","jy2i9i","Beiy3e4","Brf1p80","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","abs64n","sj55zd","calloutBlockContainerCartesian","B6of3ja","Bvjb7m6","calloutBlockContainerNonCartesian","t21cq0","calloutLegendText","calloutContentYCartesian","calloutContentYNonCartesian","B4j52fo","Frg6f3","d","p","props","isCartesian","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["useChartPopoverStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { HighContrastSelectorBlack, HighContrastSelector } from '../../utilities/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n/**\n * @internal\n */ export const popoverClassNames = {\n    calloutContentRoot: 'fui-cart__calloutContentRoot',\n    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',\n    calloutContentX: 'fui-cart__calloutContentX',\n    calloutBlockContainer: 'fui-cart__calloutBlockContainer',\n    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',\n    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',\n    shapeStyles: 'fui-cart__shapeStyles',\n    calloutlegendText: 'fui-cart__calloutlegendText',\n    calloutContentY: 'fui-cart__calloutContentY',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    ratio: 'fui-cart__ratio',\n    numerator: 'fui-cart__numerator',\n    denominator: 'fui-cart__denominator',\n    calloutInfoContainer: 'fui-cart__calloutInfoContainer',\n    calloutContainer: 'fui-cart__calloutContainer'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    calloutContentRoot: {\n        display: 'contents',\n        overflow: 'hidden',\n        ...shorthands.padding('11px 16px 10px 16px'),\n        backgroundColor: tokens.colorNeutralBackground1,\n        backgroundBlendMode: 'normal, luminosity'\n    },\n    calloutDateTimeContainer: {\n        display: 'flex',\n        flexDirection: 'row',\n        justifyContent: 'space-between'\n    },\n    calloutContentX: {\n        ...typographyStyles.caption1,\n        opacity: '0.8',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainer: {\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainerCartesian: {\n        ...typographyStyles.caption1,\n        marginTop: '13px'\n    },\n    calloutBlockContainerNonCartesian: {\n        fontSize: tokens.fontSizeHero700,\n        lineHeight: '22px',\n        '& selectors': {\n            [HighContrastSelector]: {\n                forcedColorAdjust: 'none'\n            }\n        }\n    },\n    calloutBlockContainertoDrawShapefalse: {\n        '& selectors': {\n            [HighContrastSelector]: {\n                forcedColorAdjust: 'none'\n            }\n        },\n        paddingLeft: tokens.spacingHorizontalS\n    },\n    calloutBlockContainertoDrawShapetrue: {\n        display: 'inline-grid'\n    },\n    shapeStyles: {\n        marginRight: tokens.spacingHorizontalS\n    },\n    calloutLegendText: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        '& selectors': {\n            [HighContrastSelectorBlack]: {\n                color: 'rgb(255, 255, 255)'\n            }\n        }\n    },\n    calloutContentY: {\n        '& selectors': {\n            [HighContrastSelectorBlack]: {\n                color: 'rgb(255, 255, 255)'\n            }\n        }\n    },\n    calloutContentYCartesian: {\n        ...typographyStyles.subtitle2Stronger\n    },\n    calloutContentYNonCartesian: {\n        ...typographyStyles.title2\n    },\n    descriptionMessage: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        marginTop: tokens.spacingVerticalMNudge,\n        paddingTop: tokens.spacingVerticalMNudge,\n        ...shorthands.borderTop(`1px solid ${tokens.colorNeutralStroke2}`)\n    },\n    ratio: {\n        ...typographyStyles.caption2,\n        marginLeft: tokens.spacingHorizontalSNudge,\n        color: tokens.colorNeutralForeground1\n    },\n    numerator: {\n        ...typographyStyles.caption2Strong\n    },\n    denominator: {\n        ...typographyStyles.caption2Strong\n    },\n    calloutInfoContainer: {\n        paddingLeft: tokens.spacingHorizontalS\n    },\n    calloutContainer: {\n        [HighContrastSelector]: {\n            fill: 'WindowText',\n            forcedColorAdjust: 'none'\n        }\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const usePopoverStyles_unstable = (props)=>{\n    const { isCartesian } = props;\n    const baseStyles = useStyles();\n    return {\n        calloutContentRoot: mergeClasses(popoverClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),\n        calloutDateTimeContainer: mergeClasses(popoverClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),\n        calloutContentX: mergeClasses(popoverClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),\n        calloutBlockContainer: mergeClasses(popoverClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainerCartesian*/ , isCartesian ? baseStyles.calloutBlockContainerCartesian : baseStyles.calloutBlockContainerNonCartesian),\n        calloutBlockContainertoDrawShapefalse: mergeClasses(popoverClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),\n        calloutBlockContainertoDrawShapetrue: mergeClasses(popoverClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),\n        shapeStyles: mergeClasses(popoverClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),\n        calloutlegendText: mergeClasses(popoverClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),\n        calloutContentY: mergeClasses(popoverClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentYNonCartesian*/ , isCartesian ? baseStyles.calloutContentYCartesian : baseStyles.calloutContentYNonCartesian),\n        descriptionMessage: mergeClasses(popoverClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ ),\n        ratio: mergeClasses(popoverClassNames.ratio, baseStyles.ratio /*props.styles?.ratio*/ ),\n        numerator: mergeClasses(popoverClassNames.numerator, baseStyles.numerator /*props.styles?.numerator*/ ),\n        denominator: mergeClasses(popoverClassNames.denominator, baseStyles.denominator /*props.styles?.denominator*/ ),\n        calloutInfoContainer: mergeClasses(popoverClassNames.calloutInfoContainer, baseStyles.calloutInfoContainer),\n        calloutContainer: mergeClasses(popoverClassNames.calloutContainer, baseStyles.calloutContainer)\n    };\n};\n"],"names":["popoverClassNames","usePopoverStyles_unstable","calloutContentRoot","calloutDateTimeContainer","calloutContentX","calloutBlockContainer","calloutBlockContainertoDrawShapefalse","calloutBlockContainertoDrawShapetrue","shapeStyles","calloutlegendText","calloutContentY","descriptionMessage","ratio","numerator","denominator","calloutInfoContainer","calloutContainer","useStyles","__styles","mc9l5x","B68tc82","Bmxbyg5","Bpg54ce","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","jy2i9i","Beiy3e4","Brf1p80","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","abs64n","sj55zd","calloutBlockContainerCartesian","B6of3ja","calloutBlockContainerNonCartesian","bo4z9n","t21cq0","calloutLegendText","B1cpy0k","calloutContentYCartesian","calloutContentYNonCartesian","B4j52fo","Frg6f3","a6j6cd","B93v9kj","d","p","m","props","isCartesian","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/DonutChart/Pie/usePieStyles.styles.js

@@ -31,7 +31,7 @@ const donutPieClassNames = {
         Bhrd7zp: "fl43uef",
         Bg96gwp: "fcen8rp",
         Bkfmm31: "fhuob2q",
-        Bvjb7m6: "fhv2zbx"
+        Bcjfw9x: "fy323tu"
     }
 }, {
     d: [
@@ -39,8 +39,15 @@ const donutPieClassNames = {
         ".fojgt09{font-size:var(--fontSizeHero700);}",
         ".fl43uef{font-weight:var(--fontWeightSemibold);}",
         ".fcen8rp{line-height:var(--lineHeightHero700);}",
-        ".fhuob2q{fill:var(--colorNeutralForeground1);}",
-        ".fhv2zbx{forced-color-adjust:auto;}"
+        ".fhuob2q{fill:var(--colorNeutralForeground1);}"
+    ],
+    m: [
+        [
+            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.fy323tu{fill:rgb(179, 179, 179);}}",
+            {
+                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
+            }
+        ]
     ]
 });
 const usePieStyles = (props)=>{

package/lib-commonjs/components/DonutChart/Pie/usePieStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["usePieStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses } from '@griffel/react';\n/**\n * @internal\n */ export const donutPieClassNames = {\n    root: 'fui-donut-pie__root',\n    insideDonutString: 'fui-donut-pie__insideDonutString'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {},\n    insideDonutString: {\n        ...typographyStyles.title2,\n        fill: tokens.colorNeutralForeground1,\n        forcedColorAdjust: 'auto'\n    }\n});\n/**\n * Apply styling to the Pie inside donut chart component\n */ export const usePieStyles = (props)=>{\n    var _props_styles, _props_styles1;\n    const { className } = props;\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(donutPieClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        insideDonutString: mergeClasses(donutPieClassNames.insideDonutString, baseStyles.insideDonutString, className, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.insideDonutString)\n    };\n};\n"],"names":["donutPieClassNames","usePieStyles","root","insideDonutString","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkfmm31","Bvjb7m6","d","props","_props_styles","_props_styles1","className","baseStyles","mergeClasses","styles"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIiBA,kBAAkB;eAAlBA;;IAgBAC,YAAY;eAAZA;;;uBAnBwB;AAG9B,MAAMD,qBAAqB;IAClCE,MAAM;IACNC,mBAAmB;AACvB;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAH,MAAA,CAAA;IAAAC,mBAAA;QAAAG,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAUX,MAAMX,eAAgBY,CAAAA;IAC7B,IAAIC,eAAeC;IACnB,MAAM,EAAEC,SAAAA,EAAW,GAAGH;IACtB,MAAMI,aAAab;IACnB,OAAO;QACHF,MAAMgB,IAAAA,mBAAY,EAAClB,mBAAmBE,IAAI,EAAEe,WAAWf,IAAI,EAAEc,WAAW,AAACF,CAAAA,gBAAgBD,MAAMM,MAAM,AAANA,MAAY,QAAQL,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcZ,IAAI;QACzKC,mBAAmBe,IAAAA,mBAAY,EAAClB,mBAAmBG,iBAAiB,EAAEc,WAAWd,iBAAiB,EAAEa,WAAW,AAACD,CAAAA,iBAAiBF,MAAMM,MAAM,AAANA,MAAY,QAAQJ,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeZ,iBAAiB;IACpO;AACJ"}
+{"version":3,"sources":["usePieStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HighContrastSelectorBlack } from '../../../utilities/index';\nimport { makeStyles, mergeClasses } from '@griffel/react';\n/**\n * @internal\n */ export const donutPieClassNames = {\n    root: 'fui-donut-pie__root',\n    insideDonutString: 'fui-donut-pie__insideDonutString'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {},\n    insideDonutString: {\n        ...typographyStyles.title2,\n        fill: tokens.colorNeutralForeground1,\n        [HighContrastSelectorBlack]: {\n            fill: 'rgb(179, 179, 179)'\n        }\n    }\n});\n/**\n * Apply styling to the Pie inside donut chart component\n */ export const usePieStyles = (props)=>{\n    var _props_styles, _props_styles1;\n    const { className } = props;\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(donutPieClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        insideDonutString: mergeClasses(donutPieClassNames.insideDonutString, baseStyles.insideDonutString, className, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.insideDonutString)\n    };\n};\n"],"names":["donutPieClassNames","usePieStyles","root","insideDonutString","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkfmm31","Bcjfw9x","d","m","props","_props_styles","_props_styles1","className","baseStyles","mergeClasses","styles"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKiBA,kBAAkB;eAAlBA;;IAkBAC,YAAY;eAAZA;;;uBArBwB;AAG9B,MAAMD,qBAAqB;IAClCE,MAAM;IACNC,mBAAmB;AACvB;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAH,MAAA,CAAA;IAAAC,mBAAA;QAAAG,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,GAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA;YAAA;SAAA;KAAA;AAAA;AAYX,MAAMZ,eAAgBa,CAAAA;IAC7B,IAAIC,eAAeC;IACnB,MAAM,EAAEC,SAAAA,EAAW,GAAGH;IACtB,MAAMI,aAAad;IACnB,OAAO;QACHF,MAAMiB,IAAAA,mBAAY,EAACnB,mBAAmBE,IAAI,EAAEgB,WAAWhB,IAAI,EAAEe,WAAW,AAACF,CAAAA,gBAAgBD,MAAMM,MAAM,AAANA,MAAY,QAAQL,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcb,IAAI;QACzKC,mBAAmBgB,IAAAA,mBAAY,EAACnB,mBAAmBG,iBAAiB,EAAEe,WAAWf,iBAAiB,EAAEc,WAAW,AAACD,CAAAA,iBAAiBF,MAAMM,MAAM,AAANA,MAAY,QAAQJ,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeb,iBAAiB;IACpO;AACJ"}

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

@@ -464,7 +464,7 @@ const GaugeChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
                 id: `${index}_${xValue.y}`,
                 className: classes.calloutBlockContainer,
                 style: {
-                    borderInlineStart: `4px solid ${xValue.color}`
+                    borderLeft: `4px solid ${xValue.color}`
                 }
             }, toDrawShape && /*#__PURE__*/ _react.createElement(_index1.Shape, {
                 svgProps: {