Star.js
3.62 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import React from 'react';
var Star = /*#__PURE__*/function (_React$Component) {
_inherits(Star, _React$Component);
var _super = _createSuper(Star);
function Star() {
var _this;
_classCallCheck(this, Star);
_this = _super.apply(this, arguments);
_this.onHover = function (e) {
var _this$props = _this.props,
onHover = _this$props.onHover,
index = _this$props.index;
onHover(e, index);
};
_this.onClick = function (e) {
var _this$props2 = _this.props,
onClick = _this$props2.onClick,
index = _this$props2.index;
onClick(e, index);
};
_this.onKeyDown = function (e) {
var _this$props3 = _this.props,
onClick = _this$props3.onClick,
index = _this$props3.index;
if (e.keyCode === 13) {
onClick(e, index);
}
};
return _this;
}
_createClass(Star, [{
key: "getClassName",
value: function getClassName() {
var _this$props4 = this.props,
prefixCls = _this$props4.prefixCls,
index = _this$props4.index,
value = _this$props4.value,
allowHalf = _this$props4.allowHalf,
focused = _this$props4.focused;
var starValue = index + 1;
var className = prefixCls;
if (value === 0 && index === 0 && focused) {
className += " ".concat(prefixCls, "-focused");
} else if (allowHalf && value + 0.5 >= starValue && value < starValue) {
className += " ".concat(prefixCls, "-half ").concat(prefixCls, "-active");
if (focused) {
className += " ".concat(prefixCls, "-focused");
}
} else {
className += starValue <= value ? " ".concat(prefixCls, "-full") : " ".concat(prefixCls, "-zero");
if (starValue === value && focused) {
className += " ".concat(prefixCls, "-focused");
}
}
return className;
}
}, {
key: "render",
value: function render() {
var onHover = this.onHover,
onClick = this.onClick,
onKeyDown = this.onKeyDown;
var _this$props5 = this.props,
disabled = _this$props5.disabled,
prefixCls = _this$props5.prefixCls,
character = _this$props5.character,
characterRender = _this$props5.characterRender,
index = _this$props5.index,
count = _this$props5.count,
value = _this$props5.value;
var characterNode = typeof character === 'function' ? character(this.props) : character;
var start = /*#__PURE__*/React.createElement("li", {
className: this.getClassName()
}, /*#__PURE__*/React.createElement("div", {
onClick: disabled ? null : onClick,
onKeyDown: disabled ? null : onKeyDown,
onMouseMove: disabled ? null : onHover,
role: "radio",
"aria-checked": value > index ? 'true' : 'false',
"aria-posinset": index + 1,
"aria-setsize": count,
tabIndex: disabled ? -1 : 0
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-first")
}, characterNode), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-second")
}, characterNode)));
if (characterRender) {
start = characterRender(start, this.props);
}
return start;
}
}]);
return Star;
}(React.Component);
export { Star as default };