@progress/kendo-react-inputs 14.5.0-develop.8 → 15.0.0-develop.1
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/MaskedTextBoxMcpWrapper.d.ts +17 -0
- package/MaskedTextBoxMcpWrapper.js +8 -0
- package/MaskedTextBoxMcpWrapper.mjs +18 -0
- package/README.md +4 -4
- package/checkbox/Checkbox.js +1 -1
- package/checkbox/Checkbox.mjs +64 -64
- package/colors/ColorGradient.js +1 -1
- package/colors/ColorGradient.mjs +74 -72
- package/colors/ColorInput.js +1 -1
- package/colors/ColorInput.mjs +57 -45
- package/colors/ColorPalette.js +1 -1
- package/colors/ColorPalette.mjs +84 -81
- package/colors/ColorPicker.js +1 -1
- package/colors/ColorPicker.mjs +228 -215
- package/colors/FlatColorPicker.js +1 -1
- package/colors/FlatColorPicker.mjs +86 -94
- package/colors/interfaces/ColorPickerProps.d.ts +6 -1
- package/dist/cdn/js/kendo-react-inputs.js +1 -1
- package/index.d.mts +5 -1
- package/index.d.ts +5 -1
- package/index.js +1 -1
- package/index.mjs +92 -89
- package/maskedtextbox/MaskedTextBoxProps.d.ts +6 -1
- package/messages/index.d.ts +55 -0
- package/messages/index.js +1 -1
- package/messages/index.mjs +82 -60
- package/numerictextbox/NumericTextBox.js +1 -1
- package/numerictextbox/NumericTextBox.mjs +215 -213
- package/numerictextbox/interfaces/NumericTextBoxProps.d.ts +6 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +16 -11
- package/radiobutton/RadioButton.js +1 -1
- package/radiobutton/RadioButton.mjs +23 -20
- package/radiobutton/interfaces/RadioButtonProps.d.ts +7 -0
- package/range-slider/RangeSlider.d.ts +14 -1
- package/range-slider/RangeSlider.js +11 -11
- package/range-slider/RangeSlider.mjs +188 -185
- package/rating/Rating.d.ts +6 -1
- package/rating/Rating.js +3 -3
- package/rating/Rating.mjs +83 -76
- package/signature/Signature.js +1 -1
- package/signature/Signature.mjs +127 -129
- package/signature/interfaces/SignatureProps.d.ts +6 -1
- package/slider/Slider.d.ts +6 -1
- package/slider/Slider.js +1 -1
- package/slider/Slider.mjs +155 -150
- package/slider/SliderLabel.js +1 -1
- package/slider/SliderLabel.mjs +3 -2
- package/switch/Switch.d.ts +6 -1
- package/switch/Switch.js +1 -1
- package/switch/Switch.mjs +100 -100
- package/textarea/TextArea.js +1 -1
- package/textarea/TextArea.mjs +101 -101
- package/textarea/interfaces/TextAreaProps.d.ts +6 -1
- package/textbox/Textbox.d.ts +20 -1
- package/textbox/Textbox.js +1 -1
- package/textbox/Textbox.mjs +92 -81
|
@@ -5,215 +5,216 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
import * as
|
|
8
|
+
import * as t from "react";
|
|
9
9
|
import S from "prop-types";
|
|
10
|
-
import { validatePackage as
|
|
11
|
-
import {
|
|
12
|
-
import { useLocalization as
|
|
13
|
-
import { RANGE_ACTION as r, rangeReducer as
|
|
14
|
-
import { packageMetadata as
|
|
15
|
-
const
|
|
16
|
-
const [
|
|
17
|
-
(
|
|
18
|
-
const h =
|
|
19
|
-
|
|
10
|
+
import { validatePackage as J, getLicenseMessage as Q, usePropsContext as Z, useWebMcpRegister as ee, useDir as ae, Keys as u, useDraggable as te, classNames as re, getTabIndex as z, WatermarkOverlay as ne, createPropsContext as le } from "@progress/kendo-react-common";
|
|
11
|
+
import { rangeSliderAriaLabel as P, messages as E, sliderDragTitle as C } from "../messages/index.mjs";
|
|
12
|
+
import { useLocalization as se } from "@progress/kendo-react-intl";
|
|
13
|
+
import { RANGE_ACTION as r, rangeReducer as ie } from "./range-raducer.mjs";
|
|
14
|
+
import { packageMetadata as K } from "../package-metadata.mjs";
|
|
15
|
+
const ce = (n, s, m) => {
|
|
16
|
+
const [i, c] = t.useState(n), e = t.useCallback(
|
|
17
|
+
(p) => {
|
|
18
|
+
const h = ie(s.state || i, { ...p, ...s });
|
|
19
|
+
m && m(h, p.event), c(h);
|
|
20
20
|
},
|
|
21
|
-
[s,
|
|
21
|
+
[s, m]
|
|
22
22
|
);
|
|
23
|
-
return [
|
|
24
|
-
},
|
|
25
|
-
const
|
|
26
|
-
step:
|
|
27
|
-
largeStep:
|
|
28
|
-
defaultValue:
|
|
29
|
-
vertical:
|
|
30
|
-
disabled:
|
|
31
|
-
...
|
|
32
|
-
},
|
|
23
|
+
return [i, e];
|
|
24
|
+
}, de = le(), A = t.forwardRef((n, s) => {
|
|
25
|
+
const m = !J(K, { component: "RangeSlider" }), i = Q(K), c = Z(de, n), e = {
|
|
26
|
+
step: k.step,
|
|
27
|
+
largeStep: k.largeStep,
|
|
28
|
+
defaultValue: k.defaultValue,
|
|
29
|
+
vertical: k.vertical,
|
|
30
|
+
disabled: k.disabled,
|
|
31
|
+
...c
|
|
32
|
+
}, p = t.useRef(null), h = t.useRef(null), H = t.useRef(null), w = t.useRef(null), $ = t.useRef(null), W = t.useCallback(() => {
|
|
33
33
|
w.current && w.current.focus();
|
|
34
34
|
}, [w]);
|
|
35
|
-
|
|
35
|
+
t.useImperativeHandle(p, () => ({
|
|
36
36
|
element: h.current,
|
|
37
|
-
focus:
|
|
37
|
+
focus: W,
|
|
38
38
|
props: e
|
|
39
|
-
})),
|
|
40
|
-
const g =
|
|
41
|
-
() => e.step !== void 0 ? e.step :
|
|
42
|
-
[e.step,
|
|
43
|
-
), O =
|
|
44
|
-
() => e.largeStep !== void 0 ? e.largeStep :
|
|
45
|
-
[e.largeStep,
|
|
46
|
-
),
|
|
47
|
-
e.onChange &&
|
|
48
|
-
value:
|
|
49
|
-
target:
|
|
50
|
-
syntheticEvent:
|
|
39
|
+
})), t.useImperativeHandle(s, () => p.current), ee("rangeslider", p, e, e.webMcp);
|
|
40
|
+
const g = t.useMemo(() => e.min, [e.min]), b = t.useMemo(() => e.max, [e.max]), N = t.useMemo(
|
|
41
|
+
() => e.step !== void 0 ? e.step : k.step,
|
|
42
|
+
[e.step, k.step]
|
|
43
|
+
), O = t.useMemo(
|
|
44
|
+
() => e.largeStep !== void 0 ? e.largeStep : k.largeStep,
|
|
45
|
+
[e.largeStep, k.largeStep]
|
|
46
|
+
), d = ae(h, e.dir), q = (a, o) => {
|
|
47
|
+
e.onChange && p.current && e.onChange.call(void 0, {
|
|
48
|
+
value: a,
|
|
49
|
+
target: p.current,
|
|
50
|
+
syntheticEvent: o
|
|
51
51
|
});
|
|
52
|
-
}, [
|
|
53
|
-
e.defaultValue ||
|
|
52
|
+
}, [M, V] = t.useState(""), [x, l] = ce(
|
|
53
|
+
e.defaultValue || k.defaultValue,
|
|
54
54
|
{
|
|
55
55
|
min: g,
|
|
56
|
-
max:
|
|
56
|
+
max: b,
|
|
57
57
|
step: N,
|
|
58
58
|
largeStep: O,
|
|
59
59
|
state: e.value
|
|
60
60
|
},
|
|
61
|
-
|
|
62
|
-
),
|
|
61
|
+
q
|
|
62
|
+
), f = t.useMemo(() => e.value || x, [e.value, x]), B = t.useRef(null), R = t.useRef(null), y = t.useMemo(() => (f.start - g) / (b - g) * 100, [f.start, g, b]), D = t.useMemo(() => (f.end - g) / (b - g) * 100, [f.end, g, b]), G = t.useMemo(
|
|
63
63
|
() => e.vertical ? { paddingTop: 0, height: "100%" } : {},
|
|
64
64
|
[e.vertical]
|
|
65
|
-
),
|
|
65
|
+
), U = t.useMemo(
|
|
66
66
|
() => e.vertical ? { marginTop: "0.5rem", marginBottom: "0.5rem" } : { marginLeft: "0.5rem", marginRight: "0.5rem" },
|
|
67
67
|
[e.vertical]
|
|
68
|
-
),
|
|
69
|
-
(
|
|
68
|
+
), I = se(), L = t.useCallback(
|
|
69
|
+
(a) => {
|
|
70
70
|
if (!R.current)
|
|
71
71
|
return;
|
|
72
|
-
const
|
|
73
|
-
return g +
|
|
72
|
+
const o = R.current.getBoundingClientRect(), v = e.vertical ? o.bottom - a.clientY : d === "rtl" ? o.right - a.clientX : a.clientX - o.left, T = e.vertical ? o.height : o.width, j = v / T;
|
|
73
|
+
return g + j * (b - g);
|
|
74
74
|
},
|
|
75
75
|
[
|
|
76
76
|
R,
|
|
77
77
|
e.vertical,
|
|
78
|
-
|
|
78
|
+
d,
|
|
79
79
|
g,
|
|
80
|
-
|
|
80
|
+
b,
|
|
81
81
|
x.start,
|
|
82
82
|
x.end,
|
|
83
83
|
e.value && e.value.start,
|
|
84
84
|
e.value && e.value.end
|
|
85
85
|
]
|
|
86
|
-
),
|
|
87
|
-
(
|
|
86
|
+
), X = t.useCallback(
|
|
87
|
+
(a) => a <= f.start ? "start" : a >= f.end ? "end" : 2 * a < f.end + f.start ? "start" : "end",
|
|
88
88
|
[x.start, x.end, e.value && e.value.start, e.value && e.value.end]
|
|
89
|
-
),
|
|
90
|
-
(
|
|
89
|
+
), F = t.useCallback(
|
|
90
|
+
(a) => {
|
|
91
91
|
if (!e.disabled)
|
|
92
|
-
switch (
|
|
93
|
-
case
|
|
94
|
-
|
|
95
|
-
type:
|
|
92
|
+
switch (a.keyCode) {
|
|
93
|
+
case u.right:
|
|
94
|
+
a.preventDefault(), l({
|
|
95
|
+
type: d === "rtl" ? r.decrease : r.increase,
|
|
96
96
|
key: "start",
|
|
97
|
-
event:
|
|
97
|
+
event: a
|
|
98
98
|
});
|
|
99
99
|
break;
|
|
100
|
-
case
|
|
101
|
-
|
|
100
|
+
case u.up:
|
|
101
|
+
a.preventDefault(), l({ type: r.increase, key: "start", event: a });
|
|
102
102
|
break;
|
|
103
|
-
case
|
|
104
|
-
|
|
105
|
-
type:
|
|
103
|
+
case u.left:
|
|
104
|
+
a.preventDefault(), l({
|
|
105
|
+
type: d === "rtl" ? r.increase : r.decrease,
|
|
106
106
|
key: "start",
|
|
107
|
-
event:
|
|
107
|
+
event: a
|
|
108
108
|
});
|
|
109
109
|
break;
|
|
110
|
-
case
|
|
111
|
-
|
|
110
|
+
case u.down:
|
|
111
|
+
a.preventDefault(), l({ type: r.decrease, key: "start", event: a });
|
|
112
112
|
break;
|
|
113
|
-
case
|
|
114
|
-
|
|
113
|
+
case u.home:
|
|
114
|
+
a.preventDefault(), l({ type: r.min, key: "start", event: a });
|
|
115
115
|
break;
|
|
116
|
-
case
|
|
117
|
-
|
|
116
|
+
case u.end:
|
|
117
|
+
a.preventDefault(), l({ type: r.max, key: "start", event: a });
|
|
118
118
|
break;
|
|
119
|
-
case
|
|
120
|
-
|
|
121
|
-
type:
|
|
119
|
+
case u.pageDown:
|
|
120
|
+
a.preventDefault(), l({
|
|
121
|
+
type: d === "rtl" ? r.increaseLarge : r.decreaseLarge,
|
|
122
122
|
key: "start",
|
|
123
|
-
event:
|
|
123
|
+
event: a
|
|
124
124
|
});
|
|
125
125
|
break;
|
|
126
|
-
case
|
|
127
|
-
|
|
128
|
-
type:
|
|
126
|
+
case u.pageUp:
|
|
127
|
+
a.preventDefault(), l({
|
|
128
|
+
type: d === "rtl" ? r.decreaseLarge : r.increaseLarge,
|
|
129
129
|
key: "start",
|
|
130
|
-
event:
|
|
130
|
+
event: a
|
|
131
131
|
});
|
|
132
132
|
break;
|
|
133
133
|
}
|
|
134
134
|
},
|
|
135
135
|
[l, e.disabled]
|
|
136
|
-
),
|
|
137
|
-
(
|
|
136
|
+
), Y = t.useCallback(
|
|
137
|
+
(a) => {
|
|
138
138
|
if (!e.disabled)
|
|
139
|
-
switch (
|
|
140
|
-
case
|
|
141
|
-
|
|
142
|
-
type:
|
|
139
|
+
switch (a.keyCode) {
|
|
140
|
+
case u.right:
|
|
141
|
+
a.preventDefault(), l({
|
|
142
|
+
type: d === "rtl" ? r.decrease : r.increase,
|
|
143
143
|
key: "end",
|
|
144
|
-
event:
|
|
144
|
+
event: a
|
|
145
145
|
});
|
|
146
146
|
break;
|
|
147
|
-
case
|
|
148
|
-
|
|
147
|
+
case u.up:
|
|
148
|
+
a.preventDefault(), l({ type: r.increase, key: "end", event: a });
|
|
149
149
|
break;
|
|
150
|
-
case
|
|
151
|
-
|
|
152
|
-
type:
|
|
150
|
+
case u.left:
|
|
151
|
+
a.preventDefault(), l({
|
|
152
|
+
type: d === "rtl" ? r.increase : r.decrease,
|
|
153
153
|
key: "end",
|
|
154
|
-
event:
|
|
154
|
+
event: a
|
|
155
155
|
});
|
|
156
156
|
break;
|
|
157
|
-
case
|
|
158
|
-
|
|
157
|
+
case u.down:
|
|
158
|
+
a.preventDefault(), l({ type: r.decrease, key: "end", event: a });
|
|
159
159
|
break;
|
|
160
|
-
case
|
|
161
|
-
|
|
160
|
+
case u.home:
|
|
161
|
+
a.preventDefault(), l({ type: r.min, key: "end", event: a });
|
|
162
162
|
break;
|
|
163
|
-
case
|
|
164
|
-
|
|
163
|
+
case u.end:
|
|
164
|
+
a.preventDefault(), l({ type: r.max, key: "end", event: a });
|
|
165
165
|
break;
|
|
166
|
-
case
|
|
167
|
-
|
|
168
|
-
type:
|
|
166
|
+
case u.pageDown:
|
|
167
|
+
a.preventDefault(), l({
|
|
168
|
+
type: d === "rtl" ? r.increaseLarge : r.decreaseLarge,
|
|
169
169
|
key: "end",
|
|
170
|
-
event:
|
|
170
|
+
event: a
|
|
171
171
|
});
|
|
172
172
|
break;
|
|
173
|
-
case
|
|
174
|
-
|
|
175
|
-
type:
|
|
173
|
+
case u.pageUp:
|
|
174
|
+
a.preventDefault(), l({
|
|
175
|
+
type: d === "rtl" ? r.decreaseLarge : r.increaseLarge,
|
|
176
176
|
key: "end",
|
|
177
|
-
event:
|
|
177
|
+
event: a
|
|
178
178
|
});
|
|
179
179
|
break;
|
|
180
180
|
}
|
|
181
181
|
},
|
|
182
|
-
[l,
|
|
183
|
-
),
|
|
184
|
-
(
|
|
185
|
-
const
|
|
186
|
-
|
|
187
|
-
const
|
|
188
|
-
l({ type:
|
|
182
|
+
[l, d, e.disabled]
|
|
183
|
+
), _ = t.useCallback(
|
|
184
|
+
(a) => {
|
|
185
|
+
const o = L(a), v = X(o);
|
|
186
|
+
V(v), v === "end" ? $.current.focus() : w.current.focus();
|
|
187
|
+
const T = v === "end" ? r.end : r.start;
|
|
188
|
+
l({ type: T, payload: o, event: a });
|
|
189
189
|
},
|
|
190
|
-
[e.vertical, g,
|
|
190
|
+
[e.vertical, g, b, l]
|
|
191
191
|
);
|
|
192
|
-
return
|
|
192
|
+
return te(
|
|
193
193
|
R,
|
|
194
194
|
{
|
|
195
|
-
onPress:
|
|
196
|
-
onDrag: (
|
|
197
|
-
const
|
|
198
|
-
l({ type:
|
|
195
|
+
onPress: _,
|
|
196
|
+
onDrag: (a) => {
|
|
197
|
+
const o = L(a), v = M === "end" ? r.end : r.start;
|
|
198
|
+
l({ type: v, payload: o, event: a });
|
|
199
199
|
},
|
|
200
|
-
onRelease: (
|
|
201
|
-
const
|
|
202
|
-
l({ type:
|
|
200
|
+
onRelease: (a) => {
|
|
201
|
+
const o = L(a), v = M === "end" ? r.end : r.start;
|
|
202
|
+
l({ type: v, payload: o, event: a }), V("");
|
|
203
203
|
}
|
|
204
204
|
},
|
|
205
205
|
{ autoScroll: !1 }
|
|
206
|
-
), /* @__PURE__ */
|
|
206
|
+
), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
|
|
207
207
|
"div",
|
|
208
208
|
{
|
|
209
209
|
id: e.id,
|
|
210
210
|
style: e.style,
|
|
211
211
|
ref: h,
|
|
212
|
-
dir:
|
|
213
|
-
|
|
212
|
+
dir: d,
|
|
213
|
+
"aria-label": e.ariaLabel || I.toLanguageString(P, E[P]),
|
|
214
|
+
className: re(
|
|
214
215
|
"k-slider",
|
|
215
216
|
{
|
|
216
|
-
"k-rtl":
|
|
217
|
+
"k-rtl": d === "rtl",
|
|
217
218
|
"k-disabled": e.disabled,
|
|
218
219
|
"k-slider-vertical": e.vertical,
|
|
219
220
|
"k-slider-horizontal": !e.vertical
|
|
@@ -221,7 +222,7 @@ const se = (n, s, p) => {
|
|
|
221
222
|
e.className
|
|
222
223
|
)
|
|
223
224
|
},
|
|
224
|
-
/* @__PURE__ */
|
|
225
|
+
/* @__PURE__ */ t.createElement(
|
|
225
226
|
"div",
|
|
226
227
|
{
|
|
227
228
|
ref: R,
|
|
@@ -230,95 +231,97 @@ const se = (n, s, p) => {
|
|
|
230
231
|
flexGrow: 1,
|
|
231
232
|
position: "relative",
|
|
232
233
|
touchAction: "none",
|
|
233
|
-
...
|
|
234
|
+
...U
|
|
234
235
|
}
|
|
235
236
|
},
|
|
236
|
-
e.children && /* @__PURE__ */
|
|
237
|
-
|
|
237
|
+
e.children && /* @__PURE__ */ t.createElement("ul", { className: "k-reset k-slider-items", "aria-hidden": "true", style: { ...G } }, t.Children.map(e.children, (a, o) => a && t.cloneElement(
|
|
238
|
+
a,
|
|
238
239
|
{
|
|
239
|
-
position: 100 * (
|
|
240
|
+
position: 100 * (a.props.position - e.min) / (e.max - e.min),
|
|
240
241
|
vertical: e.vertical,
|
|
241
|
-
firstTick:
|
|
242
|
-
lastTick:
|
|
242
|
+
firstTick: o === 0,
|
|
243
|
+
lastTick: o === t.Children.count(e.children) - 1
|
|
243
244
|
},
|
|
244
|
-
|
|
245
|
+
a.props.children
|
|
245
246
|
))),
|
|
246
|
-
/* @__PURE__ */
|
|
247
|
+
/* @__PURE__ */ t.createElement(
|
|
247
248
|
"div",
|
|
248
249
|
{
|
|
249
|
-
ref:
|
|
250
|
+
ref: B,
|
|
250
251
|
className: "k-slider-track",
|
|
251
|
-
style: e.vertical ? { bottom: 0, height: "100%" } : { [
|
|
252
|
+
style: e.vertical ? { bottom: 0, height: "100%" } : { [d === "rtl" ? "right" : "left"]: 0, width: "100%" }
|
|
252
253
|
},
|
|
253
|
-
|
|
254
|
+
y !== null && D !== null && /* @__PURE__ */ t.createElement(
|
|
254
255
|
"div",
|
|
255
256
|
{
|
|
256
257
|
"data-selection": !0,
|
|
257
|
-
ref:
|
|
258
|
-
title: `${
|
|
258
|
+
ref: H,
|
|
259
|
+
title: `${f.start} - ${f.end}`,
|
|
259
260
|
className: "k-slider-selection",
|
|
260
|
-
style: e.vertical ? { height: D -
|
|
261
|
-
[
|
|
262
|
-
width: D -
|
|
261
|
+
style: e.vertical ? { height: D - y + "%", bottom: y + "%" } : {
|
|
262
|
+
[d === "rtl" ? "right" : "left"]: y + "%",
|
|
263
|
+
width: D - y + "%"
|
|
263
264
|
}
|
|
264
265
|
}
|
|
265
266
|
),
|
|
266
|
-
/* @__PURE__ */
|
|
267
|
+
/* @__PURE__ */ t.createElement(
|
|
267
268
|
"span",
|
|
268
269
|
{
|
|
269
270
|
ref: w,
|
|
270
271
|
role: "slider",
|
|
271
|
-
tabIndex:
|
|
272
|
+
tabIndex: z(e.startTabIndex, e.disabled, void 0),
|
|
272
273
|
"aria-valuemin": g,
|
|
273
|
-
"aria-valuemax": Math.max(
|
|
274
|
-
"aria-valuenow":
|
|
274
|
+
"aria-valuemax": Math.max(b, f.end),
|
|
275
|
+
"aria-valuenow": f.start,
|
|
275
276
|
"aria-disabled": e.disabled ? "true" : void 0,
|
|
276
|
-
"aria-
|
|
277
|
+
"aria-orientation": e.vertical ? "vertical" : void 0,
|
|
278
|
+
"aria-label": e.ariaLabel ? `${e.ariaLabel} start` : "Range start",
|
|
277
279
|
className: "k-draghandle k-draghandle-start",
|
|
278
|
-
title:
|
|
279
|
-
style: e.vertical ? { bottom: "calc(" +
|
|
280
|
-
onKeyDown:
|
|
280
|
+
title: I.toLanguageString(C, E[C]),
|
|
281
|
+
style: e.vertical ? { bottom: "calc(" + y + "%)", zIndex: 1 } : d === "rtl" ? { right: "calc(" + y + "% - 13px)", zIndex: 1 } : { left: "calc(" + y + "%)", zIndex: 1 },
|
|
282
|
+
onKeyDown: F
|
|
281
283
|
}
|
|
282
284
|
),
|
|
283
|
-
/* @__PURE__ */
|
|
285
|
+
/* @__PURE__ */ t.createElement(
|
|
284
286
|
"span",
|
|
285
287
|
{
|
|
286
|
-
ref:
|
|
288
|
+
ref: $,
|
|
287
289
|
role: "slider",
|
|
288
|
-
tabIndex:
|
|
289
|
-
"aria-valuemin": Math.min(g,
|
|
290
|
-
"aria-valuemax":
|
|
291
|
-
"aria-valuenow":
|
|
290
|
+
tabIndex: z(e.endTabIndex, e.disabled, void 0),
|
|
291
|
+
"aria-valuemin": Math.min(g, f.start),
|
|
292
|
+
"aria-valuemax": b,
|
|
293
|
+
"aria-valuenow": f.end,
|
|
292
294
|
"aria-disabled": e.disabled ? "true" : void 0,
|
|
293
|
-
"aria-
|
|
295
|
+
"aria-orientation": e.vertical ? "vertical" : void 0,
|
|
296
|
+
"aria-label": e.ariaLabel ? `${e.ariaLabel} end` : "Range end",
|
|
294
297
|
className: "k-draghandle k-draghandle-end",
|
|
295
|
-
title:
|
|
296
|
-
style: e.vertical ? { bottom: "calc(" + D + "%)", zIndex: 1 } :
|
|
297
|
-
onKeyDown:
|
|
298
|
+
title: I.toLanguageString(C, E[C]),
|
|
299
|
+
style: e.vertical ? { bottom: "calc(" + D + "%)", zIndex: 1 } : d === "rtl" ? { right: "calc(" + D + "% - 13px)", zIndex: 1 } : { left: "calc(" + D + "%)", zIndex: 1 },
|
|
300
|
+
onKeyDown: Y
|
|
298
301
|
}
|
|
299
302
|
)
|
|
300
303
|
)
|
|
301
304
|
)
|
|
302
|
-
),
|
|
303
|
-
}),
|
|
304
|
-
value: (n, s,
|
|
305
|
+
), m && /* @__PURE__ */ t.createElement(ne, { message: i }));
|
|
306
|
+
}), oe = {
|
|
307
|
+
value: (n, s, m) => {
|
|
305
308
|
if (n.value) {
|
|
306
|
-
const
|
|
307
|
-
if (
|
|
309
|
+
const i = n.value.start, c = n.value.end, e = n.min, p = n.max;
|
|
310
|
+
if (i > c || i > p || i < e || c > p || c < e || c < i)
|
|
308
311
|
return new Error(
|
|
309
|
-
`Invalid prop + ${s} supplied to ${
|
|
312
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
310
313
|
The { start, end } value must be between the min & max value and { start, end } must be start < end.
|
|
311
314
|
`
|
|
312
315
|
);
|
|
313
316
|
}
|
|
314
317
|
return null;
|
|
315
318
|
},
|
|
316
|
-
defaultValue: (n, s,
|
|
319
|
+
defaultValue: (n, s, m) => {
|
|
317
320
|
if (n.defaultValue) {
|
|
318
|
-
const
|
|
319
|
-
if (
|
|
321
|
+
const i = n.defaultValue.start, c = n.defaultValue.end, e = n.min, p = n.max;
|
|
322
|
+
if (i > c || i > p || i < e || c > p || c < e || c < i)
|
|
320
323
|
return new Error(
|
|
321
|
-
`Invalid prop + ${s} supplied to ${
|
|
324
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
322
325
|
The { start, end } value must be between the min & max value and { start, end } must be start < end.
|
|
323
326
|
`
|
|
324
327
|
);
|
|
@@ -327,26 +330,26 @@ const se = (n, s, p) => {
|
|
|
327
330
|
},
|
|
328
331
|
onChange: S.func,
|
|
329
332
|
step: S.number,
|
|
330
|
-
min: (n, s,
|
|
331
|
-
const
|
|
332
|
-
return
|
|
333
|
-
`Invalid prop + ${s} supplied to ${
|
|
333
|
+
min: (n, s, m) => {
|
|
334
|
+
const i = n[s], c = n.min, e = n.max;
|
|
335
|
+
return c === void 0 ? new Error(
|
|
336
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
334
337
|
${s} value can not be undefined.
|
|
335
338
|
`
|
|
336
|
-
) :
|
|
337
|
-
`Invalid prop + ${s} supplied to ${
|
|
339
|
+
) : i && c >= e ? new Error(
|
|
340
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
338
341
|
${s} value can not be equal to or bigger than the max value.
|
|
339
342
|
`
|
|
340
343
|
) : null;
|
|
341
344
|
},
|
|
342
|
-
max: (n, s,
|
|
343
|
-
const
|
|
345
|
+
max: (n, s, m) => {
|
|
346
|
+
const i = n[s], c = n.min, e = n.max;
|
|
344
347
|
return e === void 0 ? new Error(
|
|
345
|
-
`Invalid prop + ${s} supplied to ${
|
|
348
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
346
349
|
${s} value can not be undefined.
|
|
347
350
|
`
|
|
348
|
-
) :
|
|
349
|
-
`Invalid prop + ${s} supplied to ${
|
|
351
|
+
) : i && e <= c ? new Error(
|
|
352
|
+
`Invalid prop + ${s} supplied to ${m}.
|
|
350
353
|
${s} value can not be equal to or smaller than the min value.
|
|
351
354
|
`
|
|
352
355
|
) : null;
|
|
@@ -354,7 +357,7 @@ const se = (n, s, p) => {
|
|
|
354
357
|
vertical: S.bool,
|
|
355
358
|
disabled: S.bool,
|
|
356
359
|
dir: S.oneOf(["ltr", "rtl"])
|
|
357
|
-
},
|
|
360
|
+
}, k = {
|
|
358
361
|
step: 1,
|
|
359
362
|
largeStep: 10,
|
|
360
363
|
defaultValue: {
|
|
@@ -364,9 +367,9 @@ const se = (n, s, p) => {
|
|
|
364
367
|
vertical: !1,
|
|
365
368
|
disabled: !1
|
|
366
369
|
};
|
|
367
|
-
|
|
368
|
-
|
|
370
|
+
A.displayName = "KendoReactRangeSlider";
|
|
371
|
+
A.propTypes = oe;
|
|
369
372
|
export {
|
|
370
|
-
|
|
371
|
-
|
|
373
|
+
A as RangeSlider,
|
|
374
|
+
de as RangeSliderPropsContext
|
|
372
375
|
};
|
package/rating/Rating.d.ts
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
import { FormComponentProps, SVGIcon } from '@progress/kendo-react-common';
|
|
8
|
+
import { FormComponentProps, SVGIcon, WebMcpProps } from '@progress/kendo-react-common';
|
|
9
9
|
import { RatingItemProps } from './RatingItem.js';
|
|
10
10
|
import { RatingKeyboardEvent, RatingItemMouseEvent, RatingItemFocusEvent } from './models/index.js';
|
|
11
11
|
import * as React from 'react';
|
|
@@ -264,6 +264,11 @@ export interface RatingProps extends FormComponentProps {
|
|
|
264
264
|
* ```
|
|
265
265
|
*/
|
|
266
266
|
ariaLabelledBy?: string;
|
|
267
|
+
/**
|
|
268
|
+
* Enables Web MCP tool registration for this component.
|
|
269
|
+
* Requires a parent `WebMcpProvider` from `@progress/kendo-react-webmcp`.
|
|
270
|
+
*/
|
|
271
|
+
webMcp?: boolean | WebMcpProps;
|
|
267
272
|
}
|
|
268
273
|
/**
|
|
269
274
|
* Represents the target(element and props) of the RatingChangeEvent.
|
package/rating/Rating.js
CHANGED
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("react"),m=require("prop-types"),l=require("@progress/kendo-react-common"),U=require("./RatingItem.js"),c=require("./rating-reducer.js"),u=require("./utils/index.js"),_=require("../messages/index.js"),Y=require("@progress/kendo-react-intl");function Z(n){const p=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const d in n)if(d!=="default"){const e=Object.getOwnPropertyDescriptor(n,d);Object.defineProperty(p,d,e.get?e:{enumerable:!0,get:()=>n[d]})}}return p.default=n,Object.freeze(p)}const a=Z(Q),z={name:"star",content:'<path d="m22.762 10.668-4.557 3.931 1.389 5.88a1.661 1.661 0 0 1-2.481 1.805L12 19.138l-5.116 3.146a1.661 1.661 0 0 1-2.478-1.805l1.394-5.88-4.557-3.931a1.667 1.667 0 0 1 .943-2.921l5.974-.482 2.304-5.577a1.656 1.656 0 0 1 3.065 0l2.304 5.577 5.973.482a1.667 1.667 0 0 1 .95 2.922z" />',viewBox:"0 0 24 24"},P={name:"star-outline",content:'<path d="M23.065 8.95a1.44 1.44 0 0 0-1.267-1l-6.101-.493-2.351-5.691a1.454 1.454 0 0 0-2.691 0L8.304 7.454l-6.101.496A1.44 1.44 0 0 0 .936 8.951a1.46 1.46 0 0 0 .433 1.562l4.657 4.011-1.417 5.998a1.46 1.46 0 0 0 .567 1.52 1.43 1.43 0 0 0 1.61.061L12 18.898l5.222 3.211a1.43 1.43 0 0 0 1.611-.061 1.46 1.46 0 0 0 .566-1.52l-1.417-5.998 4.65-4.016a1.46 1.46 0 0 0 .433-1.564m-1.229.644-4.929 4.253a.61.61 0 0 0-.195.599l1.506 6.357a.24.24 0 0 1-.096.261.23.23 0 0 1-.262.009l-5.541-3.404a.61.61 0 0 0-.636 0l-5.54 3.403a.23.23 0 0 1-.263-.01.24.24 0 0 1-.101-.26l1.506-6.358a.61.61 0 0 0-.194-.598l-4.93-4.253a.24.24 0 0 1-.074-.269.23.23 0 0 1 .21-.167l6.471-.522a.61.61 0 0 0 .513-.373l2.493-6.035a.238.238 0 0 1 .444 0l2.494 6.035a.61.61 0 0 0 .512.373l6.472.522a.23.23 0 0 1 .21.167.24.24 0 0 1-.068.269z" />',viewBox:"0 0 24 24"},B=(n,p,d)=>{const[e,M]=a.useState(n);return[e,h=>{const i=c.ratingReducer(p.state||e,{...h,...p});d&&d(i,h.event),M(i)}]},F=l.createPropsContext(),w=a.forwardRef((n,p)=>{const d=l.usePropsContext(F,n),e={dir:s.dir,min:s.min,max:s.max,step:s.step,item:s.item,defaultValue:s.defaultValue,readonly:s.readonly,disabled:s.disabled,selection:s.selection,precision:s.precision,...d},M=Y.useLocalization(),g=a.useRef(null),h=a.useRef(null),i=l.useDir(h,e.dir);a.useImperativeHandle(g,()=>({element:h.current,props:e})),a.useImperativeHandle(p,()=>g.current),l.useWebMcpRegister("rating",g,e,e.webMcp);const H=a.useCallback((t,o)=>{e.onChange&&g.current&&e.onChange.call(void 0,{value:t,target:g.current,syntheticEvent:o})},[e.onChange]),R=a.useMemo(()=>e.min!==void 0?e.min:s.min,[e.min]),C=a.useMemo(()=>e.max!==void 0?e.max:s.max,[e.max]),I=a.useMemo(()=>e.precision||s.precision,[e.precision]),r=a.useMemo(()=>e.step!==void 0?e.step:s.step,[e.step]),k=a.useMemo(()=>e.readonly||s.readonly,[e.readonly]),N=a.useMemo(()=>e.disabled||s.disabled,[e.disabled]),K=a.useMemo(()=>e.item||s.item,[e.item]),[V,f]=B(e.defaultValue!==void 0?e.defaultValue:s.defaultValue,{state:e.value,min:R,max:C,step:I==="half"?r/2:r},H),[G,D]=B(null,{state:e.value,min:R,max:C,step:I==="half"?r/2:r,precision:I}),v=a.useMemo(()=>e.value!==void 0?e.value:V,[e.value,V]),T=a.useMemo(()=>G,[G]),E=a.useMemo(()=>e.selection||s.selection,[e.selection]),x=a.useMemo(()=>r/(I==="half"?2:1),[r,I]),L=a.useCallback(t=>{if(!(!t.target||!t.target.element||k||N)){if(I==="half"){const o=t.target.element.getBoundingClientRect(),A=u.calcIsFirstHalf(i||"ltr",o,t.syntheticEvent.clientX)?u.toRound(t.target.value-r/2,x):t.target.value;f({type:c.RATING_ACTION.select,payload:A,event:t.syntheticEvent})}else f({type:c.RATING_ACTION.select,payload:t.target.value,event:t.syntheticEvent});if(e.onClick){const o={value:v,target:g.current,syntheticEvent:t.syntheticEvent};e.onClick.call(void 0,o)}}},[e.onClick,f,v]),q=a.useCallback(t=>{if(!(k||N)){switch(t.keyCode){case l.Keys.right:t.preventDefault(),f({type:i==="rtl"?c.RATING_ACTION.decrease:c.RATING_ACTION.increase,event:t});break;case l.Keys.left:t.preventDefault(),f({type:i==="rtl"?c.RATING_ACTION.increase:c.RATING_ACTION.decrease,event:t});break;case l.Keys.home:t.preventDefault(),f({type:i==="rtl"?c.RATING_ACTION.min:c.RATING_ACTION.max,event:t});break;case l.Keys.end:t.preventDefault(),f({type:i==="rtl"?c.RATING_ACTION.max:c.RATING_ACTION.min,event:t});break;case l.Keys.esc:t.preventDefault(),f({type:c.RATING_ACTION.deselect,event:t});break}e.onKeyDown&&e.onKeyDown.call(void 0,{value:v,target:g.current,syntheticEvent:t})}},[e.onKeyDown,f,v]),W=a.useCallback(t=>{if(e.onFocus){const o={target:g.current,syntheticEvent:t};e.onFocus.call(void 0,o)}},[e.onFocus]),$=a.useCallback(t=>{if(e.onBlur){const o={target:g.current,syntheticEvent:t};e.onBlur.call(void 0,o)}},[e.onBlur]),j=a.useCallback(t=>{if(!(!t.target||!t.target.element))if(I==="half"){const o=t.target.element.getBoundingClientRect(),A=u.calcIsFirstHalf(i||"ltr",o,t.syntheticEvent.clientX)?t.target.value-r/2:t.target.value;D({type:c.RATING_ACTION.select,payload:A,event:t.syntheticEvent})}else D({type:c.RATING_ACTION.select,payload:t.target.value,event:t.syntheticEvent})},[I,r,i]),X=a.useCallback(t=>{D({type:c.RATING_ACTION.reset,event:t.syntheticEvent})},[]),S=[],J=u.getRemainder(u.toRound(C-R,x),r);for(let t=R||r;t<=C;t=u.toRound(t+r,x)){const o=u.toRound(t+J,x),y=I==="half"?u.isHalf(o,T!==null?T:v!==null?v:0,r):!1,A=u.isSelected(o,v,r,E),O=u.isSelected(o,T!==null?T:v,r,E),b=u.isSelected(o,T,r,E);S.push(a.createElement(K,{key:o,value:o,dir:i,title:String(y?u.toRound(o-r/2,x):o),icon:e.icon,svgIcon:e.svgIcon,half:y,selected:A||O,hovered:b,onClick:L,onMouseMove:j,onMouseLeave:X},y&&a.createElement("span",{className:"k-rating-precision-complement"},!(e.icon||e.svgIconOutline)&&a.createElement(l.IconWrap,{name:"star",icon:P,style:{clipPath:`${i==="rtl"?"inset(0 50% 0 0)":"inset(0 0 0 50%)"}`},size:"xlarge"}),(e.icon||e.svgIconOutline)&&a.createElement(l.IconWrap,{name:l.toIconName(`${e.icon}-outline`),icon:e.svgIconOutline,size:"xlarge"})),y&&a.createElement("span",{className:"k-rating-precision-part"},!(e.icon||e.svgIcon)&&a.createElement(l.IconWrap,{name:"star",icon:z,style:{clipPath:`${i==="rtl"?"inset(0 0 0 50%)":"inset(0 50% 0 0)"}`},size:"xlarge"}),(e.icon||e.svgIcon)&&a.createElement(l.IconWrap,{name:e.icon?l.toIconName(e.icon):void 0,icon:e.svgIcon,size:"xlarge"})),y&&a.createElement("span",{style:{width:"24px",height:"24px",display:"block"}}),!y&&!(e.icon||e.svgIcon)&&(b||O&&!b)&&a.createElement(l.IconWrap,{name:"star",icon:z,size:"xlarge"})||!(e.icon||e.svgIcon)&&!b&&!O&&a.createElement(l.IconWrap,{name:"star",icon:P,size:"xlarge"})||(e.icon||e.svgIcon)&&(b||O&&!b)&&a.createElement(l.IconWrap,{name:e.icon,icon:e.svgIcon,size:"xlarge"})||(e.icon||e.svgIcon)&&!b&&a.createElement(l.IconWrap,{name:l.toIconName(`${e.icon}-outline`),icon:e.svgIconOutline,size:"xlarge"})))}return a.createElement("span",{id:e.id,style:e.style,ref:h,role:"slider",dir:i,tabIndex:l.getTabIndex(e.tabIndex,e.disabled,void 0),className:l.classNames("k-rating",{"k-rtl":i==="rtl","k-readonly":k,"k-disabled":N},e.className),onKeyDown:q,onFocus:W,onBlur:$,"aria-valuemin":R,"aria-valuemax":C,"aria-valuenow":v!==null?v:void 0,"aria-disabled":N?"true":void 0,"aria-label":M.toLanguageString(_.ratingAriaLabel,_.messages[_.ratingAriaLabel]),"aria-labelledby":e.ariaLabelledBy,"aria-describedby":e.ariaDescribedBy},a.createElement("input",{type:"hidden",id:"rating",readOnly:k,disabled:N}),a.createElement("span",{className:"k-rating-container"},S),e.label&&a.createElement("span",{className:"k-rating-label"},e.label))}),ee={id:m.string,dir:m.oneOf(["ltr","rtl"]),selection:m.oneOf(["continues","single"]),precision:m.oneOf(["item","half"]),value:(n,p,d)=>n.value&&n.min&&n.max&&n.step&&!(n.precision==="half"?u.isCorrectValue(n.min,n.max,n.step/2,n.value):u.isCorrectValue(n.min,n.max,n.step,n.value))&&n.precision==="half"?new Error(`Invalid prop + ${p} supplied to ${d}.
|
|
9
9
|
The value of the { value } property is not correct, please check your values.
|
|
10
|
-
`):null,defaultValue:m.number,min:m.number,max:m.number,step:(
|
|
10
|
+
`):null,defaultValue:m.number,min:m.number,max:m.number,step:(n,p,d)=>n.step!==void 0&&n.step<=0?new Error(`Invalid prop + ${p} supplied to ${d}.
|
|
11
11
|
The value of the { step } property is cannot be equal or less than "0", please check your values.
|
|
12
|
-
`):null,hovered:m.number,label:m.node,readonly:m.bool,disabled:m.bool,icon:m.string,svgIcon:l.svgIconPropType,svgIconOutline:l.svgIconPropType,ariaDescribedBy:m.string},s={dir:"ltr",min:
|
|
12
|
+
`):null,hovered:m.number,label:m.node,readonly:m.bool,disabled:m.bool,icon:m.string,svgIcon:l.svgIconPropType,svgIconOutline:l.svgIconPropType,ariaDescribedBy:m.string},s={dir:"ltr",min:0,max:5,step:1,item:U.RatingItem,defaultValue:null,readonly:!1,disabled:!1,selection:"continues",precision:"item"};w.displayName="KendoReactRating";w.propTypes=ee;exports.Rating=w;exports.RatingPropsContext=F;
|