@progress/kendo-react-inputs 8.1.0-develop.9 → 8.1.1-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/checkbox/Checkbox.js +1 -1
- package/checkbox/Checkbox.mjs +87 -90
- package/colors/ColorPicker.js +1 -1
- package/colors/ColorPicker.mjs +53 -54
- package/dist/cdn/js/kendo-react-inputs.js +1 -1
- package/index.d.mts +2 -2
- package/index.d.ts +2 -2
- package/numerictextbox/NumericTextBox.js +1 -1
- package/numerictextbox/NumericTextBox.mjs +208 -206
- package/package-metadata.mjs +1 -1
- package/package.json +8 -8
- package/radiobutton/RadioButton.js +1 -1
- package/radiobutton/RadioButton.mjs +21 -22
- package/radiobutton/RadioGroup.js +1 -1
- package/radiobutton/RadioGroup.mjs +54 -55
- package/range-slider/RangeSlider.js +7 -7
- package/range-slider/RangeSlider.mjs +161 -156
- package/rating/Rating.js +3 -3
- package/rating/Rating.mjs +145 -134
- package/rating/RatingItem.js +1 -1
- package/rating/RatingItem.mjs +40 -41
- package/signature/Signature.js +1 -1
- package/signature/Signature.mjs +151 -133
- package/textarea/TextArea.js +1 -1
- package/textarea/TextArea.mjs +64 -65
- package/textbox/Textbox.js +1 -1
- package/textbox/Textbox.mjs +33 -34
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("react"),t=require("prop-types"),a=require("@progress/kendo-react-common"),w=require("../package-metadata.js");function _(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const l in n)if(l!=="default"){const
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("react"),t=require("prop-types"),a=require("@progress/kendo-react-common"),w=require("../package-metadata.js");function _(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const l in n)if(l!=="default"){const r=Object.getOwnPropertyDescriptor(n,l);Object.defineProperty(s,l,r.get?r:{enumerable:!0,get:()=>n[l]})}}return s.default=n,Object.freeze(s)}const e=_(D),E=a.createPropsContext(),g=e.forwardRef((n,s)=>{a.validatePackage(w.packageMetadata);const l=a.usePropsContext(E,n),{ariaDescribedBy:r,checked:k,children:h,className:x,disabled:o,id:v,size:d=H.size,label:m,labelPlacement:F,name:I,style:N,tabIndex:O,value:b,valid:j,onChange:y,onFocus:p,onBlur:f,...z}=l,i=e.useRef(null),C=e.useCallback(()=>{i.current&&i.current.focus()},[]),u=e.useCallback(()=>({element:i.current,focus:C}),[C]);e.useImperativeHandle(s,u);const P=a.useId(),M=e.useCallback(c=>{a.dispatchEvent(y,c,u(),{value:b})},[y,b,o]),T=e.useCallback(c=>{p&&!o&&a.dispatchEvent(p,c,u(),void 0)},[p,o]),S=e.useCallback(c=>{f&&!o&&a.dispatchEvent(f,c,u(),void 0)},[f,o]),q={type:"radio",id:v||P,name:I,className:a.classNames("k-radio",{[`k-radio-${a.kendoThemeMaps.sizeMap[d]||d}`]:d,"k-invalid":j===!1,"k-checked":k},x),ref:i,disabled:o,tabIndex:a.getTabIndex(O,o),checked:k,style:N,"aria-describedby":r,value:b,onChange:M,onFocus:T,onBlur:S,...z},B=e.createElement(e.Fragment,null,m!==void 0?e.createElement("label",{className:"k-radio-label",htmlFor:v||P,style:{userSelect:"none"},"aria-label":m},m):null),R=e.createElement("span",{className:"k-radio-wrap"},e.createElement("input",{...q}));return F==="before"?e.createElement(e.Fragment,null,B,R,h):e.createElement(e.Fragment,null,R,B,h)});g.propTypes={ariaDescribedBy:t.string,checked:t.bool,className:t.string,disabled:t.bool,id:t.string,size:t.oneOf([null,"small","medium","large"]),label:t.string,labelPlacement:t.string,name:t.string,style:t.object,tabIndex:t.number,value:t.any,valid:t.bool,onChange:t.func,onFocus:t.func,onBlur:t.func};const H={size:"medium"};g.displayName="KendoRadioButton";exports.RadioButton=g;exports.RadioButtonPropsContext=E;
|
|
@@ -10,16 +10,16 @@ import * as e from "react";
|
|
|
10
10
|
import a from "prop-types";
|
|
11
11
|
import { createPropsContext as j, validatePackage as K, usePropsContext as L, useId as O, dispatchEvent as u, classNames as S, kendoThemeMaps as $, getTabIndex as q } from "@progress/kendo-react-common";
|
|
12
12
|
import { packageMetadata as A } from "../package-metadata.mjs";
|
|
13
|
-
const G = j(),
|
|
13
|
+
const G = j(), C = e.forwardRef((y, B) => {
|
|
14
14
|
K(A);
|
|
15
15
|
const P = L(G, y), {
|
|
16
16
|
ariaDescribedBy: x,
|
|
17
|
-
checked:
|
|
17
|
+
checked: m,
|
|
18
18
|
children: b,
|
|
19
19
|
className: E,
|
|
20
20
|
disabled: n,
|
|
21
|
-
id:
|
|
22
|
-
size: s,
|
|
21
|
+
id: p,
|
|
22
|
+
size: s = J.size,
|
|
23
23
|
label: r,
|
|
24
24
|
labelPlacement: F,
|
|
25
25
|
name: I,
|
|
@@ -27,11 +27,11 @@ const G = j(), m = e.forwardRef((y, B) => {
|
|
|
27
27
|
tabIndex: R,
|
|
28
28
|
value: c,
|
|
29
29
|
valid: z,
|
|
30
|
-
onChange:
|
|
30
|
+
onChange: f,
|
|
31
31
|
onFocus: i,
|
|
32
32
|
onBlur: d,
|
|
33
33
|
...T
|
|
34
|
-
} = P, l = e.useRef(null),
|
|
34
|
+
} = P, l = e.useRef(null), g = e.useCallback(
|
|
35
35
|
() => {
|
|
36
36
|
l.current && l.current.focus();
|
|
37
37
|
},
|
|
@@ -39,21 +39,21 @@ const G = j(), m = e.forwardRef((y, B) => {
|
|
|
39
39
|
), o = e.useCallback(
|
|
40
40
|
() => ({
|
|
41
41
|
element: l.current,
|
|
42
|
-
focus:
|
|
42
|
+
focus: g
|
|
43
43
|
}),
|
|
44
|
-
[
|
|
44
|
+
[g]
|
|
45
45
|
);
|
|
46
46
|
e.useImperativeHandle(B, o);
|
|
47
|
-
const
|
|
47
|
+
const k = O(), M = e.useCallback(
|
|
48
48
|
(t) => {
|
|
49
49
|
u(
|
|
50
|
-
|
|
50
|
+
f,
|
|
51
51
|
t,
|
|
52
52
|
o(),
|
|
53
53
|
{ value: c }
|
|
54
54
|
);
|
|
55
55
|
},
|
|
56
|
-
[
|
|
56
|
+
[f, c, n]
|
|
57
57
|
), w = e.useCallback(
|
|
58
58
|
(t) => {
|
|
59
59
|
i && !n && u(
|
|
@@ -76,21 +76,21 @@ const G = j(), m = e.forwardRef((y, B) => {
|
|
|
76
76
|
[d, n]
|
|
77
77
|
), H = {
|
|
78
78
|
type: "radio",
|
|
79
|
-
id:
|
|
79
|
+
id: p || k,
|
|
80
80
|
name: I,
|
|
81
81
|
className: S(
|
|
82
82
|
"k-radio",
|
|
83
83
|
{
|
|
84
84
|
[`k-radio-${$.sizeMap[s] || s}`]: s,
|
|
85
85
|
"k-invalid": z === !1,
|
|
86
|
-
"k-checked":
|
|
86
|
+
"k-checked": m
|
|
87
87
|
},
|
|
88
88
|
E
|
|
89
89
|
),
|
|
90
90
|
ref: l,
|
|
91
91
|
disabled: n,
|
|
92
92
|
tabIndex: q(R, n),
|
|
93
|
-
checked:
|
|
93
|
+
checked: m,
|
|
94
94
|
style: N,
|
|
95
95
|
"aria-describedby": x,
|
|
96
96
|
value: c,
|
|
@@ -98,19 +98,19 @@ const G = j(), m = e.forwardRef((y, B) => {
|
|
|
98
98
|
onFocus: w,
|
|
99
99
|
onBlur: D,
|
|
100
100
|
...T
|
|
101
|
-
},
|
|
101
|
+
}, h = /* @__PURE__ */ e.createElement(e.Fragment, null, r !== void 0 ? /* @__PURE__ */ e.createElement(
|
|
102
102
|
"label",
|
|
103
103
|
{
|
|
104
104
|
className: "k-radio-label",
|
|
105
|
-
htmlFor:
|
|
105
|
+
htmlFor: p || k,
|
|
106
106
|
style: { userSelect: "none" },
|
|
107
107
|
"aria-label": r
|
|
108
108
|
},
|
|
109
109
|
r
|
|
110
|
-
) : null),
|
|
111
|
-
return F === "before" ? /* @__PURE__ */ e.createElement(e.Fragment, null,
|
|
110
|
+
) : null), v = /* @__PURE__ */ e.createElement("span", { className: "k-radio-wrap" }, /* @__PURE__ */ e.createElement("input", { ...H }));
|
|
111
|
+
return F === "before" ? /* @__PURE__ */ e.createElement(e.Fragment, null, h, v, b) : /* @__PURE__ */ e.createElement(e.Fragment, null, v, h, b);
|
|
112
112
|
});
|
|
113
|
-
|
|
113
|
+
C.propTypes = {
|
|
114
114
|
ariaDescribedBy: a.string,
|
|
115
115
|
checked: a.bool,
|
|
116
116
|
className: a.string,
|
|
@@ -131,9 +131,8 @@ m.propTypes = {
|
|
|
131
131
|
const J = {
|
|
132
132
|
size: "medium"
|
|
133
133
|
};
|
|
134
|
-
|
|
135
|
-
m.defaultProps = J;
|
|
134
|
+
C.displayName = "KendoRadioButton";
|
|
136
135
|
export {
|
|
137
|
-
|
|
136
|
+
C as RadioButton,
|
|
138
137
|
G as RadioButtonPropsContext
|
|
139
138
|
};
|
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const H=require("react"),e=require("prop-types"),L=require("./RadioButton.js"),s=require("@progress/kendo-react-common"),K=require("../package-metadata.js");function A(l){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const n in l)if(n!=="default"){const d=Object.getOwnPropertyDescriptor(l,n);Object.defineProperty(c,n,d.get?d:{enumerable:!0,get:()=>l[n]})}}return c.default=l,Object.freeze(c)}const t=A(H),E=s.createPropsContext(),y=t.forwardRef((l,c)=>{s.validatePackage(K.packageMetadata);const n=s.usePropsContext(E,l),{id:d,ariaLabelledBy:N,ariaDescribedBy:O,className:j,data:g,defaultValue:B,disabled:o,name:G,labelPlacement:I,layout:u,style:F,value:k,valid:S,item:q=J.item,onChange:b,onFocus:m}=n,i=t.useRef(null),C=t.useCallback(()=>{i.current&&s.focusFirstFocusableChild(i.current)},[]),p=t.useCallback(()=>({element:i.current,focus:C}),[C]);t.useImperativeHandle(c,p);const[x,v]=t.useState(B),h=k!==void 0,f=h?k:x,D=t.useCallback(a=>{let r=a.value;!h&&!o&&v(r),b&&!o&&s.dispatchEvent(b,a.syntheticEvent,p(),{value:r})},[v,b,o]),M=t.useCallback(a=>{m&&!o&&s.dispatchEvent(m,a.syntheticEvent,p(),void 0)},[m,o]),T=s.useId(),V=s.classNames("k-radio-list",{"k-list-horizontal":u==="horizontal","k-list-vertical":u==="vertical"||u===void 0},j),z=s.useRtl(i,n.dir),_=g&&g.map((a,r)=>{const P=f===a.value,w=f==null,R={...a,valid:S,checked:P,disabled:!!(a.disabled||o),labelPlacement:a.labelPlacement?a.labelPlacement:I,tabIndex:a.tabIndex?a.tabIndex:w&&r===0||P?0:-1,index:r,name:G||T,onChange:D,onFocus:M};return t.createElement(q,{className:s.classNames("k-radio-list-item",{"k-disabled":R.disabled||o}),key:r,role:"none"},t.createElement(L.RadioButton,{...R}))});return t.createElement("ul",{id:d,role:"radiogroup",className:V,ref:i,dir:z,style:F,"aria-labelledby":N,"aria-describedby":O},_)}),J={item:l=>t.createElement("li",{...l})};y.propTypes={ariaLabelledBy:e.string,ariaDescribedBy:e.string,className:e.string,data:e.arrayOf(e.object),defaultValue:e.any,dir:e.string,disabled:e.bool,labelPlacement:e.string,layout:e.string,name:e.string,style:e.object,value:e.any,onChange:e.func,onFocus:e.func};y.displayName="KendoRadioGroup";exports.RadioGroup=y;exports.RadioGroupPropsContext=E;
|
|
@@ -8,55 +8,55 @@
|
|
|
8
8
|
"use client";
|
|
9
9
|
import * as t from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
|
-
import { RadioButton as
|
|
12
|
-
import { createPropsContext as
|
|
13
|
-
import { packageMetadata as
|
|
14
|
-
const
|
|
15
|
-
|
|
16
|
-
const
|
|
17
|
-
id:
|
|
18
|
-
ariaLabelledBy:
|
|
19
|
-
ariaDescribedBy:
|
|
20
|
-
className:
|
|
21
|
-
data:
|
|
22
|
-
defaultValue:
|
|
11
|
+
import { RadioButton as M } from "./RadioButton.mjs";
|
|
12
|
+
import { createPropsContext as q, validatePackage as A, usePropsContext as J, focusFirstFocusableChild as Q, dispatchEvent as v, useId as U, classNames as g, useRtl as W } from "@progress/kendo-react-common";
|
|
13
|
+
import { packageMetadata as X } from "../package-metadata.mjs";
|
|
14
|
+
const Y = q(), P = t.forwardRef((r, R) => {
|
|
15
|
+
A(X);
|
|
16
|
+
const m = J(Y, r), {
|
|
17
|
+
id: E,
|
|
18
|
+
ariaLabelledBy: I,
|
|
19
|
+
ariaDescribedBy: N,
|
|
20
|
+
className: B,
|
|
21
|
+
data: b,
|
|
22
|
+
defaultValue: F,
|
|
23
23
|
disabled: l,
|
|
24
|
-
name:
|
|
25
|
-
labelPlacement:
|
|
24
|
+
name: x,
|
|
25
|
+
labelPlacement: G,
|
|
26
26
|
layout: n,
|
|
27
|
-
style:
|
|
28
|
-
value:
|
|
29
|
-
valid:
|
|
30
|
-
item:
|
|
27
|
+
style: V,
|
|
28
|
+
value: p,
|
|
29
|
+
valid: O,
|
|
30
|
+
item: j = Z.item,
|
|
31
31
|
onChange: c,
|
|
32
32
|
onFocus: i
|
|
33
|
-
} =
|
|
33
|
+
} = m, o = t.useRef(null), f = t.useCallback(
|
|
34
34
|
() => {
|
|
35
|
-
o.current &&
|
|
35
|
+
o.current && Q(o.current);
|
|
36
36
|
},
|
|
37
37
|
[]
|
|
38
38
|
), d = t.useCallback(
|
|
39
39
|
() => ({
|
|
40
40
|
element: o.current,
|
|
41
|
-
focus:
|
|
41
|
+
focus: f
|
|
42
42
|
}),
|
|
43
|
-
[
|
|
43
|
+
[f]
|
|
44
44
|
);
|
|
45
|
-
t.useImperativeHandle(
|
|
46
|
-
const [
|
|
45
|
+
t.useImperativeHandle(R, d);
|
|
46
|
+
const [z, y] = t.useState(F), C = p !== void 0, u = C ? p : z, D = t.useCallback(
|
|
47
47
|
(a) => {
|
|
48
48
|
let s = a.value;
|
|
49
|
-
!
|
|
49
|
+
!C && !l && y(s), c && !l && v(
|
|
50
50
|
c,
|
|
51
51
|
a.syntheticEvent,
|
|
52
52
|
d(),
|
|
53
53
|
{ value: s }
|
|
54
54
|
);
|
|
55
55
|
},
|
|
56
|
-
[
|
|
57
|
-
),
|
|
56
|
+
[y, c, l]
|
|
57
|
+
), H = t.useCallback(
|
|
58
58
|
(a) => {
|
|
59
|
-
i && !l &&
|
|
59
|
+
i && !l && v(
|
|
60
60
|
i,
|
|
61
61
|
a.syntheticEvent,
|
|
62
62
|
d(),
|
|
@@ -64,54 +64,54 @@ const Z = A(), m = t.forwardRef((r, E) => {
|
|
|
64
64
|
);
|
|
65
65
|
},
|
|
66
66
|
[i, l]
|
|
67
|
-
),
|
|
67
|
+
), L = U(), S = g(
|
|
68
68
|
"k-radio-list",
|
|
69
69
|
{
|
|
70
70
|
"k-list-horizontal": n === "horizontal",
|
|
71
71
|
"k-list-vertical": n === "vertical" || n === void 0
|
|
72
72
|
},
|
|
73
|
-
|
|
74
|
-
),
|
|
75
|
-
const
|
|
73
|
+
B
|
|
74
|
+
), T = W(o, m.dir), w = b && b.map((a, s) => {
|
|
75
|
+
const h = u === a.value, K = u == null, k = {
|
|
76
76
|
...a,
|
|
77
|
-
valid:
|
|
78
|
-
checked:
|
|
77
|
+
valid: O,
|
|
78
|
+
checked: h,
|
|
79
79
|
disabled: !!(a.disabled || l),
|
|
80
|
-
labelPlacement: a.labelPlacement ? a.labelPlacement :
|
|
81
|
-
tabIndex: a.tabIndex ? a.tabIndex :
|
|
80
|
+
labelPlacement: a.labelPlacement ? a.labelPlacement : G,
|
|
81
|
+
tabIndex: a.tabIndex ? a.tabIndex : K && s === 0 || h ? 0 : -1,
|
|
82
82
|
index: s,
|
|
83
|
-
name:
|
|
84
|
-
onChange:
|
|
85
|
-
onFocus:
|
|
83
|
+
name: x || L,
|
|
84
|
+
onChange: D,
|
|
85
|
+
onFocus: H
|
|
86
86
|
};
|
|
87
87
|
return /* @__PURE__ */ t.createElement(
|
|
88
|
-
|
|
88
|
+
j,
|
|
89
89
|
{
|
|
90
|
-
className:
|
|
90
|
+
className: g("k-radio-list-item", { "k-disabled": k.disabled || l }),
|
|
91
91
|
key: s,
|
|
92
92
|
role: "none"
|
|
93
93
|
},
|
|
94
|
-
/* @__PURE__ */ t.createElement(
|
|
94
|
+
/* @__PURE__ */ t.createElement(M, { ...k })
|
|
95
95
|
);
|
|
96
96
|
});
|
|
97
97
|
return /* @__PURE__ */ t.createElement(
|
|
98
98
|
"ul",
|
|
99
99
|
{
|
|
100
|
-
id:
|
|
100
|
+
id: E,
|
|
101
101
|
role: "radiogroup",
|
|
102
|
-
className:
|
|
102
|
+
className: S,
|
|
103
103
|
ref: o,
|
|
104
|
-
dir:
|
|
105
|
-
style:
|
|
106
|
-
"aria-labelledby":
|
|
107
|
-
"aria-describedby":
|
|
104
|
+
dir: T,
|
|
105
|
+
style: V,
|
|
106
|
+
"aria-labelledby": I,
|
|
107
|
+
"aria-describedby": N
|
|
108
108
|
},
|
|
109
|
-
|
|
109
|
+
w
|
|
110
110
|
);
|
|
111
|
-
}),
|
|
111
|
+
}), Z = {
|
|
112
112
|
item: (r) => /* @__PURE__ */ t.createElement("li", { ...r })
|
|
113
113
|
};
|
|
114
|
-
|
|
114
|
+
P.propTypes = {
|
|
115
115
|
ariaLabelledBy: e.string,
|
|
116
116
|
ariaDescribedBy: e.string,
|
|
117
117
|
className: e.string,
|
|
@@ -127,9 +127,8 @@ m.propTypes = {
|
|
|
127
127
|
onChange: e.func,
|
|
128
128
|
onFocus: e.func
|
|
129
129
|
};
|
|
130
|
-
|
|
131
|
-
m.displayName = "KendoRadioGroup";
|
|
130
|
+
P.displayName = "KendoRadioGroup";
|
|
132
131
|
export {
|
|
133
|
-
|
|
134
|
-
|
|
132
|
+
P as RadioGroup,
|
|
133
|
+
Y as RadioGroupPropsContext
|
|
135
134
|
};
|
|
@@ -5,16 +5,16 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("react"),C=require("prop-types"),i=require("@progress/kendo-react-common"),N=require("../messages/index.js"),Y=require("@progress/kendo-react-intl"),s=require("./range-raducer.js"),F=require("../package-metadata.js");function J(r){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const c in r)if(c!=="default"){const e=Object.getOwnPropertyDescriptor(r,c);Object.defineProperty(n,c,e.get?e:{enumerable:!0,get:()=>r[c]})}}return n.default=r,Object.freeze(n)}const a=J(W),Q=(r,n,c)=>{const[e,l]=a.useState(r),m=a.useCallback(y=>{const b=s.rangeReducer(n.state||e,{...y,...n});c&&c(b,y.event),l(b)},[n,c]);return[e,m]},G=i.createPropsContext(),E=a.forwardRef((r,n)=>{i.validatePackage(F.packageMetadata);const c=i.usePropsContext(G,r),e={step:h.step,defaultValue:h.defaultValue,vertical:h.vertical,disabled:h.disabled,...c},l=a.useRef(null),m=a.useRef(null),y=a.useRef(null),b=a.useRef(null),D=a.useRef(null),$=a.useCallback(()=>{b.current&&b.current.focus()},[b]);a.useImperativeHandle(l,()=>({element:m.current,focus:$,props:e})),a.useImperativeHandle(n,()=>l.current);const f=a.useMemo(()=>e.min,[e.min]),g=a.useMemo(()=>e.max,[e.max]),S=a.useMemo(()=>e.step!==void 0?e.step:h.step,[e.step,h.step]),p=i.useDir(m,e.dir),K=(t,u)=>{e.onChange&&l.current&&e.onChange.call(void 0,{value:t,target:l.current,syntheticEvent:u})},[O,w]=a.useState(""),[R,d]=Q(e.defaultValue||h.defaultValue,{min:f,max:g,step:S,state:e.value},K),o=a.useMemo(()=>e.value||R,[e.value,R]),M=a.useRef(null),T=a.useRef(null),k=a.useMemo(()=>(o.start-f)/(g-f)*100,[o.start,f,g]),A=a.useMemo(()=>(o.end-f)/(g-f)*100,[o.end,f,g]),P=a.useMemo(()=>e.vertical?{paddingTop:0,height:"100%"}:{},[e.vertical]),z=a.useMemo(()=>e.vertical?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},[e.vertical]),_=Y.useLocalization(),I=a.useCallback(t=>{if(!T.current)return;const u=T.current.getBoundingClientRect(),v=e.vertical?u.bottom-t.clientY:p==="rtl"?u.right-t.clientX:t.clientX-u.left,x=e.vertical?u.height:u.width,X=v/x;return f+X*(g-f)},[T,e.vertical,p,f,g,R.start,R.end,e.value&&e.value.start,e.value&&e.value.end]),V=a.useCallback(t=>t<=o.start?"start":t>=o.end?"end":2*t<o.end+o.start?"start":"end",[R.start,R.end,e.value&&e.value.start,e.value&&e.value.end]),q=a.useCallback(t=>{switch(t.keyCode){case i.Keys.right:t.preventDefault(),d({type:p==="rtl"?s.RANGE_ACTION.decrease:s.RANGE_ACTION.increase,key:"start",event:t});break;case i.Keys.up:t.preventDefault(),d({type:s.RANGE_ACTION.increase,key:"start",event:t});break;case i.Keys.left:t.preventDefault(),d({type:p==="rtl"?s.RANGE_ACTION.increase:s.RANGE_ACTION.decrease,key:"start",event:t});break;case i.Keys.down:t.preventDefault(),d({type:s.RANGE_ACTION.decrease,key:"start",event:t});break;case i.Keys.home:t.preventDefault(),d({type:s.RANGE_ACTION.min,key:"start",event:t});break;case i.Keys.end:t.preventDefault(),d({type:s.RANGE_ACTION.max,key:"start",event:t});break}},[d]),j=a.useCallback(t=>{switch(t.keyCode){case i.Keys.right:t.preventDefault(),d({type:p==="rtl"?s.RANGE_ACTION.decrease:s.RANGE_ACTION.increase,key:"end",event:t});break;case i.Keys.up:t.preventDefault(),d({type:s.RANGE_ACTION.increase,key:"end",event:t});break;case i.Keys.left:t.preventDefault(),d({type:p==="rtl"?s.RANGE_ACTION.increase:s.RANGE_ACTION.decrease,key:"end",event:t});break;case i.Keys.down:t.preventDefault(),d({type:s.RANGE_ACTION.decrease,key:"end",event:t});break;case i.Keys.home:t.preventDefault(),d({type:s.RANGE_ACTION.min,key:"end",event:t});break;case i.Keys.end:t.preventDefault(),d({type:s.RANGE_ACTION.max,key:"end",event:t});break}},[d,p]),H=a.useCallback(t=>{const u=I(t),v=V(u);w(v),v==="end"?D.current.focus():b.current.focus();const x=v==="end"?s.RANGE_ACTION.end:s.RANGE_ACTION.start;d({type:x,payload:u,event:t})},[e.vertical,f,g,d]),L=t=>{const u=I(t),v=O==="end"?s.RANGE_ACTION.end:s.RANGE_ACTION.start;d({type:v,payload:u,event:t})},B=t=>{const u=I(t),v=O==="end"?s.RANGE_ACTION.end:s.RANGE_ACTION.start;d({type:v,payload:u,event:t}),w("")};return i.useDraggable(T,{onPress:H,onDrag:L,onRelease:B}),a.createElement("div",{id:e.id,style:e.style,ref:m,dir:p,className:i.classNames("k-slider",{"k-rtl":p==="rtl","k-disabled":e.disabled,"k-slider-vertical":e.vertical,"k-slider-horizontal":!e.vertical},e.className)},a.createElement("div",{ref:T,className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...z}},e.children&&a.createElement("ul",{className:"k-reset k-slider-items",style:{...P}},a.Children.map(e.children,(t,u)=>t&&a.cloneElement(t,{position:100*(t.props.position-e.min)/(e.max-e.min),vertical:e.vertical,firstTick:u===0,lastTick:u===a.Children.count(e.children)-1},t.props.children))),a.createElement("div",{ref:M,className:"k-slider-track",style:e.vertical?{bottom:0,height:"100%"}:{[p==="rtl"?"right":"left"]:0,width:"100%"}},k!==null&&A!==null&&a.createElement("div",{"data-selection":!0,ref:y,title:`${o.start} - ${o.end}`,className:"k-slider-selection",style:e.vertical?{height:A-k+"%",bottom:k+"%"}:{[p==="rtl"?"right":"left"]:k+"%",width:A-k+"%"}}),a.createElement("span",{ref:b,role:"slider",tabIndex:i.getTabIndex(e.startTabIndex,e.disabled,void 0),"aria-valuemin":f,"aria-valuemax":Math.max(g,o.end),"aria-valuenow":o.start,"aria-disabled":e.disabled?"true":void 0,"aria-valuetext":`${o.start} - ${o.end}`,className:"k-draghandle k-draghandle-start",title:_.toLanguageString(N.sliderDragTitle,N.messages[N.sliderDragTitle]),style:e.vertical?{bottom:"calc("+k+"%)",zIndex:1}:p==="rtl"?{right:"calc("+k+"% - 13px)",zIndex:1}:{left:"calc("+k+"%)",zIndex:1},onKeyDown:q}),a.createElement("span",{ref:D,role:"slider",tabIndex:i.getTabIndex(e.endTabIndex,e.disabled,void 0),"aria-valuemin":Math.min(f,o.start),"aria-valuemax":g,"aria-valuenow":o.end,"aria-disabled":e.disabled?"true":void 0,"aria-valuetext":`${o.start} - ${o.end}`,className:"k-draghandle k-draghandle-end",title:_.toLanguageString(N.sliderDragTitle,N.messages[N.sliderDragTitle]),style:e.vertical?{bottom:"calc("+A+"%)",zIndex:1}:p==="rtl"?{right:"calc("+A+"% - 13px)",zIndex:1}:{left:"calc("+A+"%)",zIndex:1},onKeyDown:j}))))}),U={value:(r,n,c)=>{if(r.value){const e=r.value.start,l=r.value.end,m=r.min,y=r.max;if(e>l||e>y||e<m||l>y||l<m||l<e)return new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
9
9
|
The { start, end } value must be between the min & max value and { start, end } must be start < end.
|
|
10
|
-
`)}return null},defaultValue:(r,n,
|
|
10
|
+
`)}return null},defaultValue:(r,n,c)=>{if(r.defaultValue){const e=r.defaultValue.start,l=r.defaultValue.end,m=r.min,y=r.max;if(e>l||e>y||e<m||l>y||l<m||l<e)return new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
11
11
|
The { start, end } value must be between the min & max value and { start, end } must be start < end.
|
|
12
|
-
`)}return null},onChange:
|
|
12
|
+
`)}return null},onChange:C.func,step:C.number,min:(r,n,c)=>{const e=r[n],l=r.min,m=r.max;return l===void 0?new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
13
13
|
${n} value can not be undefined.
|
|
14
|
-
`):
|
|
14
|
+
`):e&&l>=m?new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
15
15
|
${n} value can not be equal to or bigger than the max value.
|
|
16
|
-
`):null},max:(r,n,
|
|
16
|
+
`):null},max:(r,n,c)=>{const e=r[n],l=r.min,m=r.max;return m===void 0?new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
17
17
|
${n} value can not be undefined.
|
|
18
|
-
`):
|
|
18
|
+
`):e&&m<=l?new Error(`Invalid prop + ${n} supplied to ${c}.
|
|
19
19
|
${n} value can not be equal to or smaller than the min value.
|
|
20
|
-
`):null},vertical:
|
|
20
|
+
`):null},vertical:C.bool,disabled:C.bool,dir:C.oneOf(["ltr","rtl"])},h={step:1,defaultValue:{start:0,end:0},vertical:!1,disabled:!1};E.displayName="KendoReactRangeSlider";E.propTypes=U;exports.RangeSlider=E;exports.RangeSliderPropsContext=G;
|