@fluentui/react-charting 5.21.32 → 5.22.0

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@fluentui/react-charting",
   "entries": [
     {
-      "date": "Thu, 15 Aug 2024 07:21:43 GMT",
+      "date": "Fri, 16 Aug 2024 07:20:58 GMT",
+      "tag": "@fluentui/react-charting_v5.22.0",
+      "version": "5.22.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "t-shawngrant@microsoft.com",
+            "package": "@fluentui/react-charting",
+            "commit": "2eac1694be564ec172b58f1ca2805e352d79e15e",
+            "comment": "Add Viva dataviz gradient palette and rounded corners to charts"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 15 Aug 2024 07:23:37 GMT",
       "tag": "@fluentui/react-charting_v5.21.32",
       "version": "5.21.32",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,21 @@
 # Change Log - @fluentui/react-charting
 
-This log was last generated on Thu, 15 Aug 2024 07:21:43 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Aug 2024 07:20:58 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [5.22.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.22.0)
+
+Fri, 16 Aug 2024 07:20:58 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.21.32..@fluentui/react-charting_v5.22.0)
+
+### Minor changes
+
+- Add Viva dataviz gradient palette and rounded corners to charts ([PR #32008](https://github.com/microsoft/fluentui/pull/32008) by t-shawngrant@microsoft.com)
+
 ## [5.21.32](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.21.32)
 
-Thu, 15 Aug 2024 07:21:43 GMT 
+Thu, 15 Aug 2024 07:23:37 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.21.31..@fluentui/react-charting_v5.21.32)
 
 ### Patches

package/dist/react-charting.d.ts

@@ -58,6 +58,35 @@ declare enum CustomPoints {
     dottedLine = 0
 }
 
+export declare const DataVizGradientPalette: {
+    gradient1: string;
+    gradient2: string;
+    gradient3: string;
+    gradient4: string;
+    gradient5: string;
+    gradient6: string;
+    gradient7: string;
+    gradient8: string;
+    gradient9: string;
+    gradient10: string;
+    gradient1Ext: string;
+    gradient2Ext: string;
+    gradient3Ext: string;
+    gradient4Ext: string;
+    gradient5Ext: string;
+    gradient6Ext: string;
+    gradient7Ext: string;
+    gradient8Ext: string;
+    gradient9Ext: string;
+    gradient10Ext: string;
+    success: string;
+    highSuccess: string;
+    warning: string;
+    error: string;
+    highError: string;
+    disabled: string;
+};
+
 export declare const DataVizPalette: {
     color1: string;
     color2: string;
@@ -140,8 +169,12 @@ export declare const getChartHoverCardStyles: (props: IChartHoverCardStyleProps)
 
 export declare const getColorFromToken: (token: string, isDarkTheme?: boolean) => string;
 
+export declare const getGradientFromToken: (token: string, isDarkTheme?: boolean) => [string, string];
+
 export declare const getNextColor: (index: number, offset?: number, isDarkTheme?: boolean) => string;
 
+export declare const getNextGradient: (index: number, offset?: number, isDarkTheme?: boolean) => [string, string];
+
 /**
  * GroupedVerticalBarchart component.
  * {@docCategory GroupedVerticalBarChart}
@@ -649,6 +682,11 @@ export declare interface IChartDataPoint {
      * Color for the legend in the chart. If not provided, it will fallback on the default color palette.
      */
     color?: string;
+    /**
+     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
+     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
+     */
+    gradient?: [string, string];
     /**
      * placeholder data point
      */
@@ -937,6 +975,16 @@ export declare interface IDonutChartProps extends ICartesianChartProps {
      * @default true
      */
     hideLabels?: boolean;
+    /**
+     * Prop to enable the gradient in the chart
+     * @default false
+     */
+    enableGradient?: boolean;
+    /**
+     * Prop to enable the round corners in the chart
+     * @default false
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -1067,6 +1115,16 @@ export declare interface IGaugeChartProps {
      * @defaultvalue GaugeChartVariant.MultipleSegments
      */
     variant?: GaugeChartVariant;
+    /**
+     * Prop to enable the gradient in the chart
+     * @default false
+     */
+    enableGradient?: boolean;
+    /**
+     * Prop to enable the round corners in the chart
+     * @default false
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -1086,6 +1144,10 @@ export declare interface IGaugeChartSegment {
      * Color of the segment
      */
     color?: string;
+    /**
+     * Gradient color of the segment
+     */
+    gradient?: [string, string];
     /**
      * Accessibility data for the segment
      */
@@ -1311,6 +1373,16 @@ export declare interface IGroupedVerticalBarChartProps extends ICartesianChartPr
      * Only applicable to string x-axis.
      */
     xAxisOuterPadding?: number;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -1351,6 +1423,11 @@ export declare interface IGVBarChartSeriesPoint {
      * Color for the legend in the chart
      */
     color: string;
+    /**
+     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
+     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
+     */
+    gradient?: [string, string];
     /**
      * Legend text in the chart
      */
@@ -1637,6 +1714,16 @@ export declare interface IHorizontalBarChartProps {
      * @default false
      */
     hideLabels?: boolean;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -1756,6 +1843,11 @@ export declare interface IHorizontalBarChartWithAxisDataPoint {
      * color for the legend in the chart
      */
     color?: string;
+    /**
+     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
+     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
+     */
+    gradient?: [string, string];
     /**
      * Callout data for x axis
      * This is an optional prop, If haven;t given legend will take
@@ -1829,6 +1921,16 @@ export declare interface IHorizontalBarChartWithAxisProps extends ICartesianChar
      *@default false
      *Used for showing complete y axis lables   */
     showYAxisLables?: boolean;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the bars.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -2654,6 +2756,16 @@ export declare interface IMultiStackedBarChartProps {
      * @default false
      */
     hideLabels?: boolean;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -3200,6 +3312,16 @@ export declare interface IStackedBarChartProps {
      * The prop used to define the culture to localized the numbers
      */
     culture?: string;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -3538,6 +3660,11 @@ export declare interface IVerticalBarChartDataPoint {
      * color for the legend in the chart
      */
     color?: string;
+    /**
+     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
+     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
+     */
+    gradient?: [string, string];
     /**
      * Callout data for x axis
      * This is an optional prop, If haven;t given legend will take
@@ -3643,6 +3770,16 @@ export declare interface IVerticalBarChartProps extends ICartesianChartProps {
      * Only applicable to string x-axis.
      */
     xAxisOuterPadding?: number;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -3817,6 +3954,16 @@ export declare interface IVerticalStackedBarChartProps extends ICartesianChartPr
      * Only applicable to string x-axis.
      */
     xAxisOuterPadding?: number;
+    /**
+     * @default false
+     * The prop used to enable gradient fill color for the chart.
+     */
+    enableGradient?: boolean;
+    /**
+     * @default false
+     * The prop used to enable rounded corners for the chart.
+     */
+    roundCorners?: boolean;
 }
 
 /**
@@ -3932,6 +4079,11 @@ export declare interface IVSChartDataPoint {
      * color for the legend in the chart
      */
     color?: string;
+    /**
+     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
+     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
+     */
+    gradient?: [string, string];
     /**
      * Callout data for x axis
      * This is an optional prop, If haven;t given legend will take