@alfalab/core-components 36.4.0 → 36.5.0

package/chart/components/Dot/index.js

@@ -2,10 +2,15 @@ var React = require('react');
 var cn = require('classnames');
 var icons_Point = require('../../icons/Point.js');
 
-var styles = {"dotUnfocused":"chart__dotUnfocused_1iy1i","dot":"chart__dot_1iy1i","dotItem":"chart__dotItem_1iy1i","dotWrap":"chart__dotWrap_1iy1i","showDot":"chart__showDot_1iy1i"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"dotUnfocused":"chart__dotUnfocused_1u9no","dot":"chart__dot_1u9no","dotItem":"chart__dotItem_1u9no","dotWrap":"chart__dotWrap_1u9no","showDot":"chart__showDot_1u9no"};
 require('./index.css');
 
-var Dot = React.forwardRef(function (_a, ref) {
+var Dot = React__default.default.forwardRef(function (_a, ref) {
     var cx = _a.cx, cy = _a.cy, index = _a.index, activeDot = _a.activeDot, dataKey = _a.dataKey, dotSettings = _a.dotSettings, value = _a.value, stroke = _a.stroke;
     var _b = React.useState(0), windowWidth = _b[0], setWindowWidth = _b[1];
     var _c = React.useState(0), height = _c[0], setHeight = _c[1];
@@ -35,12 +40,12 @@ var Dot = React.forwardRef(function (_a, ref) {
     }, [activeDot, index, option]);
     if (!value)
         return null;
-    return (React.createElement("g", { ref: ref, className: cn(styles.dot), transform: "translate(".concat(cx - width / 2, ", ").concat(cy - height / 2, ")") },
-        React.createElement("g", { className: cn(styles.dotWrap), transform: "scale(".concat(activeDot === index ? (option === null || option === void 0 ? void 0 : option.scale) || 0 : (option === null || option === void 0 ? void 0 : option.initScale) || 0, ")") },
-            React.createElement("svg", { className: cn(styles.dotItem, activeDot === index ? styles.dotActive : '', typeof activeDot === 'number' && activeDot !== index
+    return (React__default.default.createElement("g", { ref: ref, className: cn__default.default(styles.dot), transform: "translate(".concat(cx - width / 2, ", ").concat(cy - height / 2, ")") },
+        React__default.default.createElement("g", { className: cn__default.default(styles.dotWrap), transform: "scale(".concat(activeDot === index ? (option === null || option === void 0 ? void 0 : option.scale) || 0 : (option === null || option === void 0 ? void 0 : option.initScale) || 0, ")") },
+            React__default.default.createElement("svg", { className: cn__default.default(styles.dotItem, activeDot === index ? styles.dotActive : '', typeof activeDot === 'number' && activeDot !== index
                     ? styles.dotUnfocused
                     : ''), "data-id": index, "data-name": dataKey, width: (option === null || option === void 0 ? void 0 : option.width) || 0, height: (option === null || option === void 0 ? void 0 : option.height) || 0 },
-                React.createElement(icons_Point.PointIcon, { fill: stroke })))));
+                React__default.default.createElement(icons_Point.PointIcon, { fill: stroke })))));
 });
 
 exports.Dot = Dot;

package/chart/components/Legends/index.css

@@ -10,31 +10,31 @@
 :root {
     --gap-2xl: 32px;
 }
-.chart__legendContent_j4ha9 {
+.chart__legendContent_nx6sz {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }
-.chart__legendWrap_j4ha9 {
+.chart__legendWrap_nx6sz {
     width: 100%;
     margin: 0;
     padding: 0;
 }
-.chart__legendItem_j4ha9 {
+.chart__legendItem_nx6sz {
     margin-right: var(--gap-2xl);
     cursor: pointer;
     display: inline-block;
 }
-.chart__legendItem_j4ha9:last-child {
+.chart__legendItem_nx6sz:last-child {
     margin-right: 0;
 }
-.chart__legendUnactive_j4ha9 {
+.chart__legendUnactive_nx6sz {
     opacity: 0.3;
 }
-.chart__legendIcon_j4ha9 {
+.chart__legendIcon_nx6sz {
     margin-right: 13px;
     display: flex;
 }
-.chart__legendValue_j4ha9 {
+.chart__legendValue_nx6sz {
     text-transform: capitalize;
 }

package/chart/components/Legends/index.js

@@ -6,7 +6,12 @@ var icons_CircleLine = require('../../icons/CircleLine.js');
 var icons_FilledCircle = require('../../icons/FilledCircle.js');
 var icons_StrokeCircle = require('../../icons/StrokeCircle.js');
 
-var styles = {"legendContent":"chart__legendContent_j4ha9","legendWrap":"chart__legendWrap_j4ha9","legendItem":"chart__legendItem_j4ha9","legendUnactive":"chart__legendUnactive_j4ha9","legendIcon":"chart__legendIcon_j4ha9","legendValue":"chart__legendValue_j4ha9"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"legendContent":"chart__legendContent_nx6sz","legendWrap":"chart__legendWrap_nx6sz","legendItem":"chart__legendItem_nx6sz","legendUnactive":"chart__legendUnactive_nx6sz","legendIcon":"chart__legendIcon_nx6sz","legendValue":"chart__legendValue_nx6sz"};
 require('./index.css');
 
 var icons = {
@@ -15,25 +20,25 @@ var icons = {
     strokeCircle: icons_StrokeCircle.StrokeCircleIcon,
     circle: icons_Circle.CircleIcon,
 };
-var Legends = React.forwardRef(function (_a, ref) {
+var Legends = React__default.default.forwardRef(function (_a, ref) {
     var legend = _a.legend, series = _a.series, id = _a.id, charts = _a.charts, toggleChart = _a.toggleChart;
     var style = {
         textAlign: legend.align || 'center',
         transform: "translateY(".concat(((legend === null || legend === void 0 ? void 0 : legend.marginTop) ? legend.marginTop : 0) *
             (legend.verticalAlign === 'top' ? -1 : 1), "px)"),
     };
-    return (React.createElement("ul", { ref: ref, className: cn(styles.legendWrap), style: style }, series.map(function (item) {
+    return (React__default.default.createElement("ul", { ref: ref, className: cn__default.default(styles.legendWrap), style: style }, series.map(function (item) {
         var _a, _b;
         if (item.hideLegend || item.hide)
             return null;
         var Icon = icons[item.icon] || icons_Circle.CircleIcon;
-        return (React.createElement("li", { role: 'presentation', key: "".concat(id, "-").concat(item.properties.dataKey), className: cn(styles.legendItem, charts["".concat(item.properties.dataKey)] ? '' : styles.legendUnactive), onClick: function () { return toggleChart(item); } },
-            React.createElement("div", { className: cn(styles.legendContent) },
-                Icon ? (React.createElement("i", { className: cn(styles.legendIcon) },
-                    React.createElement(Icon, { fill: ((_a = item.properties) === null || _a === void 0 ? void 0 : _a.fill) ||
+        return (React__default.default.createElement("li", { role: 'presentation', key: "".concat(id, "-").concat(item.properties.dataKey), className: cn__default.default(styles.legendItem, charts["".concat(item.properties.dataKey)] ? '' : styles.legendUnactive), onClick: function () { return toggleChart(item); } },
+            React__default.default.createElement("div", { className: cn__default.default(styles.legendContent) },
+                Icon ? (React__default.default.createElement("i", { className: cn__default.default(styles.legendIcon) },
+                    React__default.default.createElement(Icon, { fill: ((_a = item.properties) === null || _a === void 0 ? void 0 : _a.fill) ||
                             ((_b = item.properties) === null || _b === void 0 ? void 0 : _b.stroke) ||
                             '', height: legend.iconHeight || 16 }))) : null,
-                React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', className: cn(styles.legendValue) }, item.properties.name))));
+                React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', className: cn__default.default(styles.legendValue) }, item.properties.name))));
     })));
 });
 

package/chart/components/LinearGradient.js

@@ -1,8 +1,12 @@
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 var LinearGradient = function (_a) {
     var id = _a.id, gid = _a.gid, points = _a.points;
-    return (React.createElement("linearGradient", { key: "".concat(id, "-").concat(gid), id: "".concat(id, "-").concat(gid), x1: '0', y1: '0', x2: '0', y2: '1' }, points.map(function (point, index) { return (React.createElement("stop", { key: "".concat(id).concat(gid, "-").concat(index.toString()), offset: "".concat(point.offset, "%"), stopColor: point.stopColor, stopOpacity: point.stopOpacity })); })));
+    return (React__default.default.createElement("linearGradient", { key: "".concat(id, "-").concat(gid), id: "".concat(id, "-").concat(gid), x1: '0', y1: '0', x2: '0', y2: '1' }, points.map(function (point, index) { return (React__default.default.createElement("stop", { key: "".concat(id).concat(gid, "-").concat(index.toString()), offset: "".concat(point.offset, "%"), stopColor: point.stopColor, stopOpacity: point.stopOpacity })); })));
 };
 
 exports.LinearGradient = LinearGradient;

package/chart/components/RectBar.js

@@ -2,6 +2,10 @@ var React = require('react');
 var hooks_usePathBar_index = require('../hooks/usePathBar/index.js');
 require('../hooks/usePathBar/utils/getRadius.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 // eslint-disable-next-line complexity
 var getPath = function (x, width, height, initHeight, topRadius, bottomRadius, initY) {
     return "\n        M".concat(x + ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight || 0, "\n        Q").concat(x, " ").concat(initY + initHeight, " ").concat(x, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n        L").concat(x, " ").concat(initY + ((height !== 0 && topRadius) || 0), "\n        Q").concat(x, " ").concat(initY, " ").concat(x + ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n        L").concat(x + width - ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n        Q").concat(x + width, " ").concat(initY, " ").concat(x + width, " ").concat(initY + (topRadius || 0), "\n        L").concat(x + width, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n        Q").concat(x + width, " ").concat(initY + initHeight, " ").concat(x + width - ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight, "\n        Z\n    ");
@@ -14,7 +18,7 @@ var RectBar = function (_a) {
         background: background,
         y: y,
     }), initHeight = _b[0], topRadius = _b[1], bottomRadius = _b[2], initY = _b[3];
-    return React.useMemo(function () { return (React.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })); }, [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
+    return React.useMemo(function () { return (React__default.default.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })); }, [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
 };
 
 exports.RectBar = RectBar;

package/chart/components/Tick/index.css

@@ -11,17 +11,17 @@
 
     /* Hard up */
 }
-.chart__tickText_t7j25 {
+.chart__tickText_13q5p {
     fill: var(--color-light-text-primary);
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
 }
-.chart__circle_t7j25 {
+.chart__circle_13q5p {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }
-.chart__circle_t7j25 {
+.chart__circle_13q5p {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }

package/chart/components/Tick/index.js

@@ -1,7 +1,12 @@
 var React = require('react');
 var cn = require('classnames');
 
-var styles = {"tickText":"chart__tickText_t7j25","circle":"chart__circle_t7j25"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"tickText":"chart__tickText_13q5p","circle":"chart__circle_13q5p"};
 require('./index.css');
 
 var Tick = function (_a) {
@@ -11,9 +16,9 @@ var Tick = function (_a) {
         (xAxis.tickMargin > 0 ? xAxis.tickMargin - radius / 2 : xAxis.tickMargin === 0)
         ? (radius / 2) * -1
         : null;
-    return (React.createElement("g", { className: cn(styles.tick), opacity: '1', textAnchor: 'middle', transform: "translate(".concat(payload.coordinate, ", ").concat(y - (typeof marginTick === 'number' ? marginTick : 0) - radius * 2, ")") },
-        React.createElement("text", { className: cn(styles.tickText), y: '30' }, tickFormatter ? tickFormatter(payload.value) : payload.value),
-        React.createElement("circle", { r: radius, className: cn(styles.circle) })));
+    return (React__default.default.createElement("g", { className: cn__default.default(styles.tick), opacity: '1', textAnchor: 'middle', transform: "translate(".concat(payload.coordinate, ", ").concat(y - (typeof marginTick === 'number' ? marginTick : 0) - radius * 2, ")") },
+        React__default.default.createElement("text", { className: cn__default.default(styles.tickText), y: '30' }, tickFormatter ? tickFormatter(payload.value) : payload.value),
+        React__default.default.createElement("circle", { r: radius, className: cn__default.default(styles.circle) })));
 };
 
 exports.Tick = Tick;

package/chart/components/TooltipContent/index.css

@@ -19,7 +19,7 @@
 :root {
     --border-radius-m: 8px;
 }
-.chart__tooltip_qi4uc {
+.chart__tooltip_4pmy3 {
     background-color: var(--color-light-bg-primary);
     border: 1px solid var(--color-light-border-primary);
     box-shadow: var(--shadow-l);
@@ -28,17 +28,17 @@
     pointer-events: none;
     position: relative;
 }
-.chart__tooltipList_qi4uc {
+.chart__tooltipList_4pmy3 {
     position: relative;
     z-index: 5;
     list-style-type: none;
     padding: 0;
     margin: 0;
 }
-.chart__tooltipItem_qi4uc {
+.chart__tooltipItem_4pmy3 {
     margin-bottom: 10px;
 }
-.chart__tooltipArrow_qi4uc {
+.chart__tooltipArrow_4pmy3 {
     position: absolute;
     left: 0;
     top: 50%;
@@ -48,7 +48,7 @@
     border: 1px solid var(--color-light-border-primary);
     background-color: var(--color-light-bg-primary);
 }
-.chart__tooltipArrow_qi4uc:before {
+.chart__tooltipArrow_4pmy3:before {
     content: '';
     position: absolute;
     left: -2px;
@@ -59,7 +59,7 @@
     border-width: 0 24px 24px 0;
     border-color: transparent var(--color-light-bg-primary) transparent transparent;
 }
-.chart__tooltipArrowRight_qi4uc {
+.chart__tooltipArrowRight_4pmy3 {
     left: 100%;
     transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
 }

package/chart/components/TooltipContent/index.js

@@ -2,27 +2,32 @@ var React = require('react');
 var cn = require('classnames');
 var coreComponentsTypography = require('../../../typography');
 
-var styles = {"tooltip":"chart__tooltip_qi4uc","tooltipList":"chart__tooltipList_qi4uc","tooltipItem":"chart__tooltipItem_qi4uc","tooltipArrow":"chart__tooltipArrow_qi4uc","tooltipArrowRight":"chart__tooltipArrowRight_qi4uc"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"tooltip":"chart__tooltip_4pmy3","tooltipList":"chart__tooltipList_4pmy3","tooltipItem":"chart__tooltipItem_4pmy3","tooltipArrow":"chart__tooltipArrow_4pmy3","tooltipArrowRight":"chart__tooltipArrowRight_4pmy3"};
 require('./index.css');
 
 var TooltipContent = function (_a) {
     var payload = _a.payload, separator = _a.separator, label = _a.label, tooltipArrowSide = _a.tooltipArrowSide, arrow = _a.arrow, series = _a.series, labelFormatter = _a.labelFormatter, labelStyle = _a.labelStyle;
     if (!label || payload.length === 0)
         return null;
-    return (React.createElement("div", { className: cn(styles.tooltip) },
-        arrow && (React.createElement("span", { className: cn(styles.tooltipArrow, tooltipArrowSide ? '' : styles.tooltipArrowRight) })),
-        React.createElement("ul", { className: cn(styles.tooltipList) },
-            React.createElement("li", { className: cn(styles.tooltipItem), style: labelStyle },
-                React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn(styles.tooltipLabel) }, labelFormatter ? labelFormatter(label) : label)),
+    return (React__default.default.createElement("div", { className: cn__default.default(styles.tooltip) },
+        arrow && (React__default.default.createElement("span", { className: cn__default.default(styles.tooltipArrow, tooltipArrowSide ? '' : styles.tooltipArrowRight) })),
+        React__default.default.createElement("ul", { className: cn__default.default(styles.tooltipList) },
+            React__default.default.createElement("li", { className: cn__default.default(styles.tooltipItem), style: labelStyle },
+                React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles.tooltipLabel) }, labelFormatter ? labelFormatter(label) : label)),
             payload.map(function (entry) {
                 var data = series.find(function (d) { return d.properties.dataKey === entry.dataKey; });
                 if ((data === null || data === void 0 ? void 0 : data.hideTooltip) || (data === null || data === void 0 ? void 0 : data.hide))
                     return null;
-                return (React.createElement("li", { className: cn(styles.tooltipItem), key: entry.dataKey, style: { color: entry.color } },
-                    React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn(styles.tooltipValue) },
+                return (React__default.default.createElement("li", { className: cn__default.default(styles.tooltipItem), key: entry.dataKey, style: { color: entry.color } },
+                    React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles.tooltipValue) },
                         (entry === null || entry === void 0 ? void 0 : entry.formatter) ? entry.formatter(entry.value) : entry.value,
                         separator || ' '),
-                    React.createElement(coreComponentsTypography.Typography.Text, { view: 'secondary-large', tag: 'span', className: cn(styles.tooltipName) }, "".concat(entry.name))));
+                    React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'secondary-large', tag: 'span', className: cn__default.default(styles.tooltipName) }, "".concat(entry.name))));
             }))));
 };
 

package/chart/cssm/Component.js

@@ -29,8 +29,14 @@ require('./hooks/useSettings/utils/setGradientCharts.js');
 require('./hooks/useSettings/utils/setLegendMargin.js');
 require('./hooks/useSettings/utils/sortByIndex.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var CustomizedHOC = function (Component, options) {
-    var NewComponent = function (props) { return React.createElement(Component, tslib_es6.__assign({}, props, options)); };
+    var NewComponent = function (props) { return React__default.default.createElement(Component, tslib_es6.__assign({}, props, options)); };
     return NewComponent;
 };
 
@@ -54,7 +60,7 @@ var Chart = function (props) {
             if (chart !== 'gradient' || !gradient)
                 return null;
             var gid = gradient.gid, points = gradient.points;
-            return (React.createElement(components_LinearGradient.LinearGradient, { key: "".concat(state.id, "-").concat(gid), id: state.id, gid: gid, points: points }));
+            return (React__default.default.createElement(components_LinearGradient.LinearGradient, { key: "".concat(state.id, "-").concat(gid), id: state.id, gid: gid, points: points }));
         });
     }, [state]);
     var toggleChart = React.useCallback(function (item) {
@@ -94,14 +100,14 @@ var Chart = function (props) {
         var translate = ((_a = state === null || state === void 0 ? void 0 : state.xAxis) === null || _a === void 0 ? void 0 : _a.tickMargin) && ((_b = state === null || state === void 0 ? void 0 : state.legend) === null || _b === void 0 ? void 0 : _b.verticalAlign) !== 'top'
             ? state.xAxis.tickMargin + (((_c = state === null || state === void 0 ? void 0 : state.brush) === null || _c === void 0 ? void 0 : _c.brushMargin) || 0)
             : 0;
-        return (React.createElement(recharts.Legend, tslib_es6.__assign({}, (state.legend || null), { content: React.createElement(components_Legends_index.Legends, { legend: state.legend, series: state.series, id: state.id, toggleChart: toggleChart, ref: legendRef, charts: charts }), wrapperStyle: {
+        return (React__default.default.createElement(recharts.Legend, tslib_es6.__assign({}, (state.legend || null), { content: React__default.default.createElement(components_Legends_index.Legends, { legend: state.legend, series: state.series, id: state.id, toggleChart: toggleChart, ref: legendRef, charts: charts }), wrapperStyle: {
                 transform: "translateY(".concat(translate, "px)"),
             } })));
     }, [state, charts, toggleChart, legendRef]);
     var renderCartesianGrid = React.useMemo(function () {
         if (!(state === null || state === void 0 ? void 0 : state.cartesianGrid))
             return null;
-        return React.createElement(recharts.CartesianGrid, tslib_es6.__assign({}, state.cartesianGrid));
+        return React__default.default.createElement(recharts.CartesianGrid, tslib_es6.__assign({}, state.cartesianGrid));
     }, [state]);
     var renderXAxis = React.useMemo(function () {
         var _a;
@@ -117,7 +123,7 @@ var Chart = function (props) {
         else {
             tick = true;
         }
-        return React.createElement(recharts.XAxis, tslib_es6.__assign({}, state.xAxis, { tick: tick }));
+        return React__default.default.createElement(recharts.XAxis, tslib_es6.__assign({}, state.xAxis, { tick: tick }));
     }, [state]);
     var renderYAxis = React.useMemo(function () {
         var _a;
@@ -133,17 +139,17 @@ var Chart = function (props) {
         else {
             tick = true;
         }
-        return React.createElement(recharts.YAxis, tslib_es6.__assign({}, state.yAxis, { tick: tick }));
+        return React__default.default.createElement(recharts.YAxis, tslib_es6.__assign({}, state.yAxis, { tick: tick }));
     }, [state]);
     var renderBrush = React.useMemo(function () {
         if (!(state === null || state === void 0 ? void 0 : state.brush))
             return null;
-        return React.createElement(recharts.Brush, tslib_es6.__assign({ y: typeof yBrush === 'number' ? yBrush : 0 }, state.brush));
+        return React__default.default.createElement(recharts.Brush, tslib_es6.__assign({ y: typeof yBrush === 'number' ? yBrush : 0 }, state.brush));
     }, [state, yBrush]);
     var renderTooltip = React.useMemo(function () {
         if (!(state === null || state === void 0 ? void 0 : state.tooltip))
             return null;
-        return (React.createElement(recharts.Tooltip, tslib_es6.__assign({ ref: tooltipRef }, state.tooltip, { content: CustomizedHOC(components_TooltipContent_index.TooltipContent, { series: state.series, tooltipArrowSide: tooltipArrowSide }) })));
+        return (React__default.default.createElement(recharts.Tooltip, tslib_es6.__assign({ ref: tooltipRef }, state.tooltip, { content: CustomizedHOC(components_TooltipContent_index.TooltipContent, { series: state.series, tooltipArrowSide: tooltipArrowSide }) })));
     }, [state, tooltipArrowSide]);
     var renderChartsItems = React.useMemo(function () {
         if (!state || !charts)
@@ -153,18 +159,18 @@ var Chart = function (props) {
             var show = charts["".concat(properties.dataKey)];
             switch (chart) {
                 case 'bar':
-                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React.createElement(recharts.Bar, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { shape: React.createElement(components_RectBar.RectBar, { radius: radius }) }),
-                        labelList && (React.createElement(recharts.LabelList, tslib_es6.__assign({ dataKey: properties.dataKey.toString() }, labelList, { content: React.createElement(components_CustomizedLabel.CustomizedLabel, { radius: radius }) }))),
+                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Bar, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { shape: React__default.default.createElement(components_RectBar.RectBar, { radius: radius }) }),
+                        labelList && (React__default.default.createElement(recharts.LabelList, tslib_es6.__assign({ dataKey: properties.dataKey.toString() }, labelList, { content: React__default.default.createElement(components_CustomizedLabel.CustomizedLabel, { radius: radius }) }))),
                         data.map(function (_, index) {
                             var key = "".concat(state.id, "-").concat(properties.dataKey, "-").concat(index);
-                            return (React.createElement(recharts.Cell, { key: key, className: cn(styles.bar, typeof activeDotsState.active === 'number' &&
+                            return (React__default.default.createElement(recharts.Cell, { key: key, className: cn__default.default(styles__default.default.bar, typeof activeDotsState.active === 'number' &&
                                     activeDotsState.active !== index
-                                    ? styles.unfocused
+                                    ? styles__default.default.unfocused
                                     : '') }));
                         }))) : null;
                 case 'area':
                 case 'line':
-                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React.createElement(recharts.Line, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { dot: properties.dot && properties.dotSettings
+                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Line, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { dot: properties.dot && properties.dotSettings
                             ? CustomizedHOC(components_Dot_index.Dot, {
                                 activeDot: activeDotsState.active,
                                 dotSettings: properties.dotSettings,
@@ -174,7 +180,7 @@ var Chart = function (props) {
                             })
                             : false, activeDot: false }))) : null;
                 case 'gradient':
-                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React.createElement(recharts.Area, tslib_es6.__assign({}, item.properties, { key: "".concat(state.id, "-").concat(item.properties.dataKey), dataKey: "".concat(item.properties.dataKey), stroke: 'transparent', fill: item.gradient.gid
+                    return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Area, tslib_es6.__assign({}, item.properties, { key: "".concat(state.id, "-").concat(item.properties.dataKey), dataKey: "".concat(item.properties.dataKey), stroke: 'transparent', fill: item.gradient.gid
                             ? "url(#".concat(state.id, "-").concat(item.gradient.gid, ")")
                             : item.properties.fill, dot: false, activeDot: false }))) : null;
                 default:
@@ -256,10 +262,10 @@ var Chart = function (props) {
     };
     if (!data || !charts || !state)
         return null;
-    return (React.createElement("div", { className: styles.coreChart, ref: svgRef, id: (state === null || state === void 0 ? void 0 : state.id) || '', style: { width: '100%', height: '100%' } },
-        React.createElement(recharts.ResponsiveContainer, { debounce: ((_a = state === null || state === void 0 ? void 0 : state.responsiveContainer) === null || _a === void 0 ? void 0 : _a.debounce) ? state.responsiveContainer.debounce : 0, width: '100%' },
-            React.createElement(recharts.ComposedChart, tslib_es6.__assign({}, state === null || state === void 0 ? void 0 : state.composeChart, { onMouseMove: mouseMove, onMouseLeave: mouseLeave, data: data }),
-                React.createElement("defs", null, renderGradient),
+    return (React__default.default.createElement("div", { className: styles__default.default.coreChart, ref: svgRef, id: (state === null || state === void 0 ? void 0 : state.id) || '', style: { width: '100%', height: '100%' } },
+        React__default.default.createElement(recharts.ResponsiveContainer, { debounce: ((_a = state === null || state === void 0 ? void 0 : state.responsiveContainer) === null || _a === void 0 ? void 0 : _a.debounce) ? state.responsiveContainer.debounce : 0, width: '100%' },
+            React__default.default.createElement(recharts.ComposedChart, tslib_es6.__assign({}, state === null || state === void 0 ? void 0 : state.composeChart, { onMouseMove: mouseMove, onMouseLeave: mouseLeave, data: data }),
+                React__default.default.createElement("defs", null, renderGradient),
                 state.cartesianGrid && renderCartesianGrid,
                 state.xAxis && renderXAxis,
                 state.yAxis && renderYAxis,

package/chart/cssm/components/CustomizedLabel.js

@@ -2,11 +2,15 @@ var React = require('react');
 var hooks_usePathBar_index = require('../hooks/usePathBar/index.js');
 require('../hooks/usePathBar/utils/getRadius.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 var CustomizedLabel = function (_a) {
     var x = _a.x, y = _a.y, value = _a.value, offset = _a.offset, radius = _a.radius, height = _a.height, width = _a.width, formatter = _a.formatter;
     var initHeight = hooks_usePathBar_index.usePathBar({ radius: radius, height: height })[0];
-    return (React.createElement("text", { x: x + width / 2, y: y + height - (initHeight + offset), width: width, height: initHeight, textAnchor: 'middle' },
-        React.createElement("tspan", { x: x + width / 2 }, formatter ? formatter(value) : value)));
+    return (React__default.default.createElement("text", { x: x + width / 2, y: y + height - (initHeight + offset), width: width, height: initHeight, textAnchor: 'middle' },
+        React__default.default.createElement("tspan", { x: x + width / 2 }, formatter ? formatter(value) : value)));
 };
 
 exports.CustomizedLabel = CustomizedLabel;

package/chart/cssm/components/Dot/index.js

@@ -3,7 +3,13 @@ var cn = require('classnames');
 var icons_Point = require('../../icons/Point.js');
 var styles = require('./index.module.css');
 
-var Dot = React.forwardRef(function (_a, ref) {
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var Dot = React__default.default.forwardRef(function (_a, ref) {
     var cx = _a.cx, cy = _a.cy, index = _a.index, activeDot = _a.activeDot, dataKey = _a.dataKey, dotSettings = _a.dotSettings, value = _a.value, stroke = _a.stroke;
     var _b = React.useState(0), windowWidth = _b[0], setWindowWidth = _b[1];
     var _c = React.useState(0), height = _c[0], setHeight = _c[1];
@@ -33,12 +39,12 @@ var Dot = React.forwardRef(function (_a, ref) {
     }, [activeDot, index, option]);
     if (!value)
         return null;
-    return (React.createElement("g", { ref: ref, className: cn(styles.dot), transform: "translate(".concat(cx - width / 2, ", ").concat(cy - height / 2, ")") },
-        React.createElement("g", { className: cn(styles.dotWrap), transform: "scale(".concat(activeDot === index ? (option === null || option === void 0 ? void 0 : option.scale) || 0 : (option === null || option === void 0 ? void 0 : option.initScale) || 0, ")") },
-            React.createElement("svg", { className: cn(styles.dotItem, activeDot === index ? styles.dotActive : '', typeof activeDot === 'number' && activeDot !== index
-                    ? styles.dotUnfocused
+    return (React__default.default.createElement("g", { ref: ref, className: cn__default.default(styles__default.default.dot), transform: "translate(".concat(cx - width / 2, ", ").concat(cy - height / 2, ")") },
+        React__default.default.createElement("g", { className: cn__default.default(styles__default.default.dotWrap), transform: "scale(".concat(activeDot === index ? (option === null || option === void 0 ? void 0 : option.scale) || 0 : (option === null || option === void 0 ? void 0 : option.initScale) || 0, ")") },
+            React__default.default.createElement("svg", { className: cn__default.default(styles__default.default.dotItem, activeDot === index ? styles__default.default.dotActive : '', typeof activeDot === 'number' && activeDot !== index
+                    ? styles__default.default.dotUnfocused
                     : ''), "data-id": index, "data-name": dataKey, width: (option === null || option === void 0 ? void 0 : option.width) || 0, height: (option === null || option === void 0 ? void 0 : option.height) || 0 },
-                React.createElement(icons_Point.PointIcon, { fill: stroke })))));
+                React__default.default.createElement(icons_Point.PointIcon, { fill: stroke })))));
 });
 
 exports.Dot = Dot;

package/chart/cssm/components/Legends/index.js

@@ -7,31 +7,37 @@ var icons_FilledCircle = require('../../icons/FilledCircle.js');
 var icons_StrokeCircle = require('../../icons/StrokeCircle.js');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var icons = {
     circleLine: icons_CircleLine.CircleLineIcon,
     filledCircle: icons_FilledCircle.FilledCircleIcon,
     strokeCircle: icons_StrokeCircle.StrokeCircleIcon,
     circle: icons_Circle.CircleIcon,
 };
-var Legends = React.forwardRef(function (_a, ref) {
+var Legends = React__default.default.forwardRef(function (_a, ref) {
     var legend = _a.legend, series = _a.series, id = _a.id, charts = _a.charts, toggleChart = _a.toggleChart;
     var style = {
         textAlign: legend.align || 'center',
         transform: "translateY(".concat(((legend === null || legend === void 0 ? void 0 : legend.marginTop) ? legend.marginTop : 0) *
             (legend.verticalAlign === 'top' ? -1 : 1), "px)"),
     };
-    return (React.createElement("ul", { ref: ref, className: cn(styles.legendWrap), style: style }, series.map(function (item) {
+    return (React__default.default.createElement("ul", { ref: ref, className: cn__default.default(styles__default.default.legendWrap), style: style }, series.map(function (item) {
         var _a, _b;
         if (item.hideLegend || item.hide)
             return null;
         var Icon = icons[item.icon] || icons_Circle.CircleIcon;
-        return (React.createElement("li", { role: 'presentation', key: "".concat(id, "-").concat(item.properties.dataKey), className: cn(styles.legendItem, charts["".concat(item.properties.dataKey)] ? '' : styles.legendUnactive), onClick: function () { return toggleChart(item); } },
-            React.createElement("div", { className: cn(styles.legendContent) },
-                Icon ? (React.createElement("i", { className: cn(styles.legendIcon) },
-                    React.createElement(Icon, { fill: ((_a = item.properties) === null || _a === void 0 ? void 0 : _a.fill) ||
+        return (React__default.default.createElement("li", { role: 'presentation', key: "".concat(id, "-").concat(item.properties.dataKey), className: cn__default.default(styles__default.default.legendItem, charts["".concat(item.properties.dataKey)] ? '' : styles__default.default.legendUnactive), onClick: function () { return toggleChart(item); } },
+            React__default.default.createElement("div", { className: cn__default.default(styles__default.default.legendContent) },
+                Icon ? (React__default.default.createElement("i", { className: cn__default.default(styles__default.default.legendIcon) },
+                    React__default.default.createElement(Icon, { fill: ((_a = item.properties) === null || _a === void 0 ? void 0 : _a.fill) ||
                             ((_b = item.properties) === null || _b === void 0 ? void 0 : _b.stroke) ||
                             '', height: legend.iconHeight || 16 }))) : null,
-                React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', className: cn(styles.legendValue) }, item.properties.name))));
+                React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', className: cn__default.default(styles__default.default.legendValue) }, item.properties.name))));
     })));
 });
 

package/chart/cssm/components/LinearGradient.js

@@ -1,8 +1,12 @@
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 var LinearGradient = function (_a) {
     var id = _a.id, gid = _a.gid, points = _a.points;
-    return (React.createElement("linearGradient", { key: "".concat(id, "-").concat(gid), id: "".concat(id, "-").concat(gid), x1: '0', y1: '0', x2: '0', y2: '1' }, points.map(function (point, index) { return (React.createElement("stop", { key: "".concat(id).concat(gid, "-").concat(index.toString()), offset: "".concat(point.offset, "%"), stopColor: point.stopColor, stopOpacity: point.stopOpacity })); })));
+    return (React__default.default.createElement("linearGradient", { key: "".concat(id, "-").concat(gid), id: "".concat(id, "-").concat(gid), x1: '0', y1: '0', x2: '0', y2: '1' }, points.map(function (point, index) { return (React__default.default.createElement("stop", { key: "".concat(id).concat(gid, "-").concat(index.toString()), offset: "".concat(point.offset, "%"), stopColor: point.stopColor, stopOpacity: point.stopOpacity })); })));
 };
 
 exports.LinearGradient = LinearGradient;

package/chart/cssm/components/RectBar.js

@@ -2,6 +2,10 @@ var React = require('react');
 var hooks_usePathBar_index = require('../hooks/usePathBar/index.js');
 require('../hooks/usePathBar/utils/getRadius.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 // eslint-disable-next-line complexity
 var getPath = function (x, width, height, initHeight, topRadius, bottomRadius, initY) {
     return "\n        M".concat(x + ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight || 0, "\n        Q").concat(x, " ").concat(initY + initHeight, " ").concat(x, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n        L").concat(x, " ").concat(initY + ((height !== 0 && topRadius) || 0), "\n        Q").concat(x, " ").concat(initY, " ").concat(x + ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n        L").concat(x + width - ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n        Q").concat(x + width, " ").concat(initY, " ").concat(x + width, " ").concat(initY + (topRadius || 0), "\n        L").concat(x + width, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n        Q").concat(x + width, " ").concat(initY + initHeight, " ").concat(x + width - ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight, "\n        Z\n    ");
@@ -14,7 +18,7 @@ var RectBar = function (_a) {
         background: background,
         y: y,
     }), initHeight = _b[0], topRadius = _b[1], bottomRadius = _b[2], initY = _b[3];
-    return React.useMemo(function () { return (React.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })); }, [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
+    return React.useMemo(function () { return (React__default.default.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })); }, [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
 };
 
 exports.RectBar = RectBar;

package/chart/cssm/components/Tick/index.js

@@ -2,6 +2,12 @@ var React = require('react');
 var cn = require('classnames');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var Tick = function (_a) {
     var y = _a.y, payload = _a.payload, tickFormatter = _a.tickFormatter, xAxis = _a.xAxis;
     var radius = 4;
@@ -9,9 +15,9 @@ var Tick = function (_a) {
         (xAxis.tickMargin > 0 ? xAxis.tickMargin - radius / 2 : xAxis.tickMargin === 0)
         ? (radius / 2) * -1
         : null;
-    return (React.createElement("g", { className: cn(styles.tick), opacity: '1', textAnchor: 'middle', transform: "translate(".concat(payload.coordinate, ", ").concat(y - (typeof marginTick === 'number' ? marginTick : 0) - radius * 2, ")") },
-        React.createElement("text", { className: cn(styles.tickText), y: '30' }, tickFormatter ? tickFormatter(payload.value) : payload.value),
-        React.createElement("circle", { r: radius, className: cn(styles.circle) })));
+    return (React__default.default.createElement("g", { className: cn__default.default(styles__default.default.tick), opacity: '1', textAnchor: 'middle', transform: "translate(".concat(payload.coordinate, ", ").concat(y - (typeof marginTick === 'number' ? marginTick : 0) - radius * 2, ")") },
+        React__default.default.createElement("text", { className: cn__default.default(styles__default.default.tickText), y: '30' }, tickFormatter ? tickFormatter(payload.value) : payload.value),
+        React__default.default.createElement("circle", { r: radius, className: cn__default.default(styles__default.default.circle) })));
 };
 
 exports.Tick = Tick;