@fluentui/react-charting 5.16.22 → 5.16.23

package/lib-amd/components/Legends/Legends.types.d.ts

@@ -1,169 +0,0 @@
-import * as React from 'react';
-import { ITheme, IStyle } from '@fluentui/react/lib/Styling';
-import { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';
-import { IHoverCardStyleProps, IHoverCardStyles } from '@fluentui/react/lib/HoverCard';
-import { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';
-import { IFocusZoneProps } from '@fluentui/react-focus';
-import { CustomPoints, Points } from '../../utilities/utilities';
-export interface ILegendOverflowData {
-    primary: ILegend[];
-    overflow?: ILegend[];
-}
-export interface ILegendSubComponentStyles {
-    hoverCardStyles: IStyleFunctionOrObject<IHoverCardStyleProps, IHoverCardStyles>;
-}
-export interface ILegendsStyles {
-    /**
-     * Style set for the root of the legend component
-     */
-    root: IStyle;
-    /**
-     * Style set for Legend. This is a wrapping class for text of legend and the rectange box that represents a legend
-     */
-    legend: IStyle;
-    /**
-     * Style set for the rectangle that represents a legend
-     */
-    rect: IStyle;
-    /**
-     * styles set for the shape that represents a legend
-     */
-    shape: IStyle;
-    /**
-     * Style set for the triangle that represents a legend
-     */
-    triangle: IStyle;
-    /**
-     * Style for the legend text
-     */
-    text: IStyle;
-    /**
-     * Style for the legend text
-     */
-    hoverChange: IStyle;
-    /**
-     * Style for the text that indicates the no.of legends that are in hovercard due to lack of space
-     */
-    overflowIndicationTextStyle: IStyle;
-    /**
-     * Style for the overflow container
-     */
-    hoverCardRoot: IStyle;
-    /**
-     * sub component styles
-     */
-    subComponentStyles: ILegendSubComponentStyles;
-}
-export interface ILegend {
-    /**
-     * Defines the title of the legend
-     */
-    title: string;
-    /**
-     * Defines the function that is executed on clicking this legend
-     */
-    action?: VoidFunction;
-    /**
-     * Defines the function that is executed upon hovering over the legend
-     */
-    hoverAction?: VoidFunction;
-    /**
-     * Defines the function that is executed upon moving the mouse away from the legend
-     */
-    onMouseOutAction?: (isLegendFocused?: boolean) => void;
-    /**
-     * The color for the legend
-     */
-    color: string;
-    /**
-     * The opacity of the legend color
-     */
-    opacity?: number;
-    /**
-     * The shape for the legend
-     */
-    shape?: LegendShape;
-    /**
-     * Indicated whether or not to apply stripe pattern
-     */
-    stripePattern?: boolean;
-    /**
-     * Indicates if the legend belongs to a line in the Bar Chart
-     */
-    isLineLegendInBarChart?: boolean;
-    nativeButtonProps?: React.ButtonHTMLAttributes<HTMLButtonElement>;
-}
-export interface ILegendStyleProps {
-    theme?: ITheme;
-    className?: string;
-    colorOnSelectedState?: string;
-    borderColor?: string;
-    opacity?: number;
-    overflow?: boolean;
-    stripePattern?: boolean;
-    isLineLegendInBarChart?: boolean;
-}
-export interface ILegendsProps {
-    /**
-     * Prop that takes list of legends
-     */
-    legends: ILegend[];
-    /**
-     * Additional CSS class(es) to apply to the legneds component.
-     */
-    className?: string;
-    /**
-     * Theme (provided through customization.)
-     */
-    theme?: ITheme;
-    /**
-     * Call to provide customized styling that will layer on top of the variant rules.
-     */
-    styles?: IStyleFunctionOrObject<ILegendStyleProps, ILegendsStyles>;
-    /**
-     * This prop makes the legends component align itself to the center in the container it is sitting in
-     */
-    centerLegends?: boolean;
-    /**
-     * Enable the legends to wrap lines if there is not enough space to show all legends on a single line
-     */
-    enabledWrapLines?: boolean;
-    /**
-     * props for the overflow set component
-     */
-    overflowProps?: Partial<IOverflowSetProps>;
-    /**
-     * focus zone props in hover card
-     */
-    focusZonePropsInHoverCard?: IFocusZoneProps;
-    /**
-     * text for overflow legends string
-     */
-    overflowText?: string;
-    /**
-     * Prop that takes the active legend
-     */
-    selectedLegend?: string;
-    /**
-     * prop that decides if legends are focusable
-     * @default true
-     */
-    allowFocusOnLegends?: boolean;
-    /**
-     * prop that decide if we can select multiple legends or single legend at a time
-     * @default false
-     */
-    canSelectMultipleLegends?: boolean;
-    /**
-     * Defines the function that is executed upon hiding of hover card
-     * make sure to send prop  when  the prop  is canSelectMultipleLegends is set to ture
-     * and empty the selecetd state legends
-     */
-    onLegendHoverCardLeave?: VoidFunction;
-}
-/**
- * The shape for the legend
- * default: show the rect legend
- * triangle: show the triangle legend
- */
-export declare type LegendShape = 'default' | 'triangle' | keyof typeof Points | keyof typeof CustomPoints;

package/lib-amd/components/Legends/Legends.types.js

@@ -1,5 +0,0 @@
-define(["require", "exports"], function (require, exports) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-});
-//# sourceMappingURL=Legends.types.js.map

package/lib-amd/components/Legends/Legends.types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Legends.types.js","sourceRoot":"../src/","sources":["components/Legends/Legends.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IHoverCardStyleProps, IHoverCardStyles } from '@fluentui/react/lib/HoverCard';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { CustomPoints, Points } from '../../utilities/utilities';\n\nexport interface ILegendOverflowData {\n  primary: ILegend[];\n\n  overflow?: ILegend[];\n}\n\nexport interface ILegendSubComponentStyles {\n  hoverCardStyles: IStyleFunctionOrObject<IHoverCardStyleProps, IHoverCardStyles>;\n}\n\nexport interface ILegendsStyles {\n  /**\n   * Style set for the root of the legend component\n   */\n  root: IStyle;\n\n  /**\n   * Style set for Legend. This is a wrapping class for text of legend and the rectange box that represents a legend\n   */\n  legend: IStyle;\n\n  /**\n   * Style set for the rectangle that represents a legend\n   */\n  rect: IStyle;\n\n  /**\n   * styles set for the shape that represents a legend\n   */\n  shape: IStyle;\n\n  /**\n   * Style set for the triangle that represents a legend\n   */\n  triangle: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  text: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  hoverChange: IStyle;\n\n  /**\n   * Style for the text that indicates the no.of legends that are in hovercard due to lack of space\n   */\n  overflowIndicationTextStyle: IStyle;\n\n  /**\n   * Style for the overflow container\n   */\n  hoverCardRoot: IStyle;\n\n  /**\n   * sub component styles\n   */\n  subComponentStyles: ILegendSubComponentStyles;\n}\n\nexport interface ILegend {\n  /**\n   * Defines the title of the legend\n   */\n  title: string;\n\n  /**\n   * Defines the function that is executed on clicking this legend\n   */\n  action?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon hovering over the legend\n   */\n  hoverAction?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon moving the mouse away from the legend\n   */\n  onMouseOutAction?: (isLegendFocused?: boolean) => void;\n\n  /**\n   * The color for the legend\n   */\n  color: string;\n\n  /**\n   * The opacity of the legend color\n   */\n  opacity?: number;\n\n  /**\n   * The shape for the legend\n   */\n  shape?: LegendShape;\n\n  /**\n   * Indicated whether or not to apply stripe pattern\n   */\n  stripePattern?: boolean;\n\n  /**\n   * Indicates if the legend belongs to a line in the Bar Chart\n   */\n  isLineLegendInBarChart?: boolean;\n\n  /*\n   *  native button props for the legend button\n   */\n  nativeButtonProps?: React.ButtonHTMLAttributes<HTMLButtonElement>;\n}\n\nexport interface ILegendStyleProps {\n  theme?: ITheme;\n  className?: string;\n  colorOnSelectedState?: string;\n  borderColor?: string;\n  opacity?: number;\n  overflow?: boolean;\n  stripePattern?: boolean;\n  isLineLegendInBarChart?: boolean;\n}\n\nexport interface ILegendsProps {\n  /**\n   * Prop that takes list of legends\n   */\n  legends: ILegend[];\n\n  /**\n   * Additional CSS class(es) to apply to the legneds component.\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<ILegendStyleProps, ILegendsStyles>;\n\n  /**\n   * This prop makes the legends component align itself to the center in the container it is sitting in\n   */\n  centerLegends?: boolean;\n\n  /**\n   * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n   */\n  enabledWrapLines?: boolean;\n\n  /**\n   * props for the overflow set component\n   */\n  overflowProps?: Partial<IOverflowSetProps>;\n\n  /**\n   * focus zone props in hover card\n   */\n  focusZonePropsInHoverCard?: IFocusZoneProps;\n\n  /**\n   * text for overflow legends string\n   */\n  overflowText?: string;\n\n  /**\n   * Prop that takes the active legend\n   */\n  selectedLegend?: string;\n\n  /**\n   * prop that decides if legends are focusable\n   * @default true\n   */\n  allowFocusOnLegends?: boolean;\n\n  /**\n   * prop that decide if we can select multiple legends or single legend at a time\n   * @default false\n   */\n  canSelectMultipleLegends?: boolean;\n\n  /**\n   * Defines the function that is executed upon hiding of hover card\n   * make sure to send prop  when  the prop  is canSelectMultipleLegends is set to ture\n   * and empty the selecetd state legends\n   */\n  onLegendHoverCardLeave?: VoidFunction;\n}\n\n/**\n * The shape for the legend\n * default: show the rect legend\n * triangle: show the triangle legend\n */\nexport type LegendShape = 'default' | 'triangle' | keyof typeof Points | keyof typeof CustomPoints;\n"]}

package/lib-amd/components/Legends/index.d.ts

@@ -1,3 +0,0 @@
-export * from './Legends';
-export * from './Legends.types';
-export * from './shape';

package/lib-amd/components/Legends/index.js

@@ -1,8 +0,0 @@
-define(["require", "exports", "tslib", "./Legends", "./Legends.types", "./shape"], function (require, exports, tslib_1, Legends_1, Legends_types_1, shape_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(Legends_1, exports);
-    tslib_1.__exportStar(Legends_types_1, exports);
-    tslib_1.__exportStar(shape_1, exports);
-});
-//# sourceMappingURL=index.js.map

package/lib-amd/components/Legends/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Legends/index.ts"],"names":[],"mappings":";;;IAAA,yCAA0B;IAC1B,+CAAgC;IAChC,uCAAwB","sourcesContent":["export * from './Legends';\nexport * from './Legends.types';\nexport * from './shape';\n"]}

package/lib-amd/components/Legends/shape.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { LegendShape } from './Legends.types';
-export interface IShapeProps {
-    svgProps: React.SVGAttributes<SVGElement>;
-    pathProps: React.SVGAttributes<SVGPathElement>;
-    shape: LegendShape;
-    classNameForNonSvg?: string;
-}
-export declare const Shape: React.FC<IShapeProps>;

package/lib-amd/components/Legends/shape.js

@@ -1,27 +0,0 @@
-define(["require", "exports", "tslib", "react", "../../utilities/utilities"], function (require, exports, tslib_1, React, utilities_1) {
-    "use strict";
-    var _a;
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.Shape = void 0;
-    var pointPath = (_a = {},
-        _a["" + utilities_1.Points[utilities_1.Points.circle]] = 'M1 6 A5 5 0 1 0  12 6 M1 6 A5 5 0 0 1  12 6',
-        _a["" + utilities_1.Points[utilities_1.Points.square]] = 'M1 1 L12 1 L12 12  L1 12 L1 1 Z',
-        _a["" + utilities_1.Points[utilities_1.Points.triangle]] = 'M6 10L8.74228e-07 -1.04907e-06L12 0L6 10Z',
-        _a["" + utilities_1.Points[utilities_1.Points.pyramid]] = 'M6 10L8.74228e-07 -1.04907e-06L12 0L6 10Z',
-        _a["" + utilities_1.Points[utilities_1.Points.diamond]] = 'M2 2 L10 2 L10 10  L2 10 L2 2 Z',
-        _a["" + utilities_1.Points[utilities_1.Points.hexagon]] = 'M9 0H3L0 5L3 10H9L12 5L9 0Z',
-        _a["" + utilities_1.Points[utilities_1.Points.pentagon]] = 'M6.06061 0L0 4.21277L2.30303 11H9.69697L12 4.21277L6.06061 0Z',
-        _a["" + utilities_1.Points[utilities_1.Points.octagon]] = 'M7.08333 0H2.91667L0 2.91667V7.08333L2.91667 10H7.08333L10 7.08333V2.91667L7.08333 0Z',
-        _a["" + utilities_1.CustomPoints[utilities_1.CustomPoints.dottedLine]] = 'M0 6 H3 M5 6 H8 M10 6 H13',
-        _a);
-    var Shape = function (_a) {
-        var svgProps = _a.svgProps, pathProps = _a.pathProps, shape = _a.shape, classNameForNonSvg = _a.classNameForNonSvg;
-        if (Object.keys(pointPath).indexOf(shape) === -1) {
-            return React.createElement("div", { className: classNameForNonSvg });
-        }
-        return (React.createElement("svg", tslib_1.__assign({ width: 14, height: 14, viewBox: '-1 -1 14 14' }, svgProps, { transform: "rotate(" + (shape === utilities_1.Points[utilities_1.Points.diamond] ? 45 : shape === utilities_1.Points[utilities_1.Points.pyramid] ? 180 : 0) + ", 0, 0)" }),
-            React.createElement("path", tslib_1.__assign({ d: pointPath[shape] }, pathProps))));
-    };
-    exports.Shape = Shape;
-});
-//# sourceMappingURL=shape.js.map

package/lib-amd/components/Legends/shape.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"shape.js","sourceRoot":"../src/","sources":["components/Legends/shape.tsx"],"names":[],"mappings":";;;;;IAeA,IAAM,SAAS;QACb,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,MAAM,CAAG,IAAG,6CAA6C;QAC3E,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,MAAM,CAAG,IAAG,iCAAiC;QAC/D,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,QAAQ,CAAG,IAAG,2CAA2C;QAC3E,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAG,IAAG,2CAA2C;QAC1E,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAG,IAAG,iCAAiC;QAChE,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAG,IAAG,6BAA6B;QAC5D,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,QAAQ,CAAG,IAAG,+DAA+D;QAC/F,GAAC,KAAG,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAG,IAC1B,uFAAuF;QACzF,GAAC,KAAG,wBAAY,CAAC,wBAAY,CAAC,UAAU,CAAG,IAAG,2BAA2B;WAC1E,CAAC;IAEK,IAAM,KAAK,GAA0B,UAAC,EAAkD;YAAhD,QAAQ,cAAA,EAAE,SAAS,eAAA,EAAE,KAAK,WAAA,EAAE,kBAAkB,wBAAA;QAC3F,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE;YAChD,OAAO,6BAAK,SAAS,EAAE,kBAAkB,GAAI,CAAC;SAC/C;QACD,OAAO,CACL,8CACE,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,OAAO,EAAE,aAAa,IAClB,QAAQ,IACZ,SAAS,EAAE,aAAU,KAAK,KAAK,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,kBAAM,CAAC,kBAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,aAAS;YAEhH,+CAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,IAAM,SAAS,EAAI,CACxC,CACP,CAAC;IACJ,CAAC,CAAC;IAfW,QAAA,KAAK,SAehB","sourcesContent":["import * as React from 'react';\nimport { LegendShape } from './Legends.types';\nimport { CustomPoints, Points } from '../../utilities/utilities';\n\nexport interface IShapeProps {\n  svgProps: React.SVGAttributes<SVGElement>;\n  pathProps: React.SVGAttributes<SVGPathElement>;\n  shape: LegendShape;\n  classNameForNonSvg?: string;\n}\n\ntype PointPathType = {\n  [key: string]: string;\n};\n\nconst pointPath: PointPathType = {\n  [`${Points[Points.circle]}`]: 'M1 6 A5 5 0 1 0  12 6 M1 6 A5 5 0 0 1  12 6',\n  [`${Points[Points.square]}`]: 'M1 1 L12 1 L12 12  L1 12 L1 1 Z',\n  [`${Points[Points.triangle]}`]: 'M6 10L8.74228e-07 -1.04907e-06L12 0L6 10Z',\n  [`${Points[Points.pyramid]}`]: 'M6 10L8.74228e-07 -1.04907e-06L12 0L6 10Z',\n  [`${Points[Points.diamond]}`]: 'M2 2 L10 2 L10 10  L2 10 L2 2 Z',\n  [`${Points[Points.hexagon]}`]: 'M9 0H3L0 5L3 10H9L12 5L9 0Z',\n  [`${Points[Points.pentagon]}`]: 'M6.06061 0L0 4.21277L2.30303 11H9.69697L12 4.21277L6.06061 0Z',\n  [`${Points[Points.octagon]}`]:\n    'M7.08333 0H2.91667L0 2.91667V7.08333L2.91667 10H7.08333L10 7.08333V2.91667L7.08333 0Z',\n  [`${CustomPoints[CustomPoints.dottedLine]}`]: 'M0 6 H3 M5 6 H8 M10 6 H13',\n};\n\nexport const Shape: React.FC<IShapeProps> = ({ svgProps, pathProps, shape, classNameForNonSvg }) => {\n  if (Object.keys(pointPath).indexOf(shape) === -1) {\n    return <div className={classNameForNonSvg} />;\n  }\n  return (\n    <svg\n      width={14}\n      height={14}\n      viewBox={'-1 -1 14 14'}\n      {...svgProps}\n      transform={`rotate(${shape === Points[Points.diamond] ? 45 : shape === Points[Points.pyramid] ? 180 : 0}, 0, 0)`}\n    >\n      <path d={pointPath[shape]} {...pathProps} />\n    </svg>\n  );\n};\n"]}

package/lib-amd/components/LineChart/LineChart.base.d.ts

@@ -1,84 +0,0 @@
-import * as React from 'react';
-import { IAccessibilityProps, IBasestate, ILineChartProps, ILineChartPoints, ICustomizedCalloutData, IColorFillBarsProps, ILineChartDataPoint } from '../../index';
-declare type LineChartDataWithIndex = ILineChartPoints & {
-    index: number;
-};
-export interface ILineChartState extends IBasestate {
-    selectedLegendPoints: LineChartDataWithIndex[];
-    selectedColorBarLegend: IColorFillBarsProps[];
-    isSelectedLegend: boolean;
-    dataPointCalloutProps?: ICustomizedCalloutData;
-    stackCalloutProps?: ICustomizedCalloutData;
-    activePoint?: string;
-    xAxisCalloutAccessibilityData?: IAccessibilityProps;
-    nearestCircleToHighlight: ILineChartDataPoint | null;
-    activeLine: number | null;
-}
-export declare class LineChartBase extends React.Component<ILineChartProps, ILineChartState> {
-    private _points;
-    private _calloutPoints;
-    private _xAxisScale;
-    private _yAxisScale;
-    private _circleId;
-    private _lineId;
-    private _borderId;
-    private _verticalLine;
-    private _colorFillBarPatternId;
-    private _uniqueCallOutID;
-    private _refArray;
-    private margins;
-    private eventLabelHeight;
-    private lines;
-    private _renderedColorFillBars;
-    private _colorFillBars;
-    private _tooltipId;
-    private _rectId;
-    private _staticHighlightCircle;
-    constructor(props: ILineChartProps);
-    componentDidUpdate(prevProps: ILineChartProps): void;
-    render(): JSX.Element;
-    private _injectIndexPropertyInLineChartData;
-    private _getCustomizedCallout;
-    private _getMargins;
-    private _initializeLineChartData;
-    private _handleSingleLegendSelectionAction;
-    private _onHoverCardHide;
-    private _createLegends;
-    private _closeCallout;
-    private _getBoxWidthOfShape;
-    private _getPath;
-    private _getPointFill;
-    private _createLines;
-    private _createColorFillBars;
-    private _getStripePattern;
-    private _checkInGap;
-    private _refCallback;
-    private _onMouseOverLargeDataset;
-    private _handleFocus;
-    private _handleHover;
-    /**
-     * Screen readers announce an element as clickable if the onClick attribute is set.
-     * This function sets the attribute only when a click event handler is provided.
-     */
-    private _getClickHandler;
-    private _handleMouseOut;
-    private _handleChartMouseLeave;
-    private _handleLegendClick;
-    private _handleMultipleLineLegendSelectionAction;
-    private _handleMultipleColorFillBarLegendSelectionAction;
-    private _clearMultipleLegendSelections;
-    /**
-     * This function checks if the given legend is highlighted or not.
-     * A legend can be highlighted in 2 ways:
-     * 1. selection: if the user clicks on it
-     * 2. hovering: if there is no selected legend and the user hovers over it
-     */
-    private _legendHighlighted;
-    /**
-     * This function checks if none of the legends is selected or hovered.
-     */
-    private _noLegendHighlighted;
-    private _getColorFillBarOpacity;
-    private _getAriaLabel;
-}
-export {};