choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
120 lines (101 loc) • 4.02 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function _createSuper(Derived) {
function isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
return true;
} catch (e) {
return false;
}
}
return function () {
var Super = _getPrototypeOf(Derived),
result;
if (isNativeReflectConstruct()) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
import React, { Component } from 'react';
import enhancer from './enhancer';
import { defaultProps, propTypes } from './types';
var Line =
/*#__PURE__*/
function (_Component) {
_inherits(Line, _Component);
var _super = _createSuper(Line);
function Line() {
_classCallCheck(this, Line);
return _super.apply(this, arguments);
}
_createClass(Line, [{
key: "render",
value: function render() {
var _this = this;
var _this$props = this.props,
className = _this$props.className,
percent = _this$props.percent,
prefixCls = _this$props.prefixCls,
strokeColor = _this$props.strokeColor,
strokeLinecap = _this$props.strokeLinecap,
strokeWidth = _this$props.strokeWidth,
style = _this$props.style,
trailColor = _this$props.trailColor,
trailWidth = _this$props.trailWidth,
restProps = _objectWithoutProperties(_this$props, ["className", "percent", "prefixCls", "strokeColor", "strokeLinecap", "strokeWidth", "style", "trailColor", "trailWidth"]);
delete restProps.gapPosition;
var pathStyle = {
strokeDasharray: '100px, 100px',
strokeDashoffset: "".concat(100 - percent, "px"),
transition: 'stroke-dashoffset 0.3s ease 0s, stroke 0.3s linear'
};
var center = strokeWidth / 2;
var right = 100 - strokeWidth / 2;
var pathString = "M ".concat(strokeLinecap === 'round' ? center : 0, ",").concat(center, "\n L ").concat(strokeLinecap === 'round' ? right : 100, ",").concat(center);
var viewBoxString = "0 0 100 ".concat(strokeWidth);
return React.createElement("svg", _extends({
className: "".concat(prefixCls, "-line ").concat(className),
viewBox: viewBoxString,
preserveAspectRatio: "none",
style: style
}, restProps), React.createElement("path", {
className: "".concat(prefixCls, "-line-trail"),
d: pathString,
strokeLinecap: strokeLinecap,
stroke: trailColor,
strokeWidth: trailWidth || strokeWidth,
fillOpacity: "0"
}), React.createElement("path", {
className: "".concat(prefixCls, "-line-path"),
d: pathString,
strokeLinecap: strokeLinecap,
stroke: strokeColor,
strokeWidth: strokeWidth,
fillOpacity: "0",
ref: function ref(path) {
_this.path = path;
},
style: pathStyle
}));
}
}]);
return Line;
}(Component);
_defineProperty(Line, "propTypes", propTypes);
_defineProperty(Line, "defaultProps", defaultProps);
export default enhancer(Line);
//# sourceMappingURL=Line.js.map