@fluentui/react-charting 5.23.14 → 5.23.16

package/lib-commonjs/components/PieChart/PieChart.styles.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStyles = void 0;
+var tslib_1 = require("tslib");
+var getStyles = function (props) {
+    var className = props.className, theme = props.theme, width = props.width, height = props.height;
+    var chartWidth = width + 30;
+    var chartPadding = 20;
+    var chartHeight = height + 10;
+    return {
+        root: [
+            theme.fonts.medium,
+            'ms-PieChart',
+            className,
+            {
+                width: chartWidth + 2 * chartPadding,
+            },
+        ],
+        chart: [
+            {
+                padding: chartPadding,
+                width: chartWidth,
+                height: chartHeight,
+                boxSizing: 'content-box',
+            },
+        ],
+        chartTitle: [
+            tslib_1.__assign({ textAlign: 'center' }, theme.fonts.mediumPlus),
+        ],
+    };
+};
+exports.getStyles = getStyles;
+//# sourceMappingURL=PieChart.styles.js.map

package/lib-commonjs/components/PieChart/PieChart.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PieChart.styles.js","sourceRoot":"../src/","sources":["components/PieChart/PieChart.styles.ts"],"names":[],"mappings":";;;;AAEO,IAAM,SAAS,GAAG,UAAC,KAA0B;IAC1C,IAAA,SAAS,GAA2B,KAAK,UAAhC,EAAE,KAAK,GAAoB,KAAK,MAAzB,EAAE,KAAK,GAAa,KAAK,MAAlB,EAAE,MAAM,GAAK,KAAK,OAAV,CAAW;IAElD,IAAM,UAAU,GAAG,KAAK,GAAG,EAAE,CAAC;IAC9B,IAAM,YAAY,GAAG,EAAE,CAAC;IACxB,IAAM,WAAW,GAAG,MAAM,GAAG,EAAE,CAAC;IAEhC,OAAO;QACL,IAAI,EAAE;YACJ,KAAK,CAAC,KAAK,CAAC,MAAM;YAClB,aAAa;YACb,SAAS;YACT;gBACE,KAAK,EAAE,UAAU,GAAG,CAAC,GAAG,YAAY;aACrC;SACF;QACD,KAAK,EAAE;YACL;gBACE,OAAO,EAAE,YAAY;gBACrB,KAAK,EAAE,UAAU;gBACjB,MAAM,EAAE,WAAW;gBACnB,SAAS,EAAE,aAAa;aACzB;SACF;QACD,UAAU,EAAE;+BAER,SAAS,EAAE,QAAQ,IAChB,KAAK,CAAC,KAAK,CAAC,UAAU;SAE5B;KACF,CAAC;AACJ,CAAC,CAAC;AA/BW,QAAA,SAAS,aA+BpB","sourcesContent":["import { IPieChartStyleProps, IPieChartStyles } from './PieChart.types';\n\nexport const getStyles = (props: IPieChartStyleProps): IPieChartStyles => {\n  const { className, theme, width, height } = props;\n\n  const chartWidth = width + 30;\n  const chartPadding = 20;\n  const chartHeight = height + 10;\n\n  return {\n    root: [\n      theme.fonts.medium,\n      'ms-PieChart',\n      className,\n      {\n        width: chartWidth + 2 * chartPadding,\n      },\n    ],\n    chart: [\n      {\n        padding: chartPadding,\n        width: chartWidth,\n        height: chartHeight,\n        boxSizing: 'content-box',\n      },\n    ],\n    chartTitle: [\n      {\n        textAlign: 'center',\n        ...theme.fonts.mediumPlus,\n      },\n    ],\n  };\n};\n"]}

package/lib-commonjs/components/PieChart/PieChart.types.d.ts

@@ -0,0 +1,75 @@
+import { ITheme, IStyle } from '@fluentui/react/lib/Styling';
+import { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';
+import { IDataPoint } from '../../types/IDataPoint';
+export type { IDataPoint } from '../../types/IDataPoint';
+export interface IPieChart {
+}
+/**
+ * Pie Chart properties
+ * {@docCategory PieChart}
+ */
+export interface IPieChartProps {
+    /**
+     * Data to render in the chart.
+     */
+    data?: IDataPoint[];
+    /**
+     * Width of the chart.
+     */
+    width?: number;
+    /**
+     * Height of the chart.
+     */
+    height?: number;
+    /**
+     * colors to render in the chart.
+     */
+    colors?: string[];
+    /**
+     * Title to apply to the whole chart.
+     */
+    chartTitle?: string;
+    /**
+     * Additional CSS class(es) to apply to the PieChart.
+     */
+    className?: string;
+    /**
+     * Theme (provided through customization.)
+     */
+    theme?: ITheme;
+    /**
+     * Call to provide customized styling that will layer on top of the variant rules.
+     */
+    styles?: IStyleFunctionOrObject<IPieChartStyleProps, IPieChartStyles>;
+    /**
+     * Width of line stroke
+     */
+    strokeWidth?: number;
+    /**
+     * The prop used to define the culture to localized the numbers
+     */
+    culture?: string;
+}
+/**
+ * Pie Chart style properties
+ * {@docCategory PieChart}
+ */
+export type IPieChartStyleProps = Required<Pick<IPieChartProps, 'theme' | 'width' | 'height'>> & Pick<IPieChartProps, 'className'>;
+/**
+ * Pie Chart styles
+ * {@docCategory PieChart}
+ */
+export interface IPieChartStyles {
+    /**
+     *  Style for the root element.
+     */
+    root?: IStyle;
+    /**
+     * Style for the chart.
+     */
+    chart?: IStyle;
+    /**
+     * Style for the chart Title.
+     */
+    chartTitle?: IStyle;
+}

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

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=PieChart.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PieChart.types.js","sourceRoot":"../src/","sources":["components/PieChart/PieChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IDataPoint } from '../../types/IDataPoint';\nexport type { IDataPoint } from '../../types/IDataPoint';\nexport interface IPieChart {}\n\n/**\n * Pie Chart properties\n * {@docCategory PieChart}\n */\nexport interface IPieChartProps {\n  /**\n   * Data to render in the chart.\n   */\n  data?: IDataPoint[];\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * Height of the chart.\n   */\n  height?: number;\n\n  /**\n   * colors to render in the chart.\n   */\n  colors?: string[];\n\n  /**\n   * Title to apply to the whole chart.\n   */\n  chartTitle?: string;\n\n  /**\n   * Additional CSS class(es) to apply to the PieChart.\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<IPieChartStyleProps, IPieChartStyles>;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * The prop used to define the culture to localized the numbers\n   */\n  culture?: string;\n}\n\n/**\n * Pie Chart style properties\n * {@docCategory PieChart}\n */\nexport type IPieChartStyleProps = Required<Pick<IPieChartProps, 'theme' | 'width' | 'height'>> &\n  Pick<IPieChartProps, 'className'>;\n\n/**\n * Pie Chart styles\n * {@docCategory PieChart}\n */\nexport interface IPieChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: IStyle;\n\n  /**\n   * Style for the chart.\n   */\n  chart?: IStyle;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: IStyle;\n}\n"]}

package/lib-commonjs/components/PieChart/index.d.ts

@@ -0,0 +1,2 @@
+export * from './PieChart';
+export * from './PieChart.types';

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

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./PieChart"), exports);
+tslib_1.__exportStar(require("./PieChart.types"), exports);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/PieChart/index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B;AAC3B,2DAAiC","sourcesContent":["export * from './PieChart';\nexport * from './PieChart.types';\n"]}

package/lib-commonjs/components/SankeyChart/SankeyChart.base.d.ts

@@ -0,0 +1,90 @@
+import { SankeyGraph, SankeyLayout } from 'd3-sankey';
+import * as React from 'react';
+import { IBasestate, SLink, SNode } from '../../types/IDataPoint';
+import { IChartHoverCardProps } from '../../utilities/ChartHoverCard/ChartHoverCard.types';
+import { IMargins } from '../../utilities/utilities';
+import { ISankeyChartData, ISankeyChartProps } from './SankeyChart.types';
+type NodesInColumns = {
+    [key: number]: SNode[];
+};
+type SankeyLayoutGenerator = SankeyLayout<SankeyGraph<{}, {}>, {}, {}>;
+export interface ISankeyChartState extends IBasestate, IChartHoverCardProps {
+    containerWidth: number;
+    containerHeight: number;
+    selectedState: boolean;
+    selectedLinks: Set<Number>;
+    selectedNodes: Set<Number>;
+    selectedNode?: SNode;
+    refSelected?: any;
+    selectedLink?: SLink;
+    shouldOverflow: boolean;
+}
+/**
+ * This is used to group nodes by column index.
+ */
+export declare function groupNodesByColumn(graph: ISankeyChartData): NodesInColumns;
+/**
+ * This is used to introduce dynamic padding for cases where the number of nodes in a column is huge
+ * so that we maintain a node to space ratio for such columns as if we fail to do so the
+ * chart is devoid of nodes and only shows links.
+ */
+export declare function adjustPadding(sankey: SankeyLayoutGenerator, height: number, nodesInColumn: NodesInColumns): void;
+export declare function preRenderLayout(margins: IMargins, containerWidth: number, containerHeight: number, isRtl: boolean): {
+    sankey: SankeyLayoutGenerator;
+    height: number;
+    width: number;
+};
+export declare class SankeyChartBase extends React.Component<ISankeyChartProps, ISankeyChartState> {
+    static defaultProps: Partial<ISankeyChartProps>;
+    private chartContainer;
+    private _reqID;
+    private readonly _calloutId;
+    private readonly _linkId;
+    private readonly _chartId;
+    private readonly _emptyChartId;
+    private readonly _labelTooltipId;
+    private readonly _margins;
+    private readonly _isRtl;
+    private _numColumns;
+    private readonly _computeClassNamesProps;
+    private readonly _computeClassNames;
+    private readonly _normalizeData;
+    private readonly _fetchTooltip;
+    private readonly _nodeAttributes;
+    private readonly _linkAttributes;
+    private readonly _fetchNodes;
+    private readonly _fetchLinks;
+    private readonly _strings;
+    private readonly _accessibility;
+    constructor(props: ISankeyChartProps);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: ISankeyChartProps): void;
+    componentWillUnmount(): void;
+    render(): React.ReactNode;
+    private _computeNodeAttributes;
+    private _linkCalloutAttributes;
+    private _normalizeSankeyData;
+    private _labelTooltipDiv;
+    private _createLinks;
+    private _createNodes;
+    private _onLeave;
+    private _onHover;
+    private _formatNumber;
+    private _onStreamHover;
+    private _onStreamLeave;
+    private _onFocusLink;
+    private _onCloseCallout;
+    private _onBlur;
+    private _fillNodeColors;
+    private _fillStreamColors;
+    private _fillStreamBorder;
+    private _fillNodeBorder;
+    private _getOpacityStream;
+    private _getOpacityStreamBorder;
+    private _fitParentContainer;
+    private _showTooltip;
+    private _hideTooltip;
+    private _isChartEmpty;
+    private _calculateChartMinWidth;
+}
+export {};