@redsift/charts 6.1.0 → 6.3.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 CHANGED
@@ -1,7 +1,11 @@
1
1
  import { PieArcDatum as PieArcDatum$1 } from 'd3-shape';
2
- import { Ref, ReactElement, ComponentProps } from 'react';
2
+ import { ValueOf as ValueOf$1, Comp } from '@redsift/design-system';
3
+ import { ComponentProps } from 'react';
3
4
  import * as styled_components from 'styled-components';
4
5
 
6
+ /** Get types of the values of a record. */
7
+ declare type ValueOf<T extends Record<any, any>> = T[keyof T];
8
+
5
9
  declare type ChartDimensions = {
6
10
  width: number;
7
11
  height: number;
@@ -15,8 +19,21 @@ declare type Datum = {
15
19
  value: number;
16
20
  };
17
21
  declare type PieArcDatum = PieArcDatum$1<Datum>;
22
+ declare const ColorTheme: {
23
+ readonly default: "default";
24
+ readonly dark: "dark";
25
+ readonly darker: "darker";
26
+ readonly monochrome: "monochrome";
27
+ };
28
+ declare type ColorTheme = ValueOf<typeof ColorTheme>;
29
+ declare type SuccessDangerColorTheme = {
30
+ success: string;
31
+ warning: string;
32
+ danger: string;
33
+ neutral?: string;
34
+ };
18
35
 
19
- declare const neutral = "#B6DAEE";
36
+ declare const monochrome = "#B6DAEE";
20
37
  declare const scheme: {
21
38
  default: string[];
22
39
  dark: string[];
@@ -24,29 +41,15 @@ declare const scheme: {
24
41
  light: string[];
25
42
  lighter: string[];
26
43
  monochrome: string[];
44
+ empty: string[];
27
45
  };
28
46
  declare const successDangerScheme: {
29
47
  success: string;
30
48
  warning: string;
31
49
  danger: string;
50
+ neutral: string;
32
51
  };
33
-
34
- /** Component Type. */
35
- declare type Comp<P, T = HTMLElement> = {
36
- (props: P & {
37
- ref?: Ref<T>;
38
- }): ReactElement | null;
39
- /** React component type. */
40
- readonly $$typeof: symbol;
41
- /** Component default props. */
42
- defaultProps?: Partial<P>;
43
- /** Component name. */
44
- displayName?: string;
45
- /** Component base class name. */
46
- className?: string;
47
- };
48
- /** Get types of the values of a record. */
49
- declare type ValueOf<T extends Record<any, any>> = T[keyof T];
52
+ declare const getColorScale: (theme: ColorTheme | SuccessDangerColorTheme, isEmpty?: boolean) => undefined<string, string, never>;
50
53
 
51
54
  /**
52
55
  * Component size.
@@ -56,7 +59,7 @@ declare const PieChartSize: {
56
59
  readonly medium: "medium";
57
60
  readonly large: "large";
58
61
  };
59
- declare type PieChartSize = ValueOf<typeof PieChartSize>;
62
+ declare type PieChartSize = ValueOf$1<typeof PieChartSize>;
60
63
  /**
61
64
  * Component variant.
62
65
  */
@@ -66,7 +69,7 @@ declare const PieChartVariant: {
66
69
  readonly donut: "donut";
67
70
  readonly spacedDonut: "spacedDonut";
68
71
  };
69
- declare type PieChartVariant = ValueOf<typeof PieChartVariant>;
72
+ declare type PieChartVariant = ValueOf$1<typeof PieChartVariant>;
70
73
  /**
71
74
  * Component's labels variant.
72
75
  */
@@ -77,7 +80,7 @@ declare const PieChartLabelVariant: {
77
80
  readonly externalLabelValue: "externalLabelValue";
78
81
  readonly externalLabelPercent: "externalLabelPercent";
79
82
  };
80
- declare type PieChartLabelVariant = ValueOf<typeof PieChartLabelVariant>;
83
+ declare type PieChartLabelVariant = ValueOf$1<typeof PieChartLabelVariant>;
81
84
  /**
82
85
  * Component theme.
83
86
  */
@@ -87,12 +90,19 @@ declare const PieChartTheme: {
87
90
  readonly darker: "darker";
88
91
  readonly monochrome: "monochrome";
89
92
  };
90
- declare type PieChartTheme = ValueOf<typeof PieChartTheme>;
93
+ declare type PieChartTheme = ValueOf$1<typeof PieChartTheme>;
94
+ /**
95
+ * Tooltip label variant.
96
+ */
97
+ declare const PieChartTooltipVariant: {
98
+ none: string;
99
+ label: string;
100
+ value: string;
101
+ percent: string;
102
+ };
103
+ declare type PieChartTooltipVariant = ValueOf$1<typeof PieChartTooltipVariant>;
91
104
  interface LocaleText {
92
- emptyChartTitle: string;
93
- emptyChartSubtitle: string;
94
- emptyChartResetLabel: string;
95
- resetLabel: string;
105
+ emptyChartText: string;
96
106
  }
97
107
  /**
98
108
  * Component props.
@@ -110,26 +120,24 @@ interface PieChartProps extends ComponentProps<'div'> {
110
120
  localeText?: LocaleText;
111
121
  /** Method to be called on a click on a slice. */
112
122
  onSliceClick?: (data: Datum) => void;
113
- /** Method to be called when hovering a slice. */
114
- onSliceHover?: (data: Datum) => void;
115
123
  /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */
116
124
  others?: boolean | string;
117
125
  /** PieChart size. */
118
126
  size?: PieChartSize;
119
- /** Secondary text to be displayed in the middle of the chart, above the main text. Only for donut variant. */
127
+ /** Secondary text to be displayed in the middle of the chart, between the main text and subtext. Recommended to be used with donut variants only. */
128
+ middleText?: string;
129
+ /** Secondary text to be displayed in the middle of the chart, above the main text. Recommended to be used with `donut` variants only. */
120
130
  subtext?: string;
121
- /** Main text to be displayed in the middle of the chart. Only for donut variant. */
131
+ /** Main text to be displayed in the middle of the chart. Recommended to be used with `donut` variants only. */
122
132
  text?: string;
123
133
  /** 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. */
124
- theme?: PieChartTheme | {
125
- success: string;
126
- warning: string;
127
- danger: string;
128
- };
134
+ theme?: PieChartTheme | SuccessDangerColorTheme;
129
135
  /** Title. */
130
136
  title?: string;
131
137
  /** PieChart variant. */
132
138
  variant?: PieChartVariant;
139
+ /** Tooltip variant. */
140
+ tooltipVariant?: PieChartTooltipVariant;
133
141
  }
134
142
  declare type StyledPieChartProps = Omit<PieChartProps, 'data'> & {};
135
143
  interface PieChartArcProps extends ComponentProps<'g'> {
@@ -137,13 +145,16 @@ interface PieChartArcProps extends ComponentProps<'g'> {
137
145
  data: Datum;
138
146
  index: number;
139
147
  onClick?: () => void;
140
- onMouseOver?: () => void;
141
148
  path: string;
142
149
  spaced?: boolean;
150
+ showTooltip: boolean;
151
+ tooltipPercent: string | null;
152
+ tooltipLabelOnly: boolean;
153
+ isEmpty: boolean;
143
154
  }
144
- declare type StyledPieChartArcProps = Omit<PieChartArcProps, 'color' | 'data' | 'index' | 'path' | 'spaced'> & {
145
- $hover: boolean;
155
+ declare type StyledPieChartArcProps = Omit<PieChartArcProps, 'color' | 'data' | 'index' | 'path' | 'spaced' | 'showTooltip' | 'tooltipPercent' | 'tooltipLabelOnly' | 'isEmpty'> & {
146
156
  $spaced: boolean;
157
+ $clickable: boolean;
147
158
  };
148
159
 
149
160
  declare const PieChart: Comp<PieChartProps, HTMLDivElement>;
@@ -156,13 +167,21 @@ declare const StyledPieChartTitle: styled_components.StyledComponent<"div", any,
156
167
  declare const StyledPieChartCaption: styled_components.StyledComponent<"p", any, Omit<PieChartProps, "data">, never>;
157
168
  declare const StyledPieChartCenterText: styled_components.StyledComponent<"div", any, {
158
169
  $maxWidth: number;
170
+ $textSize: number;
171
+ $smallTextSize: number;
172
+ }, never>;
173
+ declare const StyledPieChartEmptyText: styled_components.StyledComponent<"div", any, {
174
+ $maxWidth: number;
175
+ $textSize: number;
176
+ $isDonut: boolean;
159
177
  }, never>;
160
178
  declare const StyledPieChartLabel: styled_components.StyledComponent<"li", any, {
161
179
  $color: string;
162
180
  }, never>;
163
- declare const StyledPieChartArc: styled_components.StyledComponent<"g", any, Omit<PieChartArcProps, "data" | "path" | "color" | "spaced" | "index"> & {
164
- $hover: boolean;
181
+ declare const StyledPieChartArc: styled_components.StyledComponent<"g", any, Omit<PieChartArcProps, "data" | "path" | "color" | "spaced" | "index" | "showTooltip" | "tooltipPercent" | "tooltipLabelOnly" | "isEmpty"> & {
165
182
  $spaced: boolean;
183
+ $clickable: boolean;
166
184
  }, never>;
185
+ declare const Tooltip: styled_components.StyledComponent<"div", any, {}, never>;
167
186
 
168
- export { ChartDimensions, Datum, PieArcDatum, PieChart, PieChartArcProps, PieChartLabelVariant, PieChartProps, PieChartSize, PieChartTheme, PieChartVariant, StyledPieChart, StyledPieChartArc, StyledPieChartArcProps, StyledPieChartCaption, StyledPieChartCenterText, StyledPieChartLabel, StyledPieChartProps, StyledPieChartTitle, neutral, scheme, successDangerScheme };
187
+ export { ChartDimensions, ColorTheme, Datum, PieArcDatum, PieChart, PieChartArcProps, PieChartLabelVariant, PieChartProps, PieChartSize, PieChartTheme, PieChartTooltipVariant, PieChartVariant, StyledPieChart, StyledPieChartArc, StyledPieChartArcProps, StyledPieChartCaption, StyledPieChartCenterText, StyledPieChartEmptyText, StyledPieChartLabel, StyledPieChartProps, StyledPieChartTitle, SuccessDangerColorTheme, Tooltip, getColorScale, monochrome, scheme, successDangerScheme };