@fluentui/react-charting 5.12.27 → 5.12.30

package/CHANGELOG.json

@@ -2,7 +2,64 @@
   "name": "@fluentui/react-charting",
   "entries": [
     {
-      "date": "Wed, 24 Aug 2022 16:34:25 GMT",
+      "date": "Mon, 29 Aug 2022 07:42:53 GMT",
+      "tag": "@fluentui/react-charting_v5.12.30",
+      "version": "5.12.30",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-charting",
+            "comment": "Bump @fluentui/react-focus to v8.8.3",
+            "commit": "a3081ce8cb9aef65dd64fe9328b84959d7b0e665"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-charting",
+            "comment": "Bump @fluentui/react to v8.93.0",
+            "commit": "a3081ce8cb9aef65dd64fe9328b84959d7b0e665"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 26 Aug 2022 07:39:57 GMT",
+      "tag": "@fluentui/react-charting_v5.12.29",
+      "version": "5.12.29",
+      "comments": {
+        "patch": [
+          {
+            "author": "atishay.jain@microsoft.com",
+            "package": "@fluentui/react-charting",
+            "commit": "6faffd280a37636c7917752693b7bf627caec32d",
+            "comment": "Update documentation for charting library"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-charting",
+            "comment": "Bump @fluentui/react to v8.92.1",
+            "commit": "744f8e5ccf138ef8c893929c77a1e85f484415d4"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 25 Aug 2022 07:41:03 GMT",
+      "tag": "@fluentui/react-charting_v5.12.28",
+      "version": "5.12.28",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-charting",
+            "comment": "Bump @fluentui/react to v8.92.0",
+            "commit": "4f36c51b9bde0c98b43da00ad13366a0cc0383cf"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 24 Aug 2022 16:36:06 GMT",
       "tag": "@fluentui/react-charting_v5.12.27",
       "version": "5.12.27",
       "comments": {
@@ -11,13 +68,13 @@
             "author": "beachball",
             "package": "@fluentui/react-charting",
             "comment": "Bump @fluentui/react-focus to v8.8.2",
-            "commit": "7c7f113c5db25307df478f48612dd0fa77f8e8d4"
+            "commit": "5c15d8495a026efaa56e5d5444b211a5cb5280fe"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-charting",
             "comment": "Bump @fluentui/react to v8.91.1",
-            "commit": "7c7f113c5db25307df478f48612dd0fa77f8e8d4"
+            "commit": "5c15d8495a026efaa56e5d5444b211a5cb5280fe"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,18 +1,47 @@
 # Change Log - @fluentui/react-charting
 
-This log was last generated on Wed, 24 Aug 2022 16:34:25 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Aug 2022 07:42:53 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [5.12.30](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.12.30)
+
+Mon, 29 Aug 2022 07:42:53 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.12.29..@fluentui/react-charting_v5.12.30)
+
+### Patches
+
+- Bump @fluentui/react-focus to v8.8.3 ([PR #24554](https://github.com/microsoft/fluentui/pull/24554) by beachball)
+- Bump @fluentui/react to v8.93.0 ([PR #24554](https://github.com/microsoft/fluentui/pull/24554) by beachball)
+
+## [5.12.29](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.12.29)
+
+Fri, 26 Aug 2022 07:39:57 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.12.28..@fluentui/react-charting_v5.12.29)
+
+### Patches
+
+- Update documentation for charting library ([PR #21773](https://github.com/microsoft/fluentui/pull/21773) by atishay.jain@microsoft.com)
+- Bump @fluentui/react to v8.92.1 ([PR #24492](https://github.com/microsoft/fluentui/pull/24492) by beachball)
+
+## [5.12.28](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.12.28)
+
+Thu, 25 Aug 2022 07:41:03 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.12.27..@fluentui/react-charting_v5.12.28)
+
+### Patches
+
+- Bump @fluentui/react to v8.92.0 ([PR #24515](https://github.com/microsoft/fluentui/pull/24515) by beachball)
+
 ## [5.12.27](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.12.27)
 
-Wed, 24 Aug 2022 16:34:25 GMT 
+Wed, 24 Aug 2022 16:36:06 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charting_v5.12.26..@fluentui/react-charting_v5.12.27)
 
 ### Patches
 
-- Bump @fluentui/react-focus to v8.8.2 ([PR #24500](https://github.com/microsoft/fluentui/pull/24500) by beachball)
-- Bump @fluentui/react to v8.91.1 ([PR #24500](https://github.com/microsoft/fluentui/pull/24500) by beachball)
+- Bump @fluentui/react-focus to v8.8.2 ([PR #24485](https://github.com/microsoft/fluentui/pull/24485) by beachball)
+- Bump @fluentui/react to v8.91.1 ([PR #24485](https://github.com/microsoft/fluentui/pull/24485) by beachball)
 
 ## [5.12.26](https://github.com/microsoft/fluentui/tree/@fluentui/react-charting_v5.12.26)
 

package/README.md

@@ -13,9 +13,10 @@ This library is also supported for fluent UI [v7](https://github.com/microsoft/f
 
 **Using the library**
 
-The documentation and examples for the charting library are available on the [demo site](https://aka.ms/fluentcharting).
+Examples and code snippets for the charting library are available on the [demo site](https://aka.ms/fluentcharting).
+The code snippets can be used as usage guide for all the props and chart variations. Click on 'Show code' on the demo site to access demo for each variant.
 
-If using npm, install the package
+The library is published as a npm package to public npm feed. To install the package
 
 ```js
 npm install @fluentui/react-charting
@@ -27,18 +28,31 @@ To import charting components:
 import { ComponentName } from '@fluentui/react-charting/lib/ComponentName';
 ```
 
+**Technical Guide**
+
+Technical information about chart components is available at [Technical details](./TechnicalDetails.md)
+
 **Contributing**
 
 Refer the main fluentui [wiki](https://github.com/microsoft/fluentui/wiki) for detailed instructions on setup and contributing to the package.
 
-**Future roadmap**.
+**Testing**
+
+The library has sufficient number of snapshot tests to test for visual regressions.
+Run `yarn test` from within the package to run all the tests.
 
-Work In Progress. To be published soon.
+**Versioning and changelog**
 
-**FAQ**
+We use SemVer for versioning. For the versions available, see the [tags](https://github.com/microsoft/fluentui/tags) on this repository.
 
-Work In Progress. To be published soon
+Refer to the [changelog](https://github.com/microsoft/fluentui/blob/master/packages/react-charting/CHANGELOG.md) for details about changes made in each version.
 
 **Contact**
 
-You can reach out to the charting team by tagging `@microsoft/charting-team` in discussion items.
+You can reach out to the charting team by tagging `@microsoft/charting-team` in [discussion](https://github.com/microsoft/fluentui/discussions) items.
+
+You could also create issues under the [charting](https://github.com/microsoft/fluentui/labels/Package:%20charting) tag.
+
+**Coding Guidelines**
+
+Refer fluent [Coding guidelines](https://github.com/microsoft/fluentui/wiki/Coding-Style)

package/TechnicalDetails.md

@@ -0,0 +1,76 @@
+# Technical details
+
+**Overview**
+
+This document describes different charts and their components in detail.
+
+This can be used as a guide to use the charts and contribute new functionalities or improvements to the library.
+
+**Components**
+
+The charting components are built using following building blocks.
+
+- Cartesian Charts.
+
+  - Charts built using cartesian coordinate system (two axes - x axis perpendicular to y axis) are called cartesian charts. Majority of the chart in the library are cartesian charts. Some charts like horizontal chart, donut chart, sankey and tree charts are non cartesian charts.
+
+- Legends.
+
+  - A legend contains a list of the variables appearing in the chart and an example of their appearance. This information allows the data from each variable to be identified in the chart.
+
+- Hover Callouts.
+
+  - Whenever the mouse is hovered over a datapoint, a callout is shown representing the details of data for that point. For a stacked chart, the hover callout can represent the data for all the points for the same X coordinate.
+
+- Axes.
+
+  - Our charts currently support cartesian axes. Different charts support different type of axes - numerical axis, date or time series axis, string or categorical axis. Detals about supported axes can be found in readme for each chart.
+
+  - Axes support for different charts
+
+    | Chart                      | Numeric Axis | Date Axis | String Axis |
+    | -------------------------- | ------------ | --------- | ----------- |
+    | Line Chart                 | Yes          | Yes       | No          |
+    | Area Chart                 | Yes          | Yes       | No          |
+    | Vertical Bar Chart         | Yes          | No        | Yes         |
+    | Vertical Stacked Bar Chart | Yes          | No        | Yes         |
+    | Grouped Vertical Bar Chart | No           | No        | Yes         |
+    | Heatmap Chart              | Yes          | Yes       | Yes         |
+    | Horizontal Bar Chart       | --           | --        | --          |
+    | Donut Chart                | --           | --        | --          |
+    | Sankey Chart               | --           | --        | --          |
+    | Tree Chart                 | --           | --        | --          |
+    | Sparkline Chart            | --           | --        | --          |
+
+- Event annotations (Available in line charts).
+
+  - Data can be annotated using vertical lines representing the events of interest. See [line chart with events](https://fluentuipr.z22.web.core.windows.net/heads/master/react-charting/demo/index.html#/examples/linechart#Variants) for example.
+
+- Typography.
+
+  - Our font classes represent the type ramp for the fluent design language. Each base class sets a default size, weight, and color.
+
+- Colors
+
+  - The charts are designed using the accessible color palette defined for the fluent design system.
+
+- Themes
+
+  - The library supports light and dark mode out of box. In addition, consumers can define their own themese as detailed [here](https://github.com/microsoft/fluentui/wiki/Theming)
+
+- Accessibility.
+
+  - Our charts have elaborate accessibility support. The charts are WCAG 2.1 MAS C compliant for accessibility.
+    Consumers can define their own aria labels for each point by setting the `xAxisCalloutAccessibilityData` and `callOutAccessibilityData` properties.
+
+- RTL Support
+
+  - The charts support RTL languages wherever applicable.
+
+- Component Styling
+
+  - [This article](https://github.com/microsoft/fluentui/wiki/Component-Styling) talks about the styling approach followed within charting library.
+
+- Details about ticks.
+  - Tick values are applicable only for date axis. Doesn't work for string or numeric axis.
+    Tickcount works for numeric and date axis. Doesn't work for string (scaleBand) axis.