@auth0/quantum-charts 1.1.4 → 1.2.1

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 (10) hide show
  1. package/README.md +1 -1
  2. package/chart-card/index.js +2 -2
  3. package/chart-summary/index.d.ts +2 -1
  4. package/chart-summary/index.js +4 -4
  5. package/esm/chart-card/index.js +2 -2
  6. package/esm/chart-summary/index.js +4 -4
  7. package/esm/line-chart/index.js +10 -10
  8. package/line-chart/index.d.ts +4 -0
  9. package/line-chart/index.js +10 -10
  10. package/package.json +2 -2
package/README.md CHANGED
@@ -6,4 +6,4 @@ yarn add @auth0/quantum-charts
6
6
  ```
7
7
 
8
8
  ## Usage
9
- Detailed docs and example usage can be found [here](https://quantum.okta.design/?path=/story/quantum-charts-intro--page).
9
+ Detailed docs and example usage can be found [here](https://quantum.okta.design/?path=/story/quantum-charts-intro--docs).
package/chart-card/index.js CHANGED
@@ -28,9 +28,9 @@ var quantum_product_1 = require("@auth0/quantum-product");
28
28
  var React = __importStar(require("react"));
29
29
  var chart_summary_1 = require("../chart-summary");
30
30
  function ChartCard(props) {
31
- var children = props.children, title = props.title, value = props.value, dataTable = props.dataTable, helperText = props.helperText, label = props.label, height = props.height, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable;
31
+ var children = props.children, title = props.title, value = props.value, dataTable = props.dataTable, helperText = props.helperText, label = props.label, height = props.height, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, triggerButtonSize = props.triggerButtonSize;
32
32
  return (React.createElement(quantum_product_1.Card, { sx: { height: height, padding: 3 } },
33
- React.createElement(chart_summary_1.ChartSummary, { title: title, value: value, dataTable: dataTable, helperText: helperText, label: label, headerAction: headerAction, showChartTable: showChartTable, allowDownload: allowDownload, additionalMenuItems: additionalMenuItems, customViewChartTable: customViewChartTable }),
33
+ React.createElement(chart_summary_1.ChartSummary, { title: title, value: value, dataTable: dataTable, helperText: helperText, label: label, headerAction: headerAction, showChartTable: showChartTable, allowDownload: allowDownload, additionalMenuItems: additionalMenuItems, customViewChartTable: customViewChartTable, triggerButtonSize: triggerButtonSize }),
34
34
  children));
35
35
  }
36
36
  exports.ChartCard = ChartCard;
package/chart-summary/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { DropdownMenuListItemValue } from '@auth0/quantum-product';
2
+ import { DropdownMenuListItemValue, IIconButtonProps } from '@auth0/quantum-product';
3
3
  export interface IChartSummaryProps {
4
4
  title?: string;
5
5
  value?: string | number;
@@ -12,5 +12,6 @@ export interface IChartSummaryProps {
12
12
  showChartTable?: boolean;
13
13
  allowDownload?: boolean;
14
14
  customViewChartTable?: React.ReactElement;
15
+ triggerButtonSize?: IIconButtonProps['size'];
15
16
  }
16
17
  export declare function ChartSummary(props: IChartSummaryProps): React.JSX.Element;
package/chart-summary/index.js CHANGED
@@ -76,9 +76,9 @@ var Aggregate = (0, quantum_product_1.styled)('h4')(templateObject_1 || (templat
76
76
  return theme.typography.h4.fontSize;
77
77
  });
78
78
  function ChartSummary(props) {
79
- var title = props.title, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable;
80
- var _a = __read(React.useState(false), 2), isOpen = _a[0], setIsOpen = _a[1];
81
- var _b = (0, quantum_product_1.useDropdownMenuState)({ baseId: 'chart-actions-menu' }), triggerProps = _b.triggerProps, menuProps = _b.menuProps;
79
+ var title = props.title, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, _a = props.triggerButtonSize, triggerButtonSize = _a === void 0 ? 'small' : _a;
80
+ var _b = __read(React.useState(false), 2), isOpen = _b[0], setIsOpen = _b[1];
81
+ var _c = (0, quantum_product_1.useDropdownMenuState)({ baseId: 'chart-actions-menu' }), triggerProps = _c.triggerProps, menuProps = _c.menuProps;
82
82
  var toggleIsOpen = function () {
83
83
  setIsOpen(function (prev) { return !prev; });
84
84
  };
@@ -142,7 +142,7 @@ function ChartSummary(props) {
142
142
  React.createElement(quantum_product_1.StackLayout, { gutter: 1 },
143
143
  headerAction && (React.createElement(quantum_product_1.StackLayoutItem, { sx: { justifyContent: 'flex-end', display: 'flex', width: '100', flex: 1 } }, headerAction)),
144
144
  menuItems.length > 0 && showChartTable && (React.createElement(React.Fragment, null,
145
- React.createElement(quantum_product_1.IconButton, __assign({ size: "small" }, triggerProps, { label: "More actions" }),
145
+ React.createElement(quantum_product_1.IconButton, __assign({ size: triggerButtonSize }, triggerProps, { label: "More actions" }),
146
146
  React.createElement(quantum_product_1.MoreVerticalIcon, null)),
147
147
  React.createElement(quantum_product_1.DropdownMenu, __assign({}, menuProps, { items: menuItems })))))), labelTypographyProps: { variant: 'subtitle1' }, description: React.createElement(quantum_product_1.StackLayout, { gutter: 1 },
148
148
  React.createElement(Aggregate, null, value),
package/esm/chart-card/index.js CHANGED
@@ -2,8 +2,8 @@ import { Card } from '@auth0/quantum-product';
2
2
  import * as React from 'react';
3
3
  import { ChartSummary } from '../chart-summary';
4
4
  export function ChartCard(props) {
5
- var children = props.children, title = props.title, value = props.value, dataTable = props.dataTable, helperText = props.helperText, label = props.label, height = props.height, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable;
5
+ var children = props.children, title = props.title, value = props.value, dataTable = props.dataTable, helperText = props.helperText, label = props.label, height = props.height, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, triggerButtonSize = props.triggerButtonSize;
6
6
  return (React.createElement(Card, { sx: { height: height, padding: 3 } },
7
- React.createElement(ChartSummary, { title: title, value: value, dataTable: dataTable, helperText: helperText, label: label, headerAction: headerAction, showChartTable: showChartTable, allowDownload: allowDownload, additionalMenuItems: additionalMenuItems, customViewChartTable: customViewChartTable }),
7
+ React.createElement(ChartSummary, { title: title, value: value, dataTable: dataTable, helperText: helperText, label: label, headerAction: headerAction, showChartTable: showChartTable, allowDownload: allowDownload, additionalMenuItems: additionalMenuItems, customViewChartTable: customViewChartTable, triggerButtonSize: triggerButtonSize }),
8
8
  children));
9
9
  }
package/esm/chart-summary/index.js CHANGED
@@ -50,9 +50,9 @@ var Aggregate = styled('h4')(templateObject_1 || (templateObject_1 = __makeTempl
50
50
  return theme.typography.h4.fontSize;
51
51
  });
52
52
  export function ChartSummary(props) {
53
- var title = props.title, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable;
54
- var _a = __read(React.useState(false), 2), isOpen = _a[0], setIsOpen = _a[1];
55
- var _b = useDropdownMenuState({ baseId: 'chart-actions-menu' }), triggerProps = _b.triggerProps, menuProps = _b.menuProps;
53
+ var title = props.title, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, _a = props.triggerButtonSize, triggerButtonSize = _a === void 0 ? 'small' : _a;
54
+ var _b = __read(React.useState(false), 2), isOpen = _b[0], setIsOpen = _b[1];
55
+ var _c = useDropdownMenuState({ baseId: 'chart-actions-menu' }), triggerProps = _c.triggerProps, menuProps = _c.menuProps;
56
56
  var toggleIsOpen = function () {
57
57
  setIsOpen(function (prev) { return !prev; });
58
58
  };
@@ -116,7 +116,7 @@ export function ChartSummary(props) {
116
116
  React.createElement(StackLayout, { gutter: 1 },
117
117
  headerAction && (React.createElement(StackLayoutItem, { sx: { justifyContent: 'flex-end', display: 'flex', width: '100', flex: 1 } }, headerAction)),
118
118
  menuItems.length > 0 && showChartTable && (React.createElement(React.Fragment, null,
119
- React.createElement(IconButton, __assign({ size: "small" }, triggerProps, { label: "More actions" }),
119
+ React.createElement(IconButton, __assign({ size: triggerButtonSize }, triggerProps, { label: "More actions" }),
120
120
  React.createElement(MoreVerticalIcon, null)),
121
121
  React.createElement(DropdownMenu, __assign({}, menuProps, { items: menuItems })))))), labelTypographyProps: { variant: 'subtitle1' }, description: React.createElement(StackLayout, { gutter: 1 },
122
122
  React.createElement(Aggregate, null, value),
package/esm/line-chart/index.js CHANGED
@@ -40,18 +40,18 @@ var getThresholdColor = function (data, baseColor) {
40
40
  return data.hover === 'thresholdControl' || !data.hover ? baseColor : alpha(baseColor, 0.35);
41
41
  };
42
42
  export function LineChart(props) {
43
- var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f;
43
+ var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f, _g = _a.showChartTableButtonInHeader, showChartTableButtonInHeader = _g === void 0 ? true : _g, _h = _a.showDividerInHeader, showDividerInHeader = _h === void 0 ? true : _h, _j = _a.headerButtonsSize, headerButtonsSize = _j === void 0 ? 'medium' : _j;
44
44
  var theme = useTheme();
45
- var _g = useDropdownMenuState({ baseId: 'threshold-menu' }), triggerProps = _g.triggerProps, menuProps = _g.menuProps;
45
+ var _k = useDropdownMenuState({ baseId: 'threshold-menu' }), triggerProps = _k.triggerProps, menuProps = _k.menuProps;
46
46
  // Function to know how many lines we need based of how much different group values are.
47
47
  var groups = _.uniqBy(data, 'group').map(function (item) { return item.group; });
48
48
  var initialState = __assign({ hover: null }, groups.reduce(function (acc, group) {
49
49
  var _a;
50
50
  return (__assign(__assign({}, acc), (_a = {}, _a[group] = false, _a)));
51
51
  }, {}));
52
- var _h = __read(React.useState(initialState), 2), lineVisibility = _h[0], setLineVisibility = _h[1];
53
- var _j = __read(React.useState(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]), 2), threshold = _j[0], setThreshold = _j[1];
54
- var _k = __read(React.useState(false), 2), isOpen = _k[0], setIsOpen = _k[1];
52
+ var _l = __read(React.useState(initialState), 2), lineVisibility = _l[0], setLineVisibility = _l[1];
53
+ var _m = __read(React.useState(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]), 2), threshold = _m[0], setThreshold = _m[1];
54
+ var _o = __read(React.useState(false), 2), isOpen = _o[0], setIsOpen = _o[1];
55
55
  React.useEffect(function () {
56
56
  setThreshold(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]);
57
57
  }, [thresholds]);
@@ -136,16 +136,16 @@ export function LineChart(props) {
136
136
  }, [thresholds, menuProps]);
137
137
  var headerActionWithThresholdDropdown = (React.createElement(StackLayout, { gutter: 1 },
138
138
  !disableThresholdMenu && (React.createElement(React.Fragment, null,
139
- React.createElement(Button, __assign({}, triggerProps, { startIcon: React.createElement(AlertDiamondIcon, null), endIcon: React.createElement(ChevronDownIcon, null), disabled: !threshold, variant: 'outlined', label: threshold ? threshold.threshold_label : 'No threshold' })),
139
+ React.createElement(Button, __assign({}, triggerProps, { startIcon: React.createElement(AlertDiamondIcon, null), endIcon: React.createElement(ChevronDownIcon, null), disabled: !threshold, variant: 'outlined', size: headerButtonsSize, label: threshold ? threshold.threshold_label : 'No threshold' })),
140
140
  React.createElement(DropdownMenu, __assign({}, menuProps, { items: menuItems })),
141
- React.createElement(Divider, { orientation: "vertical" }))),
141
+ showDividerInHeader && React.createElement(Divider, { orientation: "vertical" }))),
142
142
  headerAction,
143
- React.createElement(IconButton, { size: "small", label: "View table", onClick: function () {
143
+ showChartTableButtonInHeader && (React.createElement(IconButton, { size: headerButtonsSize, label: "View table", onClick: function () {
144
144
  setIsOpen(true);
145
145
  } },
146
- React.createElement(TableIcon, null))));
146
+ React.createElement(TableIcon, null)))));
147
147
  return (React.createElement(React.Fragment, null,
148
- React.createElement(ChartCard, { title: title, value: value, dataTable: data, label: label, helperText: helperText, headerAction: (groups === null || groups === void 0 ? void 0 : groups.length) > 1 ? headerActionWithThresholdDropdown : headerAction, additionalMenuItems: additionalMenuItems, allowDownload: allowDownload, showChartTable: showChartTable },
148
+ React.createElement(ChartCard, { title: title, value: value, dataTable: data, label: label, helperText: helperText, headerAction: (groups === null || groups === void 0 ? void 0 : groups.length) > 1 ? headerActionWithThresholdDropdown : headerAction, additionalMenuItems: additionalMenuItems, allowDownload: allowDownload, showChartTable: showChartTable, triggerButtonSize: headerButtonsSize },
149
149
  React.createElement(ResponsiveContainer, { width: '100%', height: height }, data.length ? (React.createElement(ComposedChart, { data: Object.values(entries), height: height, width: 500, syncId: syncId, margin: {
150
150
  top: 24,
151
151
  right: 10,
package/line-chart/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as React from 'react';
2
+ import { IIconButtonProps } from '@auth0/quantum-product';
2
3
  import { IBaseChartProps } from '../common/chart';
3
4
  export interface ILineChartProps<DataType = unknown> extends IBaseChartProps<DataType> {
4
5
  syncId?: number | string;
@@ -7,5 +8,8 @@ export interface ILineChartProps<DataType = unknown> extends IBaseChartProps<Dat
7
8
  disableThresholdMenu?: boolean;
8
9
  allowDownload?: boolean;
9
10
  showChartTable?: boolean;
11
+ showChartTableButtonInHeader?: boolean;
12
+ showDividerInHeader?: boolean;
13
+ headerButtonsSize?: IIconButtonProps['size'];
10
14
  }
11
15
  export declare function LineChart<DataType = unknown>(props: ILineChartProps<DataType>): React.JSX.Element;
package/line-chart/index.js CHANGED
@@ -69,18 +69,18 @@ var getThresholdColor = function (data, baseColor) {
69
69
  return data.hover === 'thresholdControl' || !data.hover ? baseColor : (0, quantum_product_1.alpha)(baseColor, 0.35);
70
70
  };
71
71
  function LineChart(props) {
72
- var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f;
72
+ var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f, _g = _a.showChartTableButtonInHeader, showChartTableButtonInHeader = _g === void 0 ? true : _g, _h = _a.showDividerInHeader, showDividerInHeader = _h === void 0 ? true : _h, _j = _a.headerButtonsSize, headerButtonsSize = _j === void 0 ? 'medium' : _j;
73
73
  var theme = (0, quantum_product_1.useTheme)();
74
- var _g = (0, quantum_product_1.useDropdownMenuState)({ baseId: 'threshold-menu' }), triggerProps = _g.triggerProps, menuProps = _g.menuProps;
74
+ var _k = (0, quantum_product_1.useDropdownMenuState)({ baseId: 'threshold-menu' }), triggerProps = _k.triggerProps, menuProps = _k.menuProps;
75
75
  // Function to know how many lines we need based of how much different group values are.
76
76
  var groups = lodash_1.default.uniqBy(data, 'group').map(function (item) { return item.group; });
77
77
  var initialState = __assign({ hover: null }, groups.reduce(function (acc, group) {
78
78
  var _a;
79
79
  return (__assign(__assign({}, acc), (_a = {}, _a[group] = false, _a)));
80
80
  }, {}));
81
- var _h = __read(React.useState(initialState), 2), lineVisibility = _h[0], setLineVisibility = _h[1];
82
- var _j = __read(React.useState(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]), 2), threshold = _j[0], setThreshold = _j[1];
83
- var _k = __read(React.useState(false), 2), isOpen = _k[0], setIsOpen = _k[1];
81
+ var _l = __read(React.useState(initialState), 2), lineVisibility = _l[0], setLineVisibility = _l[1];
82
+ var _m = __read(React.useState(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]), 2), threshold = _m[0], setThreshold = _m[1];
83
+ var _o = __read(React.useState(false), 2), isOpen = _o[0], setIsOpen = _o[1];
84
84
  React.useEffect(function () {
85
85
  setThreshold(thresholds === null || thresholds === void 0 ? void 0 : thresholds[0]);
86
86
  }, [thresholds]);
@@ -165,16 +165,16 @@ function LineChart(props) {
165
165
  }, [thresholds, menuProps]);
166
166
  var headerActionWithThresholdDropdown = (React.createElement(quantum_product_1.StackLayout, { gutter: 1 },
167
167
  !disableThresholdMenu && (React.createElement(React.Fragment, null,
168
- React.createElement(quantum_product_1.Button, __assign({}, triggerProps, { startIcon: React.createElement(quantum_product_1.AlertDiamondIcon, null), endIcon: React.createElement(quantum_product_1.ChevronDownIcon, null), disabled: !threshold, variant: 'outlined', label: threshold ? threshold.threshold_label : 'No threshold' })),
168
+ React.createElement(quantum_product_1.Button, __assign({}, triggerProps, { startIcon: React.createElement(quantum_product_1.AlertDiamondIcon, null), endIcon: React.createElement(quantum_product_1.ChevronDownIcon, null), disabled: !threshold, variant: 'outlined', size: headerButtonsSize, label: threshold ? threshold.threshold_label : 'No threshold' })),
169
169
  React.createElement(quantum_product_1.DropdownMenu, __assign({}, menuProps, { items: menuItems })),
170
- React.createElement(quantum_product_1.Divider, { orientation: "vertical" }))),
170
+ showDividerInHeader && React.createElement(quantum_product_1.Divider, { orientation: "vertical" }))),
171
171
  headerAction,
172
- React.createElement(quantum_product_1.IconButton, { size: "small", label: "View table", onClick: function () {
172
+ showChartTableButtonInHeader && (React.createElement(quantum_product_1.IconButton, { size: headerButtonsSize, label: "View table", onClick: function () {
173
173
  setIsOpen(true);
174
174
  } },
175
- React.createElement(quantum_product_1.TableIcon, null))));
175
+ React.createElement(quantum_product_1.TableIcon, null)))));
176
176
  return (React.createElement(React.Fragment, null,
177
- React.createElement(chart_card_1.ChartCard, { title: title, value: value, dataTable: data, label: label, helperText: helperText, headerAction: (groups === null || groups === void 0 ? void 0 : groups.length) > 1 ? headerActionWithThresholdDropdown : headerAction, additionalMenuItems: additionalMenuItems, allowDownload: allowDownload, showChartTable: showChartTable },
177
+ React.createElement(chart_card_1.ChartCard, { title: title, value: value, dataTable: data, label: label, helperText: helperText, headerAction: (groups === null || groups === void 0 ? void 0 : groups.length) > 1 ? headerActionWithThresholdDropdown : headerAction, additionalMenuItems: additionalMenuItems, allowDownload: allowDownload, showChartTable: showChartTable, triggerButtonSize: headerButtonsSize },
178
178
  React.createElement(recharts_1.ResponsiveContainer, { width: '100%', height: height }, data.length ? (React.createElement(recharts_1.ComposedChart, { data: Object.values(entries), height: height, width: 500, syncId: syncId, margin: {
179
179
  top: 24,
180
180
  right: 10,
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@auth0/quantum-charts",
3
- "version": "1.1.4",
3
+ "version": "1.2.1",
4
4
  "sideEffects": false,
5
5
  "main": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "license": "Apache-2.0",
8
8
  "author": "Okta, Inc.",
9
- "homepage": "https://main--62de9cdffb68e8a4ec657572.chromatic.com/?path=/story/quantum-charts-intro--page",
9
+ "homepage": "https://main--66a3d5d9a790a4817694c153.chromatic.com/?path=/story/quantum-charts-intro--docs",
10
10
  "repository": {
11
11
  "type": "git",
12
12
  "url": "https://github.com/auth0/quantum-product.git",