react-survey-builder 1.0.72 → 1.0.74
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/README.md +2 -0
- package/dist/app.css +1 -1
- package/dist/app.css.map +1 -1
- package/dist/bundle.js +628 -35
- package/dist/src_survey-elements-edit_jsx.bundle.js +2 -2
- package/lib/dynamic-option-list.js +140 -155
- package/lib/fieldset/FieldSet.js +118 -0
- package/lib/fieldset/index.js +2 -132
- package/lib/form-fields.js +41 -14
- package/lib/form-steps.js +793 -0
- package/lib/form.js +43 -15
- package/lib/index.js +129 -122
- package/lib/multi-column/MultiColumnRow.js +69 -81
- package/lib/multi-column/dustbin.js +52 -18
- package/lib/preview.js +378 -349
- package/lib/sortable-element.js +9 -0
- package/lib/sortable-form-elements.js +28 -2
- package/lib/step/Step.js +147 -0
- package/lib/step/index.js +2 -0
- package/lib/survey-elements/component-drag-layer.js +13 -8
- package/lib/survey-elements/component-error-message.js +1 -1
- package/lib/survey-elements/component-header.js +12 -11
- package/lib/survey-elements/custom-element.js +51 -62
- package/lib/survey-elements/header-bar.js +36 -55
- package/lib/survey-elements/index.js +372 -370
- package/lib/survey-elements/star-rating.js +232 -282
- package/lib/survey-elements-edit.js +659 -564
- package/lib/survey-place-holder.js +9 -33
- package/lib/survey-validator.js +45 -75
- package/lib/toolbar-draggable-item.js +10 -34
- package/lib/toolbar-group-item.js +1 -1
- package/lib/toolbar.js +578 -558
- package/lib/utils/objectUtils.js +139 -0
- package/package.json +6 -5
- package/types/index.d.ts +5 -0
@@ -1,17 +1,16 @@
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
2
|
+
var _excluded = ["name", "caption", "rating", "editing", "disabled", "size", "onRatingClick", "min", "max", "step", "ratingAmount"];
|
2
3
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
3
|
-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
4
|
-
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
|
5
|
-
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
6
4
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
7
5
|
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
8
|
-
function
|
9
|
-
function
|
10
|
-
function
|
11
|
-
function
|
12
|
-
function
|
13
|
-
function
|
14
|
-
function
|
6
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
7
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
8
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
9
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
10
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
11
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
12
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
13
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
|
15
14
|
import React from 'react';
|
16
15
|
import PropTypes from 'prop-types';
|
17
16
|
import ReactDOM from 'react-dom';
|
@@ -31,291 +30,241 @@ import cx from 'classnames';
|
|
31
30
|
* onRatingClick={function} - a handler function that gets called onClick of the rating (optional)
|
32
31
|
* />
|
33
32
|
*/
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
return _this;
|
55
|
-
}
|
33
|
+
|
34
|
+
var StarRating = function StarRating(_ref) {
|
35
|
+
var name = _ref.name,
|
36
|
+
caption = _ref.caption,
|
37
|
+
ratingVal = _ref.rating,
|
38
|
+
editingVal = _ref.editing,
|
39
|
+
disabled = _ref.disabled,
|
40
|
+
size = _ref.size,
|
41
|
+
onRatingClick = _ref.onRatingClick,
|
42
|
+
_ref$min = _ref.min,
|
43
|
+
min = _ref$min === void 0 ? 0 : _ref$min,
|
44
|
+
_ref$max = _ref.max,
|
45
|
+
max = _ref$max === void 0 ? 5 : _ref$max,
|
46
|
+
_ref$step = _ref.step,
|
47
|
+
step = _ref$step === void 0 ? 0.5 : _ref$step,
|
48
|
+
ratingAmount = _ref.ratingAmount,
|
49
|
+
otherProps = _objectWithoutProperties(_ref, _excluded);
|
50
|
+
var rootRef = React.useRef();
|
51
|
+
var rootContainerRef = React.useRef();
|
52
|
+
max = ratingAmount || 5;
|
56
53
|
|
57
54
|
/**
|
58
55
|
* Gets the stars based on ratingAmount
|
59
56
|
* @return {string} stars
|
60
57
|
*/
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
var numRating = this.props.ratingAmount;
|
67
|
-
for (var i = 0; i < numRating; i++) {
|
68
|
-
stars += "\u2605";
|
69
|
-
}
|
70
|
-
return stars;
|
71
|
-
}
|
72
|
-
|
73
|
-
// componentWillMount() {
|
74
|
-
// this.min = 0;
|
75
|
-
// this.max = this.props.ratingAmount || 5;
|
76
|
-
// if (this.props.rating) {
|
77
|
-
// this.state.editing = this.props.editing || false;
|
78
|
-
// const ratingVal = this.props.rating;
|
79
|
-
// this.state.ratingCache.pos = this.getStarRatingPosition(ratingVal);
|
80
|
-
// this.state.ratingCache.rating = ratingVal;
|
81
|
-
|
82
|
-
// this.setState({
|
83
|
-
// ratingCache: this.state.ratingCache,
|
84
|
-
// rating: ratingVal,
|
85
|
-
// pos: this.getStarRatingPosition(ratingVal),
|
86
|
-
// });
|
87
|
-
// }
|
88
|
-
// }
|
89
|
-
}, {
|
90
|
-
key: "componentDidMount",
|
91
|
-
value: function componentDidMount() {
|
92
|
-
this.root = ReactDOM.findDOMNode(this.rootNode);
|
93
|
-
this.ratingContainer = ReactDOM.findDOMNode(this.node);
|
94
|
-
}
|
95
|
-
}, {
|
96
|
-
key: "componentWillUnmount",
|
97
|
-
value: function componentWillUnmount() {
|
98
|
-
delete this.root;
|
99
|
-
delete this.ratingContainer;
|
100
|
-
}
|
101
|
-
}, {
|
102
|
-
key: "getPosition",
|
103
|
-
value: function getPosition(e) {
|
104
|
-
return e.pageX - this.root.getBoundingClientRect().left;
|
105
|
-
}
|
106
|
-
}, {
|
107
|
-
key: "applyPrecision",
|
108
|
-
value: function applyPrecision(val, precision) {
|
109
|
-
return parseFloat(val.toFixed(precision));
|
110
|
-
}
|
111
|
-
}, {
|
112
|
-
key: "getDecimalPlaces",
|
113
|
-
value: function getDecimalPlaces(num) {
|
114
|
-
var match = "".concat(num).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
|
115
|
-
return !match ? 0 : Math.max(0, (match[1] ? match[1].length : 0) - (match[2] ? +match[2] : 0));
|
116
|
-
}
|
117
|
-
}, {
|
118
|
-
key: "getWidthFromValue",
|
119
|
-
value: function getWidthFromValue(val) {
|
120
|
-
var min = this.min;
|
121
|
-
var max = this.max;
|
122
|
-
if (val <= min || min === max) {
|
123
|
-
return 0;
|
124
|
-
}
|
125
|
-
if (val >= max) {
|
126
|
-
return 100;
|
127
|
-
}
|
128
|
-
return val / (max - min) * 100;
|
129
|
-
}
|
130
|
-
}, {
|
131
|
-
key: "getValueFromPosition",
|
132
|
-
value: function getValueFromPosition(pos) {
|
133
|
-
var precision = this.getDecimalPlaces(this.props.step);
|
134
|
-
var maxWidth = this.ratingContainer.offsetWidth;
|
135
|
-
var diff = this.max - this.min;
|
136
|
-
var factor = diff * pos / (maxWidth * this.props.step);
|
137
|
-
factor = Math.ceil(factor);
|
138
|
-
var val = this.applyPrecision(parseFloat(this.min + factor * this.props.step), precision);
|
139
|
-
val = Math.max(Math.min(val, this.max), this.min);
|
140
|
-
return val;
|
141
|
-
}
|
142
|
-
}, {
|
143
|
-
key: "calculate",
|
144
|
-
value: function calculate(pos) {
|
145
|
-
var val = this.getValueFromPosition(pos);
|
146
|
-
var width = this.getWidthFromValue(val);
|
147
|
-
width += '%';
|
148
|
-
return {
|
149
|
-
width: width,
|
150
|
-
val: val
|
151
|
-
};
|
152
|
-
}
|
153
|
-
}, {
|
154
|
-
key: "getStarRatingPosition",
|
155
|
-
value: function getStarRatingPosition(val) {
|
156
|
-
var width = "".concat(this.getWidthFromValue(val), "%");
|
157
|
-
return width;
|
58
|
+
var getStars = function getStars() {
|
59
|
+
var stars = '';
|
60
|
+
var numRating = ratingAmount;
|
61
|
+
for (var i = 0; i < numRating; i++) {
|
62
|
+
stars += "\u2605";
|
158
63
|
}
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
64
|
+
return stars;
|
65
|
+
};
|
66
|
+
var getPosition = function getPosition(e) {
|
67
|
+
var _rootRef$current$getB, _rootRef$current;
|
68
|
+
return e.pageX - ((_rootRef$current$getB = rootRef === null || rootRef === void 0 || (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 || (_rootRef$current = _rootRef$current.getBoundingClientRect()) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.left) !== null && _rootRef$current$getB !== void 0 ? _rootRef$current$getB : 0);
|
69
|
+
};
|
70
|
+
var applyPrecision = function applyPrecision(val, precision) {
|
71
|
+
return parseFloat(val.toFixed(precision));
|
72
|
+
};
|
73
|
+
var getDecimalPlaces = function getDecimalPlaces(num) {
|
74
|
+
var match = "".concat(num).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
|
75
|
+
return !match ? 0 : Math.max(0, (match[1] ? match[1].length : 0) - (match[2] ? +match[2] : 0));
|
76
|
+
};
|
77
|
+
var getWidthFromValue = function getWidthFromValue(val) {
|
78
|
+
if (val <= min || min === max) {
|
79
|
+
return 0;
|
164
80
|
}
|
165
|
-
|
166
|
-
|
167
|
-
value: function getSvg() {
|
168
|
-
return /*#__PURE__*/React.createElement("svg", {
|
169
|
-
className: "react-star-rating__star",
|
170
|
-
viewBox: "0 0 286 272",
|
171
|
-
version: "1.1",
|
172
|
-
xmlns: "http://www.w3.org/2000/svg"
|
173
|
-
}, /*#__PURE__*/React.createElement("g", {
|
174
|
-
stroke: "none",
|
175
|
-
"stroke-width": "1",
|
176
|
-
fill: "none",
|
177
|
-
"fill-rule": "evenodd"
|
178
|
-
}, /*#__PURE__*/React.createElement("polygon", {
|
179
|
-
id: "star-flat",
|
180
|
-
points: "143 225 54.8322122 271.352549 71.6707613 173.176275 0.341522556 103.647451 98.9161061 89.3237254 143 0 187.083894 89.3237254 285.658477 103.647451 214.329239 173.176275 231.167788 271.352549 "
|
181
|
-
})));
|
81
|
+
if (val >= max) {
|
82
|
+
return 100;
|
182
83
|
}
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
84
|
+
return val / (max - min) * 100;
|
85
|
+
};
|
86
|
+
var getValueFromPosition = function getValueFromPosition(pos) {
|
87
|
+
var _rootContainerRef$cur, _rootContainerRef$cur2;
|
88
|
+
var precision = getDecimalPlaces(step);
|
89
|
+
var maxWidth = (_rootContainerRef$cur = rootContainerRef === null || rootContainerRef === void 0 || (_rootContainerRef$cur2 = rootContainerRef.current) === null || _rootContainerRef$cur2 === void 0 ? void 0 : _rootContainerRef$cur2.offsetWidth) !== null && _rootContainerRef$cur !== void 0 ? _rootContainerRef$cur : 30;
|
90
|
+
var diff = max - min;
|
91
|
+
var factor = diff * pos / (maxWidth * step);
|
92
|
+
factor = Math.ceil(factor);
|
93
|
+
var val = applyPrecision(parseFloat(min + factor * step), precision);
|
94
|
+
val = Math.max(Math.min(val, max), min);
|
95
|
+
return val;
|
96
|
+
};
|
97
|
+
var calculate = function calculate(pos) {
|
98
|
+
var val = getValueFromPosition(pos);
|
99
|
+
var width = getWidthFromValue(val);
|
100
|
+
width += '%';
|
101
|
+
return {
|
102
|
+
width: width,
|
103
|
+
val: val
|
104
|
+
};
|
105
|
+
};
|
106
|
+
var getStarRatingPosition = function getStarRatingPosition(val) {
|
107
|
+
return "".concat(getWidthFromValue(val), "%");
|
108
|
+
};
|
109
|
+
var getRatingEvent = function getRatingEvent(e) {
|
110
|
+
var pos = getPosition(e);
|
111
|
+
return calculate(pos);
|
112
|
+
};
|
113
|
+
var getSvg = function getSvg() {
|
114
|
+
return /*#__PURE__*/React.createElement("svg", {
|
115
|
+
className: "react-star-rating__star",
|
116
|
+
viewBox: "0 0 286 272",
|
117
|
+
version: "1.1",
|
118
|
+
xmlns: "http://www.w3.org/2000/svg"
|
119
|
+
}, /*#__PURE__*/React.createElement("g", {
|
120
|
+
stroke: "none",
|
121
|
+
"stroke-width": "1",
|
122
|
+
fill: "none",
|
123
|
+
"fill-rule": "evenodd"
|
124
|
+
}, /*#__PURE__*/React.createElement("polygon", {
|
125
|
+
id: "star-flat",
|
126
|
+
points: "143 225 54.8322122 271.352549 71.6707613 173.176275 0.341522556 103.647451 98.9161061 89.3237254 143 0 187.083894 89.3237254 285.658477 103.647451 214.329239 173.176275 231.167788 271.352549 "
|
127
|
+
})));
|
128
|
+
};
|
129
|
+
var handleMouseLeave = function handleMouseLeave() {
|
130
|
+
setPos(ratingCache.pos);
|
131
|
+
setRating(!isNaN(ratingCache.rating) ? Number(ratingCache.rating) : 0);
|
132
|
+
};
|
133
|
+
var handleMouseMove = function handleMouseMove(e) {
|
134
|
+
// get hover position
|
135
|
+
var ratingEvent = getRatingEvent(e);
|
136
|
+
updateRating(ratingEvent.width, ratingEvent.val);
|
137
|
+
};
|
138
|
+
var updateRating = function updateRating(width, val) {
|
139
|
+
setPos(width);
|
140
|
+
setRating(!isNaN(val) ? Number(val) : 0);
|
141
|
+
};
|
142
|
+
|
143
|
+
// React.memo(StarRating,)
|
144
|
+
|
145
|
+
// const shouldComponentUpdate = (nextProps, nextState) => {
|
146
|
+
// if (nextProps !== props) {
|
147
|
+
// updateRating(getStarRatingPosition(nextProps.rating), nextProps.rating,);
|
148
|
+
// return true;
|
149
|
+
// }
|
150
|
+
// return nextState.ratingCache.rating !== this.state.ratingCache.rating || nextState.rating !== this.state.rating;
|
151
|
+
// }
|
152
|
+
|
153
|
+
var handleClick = function handleClick(e) {
|
154
|
+
// is it disabled?
|
155
|
+
if (disabled) {
|
156
|
+
e.stopPropagation();
|
157
|
+
e.preventDefault();
|
158
|
+
return false;
|
214
159
|
}
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
var ratingCache = {
|
225
|
-
pos: this.state.pos,
|
226
|
-
rating: this.state.rating,
|
227
|
-
caption: this.props.caption,
|
228
|
-
name: this.props.name
|
229
|
-
};
|
230
|
-
this.setState({
|
231
|
-
ratingCache: ratingCache
|
232
|
-
});
|
233
|
-
this.props.onRatingClick(e, ratingCache);
|
234
|
-
return true;
|
160
|
+
var ratingCacheObj = {
|
161
|
+
pos: pos,
|
162
|
+
rating: rating,
|
163
|
+
caption: caption,
|
164
|
+
name: name
|
165
|
+
};
|
166
|
+
setRatingCache(ratingCacheObj);
|
167
|
+
if (onRatingClick) {
|
168
|
+
onRatingClick(e, ratingCache);
|
235
169
|
}
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
}
|
242
|
-
return null;
|
170
|
+
return true;
|
171
|
+
};
|
172
|
+
var treatName = function treatName(title) {
|
173
|
+
if (typeof title === 'string') {
|
174
|
+
return title.toLowerCase().split(' ').join('_');
|
243
175
|
}
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
176
|
+
return null;
|
177
|
+
};
|
178
|
+
var _React$useState = React.useState({
|
179
|
+
pos: ratingVal ? getStarRatingPosition(ratingVal) : 0,
|
180
|
+
rating: !isNaN(ratingVal) ? parseFloat(ratingVal, 10) : 0
|
181
|
+
}),
|
182
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
183
|
+
ratingCache = _React$useState2[0],
|
184
|
+
setRatingCache = _React$useState2[1];
|
185
|
+
var _React$useState3 = React.useState(editingVal || !ratingVal),
|
186
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
187
|
+
editing = _React$useState4[0],
|
188
|
+
setEditing = _React$useState4[1];
|
189
|
+
var _React$useState5 = React.useState(5),
|
190
|
+
_React$useState6 = _slicedToArray(_React$useState5, 2),
|
191
|
+
stars = _React$useState6[0],
|
192
|
+
setStars = _React$useState6[1];
|
193
|
+
var _React$useState7 = React.useState(!isNaN(ratingCache.rating) ? parseFloat(ratingCache.rating, 10) : 0),
|
194
|
+
_React$useState8 = _slicedToArray(_React$useState7, 2),
|
195
|
+
rating = _React$useState8[0],
|
196
|
+
setRating = _React$useState8[1];
|
197
|
+
var _React$useState9 = React.useState(ratingCache.pos),
|
198
|
+
_React$useState10 = _slicedToArray(_React$useState9, 2),
|
199
|
+
pos = _React$useState10[0],
|
200
|
+
setPos = _React$useState10[1];
|
201
|
+
var _React$useState11 = React.useState(getStars()),
|
202
|
+
_React$useState12 = _slicedToArray(_React$useState11, 2),
|
203
|
+
glyph = _React$useState12[0],
|
204
|
+
setGlyph = _React$useState12[1];
|
253
205
|
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
206
|
+
// let caption = null;
|
207
|
+
var classes = cx(_defineProperty(_defineProperty({
|
208
|
+
'react-star-rating__root': true,
|
209
|
+
'rating-disabled': disabled
|
210
|
+
}, "react-star-rating__size--".concat(size), size), 'rating-editing', editing));
|
258
211
|
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
starRating = /*#__PURE__*/React.createElement("div", {
|
280
|
-
ref: function ref(c) {
|
281
|
-
return _this2.node = c;
|
282
|
-
},
|
283
|
-
className: "rating-container rating-gly-star",
|
284
|
-
"data-content": this.state.glyph
|
285
|
-
}, /*#__PURE__*/React.createElement("div", {
|
286
|
-
className: "rating-stars",
|
287
|
-
"data-content": this.state.glyph,
|
288
|
-
style: {
|
289
|
-
width: this.state.pos
|
290
|
-
}
|
291
|
-
}));
|
212
|
+
// is there a caption?
|
213
|
+
// if (caption) {
|
214
|
+
// caption = (<span className="react-rating-caption">{caption}</span>);
|
215
|
+
// }
|
216
|
+
|
217
|
+
// are we editing this rating?
|
218
|
+
var starRating;
|
219
|
+
if (editing) {
|
220
|
+
starRating = /*#__PURE__*/React.createElement("div", {
|
221
|
+
ref: rootContainerRef,
|
222
|
+
className: "rating-container rating-gly-star",
|
223
|
+
"data-content": glyph,
|
224
|
+
onMouseMove: handleMouseMove,
|
225
|
+
onMouseLeave: handleMouseLeave,
|
226
|
+
onClick: handleClick
|
227
|
+
}, /*#__PURE__*/React.createElement("div", {
|
228
|
+
className: "rating-stars",
|
229
|
+
"data-content": glyph,
|
230
|
+
style: {
|
231
|
+
width: pos
|
292
232
|
}
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
|
307
|
-
|
308
|
-
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
|
315
|
-
|
316
|
-
|
317
|
-
|
318
|
-
|
233
|
+
}));
|
234
|
+
} else {
|
235
|
+
starRating = /*#__PURE__*/React.createElement("div", {
|
236
|
+
ref: rootContainerRef,
|
237
|
+
className: "rating-container rating-gly-star",
|
238
|
+
"data-content": glyph
|
239
|
+
}, /*#__PURE__*/React.createElement("div", {
|
240
|
+
className: "rating-stars",
|
241
|
+
"data-content": glyph,
|
242
|
+
style: {
|
243
|
+
width: pos
|
244
|
+
}
|
245
|
+
}));
|
246
|
+
}
|
247
|
+
return /*#__PURE__*/React.createElement("span", {
|
248
|
+
className: "react-star-rating"
|
249
|
+
}, /*#__PURE__*/React.createElement("span", {
|
250
|
+
ref: rootRef,
|
251
|
+
style: {
|
252
|
+
cursor: 'pointer'
|
253
|
+
},
|
254
|
+
className: classes
|
255
|
+
}, starRating, /*#__PURE__*/React.createElement("input", {
|
256
|
+
type: "hidden",
|
257
|
+
name: name,
|
258
|
+
value: ratingCache.rating,
|
259
|
+
style: {
|
260
|
+
display: 'none !important',
|
261
|
+
width: 65
|
262
|
+
},
|
263
|
+
min: min,
|
264
|
+
max: max,
|
265
|
+
readOnly: true
|
266
|
+
})));
|
267
|
+
};
|
319
268
|
StarRating.propTypes = {
|
320
269
|
name: PropTypes.string.isRequired,
|
321
270
|
caption: PropTypes.string,
|
@@ -331,4 +280,5 @@ StarRating.defaultProps = {
|
|
331
280
|
ratingAmount: 5,
|
332
281
|
onRatingClick: function onRatingClick() {},
|
333
282
|
disabled: false
|
334
|
-
};
|
283
|
+
};
|
284
|
+
export default StarRating;
|