intergalactic 15.51.0 → 15.52.0-prerelease-e6d2b891
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/CHANGELOG.md +6 -0
- package/components.json +1 -0
- package/date-picker/lib/cjs/components/ButtonTrigger.js +1 -5
- package/date-picker/lib/cjs/components/ButtonTrigger.js.map +1 -1
- package/date-picker/lib/cjs/components/DateRangeComparatorAbstract.js +39 -16
- package/date-picker/lib/cjs/components/DateRangeComparatorAbstract.js.map +1 -1
- package/date-picker/lib/cjs/components/PickerAbstract.js +54 -46
- package/date-picker/lib/cjs/components/PickerAbstract.js.map +1 -1
- package/date-picker/lib/cjs/components/RangePickerAbstract.js +71 -60
- package/date-picker/lib/cjs/components/RangePickerAbstract.js.map +1 -1
- package/date-picker/lib/es6/components/ButtonTrigger.js +1 -5
- package/date-picker/lib/es6/components/ButtonTrigger.js.map +1 -1
- package/date-picker/lib/es6/components/DateRangeComparatorAbstract.js +39 -16
- package/date-picker/lib/es6/components/DateRangeComparatorAbstract.js.map +1 -1
- package/date-picker/lib/es6/components/PickerAbstract.js +54 -46
- package/date-picker/lib/es6/components/PickerAbstract.js.map +1 -1
- package/date-picker/lib/es6/components/RangePickerAbstract.js +71 -60
- package/date-picker/lib/es6/components/RangePickerAbstract.js.map +1 -1
- package/mini-chart/component/score/Donut.d.ts +12 -0
- package/mini-chart/component/score/Line.d.ts +15 -0
- package/mini-chart/component/score/Score.d.ts +20 -0
- package/mini-chart/component/score/index.d.ts +3 -0
- package/mini-chart/component/trend/Bar.d.ts +26 -0
- package/mini-chart/component/trend/Line.d.ts +29 -0
- package/mini-chart/component/trend/Trend.d.ts +36 -0
- package/mini-chart/component/trend/index.d.ts +3 -0
- package/mini-chart/index.d.ts +12 -0
- package/mini-chart/index.js +8 -0
- package/mini-chart/index.mjs +2 -0
- package/mini-chart/lib/cjs/component/score/Donut.js +123 -0
- package/mini-chart/lib/cjs/component/score/Donut.js.map +1 -0
- package/mini-chart/lib/cjs/component/score/Line.js +94 -0
- package/mini-chart/lib/cjs/component/score/Line.js.map +1 -0
- package/mini-chart/lib/cjs/component/score/Score.js +2 -0
- package/mini-chart/lib/cjs/component/score/Score.js.map +1 -0
- package/mini-chart/lib/cjs/component/score/donut.shadow.css +17 -0
- package/mini-chart/lib/cjs/component/score/index.js +26 -0
- package/mini-chart/lib/cjs/component/score/index.js.map +1 -0
- package/mini-chart/lib/cjs/component/score/line.shadow.css +66 -0
- package/mini-chart/lib/cjs/component/skeleton/skeleton.shadow.css +24 -0
- package/mini-chart/lib/cjs/component/trend/Bar.js +124 -0
- package/mini-chart/lib/cjs/component/trend/Bar.js.map +1 -0
- package/mini-chart/lib/cjs/component/trend/Line.js +166 -0
- package/mini-chart/lib/cjs/component/trend/Line.js.map +1 -0
- package/mini-chart/lib/cjs/component/trend/Trend.js +87 -0
- package/mini-chart/lib/cjs/component/trend/Trend.js.map +1 -0
- package/mini-chart/lib/cjs/component/trend/index.js +32 -0
- package/mini-chart/lib/cjs/component/trend/index.js.map +1 -0
- package/mini-chart/lib/cjs/index.js +20 -0
- package/mini-chart/lib/cjs/index.js.map +1 -0
- package/mini-chart/lib/es6/component/score/Donut.js +116 -0
- package/mini-chart/lib/es6/component/score/Donut.js.map +1 -0
- package/mini-chart/lib/es6/component/score/Line.js +87 -0
- package/mini-chart/lib/es6/component/score/Line.js.map +1 -0
- package/mini-chart/lib/es6/component/score/Score.js +2 -0
- package/mini-chart/lib/es6/component/score/Score.js.map +1 -0
- package/mini-chart/lib/es6/component/score/donut.shadow.css +17 -0
- package/mini-chart/lib/es6/component/score/index.js +4 -0
- package/mini-chart/lib/es6/component/score/index.js.map +1 -0
- package/mini-chart/lib/es6/component/score/line.shadow.css +66 -0
- package/mini-chart/lib/es6/component/skeleton/skeleton.shadow.css +24 -0
- package/mini-chart/lib/es6/component/trend/Bar.js +116 -0
- package/mini-chart/lib/es6/component/trend/Bar.js.map +1 -0
- package/mini-chart/lib/es6/component/trend/Line.js +158 -0
- package/mini-chart/lib/es6/component/trend/Line.js.map +1 -0
- package/mini-chart/lib/es6/component/trend/Trend.js +79 -0
- package/mini-chart/lib/es6/component/trend/Trend.js.map +1 -0
- package/mini-chart/lib/es6/component/trend/index.js +4 -0
- package/mini-chart/lib/es6/component/trend/index.js.map +1 -0
- package/mini-chart/lib/es6/index.js +13 -0
- package/mini-chart/lib/es6/index.js.map +1 -0
- package/mini-chart/lib/types/component/score/Donut.d.ts +12 -0
- package/mini-chart/lib/types/component/score/Line.d.ts +15 -0
- package/mini-chart/lib/types/component/score/Score.d.ts +20 -0
- package/mini-chart/lib/types/component/score/index.d.ts +3 -0
- package/mini-chart/lib/types/component/trend/Bar.d.ts +26 -0
- package/mini-chart/lib/types/component/trend/Line.d.ts +29 -0
- package/mini-chart/lib/types/component/trend/Trend.d.ts +36 -0
- package/mini-chart/lib/types/component/trend/index.d.ts +3 -0
- package/mini-chart/lib/types/index.d.ts +12 -0
- package/package.json +27 -2
@@ -0,0 +1,166 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
6
|
+
value: true
|
7
|
+
});
|
8
|
+
exports.TrendLine = exports.TrendArea = void 0;
|
9
|
+
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
10
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
11
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
12
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
13
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
14
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
15
|
+
var _core = _interopRequireWildcard(require("intergalactic/core"));
|
16
|
+
var _react = _interopRequireDefault(require("react"));
|
17
|
+
var _resolveColorEnhance = _interopRequireDefault(require("intergalactic/utils/lib/enhances/resolveColorEnhance"));
|
18
|
+
var _uniqueID = _interopRequireDefault(require("intergalactic/utils/lib/uniqueID"));
|
19
|
+
var _Trend2 = require("./Trend");
|
20
|
+
var _flexBox = require("intergalactic/flex-box");
|
21
|
+
/*__reshadow-styles__:"../skeleton/skeleton.shadow.css"*/
|
22
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes pulse_179om{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_179om_gg_.__loading_179om_gg_,.___SLineGauge_179om_gg_.__loading_179om_gg_,.___STrendBar_179om_gg_.__loading_179om_gg_,.___STrendLine_179om_gg_.__loading_179om_gg_{animation-name:pulse_179om;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}" /*__inner_css_end__*/, "179om_gg_") /*__reshadow_css_end__*/, {
|
23
|
+
"__SLineGauge": "___SLineGauge_179om_gg_",
|
24
|
+
"_loading": "__loading_179om_gg_",
|
25
|
+
"__SDonutContainer": "___SDonutContainer_179om_gg_",
|
26
|
+
"__STrendLine": "___STrendLine_179om_gg_",
|
27
|
+
"__STrendBar": "___STrendBar_179om_gg_",
|
28
|
+
"@pulse": "pulse_179om"
|
29
|
+
});
|
30
|
+
var TrendLineRoot = /*#__PURE__*/function (_Trend) {
|
31
|
+
(0, _inherits2["default"])(TrendLineRoot, _Trend);
|
32
|
+
var _super = (0, _createSuper2["default"])(TrendLineRoot);
|
33
|
+
function TrendLineRoot() {
|
34
|
+
(0, _classCallCheck2["default"])(this, TrendLineRoot);
|
35
|
+
return _super.apply(this, arguments);
|
36
|
+
}
|
37
|
+
(0, _createClass2["default"])(TrendLineRoot, [{
|
38
|
+
key: "defaultData",
|
39
|
+
get: function get() {
|
40
|
+
return [15, 70, 20, 85, 20];
|
41
|
+
}
|
42
|
+
}, {
|
43
|
+
key: "lastPointRadius",
|
44
|
+
get: function get() {
|
45
|
+
var _this$asProps$lastPoi;
|
46
|
+
return (_this$asProps$lastPoi = this.asProps.lastPointRadius) !== null && _this$asProps$lastPoi !== void 0 ? _this$asProps$lastPoi : 6;
|
47
|
+
}
|
48
|
+
}, {
|
49
|
+
key: "data",
|
50
|
+
get: function get() {
|
51
|
+
var _this$asProps = this.asProps,
|
52
|
+
data = _this$asProps.data,
|
53
|
+
loading = _this$asProps.loading;
|
54
|
+
if (loading) {
|
55
|
+
return this.defaultData;
|
56
|
+
}
|
57
|
+
return data;
|
58
|
+
}
|
59
|
+
}, {
|
60
|
+
key: "svgWidth",
|
61
|
+
get: function get() {
|
62
|
+
return this.asProps.lastPointColor ? this.defaultWidth + this.lastPointRadius : this.defaultWidth;
|
63
|
+
}
|
64
|
+
}, {
|
65
|
+
key: "svgHeight",
|
66
|
+
get: function get() {
|
67
|
+
return this.asProps.lastPointColor ? this.defaultHeight + this.lastPointRadius : this.defaultHeight;
|
68
|
+
}
|
69
|
+
}, {
|
70
|
+
key: "color",
|
71
|
+
get: function get() {
|
72
|
+
var _this$asProps2 = this.asProps,
|
73
|
+
resolveColor = _this$asProps2.resolveColor,
|
74
|
+
_this$asProps2$color = _this$asProps2.color,
|
75
|
+
color = _this$asProps2$color === void 0 ? 'chart-palette-order-1' : _this$asProps2$color,
|
76
|
+
loading = _this$asProps2.loading;
|
77
|
+
if (loading) {
|
78
|
+
return resolveColor('skeleton-bg');
|
79
|
+
}
|
80
|
+
return resolveColor(color);
|
81
|
+
}
|
82
|
+
}, {
|
83
|
+
key: "render",
|
84
|
+
value: function render() {
|
85
|
+
var _ref = this.asProps,
|
86
|
+
_ref2;
|
87
|
+
var STrendLine = _flexBox.Box;
|
88
|
+
var _this$asProps3 = this.asProps,
|
89
|
+
uid = _this$asProps3.uid,
|
90
|
+
withArea = _this$asProps3.withArea,
|
91
|
+
animate = _this$asProps3.animate,
|
92
|
+
lastPointColor = _this$asProps3.lastPointColor,
|
93
|
+
resolveColor = _this$asProps3.resolveColor,
|
94
|
+
loading = _this$asProps3.loading,
|
95
|
+
styles = _this$asProps3.styles;
|
96
|
+
var points = [];
|
97
|
+
var length = this.data.length;
|
98
|
+
var step = this.defaultWidth / (length - 1);
|
99
|
+
for (var i = 0; i < length; i++) {
|
100
|
+
points.push("".concat(step * i, ",").concat(this.defaultHeight - this.data[i]));
|
101
|
+
}
|
102
|
+
return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(STrendLine, _ref2.cn("STrendLine", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
103
|
+
"ref": this.containerRef,
|
104
|
+
"__excludeProps": ['data']
|
105
|
+
}, _ref))), /*#__PURE__*/_react["default"].createElement("svg", _ref2.cn("svg", {
|
106
|
+
"width": '100%',
|
107
|
+
"height": '100%',
|
108
|
+
"viewBox": "0 0 ".concat(this.svgWidth, " ").concat(this.svgHeight)
|
109
|
+
}), /*#__PURE__*/_react["default"].createElement("polyline", _ref2.cn("polyline", {
|
110
|
+
"points": points.join(' '),
|
111
|
+
"stroke": this.color,
|
112
|
+
"strokeWidth": '4',
|
113
|
+
"fill": 'none',
|
114
|
+
"clipPath": "url(#".concat(uid, ")")
|
115
|
+
})), withArea && /*#__PURE__*/_react["default"].createElement("polyline", _ref2.cn("polyline", {
|
116
|
+
"points": "0,".concat(this.defaultHeight, " ").concat(points.join(' '), " ").concat(this.defaultWidth, ",").concat(this.defaultHeight),
|
117
|
+
"fill": this.color,
|
118
|
+
"fillOpacity": 0.2,
|
119
|
+
"clipPath": "url(#".concat(uid, ")")
|
120
|
+
})), lastPointColor && !loading && /*#__PURE__*/_react["default"].createElement("circle", _ref2.cn("circle", {
|
121
|
+
"cx": step * (length - 1),
|
122
|
+
"cy": this.defaultHeight - this.data[length - 1],
|
123
|
+
"r": this.lastPointRadius,
|
124
|
+
"fill": resolveColor(lastPointColor),
|
125
|
+
"stroke": resolveColor('chart-grid-border'),
|
126
|
+
"strokeWidth": 4,
|
127
|
+
"clipPath": "url(#".concat(uid, ")")
|
128
|
+
})), animate && !loading && /*#__PURE__*/_react["default"].createElement("clipPath", _ref2.cn("clipPath", {
|
129
|
+
"id": uid
|
130
|
+
}), /*#__PURE__*/_react["default"].createElement("rect", _ref2.cn("rect", {
|
131
|
+
"x": '0',
|
132
|
+
"y": '0',
|
133
|
+
"width": '100%',
|
134
|
+
"height": '100%',
|
135
|
+
"fill": 'black'
|
136
|
+
}), /*#__PURE__*/_react["default"].createElement("animate", _ref2.cn("animate", {
|
137
|
+
"dur": '500ms',
|
138
|
+
"attributeName": 'width',
|
139
|
+
"values": '0;100%'
|
140
|
+
}))))));
|
141
|
+
}
|
142
|
+
}]);
|
143
|
+
return TrendLineRoot;
|
144
|
+
}(_Trend2.Trend);
|
145
|
+
(0, _defineProperty2["default"])(TrendLineRoot, "enhance", [(0, _resolveColorEnhance["default"])(), (0, _uniqueID["default"])()]);
|
146
|
+
(0, _defineProperty2["default"])(TrendLineRoot, "style", style);
|
147
|
+
(0, _defineProperty2["default"])(TrendLineRoot, "defaultProps", {
|
148
|
+
animate: true
|
149
|
+
});
|
150
|
+
var TrendLine = (0, _core["default"])(TrendLineRoot);
|
151
|
+
exports.TrendLine = TrendLine;
|
152
|
+
TrendLine.displayName = 'MiniChart.TrendLine';
|
153
|
+
var TrendArea = (0, _core["default"])(TrendLineRoot, {}, {
|
154
|
+
enhancements: [function () {
|
155
|
+
return {
|
156
|
+
wrapperProps: function wrapperProps(props) {
|
157
|
+
return (0, _core.assignProps)(props, {
|
158
|
+
withArea: true
|
159
|
+
});
|
160
|
+
}
|
161
|
+
};
|
162
|
+
}]
|
163
|
+
});
|
164
|
+
exports.TrendArea = TrendArea;
|
165
|
+
TrendArea.displayName = 'MiniChart.TrendArea';
|
166
|
+
//# sourceMappingURL=Line.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Line.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_resolveColorEnhance","_uniqueID","_Trend2","_flexBox","style","sstyled","insert","TrendLineRoot","_Trend","_inherits2","_super","_createSuper2","_classCallCheck2","apply","arguments","_createClass2","key","get","_this$asProps$lastPoi","asProps","lastPointRadius","_this$asProps","data","loading","defaultData","lastPointColor","defaultWidth","defaultHeight","_this$asProps2","resolveColor","_this$asProps2$color","color","value","render","_ref","_ref2","STrendLine","Box","_this$asProps3","uid","withArea","animate","styles","points","length","step","i","push","concat","createElement","cn","_objectSpread2","assignProps","containerRef","svgWidth","svgHeight","join","Trend","_defineProperty2","resolveColorEnhance","uniqueIDEnhancement","TrendLine","createComponent","exports","displayName","TrendArea","enhancements","wrapperProps","props"],"sources":["../../../../src/component/trend/Line.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { ComponentType, assignProps, Root, sstyled } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport { Trend, CommonTrendProps } from './Trend';\nimport { Box } from '@semcore/flex-box';\n\nimport style from '../skeleton/skeleton.shadow.css';\n\nexport type TrendLineProps = CommonTrendProps & {\n /**\n * List of values\n */\n data: number[];\n\n /**\n * Color of line\n */\n color?: string;\n\n /**\n * Color of last point in chart\n */\n lastPointColor?: string;\n\n /**\n * Radius for last point item\n */\n lastPointRadius?: number;\n};\n\ntype Enhances = {\n uid: string;\n resolveColor: ReturnType<typeof resolveColorEnhance>;\n withArea?: true;\n};\n\nclass TrendLineRoot extends Trend<TrendLineProps, Enhances> {\n static enhance = [resolveColorEnhance(), uniqueIDEnhancement()];\n\n static style = style;\n\n static defaultProps = {\n animate: true,\n };\n\n get defaultData(): number[] {\n return [15, 70, 20, 85, 20];\n }\n\n get lastPointRadius(): number {\n return this.asProps.lastPointRadius ?? 6;\n }\n\n get data(): number[] {\n const { data, loading } = this.asProps;\n\n if (loading) {\n return this.defaultData;\n }\n\n return data;\n }\n\n override get svgWidth(): number {\n return this.asProps.lastPointColor\n ? this.defaultWidth + this.lastPointRadius\n : this.defaultWidth;\n }\n\n override get svgHeight(): number {\n return this.asProps.lastPointColor\n ? this.defaultHeight + this.lastPointRadius\n : this.defaultHeight;\n }\n\n get color() {\n const { resolveColor, color = 'chart-palette-order-1', loading } = this.asProps;\n\n if (loading) {\n return resolveColor('skeleton-bg');\n }\n\n return resolveColor(color);\n }\n\n render() {\n const STrendLine = Root;\n const { uid, withArea, animate, lastPointColor, resolveColor, loading, styles } = this.asProps;\n\n const points: string[] = [];\n const length = this.data.length;\n const step = this.defaultWidth / (length - 1);\n\n for (let i = 0; i < length; i++) {\n points.push(`${step * i},${this.defaultHeight - this.data[i]}`);\n }\n\n return sstyled(styles)(\n <STrendLine render={Box} ref={this.containerRef} __excludeProps={['data']}>\n <svg width='100%' height='100%' viewBox={`0 0 ${this.svgWidth} ${this.svgHeight}`}>\n <polyline\n points={points.join(' ')}\n stroke={this.color}\n strokeWidth='4'\n fill={'none'}\n clipPath={`url(#${uid})`}\n />\n {withArea && (\n <polyline\n points={`0,${this.defaultHeight} ${points.join(' ')} ${this.defaultWidth},${\n this.defaultHeight\n }`}\n fill={this.color}\n fillOpacity={0.2}\n clipPath={`url(#${uid})`}\n />\n )}\n {lastPointColor && !loading && (\n <circle\n cx={step * (length - 1)}\n cy={this.defaultHeight - this.data[length - 1]}\n r={this.lastPointRadius}\n fill={resolveColor(lastPointColor)}\n stroke={resolveColor('chart-grid-border')}\n strokeWidth={4}\n clipPath={`url(#${uid})`}\n />\n )}\n\n {animate && !loading && (\n <clipPath id={uid}>\n <rect x='0' y='0' width='100%' height='100%' fill={'black'}>\n <animate dur='500ms' attributeName='width' values='0;100%' />\n </rect>\n </clipPath>\n )}\n </svg>\n </STrendLine>,\n );\n }\n}\n\nexport const TrendLine: ComponentType<TrendLineProps, {}, {}, Enhances> =\n createComponent(TrendLineRoot);\n\nTrendLine.displayName = 'MiniChart.TrendLine';\n\nexport const TrendArea: ComponentType<TrendLineProps, {}, {}, Enhances> = createComponent(\n TrendLineRoot,\n {},\n {\n enhancements: [\n () => {\n return {\n wrapperProps: (props: TrendLineProps) => {\n return assignProps(props, { withArea: true });\n },\n };\n },\n ],\n },\n);\n\nTrendArea.displayName = 'MiniChart.TrendArea';\n"],"mappings":"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"}
|
@@ -0,0 +1,87 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
5
|
+
value: true
|
6
|
+
});
|
7
|
+
exports.Trend = void 0;
|
8
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
9
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
10
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
11
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
12
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
13
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
14
|
+
var _react = _interopRequireDefault(require("react"));
|
15
|
+
var _core = require("intergalactic/core");
|
16
|
+
var Trend = /*#__PURE__*/function (_Component) {
|
17
|
+
(0, _inherits2["default"])(Trend, _Component);
|
18
|
+
var _super = (0, _createSuper2["default"])(Trend);
|
19
|
+
function Trend() {
|
20
|
+
var _this;
|
21
|
+
(0, _classCallCheck2["default"])(this, Trend);
|
22
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
23
|
+
args[_key] = arguments[_key];
|
24
|
+
}
|
25
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
26
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
|
27
|
+
width: 200,
|
28
|
+
height: 100
|
29
|
+
});
|
30
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "containerRef", /*#__PURE__*/_react["default"].createRef());
|
31
|
+
return _this;
|
32
|
+
}
|
33
|
+
(0, _createClass2["default"])(Trend, [{
|
34
|
+
key: "componentDidMount",
|
35
|
+
value: function componentDidMount() {
|
36
|
+
this.setSizes();
|
37
|
+
}
|
38
|
+
}, {
|
39
|
+
key: "componentDidUpdate",
|
40
|
+
value: function componentDidUpdate(prevProps) {
|
41
|
+
if (prevProps.w !== this.props.w || prevProps.h !== this.props.h || prevProps.data !== this.props.data) {
|
42
|
+
this.setSizes();
|
43
|
+
}
|
44
|
+
}
|
45
|
+
}, {
|
46
|
+
key: "defaultWidth",
|
47
|
+
get: function get() {
|
48
|
+
var _this$state = this.state,
|
49
|
+
width = _this$state.width,
|
50
|
+
height = _this$state.height;
|
51
|
+
return width / height * this.defaultHeight;
|
52
|
+
}
|
53
|
+
}, {
|
54
|
+
key: "defaultHeight",
|
55
|
+
get: function get() {
|
56
|
+
return 100;
|
57
|
+
}
|
58
|
+
}, {
|
59
|
+
key: "svgWidth",
|
60
|
+
get: function get() {
|
61
|
+
return this.defaultWidth;
|
62
|
+
}
|
63
|
+
}, {
|
64
|
+
key: "svgHeight",
|
65
|
+
get: function get() {
|
66
|
+
return this.defaultHeight;
|
67
|
+
}
|
68
|
+
}, {
|
69
|
+
key: "setSizes",
|
70
|
+
value: function setSizes() {
|
71
|
+
if (this.containerRef.current) {
|
72
|
+
var boundingClientRect = this.containerRef.current.getBoundingClientRect();
|
73
|
+
var width = boundingClientRect.width,
|
74
|
+
height = boundingClientRect.height;
|
75
|
+
if (width > 0 && height > 0) {
|
76
|
+
this.setState({
|
77
|
+
width: width,
|
78
|
+
height: height
|
79
|
+
});
|
80
|
+
}
|
81
|
+
}
|
82
|
+
}
|
83
|
+
}]);
|
84
|
+
return Trend;
|
85
|
+
}(_core.Component);
|
86
|
+
exports.Trend = Trend;
|
87
|
+
//# sourceMappingURL=Trend.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Trend.js","names":["_react","_interopRequireDefault","require","_core","Trend","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","width","height","React","createRef","_createClass2","key","value","componentDidMount","setSizes","componentDidUpdate","prevProps","w","props","h","data","get","_this$state","state","defaultHeight","defaultWidth","containerRef","current","boundingClientRect","getBoundingClientRect","setState","Component","exports"],"sources":["../../../../src/component/trend/Trend.tsx"],"sourcesContent":["import React from 'react';\nimport { Component } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\n\nexport type CommonTrendProps = BoxProps & {\n /**\n * Flag to enable animate of charts\n * @default true\n */\n animate?: boolean;\n\n /**\n * Flag to enable skeleton\n * @default false\n */\n loading?: boolean;\n\n /**\n * Data for chart\n */\n data: any[];\n};\n\nexport abstract class Trend<P extends CommonTrendProps, E> extends Component<\n P,\n {},\n { width: number; height: number },\n E\n> {\n state = {\n width: 200,\n height: 100,\n };\n\n containerRef = React.createRef<HTMLDivElement>();\n\n componentDidMount() {\n this.setSizes();\n }\n componentDidUpdate(prevProps: P) {\n if (\n prevProps.w !== this.props.w ||\n prevProps.h !== this.props.h ||\n prevProps.data !== this.props.data\n ) {\n this.setSizes();\n }\n }\n\n get defaultWidth(): number {\n const { width, height } = this.state;\n\n return (width / height) * this.defaultHeight;\n }\n\n get defaultHeight(): number {\n return 100;\n }\n\n get svgWidth(): number {\n return this.defaultWidth;\n }\n\n get svgHeight(): number {\n return this.defaultHeight;\n }\n\n setSizes() {\n if (this.containerRef.current) {\n const boundingClientRect = this.containerRef.current.getBoundingClientRect();\n\n const { width, height } = boundingClientRect;\n\n if (width > 0 && height > 0) {\n this.setState({ width, height });\n }\n }\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAA0C,IAsBpBE,KAAK,0BAAAC,UAAA;EAAA,IAAAC,UAAA,aAAAF,KAAA,EAAAC,UAAA;EAAA,IAAAE,MAAA,OAAAC,aAAA,aAAAJ,KAAA;EAAA,SAAAA,MAAA;IAAA,IAAAK,KAAA;IAAA,IAAAC,gBAAA,mBAAAN,KAAA;IAAA,SAAAO,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAP,KAAA,GAAAF,MAAA,CAAAU,IAAA,CAAAC,KAAA,CAAAX,MAAA,SAAAY,MAAA,CAAAL,IAAA;IAAA,IAAAM,gBAAA,iBAAAC,uBAAA,aAAAZ,KAAA,YAMjB;MACNa,KAAK,EAAE,GAAG;MACVC,MAAM,EAAE;IACV,CAAC;IAAA,IAAAH,gBAAA,iBAAAC,uBAAA,aAAAZ,KAAA,gCAEce,iBAAK,CAACC,SAAS,EAAkB;IAAA,OAAAhB,KAAA;EAAA;EAAA,IAAAiB,aAAA,aAAAtB,KAAA;IAAAuB,GAAA;IAAAC,KAAA,EAEhD,SAAAC,kBAAA,EAAoB;MAClB,IAAI,CAACC,QAAQ,EAAE;IACjB;EAAC;IAAAH,GAAA;IAAAC,KAAA,EACD,SAAAG,mBAAmBC,SAAY,EAAE;MAC/B,IACEA,SAAS,CAACC,CAAC,KAAK,IAAI,CAACC,KAAK,CAACD,CAAC,IAC5BD,SAAS,CAACG,CAAC,KAAK,IAAI,CAACD,KAAK,CAACC,CAAC,IAC5BH,SAAS,CAACI,IAAI,KAAK,IAAI,CAACF,KAAK,CAACE,IAAI,EAClC;QACA,IAAI,CAACN,QAAQ,EAAE;MACjB;IACF;EAAC;IAAAH,GAAA;IAAAU,GAAA,EAED,SAAAA,IAAA,EAA2B;MACzB,IAAAC,WAAA,GAA0B,IAAI,CAACC,KAAK;QAA5BjB,KAAK,GAAAgB,WAAA,CAALhB,KAAK;QAAEC,MAAM,GAAAe,WAAA,CAANf,MAAM;MAErB,OAAQD,KAAK,GAAGC,MAAM,GAAI,IAAI,CAACiB,aAAa;IAC9C;EAAC;IAAAb,GAAA;IAAAU,GAAA,EAED,SAAAA,IAAA,EAA4B;MAC1B,OAAO,GAAG;IACZ;EAAC;IAAAV,GAAA;IAAAU,GAAA,EAED,SAAAA,IAAA,EAAuB;MACrB,OAAO,IAAI,CAACI,YAAY;IAC1B;EAAC;IAAAd,GAAA;IAAAU,GAAA,EAED,SAAAA,IAAA,EAAwB;MACtB,OAAO,IAAI,CAACG,aAAa;IAC3B;EAAC;IAAAb,GAAA;IAAAC,KAAA,EAED,SAAAE,SAAA,EAAW;MACT,IAAI,IAAI,CAACY,YAAY,CAACC,OAAO,EAAE;QAC7B,IAAMC,kBAAkB,GAAG,IAAI,CAACF,YAAY,CAACC,OAAO,CAACE,qBAAqB,EAAE;QAE5E,IAAQvB,KAAK,GAAasB,kBAAkB,CAApCtB,KAAK;UAAEC,MAAM,GAAKqB,kBAAkB,CAA7BrB,MAAM;QAErB,IAAID,KAAK,GAAG,CAAC,IAAIC,MAAM,GAAG,CAAC,EAAE;UAC3B,IAAI,CAACuB,QAAQ,CAAC;YAAExB,KAAK,EAALA,KAAK;YAAEC,MAAM,EAANA;UAAO,CAAC,CAAC;QAClC;MACF;IACF;EAAC;EAAA,OAAAnB,KAAA;AAAA,EAtDgE2C,eAAS;AAAAC,OAAA,CAAA5C,KAAA,GAAAA,KAAA"}
|
@@ -0,0 +1,32 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
Object.defineProperty(exports, "TrendArea", {
|
7
|
+
enumerable: true,
|
8
|
+
get: function get() {
|
9
|
+
return _Line.TrendArea;
|
10
|
+
}
|
11
|
+
});
|
12
|
+
Object.defineProperty(exports, "TrendBar", {
|
13
|
+
enumerable: true,
|
14
|
+
get: function get() {
|
15
|
+
return _Bar.TrendBar;
|
16
|
+
}
|
17
|
+
});
|
18
|
+
Object.defineProperty(exports, "TrendHistogram", {
|
19
|
+
enumerable: true,
|
20
|
+
get: function get() {
|
21
|
+
return _Bar.TrendHistogram;
|
22
|
+
}
|
23
|
+
});
|
24
|
+
Object.defineProperty(exports, "TrendLine", {
|
25
|
+
enumerable: true,
|
26
|
+
get: function get() {
|
27
|
+
return _Line.TrendLine;
|
28
|
+
}
|
29
|
+
});
|
30
|
+
var _Line = require("./Line");
|
31
|
+
var _Bar = require("./Bar");
|
32
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Line","require","_Bar"],"sources":["../../../../src/component/trend/index.ts"],"sourcesContent":["import { TrendLine, TrendArea } from './Line';\nimport { TrendBar, TrendHistogram } from './Bar';\n\nexport { TrendLine, TrendArea, TrendBar, TrendHistogram };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA"}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports["default"] = void 0;
|
7
|
+
var _score = require("./component/score");
|
8
|
+
var _trend = require("./component/trend");
|
9
|
+
var miniCharts = {
|
10
|
+
TrendLine: _trend.TrendLine,
|
11
|
+
TrendArea: _trend.TrendArea,
|
12
|
+
TrendBar: _trend.TrendBar,
|
13
|
+
TrendHistogram: _trend.TrendHistogram,
|
14
|
+
ScoreSemiDonut: _score.ScoreSemiDonut,
|
15
|
+
ScoreDonut: _score.ScoreDonut,
|
16
|
+
ScoreLine: _score.ScoreLine
|
17
|
+
};
|
18
|
+
var _default = miniCharts;
|
19
|
+
exports["default"] = _default;
|
20
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","names":["_score","require","_trend","miniCharts","TrendLine","TrendArea","TrendBar","TrendHistogram","ScoreSemiDonut","ScoreDonut","ScoreLine","_default","exports"],"sources":["../../src/index.ts"],"sourcesContent":["import { ScoreLine, ScoreDonut, ScoreSemiDonut } from './component/score';\nimport { TrendLine, TrendArea, TrendBar, TrendHistogram } from './component/trend';\n\nconst miniCharts: {\n TrendLine: typeof TrendLine;\n TrendArea: typeof TrendArea;\n TrendBar: typeof TrendBar;\n TrendHistogram: typeof TrendHistogram;\n ScoreSemiDonut: typeof ScoreSemiDonut;\n ScoreDonut: typeof ScoreDonut;\n ScoreLine: typeof ScoreLine;\n} = {\n TrendLine,\n TrendArea,\n TrendBar,\n TrendHistogram,\n ScoreSemiDonut,\n ScoreDonut,\n ScoreLine,\n};\n\nexport default miniCharts;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAEA,IAAME,UAQL,GAAG;EACFC,SAAS,EAATA,gBAAS;EACTC,SAAS,EAATA,gBAAS;EACTC,QAAQ,EAARA,eAAQ;EACRC,cAAc,EAAdA,qBAAc;EACdC,cAAc,EAAdA,qBAAc;EACdC,UAAU,EAAVA,iBAAU;EACVC,SAAS,EAATA;AACF,CAAC;AAAC,IAAAC,QAAA,GAEaR,UAAU;AAAAS,OAAA,cAAAD,QAAA"}
|
@@ -0,0 +1,116 @@
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
2
|
+
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
3
|
+
import _createClass from "@babel/runtime/helpers/createClass";
|
4
|
+
import _inherits from "@babel/runtime/helpers/inherits";
|
5
|
+
import _createSuper from "@babel/runtime/helpers/createSuper";
|
6
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
7
|
+
import { sstyled as _sstyled } from 'intergalactic/core';
|
8
|
+
import { assignProps as _assignProps } from 'intergalactic/core';
|
9
|
+
import React from 'react';
|
10
|
+
import createComponent, { Component, Root, sstyled } from 'intergalactic/core';
|
11
|
+
import { Box } from 'intergalactic/flex-box';
|
12
|
+
import resolveColorEnhance from 'intergalactic/utils/lib/enhances/resolveColorEnhance';
|
13
|
+
import { assignProps } from 'intergalactic/core';
|
14
|
+
/*__reshadow-styles__:"./donut.shadow.css"*/
|
15
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes pulse_fe5yo{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_fe5yo_gg_.__loading_fe5yo_gg_,.___SLineGauge_fe5yo_gg_.__loading_fe5yo_gg_,.___STrendBar_fe5yo_gg_.__loading_fe5yo_gg_,.___STrendLine_fe5yo_gg_.__loading_fe5yo_gg_{animation-name:pulse_fe5yo;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}.___SDonutContainer_fe5yo_gg_.__semi_fe5yo_gg_ g{transform:rotate(180deg) translate(-24px,-24px)}.___SDonutContainer_fe5yo_gg_ g{transform:rotate(-90deg) translate(-24px)}.___SDonutContainer_fe5yo_gg_.__animate_fe5yo_gg_ circle{transition:all var(--intergalactic-duration-extra-slow, 500) ease-in-out}" /*__inner_css_end__*/, "fe5yo_gg_") /*__reshadow_css_end__*/, {
|
16
|
+
"__SLineGauge": "___SLineGauge_fe5yo_gg_",
|
17
|
+
"_loading": "__loading_fe5yo_gg_",
|
18
|
+
"__SDonutContainer": "___SDonutContainer_fe5yo_gg_",
|
19
|
+
"__STrendLine": "___STrendLine_fe5yo_gg_",
|
20
|
+
"__STrendBar": "___STrendBar_fe5yo_gg_",
|
21
|
+
"@pulse": "pulse_fe5yo",
|
22
|
+
"_animate": "__animate_fe5yo_gg_",
|
23
|
+
"_semi": "__semi_fe5yo_gg_"
|
24
|
+
});
|
25
|
+
var DonutRoot = /*#__PURE__*/function (_Component) {
|
26
|
+
_inherits(DonutRoot, _Component);
|
27
|
+
var _super = _createSuper(DonutRoot);
|
28
|
+
function DonutRoot() {
|
29
|
+
_classCallCheck(this, DonutRoot);
|
30
|
+
return _super.apply(this, arguments);
|
31
|
+
}
|
32
|
+
_createClass(DonutRoot, [{
|
33
|
+
key: "render",
|
34
|
+
value: function render() {
|
35
|
+
var _ref = this.asProps,
|
36
|
+
_ref2;
|
37
|
+
var SDonutContainer = Box;
|
38
|
+
var _this$asProps = this.asProps,
|
39
|
+
value = _this$asProps.value,
|
40
|
+
styles = _this$asProps.styles,
|
41
|
+
_this$asProps$color = _this$asProps.color,
|
42
|
+
color = _this$asProps$color === void 0 ? 'chart-palette-order-1' : _this$asProps$color,
|
43
|
+
resolveColor = _this$asProps.resolveColor,
|
44
|
+
isSemiDonut = _this$asProps.isSemiDonut,
|
45
|
+
loading = _this$asProps.loading;
|
46
|
+
var strokeWidth = isSemiDonut ? 6 : 4;
|
47
|
+
var radius = isSemiDonut ? 9 : 10;
|
48
|
+
var baseStrokeDasharray = isSemiDonut ? Math.PI * radius : Math.PI * 2 * radius;
|
49
|
+
var valueStrokeDasharray = baseStrokeDasharray * (value / 100);
|
50
|
+
var greyStrokeDasharray = baseStrokeDasharray * ((100 - value) / 100);
|
51
|
+
var offsetPoint = isSemiDonut ? baseStrokeDasharray / (100 / 3) : baseStrokeDasharray / 100;
|
52
|
+
var strokeDasharrayBetweenSpaces = "".concat(greyStrokeDasharray - 2 * offsetPoint, " ").concat(offsetPoint);
|
53
|
+
var spaceStrokeDasharray = "".concat(offsetPoint, " ").concat(value < 99 ? "".concat(strokeDasharrayBetweenSpaces) : '', " ").concat(baseStrokeDasharray);
|
54
|
+
if (isSemiDonut) {
|
55
|
+
spaceStrokeDasharray = "".concat(offsetPoint, " ").concat(value < 95 ? "".concat(strokeDasharrayBetweenSpaces) : '', " ").concat(baseStrokeDasharray);
|
56
|
+
}
|
57
|
+
var viewBox = isSemiDonut ? '0 0 24 12' : '0 0 24 24';
|
58
|
+
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SDonutContainer, _ref2.cn("SDonutContainer", _objectSpread({}, _assignProps({
|
59
|
+
"semi": isSemiDonut
|
60
|
+
}, _ref))), /*#__PURE__*/React.createElement("svg", _ref2.cn("svg", {
|
61
|
+
"width": '100%',
|
62
|
+
"height": '100%',
|
63
|
+
"viewBox": viewBox,
|
64
|
+
"fill": 'none'
|
65
|
+
}), /*#__PURE__*/React.createElement("g", _ref2.cn("g", {}), /*#__PURE__*/React.createElement("circle", _ref2.cn("circle", {
|
66
|
+
"cx": '12',
|
67
|
+
"cy": '12',
|
68
|
+
"r": radius,
|
69
|
+
"strokeWidth": strokeWidth,
|
70
|
+
"stroke": resolveColor('skeleton-bg'),
|
71
|
+
"strokeDasharray": loading ? undefined : "".concat(greyStrokeDasharray, " ").concat(baseStrokeDasharray),
|
72
|
+
"strokeDashoffset": -1 * valueStrokeDasharray
|
73
|
+
})), !loading && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("circle", _ref2.cn("circle", {
|
74
|
+
"cx": '12',
|
75
|
+
"cy": '12',
|
76
|
+
"r": radius,
|
77
|
+
"strokeWidth": strokeWidth,
|
78
|
+
"stroke": resolveColor(color),
|
79
|
+
"strokeDasharray": "".concat(valueStrokeDasharray, " ").concat(baseStrokeDasharray),
|
80
|
+
"strokeDashoffset": valueStrokeDasharray
|
81
|
+
}), /*#__PURE__*/React.createElement("animate", _ref2.cn("animate", {
|
82
|
+
"attributeName": 'stroke-dashoffset',
|
83
|
+
"values": "0;".concat(valueStrokeDasharray)
|
84
|
+
}))), value !== 100 && /*#__PURE__*/React.createElement("circle", _ref2.cn("circle", {
|
85
|
+
"cx": '12',
|
86
|
+
"cy": '12',
|
87
|
+
"r": radius,
|
88
|
+
"strokeWidth": strokeWidth,
|
89
|
+
"stroke": resolveColor('chart-grid-border'),
|
90
|
+
"strokeDasharray": spaceStrokeDasharray,
|
91
|
+
"strokeDashoffset": -1 * valueStrokeDasharray
|
92
|
+
}))))));
|
93
|
+
}
|
94
|
+
}]);
|
95
|
+
return DonutRoot;
|
96
|
+
}(Component);
|
97
|
+
_defineProperty(DonutRoot, "enhance", [resolveColorEnhance()]);
|
98
|
+
_defineProperty(DonutRoot, "style", style);
|
99
|
+
_defineProperty(DonutRoot, "defaultProps", {
|
100
|
+
animate: true
|
101
|
+
});
|
102
|
+
export var ScoreDonut = createComponent(DonutRoot);
|
103
|
+
ScoreDonut.displayName = 'MiniChart.ScoreDonut';
|
104
|
+
export var ScoreSemiDonut = createComponent(DonutRoot, {}, {
|
105
|
+
enhancements: [function () {
|
106
|
+
return {
|
107
|
+
wrapperProps: function wrapperProps(props) {
|
108
|
+
return assignProps(props, {
|
109
|
+
isSemiDonut: true
|
110
|
+
});
|
111
|
+
}
|
112
|
+
};
|
113
|
+
}]
|
114
|
+
});
|
115
|
+
ScoreSemiDonut.displayName = 'MiniChart.ScoreSemiDonut';
|
116
|
+
//# sourceMappingURL=Donut.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Donut.js","names":["React","createComponent","Component","Root","sstyled","Box","resolveColorEnhance","assignProps","style","_sstyled","insert","DonutRoot","_Component","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_ref","asProps","_ref2","SDonutContainer","_this$asProps","styles","_this$asProps$color","color","resolveColor","isSemiDonut","loading","strokeWidth","radius","baseStrokeDasharray","Math","PI","valueStrokeDasharray","greyStrokeDasharray","offsetPoint","strokeDasharrayBetweenSpaces","concat","spaceStrokeDasharray","viewBox","createElement","cn","_objectSpread","_assignProps","undefined","Fragment","_defineProperty","animate","ScoreDonut","displayName","ScoreSemiDonut","enhancements","wrapperProps","props"],"sources":["../../../../src/component/score/Donut.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled, ComponentType } from '@semcore/core';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';\nimport { assignProps } from '@semcore/core';\nimport { CommonScoreProps } from './Score';\n\nimport style from './donut.shadow.css';\n\nexport type ScoreDonutProps = BoxProps & CommonScoreProps;\n\ntype Enhances = {\n resolveColor: ReturnType<typeof resolveColorEnhance>;\n isSemiDonut?: true;\n};\n\nclass DonutRoot extends Component<ScoreDonutProps, {}, {}, Enhances> {\n static enhance = [resolveColorEnhance()];\n\n static style = style;\n\n static defaultProps = {\n animate: true,\n };\n\n render() {\n const SDonutContainer = Root;\n const {\n value,\n styles,\n color = 'chart-palette-order-1',\n resolveColor,\n isSemiDonut,\n loading,\n } = this.asProps;\n\n const strokeWidth = isSemiDonut ? 6 : 4;\n const radius = isSemiDonut ? 9 : 10;\n const baseStrokeDasharray = isSemiDonut ? Math.PI * radius : Math.PI * 2 * radius;\n const valueStrokeDasharray = baseStrokeDasharray * (value / 100);\n const greyStrokeDasharray = baseStrokeDasharray * ((100 - value) / 100);\n const offsetPoint = isSemiDonut ? baseStrokeDasharray / (100 / 3) : baseStrokeDasharray / 100;\n\n const strokeDasharrayBetweenSpaces = `${greyStrokeDasharray - 2 * offsetPoint} ${offsetPoint}`;\n\n let spaceStrokeDasharray = `${offsetPoint} ${\n value < 99 ? `${strokeDasharrayBetweenSpaces}` : ''\n } ${baseStrokeDasharray}`;\n\n if (isSemiDonut) {\n spaceStrokeDasharray = `${offsetPoint} ${\n value < 95 ? `${strokeDasharrayBetweenSpaces}` : ''\n } ${baseStrokeDasharray}`;\n }\n\n const viewBox = isSemiDonut ? '0 0 24 12' : '0 0 24 24';\n\n return sstyled(styles)(\n <SDonutContainer render={Box} semi={isSemiDonut}>\n <svg width='100%' height='100%' viewBox={viewBox} fill='none'>\n <g>\n <circle\n cx='12'\n cy='12'\n r={radius}\n strokeWidth={strokeWidth}\n stroke={resolveColor('skeleton-bg')}\n strokeDasharray={\n loading ? undefined : `${greyStrokeDasharray} ${baseStrokeDasharray}`\n }\n strokeDashoffset={-1 * valueStrokeDasharray}\n />\n {!loading && (\n <>\n <circle\n cx='12'\n cy='12'\n r={radius}\n strokeWidth={strokeWidth}\n stroke={resolveColor(color)}\n strokeDasharray={`${valueStrokeDasharray} ${baseStrokeDasharray}`}\n strokeDashoffset={valueStrokeDasharray}\n >\n <animate\n attributeName={'stroke-dashoffset'}\n values={`0;${valueStrokeDasharray}`}\n />\n </circle>\n {value !== 100 && (\n <circle\n cx='12'\n cy='12'\n r={radius}\n strokeWidth={strokeWidth}\n stroke={resolveColor('chart-grid-border')}\n strokeDasharray={spaceStrokeDasharray}\n strokeDashoffset={-1 * valueStrokeDasharray}\n />\n )}\n </>\n )}\n </g>\n </svg>\n </SDonutContainer>,\n );\n }\n}\n\nexport const ScoreDonut: ComponentType<ScoreDonutProps, {}, {}, Enhances> =\n createComponent(DonutRoot);\n\nScoreDonut.displayName = 'MiniChart.ScoreDonut';\n\nexport const ScoreSemiDonut: ComponentType<ScoreDonutProps, {}, {}, Enhances> = createComponent(\n DonutRoot,\n {},\n {\n enhancements: [\n () => {\n return {\n wrapperProps: (props: ScoreDonutProps) => {\n return assignProps(props, { isSemiDonut: true });\n },\n };\n },\n ],\n },\n);\n\nScoreSemiDonut.displayName = 'MiniChart.ScoreSemiDonut';\n"],"mappings":"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"}
|
@@ -0,0 +1,87 @@
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
2
|
+
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
3
|
+
import _createClass from "@babel/runtime/helpers/createClass";
|
4
|
+
import _inherits from "@babel/runtime/helpers/inherits";
|
5
|
+
import _createSuper from "@babel/runtime/helpers/createSuper";
|
6
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
7
|
+
import { sstyled as _sstyled } from 'intergalactic/core';
|
8
|
+
import { assignProps as _assignProps } from 'intergalactic/core';
|
9
|
+
import React from 'react';
|
10
|
+
import createComponent, { Component, Root, sstyled } from 'intergalactic/core';
|
11
|
+
import { Box, Flex } from 'intergalactic/flex-box';
|
12
|
+
import resolveColorEnhance from 'intergalactic/utils/lib/enhances/resolveColorEnhance';
|
13
|
+
/*__reshadow-styles__:"./line.shadow.css"*/
|
14
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes pulse_5kfd2{0%,to{opacity:1}50%{opacity:.4}}@keyframes move-line_5kfd2{0%{transform:translateX(-100%)}to{transform:translateX(0)}}.___SDonutContainer_5kfd2_gg_.__loading_5kfd2_gg_,.___SLineGauge_5kfd2_gg_.__loading_5kfd2_gg_,.___STrendBar_5kfd2_gg_.__loading_5kfd2_gg_,.___STrendLine_5kfd2_gg_.__loading_5kfd2_gg_{animation-name:pulse_5kfd2;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}.___SLineGauge_5kfd2_gg_{height:8px;background-color:var(--intergalactic-skeleton-bg, rgba(224, 225, 233, 0.8));border-radius:var(--intergalactic-chart-rounded, 2px);overflow:hidden;position:relative}.___SLineGauge_5kfd2_gg_.__animate_5kfd2_gg_ .___SLineValue_5kfd2_gg_{transition:all var(--intergalactic-duration-extra-slow, 500) ease-in-out;animation-name:move-line_5kfd2;animation-duration:.5s;animation-timing-function:ease-in-out}.___SLineValue_5kfd2_gg_{height:8px;background-color:var(--intergalactic-chart-palette-order-1, #2bb3ff);border-radius:var(--intergalactic-chart-rounded, 2px)0 0 var(--intergalactic-chart-rounded, 2px)}.___SLineValue_5kfd2_gg_.__percent_5kfd2_gg_{width:var(--percent_5kfd2)}.___SLineValue_5kfd2_gg_.__color_5kfd2_gg_{background-color:var(--color_5kfd2, var(--intergalactic-chart-palette-order-1, #2bb3ff))}.___SLineGauge_5kfd2_gg_.__segments_5kfd2_gg_{border-radius:var(--intergalactic-progress-bar-rounded, 6px)}.___SLineGauge_5kfd2_gg_.__segments_5kfd2_gg_ .___SLineValue_5kfd2_gg_{border-radius:var(--intergalactic-progress-bar-rounded, 6px)0 0 var(--intergalactic-progress-bar-rounded, 6px)}.___SLineGaugeSegment_5kfd2_gg_{position:absolute;top:0;left:0;right:0;bottom:0}.___SLineSegmentItem_5kfd2_gg_:last-child{margin-right:0;border-right:none}.___SLineSegmentItem_5kfd2_gg_{height:8px;background:0 0;margin-right:1px;border-right-color:var(--intergalactic-chart-grid-border, #ffffff);border-right-style:solid;border-right-width:1px;box-sizing:content-box}" /*__inner_css_end__*/, "5kfd2_gg_") /*__reshadow_css_end__*/, {
|
15
|
+
"__SLineGauge": "___SLineGauge_5kfd2_gg_",
|
16
|
+
"_loading": "__loading_5kfd2_gg_",
|
17
|
+
"__SDonutContainer": "___SDonutContainer_5kfd2_gg_",
|
18
|
+
"__STrendLine": "___STrendLine_5kfd2_gg_",
|
19
|
+
"__STrendBar": "___STrendBar_5kfd2_gg_",
|
20
|
+
"@pulse": "pulse_5kfd2",
|
21
|
+
"_animate": "__animate_5kfd2_gg_",
|
22
|
+
"__SLineValue": "___SLineValue_5kfd2_gg_",
|
23
|
+
"_percent": "__percent_5kfd2_gg_",
|
24
|
+
"--percent": "--percent_5kfd2",
|
25
|
+
"_color": "__color_5kfd2_gg_",
|
26
|
+
"--color": "--color_5kfd2",
|
27
|
+
"_segments": "__segments_5kfd2_gg_",
|
28
|
+
"__SLineGaugeSegment": "___SLineGaugeSegment_5kfd2_gg_",
|
29
|
+
"__SLineSegmentItem": "___SLineSegmentItem_5kfd2_gg_",
|
30
|
+
"@move-line": "move-line_5kfd2"
|
31
|
+
});
|
32
|
+
var LineRoot = /*#__PURE__*/function (_Component) {
|
33
|
+
_inherits(LineRoot, _Component);
|
34
|
+
var _super = _createSuper(LineRoot);
|
35
|
+
function LineRoot() {
|
36
|
+
_classCallCheck(this, LineRoot);
|
37
|
+
return _super.apply(this, arguments);
|
38
|
+
}
|
39
|
+
_createClass(LineRoot, [{
|
40
|
+
key: "render",
|
41
|
+
value: function render() {
|
42
|
+
var _ref = this.asProps,
|
43
|
+
_ref3;
|
44
|
+
var SLineGauge = Box;
|
45
|
+
var SLineValue = Box;
|
46
|
+
var SLineGaugeSegment = Flex;
|
47
|
+
var SLineSegmentItem = Box;
|
48
|
+
var _this$asProps = this.asProps,
|
49
|
+
value = _this$asProps.value,
|
50
|
+
styles = _this$asProps.styles,
|
51
|
+
_this$asProps$color = _this$asProps.color,
|
52
|
+
color = _this$asProps$color === void 0 ? 'chart-palette-order-1' : _this$asProps$color,
|
53
|
+
resolveColor = _this$asProps.resolveColor,
|
54
|
+
segments = _this$asProps.segments,
|
55
|
+
loading = _this$asProps.loading;
|
56
|
+
var SegmentItems = [];
|
57
|
+
if (segments) {
|
58
|
+
for (var i = 0; i < segments; i++) {
|
59
|
+
var _ref2;
|
60
|
+
var width = "calc((100% - ".concat(segments - 1, "px) / ").concat(segments, ")");
|
61
|
+
SegmentItems.push((_ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SLineSegmentItem, _ref2.cn("SLineSegmentItem", {
|
62
|
+
"key": i,
|
63
|
+
"color": i < value ? resolveColor(color) : undefined,
|
64
|
+
"w": width
|
65
|
+
}))));
|
66
|
+
}
|
67
|
+
}
|
68
|
+
var percent = "".concat(value, "%");
|
69
|
+
if (segments) {
|
70
|
+
percent = "".concat(value / segments * 100, "%");
|
71
|
+
}
|
72
|
+
return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SLineGauge, _ref3.cn("SLineGauge", _objectSpread({}, _assignProps({}, _ref))), !loading && /*#__PURE__*/React.createElement(SLineValue, _ref3.cn("SLineValue", {
|
73
|
+
"w": percent,
|
74
|
+
"color": resolveColor(color)
|
75
|
+
})), Boolean(SegmentItems.length) && /*#__PURE__*/React.createElement(SLineGaugeSegment, _ref3.cn("SLineGaugeSegment", {}), SegmentItems));
|
76
|
+
}
|
77
|
+
}]);
|
78
|
+
return LineRoot;
|
79
|
+
}(Component);
|
80
|
+
_defineProperty(LineRoot, "enhance", [resolveColorEnhance()]);
|
81
|
+
_defineProperty(LineRoot, "style", style);
|
82
|
+
_defineProperty(LineRoot, "defaultProps", {
|
83
|
+
animate: true
|
84
|
+
});
|
85
|
+
export var ScoreLine = createComponent(LineRoot);
|
86
|
+
ScoreLine.displayName = 'MiniChart.ScoreLine';
|
87
|
+
//# sourceMappingURL=Line.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Line.js","names":["React","createComponent","Component","Root","sstyled","Box","Flex","resolveColorEnhance","style","_sstyled","insert","LineRoot","_Component","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_ref","asProps","_ref3","SLineGauge","SLineValue","SLineGaugeSegment","SLineSegmentItem","_this$asProps","styles","_this$asProps$color","color","resolveColor","segments","loading","SegmentItems","i","_ref2","width","concat","push","createElement","cn","undefined","percent","_objectSpread","_assignProps","Boolean","length","_defineProperty","animate","ScoreLine","displayName"],"sources":["../../../../src/component/score/Line.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled, ComponentType } from '@semcore/core';\nimport { Box, Flex, BoxProps } from '@semcore/flex-box';\nimport resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';\nimport { CommonScoreProps } from './Score';\n\nimport style from './line.shadow.css';\n\nexport type ScoreLineGaugeProps = BoxProps &\n CommonScoreProps & {\n /**\n * Count of line segments\n */\n segments?: number;\n };\n\ntype Enhances = {\n resolveColor: ReturnType<typeof resolveColorEnhance>;\n};\n\nclass LineRoot extends Component<ScoreLineGaugeProps, {}, {}, Enhances> {\n static enhance = [resolveColorEnhance()];\n\n static style = style;\n\n static defaultProps = {\n animate: true,\n };\n\n render() {\n const SLineGauge = Root;\n const SLineValue = Box;\n const SLineGaugeSegment = Flex;\n const SLineSegmentItem = Box;\n const {\n value,\n styles,\n color = 'chart-palette-order-1',\n resolveColor,\n segments,\n loading,\n } = this.asProps;\n\n const SegmentItems = [];\n\n if (segments) {\n for (let i = 0; i < segments; i++) {\n const width = `calc((100% - ${segments - 1}px) / ${segments})`;\n\n SegmentItems.push(\n sstyled(styles)(\n <SLineSegmentItem\n key={i}\n color={i < value ? resolveColor(color) : undefined}\n w={width}\n />,\n ),\n );\n }\n }\n\n let percent = `${value}%`;\n\n if (segments) {\n percent = `${(value / segments) * 100}%`;\n }\n\n return sstyled(styles)(\n <SLineGauge render={Box}>\n {!loading && <SLineValue w={percent} color={resolveColor(color)} />}\n {Boolean(SegmentItems.length) && <SLineGaugeSegment>{SegmentItems}</SLineGaugeSegment>}\n </SLineGauge>,\n );\n }\n}\n\nexport const ScoreLine: ComponentType<ScoreLineGaugeProps, {}, {}, Enhances> =\n createComponent(LineRoot);\n\nScoreLine.displayName = 'MiniChart.ScoreLine';\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,eAAe,IAAIC,SAAS,EAAEC,IAAI,EAAEC,OAAO,QAAuB,eAAe;AACxF,SAASC,GAAG,EAAEC,IAAI,QAAkB,mBAAmB;AACvD,OAAOC,mBAAmB,MAAM,iDAAiD;AAAC;AAAA,IAAAC,KAAA,+BAAAC,QAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAAA,IAiB5EC,QAAQ,0BAAAC,UAAA;EAAAC,SAAA,CAAAF,QAAA,EAAAC,UAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,QAAA;EAAA,SAAAA,SAAA;IAAAK,eAAA,OAAAL,QAAA;IAAA,OAAAG,MAAA,CAAAG,KAAA,OAAAC,SAAA;EAAA;EAAAC,YAAA,CAAAR,QAAA;IAAAS,GAAA;IAAAC,KAAA,EASZ,SAAAC,OAAA,EAAS;MAAA,IAAAC,IAAA,QAAAC,OAAA;QAAAC,KAAA;MACP,IAAMC,UAAU,GAsCMrB,GAAG;MArCzB,IAAMsB,UAAU,GAAGtB,GAAG;MACtB,IAAMuB,iBAAiB,GAAGtB,IAAI;MAC9B,IAAMuB,gBAAgB,GAAGxB,GAAG;MAC5B,IAAAyB,aAAA,GAOI,IAAI,CAACN,OAAO;QANdH,KAAK,GAAAS,aAAA,CAALT,KAAK;QACLU,MAAM,GAAAD,aAAA,CAANC,MAAM;QAAAC,mBAAA,GAAAF,aAAA,CACNG,KAAK;QAALA,KAAK,GAAAD,mBAAA,cAAG,uBAAuB,GAAAA,mBAAA;QAC/BE,YAAY,GAAAJ,aAAA,CAAZI,YAAY;QACZC,QAAQ,GAAAL,aAAA,CAARK,QAAQ;QACRC,OAAO,GAAAN,aAAA,CAAPM,OAAO;MAGT,IAAMC,YAAY,GAAG,EAAE;MAEvB,IAAIF,QAAQ,EAAE;QACZ,KAAK,IAAIG,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,QAAQ,EAAEG,CAAC,EAAE,EAAE;UAAA,IAAAC,KAAA;UACjC,IAAMC,KAAK,mBAAAC,MAAA,CAAmBN,QAAQ,GAAG,CAAC,YAAAM,MAAA,CAASN,QAAQ,MAAG;UAE9DE,YAAY,CAACK,IAAI,EAAAH,KAAA,GACfnC,OAAO,CAAC2B,MAAM,CAAC,eACb/B,KAAA,CAAA2C,aAAA,CAACd,gBAAgB,EAAAU,KAAA,CAAAK,EAAA;YAAA,OACVN,CAAC;YAAA,SACCA,CAAC,GAAGjB,KAAK,GAAGa,YAAY,CAACD,KAAK,CAAC,GAAGY,SAAS;YAAA,KAC/CL;UAAK,GACR,EAEL;QACH;MACF;MAEA,IAAIM,OAAO,MAAAL,MAAA,CAAMpB,KAAK,MAAG;MAEzB,IAAIc,QAAQ,EAAE;QACZW,OAAO,MAAAL,MAAA,CAAOpB,KAAK,GAAGc,QAAQ,GAAI,GAAG,MAAG;MAC1C;MAEA,OAAAV,KAAA,GAAOrB,OAAO,CAAC2B,MAAM,CAAC,eACpB/B,KAAA,CAAA2C,aAAA,CAACjB,UAAU,EAAAD,KAAA,CAAAmB,EAAA,eAAAG,aAAA,KAAAC,YAAA,KAAAzB,IAAA,KACR,CAACa,OAAO,iBAAIpC,KAAA,CAAA2C,aAAA,CAAChB,UAAU,EAAAF,KAAA,CAAAmB,EAAA;QAAA,KAAIE,OAAO;QAAA,SAASZ,YAAY,CAACD,KAAK;MAAC,GAAI,EAClEgB,OAAO,CAACZ,YAAY,CAACa,MAAM,CAAC,iBAAIlD,KAAA,CAAA2C,aAAA,CAACf,iBAAiB,EAAAH,KAAA,CAAAmB,EAAA,2BAAEP,YAAY,CAAqB,CAC3E;IAEjB;EAAC;EAAA,OAAA1B,QAAA;AAAA,EArDoBT,SAAS;AAAAiD,eAAA,CAA1BxC,QAAQ,aACK,CAACJ,mBAAmB,EAAE,CAAC;AAAA4C,eAAA,CADpCxC,QAAQ,WAGGH,KAAK;AAAA2C,eAAA,CAHhBxC,QAAQ,kBAKU;EACpByC,OAAO,EAAE;AACX,CAAC;AAiDH,OAAO,IAAMC,SAA+D,GAC1EpD,eAAe,CAACU,QAAQ,CAAC;AAE3B0C,SAAS,CAACC,WAAW,GAAG,qBAAqB"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Score.js","names":[],"sources":["../../../../src/component/score/Score.ts"],"sourcesContent":["export type CommonScoreProps = {\n /**\n * Value of score (in percents from 0 to 100) or count of selected segments (for Line with segments)\n */\n value: number;\n\n /**\n * Color of value\n */\n color?: string;\n\n /**\n * Flag to enable skeleton\n * @default false\n */\n loading?: boolean;\n\n /**\n * Flag to enable animate of charts\n * @default true\n */\n animate?: boolean;\n};\n"],"mappings":""}
|
@@ -0,0 +1,17 @@
|
|
1
|
+
@import '../skeleton/skeleton.shadow.css';
|
2
|
+
|
3
|
+
SDonutContainer[semi] {
|
4
|
+
g {
|
5
|
+
transform: rotate(180deg) translate(-24px, -24px);
|
6
|
+
}
|
7
|
+
}
|
8
|
+
|
9
|
+
SDonutContainer {
|
10
|
+
g {
|
11
|
+
transform: rotate(-90deg) translate(-24px)
|
12
|
+
}
|
13
|
+
}
|
14
|
+
|
15
|
+
SDonutContainer[animate] circle {
|
16
|
+
transition: all var(--intergalactic-duration-extra-slow, 500) ease-in-out;
|
17
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","names":["ScoreDonut","ScoreSemiDonut","ScoreLine"],"sources":["../../../../src/component/score/index.ts"],"sourcesContent":["import { ScoreDonut, ScoreSemiDonut } from './Donut';\nimport { ScoreLine } from './Line';\n\nexport { ScoreDonut, ScoreSemiDonut, ScoreLine };\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,cAAc,QAAQ,SAAS;AACpD,SAASC,SAAS,QAAQ,QAAQ;AAElC,SAASF,UAAU,EAAEC,cAAc,EAAEC,SAAS"}
|