@react-magma/charts 12.0.0-next.6 → 12.0.1-next.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.
Files changed (45) hide show
  1. package/dist/components/CarbonChart/CarbonChartArea.stories.d.ts +308 -10
  2. package/dist/components/CarbonChart/CarbonChartAreaStacked.stories.d.ts +134 -5
  3. package/dist/components/CarbonChart/CarbonChartBar.stories.d.ts +212 -10
  4. package/dist/components/CarbonChart/CarbonChartBarFloating.stories.d.ts +80 -4
  5. package/dist/components/CarbonChart/CarbonChartBarGrouped.stories.d.ts +232 -11
  6. package/dist/components/CarbonChart/CarbonChartBarStacked.stories.d.ts +264 -12
  7. package/dist/components/CarbonChart/CarbonChartBoxplot.stories.d.ts +51 -3
  8. package/dist/components/CarbonChart/CarbonChartBubble.stories.d.ts +194 -7
  9. package/dist/components/CarbonChart/CarbonChartBullet.stories.d.ts +33 -2
  10. package/dist/components/CarbonChart/CarbonChartCombo.stories.d.ts +578 -13
  11. package/dist/components/CarbonChart/CarbonChartDonut.stories.d.ts +118 -6
  12. package/dist/components/CarbonChart/CarbonChartGauge.stories.d.ts +41 -3
  13. package/dist/components/CarbonChart/CarbonChartHistogram.stories.d.ts +87 -4
  14. package/dist/components/CarbonChart/CarbonChartLine.stories.d.ts +575 -18
  15. package/dist/components/CarbonChart/CarbonChartLollipop.stories.d.ts +53 -3
  16. package/dist/components/CarbonChart/CarbonChartMeter.stories.d.ts +125 -6
  17. package/dist/components/CarbonChart/CarbonChartPie.stories.d.ts +99 -6
  18. package/dist/components/CarbonChart/CarbonChartRadar.stories.d.ts +96 -5
  19. package/dist/components/CarbonChart/CarbonChartScatter.stories.d.ts +171 -7
  20. package/dist/components/CarbonChart/CarbonChartSparkline.stories.d.ts +49 -2
  21. package/dist/components/CarbonChart/CarbonChartStep.stories.d.ts +36 -2
  22. package/dist/components/LineChart/LineChart.stories.d.ts +132 -21
  23. package/package.json +3 -3
  24. package/src/components/CarbonChart/CarbonChartArea.stories.tsx +674 -649
  25. package/src/components/CarbonChart/CarbonChartAreaStacked.stories.tsx +424 -414
  26. package/src/components/CarbonChart/CarbonChartBar.stories.tsx +352 -325
  27. package/src/components/CarbonChart/CarbonChartBarFloating.stories.tsx +127 -116
  28. package/src/components/CarbonChart/CarbonChartBarGrouped.stories.tsx +872 -843
  29. package/src/components/CarbonChart/CarbonChartBarStacked.stories.tsx +913 -879
  30. package/src/components/CarbonChart/CarbonChartBoxplot.stories.tsx +238 -232
  31. package/src/components/CarbonChart/CarbonChartBubble.stories.tsx +565 -547
  32. package/src/components/CarbonChart/CarbonChartBullet.stories.tsx +59 -56
  33. package/src/components/CarbonChart/CarbonChartCombo.stories.tsx +1335 -1299
  34. package/src/components/CarbonChart/CarbonChartDonut.stories.tsx +170 -153
  35. package/src/components/CarbonChart/CarbonChartGauge.stories.tsx +50 -44
  36. package/src/components/CarbonChart/CarbonChartHistogram.stories.tsx +733 -724
  37. package/src/components/CarbonChart/CarbonChartLine.stories.tsx +1656 -1605
  38. package/src/components/CarbonChart/CarbonChartLollipop.stories.tsx +81 -76
  39. package/src/components/CarbonChart/CarbonChartMeter.stories.tsx +177 -162
  40. package/src/components/CarbonChart/CarbonChartPie.stories.tsx +154 -139
  41. package/src/components/CarbonChart/CarbonChartRadar.stories.tsx +445 -433
  42. package/src/components/CarbonChart/CarbonChartScatter.stories.tsx +427 -409
  43. package/src/components/CarbonChart/CarbonChartSparkline.stories.tsx +191 -188
  44. package/src/components/CarbonChart/CarbonChartStep.stories.tsx +145 -142
  45. package/src/components/LineChart/LineChart.stories.tsx +91 -104
package/src/components/CarbonChart/CarbonChartSparkline.stories.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
 
3
- import { Story, Meta } from '@storybook/react/types-6-0';
3
+ import { StoryFn, Meta } from '@storybook/react/types-6-0';
4
4
  import { Card } from 'react-magma-dom';
5
5
 
6
6
  import { CarbonChart, CarbonChartProps, CarbonChartType } from '.';
@@ -23,202 +23,205 @@ export default {
23
23
  },
24
24
  } as Meta;
25
25
 
26
- const Template: Story<CarbonChartProps> = args => (
26
+ const Template: StoryFn<CarbonChartProps> = args => (
27
27
  <Card isInverse={args.isInverse} style={{ padding: '12px' }}>
28
28
  <CarbonChart {...args} />
29
29
  </Card>
30
30
  );
31
31
 
32
- export const AreaSparkline = Template.bind({});
33
- AreaSparkline.args = {
34
- isInverse: false,
35
- type: CarbonChartType.area,
36
- dataSet: [
37
- {
38
- group: 'Dataset 1',
39
- date: '2019-05-21T19:21:00.000Z',
40
- value: 2,
41
- },
42
- {
43
- group: 'Dataset 1',
44
- date: '2019-05-21T19:22:00.000Z',
45
- value: 3,
46
- },
47
- {
48
- group: 'Dataset 1',
49
- date: '2019-05-21T19:23:00.000Z',
50
- value: 5,
51
- },
52
- {
53
- group: 'Dataset 1',
54
- date: '2019-05-21T19:24:00.000Z',
55
- value: 1,
56
- },
57
- {
58
- group: 'Dataset 1',
59
- date: '2019-05-21T19:25:00.000Z',
60
- value: 4,
61
- },
62
- {
63
- group: 'Dataset 1',
64
- date: '2019-05-21T19:26:00.000Z',
65
- value: 4,
66
- },
67
- {
68
- group: 'Dataset 1',
69
- date: '2019-05-21T19:27:00.000Z',
70
- value: 3,
71
- },
72
- {
73
- group: 'Dataset 1',
74
- date: '2019-05-21T19:28:00.000Z',
75
- value: 4,
76
- },
77
- {
78
- group: 'Dataset 1',
79
- date: '2019-05-21T19:29:00.000Z',
80
- value: 2,
81
- },
82
- {
83
- group: 'Dataset 1',
84
- date: '2019-05-21T19:30:00.000Z',
85
- value: 0,
86
- },
87
- {
88
- group: 'Dataset 1',
89
- date: '2019-05-21T19:31:00.000Z',
90
- value: 5,
91
- },
92
- {
93
- group: 'Dataset 1',
94
- date: '2019-05-21T19:32:00.000Z',
95
- value: 5,
96
- },
97
- {
98
- group: 'Dataset 1',
99
- date: '2019-05-21T19:33:00.000Z',
100
- value: 6,
101
- },
102
- {
103
- group: 'Dataset 1',
104
- date: '2019-05-21T19:34:00.000Z',
105
- value: 2,
106
- },
107
- {
108
- group: 'Dataset 1',
109
- date: '2019-05-21T19:35:00.000Z',
110
- value: 3,
111
- },
112
- {
113
- group: 'Dataset 1',
114
- date: '2019-05-21T19:36:00.000Z',
115
- value: 6,
116
- },
117
- {
118
- group: 'Dataset 1',
119
- date: '2019-05-21T19:38:00.000Z',
120
- value: 2,
121
- },
122
- {
123
- group: 'Dataset 1',
124
- date: '2019-05-21T19:39:00.000Z',
125
- value: 6,
126
- },
127
- {
128
- group: 'Dataset 1',
129
- date: '2019-05-21T19:40:00.000Z',
130
- value: 0,
131
- },
132
- {
133
- group: 'Dataset 1',
134
- date: '2019-05-21T19:41:00.000Z',
135
- value: 3,
136
- },
137
- {
138
- group: 'Dataset 1',
139
- date: '2019-05-21T19:42:00.000Z',
140
- value: 2,
141
- },
142
- {
143
- group: 'Dataset 1',
144
- date: '2019-05-21T19:43:00.000Z',
145
- value: 4,
146
- },
147
- {
148
- group: 'Dataset 1',
149
- date: '2019-05-21T19:44:00.000Z',
150
- value: 3,
151
- },
152
- {
153
- group: 'Dataset 1',
154
- date: '2019-05-21T19:45:00.000Z',
155
- value: 4,
156
- },
157
- {
158
- group: 'Dataset 1',
159
- date: '2019-05-21T19:46:00.000Z',
160
- value: 2,
161
- },
162
- {
163
- group: 'Dataset 1',
164
- date: '2019-05-21T19:47:00.000Z',
165
- value: 4,
166
- },
167
- {
168
- group: 'Dataset 1',
169
- date: '2019-05-21T19:48:00.000Z',
170
- value: 1,
171
- },
172
- {
173
- group: 'Dataset 1',
174
- date: '2019-05-21T19:49:00.000Z',
175
- value: 1,
176
- },
177
- {
178
- group: 'Dataset 1',
179
- date: '2019-05-21T19:50:00.000Z',
180
- value: 3,
181
- },
182
- {
183
- group: 'Dataset 1',
184
- date: '2019-05-21T19:51:00.000Z',
185
- value: 2,
186
- },
187
- ],
188
- options: {
189
- title: 'Sparkline',
190
- height: '400px',
191
- grid: {
192
- x: {
193
- enabled: false,
32
+ export const AreaSparkline = {
33
+ render: Template,
34
+
35
+ args: {
36
+ isInverse: false,
37
+ type: CarbonChartType.area,
38
+ dataSet: [
39
+ {
40
+ group: 'Dataset 1',
41
+ date: '2019-05-21T19:21:00.000Z',
42
+ value: 2,
194
43
  },
195
- y: {
196
- enabled: false,
44
+ {
45
+ group: 'Dataset 1',
46
+ date: '2019-05-21T19:22:00.000Z',
47
+ value: 3,
197
48
  },
198
- },
199
- axes: {
200
- bottom: {
201
- visible: false,
202
- title: '2019 Annual Sales Figures',
203
- mapsTo: 'date',
204
- scaleType: 'time',
205
- },
206
- left: {
207
- visible: false,
208
- mapsTo: 'value',
209
- scaleType: 'linear',
49
+ {
50
+ group: 'Dataset 1',
51
+ date: '2019-05-21T19:23:00.000Z',
52
+ value: 5,
210
53
  },
211
- },
212
- color: {
213
- gradient: {
214
- enabled: true,
54
+ {
55
+ group: 'Dataset 1',
56
+ date: '2019-05-21T19:24:00.000Z',
57
+ value: 1,
58
+ },
59
+ {
60
+ group: 'Dataset 1',
61
+ date: '2019-05-21T19:25:00.000Z',
62
+ value: 4,
63
+ },
64
+ {
65
+ group: 'Dataset 1',
66
+ date: '2019-05-21T19:26:00.000Z',
67
+ value: 4,
68
+ },
69
+ {
70
+ group: 'Dataset 1',
71
+ date: '2019-05-21T19:27:00.000Z',
72
+ value: 3,
73
+ },
74
+ {
75
+ group: 'Dataset 1',
76
+ date: '2019-05-21T19:28:00.000Z',
77
+ value: 4,
78
+ },
79
+ {
80
+ group: 'Dataset 1',
81
+ date: '2019-05-21T19:29:00.000Z',
82
+ value: 2,
83
+ },
84
+ {
85
+ group: 'Dataset 1',
86
+ date: '2019-05-21T19:30:00.000Z',
87
+ value: 0,
88
+ },
89
+ {
90
+ group: 'Dataset 1',
91
+ date: '2019-05-21T19:31:00.000Z',
92
+ value: 5,
93
+ },
94
+ {
95
+ group: 'Dataset 1',
96
+ date: '2019-05-21T19:32:00.000Z',
97
+ value: 5,
98
+ },
99
+ {
100
+ group: 'Dataset 1',
101
+ date: '2019-05-21T19:33:00.000Z',
102
+ value: 6,
103
+ },
104
+ {
105
+ group: 'Dataset 1',
106
+ date: '2019-05-21T19:34:00.000Z',
107
+ value: 2,
108
+ },
109
+ {
110
+ group: 'Dataset 1',
111
+ date: '2019-05-21T19:35:00.000Z',
112
+ value: 3,
113
+ },
114
+ {
115
+ group: 'Dataset 1',
116
+ date: '2019-05-21T19:36:00.000Z',
117
+ value: 6,
118
+ },
119
+ {
120
+ group: 'Dataset 1',
121
+ date: '2019-05-21T19:38:00.000Z',
122
+ value: 2,
123
+ },
124
+ {
125
+ group: 'Dataset 1',
126
+ date: '2019-05-21T19:39:00.000Z',
127
+ value: 6,
128
+ },
129
+ {
130
+ group: 'Dataset 1',
131
+ date: '2019-05-21T19:40:00.000Z',
132
+ value: 0,
133
+ },
134
+ {
135
+ group: 'Dataset 1',
136
+ date: '2019-05-21T19:41:00.000Z',
137
+ value: 3,
138
+ },
139
+ {
140
+ group: 'Dataset 1',
141
+ date: '2019-05-21T19:42:00.000Z',
142
+ value: 2,
143
+ },
144
+ {
145
+ group: 'Dataset 1',
146
+ date: '2019-05-21T19:43:00.000Z',
147
+ value: 4,
148
+ },
149
+ {
150
+ group: 'Dataset 1',
151
+ date: '2019-05-21T19:44:00.000Z',
152
+ value: 3,
153
+ },
154
+ {
155
+ group: 'Dataset 1',
156
+ date: '2019-05-21T19:45:00.000Z',
157
+ value: 4,
158
+ },
159
+ {
160
+ group: 'Dataset 1',
161
+ date: '2019-05-21T19:46:00.000Z',
162
+ value: 2,
163
+ },
164
+ {
165
+ group: 'Dataset 1',
166
+ date: '2019-05-21T19:47:00.000Z',
167
+ value: 4,
168
+ },
169
+ {
170
+ group: 'Dataset 1',
171
+ date: '2019-05-21T19:48:00.000Z',
172
+ value: 1,
173
+ },
174
+ {
175
+ group: 'Dataset 1',
176
+ date: '2019-05-21T19:49:00.000Z',
177
+ value: 1,
178
+ },
179
+ {
180
+ group: 'Dataset 1',
181
+ date: '2019-05-21T19:50:00.000Z',
182
+ value: 3,
183
+ },
184
+ {
185
+ group: 'Dataset 1',
186
+ date: '2019-05-21T19:51:00.000Z',
187
+ value: 2,
188
+ },
189
+ ],
190
+ options: {
191
+ title: 'Sparkline',
192
+ height: '400px',
193
+ grid: {
194
+ x: {
195
+ enabled: false,
196
+ },
197
+ y: {
198
+ enabled: false,
199
+ },
200
+ },
201
+ axes: {
202
+ bottom: {
203
+ visible: false,
204
+ title: '2019 Annual Sales Figures',
205
+ mapsTo: 'date',
206
+ scaleType: 'time',
207
+ },
208
+ left: {
209
+ visible: false,
210
+ mapsTo: 'value',
211
+ scaleType: 'linear',
212
+ },
213
+ },
214
+ color: {
215
+ gradient: {
216
+ enabled: true,
217
+ },
218
+ },
219
+ points: {
220
+ enabled: false,
221
+ },
222
+ legend: {
223
+ enabled: false,
215
224
  },
216
- },
217
- points: {
218
- enabled: false,
219
- },
220
- legend: {
221
- enabled: false,
222
225
  },
223
226
  },
224
227
  };