@progress/kendo-react-inputs 8.2.0-develop.9 → 8.2.0

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.
@@ -8,156 +8,158 @@
8
8
  "use client";
9
9
  import * as t from "react";
10
10
  import e from "prop-types";
11
- import { createPropsContext as se, usePropsContext as ie, useCustomComponent as M, useId as ue, useDir as de, useIsomorphicLayoutEffect as ce, dispatchEvent as h, classNames as O, getTabIndex as fe, kendoThemeMaps as S } from "@progress/kendo-react-common";
12
- const me = se(), w = t.forwardRef((A, N) => {
13
- const l = ie(me, A), {
14
- size: u = y.size,
15
- rounded: d = y.rounded,
16
- fillMode: k = y.fillMode,
11
+ import { createPropsContext as ie, usePropsContext as ue, useCustomComponent as F, useId as de, useDir as ce, useIsomorphicLayoutEffect as fe, dispatchEvent as y, classNames as M, getTabIndex as me, kendoThemeMaps as O } from "@progress/kendo-react-common";
12
+ const pe = ie(), S = t.forwardRef((w, A) => {
13
+ const n = ue(pe, w), {
14
+ size: d = u.size,
15
+ rounded: c = u.rounded,
16
+ fillMode: k = u.fillMode,
17
+ autoFocus: N = u.autoFocus,
17
18
  prefix: H = null,
18
- suffix: F = null,
19
- ariaDescribedBy: R,
20
- ariaLabelledBy: $,
19
+ suffix: R = null,
20
+ ariaDescribedBy: $,
21
+ ariaLabelledBy: D,
21
22
  autoSize: C,
22
- className: D,
23
- defaultValue: L,
23
+ className: L,
24
+ defaultValue: q,
24
25
  disabled: r,
25
- readOnly: q,
26
- required: c,
27
- rows: j,
28
- id: K,
29
- name: G,
30
- placeholder: J,
31
- style: Q,
32
- tabIndex: U,
33
- value: f,
26
+ readOnly: j,
27
+ required: f,
28
+ rows: K,
29
+ id: G,
30
+ name: J,
31
+ placeholder: Q,
32
+ style: U,
33
+ tabIndex: W,
34
+ value: m,
34
35
  valid: z,
35
36
  validationMessage: I,
36
37
  validityStyles: P,
37
- onChange: m,
38
- onFocus: p,
39
- onBlur: b,
38
+ onChange: p,
39
+ onFocus: b,
40
+ onBlur: x,
40
41
  // Removed to support direct use in Form Field component
41
- visited: pe,
42
- touched: be,
43
- modified: xe,
44
- resizable: x,
45
- ...W
46
- } = l, a = t.useRef(null), T = t.useCallback(
42
+ visited: be,
43
+ touched: xe,
44
+ modified: ge,
45
+ resizable: g,
46
+ ...X
47
+ } = n, a = t.useRef(null), T = t.useCallback(
47
48
  () => {
48
49
  a.current && a.current.focus();
49
50
  },
50
51
  []
51
- ), [V, B] = t.useState(L), [X, Y] = M(H), [Z, _] = M(F), o = f !== void 0, s = o ? f : V, i = t.useCallback(
52
+ ), [V, B] = t.useState(q), [Y, Z] = F(H), [_, ee] = F(R), s = m !== void 0, l = s ? m : V, i = t.useCallback(
52
53
  () => ({
53
54
  element: a,
54
55
  focus: T,
55
56
  get value() {
56
- return s;
57
+ return l;
57
58
  },
58
59
  get name() {
59
60
  return a.current && a.current.name;
60
61
  }
61
62
  }),
62
- [T, s]
63
+ [T, l]
63
64
  );
64
- t.useImperativeHandle(N, i);
65
- const [ee, E] = t.useState("auto"), te = ue(), ae = de(a, l.dir), g = z !== void 0 ? z : c ? !!s : !0;
65
+ t.useImperativeHandle(A, i);
66
+ const [te, E] = t.useState("auto"), ae = de(), re = ce(a, n.dir), v = z !== void 0 ? z : f ? !!l : !0;
66
67
  t.useEffect(
67
68
  () => {
68
69
  a.current && a.current.setCustomValidity && a.current.setCustomValidity(
69
- g ? "" : I || ""
70
+ v ? "" : I || ""
70
71
  );
71
72
  },
72
- [g, I]
73
- ), ce(
73
+ [v, I]
74
+ ), fe(
74
75
  () => {
75
76
  a.current && E(`${a.current.scrollHeight}px`);
76
77
  },
77
- [s]
78
+ [l]
78
79
  );
79
- const re = t.useCallback(
80
- (n) => {
81
- const v = n.target.value;
82
- E("auto"), !o && !r && B(v), m && !r && h(
83
- m,
84
- n,
80
+ const oe = t.useCallback(
81
+ (o) => {
82
+ const h = o.target.value;
83
+ E("auto"), !s && !r && B(h), p && !r && y(
84
+ p,
85
+ o,
85
86
  {
86
87
  ...i(),
87
- value: v
88
+ value: h
88
89
  },
89
- { value: v }
90
+ { value: h }
90
91
  );
91
92
  },
92
- [B, m, r, o]
93
+ [B, p, r, s]
93
94
  ), ne = t.useCallback(
94
- (n) => {
95
- p && !r && h(
96
- p,
97
- n,
95
+ (o) => {
96
+ b && !r && y(
97
+ b,
98
+ o,
98
99
  i(),
99
100
  void 0
100
101
  );
101
102
  },
102
- [p, r]
103
- ), le = t.useCallback(
104
- (n) => {
105
- b && !r && h(
106
- b,
107
- n,
103
+ [b, r]
104
+ ), se = t.useCallback(
105
+ (o) => {
106
+ x && !r && y(
107
+ x,
108
+ o,
108
109
  i(),
109
110
  void 0
110
111
  );
111
112
  },
112
- [b, r]
113
- ), oe = {
114
- id: K || te,
113
+ [x, r]
114
+ ), le = {
115
+ id: G || ae,
115
116
  role: "textbox",
116
- name: G,
117
- className: O("k-input-inner", "!k-overflow-auto", { "k-resize": !C && x !== "none" }),
117
+ name: J,
118
+ className: M("k-input-inner", "!k-overflow-auto", { "k-resize": !C && g !== "none" }),
118
119
  ref: a,
119
120
  disabled: r,
120
- rows: j,
121
- placeholder: J,
122
- readOnly: q,
123
- required: c,
124
- tabIndex: fe(U, r),
125
- style: C ? { resize: "none", overflow: "hidden", height: ee } : x ? { resize: x } : {},
126
- "aria-labelledby": $,
127
- "aria-describedby": R,
121
+ rows: K,
122
+ placeholder: Q,
123
+ readOnly: j,
124
+ required: f,
125
+ tabIndex: me(W, r),
126
+ autoFocus: N,
127
+ style: C ? { resize: "none", overflow: "hidden", height: te } : g ? { resize: g } : {},
128
+ "aria-labelledby": D,
129
+ "aria-describedby": $,
128
130
  "aria-multiline": !0,
129
131
  "aria-disabled": r || void 0,
130
- value: o ? f : V,
131
- ...W,
132
- onChange: re,
132
+ value: s ? m : V,
133
+ ...X,
134
+ onChange: oe,
133
135
  onFocus: ne,
134
- onBlur: le
136
+ onBlur: se
135
137
  };
136
138
  return /* @__PURE__ */ t.createElement(
137
139
  "span",
138
140
  {
139
- className: O(
141
+ className: M(
140
142
  "k-input",
141
143
  "k-textarea",
142
144
  {
143
- [`k-input-${S.sizeMap[u] || u}`]: u,
145
+ [`k-input-${O.sizeMap[d] || d}`]: d,
144
146
  [`k-input-${k}`]: k,
145
- [`k-rounded-${S.roundedMap[d] || d}`]: d,
146
- "k-invalid": !(g || P !== void 0 || P === !0),
147
- "k-required": c,
147
+ [`k-rounded-${O.roundedMap[c] || c}`]: c,
148
+ "k-invalid": !(v || P !== void 0 || P === !0),
149
+ "k-required": f,
148
150
  "k-disabled": r
149
151
  },
150
- D
152
+ L
151
153
  ),
152
- style: Q,
153
- dir: ae
154
+ style: U,
155
+ dir: re
154
156
  },
155
- l.prefix && /* @__PURE__ */ t.createElement(X, { ...Y }),
156
- /* @__PURE__ */ t.createElement("textarea", { ...oe }),
157
- l.suffix && /* @__PURE__ */ t.createElement(Z, { ..._ })
157
+ n.prefix && /* @__PURE__ */ t.createElement(Y, { ...Z }),
158
+ /* @__PURE__ */ t.createElement("textarea", { ...le }),
159
+ n.suffix && /* @__PURE__ */ t.createElement(_, { ...ee })
158
160
  );
159
161
  });
160
- w.propTypes = {
162
+ S.propTypes = {
161
163
  ariaDescribedBy: e.string,
162
164
  ariaLabelledBy: e.string,
163
165
  autoSize: e.bool,
@@ -183,15 +185,17 @@ w.propTypes = {
183
185
  size: e.oneOf([null, "small", "medium", "large"]),
184
186
  rounded: e.oneOf([null, "small", "medium", "large", "full"]),
185
187
  fillMode: e.oneOf([null, "solid", "flat", "outline"]),
186
- resizable: e.oneOf(["none", "both", "horizontal", "vertical"])
188
+ resizable: e.oneOf(["none", "both", "horizontal", "vertical"]),
189
+ autoFocus: e.bool
187
190
  };
188
- const y = {
191
+ const u = {
189
192
  size: "medium",
190
193
  rounded: "medium",
191
- fillMode: "solid"
194
+ fillMode: "solid",
195
+ autoFocus: !1
192
196
  };
193
- w.displayName = "KendoTextArea";
197
+ S.displayName = "KendoTextArea";
194
198
  export {
195
- w as TextArea,
196
- me as TextAreaPropsContext
199
+ S as TextArea,
200
+ pe as TextAreaPropsContext
197
201
  };
@@ -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 E=require("react"),d=require("prop-types"),l=require("@progress/kendo-react-common"),F=require("../package-metadata.js");function P(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,a.get?a:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const t=P(E),f=t.forwardRef((e,r)=>{l.validatePackage(F.packageMetadata);const n=t.useRef(null),a=t.useRef(null),s=t.useRef(),v=t.useCallback(()=>{var u;return s.current!==void 0?s.current:(u=n.current)==null?void 0:u.value},[]);t.useImperativeHandle(a,()=>({get element(){return n.current},get name(){return n.current&&n.current.name},get value(){return v()}})),t.useImperativeHandle(r,()=>a.current);const{size:c=o.size,fillMode:m=o.fillMode,rounded:i=o.rounded,className:k,dir:p,style:x,prefix:h=o.prefix,suffix:C=o.suffix,valid:q,modified:z,touched:N,visited:j,...b}=e,[y]=l.useCustomComponent(h),[M]=l.useCustomComponent(C),[_,g]=t.useState(!1),B=u=>{g(!0)},O=u=>{g(!1)},R=t.useCallback(u=>{s.current=u.target.value,e.onChange&&e.onChange.call(void 0,{syntheticEvent:u,nativeEvent:u.nativeEvent,value:u.target.value,target:a.current}),s.current=void 0},[e.onChange]),{onFocus:T,onBlur:S}=l.useAsyncFocusBlur({onFocus:B,onBlur:O,onSyncFocus:e.onFocus,onSyncBlur:e.onBlur});return t.createElement("span",{style:x,dir:p,className:l.classNames("k-textbox k-input",{[`k-input-${l.kendoThemeMaps.sizeMap[c]||c}`]:c,[`k-input-${m}`]:m,[`k-rounded-${l.kendoThemeMaps.roundedMap[i]||i}`]:i},{"k-focus":_,"k-required":e.required,"k-disabled":e.disabled,"k-invalid":e.valid===!1},k),onFocus:T,onBlur:S},t.createElement(y,null),t.createElement("input",{ref:n,className:"k-input-inner",...b,onChange:R}),t.createElement(M,null))}),o={prefix:e=>null,suffix:e=>null,size:"medium",rounded:"medium",fillMode:"solid"};f.propTypes={size:d.oneOf([null,"small","medium","large"]),rounded:d.oneOf([null,"small","medium","large","full"]),fillMode:d.oneOf([null,"solid","flat","outline"])};f.displayName="KendoReactTextBoxComponent";exports.TextBox=f;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react"),c=require("prop-types"),o=require("@progress/kendo-react-common"),P=require("../package-metadata.js");function q(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,a.get?a:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const t=q(E),f=t.forwardRef((e,r)=>{o.validatePackage(P.packageMetadata);const n=t.useRef(null),a=t.useRef(null),s=t.useRef(),v=t.useCallback(()=>{var u;return s.current!==void 0?s.current:(u=n.current)==null?void 0:u.value},[]);t.useImperativeHandle(a,()=>({get element(){return n.current},get name(){return n.current&&n.current.name},get value(){return v()}})),t.useImperativeHandle(r,()=>a.current);const{size:i=l.size,fillMode:m=l.fillMode,rounded:d=l.rounded,autoFocus:k=l.autoFocus,className:p,dir:x,style:h,prefix:b=l.prefix,suffix:C=l.suffix,valid:z,modified:N,touched:j,visited:D,...y}=e,[M]=o.useCustomComponent(b),[F]=o.useCustomComponent(C),[_,g]=t.useState(!1),B=u=>{g(!0)},O=u=>{g(!1)},R=t.useCallback(u=>{s.current=u.target.value,e.onChange&&e.onChange.call(void 0,{syntheticEvent:u,nativeEvent:u.nativeEvent,value:u.target.value,target:a.current}),s.current=void 0},[e.onChange]),{onFocus:T,onBlur:S}=o.useAsyncFocusBlur({onFocus:B,onBlur:O,onSyncFocus:e.onFocus,onSyncBlur:e.onBlur});return t.createElement("span",{style:h,dir:x,className:o.classNames("k-textbox k-input",{[`k-input-${o.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-input-${m}`]:m,[`k-rounded-${o.kendoThemeMaps.roundedMap[d]||d}`]:d},{"k-focus":_,"k-required":e.required,"k-disabled":e.disabled,"k-invalid":e.valid===!1},p),onFocus:T,onBlur:S},t.createElement(M,null),t.createElement("input",{ref:n,className:"k-input-inner",autoFocus:k,...y,onChange:R}),t.createElement(F,null))}),l={prefix:e=>null,suffix:e=>null,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};f.propTypes={size:c.oneOf([null,"small","medium","large"]),rounded:c.oneOf([null,"small","medium","large","full"]),fillMode:c.oneOf([null,"solid","flat","outline"]),autoFocus:c.bool};f.displayName="KendoReactTextBoxComponent";exports.TextBox=f;
@@ -7,26 +7,26 @@
7
7
  */
8
8
  "use client";
9
9
  import * as e from "react";
10
- import i from "prop-types";
11
- import { validatePackage as T, useCustomComponent as f, useAsyncFocusBlur as P, classNames as S, kendoThemeMaps as m } from "@progress/kendo-react-common";
12
- import { packageMetadata as O } from "../package-metadata.mjs";
10
+ import a from "prop-types";
11
+ import { validatePackage as P, useCustomComponent as f, useAsyncFocusBlur as S, classNames as O, kendoThemeMaps as m } from "@progress/kendo-react-common";
12
+ import { packageMetadata as $ } from "../package-metadata.mjs";
13
13
  const v = e.forwardRef((n, g) => {
14
- T(O);
15
- const u = e.useRef(null), a = e.useRef(null), r = e.useRef(), k = e.useCallback(
14
+ P($);
15
+ const l = e.useRef(null), r = e.useRef(null), o = e.useRef(), k = e.useCallback(
16
16
  () => {
17
17
  var t;
18
- return r.current !== void 0 ? r.current : (t = u.current) == null ? void 0 : t.value;
18
+ return o.current !== void 0 ? o.current : (t = l.current) == null ? void 0 : t.value;
19
19
  },
20
20
  []
21
21
  );
22
22
  e.useImperativeHandle(
23
- a,
23
+ r,
24
24
  () => ({
25
25
  get element() {
26
- return u.current;
26
+ return l.current;
27
27
  },
28
28
  get name() {
29
- return u.current && u.current.name;
29
+ return l.current && l.current.name;
30
30
  },
31
31
  get value() {
32
32
  return k();
@@ -34,89 +34,93 @@ const v = e.forwardRef((n, g) => {
34
34
  })
35
35
  ), e.useImperativeHandle(
36
36
  g,
37
- () => a.current
37
+ () => r.current
38
38
  );
39
39
  const {
40
- size: o = l.size,
41
- fillMode: d = l.fillMode,
42
- rounded: s = l.rounded,
43
- className: x,
44
- dir: h,
45
- style: p,
46
- prefix: C = l.prefix,
47
- suffix: y = l.suffix,
48
- valid: $,
40
+ size: s = u.size,
41
+ fillMode: c = u.fillMode,
42
+ rounded: i = u.rounded,
43
+ autoFocus: x = u.autoFocus,
44
+ className: h,
45
+ dir: p,
46
+ style: C,
47
+ prefix: F = u.prefix,
48
+ suffix: y = u.suffix,
49
+ valid: q,
49
50
  // Destruct to avoid warning when used inside a form field
50
- modified: q,
51
- touched: H,
52
- visited: I,
51
+ modified: H,
52
+ touched: I,
53
+ visited: w,
53
54
  ...B
54
- } = n, [M] = f(C), [E] = f(y), [F, c] = e.useState(!1), R = (t) => {
55
- c(!0);
56
- }, _ = (t) => {
57
- c(!1);
58
- }, b = e.useCallback(
55
+ } = n, [M] = f(F), [E] = f(y), [R, d] = e.useState(!1), _ = (t) => {
56
+ d(!0);
57
+ }, b = (t) => {
58
+ d(!1);
59
+ }, z = e.useCallback(
59
60
  (t) => {
60
- r.current = t.target.value, n.onChange && n.onChange.call(void 0, {
61
+ o.current = t.target.value, n.onChange && n.onChange.call(void 0, {
61
62
  syntheticEvent: t,
62
63
  nativeEvent: t.nativeEvent,
63
64
  value: t.target.value,
64
- target: a.current
65
- }), r.current = void 0;
65
+ target: r.current
66
+ }), o.current = void 0;
66
67
  },
67
68
  [n.onChange]
68
- ), { onFocus: z, onBlur: N } = P({
69
- onFocus: R,
70
- onBlur: _,
69
+ ), { onFocus: N, onBlur: T } = S({
70
+ onFocus: _,
71
+ onBlur: b,
71
72
  onSyncFocus: n.onFocus,
72
73
  onSyncBlur: n.onBlur
73
74
  });
74
75
  return /* @__PURE__ */ e.createElement(
75
76
  "span",
76
77
  {
77
- style: p,
78
- dir: h,
79
- className: S(
78
+ style: C,
79
+ dir: p,
80
+ className: O(
80
81
  "k-textbox k-input",
81
82
  {
82
- [`k-input-${m.sizeMap[o] || o}`]: o,
83
- [`k-input-${d}`]: d,
84
- [`k-rounded-${m.roundedMap[s] || s}`]: s
83
+ [`k-input-${m.sizeMap[s] || s}`]: s,
84
+ [`k-input-${c}`]: c,
85
+ [`k-rounded-${m.roundedMap[i] || i}`]: i
85
86
  },
86
87
  {
87
- "k-focus": F,
88
+ "k-focus": R,
88
89
  "k-required": n.required,
89
90
  "k-disabled": n.disabled,
90
91
  "k-invalid": n.valid === !1
91
92
  },
92
- x
93
+ h
93
94
  ),
94
- onFocus: z,
95
- onBlur: N
95
+ onFocus: N,
96
+ onBlur: T
96
97
  },
97
98
  /* @__PURE__ */ e.createElement(M, null),
98
99
  /* @__PURE__ */ e.createElement(
99
100
  "input",
100
101
  {
101
- ref: u,
102
+ ref: l,
102
103
  className: "k-input-inner",
104
+ autoFocus: x,
103
105
  ...B,
104
- onChange: b
106
+ onChange: z
105
107
  }
106
108
  ),
107
109
  /* @__PURE__ */ e.createElement(E, null)
108
110
  );
109
- }), l = {
111
+ }), u = {
110
112
  prefix: (n) => null,
111
113
  suffix: (n) => null,
112
114
  size: "medium",
113
115
  rounded: "medium",
114
- fillMode: "solid"
116
+ fillMode: "solid",
117
+ autoFocus: !1
115
118
  };
116
119
  v.propTypes = {
117
- size: i.oneOf([null, "small", "medium", "large"]),
118
- rounded: i.oneOf([null, "small", "medium", "large", "full"]),
119
- fillMode: i.oneOf([null, "solid", "flat", "outline"])
120
+ size: a.oneOf([null, "small", "medium", "large"]),
121
+ rounded: a.oneOf([null, "small", "medium", "large", "full"]),
122
+ fillMode: a.oneOf([null, "solid", "flat", "outline"]),
123
+ autoFocus: a.bool
120
124
  };
121
125
  v.displayName = "KendoReactTextBoxComponent";
122
126
  export {