@nivo/core

  • Version 0.83.0
  • Published
  • 340 kB
  • 12 dependencies
  • MIT license

Install

npm i @nivo/core
yarn add @nivo/core
pnpm add @nivo/core

Overview

<a href="https://nivo.rocks"><img alt="nivo" src="https://raw.githubusercontent.com/plouc/nivo/master/nivo.png" width="216" height="68"/></a>

Index

Variables

Functions

Interfaces

Type Aliases

Variables

variable boxAlignments

const boxAlignments: BoxAlign[];

    variable CartesianMarkers

    const CartesianMarkers: CartesianMarkersType;

      variable closedCurvePropKeys

      const closedCurvePropKeys: ClosedCurveFactoryId[];

        variable Container

        const Container: ContainerType;

          variable defaultAnimate

          const defaultAnimate: boolean;

            variable defaultMargin

            const defaultMargin: DefaultMargin;

              variable DotsItem

              const DotsItem: React.FunctionComponent<DotsItemProps<any>>;

                variable motionDefaultProps

                const motionDefaultProps: MotionDefaultProps;

                  variable ResponsiveWrapper

                  const ResponsiveWrapper: ResponsiveWrapperType;

                    variable SvgWrapper

                    const SvgWrapper: SvgWrapperType;

                      variable ThemeProvider

                      const ThemeProvider: ThemeProviderType;

                        Functions

                        function absoluteAngleDegrees

                        absoluteAngleDegrees: (degrees: number) => number;

                          function alignBox

                          alignBox: (
                          box: AlignBox,
                          container: AlignBox,
                          alignment: BoxAlign
                          ) => [number, number];

                            function clampArc

                            clampArc: (
                            startAngle: number,
                            endAngle: number,
                            length?: number
                            ) => [number, number];

                              function curveFromProp

                              curveFromProp: (interpolation: CurveFactoryId) => CurveFactory;

                                function Defs

                                Defs: (props: DefsProps) => JSX.Element;

                                  function degreesToRadians

                                  degreesToRadians: (degrees: number) => number;

                                    function getAngle

                                    getAngle: (x1: number, y1: number, x2: number, y2: number) => number;

                                      function getDistance

                                      getDistance: (x1: number, y1: number, x2: number, y2: number) => number;

                                        function getPropertyAccessor

                                        getPropertyAccessor: <Datum, Value>(
                                        accessor: PropertyAccessor<Datum, Value>
                                        ) => (datum: Datum) => Value;

                                          function getRelativeCursor

                                          getRelativeCursor: (
                                          element: Element,
                                          event: React.MouseEvent
                                          ) => [number, number];

                                            function getValueFormatter

                                            getValueFormatter: <Value, Context = void>(
                                            format?: ValueFormat<Value, Context>
                                            ) => Context extends void
                                            ? (value: Value) => string
                                            : (value: Value, context: Context) => string;

                                              function isCursorInRect

                                              isCursorInRect: (
                                              x: number,
                                              y: number,
                                              width: number,
                                              height: number,
                                              cursorX: number,
                                              cursorY: number
                                              ) => boolean;

                                                function linearGradientDef

                                                linearGradientDef: (
                                                id: string,
                                                colors: GradientColor[],
                                                options?: React.SVGProps<SVGLinearGradientElement>
                                                ) => {
                                                id: string;
                                                type: 'linearGradient';
                                                colors: GradientColor[];
                                                } & React.SVGProps<SVGLinearGradientElement>;

                                                  function normalizeAngle

                                                  normalizeAngle: (degrees: number) => number;

                                                    function PatternDots

                                                    PatternDots: (props: Omit<PatternDotsDef, 'type'>) => JSX.Element;

                                                      function patternDotsDef

                                                      patternDotsDef: (
                                                      id: string,
                                                      options?: Omit<PatternDotsDef, 'id' | 'type'>
                                                      ) => PatternDotsDef;

                                                        function PatternLines

                                                        PatternLines: (props: Omit<PatternLinesDef, 'type'>) => JSX.Element;

                                                          function patternLinesDef

                                                          patternLinesDef: (
                                                          id: string,
                                                          options?: Omit<PatternLinesDef, 'id' | 'type'>
                                                          ) => PatternLinesDef;

                                                            function PatternSquares

                                                            PatternSquares: (props: Omit<PatternSquaresDef, 'type'>) => JSX.Element;

                                                              function patternSquaresDef

                                                              patternSquaresDef: (
                                                              id: string,
                                                              options?: Omit<PatternSquaresDef, 'id' | 'type'>
                                                              ) => PatternSquaresDef;

                                                                function positionFromAngle

                                                                positionFromAngle: (angle: number, distance: number) => { x: number; y: number };

                                                                  function radiansToDegrees

                                                                  radiansToDegrees: (radians: number) => number;

                                                                    function useAnimatedPath

                                                                    useAnimatedPath: (path: string) => Interpolation<string>;

                                                                      function useCurveInterpolation

                                                                      useCurveInterpolation: (interpolation: CurveFactoryId) => CurveFactory;

                                                                        function useDimensions

                                                                        useDimensions: (
                                                                        width: number,
                                                                        height: number,
                                                                        margin?: Box
                                                                        ) => {
                                                                        margin: Margin;
                                                                        innerWidth: number;
                                                                        innerHeight: number;
                                                                        outerWidth: number;
                                                                        outerHeight: number;
                                                                        };

                                                                          function useMeasure

                                                                          useMeasure: () => [
                                                                          React.RefObject<HTMLDivElement>,
                                                                          { left: number; top: number; width: number; height: number }
                                                                          ];

                                                                            function useMotionConfig

                                                                            useMotionConfig: () => { animate: boolean; config: SpringConfig };

                                                                              function usePartialTheme

                                                                              usePartialTheme: (theme?: Theme) => CompleteTheme;

                                                                                function usePropertyAccessor

                                                                                usePropertyAccessor: <Datum, Value>(
                                                                                accessor: PropertyAccessor<Datum, Value>
                                                                                ) => (datum: Datum) => Value;

                                                                                  function useTheme

                                                                                  useTheme: () => CompleteTheme;

                                                                                    function useValueFormatter

                                                                                    useValueFormatter: <Value, Context = void>(
                                                                                    format?: ValueFormat<Value, Context>
                                                                                    ) => Context extends void
                                                                                    ? (value: Value) => string
                                                                                    : (value: Value, context: Context) => string;

                                                                                      Interfaces

                                                                                      interface AlignBox

                                                                                      interface AlignBox extends Dimensions, Point {}

                                                                                        interface CartesianMarkerProps

                                                                                        interface CartesianMarkerProps<V extends DatumValue = DatumValue> {}

                                                                                          property axis

                                                                                          axis: 'x' | 'y';

                                                                                            property legend

                                                                                            legend?: string;

                                                                                              property legendOrientation

                                                                                              legendOrientation?: 'horizontal' | 'vertical';

                                                                                                property legendPosition

                                                                                                legendPosition?: BoxAlign;

                                                                                                  property lineStyle

                                                                                                  lineStyle?: Partial<React.CSSProperties>;

                                                                                                    property textStyle

                                                                                                    textStyle?: Partial<React.CSSProperties>;

                                                                                                      property value

                                                                                                      value: V;

                                                                                                        interface CartesianMarkersProps

                                                                                                        interface CartesianMarkersProps<
                                                                                                        X extends DatumValue = DatumValue,
                                                                                                        Y extends DatumValue = DatumValue
                                                                                                        > {}

                                                                                                          property height

                                                                                                          height: number;

                                                                                                            property markers

                                                                                                            markers: CartesianMarkerProps<X | Y>[];

                                                                                                              property width

                                                                                                              width: number;

                                                                                                                property xScale

                                                                                                                xScale: (value: X) => number;

                                                                                                                  property yScale

                                                                                                                  yScale: (value: Y) => number;

                                                                                                                    interface ColorProps

                                                                                                                    interface ColorProps<T> {}

                                                                                                                      property colorBy

                                                                                                                      colorBy?: string | GetColor<T>;

                                                                                                                        property colors

                                                                                                                        colors?: Colors;

                                                                                                                          interface ContainerProps

                                                                                                                          interface ContainerProps {}

                                                                                                                            property animate

                                                                                                                            animate?: boolean;

                                                                                                                              property isInteractive

                                                                                                                              isInteractive?: boolean;

                                                                                                                                property motionConfig

                                                                                                                                motionConfig?: string | SpringConfig;

                                                                                                                                  property renderWrapper

                                                                                                                                  renderWrapper?: boolean;

                                                                                                                                    property theme

                                                                                                                                    theme?: Theme;

                                                                                                                                      interface Dimensions

                                                                                                                                      interface Dimensions {}

                                                                                                                                        property height

                                                                                                                                        height: number;

                                                                                                                                          property width

                                                                                                                                          width: number;

                                                                                                                                            interface DotsItemProps

                                                                                                                                            interface DotsItemProps<D = any> {}

                                                                                                                                              property borderColor

                                                                                                                                              borderColor: string;

                                                                                                                                                property borderWidth

                                                                                                                                                borderWidth: number;

                                                                                                                                                  property color

                                                                                                                                                  color: string;

                                                                                                                                                    property datum

                                                                                                                                                    datum: D;

                                                                                                                                                      property label

                                                                                                                                                      label?: string | number;

                                                                                                                                                        property labelTextAnchor

                                                                                                                                                        labelTextAnchor?: 'start' | 'middle' | 'end';

                                                                                                                                                          property labelYOffset

                                                                                                                                                          labelYOffset?: number;

                                                                                                                                                            property size

                                                                                                                                                            size: number;

                                                                                                                                                              property symbol

                                                                                                                                                              symbol?: DotsItemSymbolComponent;

                                                                                                                                                                property x

                                                                                                                                                                x: number;

                                                                                                                                                                  property y

                                                                                                                                                                  y: number;

                                                                                                                                                                    interface DotsItemSymbolProps

                                                                                                                                                                    interface DotsItemSymbolProps {}

                                                                                                                                                                      property borderColor

                                                                                                                                                                      borderColor: string;

                                                                                                                                                                        property borderWidth

                                                                                                                                                                        borderWidth: number;

                                                                                                                                                                          property color

                                                                                                                                                                          color: string;

                                                                                                                                                                            property size

                                                                                                                                                                            size: number;

                                                                                                                                                                              interface Point

                                                                                                                                                                              interface Point {}

                                                                                                                                                                                property x

                                                                                                                                                                                x: number;

                                                                                                                                                                                  property y

                                                                                                                                                                                  y: number;

                                                                                                                                                                                    interface SvgDefsAndFill

                                                                                                                                                                                    interface SvgDefsAndFill<T> {}

                                                                                                                                                                                      property defs

                                                                                                                                                                                      defs?: {
                                                                                                                                                                                      id: string;
                                                                                                                                                                                      [key: string]: any;
                                                                                                                                                                                      }[];

                                                                                                                                                                                        property fill

                                                                                                                                                                                        fill?: {
                                                                                                                                                                                        id: string;
                                                                                                                                                                                        match: Record<string, unknown> | SvgFillMatcher<T> | '*';
                                                                                                                                                                                        }[];

                                                                                                                                                                                          interface ThemeProviderProps

                                                                                                                                                                                          interface ThemeProviderProps {}

                                                                                                                                                                                            property theme

                                                                                                                                                                                            theme?: Theme;

                                                                                                                                                                                              Type Aliases

                                                                                                                                                                                              type Accessor

                                                                                                                                                                                              type Accessor<T extends keyof U, U> = T extends string ? U[T] : never;

                                                                                                                                                                                                type AreaCurve

                                                                                                                                                                                                type AreaCurve =
                                                                                                                                                                                                | 'basis'
                                                                                                                                                                                                | 'cardinal'
                                                                                                                                                                                                | 'catmullRom'
                                                                                                                                                                                                | 'linear'
                                                                                                                                                                                                | 'monotoneX'
                                                                                                                                                                                                | 'monotoneY'
                                                                                                                                                                                                | 'natural'
                                                                                                                                                                                                | 'step'
                                                                                                                                                                                                | 'stepAfter'
                                                                                                                                                                                                | 'stepBefore';

                                                                                                                                                                                                  type AreaCurveFactoryId

                                                                                                                                                                                                  type AreaCurveFactoryId =
                                                                                                                                                                                                  | 'basis'
                                                                                                                                                                                                  | 'cardinal'
                                                                                                                                                                                                  | 'catmullRom'
                                                                                                                                                                                                  | 'linear'
                                                                                                                                                                                                  | 'monotoneX'
                                                                                                                                                                                                  | 'monotoneY'
                                                                                                                                                                                                  | 'natural'
                                                                                                                                                                                                  | 'step'
                                                                                                                                                                                                  | 'stepAfter'
                                                                                                                                                                                                  | 'stepBefore';

                                                                                                                                                                                                    type Box

                                                                                                                                                                                                    type Box = Partial<Margin>;

                                                                                                                                                                                                      type BoxAlign

                                                                                                                                                                                                      type BoxAlign =
                                                                                                                                                                                                      | 'center'
                                                                                                                                                                                                      | 'top-left'
                                                                                                                                                                                                      | 'top'
                                                                                                                                                                                                      | 'top-right'
                                                                                                                                                                                                      | 'right'
                                                                                                                                                                                                      | 'bottom-right'
                                                                                                                                                                                                      | 'bottom'
                                                                                                                                                                                                      | 'bottom-left'
                                                                                                                                                                                                      | 'left';

                                                                                                                                                                                                        type CartesianMarkersType

                                                                                                                                                                                                        type CartesianMarkersType = <
                                                                                                                                                                                                        X extends DatumValue = DatumValue,
                                                                                                                                                                                                        Y extends DatumValue = DatumValue
                                                                                                                                                                                                        >(
                                                                                                                                                                                                        props: CartesianMarkersProps<X, Y>
                                                                                                                                                                                                        ) => JSX.Element;

                                                                                                                                                                                                          type ClosedCurveFactoryId

                                                                                                                                                                                                          type ClosedCurveFactoryId =
                                                                                                                                                                                                          | 'basisClosed'
                                                                                                                                                                                                          | 'cardinalClosed'
                                                                                                                                                                                                          | 'catmullRomClosed'
                                                                                                                                                                                                          | 'linearClosed';

                                                                                                                                                                                                            type Colors

                                                                                                                                                                                                            type Colors = string[] | string;

                                                                                                                                                                                                              type CompleteTheme

                                                                                                                                                                                                              type CompleteTheme = {
                                                                                                                                                                                                              crosshair: {
                                                                                                                                                                                                              line: {
                                                                                                                                                                                                              stroke: string;
                                                                                                                                                                                                              strokeWidth: number;
                                                                                                                                                                                                              strokeOpacity: number;
                                                                                                                                                                                                              strokeDasharray: string;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              };
                                                                                                                                                                                                              background: string;
                                                                                                                                                                                                              fontFamily: string;
                                                                                                                                                                                                              fontSize: number;
                                                                                                                                                                                                              textColor: string;
                                                                                                                                                                                                              axis: {
                                                                                                                                                                                                              domain: {
                                                                                                                                                                                                              line: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              ticks: {
                                                                                                                                                                                                              line: Partial<React.CSSProperties>;
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              legend: {
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              };
                                                                                                                                                                                                              grid: {
                                                                                                                                                                                                              line: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              legends: {
                                                                                                                                                                                                              hidden: {
                                                                                                                                                                                                              symbol: Partial<{
                                                                                                                                                                                                              fill: string;
                                                                                                                                                                                                              opacity: number;
                                                                                                                                                                                                              }>;
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              title: {
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              ticks: {
                                                                                                                                                                                                              line: Partial<React.CSSProperties>;
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              };
                                                                                                                                                                                                              labels: {
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              markers: {
                                                                                                                                                                                                              lineColor: string;
                                                                                                                                                                                                              lineStrokeWidth: number;
                                                                                                                                                                                                              textColor: string;
                                                                                                                                                                                                              fontSize: string | 0;
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              dots: {
                                                                                                                                                                                                              text: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              tooltip: {
                                                                                                                                                                                                              container: Partial<React.CSSProperties>;
                                                                                                                                                                                                              basic: Partial<React.CSSProperties>;
                                                                                                                                                                                                              chip: Partial<React.CSSProperties>;
                                                                                                                                                                                                              table: Partial<React.CSSProperties>;
                                                                                                                                                                                                              tableCell: Partial<React.CSSProperties>;
                                                                                                                                                                                                              tableCellValue: Partial<React.CSSProperties>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              annotations: {
                                                                                                                                                                                                              text: {
                                                                                                                                                                                                              fill: string;
                                                                                                                                                                                                              outlineWidth: number;
                                                                                                                                                                                                              outlineColor: string;
                                                                                                                                                                                                              outlineOpacity: number;
                                                                                                                                                                                                              } & Partial<Omit<React.CSSProperties, 'fill'>>;
                                                                                                                                                                                                              link: {
                                                                                                                                                                                                              stroke: string;
                                                                                                                                                                                                              strokeWidth: number;
                                                                                                                                                                                                              outlineWidth: number;
                                                                                                                                                                                                              outlineColor: string;
                                                                                                                                                                                                              outlineOpacity: number;
                                                                                                                                                                                                              } & Partial<Omit<React.CSSProperties, 'stroke' | 'strokeWidth'>>;
                                                                                                                                                                                                              outline: {
                                                                                                                                                                                                              stroke: string;
                                                                                                                                                                                                              strokeWidth: number;
                                                                                                                                                                                                              outlineWidth: number;
                                                                                                                                                                                                              outlineColor: string;
                                                                                                                                                                                                              outlineOpacity: number;
                                                                                                                                                                                                              } & Partial<Omit<React.CSSProperties, 'stroke' | 'strokeWidth'>>;
                                                                                                                                                                                                              symbol: {
                                                                                                                                                                                                              fill: string;
                                                                                                                                                                                                              outlineWidth: number;
                                                                                                                                                                                                              outlineColor: string;
                                                                                                                                                                                                              outlineOpacity: number;
                                                                                                                                                                                                              } & Partial<Omit<React.CSSProperties, 'fill'>>;
                                                                                                                                                                                                              };
                                                                                                                                                                                                              };

                                                                                                                                                                                                                type ContainerType

                                                                                                                                                                                                                type ContainerType = (props: React.PropsWithChildren<ContainerProps>) => JSX.Element;

                                                                                                                                                                                                                  type CssMixBlendMode

                                                                                                                                                                                                                  type CssMixBlendMode =
                                                                                                                                                                                                                  | 'normal'
                                                                                                                                                                                                                  | 'multiply'
                                                                                                                                                                                                                  | 'screen'
                                                                                                                                                                                                                  | 'overlay'
                                                                                                                                                                                                                  | 'darken'
                                                                                                                                                                                                                  | 'lighten'
                                                                                                                                                                                                                  | 'color-dodge'
                                                                                                                                                                                                                  | 'color-burn'
                                                                                                                                                                                                                  | 'hard-light'
                                                                                                                                                                                                                  | 'soft-light'
                                                                                                                                                                                                                  | 'difference'
                                                                                                                                                                                                                  | 'exclusion'
                                                                                                                                                                                                                  | 'hue'
                                                                                                                                                                                                                  | 'saturation'
                                                                                                                                                                                                                  | 'color'
                                                                                                                                                                                                                  | 'luminosity';

                                                                                                                                                                                                                    type CurveFactoryId

                                                                                                                                                                                                                    type CurveFactoryId =
                                                                                                                                                                                                                    | 'basis'
                                                                                                                                                                                                                    | 'basisClosed'
                                                                                                                                                                                                                    | 'basisOpen'
                                                                                                                                                                                                                    | 'bundle'
                                                                                                                                                                                                                    | 'cardinal'
                                                                                                                                                                                                                    | 'cardinalClosed'
                                                                                                                                                                                                                    | 'cardinalOpen'
                                                                                                                                                                                                                    | 'catmullRom'
                                                                                                                                                                                                                    | 'catmullRomClosed'
                                                                                                                                                                                                                    | 'catmullRomOpen'
                                                                                                                                                                                                                    | 'linear'
                                                                                                                                                                                                                    | 'linearClosed'
                                                                                                                                                                                                                    | 'monotoneX'
                                                                                                                                                                                                                    | 'monotoneY'
                                                                                                                                                                                                                    | 'natural'
                                                                                                                                                                                                                    | 'step'
                                                                                                                                                                                                                    | 'stepAfter'
                                                                                                                                                                                                                    | 'stepBefore';

                                                                                                                                                                                                                      type DatumPropertyAccessor

                                                                                                                                                                                                                      type DatumPropertyAccessor<RawDatum, T> = (datum: RawDatum) => T;

                                                                                                                                                                                                                        type DatumValue

                                                                                                                                                                                                                        type DatumValue = string | number | Date;

                                                                                                                                                                                                                          type Def

                                                                                                                                                                                                                          type Def = LinearGradientDef | PatternDotsDef | PatternSquaresDef | PatternLinesDef;

                                                                                                                                                                                                                            type DefaultMargin

                                                                                                                                                                                                                            type DefaultMargin = {
                                                                                                                                                                                                                            top: 0;
                                                                                                                                                                                                                            right: 0;
                                                                                                                                                                                                                            bottom: 0;
                                                                                                                                                                                                                            left: 0;
                                                                                                                                                                                                                            };

                                                                                                                                                                                                                              type DefsProps

                                                                                                                                                                                                                              type DefsProps = {
                                                                                                                                                                                                                              defs: Def[];
                                                                                                                                                                                                                              };

                                                                                                                                                                                                                                type DotsItemSymbolComponent

                                                                                                                                                                                                                                type DotsItemSymbolComponent = React.FunctionComponent<DotsItemSymbolProps>;

                                                                                                                                                                                                                                  type ExtractProps

                                                                                                                                                                                                                                  type ExtractProps<TComponent> = TComponent extends ComponentType<infer TProps>
                                                                                                                                                                                                                                  ? TProps
                                                                                                                                                                                                                                  : never;

                                                                                                                                                                                                                                    type GetColor

                                                                                                                                                                                                                                    type GetColor<T> = (datum: T) => string;

                                                                                                                                                                                                                                      type GradientColor

                                                                                                                                                                                                                                      type GradientColor = {
                                                                                                                                                                                                                                      offset: number;
                                                                                                                                                                                                                                      color: string;
                                                                                                                                                                                                                                      opacity?: number;
                                                                                                                                                                                                                                      };

                                                                                                                                                                                                                                        type LinearGradientDef

                                                                                                                                                                                                                                        type LinearGradientDef = {
                                                                                                                                                                                                                                        id: string;
                                                                                                                                                                                                                                        type: 'linearGradient';
                                                                                                                                                                                                                                        colors: {
                                                                                                                                                                                                                                        offset: number;
                                                                                                                                                                                                                                        color: string;
                                                                                                                                                                                                                                        opacity?: number;
                                                                                                                                                                                                                                        }[];
                                                                                                                                                                                                                                        gradientTransform?: string;
                                                                                                                                                                                                                                        };

                                                                                                                                                                                                                                          type LineCurveFactoryId

                                                                                                                                                                                                                                          type LineCurveFactoryId =
                                                                                                                                                                                                                                          | 'basis'
                                                                                                                                                                                                                                          | 'cardinal'
                                                                                                                                                                                                                                          | 'catmullRom'
                                                                                                                                                                                                                                          | 'linear'
                                                                                                                                                                                                                                          | 'monotoneX'
                                                                                                                                                                                                                                          | 'monotoneY'
                                                                                                                                                                                                                                          | 'natural'
                                                                                                                                                                                                                                          | 'step'
                                                                                                                                                                                                                                          | 'stepAfter'
                                                                                                                                                                                                                                          | 'stepBefore';

                                                                                                                                                                                                                                            type Margin

                                                                                                                                                                                                                                            type Margin = {
                                                                                                                                                                                                                                            bottom: number;
                                                                                                                                                                                                                                            left: number;
                                                                                                                                                                                                                                            right: number;
                                                                                                                                                                                                                                            top: number;
                                                                                                                                                                                                                                            };

                                                                                                                                                                                                                                              type MotionDefaultProps

                                                                                                                                                                                                                                              type MotionDefaultProps = {
                                                                                                                                                                                                                                              animate: true;
                                                                                                                                                                                                                                              config: 'default';
                                                                                                                                                                                                                                              };

                                                                                                                                                                                                                                                type MotionProps

                                                                                                                                                                                                                                                type MotionProps = Partial<{
                                                                                                                                                                                                                                                animate: boolean;
                                                                                                                                                                                                                                                motionConfig: string | SpringConfig;
                                                                                                                                                                                                                                                }>;

                                                                                                                                                                                                                                                  type PatternDotsDef

                                                                                                                                                                                                                                                  type PatternDotsDef = {
                                                                                                                                                                                                                                                  id: string;
                                                                                                                                                                                                                                                  type: 'patternDots';
                                                                                                                                                                                                                                                  color?: string;
                                                                                                                                                                                                                                                  background?: string;
                                                                                                                                                                                                                                                  size?: number;
                                                                                                                                                                                                                                                  padding?: number;
                                                                                                                                                                                                                                                  stagger?: boolean;
                                                                                                                                                                                                                                                  };

                                                                                                                                                                                                                                                    type PatternLinesDef

                                                                                                                                                                                                                                                    type PatternLinesDef = {
                                                                                                                                                                                                                                                    id: string;
                                                                                                                                                                                                                                                    type: 'patternLines';
                                                                                                                                                                                                                                                    spacing?: number;
                                                                                                                                                                                                                                                    rotation?: number;
                                                                                                                                                                                                                                                    background?: string;
                                                                                                                                                                                                                                                    color?: string;
                                                                                                                                                                                                                                                    lineWidth?: number;
                                                                                                                                                                                                                                                    };

                                                                                                                                                                                                                                                      type PatternSquaresDef

                                                                                                                                                                                                                                                      type PatternSquaresDef = Omit<PatternDotsDef, 'type'> & {
                                                                                                                                                                                                                                                      type: 'patternSquares';
                                                                                                                                                                                                                                                      };

                                                                                                                                                                                                                                                        type PropertyAccessor

                                                                                                                                                                                                                                                        type PropertyAccessor<Datum, Value> =
                                                                                                                                                                                                                                                        // path to use with `lodash.get()`
                                                                                                                                                                                                                                                        | string
                                                                                                                                                                                                                                                        // explicit accessor function
                                                                                                                                                                                                                                                        | ((datum: Datum) => Value);

                                                                                                                                                                                                                                                          type ResponsiveWrapperType

                                                                                                                                                                                                                                                          type ResponsiveWrapperType = (props: {
                                                                                                                                                                                                                                                          children: (dimensions: { width: number; height: number }) => JSX.Element;
                                                                                                                                                                                                                                                          }) => JSX.Element;

                                                                                                                                                                                                                                                            type StackOffset

                                                                                                                                                                                                                                                            type StackOffset = 'expand' | 'diverging' | 'none' | 'silhouette' | 'wiggle';

                                                                                                                                                                                                                                                              type StackOrder

                                                                                                                                                                                                                                                              type StackOrder = 'ascending' | 'descending' | 'insideOut' | 'none' | 'reverse';

                                                                                                                                                                                                                                                                type SvgFillMatcher

                                                                                                                                                                                                                                                                type SvgFillMatcher<T> = (datum: T) => boolean;

                                                                                                                                                                                                                                                                  type SvgWrapperType

                                                                                                                                                                                                                                                                  type SvgWrapperType = (
                                                                                                                                                                                                                                                                  props: React.PropsWithChildren<{
                                                                                                                                                                                                                                                                  width: number;
                                                                                                                                                                                                                                                                  height: number;
                                                                                                                                                                                                                                                                  margin: Margin;
                                                                                                                                                                                                                                                                  defs?: any;
                                                                                                                                                                                                                                                                  role?: string;
                                                                                                                                                                                                                                                                  ariaLabel?: React.AriaAttributes['aria-label'];
                                                                                                                                                                                                                                                                  ariaLabelledBy?: React.AriaAttributes['aria-labelledby'];
                                                                                                                                                                                                                                                                  ariaDescribedBy?: React.AriaAttributes['aria-describedby'];
                                                                                                                                                                                                                                                                  isFocusable?: boolean;
                                                                                                                                                                                                                                                                  }>
                                                                                                                                                                                                                                                                  ) => JSX.Element;

                                                                                                                                                                                                                                                                    type Theme

                                                                                                                                                                                                                                                                    type Theme = Partial<
                                                                                                                                                                                                                                                                    Pick<CompleteTheme, 'background' | 'fontFamily' | 'fontSize' | 'textColor'> & {
                                                                                                                                                                                                                                                                    crosshair: Partial<{
                                                                                                                                                                                                                                                                    line: Partial<CompleteTheme['crosshair']['line']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    axis: Partial<{
                                                                                                                                                                                                                                                                    domain: Partial<{
                                                                                                                                                                                                                                                                    line: Partial<CompleteTheme['axis']['domain']['line']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    ticks: Partial<{
                                                                                                                                                                                                                                                                    line: Partial<CompleteTheme['axis']['ticks']['line']>;
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['axis']['ticks']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    legend: Partial<{
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['axis']['legend']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    grid: Partial<{
                                                                                                                                                                                                                                                                    line: Partial<CompleteTheme['grid']['line']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    legends: Partial<{
                                                                                                                                                                                                                                                                    hidden: Partial<{
                                                                                                                                                                                                                                                                    symbol: CompleteTheme['legends']['hidden']['symbol'];
                                                                                                                                                                                                                                                                    text: CompleteTheme['legends']['hidden']['text'];
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    title: Partial<{
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['legends']['title']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['legends']['text']>;
                                                                                                                                                                                                                                                                    ticks: Partial<{
                                                                                                                                                                                                                                                                    line: Partial<CompleteTheme['legends']['ticks']['line']>;
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['legends']['ticks']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    labels: Partial<{
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['labels']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    markers: Partial<CompleteTheme['markers']>;
                                                                                                                                                                                                                                                                    dots: Partial<{
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['dots']['text']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    tooltip: Partial<CompleteTheme['tooltip']>;
                                                                                                                                                                                                                                                                    annotations: Partial<{
                                                                                                                                                                                                                                                                    text: Partial<CompleteTheme['annotations']['text']>;
                                                                                                                                                                                                                                                                    link: Partial<CompleteTheme['annotations']['link']>;
                                                                                                                                                                                                                                                                    outline: Partial<CompleteTheme['annotations']['outline']>;
                                                                                                                                                                                                                                                                    symbol: Partial<CompleteTheme['annotations']['symbol']>;
                                                                                                                                                                                                                                                                    }>;
                                                                                                                                                                                                                                                                    }
                                                                                                                                                                                                                                                                    >;

                                                                                                                                                                                                                                                                      type ThemeProviderType

                                                                                                                                                                                                                                                                      type ThemeProviderType = (
                                                                                                                                                                                                                                                                      props: React.PropsWithChildren<ThemeProviderProps>
                                                                                                                                                                                                                                                                      ) => JSX.Element;

                                                                                                                                                                                                                                                                        type ValueFormat

                                                                                                                                                                                                                                                                        type ValueFormat<Value, Context = void> =
                                                                                                                                                                                                                                                                        | string // d3 formatter
                                                                                                                                                                                                                                                                        // explicit formatting function
                                                                                                                                                                                                                                                                        | (Context extends void
                                                                                                                                                                                                                                                                        ? (value: Value) => string
                                                                                                                                                                                                                                                                        : (value: Value, context: Context) => string);

                                                                                                                                                                                                                                                                          Package Files (1)

                                                                                                                                                                                                                                                                          Dependencies (12)

                                                                                                                                                                                                                                                                          Dev Dependencies (0)

                                                                                                                                                                                                                                                                          No dev dependencies.

                                                                                                                                                                                                                                                                          Peer Dependencies (2)

                                                                                                                                                                                                                                                                          Badge

                                                                                                                                                                                                                                                                          To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                                                                                                                          You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@nivo/core.

                                                                                                                                                                                                                                                                          • Markdown
                                                                                                                                                                                                                                                                            [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@nivo/core)
                                                                                                                                                                                                                                                                          • HTML
                                                                                                                                                                                                                                                                            <a href="https://www.jsdocs.io/package/@nivo/core"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>