@fluentui/react-charts 0.0.0-nightly-20250819-0407.1 → 0.0.0-nightly-20250820-0406.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -15
- package/dist/index.d.ts +9 -1
- package/lib/components/AreaChart/AreaChart.js +4 -1
- package/lib/components/AreaChart/AreaChart.js.map +1 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.js +2 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.js +48 -3
- package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js +175 -120
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +6 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +293 -44
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.js +2 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
- package/lib/components/LineChart/useLineChartStyles.styles.js +2 -1
- package/lib/components/LineChart/useLineChartStyles.styles.js.map +1 -1
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js +2 -1
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.js +47 -30
- package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib/components/ScatterChart/useScatterChartStyles.styles.js +21 -4
- package/lib/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js +16 -3
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
- package/lib/utilities/utilities.js +0 -29
- package/lib/utilities/utilities.js.map +1 -1
- package/lib-commonjs/components/AreaChart/AreaChart.js +4 -1
- package/lib-commonjs/components/AreaChart/AreaChart.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js +2 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.js +48 -3
- package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +171 -118
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +9 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +309 -50
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js +2 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js +2 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.js +47 -30
- package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js +30 -3
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js +15 -2
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/utilities/utilities.js +0 -32
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useGanttChartStyles.styles.js"],"sourcesContent":["/**\n * @internal\n */ export const ganttClassNames = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\n/**\n * Apply styling to the GanttChart component\n */ export const useGanttChartStyles = (props)=>{\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useGanttChartStyles","props"],"mappings":"AAAA;;CAEA,EAAI;;;;;;;;;;;mBAA4B;;;
|
|
1
|
+
{"version":3,"sources":["useGanttChartStyles.styles.js"],"sourcesContent":["/**\n * @internal\n */ export const ganttClassNames = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\n/**\n * Apply styling to the GanttChart component\n */ export const useGanttChartStyles = (props)=>{\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useGanttChartStyles","props"],"mappings":"AAAA;;CAEA,EAAI;;;;;;;;;;;mBAA4B;;;uBAmBI;;;;AAnBzB,MAAMA,kBAAkB;IAC/BC,IAAI,EAAE,EAAE;IACRC,KAAK,EAAE,EAAE;IACTC,KAAK,EAAE,EAAE;IACTC,eAAe,EAAE,EAAE;IACnBC,KAAK,EAAE,EAAE;IACTC,kBAAkB,EAAE,EAAE;IACtBC,OAAO,EAAE,EAAE;IACXC,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;AAGU,MAAMC,uBAAuBC,KAAK,IAAG;IAC5C,OAAO,CAAC,CAAC;AACb,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/GanttChart/useGanttChartStyles.styles.ts"],"sourcesContent":["import { GanttChartStyles, GanttChartProps } from '../../index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @internal\n */\nexport const ganttClassNames: SlotClassNames<GanttChartStyles> = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\n/**\n * Apply styling to the GanttChart component\n */\nexport const useGanttChartStyles = (props: GanttChartProps): GanttChartStyles => {\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useGanttChartStyles","props"],"mappings":"AAGA;;CAEC,GACD;;;;;;;;;;;mBAAaA;;;
|
|
1
|
+
{"version":3,"sources":["../src/components/GanttChart/useGanttChartStyles.styles.ts"],"sourcesContent":["import { GanttChartStyles, GanttChartProps } from '../../index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @internal\n */\nexport const ganttClassNames: SlotClassNames<GanttChartStyles> = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\n/**\n * Apply styling to the GanttChart component\n */\nexport const useGanttChartStyles = (props: GanttChartProps): GanttChartStyles => {\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useGanttChartStyles","props"],"mappings":"AAGA;;CAEC,GACD;;;;;;;;;;;mBAAaA;;;uBAqBAgB;;;;AArBN,MAAMhB,kBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAKK,MAAMC,sBAAsB,CAACC;IAClC,OAAO,CAAC;AACV,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useGroupedVerticalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const groupedVerticalBarChartClassNames = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default'\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n background: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1\n },\n barLabel: {\n ...typographyStyles.caption1Strong,\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto'\n }\n});\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */ export const useGroupedVerticalBarChartStyles_unstable = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(groupedVerticalBarChartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/ )\n };\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","Bceei9c","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Bgh53k4","B2eet1l","De3pzq","Bcmaq0h","gk0gix","B20660r","B8a6bjv","Bpptf2m","e5kdtc","Bkjc3bi","ayd6f0","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","Bvjb7m6","d","p","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":";;;;;;;;;;;IAEaK,iCAAiC;;;
|
|
1
|
+
{"version":3,"sources":["useGroupedVerticalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const groupedVerticalBarChartClassNames = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default'\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n background: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1\n },\n barLabel: {\n ...typographyStyles.caption1Strong,\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto'\n }\n});\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */ export const useGroupedVerticalBarChartStyles_unstable = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(groupedVerticalBarChartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/ )\n };\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","Bceei9c","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Bgh53k4","B2eet1l","De3pzq","Bcmaq0h","gk0gix","B20660r","B8a6bjv","Bpptf2m","e5kdtc","Bkjc3bi","ayd6f0","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","Bvjb7m6","d","p","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":";;;;;;;;;;;IAEaK,iCAAiC;;;6CA4CY;;;;uBA9CL,gBAAgB;AAE9D,0CAA0C;IAC7CC,oBAAoB,EAAE,gCAAgC;IACtDC,OAAO,EAAE,mBAAmB;IAC5BC,QAAQ,EAAE,oBAAoB;IAC9BC,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,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,OAAGtB,eAAA,EAAA;IAAAM,oBAAA,EAAA;QAAAiB,OAAA,EAAA;IAAA;IAAAhB,OAAA,EAAA;QAAAiB,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,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,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;IAAA/C,QAAA,EAAA;QAAAgB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAU,OAAA,EAAA;QAAAmB,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAuBjB,CAAC;AAGS,MAAMC,6CAA6CC,KAAK,IAAG;IAClE,MAAMC,UAAU,GAAGvC,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHhB,oBAAoB,MAAEL,mBAAY,EAACI,iCAAiC,CAACC,oBAAoB,EAAEuD,UAAU,CAACvD,oBAAoB,CAAC,oCAAA,EAAuC,CAAC;QACnKC,OAAO,MAAEN,mBAAY,EAACI,iCAAiC,CAACE,OAAO,EAAEsD,UAAU,CAACtD,OAAO,CAAC,uBAAA,EAA0B,CAAC;QAC/GC,QAAQ,MAAEP,mBAAY,EAACI,iCAAiC,CAACG,QAAQ,EAAEqD,UAAU,CAACrD,QAAQ,CAAC,wBAAA,EAA2B;IACtH,CAAC;AACL,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { GroupedVerticalBarChartProps, GroupedVerticalBarChartStyles } from '../../index';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const groupedVerticalBarChartClassNames: SlotClassNames<GroupedVerticalBarChartStyles> = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default',\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1, //Check this\n background: tokens.colorNeutralBackground1, //Fill or background\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1, //Confirm this\n },\n barLabel: {\n ...typographyStyles.caption1Strong, // Confirm styles\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto',\n },\n});\n\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */\nexport const useGroupedVerticalBarChartStyles_unstable = (\n props: GroupedVerticalBarChartProps,\n): GroupedVerticalBarChartStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(\n groupedVerticalBarChartClassNames.opacityChangeOnHover,\n baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/,\n ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","cursor","body1","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","background","borderRadius","borderRadiusSmall","pointerEvents","color","colorNeutralForeground1","caption1Strong","forcedColorAdjust","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":";;;;;;;;;;;IAKaK,iCAAAA;;;
|
|
1
|
+
{"version":3,"sources":["../src/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { GroupedVerticalBarChartProps, GroupedVerticalBarChartStyles } from '../../index';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const groupedVerticalBarChartClassNames: SlotClassNames<GroupedVerticalBarChartStyles> = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default',\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1, //Check this\n background: tokens.colorNeutralBackground1, //Fill or background\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1, //Confirm this\n },\n barLabel: {\n ...typographyStyles.caption1Strong, // Confirm styles\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto',\n },\n});\n\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */\nexport const useGroupedVerticalBarChartStyles_unstable = (\n props: GroupedVerticalBarChartProps,\n): GroupedVerticalBarChartStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(\n groupedVerticalBarChartClassNames.opacityChangeOnHover,\n baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/,\n ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","cursor","body1","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","background","borderRadius","borderRadiusSmall","pointerEvents","color","colorNeutralForeground1","caption1Strong","forcedColorAdjust","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":";;;;;;;;;;;IAKaK,iCAAAA;;;IA+CAsC,yCAAAA;;;;uBApDwC,iBAAiB;4BAG7B,wBAAwB;AAE1D,0CAAyF;IAC9FrC,sBAAsB;IACtBC,SAAS;IACTC,UAAU;IACVC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,gBAAYtB,iBAAAA,EAAW;IAC3BM,sBAAsB;QACpBiB,QAAQ;IACV;IACAhB,SAAS;QACP,GAAGH,4BAAAA,CAAiBoB,KAAK;QACzBC,SAAS;QACTC,eAAe;QACf,GAAGxB,iBAAAA,CAAWyB,OAAO,CAACxB,kBAAAA,CAAOyB,kBAAkB,CAAC;QAChDC,UAAU;QACVC,WAAW;QACXC,KAAK5B,kBAAAA,CAAO6B,mBAAmB;QAC/BC,MAAM9B,kBAAAA,CAAO+B,uBAAuB;QACpCC,YAAYhC,kBAAAA,CAAO+B,uBAAuB;QAC1CE,cAAcjC,kBAAAA,CAAOkC,iBAAiB;QACtCC,eAAe;QACfC,OAAOpC,kBAAAA,CAAOqC,uBAAuB;IACvC;IACAhC,UAAU;QACR,GAAGJ,4BAAAA,CAAiBqC,cAAc;QAClCR,MAAM9B,kBAAAA,CAAOqC,uBAAuB;QACpCE,mBAAmB;IACrB;AACF;AAKO,kDAAkD,CACvDE;IAEA,MAAMC,aAAavB;IAEnB,OAAO;QACLhB,0BAAsBL,mBAAAA,EACpBI,kCAAkCC,oBAAoB,EACtDuC,WAAWvC,oBAAoB,CAAC,oCAAoC;QAEtEC,aAASN,mBAAAA,EAAaI,kCAAkCE,OAAO,EAAEsC,WAAWtC,OAAO,CAAC,uBAAuB;QAC3GC,cAAUP,mBAAAA,EAAaI,kCAAkCG,QAAQ,EAAEqC,WAAWrC,QAAQ,CAAC,wBAAwB;IACjH;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none'\n },\n calloutContentRoot: {\n maxWidth: '238px'\n }\n});\nexport const useHeatMapChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n };\n};\n"],"names":["__styles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","useHeatMapChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAEaG,sBAAsB;;;
|
|
1
|
+
{"version":3,"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none'\n },\n calloutContentRoot: {\n maxWidth: '238px'\n }\n});\nexport const useHeatMapChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n };\n};\n"],"names":["__styles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","useHeatMapChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAEaG,sBAAsB;;;yBA6BD;;;;uBA/BO,gBAAgB;AAElD,+BAA+B;IAClCC,IAAI,EAAE,eAAe;IACrBC,IAAI,EAAE,eAAe;IACrBC,kBAAkB,EAAE,6BAA6B;IACjDC,KAAK,EAAE,EAAE;IACTC,KAAK,EAAE,EAAE;IACTC,eAAe,EAAE,EAAE;IACnBC,KAAK,EAAE,EAAE;IACTC,kBAAkB,EAAE,EAAE;IACtBC,OAAO,EAAE,EAAE;IACXC,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,OAAGrB,eAAA,EAAA;IAAAI,IAAA,EAAA,CAAA;IAAAC,IAAA,EAAA;QAAAiB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAApB,kBAAA,EAAA;QAAAqB,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CASjB,CAAC;AACK,MAAMC,yBAAyBC,KAAK,IAAG;IAC1C,MAAMC,UAAU,GAAGV,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHjB,IAAI,MAAEH,mBAAY,EAACE,sBAAsB,CAACC,IAAI,EAAE2B,UAAU,CAAC3B,IAAI,CAAC,sBAAA,EAAyB,CAAC;QAC1FC,IAAI,MAAEJ,mBAAY,EAACE,sBAAsB,CAACE,IAAI,EAAE0B,UAAU,CAAC1B,IAAI,CAAC,sBAAA,EAAyB,CAAC;QAC1FC,kBAAkB,MAAEL,mBAAY,EAACE,sBAAsB,CAACG,kBAAkB,EAAEyB,UAAU,CAACzB,kBAAkB,CAAC,oCAAA,EAAuC;IACrJ,CAAC;AACL,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/HeatMapChart/useHeatMapChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { HeatMapChartProps, HeatMapChartStyles } from './HeatMapChart.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const heatmapChartClassNames: SlotClassNames<HeatMapChartStyles> = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none',\n },\n calloutContentRoot: {\n maxWidth: '238px',\n },\n});\n\nexport const useHeatMapChartStyles = (props: HeatMapChartProps): HeatMapChartStyles => {\n const baseStyles = useStyles();\n\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/),\n calloutContentRoot: mergeClasses(\n heatmapChartClassNames.calloutContentRoot,\n baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/,\n ),\n };\n};\n"],"names":["makeStyles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","body1Strong","pointerEvents","maxWidth","useHeatMapChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAKaG,sBAAAA;;;
|
|
1
|
+
{"version":3,"sources":["../src/components/HeatMapChart/useHeatMapChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { HeatMapChartProps, HeatMapChartStyles } from './HeatMapChart.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const heatmapChartClassNames: SlotClassNames<HeatMapChartStyles> = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none',\n },\n calloutContentRoot: {\n maxWidth: '238px',\n },\n});\n\nexport const useHeatMapChartStyles = (props: HeatMapChartProps): HeatMapChartStyles => {\n const baseStyles = useStyles();\n\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/),\n calloutContentRoot: mergeClasses(\n heatmapChartClassNames.calloutContentRoot,\n baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/,\n ),\n };\n};\n"],"names":["makeStyles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","body1Strong","pointerEvents","maxWidth","useHeatMapChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAKaG,sBAAAA;;;yBA8BAsB;;;;uBAnC4B,iBAAiB;4BAGzB,wBAAwB;AAElD,+BAAmE;IACxErB,MAAM;IACNC,MAAM;IACNC,oBAAoB;IACpBC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AACF,MAAMC,gBAAYrB,iBAAAA,EAAW;IAC3BI,MAAM,CAAC;IACPC,MAAM;QACJ,GAAGH,4BAAAA,CAAiBoB,WAAW;QAC/BC,eAAe;IACjB;IACAjB,oBAAoB;QAClBkB,UAAU;IACZ;AACF;AAEO,MAAMC,wBAAwB,CAACC;IACpC,MAAMC,aAAaN;IAEnB,OAAO;QACLjB,UAAMH,mBAAAA,EAAaE,uBAAuBC,IAAI,EAAEuB,WAAWvB,IAAI,CAAC,sBAAsB;QACtFC,UAAMJ,mBAAAA,EAAaE,uBAAuBE,IAAI,EAAEsB,WAAWtB,IAAI,CAAC,sBAAsB;QACtFC,wBAAoBL,mBAAAA,EAClBE,uBAAuBG,kBAAkB,EACzCqB,WAAWrB,kBAAkB,CAAC,oCAAoC;IAEtE;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useHorizontalBarChartWithAxisStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const hbcWithAxisClassNames = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1\n },\n xAxisTicks: {}\n});\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */ export const useHorizontalBarChartWithAxisStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks)\n };\n};\n"],"names":["__styles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","abs64n","d","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IACaE,qBAAqB;;;
|
|
1
|
+
{"version":3,"sources":["useHorizontalBarChartWithAxisStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const hbcWithAxisClassNames = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1\n },\n xAxisTicks: {}\n});\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */ export const useHorizontalBarChartWithAxisStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks)\n };\n};\n"],"names":["__styles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","abs64n","d","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IACaE,qBAAqB;;;uCAgCkB;;;;uBAjCX,gBAAgB;AAClD,8BAA8B;IACjCC,oBAAoB,EAAE,iCAAiC;IACvDC,UAAU,EAAE,uBAAuB;IACnCC,OAAO,EAAE,oBAAoB;IAC7BC,UAAU,EAAE,EAAE;IACdC,WAAW,EAAE,EAAE;IACfC,SAAS,EAAE,EAAE;IACbC,WAAW,EAAE,EAAE;IACfC,UAAU,EAAE,EAAE;IACdC,SAAS,EAAE,EAAE;IACbC,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,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,OAAGzB,eAAA,EAAA;IAAAG,oBAAA,EAAA;QAAAuB,MAAA,EAAA;IAAA;IAAAtB,UAAA,EAAA,CAAA;AAAA,GAAA;IAAAuB,CAAA,EAAA;QAAA;KAAA;AAAA,CAKjB,CAAC;AAGS,MAAMC,uCAAuCC,KAAK,IAAG;IAC5D,MAAMC,UAAU,GAAGL,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHtB,oBAAoB,MAAEF,mBAAY,EAACC,qBAAqB,CAACC,oBAAoB,EAAE2B,UAAU,CAAC3B,oBAAoB,CAAC;QAC/GC,UAAU,MAAEH,mBAAY,EAACC,qBAAqB,CAACE,UAAU,EAAE0B,UAAU,CAAC1B,UAAU;IACpF,CAAC;AACL,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { HorizontalBarChartWithAxisProps, HorizontalBarChartWithAxisStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const hbcWithAxisClassNames: SlotClassNames<HorizontalBarChartWithAxisStyles> = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1, // supports custom opacity\n },\n\n xAxisTicks: {},\n});\n\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */\nexport const useHorizontalBarChartWithAxisStyles = (\n props: HorizontalBarChartWithAxisProps,\n): HorizontalBarChartWithAxisStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks),\n };\n};\n"],"names":["makeStyles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","opacity","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAIaE,qBAAAA;;;
|
|
1
|
+
{"version":3,"sources":["../src/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { HorizontalBarChartWithAxisProps, HorizontalBarChartWithAxisStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const hbcWithAxisClassNames: SlotClassNames<HorizontalBarChartWithAxisStyles> = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1, // supports custom opacity\n },\n\n xAxisTicks: {},\n});\n\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */\nexport const useHorizontalBarChartWithAxisStyles = (\n props: HorizontalBarChartWithAxisProps,\n): HorizontalBarChartWithAxisStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks),\n };\n};\n"],"names":["makeStyles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","opacity","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAIaE,qBAAAA;;;uCAoCAyB;eAAAA;;;uBAxC4B,iBAAiB;AAInD,8BAAgF;IACrFxB,sBAAsB;IACtBC,YAAY;IACZC,SAAS;IACTC,YAAY;IACZC,aAAa;IACbC,WAAW;IACXC,aAAa;IACbC,YAAY;IACZC,WAAW;IACXC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,gBAAYzB,iBAAAA,EAAW;IAC3BG,sBAAsB;QACpBuB,SAAS;IACX;IAEAtB,YAAY,CAAC;AACf;AAKO,4CAA4C,CACjDwB;IAEA,MAAMC,aAAaJ;IAEnB,OAAO;QACLtB,0BAAsBF,mBAAAA,EAAaC,sBAAsBC,oBAAoB,EAAE0B,WAAW1B,oBAAoB;QAC9GC,gBAAYH,mBAAAA,EAAaC,sBAAsBE,UAAU,EAAEyB,WAAWzB,UAAU;IAClF;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useLineChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { HighContrastSelector } from '../../utilities/index';\n/**\n * @internal\n */ export const linechartClassNames = {\n tooltip: 'fui-line__tooltip',\n lineBorder: 'fui-line_lineBorder',\n markerLabel: 'fui-line__markerLabel',\n root: 'fui-line__root',\n xAxis: 'fui-line__xAxis',\n yAxis: 'fui-line__yAxis',\n legendContainer: 'fui-line__legendContainer',\n hover: 'fui-line__hover',\n descriptionMessage: 'fui-line__descriptionMessage',\n axisTitle: 'fui-line__axisTitle',\n chartTitle: 'fui-line__chartTitle',\n opacityChangeOnHover: 'fui-line__opacityChangeOnHover',\n shapeStyles: 'fui-line__shapeStyles',\n chartWrapper: 'fui-line__chartWrapper',\n svgTooltip: '',\n chart: ''\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n tooltip: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none'\n },\n lineBorder: {\n stroke: tokens.colorNeutralBackground1,\n [HighContrastSelector]: {\n stroke: 'Canvas'\n }\n },\n markerLabel: {\n fill: tokens.colorNeutralForeground1,\n textAnchor: 'middle',\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText'\n }\n }\n }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useLineChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n tooltip: mergeClasses(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n lineBorder: mergeClasses(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/ ),\n markerLabel: mergeClasses(linechartClassNames.markerLabel, baseStyles.markerLabel /*props.styles?.markerLabel*/ )\n };\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","HighContrastSelector","linechartClassNames","tooltip","lineBorder","markerLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","ojy3ng","Bpvj6i6","jzqdnp","d","p","m","useLineChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAKiBK,mBAAmB;;;
|
|
1
|
+
{"version":3,"sources":["useLineChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { HighContrastSelector } from '../../utilities/index';\n/**\n * @internal\n */ export const linechartClassNames = {\n tooltip: 'fui-line__tooltip',\n lineBorder: 'fui-line_lineBorder',\n markerLabel: 'fui-line__markerLabel',\n root: 'fui-line__root',\n xAxis: 'fui-line__xAxis',\n yAxis: 'fui-line__yAxis',\n legendContainer: 'fui-line__legendContainer',\n hover: 'fui-line__hover',\n descriptionMessage: 'fui-line__descriptionMessage',\n axisTitle: 'fui-line__axisTitle',\n chartTitle: 'fui-line__chartTitle',\n opacityChangeOnHover: 'fui-line__opacityChangeOnHover',\n shapeStyles: 'fui-line__shapeStyles',\n chartWrapper: 'fui-line__chartWrapper',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n tooltip: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none'\n },\n lineBorder: {\n stroke: tokens.colorNeutralBackground1,\n [HighContrastSelector]: {\n stroke: 'Canvas'\n }\n },\n markerLabel: {\n fill: tokens.colorNeutralForeground1,\n textAnchor: 'middle',\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText'\n }\n }\n }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useLineChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n tooltip: mergeClasses(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n lineBorder: mergeClasses(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/ ),\n markerLabel: mergeClasses(linechartClassNames.markerLabel, baseStyles.markerLabel /*props.styles?.markerLabel*/ )\n };\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","HighContrastSelector","linechartClassNames","tooltip","lineBorder","markerLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","ojy3ng","Bpvj6i6","jzqdnp","d","p","m","useLineChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAKiBK,mBAAmB;;;sBAmDD;eAAlByC;;;uBAxDoC,gBAAgB;AAK1D,4BAA4B;IACnCxC,OAAO,EAAE,mBAAmB;IAC5BC,UAAU,EAAE,qBAAqB;IACjCC,WAAW,EAAE,uBAAuB;IACpCC,IAAI,EAAE,gBAAgB;IACtBC,KAAK,EAAE,iBAAiB;IACxBC,KAAK,EAAE,iBAAiB;IACxBC,eAAe,EAAE,2BAA2B;IAC5CC,KAAK,EAAE,iBAAiB;IACxBC,kBAAkB,EAAE,8BAA8B;IAClDC,SAAS,EAAE,qBAAqB;IAChCC,UAAU,EAAE,sBAAsB;IAClCC,oBAAoB,EAAE,gCAAgC;IACtDC,WAAW,EAAE,uBAAuB;IACpCC,YAAY,EAAE,wBAAwB;IACtCC,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE,EAAE;IACTC,cAAc,EAAE;AACpB,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGvB,eAAA,EAAA;IAAAM,OAAA,EAAA;QAAAkB,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,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAhC,UAAA,EAAA;QAAAiC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAjC,WAAA,EAAA;QAAAyB,OAAA,EAAA;QAAAS,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;KAAA;AAAA,CA2BrB,CAAC;AAGS,4BAA4BE,KAAK,IAAG;IAC3C,MAAMC,UAAU,GAAGzB,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHjB,OAAO,MAAEL,mBAAY,EAACI,mBAAmB,CAACC,OAAO,EAAE0C,UAAU,CAAC1C,OAAO,CAAC,uBAAA,EAA0B,CAAC;QACjGC,UAAU,MAAEN,mBAAY,EAACI,mBAAmB,CAACE,UAAU,EAAEyC,UAAU,CAACzC,UAAU,CAAC,0BAAA,EAA6B,CAAC;QAC7GC,WAAW,MAAEP,mBAAY,EAACI,mBAAmB,CAACG,WAAW,EAAEwC,UAAU,CAACxC,WAAW,CAAC,2BAAA,EAA8B;IACpH,CAAC;AACL,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/LineChart/useLineChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { LineChartProps, LineChartStyles } from './LineChart.types';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { HighContrastSelector } from '../../utilities/index';\n\n/**\n * @internal\n */\nexport const linechartClassNames: SlotClassNames<LineChartStyles> = {\n tooltip: 'fui-line__tooltip',\n lineBorder: 'fui-line_lineBorder',\n markerLabel: 'fui-line__markerLabel',\n root: 'fui-line__root',\n xAxis: 'fui-line__xAxis',\n yAxis: 'fui-line__yAxis',\n legendContainer: 'fui-line__legendContainer',\n hover: 'fui-line__hover',\n descriptionMessage: 'fui-line__descriptionMessage',\n axisTitle: 'fui-line__axisTitle',\n chartTitle: 'fui-line__chartTitle',\n opacityChangeOnHover: 'fui-line__opacityChangeOnHover',\n shapeStyles: 'fui-line__shapeStyles',\n chartWrapper: 'fui-line__chartWrapper',\n svgTooltip: '',\n chart: '',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n tooltip: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n },\n lineBorder: {\n stroke: tokens.colorNeutralBackground1,\n [HighContrastSelector]: {\n stroke: 'Canvas',\n },\n },\n markerLabel: {\n fill: tokens.colorNeutralForeground1,\n textAnchor: 'middle',\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText',\n },\n },\n },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useLineChartStyles = (props: LineChartProps): LineChartStyles => {\n const baseStyles = useStyles();\n return {\n tooltip: mergeClasses(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n lineBorder: mergeClasses(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/),\n markerLabel: mergeClasses(linechartClassNames.markerLabel, baseStyles.markerLabel /*props.styles?.markerLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","HighContrastSelector","linechartClassNames","tooltip","lineBorder","markerLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","borderRadius","borderRadiusSmall","pointerEvents","stroke","colorNeutralForeground1","textAnchor","selectors","useLineChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IASaK,mBAAAA;;;
|
|
1
|
+
{"version":3,"sources":["../src/components/LineChart/useLineChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { LineChartProps, LineChartStyles } from './LineChart.types';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { HighContrastSelector } from '../../utilities/index';\n\n/**\n * @internal\n */\nexport const linechartClassNames: SlotClassNames<LineChartStyles> = {\n tooltip: 'fui-line__tooltip',\n lineBorder: 'fui-line_lineBorder',\n markerLabel: 'fui-line__markerLabel',\n root: 'fui-line__root',\n xAxis: 'fui-line__xAxis',\n yAxis: 'fui-line__yAxis',\n legendContainer: 'fui-line__legendContainer',\n hover: 'fui-line__hover',\n descriptionMessage: 'fui-line__descriptionMessage',\n axisTitle: 'fui-line__axisTitle',\n chartTitle: 'fui-line__chartTitle',\n opacityChangeOnHover: 'fui-line__opacityChangeOnHover',\n shapeStyles: 'fui-line__shapeStyles',\n chartWrapper: 'fui-line__chartWrapper',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n tooltip: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n },\n lineBorder: {\n stroke: tokens.colorNeutralBackground1,\n [HighContrastSelector]: {\n stroke: 'Canvas',\n },\n },\n markerLabel: {\n fill: tokens.colorNeutralForeground1,\n textAnchor: 'middle',\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText',\n },\n },\n },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useLineChartStyles = (props: LineChartProps): LineChartStyles => {\n const baseStyles = useStyles();\n return {\n tooltip: mergeClasses(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n lineBorder: mergeClasses(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/),\n markerLabel: mergeClasses(linechartClassNames.markerLabel, baseStyles.markerLabel /*props.styles?.markerLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","HighContrastSelector","linechartClassNames","tooltip","lineBorder","markerLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","borderRadius","borderRadiusSmall","pointerEvents","stroke","colorNeutralForeground1","textAnchor","selectors","useLineChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IASaK,mBAAAA;;;sBAuDAoC;;;;uBAhEwC,iBAAiB;4BAC/C,wBAAwB;uBAGV,wBAAwB;AAKtD,4BAA6D;IAClEnC,SAAS;IACTC,YAAY;IACZC,aAAa;IACbC,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;;CAEC,GACD,MAAMC,YAAYvB,qBAAAA,EAAW;IAC3BM,SAAS;QACPkB,SAAS;QACTC,eAAe;QACf,GAAGvB,iBAAAA,CAAWwB,OAAO,CAACvB,kBAAAA,CAAOwB,kBAAkB,CAAC;QAChDC,UAAU;QACVC,WAAW;QACXC,KAAK3B,kBAAAA,CAAO4B,mBAAmB;QAC/BC,MAAM7B,kBAAAA,CAAO8B,uBAAuB;QACpCC,cAAc/B,kBAAAA,CAAOgC,iBAAiB;QACtCC,eAAe;IACjB;IACA7B,YAAY;QACV8B,QAAQlC,kBAAAA,CAAO8B,uBAAuB;QACtC,CAAC7B,2BAAAA,CAAqB,EAAE;YACtBiC,QAAQ;QACV;IACF;IACA7B,aAAa;QACXwB,MAAM7B,kBAAAA,CAAOmC,uBAAuB;QACpCC,YAAY;QACZC,WAAW;YACT,CAACpC,2BAAAA,CAAqB,EAAE;gBACtB4B,MAAM;YACR;QACF;IACF;AACF;AAKO,MAAMS,qBAAqB,CAACC;IACjC,MAAMC,aAAapB;IACnB,OAAO;QACLjB,aAASL,mBAAAA,EAAaI,oBAAoBC,OAAO,EAAEqC,WAAWrC,OAAO,CAAC,uBAAuB;QAC7FC,gBAAYN,mBAAAA,EAAaI,oBAAoBE,UAAU,EAAEoC,WAAWpC,UAAU,CAAC,0BAA0B;QACzGC,iBAAaP,mBAAAA,EAAaI,oBAAoBG,WAAW,EAAEmC,WAAWnC,WAAW,CAAC,2BAA2B;IAC/G;AACF,EAAE"}
|
|
@@ -163,21 +163,30 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
163
163
|
function _createLegends(data) {
|
|
164
164
|
const { legendProps } = props;
|
|
165
165
|
const isLegendMultiSelectEnabled = !!(legendProps && !!legendProps.canSelectMultipleLegends);
|
|
166
|
-
const
|
|
167
|
-
|
|
166
|
+
const mapLegendToPoints = {};
|
|
167
|
+
data.forEach((point)=>{
|
|
168
|
+
if (point.legend) {
|
|
169
|
+
if (!mapLegendToPoints[point.legend]) {
|
|
170
|
+
mapLegendToPoints[point.legend] = [];
|
|
171
|
+
}
|
|
172
|
+
mapLegendToPoints[point.legend].push(point);
|
|
173
|
+
}
|
|
174
|
+
});
|
|
175
|
+
const legendDataItems = Object.entries(mapLegendToPoints).map(([legendTitle, points])=>{
|
|
176
|
+
const representativePoint = points[0];
|
|
168
177
|
// mapping data to the format Legends component needs
|
|
169
178
|
const legend = {
|
|
170
|
-
title:
|
|
171
|
-
color,
|
|
179
|
+
title: legendTitle,
|
|
180
|
+
color: representativePoint.color,
|
|
172
181
|
onMouseOutAction: ()=>{
|
|
173
182
|
setActiveLegend('');
|
|
174
183
|
},
|
|
175
184
|
hoverAction: ()=>{
|
|
176
185
|
_handleChartMouseLeave();
|
|
177
|
-
setActiveLegend(
|
|
186
|
+
setActiveLegend(legendTitle);
|
|
178
187
|
},
|
|
179
|
-
...
|
|
180
|
-
shape:
|
|
188
|
+
...representativePoint.legendShape && {
|
|
189
|
+
shape: representativePoint.legendShape
|
|
181
190
|
}
|
|
182
191
|
};
|
|
183
192
|
return legend;
|
|
@@ -215,6 +224,12 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
215
224
|
return seriesColor;
|
|
216
225
|
}
|
|
217
226
|
}
|
|
227
|
+
function _getRangeForScatterMarkerSize(yScale, yPadding, xMin, xMax, xPadding) {
|
|
228
|
+
const extraXPixels = _isRTL ? _xAxisScale(xMax - xPadding) - _xAxisScale(xMax) : _xAxisScale(xMin + xPadding) - _xAxisScale(xMin);
|
|
229
|
+
const yMin = yScale.domain()[0];
|
|
230
|
+
const extraYPixels = yScale(yMin) - yScale(yMin + yPadding);
|
|
231
|
+
return Math.min(extraXPixels, extraYPixels);
|
|
232
|
+
}
|
|
218
233
|
function _createPlot(xElement, containerHeight) {
|
|
219
234
|
const series = [];
|
|
220
235
|
if (isSelectedLegend) {
|
|
@@ -229,36 +244,32 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
229
244
|
return (0, _d3array.min)(point.data, (item)=>item.y);
|
|
230
245
|
});
|
|
231
246
|
const yPadding = (yMax - yMin) * 0.1;
|
|
232
|
-
|
|
233
|
-
let
|
|
234
|
-
let
|
|
247
|
+
let xPadding = 0;
|
|
248
|
+
let xMin = 0;
|
|
249
|
+
let xMax = 0;
|
|
235
250
|
if (_xAxisType === _index1.XAxisTypes.StringAxis) {
|
|
236
251
|
_xBandwidth = _xAxisScale.bandwidth() / 2;
|
|
237
|
-
xPaddingRange = _xBandwidth;
|
|
238
252
|
} else if (_xAxisType === _index1.XAxisTypes.DateAxis) {
|
|
239
|
-
|
|
253
|
+
xMin = (0, _d3array.min)(_points, (point)=>{
|
|
240
254
|
return (0, _d3array.min)(point.data, (item)=>item.x);
|
|
241
|
-
});
|
|
242
|
-
|
|
255
|
+
}).getTime();
|
|
256
|
+
xMax = (0, _d3array.max)(_points, (point)=>{
|
|
243
257
|
return (0, _d3array.max)(point.data, (item)=>{
|
|
244
258
|
return item.x;
|
|
245
259
|
});
|
|
246
|
-
});
|
|
247
|
-
|
|
248
|
-
xPaddingRange = Math.abs(_xAxisScale(new Date(xMin.getTime() + xPadding)) - _xAxisScale(xMin));
|
|
260
|
+
}).getTime();
|
|
261
|
+
xPadding = (xMax - xMin) * 0.1;
|
|
249
262
|
} else {
|
|
250
|
-
|
|
263
|
+
xMin = (0, _d3array.min)(_points, (point)=>{
|
|
251
264
|
return (0, _d3array.min)(point.data, (item)=>item.x);
|
|
252
265
|
});
|
|
253
|
-
|
|
266
|
+
xMax = (0, _d3array.max)(_points, (point)=>{
|
|
254
267
|
return (0, _d3array.max)(point.data, (item)=>{
|
|
255
268
|
return item.x;
|
|
256
269
|
});
|
|
257
270
|
});
|
|
258
|
-
|
|
259
|
-
xPaddingRange = Math.abs(_xAxisScale(xMin + xPadding) - _xAxisScale(xMin));
|
|
271
|
+
xPadding = (xMax - xMin) * 0.1;
|
|
260
272
|
}
|
|
261
|
-
maxMarkerRange = Math.min(maxMarkerRange, Math.min(xPaddingRange, yPaddingRange));
|
|
262
273
|
const maxMarkerSize = (0, _d3array.max)(_points, (point)=>{
|
|
263
274
|
return (0, _d3array.max)(point.data, (item)=>{
|
|
264
275
|
return item.markerSize;
|
|
@@ -270,20 +281,20 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
270
281
|
const seriesColor = _points[i].color;
|
|
271
282
|
const verticaLineHeight = containerHeight - margins.bottom + 6;
|
|
272
283
|
for(let j = 0; j < _points[i].data.length; j++){
|
|
284
|
+
var _points_i_data_j;
|
|
273
285
|
const seriesId = `${_seriesId}_${i}_${j}`;
|
|
274
286
|
const circleId = `${_circleId}_${i}_${j}`;
|
|
275
287
|
const { x, y, xAxisCalloutData, xAxisCalloutAccessibilityData } = _points[i].data[j];
|
|
276
|
-
let circleRadius = 3.5;
|
|
277
288
|
const pointMarkerSize = _points[i].data[j].markerSize;
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
}
|
|
289
|
+
const extraMaxPixels = _xAxisType !== _index1.XAxisTypes.StringAxis ? _getRangeForScatterMarkerSize(_yAxisScale, yPadding, xMin, xMax, xPadding) : 0;
|
|
290
|
+
const circleRadius = pointMarkerSize ? pointMarkerSize * extraMaxPixels / maxMarkerSize : activePoint === circleId ? 6 : 4;
|
|
281
291
|
const isLegendSelected = _legendHighlighted(legendVal) || _noLegendHighlighted() || isSelectedLegend;
|
|
282
292
|
const currentPointHidden = _points[i].hideNonActiveDots && activePoint !== circleId;
|
|
283
|
-
|
|
293
|
+
const text = _points === null || _points === void 0 ? void 0 : (_points_i_data_j = _points[i].data[j]) === null || _points_i_data_j === void 0 ? void 0 : _points_i_data_j.text;
|
|
294
|
+
pointsForSeries.push(/*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("circle", {
|
|
284
295
|
id: circleId,
|
|
285
296
|
key: circleId,
|
|
286
|
-
r: circleRadius,
|
|
297
|
+
r: Math.max(circleRadius, 4),
|
|
287
298
|
cx: _xAxisScale(x) + _xBandwidth,
|
|
288
299
|
cy: _yAxisScale(y),
|
|
289
300
|
"data-is-focusable": isLegendSelected,
|
|
@@ -299,7 +310,12 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
299
310
|
role: "img",
|
|
300
311
|
"aria-label": _getAriaLabel(i, j),
|
|
301
312
|
tabIndex: isLegendSelected ? 0 : undefined
|
|
302
|
-
})
|
|
313
|
+
}), ",", text && /*#__PURE__*/ _react.createElement("text", {
|
|
314
|
+
key: `${circleId}-label`,
|
|
315
|
+
x: _xAxisScale(x) + _xBandwidth,
|
|
316
|
+
y: _yAxisScale(y) + Math.max(circleRadius + 8, 16),
|
|
317
|
+
className: classes.markerLabel
|
|
318
|
+
}, text)));
|
|
303
319
|
}
|
|
304
320
|
series.push(/*#__PURE__*/ _react.createElement("g", {
|
|
305
321
|
key: `series_${i}`,
|
|
@@ -426,6 +442,7 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
426
442
|
function _isChartEmpty() {
|
|
427
443
|
return !(props.data && props.data.scatterChartData && props.data.scatterChartData.length > 0 && props.data.scatterChartData.filter((item)=>item.data.length).length > 0);
|
|
428
444
|
}
|
|
445
|
+
const _getMinMaxofXAxis = _react.useCallback((points, yAxisType)=>_getNumericMinMaxOfY(points, yAxisType), []);
|
|
429
446
|
const { legendProps, tickValues, tickFormat } = props;
|
|
430
447
|
_points = _injectIndexPropertyInScatterChartData(props.data.scatterChartData);
|
|
431
448
|
let points = _points;
|
|
@@ -473,7 +490,7 @@ const ScatterChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
473
490
|
getmargins: _getMargins,
|
|
474
491
|
getGraphData: _initializeScatterChartData,
|
|
475
492
|
xAxisType: _xAxisType,
|
|
476
|
-
getMinMaxOfYAxis:
|
|
493
|
+
getMinMaxOfYAxis: _getMinMaxofXAxis,
|
|
477
494
|
getDomainNRangeValues: _getDomainNRangeValues,
|
|
478
495
|
createYAxis: _index1.createNumericYAxis,
|
|
479
496
|
createStringYAxis: _index1.createStringYAxis,
|