@redsift/charts 9.4.1 → 9.5.0
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 +220 -143
- package/index.js +158 -71
- package/index.js.map +1 -1
- package/package.json +2 -2
package/index.d.ts
CHANGED
|
@@ -21,6 +21,126 @@ interface UseBrushProps {
|
|
|
21
21
|
}
|
|
22
22
|
declare const useBrush: ({ brushRef: propsBrushRef, svgRef, extent, scaleX, scaleY, isBrushable, isGridded, onBrush, onBrushEnd, }: UseBrushProps) => void;
|
|
23
23
|
|
|
24
|
+
/**
|
|
25
|
+
* Component variant.
|
|
26
|
+
*/
|
|
27
|
+
declare const AxisVariant: {
|
|
28
|
+
readonly none: "none";
|
|
29
|
+
readonly line: "line";
|
|
30
|
+
readonly lineTick: "lineTick";
|
|
31
|
+
readonly tick: "tick";
|
|
32
|
+
readonly tickValue: "tickValue";
|
|
33
|
+
readonly default: "default";
|
|
34
|
+
};
|
|
35
|
+
type AxisVariant = ValueOf<typeof AxisVariant>;
|
|
36
|
+
declare const AxisPosition: {
|
|
37
|
+
top: string;
|
|
38
|
+
right: string;
|
|
39
|
+
bottom: string;
|
|
40
|
+
left: string;
|
|
41
|
+
};
|
|
42
|
+
type AxisPosition = ValueOf<typeof AxisPosition>;
|
|
43
|
+
/**
|
|
44
|
+
* Component props.
|
|
45
|
+
*/
|
|
46
|
+
interface AxisProps extends Omit<ComponentProps<'g'>, 'scale'> {
|
|
47
|
+
areLabelsRotated?: boolean;
|
|
48
|
+
format?: string;
|
|
49
|
+
legend?: string;
|
|
50
|
+
legendOffset?: number;
|
|
51
|
+
legendPosition?: 'start' | 'middle' | 'end';
|
|
52
|
+
/** Length of the axis. */
|
|
53
|
+
length?: number;
|
|
54
|
+
/** Position of axis. top|bottom means this is an x axis, right|left means this is an y axis. */
|
|
55
|
+
position?: AxisPosition;
|
|
56
|
+
/** Scale (d3.js) used to generate the axis. */
|
|
57
|
+
scale: AnyScale;
|
|
58
|
+
tickFormat?: ((d: NumericValue) => string) | ((d: StringValue) => string) | ((d: Date) => string) | ((d: ScaleValue) => string);
|
|
59
|
+
tickPadding?: number;
|
|
60
|
+
tickRotation?: number;
|
|
61
|
+
tickSize?: number;
|
|
62
|
+
tickValues?: TicksSpec;
|
|
63
|
+
/** Variant. */
|
|
64
|
+
variant?: AxisVariant;
|
|
65
|
+
/** X position. */
|
|
66
|
+
x?: number;
|
|
67
|
+
/** Y position. */
|
|
68
|
+
y?: number;
|
|
69
|
+
}
|
|
70
|
+
type StyledAxisProps = Omit<AxisProps, 'areXLabelsRotated' | 'size' | 'scale'> & {};
|
|
71
|
+
|
|
72
|
+
declare const Axis: Comp<AxisProps, SVGGElement>;
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* Component style.
|
|
76
|
+
*/
|
|
77
|
+
declare const StyledAxis: styled_components.StyledComponent<_react_spring_web.AnimatedComponent<"g">, any, Omit<AxisProps, "size" | "scale" | "areXLabelsRotated">, never>;
|
|
78
|
+
|
|
79
|
+
type Coordinates = {
|
|
80
|
+
x: number;
|
|
81
|
+
y: number;
|
|
82
|
+
};
|
|
83
|
+
type NumericValue = {
|
|
84
|
+
valueOf(): number;
|
|
85
|
+
};
|
|
86
|
+
type StringValue = {
|
|
87
|
+
toString(): string;
|
|
88
|
+
};
|
|
89
|
+
type ScaleValue = NumericValue | StringValue | Date;
|
|
90
|
+
interface ScaleLinear<Output> extends ScaleLinear$2<number, Output, never> {
|
|
91
|
+
type: 'linear';
|
|
92
|
+
stacked: boolean;
|
|
93
|
+
}
|
|
94
|
+
interface ScaleLog extends ScaleLogarithmic<number, number> {
|
|
95
|
+
type: 'log';
|
|
96
|
+
}
|
|
97
|
+
interface ScaleSymlog extends ScaleSymLog<number, number> {
|
|
98
|
+
type: 'symlog';
|
|
99
|
+
}
|
|
100
|
+
interface ScalePoint<Input extends StringValue> extends ScalePoint$1<Input> {
|
|
101
|
+
type: 'point';
|
|
102
|
+
}
|
|
103
|
+
interface ScaleBand<Input extends StringValue> extends ScaleBand$1<Input> {
|
|
104
|
+
type: 'band';
|
|
105
|
+
}
|
|
106
|
+
interface ScaleTime<Input> extends ScaleTime$1<Input, number> {
|
|
107
|
+
type: 'time';
|
|
108
|
+
useUTC: boolean;
|
|
109
|
+
}
|
|
110
|
+
interface ScaleTypeToScale<Input, Output> {
|
|
111
|
+
linear: Input extends NumericValue ? ScaleLinear<Output> : never;
|
|
112
|
+
log: Input extends NumericValue ? ScaleLog : never;
|
|
113
|
+
symlog: Input extends NumericValue ? ScaleSymlog : never;
|
|
114
|
+
point: Input extends StringValue ? ScalePoint<Input> : never;
|
|
115
|
+
band: Input extends StringValue ? ScaleBand<Input> : never;
|
|
116
|
+
time: Input extends StringValue | Date ? ScaleTime<Input> : never;
|
|
117
|
+
}
|
|
118
|
+
type Scale<Input, Output> = ScaleTypeToScale<Input, Output>[keyof ScaleTypeToScale<Input, Output>];
|
|
119
|
+
type AnyScale = Scale<any, any>;
|
|
120
|
+
type ScaleWithBandwidth = ScaleBand<any> | ScalePoint<any>;
|
|
121
|
+
type TicksSpec = number | string | ScaleValue[];
|
|
122
|
+
|
|
123
|
+
type ChartAxesProps = {
|
|
124
|
+
/** String to Date. */
|
|
125
|
+
dateParser?: (value: string) => Date;
|
|
126
|
+
/** X axis variant. */
|
|
127
|
+
xAxisVariant?: AxisVariant;
|
|
128
|
+
/** X axis placement. */
|
|
129
|
+
xAxisPlacement?: 'bottom' | 'top' | 'both';
|
|
130
|
+
/** X axis tick format. */
|
|
131
|
+
xAxisTickFormat?: ((d: NumericValue) => string) | ((d: StringValue) => string) | ((d: Date) => string) | ((d: ScaleValue) => string);
|
|
132
|
+
/** X axis tick values. */
|
|
133
|
+
xAxisTickValues?: TicksSpec;
|
|
134
|
+
/** Y axis variant. */
|
|
135
|
+
yAxisVariant?: AxisVariant;
|
|
136
|
+
/** Y axis placement. */
|
|
137
|
+
yAxisPlacement?: 'right' | 'left' | 'both';
|
|
138
|
+
/** Y axis tick format. */
|
|
139
|
+
yAxisTickFormat?: ((d: NumericValue) => string) | ((d: StringValue) => string) | ((d: Date) => string) | ((d: ScaleValue) => string);
|
|
140
|
+
/** Y axis tick values. */
|
|
141
|
+
yAxisTickValues?: TicksSpec;
|
|
142
|
+
};
|
|
143
|
+
|
|
24
144
|
type JSONValue = string | number | boolean | Date | {
|
|
25
145
|
[x: string]: JSONValue;
|
|
26
146
|
} | Array<JSONValue> | undefined | null;
|
|
@@ -94,57 +214,22 @@ declare const TooltipVariant: {
|
|
|
94
214
|
};
|
|
95
215
|
type TooltipVariant = ValueOf<typeof TooltipVariant>;
|
|
96
216
|
/** LEGEND */
|
|
97
|
-
declare const
|
|
217
|
+
declare const LegendVariant: {
|
|
218
|
+
readonly none: "none";
|
|
98
219
|
readonly label: "label";
|
|
99
220
|
readonly value: "value";
|
|
100
221
|
readonly percent: "percent";
|
|
101
222
|
readonly custom: "custom";
|
|
102
223
|
};
|
|
103
|
-
type
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
valueOf(): number;
|
|
111
|
-
};
|
|
112
|
-
type StringValue = {
|
|
113
|
-
toString(): string;
|
|
224
|
+
type LegendVariant = ValueOf<typeof LegendVariant>;
|
|
225
|
+
declare const LabelVariant: {
|
|
226
|
+
readonly none: "none";
|
|
227
|
+
readonly label: "label";
|
|
228
|
+
readonly value: "value";
|
|
229
|
+
readonly percent: "percent";
|
|
230
|
+
readonly custom: "custom";
|
|
114
231
|
};
|
|
115
|
-
type
|
|
116
|
-
interface ScaleLinear<Output> extends ScaleLinear$2<number, Output, never> {
|
|
117
|
-
type: 'linear';
|
|
118
|
-
stacked: boolean;
|
|
119
|
-
}
|
|
120
|
-
interface ScaleLog extends ScaleLogarithmic<number, number> {
|
|
121
|
-
type: 'log';
|
|
122
|
-
}
|
|
123
|
-
interface ScaleSymlog extends ScaleSymLog<number, number> {
|
|
124
|
-
type: 'symlog';
|
|
125
|
-
}
|
|
126
|
-
interface ScalePoint<Input extends StringValue> extends ScalePoint$1<Input> {
|
|
127
|
-
type: 'point';
|
|
128
|
-
}
|
|
129
|
-
interface ScaleBand<Input extends StringValue> extends ScaleBand$1<Input> {
|
|
130
|
-
type: 'band';
|
|
131
|
-
}
|
|
132
|
-
interface ScaleTime<Input> extends ScaleTime$1<Input, number> {
|
|
133
|
-
type: 'time';
|
|
134
|
-
useUTC: boolean;
|
|
135
|
-
}
|
|
136
|
-
interface ScaleTypeToScale<Input, Output> {
|
|
137
|
-
linear: Input extends NumericValue ? ScaleLinear<Output> : never;
|
|
138
|
-
log: Input extends NumericValue ? ScaleLog : never;
|
|
139
|
-
symlog: Input extends NumericValue ? ScaleSymlog : never;
|
|
140
|
-
point: Input extends StringValue ? ScalePoint<Input> : never;
|
|
141
|
-
band: Input extends StringValue ? ScaleBand<Input> : never;
|
|
142
|
-
time: Input extends StringValue | Date ? ScaleTime<Input> : never;
|
|
143
|
-
}
|
|
144
|
-
type Scale<Input, Output> = ScaleTypeToScale<Input, Output>[keyof ScaleTypeToScale<Input, Output>];
|
|
145
|
-
type AnyScale = Scale<any, any>;
|
|
146
|
-
type ScaleWithBandwidth = ScaleBand<any> | ScalePoint<any>;
|
|
147
|
-
type TicksSpec = number | string | ScaleValue[];
|
|
232
|
+
type LabelVariant = LegendVariant;
|
|
148
233
|
|
|
149
234
|
type ChartDimensions = {
|
|
150
235
|
width: number;
|
|
@@ -282,6 +367,12 @@ interface DataPointProps<T> extends Omit<ComponentProps<'g'>, 'onClick' | 'scale
|
|
|
282
367
|
role?: 'button' | 'link' | 'option';
|
|
283
368
|
/** Tooltip variant. */
|
|
284
369
|
tooltipVariant?: TooltipVariant;
|
|
370
|
+
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
371
|
+
tooltipDecorator?: (data: T, props?: {
|
|
372
|
+
index?: number;
|
|
373
|
+
isSelected?: boolean;
|
|
374
|
+
color?: string;
|
|
375
|
+
}) => string | ReactElement;
|
|
285
376
|
}
|
|
286
377
|
type StyledDataPointProps = Omit<DataPointProps<any>, 'data'> & {
|
|
287
378
|
$clickable: boolean;
|
|
@@ -323,7 +414,7 @@ declare const StyledArc: styled_components.StyledComponent<_redsift_design_syste
|
|
|
323
414
|
/**
|
|
324
415
|
* Component props.
|
|
325
416
|
*/
|
|
326
|
-
interface ArcsProps extends Omit<ComponentProps<'g'>, 'onClick' | 'role'>, Pick<ArcProps, 'id' | 'labelDecorator' | 'onClick' | 'role' | 'hasStroke' | 'tooltipVariant'> {
|
|
417
|
+
interface ArcsProps extends Omit<ComponentProps<'g'>, 'onClick' | 'role'>, Pick<ArcProps, 'id' | 'labelDecorator' | 'onClick' | 'role' | 'hasStroke' | 'tooltipDecorator' | 'tooltipVariant'> {
|
|
327
418
|
/** Arc props. */
|
|
328
419
|
arcs: Omit<ArcProps, 'ref'>[];
|
|
329
420
|
/** Whether arcs have internal labels or not. */
|
|
@@ -340,61 +431,6 @@ declare const Arcs: Comp<ArcsProps, SVGGElement>;
|
|
|
340
431
|
*/
|
|
341
432
|
declare const StyledArcs: styled_components.StyledComponent<"g", any, Omit<ArcsProps, "arcs">, never>;
|
|
342
433
|
|
|
343
|
-
/**
|
|
344
|
-
* Component variant.
|
|
345
|
-
*/
|
|
346
|
-
declare const AxisVariant: {
|
|
347
|
-
readonly none: "none";
|
|
348
|
-
readonly line: "line";
|
|
349
|
-
readonly lineTick: "lineTick";
|
|
350
|
-
readonly tick: "tick";
|
|
351
|
-
readonly tickValue: "tickValue";
|
|
352
|
-
readonly default: "default";
|
|
353
|
-
};
|
|
354
|
-
type AxisVariant = ValueOf<typeof AxisVariant>;
|
|
355
|
-
declare const AxisPosition: {
|
|
356
|
-
top: string;
|
|
357
|
-
right: string;
|
|
358
|
-
bottom: string;
|
|
359
|
-
left: string;
|
|
360
|
-
};
|
|
361
|
-
type AxisPosition = ValueOf<typeof AxisPosition>;
|
|
362
|
-
/**
|
|
363
|
-
* Component props.
|
|
364
|
-
*/
|
|
365
|
-
interface AxisProps extends Omit<ComponentProps<'g'>, 'scale'> {
|
|
366
|
-
areLabelsRotated?: boolean;
|
|
367
|
-
format?: string;
|
|
368
|
-
legend?: string;
|
|
369
|
-
legendOffset?: number;
|
|
370
|
-
legendPosition?: 'start' | 'middle' | 'end';
|
|
371
|
-
/** Length of the axis. */
|
|
372
|
-
length?: number;
|
|
373
|
-
/** Position of axis. top|bottom means this is an x axis, right|left means this is an y axis. */
|
|
374
|
-
position?: AxisPosition;
|
|
375
|
-
/** Scale (d3.js) used to generate the axis. */
|
|
376
|
-
scale: AnyScale;
|
|
377
|
-
tickFormat?: ((d: NumericValue) => string) | ((d: StringValue) => string) | ((d: Date) => string) | ((d: ScaleValue) => string);
|
|
378
|
-
tickPadding?: number;
|
|
379
|
-
tickRotation?: number;
|
|
380
|
-
tickSize?: number;
|
|
381
|
-
tickValues?: TicksSpec;
|
|
382
|
-
/** Variant. */
|
|
383
|
-
variant?: AxisVariant;
|
|
384
|
-
/** X position. */
|
|
385
|
-
x?: number;
|
|
386
|
-
/** Y position. */
|
|
387
|
-
y?: number;
|
|
388
|
-
}
|
|
389
|
-
type StyledAxisProps = Omit<AxisProps, 'areXLabelsRotated' | 'size' | 'scale'> & {};
|
|
390
|
-
|
|
391
|
-
declare const Axis: Comp<AxisProps, SVGGElement>;
|
|
392
|
-
|
|
393
|
-
/**
|
|
394
|
-
* Component style.
|
|
395
|
-
*/
|
|
396
|
-
declare const StyledAxis: styled_components.StyledComponent<_react_spring_web.AnimatedComponent<"g">, any, Omit<AxisProps, "size" | "scale" | "areXLabelsRotated">, never>;
|
|
397
|
-
|
|
398
434
|
/**
|
|
399
435
|
* Component variant.
|
|
400
436
|
*/
|
|
@@ -468,7 +504,7 @@ type BarChartDimensions = ChartDimensions & {
|
|
|
468
504
|
/**
|
|
469
505
|
* Component props.
|
|
470
506
|
*/
|
|
471
|
-
interface BarChartProps extends ChartContainerProps {
|
|
507
|
+
interface BarChartProps extends ChartContainerProps, ChartAxesProps {
|
|
472
508
|
/** Whether the x axis labels are rotated or not. */
|
|
473
509
|
areXLabelsRotated?: boolean;
|
|
474
510
|
/** Native HTML props to forward to each bar. */
|
|
@@ -503,6 +539,12 @@ interface BarChartProps extends ChartContainerProps {
|
|
|
503
539
|
barRole?: BarProps['role'];
|
|
504
540
|
/** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status. */
|
|
505
541
|
theme?: ChartTheme;
|
|
542
|
+
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
543
|
+
tooltipDecorator?: (data: BarDatum, props?: {
|
|
544
|
+
index?: number;
|
|
545
|
+
isSelected?: boolean;
|
|
546
|
+
color?: string;
|
|
547
|
+
}) => string | ReactElement;
|
|
506
548
|
/** Tooltip variant. */
|
|
507
549
|
tooltipVariant?: TooltipVariant;
|
|
508
550
|
}
|
|
@@ -557,8 +599,14 @@ declare const StyledDot: styled_components.StyledComponent<_redsift_design_syste
|
|
|
557
599
|
* Component props.
|
|
558
600
|
*/
|
|
559
601
|
interface LegendItemProps extends Pick<DataPointProps<LegendItemDatum>, 'color' | 'data' | 'id' | 'index' | 'isSelected' | 'labelDecorator' | 'onClick' | 'previousData' | 'role' | 'tooltipVariant'>, Omit<ComponentProps<'li'>, 'onClick' | 'role'> {
|
|
602
|
+
/** Method modifying what's displayed within the legend when the variant is "custom". */
|
|
603
|
+
legendDecorator?: (datum: LegendItemDatum, props?: {
|
|
604
|
+
index?: number;
|
|
605
|
+
isSelected?: boolean;
|
|
606
|
+
color?: string;
|
|
607
|
+
}) => string | ReactElement;
|
|
560
608
|
/** Variant. */
|
|
561
|
-
variant?:
|
|
609
|
+
variant?: LegendVariant;
|
|
562
610
|
}
|
|
563
611
|
|
|
564
612
|
/**
|
|
@@ -577,12 +625,18 @@ interface LegendProps extends Omit<ComponentProps<'ul'>, 'onClick'>, ContainerPr
|
|
|
577
625
|
isSelected?: boolean;
|
|
578
626
|
color?: string;
|
|
579
627
|
}) => string | ReactElement;
|
|
628
|
+
/** Method modifying what's displayed within the legend when the variant is "custom". */
|
|
629
|
+
legendDecorator?: (datum: LegendItemDatum, props?: {
|
|
630
|
+
index?: number;
|
|
631
|
+
isSelected?: boolean;
|
|
632
|
+
color?: string;
|
|
633
|
+
}) => string | ReactElement;
|
|
580
634
|
/** Method to be called on a click on a legend item. */
|
|
581
635
|
onLegendItemClick?: (datum: LegendItemDatum) => void;
|
|
582
636
|
/** 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. */
|
|
583
637
|
legendItemRole?: LegendItemProps['role'];
|
|
584
638
|
/** Variant. */
|
|
585
|
-
variant?:
|
|
639
|
+
variant?: LegendVariant;
|
|
586
640
|
}
|
|
587
641
|
type StyledLegendProps = Omit<LegendProps, 'data'> & {
|
|
588
642
|
$width?: LegendProps['width'];
|
|
@@ -620,13 +674,14 @@ declare const StyledLine: styled_components.StyledComponent<"g", any, StyledLine
|
|
|
620
674
|
/**
|
|
621
675
|
* Component's labels variant.
|
|
622
676
|
*/
|
|
623
|
-
declare const
|
|
677
|
+
declare const LineChartLegendVariant: {
|
|
624
678
|
readonly none: "none";
|
|
625
679
|
readonly externalLabel: "externalLabel";
|
|
626
680
|
readonly externalLabelValue: "externalLabelValue";
|
|
627
681
|
readonly externalLabelPercent: "externalLabelPercent";
|
|
682
|
+
readonly custom: "custom";
|
|
628
683
|
};
|
|
629
|
-
type
|
|
684
|
+
type LineChartLegendVariant = ValueOf<typeof LineChartLegendVariant>;
|
|
630
685
|
interface LocaleText$2 {
|
|
631
686
|
emptyChartText: string;
|
|
632
687
|
}
|
|
@@ -636,7 +691,7 @@ type LineChartDimensions = ChartDimensions & {
|
|
|
636
691
|
/**
|
|
637
692
|
* Component props.
|
|
638
693
|
*/
|
|
639
|
-
interface LineChartProps extends ChartContainerProps {
|
|
694
|
+
interface LineChartProps extends ChartContainerProps, ChartAxesProps {
|
|
640
695
|
/** Dataset to use to generate the chart. */
|
|
641
696
|
data?: TwoCategoryData;
|
|
642
697
|
/** Slice role. Used to indicate that dots are to be considered buttons or links. If an onClick is provided, the dots will have the role `button` unless specifically set to `link` with this prop. */
|
|
@@ -645,14 +700,22 @@ interface LineChartProps extends ChartContainerProps {
|
|
|
645
700
|
emptyComponent?: ReactNode;
|
|
646
701
|
/** Method to determine whether a dot is selected or not. */
|
|
647
702
|
isDotSelected?: (datum: DotDatum) => boolean | undefined;
|
|
648
|
-
/** Method to override the data labels. */
|
|
703
|
+
/** Method to override the data point labels. */
|
|
649
704
|
labelDecorator?: (datum: DotDatum, props?: {
|
|
650
705
|
index?: number;
|
|
651
706
|
isSelected?: boolean;
|
|
652
707
|
color?: string;
|
|
653
708
|
}) => string | ReactElement;
|
|
654
|
-
/**
|
|
655
|
-
|
|
709
|
+
/** Method modifying what's displayed within the legend when the legendVariant is "custom". */
|
|
710
|
+
legendDecorator?: (datum: DotDatum, props?: {
|
|
711
|
+
index?: number;
|
|
712
|
+
isSelected?: boolean;
|
|
713
|
+
color?: string;
|
|
714
|
+
}) => string | ReactElement;
|
|
715
|
+
/** @deprecated Use legendVariant instead. */
|
|
716
|
+
labelVariant?: LineChartLegendVariant;
|
|
717
|
+
/** Define whether the labels should be displayed inside or outside the charts and if they should contain raw or percentage values. If set to "custom", use `legendDecorator` to customize it. */
|
|
718
|
+
legendVariant?: LineChartLegendVariant;
|
|
656
719
|
/** Props to forward to the Legend block. Can be used to make the legend selectable. */
|
|
657
720
|
legendProps?: Omit<LegendProps, 'data' | 'ref' | 'variant' | 'width'>;
|
|
658
721
|
/** Labels and texts. */
|
|
@@ -667,22 +730,14 @@ interface LineChartProps extends ChartContainerProps {
|
|
|
667
730
|
svgRef?: MutableRefObject<SVGSVGElement>;
|
|
668
731
|
/** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status. */
|
|
669
732
|
theme?: ChartTheme;
|
|
733
|
+
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
734
|
+
tooltipDecorator?: (data: DotDatum, props?: {
|
|
735
|
+
index?: number;
|
|
736
|
+
isSelected?: boolean;
|
|
737
|
+
color?: string;
|
|
738
|
+
}) => string | ReactElement;
|
|
670
739
|
/** Tooltip variant. */
|
|
671
740
|
tooltipVariant?: TooltipVariant;
|
|
672
|
-
/** X axis variant. */
|
|
673
|
-
xAxisVariant?: AxisVariant;
|
|
674
|
-
/** X axis placement. */
|
|
675
|
-
xAxisPlacement?: 'bottom' | 'top' | 'both';
|
|
676
|
-
/** X axis tick format. */
|
|
677
|
-
xAxisTickFormat?: ((d: NumericValue) => string) | ((d: StringValue) => string) | ((d: Date) => string) | ((d: ScaleValue) => string);
|
|
678
|
-
/** X axis tick values. */
|
|
679
|
-
xAxisTickValues?: TicksSpec;
|
|
680
|
-
/** String to Date. */
|
|
681
|
-
dateParser?: (value: string) => Date;
|
|
682
|
-
/** Y axis variant. */
|
|
683
|
-
yAxisVariant?: AxisVariant;
|
|
684
|
-
/** Y axis placement. */
|
|
685
|
-
yAxisPlacement?: 'right' | 'left' | 'both';
|
|
686
741
|
}
|
|
687
742
|
type StyledLineChartProps = LineChartProps & {};
|
|
688
743
|
|
|
@@ -710,14 +765,15 @@ type PieChartVariant = ValueOf<typeof PieChartVariant>;
|
|
|
710
765
|
/**
|
|
711
766
|
* Component's labels variant.
|
|
712
767
|
*/
|
|
713
|
-
declare const
|
|
768
|
+
declare const PieChartLegendVariant: {
|
|
714
769
|
readonly none: "none";
|
|
715
770
|
readonly internal: "internal";
|
|
716
771
|
readonly externalLabel: "externalLabel";
|
|
717
772
|
readonly externalLabelValue: "externalLabelValue";
|
|
718
773
|
readonly externalLabelPercent: "externalLabelPercent";
|
|
774
|
+
readonly custom: "custom";
|
|
719
775
|
};
|
|
720
|
-
type
|
|
776
|
+
type PieChartLegendVariant = ValueOf<typeof PieChartLegendVariant>;
|
|
721
777
|
interface LocaleText$1 {
|
|
722
778
|
emptyChartText: string;
|
|
723
779
|
}
|
|
@@ -746,8 +802,16 @@ interface PieChartProps extends ChartContainerProps {
|
|
|
746
802
|
isSelected?: boolean;
|
|
747
803
|
color?: string;
|
|
748
804
|
}) => string | ReactElement;
|
|
749
|
-
/**
|
|
750
|
-
|
|
805
|
+
/** Method modifying what's displayed within the legend when the legendVariant is "custom". */
|
|
806
|
+
legendDecorator?: (datum: ArcDatum, props?: {
|
|
807
|
+
index?: number;
|
|
808
|
+
isSelected?: boolean;
|
|
809
|
+
color?: string;
|
|
810
|
+
}) => string | ReactElement;
|
|
811
|
+
/** @deprecated Use legendVariant instead. */
|
|
812
|
+
labelVariant?: PieChartLegendVariant;
|
|
813
|
+
/** Define whether the labels should be displayed inside or outside the charts and if they should contain raw or percentage values. If set to "custom", use `legendDecorator` to customize it. */
|
|
814
|
+
legendVariant?: PieChartLegendVariant;
|
|
751
815
|
/** Props to forward to the Legend block. Can be used to make the legend selectable. */
|
|
752
816
|
legendProps?: Omit<LegendProps, 'data' | 'ref' | 'variant'>;
|
|
753
817
|
/** Labels and texts. */
|
|
@@ -774,6 +838,12 @@ interface PieChartProps extends ChartContainerProps {
|
|
|
774
838
|
theme?: ChartTheme;
|
|
775
839
|
/** PieChart variant. */
|
|
776
840
|
variant?: PieChartVariant;
|
|
841
|
+
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
842
|
+
tooltipDecorator?: (data: ArcDatum, props?: {
|
|
843
|
+
index?: number;
|
|
844
|
+
isSelected?: boolean;
|
|
845
|
+
color?: string;
|
|
846
|
+
}) => string | ReactElement;
|
|
777
847
|
/** Tooltip variant. */
|
|
778
848
|
tooltipVariant?: TooltipVariant;
|
|
779
849
|
}
|
|
@@ -807,13 +877,14 @@ type ScatterPlotVariant = ValueOf<typeof ScatterPlotVariant>;
|
|
|
807
877
|
/**
|
|
808
878
|
* Component's labels variant.
|
|
809
879
|
*/
|
|
810
|
-
declare const
|
|
880
|
+
declare const ScatterPlotLegendVariant: {
|
|
811
881
|
readonly none: "none";
|
|
812
882
|
readonly externalLabel: "externalLabel";
|
|
813
883
|
readonly externalLabelValue: "externalLabelValue";
|
|
814
884
|
readonly externalLabelPercent: "externalLabelPercent";
|
|
885
|
+
readonly custom: "custom";
|
|
815
886
|
};
|
|
816
|
-
type
|
|
887
|
+
type ScatterPlotLegendVariant = ValueOf<typeof ScatterPlotLegendVariant>;
|
|
817
888
|
interface LocaleText {
|
|
818
889
|
emptyChartText: string;
|
|
819
890
|
}
|
|
@@ -823,7 +894,7 @@ type ScatterPlotDimensions = ChartDimensions & {
|
|
|
823
894
|
/**
|
|
824
895
|
* Component props.
|
|
825
896
|
*/
|
|
826
|
-
interface ScatterPlotProps extends ChartContainerProps {
|
|
897
|
+
interface ScatterPlotProps extends ChartContainerProps, ChartAxesProps {
|
|
827
898
|
/** Dataset to use to generate the chart. */
|
|
828
899
|
data?: CoordinatesCategoryData;
|
|
829
900
|
/** Slice role. Used to indicate that dots are to be considered buttons or links. If an onClick is provided, the dots will have the role `button` unless specifically set to `link` with this prop. */
|
|
@@ -836,14 +907,22 @@ interface ScatterPlotProps extends ChartContainerProps {
|
|
|
836
907
|
isBrushable?: boolean;
|
|
837
908
|
/** Method to determine whether a dot is selected or not. */
|
|
838
909
|
isDotSelected?: (datum: DotDatum) => boolean | undefined;
|
|
839
|
-
/** Method to override the data labels. */
|
|
910
|
+
/** Method to override the data point labels. */
|
|
840
911
|
labelDecorator?: (datum: DotDatum, props?: {
|
|
841
912
|
index?: number;
|
|
842
913
|
isSelected?: boolean;
|
|
843
914
|
color?: string;
|
|
844
915
|
}) => string | ReactElement;
|
|
845
|
-
/**
|
|
846
|
-
|
|
916
|
+
/** Method modifying what's displayed within the legend when the legendVariant is "custom". */
|
|
917
|
+
legendDecorator?: (datum: DotDatum, props?: {
|
|
918
|
+
index?: number;
|
|
919
|
+
isSelected?: boolean;
|
|
920
|
+
color?: string;
|
|
921
|
+
}) => string | ReactElement;
|
|
922
|
+
/** @deprecated Use legendVariant instead. */
|
|
923
|
+
labelVariant?: ScatterPlotLegendVariant;
|
|
924
|
+
/** Define whether the labels should be displayed inside or outside the charts and if they should contain raw or percentage values. If set to "custom", use `legendDecorator` to customize it. */
|
|
925
|
+
legendVariant?: ScatterPlotLegendVariant;
|
|
847
926
|
/** Props to forward to the Legend block. Can be used to make the legend selectable. */
|
|
848
927
|
legendProps?: Omit<LegendProps, 'data' | 'ref' | 'variant' | 'width'>;
|
|
849
928
|
/** Labels and texts. */
|
|
@@ -862,18 +941,16 @@ interface ScatterPlotProps extends ChartContainerProps {
|
|
|
862
941
|
svgRef?: MutableRefObject<SVGSVGElement>;
|
|
863
942
|
/** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status. */
|
|
864
943
|
theme?: ChartTheme;
|
|
944
|
+
/** Method modifying what's displayed within the tooltip when the tooltipVariant is "custom". */
|
|
945
|
+
tooltipDecorator?: (data: DotDatum, props?: {
|
|
946
|
+
index?: number;
|
|
947
|
+
isSelected?: boolean;
|
|
948
|
+
color?: string;
|
|
949
|
+
}) => string | ReactElement;
|
|
865
950
|
/** Tooltip variant. */
|
|
866
951
|
tooltipVariant?: TooltipVariant;
|
|
867
952
|
/** Variant. */
|
|
868
953
|
variant?: ScatterPlotVariant;
|
|
869
|
-
/** X axis variant. */
|
|
870
|
-
xAxisVariant?: AxisVariant;
|
|
871
|
-
/** X axis placement. */
|
|
872
|
-
xAxisPlacement?: 'bottom' | 'top' | 'both';
|
|
873
|
-
/** Y axis variant. */
|
|
874
|
-
yAxisVariant?: AxisVariant;
|
|
875
|
-
/** Y axis placement. */
|
|
876
|
-
yAxisPlacement?: 'right' | 'left' | 'both';
|
|
877
954
|
}
|
|
878
955
|
type StyledScatterPlotProps = ScatterPlotProps & {};
|
|
879
956
|
|
|
@@ -888,4 +965,4 @@ declare const StyledScatterPlotEmptyText: styled_components.StyledComponent<"div
|
|
|
888
965
|
$textSize: number;
|
|
889
966
|
}, never>;
|
|
890
967
|
|
|
891
|
-
export { AnyScale, Arc, ArcDatum, ArcProps, Arcs, ArcsProps, Axis, AxisPosition, AxisProps, AxisVariant, Bar, BarChart, BarChartDimensions, BarChartProps, BarDatum, BarOrientation, BarProps, CategoryData, CategoryDatum, CategoryDim, ChartContainer, ChartContainerProps, ChartDimensions, ChartSize, ChartTheme, ColorTheme, Coordinates, CoordinatesCategoryData, CoordinatesCategoryDatum, CoordinatesCategoryDim, CustomColorTheme, DataPoint, DataPointProps, Datum, Dot, DotDatum, DotProps, DotVariant, EmptyDatum, JSONArray, JSONObject, JSONValue, LabelVariant, Legend, LegendItemDatum, LegendProps, Line, LineChart, LineChartDimensions,
|
|
968
|
+
export { AnyScale, Arc, ArcDatum, ArcProps, Arcs, ArcsProps, Axis, AxisPosition, AxisProps, AxisVariant, Bar, BarChart, BarChartDimensions, BarChartProps, BarDatum, BarOrientation, BarProps, CategoryData, CategoryDatum, CategoryDim, ChartAxesProps, ChartContainer, ChartContainerProps, ChartDimensions, ChartSize, ChartTheme, ColorTheme, Coordinates, CoordinatesCategoryData, CoordinatesCategoryDatum, CoordinatesCategoryDim, CustomColorTheme, DataPoint, DataPointProps, Datum, Dot, DotDatum, DotProps, DotVariant, EmptyDatum, JSONArray, JSONObject, JSONValue, LabelVariant, Legend, LegendItemDatum, LegendProps, LegendVariant, Line, LineChart, LineChartDimensions, LineChartLegendVariant, LineChartProps, LinePointDatum, LineProps, NumericValue, PieChart, PieChartDimensions, PieChartLegendVariant, PieChartProps, PieChartVariant, Scale, ScaleBand, ScaleLinear, ScaleLog, ScalePoint, ScaleSymlog, ScaleTime, ScaleTypeToScale, ScaleValue, ScaleWithBandwidth, ScatterPlot, ScatterPlotDimensions, ScatterPlotLegendVariant, ScatterPlotProps, ScatterPlotVariant, SortingMethod, Statistic, Statistics, StringValue, StyledArc, StyledArcProps, StyledArcs, StyledArcsProps, StyledAxis, StyledAxisProps, StyledBar, StyledBarChart, StyledBarChartEmptyText, StyledBarChartProps, StyledBarProps, StyledChartContainer, StyledChartContainerCaption, StyledChartContainerProps, StyledChartContainerTitle, StyledDataPoint, StyledDataPointProps, StyledDot, StyledDotProps, StyledLegend, StyledLegendProps, StyledLine, StyledLineChart, StyledLineChartEmptyText, StyledLineChartProps, StyledLineProps, StyledPieChart, StyledPieChartCenterText, StyledPieChartEmptyText, StyledPieChartProps, StyledScatterPlot, StyledScatterPlotEmptyText, StyledScatterPlotProps, SuccessDangerColorTheme, TicksSpec, TooltipVariant, TwoCategoryData, TwoCategoryDatum, TwoCategoryDim, UseBrushProps, UseColorProps, UseFormatCategoricalDataProps, UseZoomProps, empty, getColorScale, getSortingMethod, monochrome, scheme, successDangerScheme, useBrush, useColor, useFormatCategoricalData, useZoom };
|