@redsift/charts 11.6.0-muiv5-alpha.6 → 11.6.0-muiv5-alpha.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.d.ts +1190 -42
- package/package.json +2 -2
- package/_internal/Arc.d.ts +0 -10
- package/_internal/Arcs.d.ts +0 -10
- package/_internal/Axis.d.ts +0 -8
- package/_internal/Bar.d.ts +0 -10
- package/_internal/BarChart.d.ts +0 -17
- package/_internal/ChartContainer.d.ts +0 -5
- package/_internal/DataPoint.d.ts +0 -7
- package/_internal/Dot.d.ts +0 -10
- package/_internal/Legend.d.ts +0 -10
- package/_internal/LegendItem.d.ts +0 -21
- package/_internal/Line.d.ts +0 -10
- package/_internal/LineChart.d.ts +0 -17
- package/_internal/PieChart.d.ts +0 -14
- package/_internal/ScatterPlot.d.ts +0 -17
- package/_internal/axis.d2.ts +0 -48
- package/_internal/data.d.ts +0 -72
- package/_internal/scale.d.ts +0 -134
- package/_internal/styles.d.ts +0 -19
- package/_internal/styles.d10.ts +0 -30
- package/_internal/styles.d11.ts +0 -101
- package/_internal/styles.d12.ts +0 -133
- package/_internal/styles.d13.ts +0 -120
- package/_internal/styles.d2.ts +0 -26
- package/_internal/styles.d3.ts +0 -17
- package/_internal/styles.d4.ts +0 -18
- package/_internal/styles.d5.ts +0 -212
- package/_internal/styles.d6.ts +0 -22
- package/_internal/styles.d7.ts +0 -15
- package/_internal/styles.d8.ts +0 -19
- package/_internal/styles.d9.ts +0 -14
- package/_internal/types.d.ts +0 -20
- package/_internal/types.d2.ts +0 -46
- package/_internal/types.d3.ts +0 -48
- package/_internal/types.d4.ts +0 -86
- package/_internal/types.d5.ts +0 -30
- package/_internal/types.d6.ts +0 -44
- package/_internal/types.d7.ts +0 -24
- package/index.d2.ts +0 -49
package/_internal/types.d2.ts
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { ScaleLinear, ScaleTime, ScalePoint } from 'd3';
|
|
2
|
-
import { ValueOf, Theme } from '@redsift/design-system';
|
|
3
|
-
import { D as DataPointProps, S as StyledDataPointProps } from './types.d4.ts';
|
|
4
|
-
import { B as BarDatum } from './data.js';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Component variant.
|
|
8
|
-
*/
|
|
9
|
-
declare const BarOrientation: {
|
|
10
|
-
horizontal: string;
|
|
11
|
-
vertical: string;
|
|
12
|
-
};
|
|
13
|
-
type BarOrientation = ValueOf<typeof BarOrientation>;
|
|
14
|
-
declare const BarDirection: {
|
|
15
|
-
up: string;
|
|
16
|
-
down: string;
|
|
17
|
-
};
|
|
18
|
-
type BarDirection = ValueOf<typeof BarDirection>;
|
|
19
|
-
/**
|
|
20
|
-
* Component props.
|
|
21
|
-
*/
|
|
22
|
-
interface BarProps extends DataPointProps<BarDatum> {
|
|
23
|
-
/** Gap between two siblings. */
|
|
24
|
-
gap?: number;
|
|
25
|
-
/** Height of the bar in horizontal orientation. */
|
|
26
|
-
height?: number;
|
|
27
|
-
/** Maximum height of the bar. */
|
|
28
|
-
maxHeight?: number;
|
|
29
|
-
/** Orientation of the bar. */
|
|
30
|
-
orientation?: BarOrientation;
|
|
31
|
-
/** Direction of the bar, works only with vertical orientation. */
|
|
32
|
-
direction?: BarOrientation;
|
|
33
|
-
/** A linear continuous scale defined over a numeric domain used to determine the width or height of the bar (depending on the orientation). */
|
|
34
|
-
scale: ScaleLinear<number, number, never>;
|
|
35
|
-
/** A scale defined over a numeric/time/ordinal domain used to determine the position of the bar. */
|
|
36
|
-
scalePosition: ScaleLinear<number, number, never> | ScaleTime<number, number, never> | ScalePoint<string>;
|
|
37
|
-
/** Width of the bar in vertical orientation. */
|
|
38
|
-
width?: number;
|
|
39
|
-
/** Min width of the bar in vertical orientation. */
|
|
40
|
-
minWidth?: number;
|
|
41
|
-
}
|
|
42
|
-
type StyledBarProps = StyledDataPointProps & Omit<BarProps, 'scale' | 'scalePosition'> & {
|
|
43
|
-
$theme: Theme;
|
|
44
|
-
};
|
|
45
|
-
|
|
46
|
-
export { BarOrientation as B, StyledBarProps as S, BarDirection as a, BarProps as b };
|
package/_internal/types.d3.ts
DELETED
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { ContainerProps, Theme } from '@redsift/design-system';
|
|
2
|
-
import { ComponentProps, RefObject, ReactElement } from 'react';
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* Component props.
|
|
6
|
-
*/
|
|
7
|
-
interface ChartContainerProps extends Omit<ComponentProps<'div'>, 'title'>, ContainerProps {
|
|
8
|
-
/** Native HTML props to pass to the chart. */
|
|
9
|
-
chartProps?: ComponentProps<'div'>;
|
|
10
|
-
/** Ref to the chart. */
|
|
11
|
-
chartRef?: RefObject<HTMLDivElement>;
|
|
12
|
-
/** Description. */
|
|
13
|
-
description?: string | ReactElement;
|
|
14
|
-
/** Whether the description should be placed below the title or below the chart. */
|
|
15
|
-
descriptionPosition?: 'belowTitle' | 'belowChart';
|
|
16
|
-
/** Disable animations. */
|
|
17
|
-
disableAnimations?: boolean;
|
|
18
|
-
/** Id. */
|
|
19
|
-
id?: string;
|
|
20
|
-
/** Method called when the Reset button is displayed (defines whether or not the button should be displayed). */
|
|
21
|
-
onReset?: () => void;
|
|
22
|
-
/** Title. */
|
|
23
|
-
title?: string | ReactElement;
|
|
24
|
-
/** Theme. */
|
|
25
|
-
theme?: Theme;
|
|
26
|
-
/** Description that won't be visually displayed but will be used for assistive technology. If you want to display the description, use `description` instead. */
|
|
27
|
-
descriptionForAssistiveTechnology?: string;
|
|
28
|
-
/** Whether the chart is static or interactive. */
|
|
29
|
-
mode?: string;
|
|
30
|
-
/** Small text explaining which kind of chart is presenting and what's its basic composition. */
|
|
31
|
-
definition?: string;
|
|
32
|
-
/** Small text explaining the basic composition of the x-axis, if any. */
|
|
33
|
-
xAxisDefinition?: string;
|
|
34
|
-
/** Small text explaining the basic composition of the y-axis, if any. */
|
|
35
|
-
yAxisDefinition?: string;
|
|
36
|
-
/** Small text explaining how the chart is interactive, if any. */
|
|
37
|
-
interactionExplanation?: string;
|
|
38
|
-
/** Table representation of the chart. */
|
|
39
|
-
dataTableRepresentation?: {
|
|
40
|
-
header: ReactElement;
|
|
41
|
-
body: ReactElement;
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
type StyledChartContainerProps = Omit<ChartContainerProps, 'theme'> & {
|
|
45
|
-
$theme: Theme;
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
export { ChartContainerProps as C, StyledChartContainerProps as S };
|
package/_internal/types.d4.ts
DELETED
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import { ComponentProps, ReactElement } from 'react';
|
|
2
|
-
import { ValueOf, Theme } from '@redsift/design-system';
|
|
3
|
-
import { TooltipProps } from '@redsift/popovers';
|
|
4
|
-
|
|
5
|
-
/** TOOLTIP */
|
|
6
|
-
declare const TooltipVariant: {
|
|
7
|
-
none: string;
|
|
8
|
-
label: string;
|
|
9
|
-
value: string;
|
|
10
|
-
percent: string;
|
|
11
|
-
custom: string;
|
|
12
|
-
};
|
|
13
|
-
type TooltipVariant = ValueOf<typeof TooltipVariant>;
|
|
14
|
-
/** LEGEND */
|
|
15
|
-
declare const LegendVariant: {
|
|
16
|
-
readonly none: "none";
|
|
17
|
-
readonly label: "label";
|
|
18
|
-
readonly value: "value";
|
|
19
|
-
readonly percent: "percent";
|
|
20
|
-
readonly custom: "custom";
|
|
21
|
-
};
|
|
22
|
-
type LegendVariant = ValueOf<typeof LegendVariant>;
|
|
23
|
-
declare const LabelVariant: {
|
|
24
|
-
readonly none: "none";
|
|
25
|
-
readonly label: "label";
|
|
26
|
-
readonly value: "value";
|
|
27
|
-
readonly percent: "percent";
|
|
28
|
-
readonly custom: "custom";
|
|
29
|
-
};
|
|
30
|
-
type LabelVariant = LegendVariant;
|
|
31
|
-
|
|
32
|
-
type AnchorProps = ComponentProps<'a'> & {
|
|
33
|
-
as?: any;
|
|
34
|
-
};
|
|
35
|
-
/**
|
|
36
|
-
* Component props.
|
|
37
|
-
*/
|
|
38
|
-
interface DataPointProps<T> extends Omit<ComponentProps<'g'>, 'onClick' | 'scale'> {
|
|
39
|
-
/** Anchor props to use when the component is a navigation link. */
|
|
40
|
-
anchorProps?: AnchorProps;
|
|
41
|
-
/** Color of the DataPoint. */
|
|
42
|
-
color?: string;
|
|
43
|
-
/** Data. Also state to which the component should end the animation, if any. */
|
|
44
|
-
data: T;
|
|
45
|
-
/** Entire dataset in which the data point is a part of. */
|
|
46
|
-
dataset: any[];
|
|
47
|
-
/** Disable animations. */
|
|
48
|
-
disableAnimations?: boolean;
|
|
49
|
-
/** Group of data in which the data point is a part of. */
|
|
50
|
-
groupedData?: any[];
|
|
51
|
-
/** Id. Used for accessibility. */
|
|
52
|
-
id?: string;
|
|
53
|
-
/** Position in the list of siblings. Used for placement and selection. */
|
|
54
|
-
index?: number;
|
|
55
|
-
/** Whether the component is selected or not. Used only if the component is selectable. Set to `undefined` to make nor selected nor unselected. */
|
|
56
|
-
isSelected?: boolean;
|
|
57
|
-
/** Method modifying the label before displaying it. */
|
|
58
|
-
labelDecorator?: (data: T, props?: {
|
|
59
|
-
index?: number;
|
|
60
|
-
isSelected?: boolean;
|
|
61
|
-
color?: string;
|
|
62
|
-
}) => string | ReactElement;
|
|
63
|
-
/** Method called when a click or keydown occurs on the component. */
|
|
64
|
-
onClick?: (data: T, dataset: any[]) => void;
|
|
65
|
-
/** State from which the component should start the animation, if any. */
|
|
66
|
-
previousData?: T;
|
|
67
|
-
/** Role. Will be set to 'button' if onClick is provided. If 'option', then the component becomes selectable. */
|
|
68
|
-
role?: 'img' | 'button' | 'link' | 'option';
|
|
69
|
-
/** Theme. */
|
|
70
|
-
theme?: Theme;
|
|
71
|
-
/** Tooltip variant. */
|
|
72
|
-
tooltipVariant?: TooltipVariant;
|
|
73
|
-
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
74
|
-
tooltipDecorator?: (data: T, props?: {
|
|
75
|
-
index?: number;
|
|
76
|
-
isSelected?: boolean;
|
|
77
|
-
color?: string;
|
|
78
|
-
}, dataset?: any[], groupedData?: any[]) => string | ReactElement;
|
|
79
|
-
/** Default placement of the tooltip. */
|
|
80
|
-
tooltipProps?: Partial<Omit<TooltipProps, 'ref'>>;
|
|
81
|
-
}
|
|
82
|
-
type StyledDataPointProps = Omit<DataPointProps<any>, 'data' | 'dataset'> & {
|
|
83
|
-
$clickable: boolean;
|
|
84
|
-
};
|
|
85
|
-
|
|
86
|
-
export { AnchorProps as A, DataPointProps as D, LegendVariant as L, StyledDataPointProps as S, TooltipVariant as T, LabelVariant as a };
|
package/_internal/types.d5.ts
DELETED
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { ScaleLinear, ScaleTime, ScalePoint } from 'd3';
|
|
2
|
-
import { D as DataPointProps, S as StyledDataPointProps } from './types.d4.ts';
|
|
3
|
-
import { ValueOf, Theme } from '@redsift/design-system';
|
|
4
|
-
import { m as DotDatum } from './data.js';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Component's variant.
|
|
8
|
-
*/
|
|
9
|
-
declare const DotVariant: {
|
|
10
|
-
readonly plain: "plain";
|
|
11
|
-
readonly hollow: "hollow";
|
|
12
|
-
};
|
|
13
|
-
type DotVariant = ValueOf<typeof DotVariant>;
|
|
14
|
-
/**
|
|
15
|
-
* Component props.
|
|
16
|
-
*/
|
|
17
|
-
interface DotProps extends DataPointProps<DotDatum> {
|
|
18
|
-
/** A scale defined over a numeric/time/ordinal domain used to determine the x position based on the coordinates. */
|
|
19
|
-
scaleX: ScaleLinear<number, number, never> | ScaleTime<number, number, never> | ScalePoint<string>;
|
|
20
|
-
/** A linear continuous scale defined over a numeric domain used to determine the y position based on the coordinates. */
|
|
21
|
-
scaleY: ScaleLinear<number, number, never>;
|
|
22
|
-
/** Variant. */
|
|
23
|
-
variant?: DotVariant;
|
|
24
|
-
}
|
|
25
|
-
type StyledDotProps = StyledDataPointProps & Omit<DotProps, 'scaleX' | 'scaleY'> & {
|
|
26
|
-
$variant: DotProps['variant'];
|
|
27
|
-
$theme: Theme;
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
export { DotVariant as D, StyledDotProps as S, DotProps as a };
|
package/_internal/types.d6.ts
DELETED
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { ComponentProps, ReactElement } from 'react';
|
|
2
|
-
import { L as LegendItemProps } from './types.d7.ts';
|
|
3
|
-
import { ContainerProps } from '@redsift/design-system';
|
|
4
|
-
import { S as Statistic, p as LegendItemDatum } from './data.js';
|
|
5
|
-
import { L as LegendVariant } from './types.d4.ts';
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Component props.
|
|
9
|
-
*/
|
|
10
|
-
interface LegendProps extends Omit<ComponentProps<'ul'>, 'onClick' | 'children'>, ContainerProps {
|
|
11
|
-
/** Children */
|
|
12
|
-
children?: ReactElement | ReactElement[] | ((data: (Statistic & {
|
|
13
|
-
color: string;
|
|
14
|
-
})[], total?: number) => ReactElement);
|
|
15
|
-
/** Data. */
|
|
16
|
-
data?: (Statistic & {
|
|
17
|
-
color: string;
|
|
18
|
-
})[];
|
|
19
|
-
/** Method to determine whether a legend is selected or not. */
|
|
20
|
-
isLegendItemSelected?: (datum: LegendItemDatum) => void;
|
|
21
|
-
/** Method to override the data labels. */
|
|
22
|
-
labelDecorator?: (datum: LegendItemDatum, props?: {
|
|
23
|
-
index?: number;
|
|
24
|
-
isSelected?: boolean;
|
|
25
|
-
color?: string;
|
|
26
|
-
}) => string | ReactElement;
|
|
27
|
-
/** Method modifying what's displayed within the legend when the variant is "custom". */
|
|
28
|
-
legendDecorator?: (datum: LegendItemDatum, props?: {
|
|
29
|
-
index?: number;
|
|
30
|
-
isSelected?: boolean;
|
|
31
|
-
color?: string;
|
|
32
|
-
}) => string | ReactElement;
|
|
33
|
-
/** Method to be called on a click on a legend item. */
|
|
34
|
-
onLegendItemClick?: (datum: LegendItemDatum, data: LegendItemDatum[]) => void;
|
|
35
|
-
/** LegendItem role. Used to indicate that legend items are to be considered buttons or links. If an onClick is provided, the legend items will have the role `button` unless specifically set to `link` with this prop. */
|
|
36
|
-
legendItemRole?: LegendItemProps['role'];
|
|
37
|
-
/** Variant. */
|
|
38
|
-
variant?: LegendVariant;
|
|
39
|
-
}
|
|
40
|
-
type StyledLegendProps = Omit<LegendProps, 'data'> & {
|
|
41
|
-
$width?: LegendProps['width'];
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
export { LegendProps as L, StyledLegendProps as S };
|
package/_internal/types.d7.ts
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { ComponentProps, ReactElement } from 'react';
|
|
2
|
-
import { D as DataPointProps, L as LegendVariant, S as StyledDataPointProps } from './types.d4.ts';
|
|
3
|
-
import { Theme } from '@redsift/design-system';
|
|
4
|
-
import { p as LegendItemDatum } from './data.js';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Component props.
|
|
8
|
-
*/
|
|
9
|
-
interface LegendItemProps extends Pick<DataPointProps<LegendItemDatum>, 'color' | 'data' | 'dataset' | 'id' | 'index' | 'isSelected' | 'labelDecorator' | 'onClick' | 'previousData' | 'role' | 'tooltipVariant'>, Omit<ComponentProps<'li'>, 'onClick' | 'role'> {
|
|
10
|
-
/** Method modifying what's displayed within the legend when the variant is "custom". */
|
|
11
|
-
legendDecorator?: (datum: LegendItemDatum, props?: {
|
|
12
|
-
index?: number;
|
|
13
|
-
isSelected?: boolean;
|
|
14
|
-
color?: string;
|
|
15
|
-
}) => string | ReactElement;
|
|
16
|
-
/** Variant. */
|
|
17
|
-
variant?: LegendVariant;
|
|
18
|
-
}
|
|
19
|
-
type StyledLegendItemProps = Pick<StyledDataPointProps, '$clickable'> & Omit<LegendItemProps, 'data' | 'dataset'> & {
|
|
20
|
-
$variant: LegendItemProps['variant'];
|
|
21
|
-
$theme: Theme;
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export { LegendItemProps as L, StyledLegendItemProps as S };
|
package/index.d2.ts
DELETED
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import { ValueOf } from '@redsift/design-system';
|
|
2
|
-
import { f as CategoryDatum, o as Statistics } from './_internal/data.js';
|
|
3
|
-
|
|
4
|
-
type ChartDimensions = {
|
|
5
|
-
width: number;
|
|
6
|
-
height: number;
|
|
7
|
-
};
|
|
8
|
-
declare const ChartSize: {
|
|
9
|
-
readonly small: "small";
|
|
10
|
-
readonly medium: "medium";
|
|
11
|
-
readonly large: "large";
|
|
12
|
-
};
|
|
13
|
-
type ChartSize = ValueOf<typeof ChartSize>;
|
|
14
|
-
type MarginProps = {
|
|
15
|
-
top?: number;
|
|
16
|
-
right?: number;
|
|
17
|
-
bottom?: number;
|
|
18
|
-
left?: number;
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
declare const ColorTheme: {
|
|
22
|
-
readonly default: "default";
|
|
23
|
-
readonly dark: "dark";
|
|
24
|
-
readonly darker: "darker";
|
|
25
|
-
readonly darkerer: "darkerer";
|
|
26
|
-
readonly light: "light";
|
|
27
|
-
readonly lighter: "lighter";
|
|
28
|
-
readonly lighterer: "lighterer";
|
|
29
|
-
readonly monochrome: "monochrome";
|
|
30
|
-
};
|
|
31
|
-
type ColorTheme = ValueOf<typeof ColorTheme>;
|
|
32
|
-
type SuccessDangerColorTheme = {
|
|
33
|
-
success: string;
|
|
34
|
-
warning: string;
|
|
35
|
-
danger: string;
|
|
36
|
-
neutral?: string;
|
|
37
|
-
};
|
|
38
|
-
type CustomColorTheme = Record<string, string>;
|
|
39
|
-
type ChartTheme = ColorTheme | SuccessDangerColorTheme | CustomColorTheme;
|
|
40
|
-
|
|
41
|
-
type SortingMethod = 'none' | 'asc-key' | 'desc-key' | 'asc-value' | 'desc-value' | string[] | ((a: CategoryDatum, b: CategoryDatum) => 1 | -1);
|
|
42
|
-
declare const getSortingMethod: (sortingMethod: SortingMethod) => (a: CategoryDatum, b: CategoryDatum) => 1 | -1;
|
|
43
|
-
declare const isValidDate: (value: string) => boolean;
|
|
44
|
-
declare const mergeLegends: (arr1: Statistics, arr2: Statistics) => {
|
|
45
|
-
key: any;
|
|
46
|
-
value: any;
|
|
47
|
-
}[];
|
|
48
|
-
|
|
49
|
-
export { ChartTheme as C, MarginProps as M, SortingMethod as S, ChartDimensions as a, ChartSize as b, ColorTheme as c, SuccessDangerColorTheme as d, CustomColorTheme as e, getSortingMethod as g, isValidDate as i, mergeLegends as m };
|