@progress/kendo-react-inputs 14.5.0-develop.13 → 14.5.0-develop.14
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/colors/ColorPicker.js +1 -1
- package/colors/ColorPicker.mjs +194 -183
- 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/numerictextbox/NumericTextBox.js +1 -1
- package/numerictextbox/NumericTextBox.mjs +170 -168
- package/numerictextbox/interfaces/NumericTextBoxProps.d.ts +6 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
- package/range-slider/RangeSlider.d.ts +6 -1
- package/range-slider/RangeSlider.js +2 -2
- package/range-slider/RangeSlider.mjs +43 -43
- package/rating/Rating.d.ts +6 -1
- package/rating/Rating.js +2 -2
- package/rating/Rating.mjs +62 -62
- package/signature/Signature.js +1 -1
- package/signature/Signature.mjs +94 -92
- 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 +131 -134
- package/switch/Switch.d.ts +6 -1
- package/switch/Switch.js +1 -1
- package/switch/Switch.mjs +88 -86
- package/textarea/TextArea.js +1 -1
- package/textarea/TextArea.mjs +97 -95
- 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
package/switch/Switch.mjs
CHANGED
|
@@ -6,12 +6,12 @@
|
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
import * as d from "react";
|
|
9
|
-
import { useState as
|
|
9
|
+
import { useState as H, useRef as l, useMemo as M, useEffect as N, useCallback as m, useImperativeHandle as V } from "react";
|
|
10
10
|
import t from "prop-types";
|
|
11
|
-
import { withIdHOC as re, withPropsContext as
|
|
12
|
-
import { LocalizationService as
|
|
13
|
-
import { switchValidation as
|
|
14
|
-
const
|
|
11
|
+
import { withIdHOC as re, withPropsContext as de, noop as I, dispatchEvent as le, subscribeToKendoPaste as se, Keys as W, useWebMcpRegister as oe, classNames as x, kendoThemeMaps as B, getTabIndex as ue, createPropsContext as fe } from "@progress/kendo-react-common";
|
|
12
|
+
import { LocalizationService as me } from "@progress/kendo-react-intl";
|
|
13
|
+
import { switchValidation as $, messages as A, switchAriaLabel as j } from "../messages/index.mjs";
|
|
14
|
+
const c = {
|
|
15
15
|
disabled: !1,
|
|
16
16
|
defaultChecked: !1,
|
|
17
17
|
size: void 0,
|
|
@@ -22,46 +22,46 @@ const r = {
|
|
|
22
22
|
onFocus: I,
|
|
23
23
|
onLabel: "ON",
|
|
24
24
|
validityStyles: !0
|
|
25
|
-
},
|
|
26
|
-
var
|
|
25
|
+
}, G = d.forwardRef((e, Q) => {
|
|
26
|
+
var T;
|
|
27
27
|
const {
|
|
28
|
-
disabled:
|
|
29
|
-
defaultChecked:
|
|
30
|
-
size: k =
|
|
31
|
-
trackRounded: w =
|
|
32
|
-
thumbRounded: C =
|
|
33
|
-
offLabel: F =
|
|
34
|
-
onBlur: R =
|
|
35
|
-
onFocus: L =
|
|
36
|
-
onLabel: D =
|
|
37
|
-
} = e, [K,
|
|
38
|
-
var y,
|
|
39
|
-
const a = e.validationMessage !== void 0, i = (y = e.valid) != null ? y : e.required ? !!n : !0, g = (
|
|
28
|
+
disabled: r = c.disabled,
|
|
29
|
+
defaultChecked: U = c.defaultChecked,
|
|
30
|
+
size: k = c.size,
|
|
31
|
+
trackRounded: w = c.trackRounded,
|
|
32
|
+
thumbRounded: C = c.thumbRounded,
|
|
33
|
+
offLabel: F = c.offLabel,
|
|
34
|
+
onBlur: R = c.onBlur,
|
|
35
|
+
onFocus: L = c.onFocus,
|
|
36
|
+
onLabel: D = c.onLabel
|
|
37
|
+
} = e, [K, X] = H(U || !1), [Y, z] = H(!1), s = l(null), o = l(null), h = l(null), v = l(void 0), S = l(!1), O = l(void 0), E = M(() => new me(), []), n = M(() => v.current !== void 0 ? v.current : e.checked !== void 0 ? e.checked : K, [e.checked, K]), b = M(() => {
|
|
38
|
+
var y, q;
|
|
39
|
+
const a = e.validationMessage !== void 0, i = (y = e.valid) != null ? y : e.required ? !!n : !0, g = (q = e.valid) != null ? q : i;
|
|
40
40
|
return {
|
|
41
41
|
customError: a,
|
|
42
42
|
valid: g,
|
|
43
43
|
valueMissing: n === null
|
|
44
44
|
};
|
|
45
|
-
}, [e.valid, e.validationMessage, e.required, n]),
|
|
46
|
-
|
|
45
|
+
}, [e.valid, e.validationMessage, e.required, n]), Z = (T = e.validityStyles) != null ? T : c.validityStyles;
|
|
46
|
+
N(() => {
|
|
47
47
|
var a;
|
|
48
|
-
(a =
|
|
49
|
-
|
|
48
|
+
(a = h.current) != null && a.setCustomValidity && h.current.setCustomValidity(
|
|
49
|
+
b.valid ? "" : e.validationMessage || E.toLanguageString($, A[$])
|
|
50
50
|
);
|
|
51
|
-
}, [
|
|
52
|
-
|
|
51
|
+
}, [b, e.validationMessage, E]), N(() => {
|
|
52
|
+
s.current && (O.current = e.dir || getComputedStyle(s.current).direction || void 0);
|
|
53
53
|
}, [e.dir]);
|
|
54
|
-
const
|
|
54
|
+
const u = m(() => ({
|
|
55
55
|
props: e,
|
|
56
56
|
get element() {
|
|
57
|
-
return
|
|
57
|
+
return s.current;
|
|
58
58
|
},
|
|
59
59
|
get actionElement() {
|
|
60
|
-
return
|
|
60
|
+
return o.current;
|
|
61
61
|
},
|
|
62
62
|
focus: () => {
|
|
63
63
|
var a;
|
|
64
|
-
(a =
|
|
64
|
+
(a = o.current) == null || a.focus();
|
|
65
65
|
},
|
|
66
66
|
get value() {
|
|
67
67
|
return n;
|
|
@@ -70,89 +70,91 @@ const r = {
|
|
|
70
70
|
return e.name;
|
|
71
71
|
},
|
|
72
72
|
get validity() {
|
|
73
|
-
return
|
|
73
|
+
return b;
|
|
74
74
|
}
|
|
75
|
-
}), [e, n,
|
|
75
|
+
}), [e, n, b]), f = m(
|
|
76
76
|
(a, i) => {
|
|
77
|
-
|
|
77
|
+
X(a), v.current = a, le(
|
|
78
78
|
e.onChange,
|
|
79
79
|
i,
|
|
80
|
-
{ ...
|
|
80
|
+
{ ...u(), value: a },
|
|
81
81
|
{ value: a }
|
|
82
|
-
),
|
|
82
|
+
), v.current = void 0;
|
|
83
83
|
},
|
|
84
|
-
[e.onChange,
|
|
84
|
+
[e.onChange, u]
|
|
85
85
|
);
|
|
86
|
-
|
|
87
|
-
const a = e.name || e.id, i =
|
|
86
|
+
N(() => {
|
|
87
|
+
const a = e.name || e.id, i = se(o.current, {
|
|
88
88
|
fieldName: a,
|
|
89
89
|
onValueChange: (g) => {
|
|
90
90
|
if (g !== n) {
|
|
91
91
|
const y = {
|
|
92
|
-
target:
|
|
93
|
-
currentTarget:
|
|
92
|
+
target: o.current,
|
|
93
|
+
currentTarget: o.current,
|
|
94
94
|
nativeEvent: new Event("change", { bubbles: !0 })
|
|
95
95
|
};
|
|
96
|
-
|
|
96
|
+
f(g, y);
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
99
|
});
|
|
100
100
|
return () => {
|
|
101
101
|
i == null || i.unsubscribe();
|
|
102
102
|
};
|
|
103
|
-
}, [e.name, e.id, n,
|
|
104
|
-
const
|
|
103
|
+
}, [e.name, e.id, n, f]);
|
|
104
|
+
const _ = m(
|
|
105
105
|
(a) => {
|
|
106
|
-
if (a.target ===
|
|
106
|
+
if (a.target === h.current) {
|
|
107
107
|
if (S.current) {
|
|
108
108
|
S.current = !1;
|
|
109
109
|
return;
|
|
110
110
|
}
|
|
111
111
|
} else
|
|
112
112
|
S.current = !0;
|
|
113
|
-
|
|
113
|
+
f(!n, a);
|
|
114
114
|
},
|
|
115
|
-
[n,
|
|
116
|
-
),
|
|
115
|
+
[n, f]
|
|
116
|
+
), p = m(
|
|
117
117
|
(a) => {
|
|
118
|
-
if (
|
|
118
|
+
if (r)
|
|
119
119
|
return;
|
|
120
120
|
const { keyCode: i } = a;
|
|
121
|
-
(i ===
|
|
121
|
+
(i === W.space || i === W.enter) && (f(!n, a), a.preventDefault());
|
|
122
122
|
},
|
|
123
|
-
[
|
|
124
|
-
),
|
|
123
|
+
[r, n, f]
|
|
124
|
+
), ee = m(
|
|
125
125
|
(a) => {
|
|
126
|
-
|
|
126
|
+
r || (z(!0), L && L(a));
|
|
127
127
|
},
|
|
128
|
-
[
|
|
129
|
-
),
|
|
128
|
+
[r, L]
|
|
129
|
+
), te = m(
|
|
130
130
|
(a) => {
|
|
131
|
-
|
|
131
|
+
r || (z(!1), R && R(a));
|
|
132
132
|
},
|
|
133
|
-
[
|
|
133
|
+
[r, R]
|
|
134
134
|
);
|
|
135
|
-
|
|
136
|
-
const
|
|
135
|
+
V(Q, u, [u]);
|
|
136
|
+
const P = l(null);
|
|
137
|
+
V(P, u, [u]), oe("switch", P, e, e.webMcp);
|
|
138
|
+
const ae = O.current || e.dir || s.current && getComputedStyle(s.current).direction || void 0, ne = !Z || b.valid, ie = x(
|
|
137
139
|
"k-switch",
|
|
138
140
|
{
|
|
139
141
|
[`k-switch-${B.sizeMap[k] || k}`]: k,
|
|
140
142
|
"k-switch-on": n,
|
|
141
143
|
"k-switch-off": !n,
|
|
142
|
-
"k-focus":
|
|
143
|
-
"k-disabled":
|
|
144
|
-
"k-invalid": !
|
|
144
|
+
"k-focus": Y,
|
|
145
|
+
"k-disabled": r,
|
|
146
|
+
"k-invalid": !ne
|
|
145
147
|
},
|
|
146
148
|
e.className
|
|
147
|
-
),
|
|
149
|
+
), ce = /* @__PURE__ */ d.createElement(
|
|
148
150
|
"input",
|
|
149
151
|
{
|
|
150
152
|
type: "checkbox",
|
|
151
153
|
checked: e.checked,
|
|
152
|
-
ref:
|
|
154
|
+
ref: h,
|
|
153
155
|
tabIndex: -1,
|
|
154
156
|
"aria-hidden": !0,
|
|
155
|
-
"aria-label": e.ariaLabel || E.toLanguageString(
|
|
157
|
+
"aria-label": e.ariaLabel || E.toLanguageString(j, A[j]),
|
|
156
158
|
value: n,
|
|
157
159
|
style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" },
|
|
158
160
|
onChange: I,
|
|
@@ -162,55 +164,55 @@ const r = {
|
|
|
162
164
|
return /* @__PURE__ */ d.createElement(
|
|
163
165
|
"span",
|
|
164
166
|
{
|
|
165
|
-
ref:
|
|
167
|
+
ref: o,
|
|
166
168
|
role: "switch",
|
|
167
169
|
"aria-checked": n,
|
|
168
|
-
"aria-disabled":
|
|
170
|
+
"aria-disabled": r || void 0,
|
|
169
171
|
"aria-labelledby": e.ariaLabelledBy,
|
|
170
172
|
"aria-describedby": e.ariaDescribedBy,
|
|
171
173
|
"aria-label": e.ariaLabel,
|
|
172
174
|
"aria-required": e.required,
|
|
173
|
-
className:
|
|
174
|
-
dir:
|
|
175
|
-
onKeyDown:
|
|
176
|
-
onClick:
|
|
177
|
-
onBlur:
|
|
178
|
-
onFocus:
|
|
179
|
-
tabIndex:
|
|
175
|
+
className: ie,
|
|
176
|
+
dir: ae,
|
|
177
|
+
onKeyDown: p,
|
|
178
|
+
onClick: _,
|
|
179
|
+
onBlur: te,
|
|
180
|
+
onFocus: ee,
|
|
181
|
+
tabIndex: ue(e.tabIndex, r, void 0),
|
|
180
182
|
accessKey: e.accessKey,
|
|
181
183
|
id: e.id
|
|
182
184
|
},
|
|
183
185
|
/* @__PURE__ */ d.createElement(
|
|
184
186
|
"span",
|
|
185
187
|
{
|
|
186
|
-
className:
|
|
188
|
+
className: x("k-switch-track", {
|
|
187
189
|
[`k-rounded-${B.roundedMap[w] || w}`]: w
|
|
188
190
|
}),
|
|
189
|
-
ref:
|
|
191
|
+
ref: s
|
|
190
192
|
},
|
|
191
|
-
|
|
193
|
+
ce,
|
|
192
194
|
D ? /* @__PURE__ */ d.createElement("span", { className: "k-switch-label-on" }, D) : "",
|
|
193
195
|
F ? /* @__PURE__ */ d.createElement("span", { className: "k-switch-label-off" }, F) : ""
|
|
194
196
|
),
|
|
195
197
|
/* @__PURE__ */ d.createElement("span", { className: "k-switch-thumb-wrap" }, /* @__PURE__ */ d.createElement(
|
|
196
198
|
"span",
|
|
197
199
|
{
|
|
198
|
-
className:
|
|
200
|
+
className: x("k-switch-thumb", {
|
|
199
201
|
[`k-rounded-${B.roundedMap[C] || C}`]: C
|
|
200
202
|
})
|
|
201
203
|
}
|
|
202
204
|
))
|
|
203
205
|
);
|
|
204
206
|
});
|
|
205
|
-
|
|
206
|
-
const
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
207
|
+
G.displayName = "Switch";
|
|
208
|
+
const be = fe(), J = re(
|
|
209
|
+
de(
|
|
210
|
+
be,
|
|
211
|
+
G
|
|
210
212
|
)
|
|
211
213
|
);
|
|
212
|
-
|
|
213
|
-
|
|
214
|
+
J.displayName = "KendoReactSwitch";
|
|
215
|
+
J.propTypes = {
|
|
214
216
|
accessKey: t.string,
|
|
215
217
|
checked: t.bool,
|
|
216
218
|
className: t.string,
|
|
@@ -239,7 +241,7 @@ j.propTypes = {
|
|
|
239
241
|
validityStyles: t.bool
|
|
240
242
|
};
|
|
241
243
|
export {
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
244
|
+
J as Switch,
|
|
245
|
+
be as SwitchPropsContext,
|
|
246
|
+
G as SwitchWithoutContext
|
|
245
247
|
};
|
package/textarea/TextArea.js
CHANGED
|
@@ -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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ge=require("react"),e=require("prop-types"),r=require("@progress/kendo-react-common");function ve(l){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const o in l)if(o!=="default"){const i=Object.getOwnPropertyDescriptor(l,o);Object.defineProperty(c,o,i.get?i:{enumerable:!0,get:()=>l[o]})}}return c.default=l,Object.freeze(c)}const t=ve(ge),K=r.createPropsContext(),T=t.forwardRef((l,c)=>{const o=r.usePropsContext(K,l),{size:i=m.size,rounded:x=m.rounded,fillMode:S=m.fillMode,autoFocus:L=m.autoFocus,flow:h=m.flow,prefix:_=null,suffix:W=null,ariaDescribedBy:G,ariaLabelledBy:J,autoSize:p,className:Q,defaultValue:U,disabled:s,readOnly:X,required:b,rows:Y,id:M,name:w,placeholder:Z,style:ee,tabIndex:te,value:y,valid:E,validationMessage:F,validityStyles:I,onChange:k,onFocus:C,onBlur:z,visited:xe,touched:he,modified:ye,resizable:d,inputAttributes:ae,textareaStyle:V,...re}=o,a=t.useRef(null),A=t.useCallback(()=>{a.current&&a.current.focus()},[]),N=t.useCallback(()=>{a.current&&a.current.blur()},[]),[B,R]=t.useState(U),[ne,j]=t.useState(!1),[oe,se]=r.useCustomComponent(_),[le,ue]=r.useCustomComponent(W),g=y!==void 0,v=g?y:B,q=w||M,u=t.useCallback(()=>({element:a,focus:A,blur:N,get value(){return v},get name(){return a.current&&a.current.name}}),[N,A,v]);t.useImperativeHandle(c,u);const H=t.useRef(null);t.useImperativeHandle(H,u),r.useWebMcpRegister("textarea",H,o,o.webMcp);const[D,$]=t.useState("auto"),ie=r.useId(),ce=r.useDir(a,o.dir),O=E!==void 0?E:b?!!v:!0;t.useEffect(()=>{a.current&&a.current.setCustomValidity&&a.current.setCustomValidity(O?"":F||"")},[O,F]),r.useIsomorphicLayoutEffect(()=>{a.current&&$(`${a.current.scrollHeight}px`)},[v]);const P=t.useCallback(n=>{const f=n.target.value;$("auto"),!g&&!s&&R(f),k&&!s&&r.dispatchEvent(k,n,{...u(),value:f},{value:f})},[R,k,s,g]),de=t.useCallback(n=>{j(!0),C&&!s&&r.dispatchEvent(C,n,u(),void 0)},[C,s,u]),fe=t.useCallback(n=>{j(!1),z&&!s&&r.dispatchEvent(z,n,u(),void 0)},[z,s,u]),me=t.useCallback(n=>{a.current&&(a.current.value=n);const f={target:a.current,currentTarget:a.current};P(f)},[P]);r.useKendoPaste(a,{fieldName:q,onValueChange:me,enabled:!!q});const pe=t.useMemo(()=>{let n={};return p?n={resize:"none",overflow:"hidden",height:D}:d&&(n={resize:d}),{...n,...V}},[p,d,D,V]),be={id:M||ie,role:"textbox",name:w,className:r.classNames("k-input-inner","!k-overflow-auto",{"k-resize":!p&&d!=="none","k-resize-none":p||d==="none","!k-flex-none":h==="vertical"}),ref:a,disabled:s,rows:Y,placeholder:Z,readOnly:X,required:b,tabIndex:r.getTabIndex(te,s),autoFocus:L,style:pe,"aria-labelledby":J,"aria-describedby":G,"aria-multiline":!0,"aria-disabled":s||void 0,"aria-required":b,value:g?y:B,...Object.assign({},re,ae),onChange:P,onFocus:de,onBlur:fe};return t.createElement("span",{className:r.classNames("k-input","k-textarea",{[`k-input-${r.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-input-${S}`]:S,[`k-rounded-${r.kendoThemeMaps.roundedMap[x]||x}`]:x,"k-invalid":!(O||I!==void 0||I===!0),"k-required":b,"k-disabled":s,"k-focus":ne,"!k-flex-col":h==="vertical","!k-flex-row":h==="horizontal"},Q),style:ee,dir:ce},o.prefix&&t.createElement(oe,{...se}),t.createElement("textarea",{...be}),o.suffix&&t.createElement(le,{...ue}))});T.propTypes={ariaDescribedBy:e.string,ariaLabelledBy:e.string,autoSize:e.bool,className:e.string,defaultValue:e.string,dir:e.string,disabled:e.bool,readOnly:e.bool,rows:e.number,id:e.string,name:e.string,placeholder:e.string,style:e.object,tabIndex:e.number,value:e.oneOfType([e.string,e.arrayOf(e.string),e.number]),onChange:e.func,onFocus:e.func,onBlur:e.func,size:e.oneOf(["small","medium","large"]),rounded:e.oneOf(["small","medium","large","full","none"]),fillMode:e.oneOf(["solid","flat","outline"]),resizable:e.oneOf(["none","both","horizontal","vertical"]),autoFocus:e.bool,flow:e.oneOf(["vertical","horizontal"])};const m={size:void 0,rounded:void 0,fillMode:void 0,autoFocus:!1,flow:"horizontal"};T.displayName="KendoTextArea";exports.TextArea=T;exports.TextAreaPropsContext=K;
|
package/textarea/TextArea.mjs
CHANGED
|
@@ -5,176 +5,178 @@
|
|
|
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 e from "prop-types";
|
|
10
|
-
import { usePropsContext as
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
size:
|
|
14
|
-
rounded:
|
|
15
|
-
fillMode:
|
|
16
|
-
autoFocus: G =
|
|
17
|
-
flow: x =
|
|
10
|
+
import { usePropsContext as ge, useCustomComponent as q, useWebMcpRegister as he, useId as ye, useDir as ke, useIsomorphicLayoutEffect as Ce, dispatchEvent as z, useKendoPaste as ze, getTabIndex as we, classNames as D, kendoThemeMaps as K, createPropsContext as Pe } from "@progress/kendo-react-common";
|
|
11
|
+
const Fe = Pe(), L = t.forwardRef((j, W) => {
|
|
12
|
+
const s = ge(Fe, j), {
|
|
13
|
+
size: p = u.size,
|
|
14
|
+
rounded: b = u.rounded,
|
|
15
|
+
fillMode: w = u.fillMode,
|
|
16
|
+
autoFocus: G = u.autoFocus,
|
|
17
|
+
flow: x = u.flow,
|
|
18
18
|
prefix: J = null,
|
|
19
19
|
suffix: Q = null,
|
|
20
20
|
ariaDescribedBy: U,
|
|
21
|
-
ariaLabelledBy:
|
|
21
|
+
ariaLabelledBy: X,
|
|
22
22
|
autoSize: c,
|
|
23
|
-
className:
|
|
24
|
-
defaultValue:
|
|
23
|
+
className: Y,
|
|
24
|
+
defaultValue: Z,
|
|
25
25
|
disabled: o,
|
|
26
|
-
readOnly:
|
|
26
|
+
readOnly: _,
|
|
27
27
|
required: d,
|
|
28
|
-
rows:
|
|
29
|
-
id:
|
|
28
|
+
rows: ee,
|
|
29
|
+
id: P,
|
|
30
30
|
name: F,
|
|
31
|
-
placeholder:
|
|
32
|
-
style:
|
|
33
|
-
tabIndex:
|
|
31
|
+
placeholder: te,
|
|
32
|
+
style: ae,
|
|
33
|
+
tabIndex: re,
|
|
34
34
|
value: v,
|
|
35
|
-
valid:
|
|
36
|
-
validationMessage:
|
|
37
|
-
validityStyles:
|
|
35
|
+
valid: I,
|
|
36
|
+
validationMessage: M,
|
|
37
|
+
validityStyles: S,
|
|
38
38
|
onChange: g,
|
|
39
39
|
onFocus: h,
|
|
40
40
|
onBlur: y,
|
|
41
41
|
// Removed to support direct use in Form Field component
|
|
42
|
-
visited:
|
|
43
|
-
touched:
|
|
42
|
+
visited: Ie,
|
|
43
|
+
touched: Me,
|
|
44
44
|
modified: Se,
|
|
45
|
-
resizable:
|
|
46
|
-
inputAttributes:
|
|
47
|
-
textareaStyle:
|
|
48
|
-
...
|
|
49
|
-
} =
|
|
50
|
-
|
|
51
|
-
}, []),
|
|
52
|
-
|
|
53
|
-
}, []), [
|
|
54
|
-
element:
|
|
55
|
-
focus:
|
|
56
|
-
blur:
|
|
45
|
+
resizable: l,
|
|
46
|
+
inputAttributes: oe,
|
|
47
|
+
textareaStyle: T,
|
|
48
|
+
...ne
|
|
49
|
+
} = s, a = t.useRef(null), V = t.useCallback(() => {
|
|
50
|
+
a.current && a.current.focus();
|
|
51
|
+
}, []), E = t.useCallback(() => {
|
|
52
|
+
a.current && a.current.blur();
|
|
53
|
+
}, []), [O, B] = t.useState(Z), [se, A] = t.useState(!1), [le, ie] = q(J), [ue, ce] = q(Q), f = v !== void 0, m = f ? v : O, N = F || P, n = t.useCallback(() => ({
|
|
54
|
+
element: a,
|
|
55
|
+
focus: V,
|
|
56
|
+
blur: E,
|
|
57
57
|
get value() {
|
|
58
58
|
return m;
|
|
59
59
|
},
|
|
60
60
|
get name() {
|
|
61
|
-
return
|
|
61
|
+
return a.current && a.current.name;
|
|
62
62
|
}
|
|
63
|
-
}), [
|
|
64
|
-
|
|
65
|
-
const
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
63
|
+
}), [E, V, m]);
|
|
64
|
+
t.useImperativeHandle(W, n);
|
|
65
|
+
const R = t.useRef(null);
|
|
66
|
+
t.useImperativeHandle(R, n), he("textarea", R, s, s.webMcp);
|
|
67
|
+
const [H, $] = t.useState("auto"), de = ye(), fe = ke(a, s.dir), k = I !== void 0 ? I : d ? !!m : !0;
|
|
68
|
+
t.useEffect(() => {
|
|
69
|
+
a.current && a.current.setCustomValidity && a.current.setCustomValidity(k ? "" : M || "");
|
|
70
|
+
}, [k, M]), Ce(() => {
|
|
71
|
+
a.current && $(`${a.current.scrollHeight}px`);
|
|
70
72
|
}, [m]);
|
|
71
|
-
const C =
|
|
73
|
+
const C = t.useCallback(
|
|
72
74
|
(r) => {
|
|
73
|
-
const
|
|
74
|
-
|
|
75
|
+
const i = r.target.value;
|
|
76
|
+
$("auto"), !f && !o && B(i), g && !o && z(
|
|
75
77
|
g,
|
|
76
78
|
r,
|
|
77
79
|
{
|
|
78
80
|
...n(),
|
|
79
|
-
value:
|
|
81
|
+
value: i
|
|
80
82
|
},
|
|
81
|
-
{ value:
|
|
83
|
+
{ value: i }
|
|
82
84
|
);
|
|
83
85
|
},
|
|
84
|
-
[
|
|
85
|
-
),
|
|
86
|
+
[B, g, o, f]
|
|
87
|
+
), me = t.useCallback(
|
|
86
88
|
(r) => {
|
|
87
89
|
A(!0), h && !o && z(h, r, n(), void 0);
|
|
88
90
|
},
|
|
89
91
|
[h, o, n]
|
|
90
|
-
),
|
|
92
|
+
), pe = t.useCallback(
|
|
91
93
|
(r) => {
|
|
92
94
|
A(!1), y && !o && z(y, r, n(), void 0);
|
|
93
95
|
},
|
|
94
96
|
[y, o, n]
|
|
95
|
-
), be =
|
|
97
|
+
), be = t.useCallback(
|
|
96
98
|
(r) => {
|
|
97
|
-
|
|
98
|
-
const
|
|
99
|
-
target:
|
|
100
|
-
currentTarget:
|
|
99
|
+
a.current && (a.current.value = r);
|
|
100
|
+
const i = {
|
|
101
|
+
target: a.current,
|
|
102
|
+
currentTarget: a.current
|
|
101
103
|
};
|
|
102
|
-
C(
|
|
104
|
+
C(i);
|
|
103
105
|
},
|
|
104
106
|
[C]
|
|
105
107
|
);
|
|
106
|
-
|
|
108
|
+
ze(a, {
|
|
107
109
|
fieldName: N,
|
|
108
110
|
onValueChange: be,
|
|
109
111
|
enabled: !!N
|
|
110
112
|
});
|
|
111
|
-
const
|
|
113
|
+
const xe = t.useMemo(() => {
|
|
112
114
|
let r = {};
|
|
113
115
|
return c ? r = {
|
|
114
116
|
resize: "none",
|
|
115
117
|
overflow: "hidden",
|
|
116
118
|
height: H
|
|
117
|
-
} :
|
|
119
|
+
} : l && (r = { resize: l }), {
|
|
118
120
|
...r,
|
|
119
|
-
...
|
|
121
|
+
...T
|
|
120
122
|
};
|
|
121
|
-
}, [c,
|
|
122
|
-
id:
|
|
123
|
+
}, [c, l, H, T]), ve = {
|
|
124
|
+
id: P || de,
|
|
123
125
|
role: "textbox",
|
|
124
126
|
name: F,
|
|
125
|
-
className:
|
|
126
|
-
"k-resize": !c &&
|
|
127
|
-
"k-resize-none": c ||
|
|
127
|
+
className: D("k-input-inner", "!k-overflow-auto", {
|
|
128
|
+
"k-resize": !c && l !== "none",
|
|
129
|
+
"k-resize-none": c || l === "none",
|
|
128
130
|
"!k-flex-none": x === "vertical"
|
|
129
131
|
}),
|
|
130
|
-
ref:
|
|
132
|
+
ref: a,
|
|
131
133
|
disabled: o,
|
|
132
|
-
rows:
|
|
133
|
-
placeholder:
|
|
134
|
-
readOnly:
|
|
134
|
+
rows: ee,
|
|
135
|
+
placeholder: te,
|
|
136
|
+
readOnly: _,
|
|
135
137
|
required: d,
|
|
136
|
-
tabIndex:
|
|
138
|
+
tabIndex: we(re, o),
|
|
137
139
|
autoFocus: G,
|
|
138
|
-
style:
|
|
139
|
-
"aria-labelledby":
|
|
140
|
+
style: xe,
|
|
141
|
+
"aria-labelledby": X,
|
|
140
142
|
"aria-describedby": U,
|
|
141
143
|
"aria-multiline": !0,
|
|
142
144
|
"aria-disabled": o || void 0,
|
|
143
145
|
"aria-required": d,
|
|
144
|
-
value: f ? v :
|
|
145
|
-
...Object.assign({},
|
|
146
|
+
value: f ? v : O,
|
|
147
|
+
...Object.assign({}, ne, oe),
|
|
146
148
|
onChange: C,
|
|
147
|
-
onFocus:
|
|
148
|
-
onBlur:
|
|
149
|
+
onFocus: me,
|
|
150
|
+
onBlur: pe
|
|
149
151
|
};
|
|
150
|
-
return /* @__PURE__ */
|
|
152
|
+
return /* @__PURE__ */ t.createElement(
|
|
151
153
|
"span",
|
|
152
154
|
{
|
|
153
|
-
className:
|
|
155
|
+
className: D(
|
|
154
156
|
"k-input",
|
|
155
157
|
"k-textarea",
|
|
156
158
|
{
|
|
157
|
-
[`k-input-${
|
|
158
|
-
[`k-input-${
|
|
159
|
-
[`k-rounded-${
|
|
160
|
-
"k-invalid": !(k ||
|
|
159
|
+
[`k-input-${K.sizeMap[p] || p}`]: p,
|
|
160
|
+
[`k-input-${w}`]: w,
|
|
161
|
+
[`k-rounded-${K.roundedMap[b] || b}`]: b,
|
|
162
|
+
"k-invalid": !(k || S !== void 0 || S === !0),
|
|
161
163
|
"k-required": d,
|
|
162
164
|
"k-disabled": o,
|
|
163
|
-
"k-focus":
|
|
165
|
+
"k-focus": se,
|
|
164
166
|
"!k-flex-col": x === "vertical",
|
|
165
167
|
"!k-flex-row": x === "horizontal"
|
|
166
168
|
},
|
|
167
|
-
|
|
169
|
+
Y
|
|
168
170
|
),
|
|
169
|
-
style:
|
|
170
|
-
dir:
|
|
171
|
+
style: ae,
|
|
172
|
+
dir: fe
|
|
171
173
|
},
|
|
172
|
-
|
|
173
|
-
/* @__PURE__ */
|
|
174
|
-
|
|
174
|
+
s.prefix && /* @__PURE__ */ t.createElement(le, { ...ie }),
|
|
175
|
+
/* @__PURE__ */ t.createElement("textarea", { ...ve }),
|
|
176
|
+
s.suffix && /* @__PURE__ */ t.createElement(ue, { ...ce })
|
|
175
177
|
);
|
|
176
178
|
});
|
|
177
|
-
|
|
179
|
+
L.propTypes = {
|
|
178
180
|
ariaDescribedBy: e.string,
|
|
179
181
|
ariaLabelledBy: e.string,
|
|
180
182
|
autoSize: e.bool,
|
|
@@ -200,15 +202,15 @@ K.propTypes = {
|
|
|
200
202
|
autoFocus: e.bool,
|
|
201
203
|
flow: e.oneOf(["vertical", "horizontal"])
|
|
202
204
|
};
|
|
203
|
-
const
|
|
205
|
+
const u = {
|
|
204
206
|
size: void 0,
|
|
205
207
|
rounded: void 0,
|
|
206
208
|
fillMode: void 0,
|
|
207
209
|
autoFocus: !1,
|
|
208
210
|
flow: "horizontal"
|
|
209
211
|
};
|
|
210
|
-
|
|
212
|
+
L.displayName = "KendoTextArea";
|
|
211
213
|
export {
|
|
212
|
-
|
|
213
|
-
|
|
214
|
+
L as TextArea,
|
|
215
|
+
Fe as TextAreaPropsContext
|
|
214
216
|
};
|
|
@@ -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 { CustomComponent, FormComponentProps } from '@progress/kendo-react-common';
|
|
8
|
+
import { CustomComponent, FormComponentProps, WebMcpProps } from '@progress/kendo-react-common';
|
|
9
9
|
import { TextAreaBlurEvent } from './TextAreaBlurEvent';
|
|
10
10
|
import { TextAreaChangeEvent } from './TextAreaChangeEvent';
|
|
11
11
|
import { TextAreaFocusEvent } from './TextAreaFocusEvent';
|
|
@@ -210,5 +210,10 @@ export interface TextAreaProps extends FormComponentProps, Omit<React.TextareaHT
|
|
|
210
210
|
* @hidden
|
|
211
211
|
*/
|
|
212
212
|
textareaStyle?: React.CSSProperties;
|
|
213
|
+
/**
|
|
214
|
+
* Enables Web MCP tool registration for this component.
|
|
215
|
+
* Requires a parent `WebMcpProvider` from `@progress/kendo-react-webmcp`.
|
|
216
|
+
*/
|
|
217
|
+
webMcp?: boolean | WebMcpProps;
|
|
213
218
|
}
|
|
214
219
|
export {};
|