@progress/kendo-react-inputs 8.2.0-develop.1 → 8.2.0-develop.11

package/slider/Slider.mjs

@@ -8,7 +8,7 @@
 "use client";
 import * as i from "react";
 import a from "prop-types";
-import { Keys as o, validatePackage as y, classNames as w, Draggable as x, getTabIndex as T, dispatchEvent as E, createPropsContext as S, withPropsContext as D } from "@progress/kendo-react-common";
+import { Keys as o, validatePackage as y, classNames as w, Draggable as x, getTabIndex as S, dispatchEvent as T, createPropsContext as E, withPropsContext as D } from "@progress/kendo-react-common";
 import { provideLocalizationService as I, registerForLocalization as L } from "@progress/kendo-react-intl";
 import { sliderIncreaseValue as d, messages as p, sliderDecreaseValue as m, sliderDragTitle as u } from "../messages/index.mjs";
 import { SLIDER_LABEL_ATTRIBUTE as C } from "./SliderLabel.mjs";
@@ -127,7 +127,7 @@ const h = class h extends i.Component {
           incrementTitle: s.toLanguageString(d, p[d]),
           decrementTitle: s.toLanguageString(m, p[m])
         },
-        /* @__PURE__ */ i.createElement(x, { onDrag: this.dragOver, onPress: this.dragStart }, /* @__PURE__ */ i.createElement(
+        /* @__PURE__ */ i.createElement(x, { onDrag: this.dragOver, onPress: this.dragStart, autoScroll: !1 }, /* @__PURE__ */ i.createElement(
           "div",
           {
             className: "k-slider-track-wrap",
@@ -182,7 +182,7 @@ const h = class h extends i.Component {
                 "aria-labelledby": this.props.ariaLabelledBy,
                 "aria-describedby": this.props.ariaDescribedBy,
                 "aria-label": this.props.ariaLabel,
-                tabIndex: T(this.props.tabIndex, this.props.disabled, void 0),
+                tabIndex: S(this.props.tabIndex, this.props.disabled, void 0),
                 className: "k-draghandle k-draghandle-end",
                 title: s.toLanguageString(u, p[u]),
                 style: this.props.vertical ? { bottom: "calc(" + t + "%)", zIndex: 1 } : this.state.dir === "rtl" ? { right: "calc(" + t + "% - 13px)", zIndex: 1 } : { left: "calc(" + t + "%)", zIndex: 1 }
@@ -200,7 +200,7 @@ const h = class h extends i.Component {
     return this._sliderTrack;
   }
   change(s, t) {
-    t = Math.min(Math.max(t, this.props.min), this.props.max), this.setState({ value: t }), E(this.props.onChange, s, this, { value: t });
+    t = Math.min(Math.max(t, this.props.min), this.props.max), this.setState({ value: t }), T(this.props.onChange, s, this, { value: t });
   }
 };
 h.displayName = "Slider", h.propTypes = {
@@ -215,7 +215,7 @@ h.displayName = "Slider", h.propTypes = {
   // TODO: validation when buttons is set to true, but no step is provided
 };
 let c = h;
-const A = S(), N = D(A, c);
+const A = E(), N = D(A, c);
 N.displayName = "KendoReactSlider";
 L(c);
 export {

package/textarea/TextArea.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const oe=require("react"),e=require("prop-types"),a=require("@progress/kendo-react-common");function se(s){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const o in s)if(o!=="default"){const l=Object.getOwnPropertyDescriptor(s,o);Object.defineProperty(u,o,l.get?l:{enumerable:!0,get:()=>s[o]})}}return u.default=s,Object.freeze(u)}const t=se(oe),B=a.createPropsContext(),z=t.forwardRef((s,u)=>{const o=a.usePropsContext(B,s),{size:l=k.size,rounded:m=k.rounded,fillMode:O=k.fillMode,prefix:N=null,suffix:w=null,ariaDescribedBy:j,ariaLabelledBy:R,autoSize:T,className:q,defaultValue:D,disabled:r,readOnly:H,required:p,rows:F,id:$,name:L,placeholder:_,style:K,tabIndex:G,value:b,valid:P,validationMessage:M,validityStyles:S,onChange:g,onFocus:x,onBlur:v,visited:le,touched:ie,modified:ue,resizable:y,...J}=o,n=t.useRef(null),E=t.useCallback(()=>{n.current&&n.current.focus()},[]),[I,V]=t.useState(D),[Q,U]=a.useCustomComponent(N),[W,X]=a.useCustomComponent(w),d=b!==void 0,c=d?b:I,f=t.useCallback(()=>({element:n,focus:E,get value(){return c},get name(){return n.current&&n.current.name}}),[E,c]);t.useImperativeHandle(u,f);const[Y,A]=t.useState("auto"),Z=a.useId(),ee=a.useDir(n,o.dir),h=P!==void 0?P:p?!!c:!0;t.useEffect(()=>{n.current&&n.current.setCustomValidity&&n.current.setCustomValidity(h?"":M||"")},[h,M]),a.useIsomorphicLayoutEffect(()=>{n.current&&A(`${n.current.scrollHeight}px`)},[c]);const te=t.useCallback(i=>{const C=i.target.value;A("auto"),!d&&!r&&V(C),g&&!r&&a.dispatchEvent(g,i,{...f(),value:C},{value:C})},[V,g,r,d]),ae=t.useCallback(i=>{x&&!r&&a.dispatchEvent(x,i,f(),void 0)},[x,r]),ne=t.useCallback(i=>{v&&!r&&a.dispatchEvent(v,i,f(),void 0)},[v,r]),re={id:$||Z,role:"textbox",name:L,className:a.classNames("k-input-inner","!k-overflow-auto",{"k-resize":!T&&y!=="none"}),ref:n,disabled:r,rows:F,placeholder:_,readOnly:H,required:p,tabIndex:a.getTabIndex(G,r),style:T?{resize:"none",overflow:"hidden",height:Y}:y?{resize:y}:{},"aria-labelledby":R,"aria-describedby":j,"aria-multiline":!0,"aria-disabled":r||void 0,value:d?b:I,...J,onChange:te,onFocus:ae,onBlur:ne};return t.createElement("span",{className:a.classNames("k-input","k-textarea",{[`k-input-${a.kendoThemeMaps.sizeMap[l]||l}`]:l,[`k-input-${O}`]:O,[`k-rounded-${a.kendoThemeMaps.roundedMap[m]||m}`]:m,"k-invalid":!(h||S!==void 0||S===!0),"k-required":p,"k-disabled":r},q),style:K,dir:ee},o.prefix&&t.createElement(Q,{...U}),t.createElement("textarea",{...re}),o.suffix&&t.createElement(W,{...X}))});z.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([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),resizable:e.oneOf(["none","both","horizontal","vertical"])};const k={size:"medium",rounded:"medium",fillMode:"solid"};z.displayName="KendoTextArea";exports.TextArea=z;exports.TextAreaPropsContext=B;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const se=require("react"),e=require("prop-types"),a=require("@progress/kendo-react-common");function le(s){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const r in s)if(r!=="default"){const l=Object.getOwnPropertyDescriptor(s,r);Object.defineProperty(i,r,l.get?l:{enumerable:!0,get:()=>s[r]})}}return i.default=s,Object.freeze(i)}const t=le(se),B=a.createPropsContext(),z=t.forwardRef((s,i)=>{const r=a.usePropsContext(B,s),{size:l=m.size,rounded:p=m.rounded,fillMode:O=m.fillMode,autoFocus:F=m.autoFocus,prefix:N=null,suffix:w=null,ariaDescribedBy:j,ariaLabelledBy:R,autoSize:T,className:q,defaultValue:D,disabled:o,readOnly:H,required:b,rows:$,id:L,name:_,placeholder:K,style:G,tabIndex:J,value:g,valid:P,validationMessage:M,validityStyles:S,onChange:x,onFocus:v,onBlur:y,visited:ue,touched:ie,modified:ce,resizable:h,...Q}=r,n=t.useRef(null),E=t.useCallback(()=>{n.current&&n.current.focus()},[]),[I,V]=t.useState(D),[U,W]=a.useCustomComponent(N),[X,Y]=a.useCustomComponent(w),c=g!==void 0,d=c?g:I,f=t.useCallback(()=>({element:n,focus:E,get value(){return d},get name(){return n.current&&n.current.name}}),[E,d]);t.useImperativeHandle(i,f);const[Z,A]=t.useState("auto"),ee=a.useId(),te=a.useDir(n,r.dir),C=P!==void 0?P:b?!!d:!0;t.useEffect(()=>{n.current&&n.current.setCustomValidity&&n.current.setCustomValidity(C?"":M||"")},[C,M]),a.useIsomorphicLayoutEffect(()=>{n.current&&A(`${n.current.scrollHeight}px`)},[d]);const ae=t.useCallback(u=>{const k=u.target.value;A("auto"),!c&&!o&&V(k),x&&!o&&a.dispatchEvent(x,u,{...f(),value:k},{value:k})},[V,x,o,c]),ne=t.useCallback(u=>{v&&!o&&a.dispatchEvent(v,u,f(),void 0)},[v,o]),oe=t.useCallback(u=>{y&&!o&&a.dispatchEvent(y,u,f(),void 0)},[y,o]),re={id:L||ee,role:"textbox",name:_,className:a.classNames("k-input-inner","!k-overflow-auto",{"k-resize":!T&&h!=="none"}),ref:n,disabled:o,rows:$,placeholder:K,readOnly:H,required:b,tabIndex:a.getTabIndex(J,o),autoFocus:F,style:T?{resize:"none",overflow:"hidden",height:Z}:h?{resize:h}:{},"aria-labelledby":R,"aria-describedby":j,"aria-multiline":!0,"aria-disabled":o||void 0,value:c?g:I,...Q,onChange:ae,onFocus:ne,onBlur:oe};return t.createElement("span",{className:a.classNames("k-input","k-textarea",{[`k-input-${a.kendoThemeMaps.sizeMap[l]||l}`]:l,[`k-input-${O}`]:O,[`k-rounded-${a.kendoThemeMaps.roundedMap[p]||p}`]:p,"k-invalid":!(C||S!==void 0||S===!0),"k-required":b,"k-disabled":o},q),style:G,dir:te},r.prefix&&t.createElement(U,{...W}),t.createElement("textarea",{...re}),r.suffix&&t.createElement(X,{...Y}))});z.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([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),resizable:e.oneOf(["none","both","horizontal","vertical"]),autoFocus:e.bool};const m={size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};z.displayName="KendoTextArea";exports.TextArea=z;exports.TextAreaPropsContext=B;

package/textarea/TextArea.mjs

@@ -8,156 +8,158 @@
 "use client";
 import * as t from "react";
 import e from "prop-types";
-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";
-const me = se(), w = t.forwardRef((A, N) => {
-  const l = ie(me, A), {
-    size: u = y.size,
-    rounded: d = y.rounded,
-    fillMode: k = y.fillMode,
+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";
+const pe = ie(), S = t.forwardRef((w, A) => {
+  const n = ue(pe, w), {
+    size: d = u.size,
+    rounded: c = u.rounded,
+    fillMode: k = u.fillMode,
+    autoFocus: N = u.autoFocus,
     prefix: H = null,
-    suffix: F = null,
-    ariaDescribedBy: R,
-    ariaLabelledBy: $,
+    suffix: R = null,
+    ariaDescribedBy: $,
+    ariaLabelledBy: D,
     autoSize: C,
-    className: D,
-    defaultValue: L,
+    className: L,
+    defaultValue: q,
     disabled: r,
-    readOnly: q,
-    required: c,
-    rows: j,
-    id: K,
-    name: G,
-    placeholder: J,
-    style: Q,
-    tabIndex: U,
-    value: f,
+    readOnly: j,
+    required: f,
+    rows: K,
+    id: G,
+    name: J,
+    placeholder: Q,
+    style: U,
+    tabIndex: W,
+    value: m,
     valid: z,
     validationMessage: I,
     validityStyles: P,
-    onChange: m,
-    onFocus: p,
-    onBlur: b,
+    onChange: p,
+    onFocus: b,
+    onBlur: x,
     // Removed to support direct use in Form Field component
-    visited: pe,
-    touched: be,
-    modified: xe,
-    resizable: x,
-    ...W
-  } = l, a = t.useRef(null), T = t.useCallback(
+    visited: be,
+    touched: xe,
+    modified: ge,
+    resizable: g,
+    ...X
+  } = n, a = t.useRef(null), T = t.useCallback(
     () => {
       a.current && a.current.focus();
     },
     []
-  ), [V, B] = t.useState(L), [X, Y] = M(H), [Z, _] = M(F), o = f !== void 0, s = o ? f : V, i = t.useCallback(
+  ), [V, B] = t.useState(q), [Y, Z] = F(H), [_, ee] = F(R), s = m !== void 0, l = s ? m : V, i = t.useCallback(
     () => ({
       element: a,
       focus: T,
       get value() {
-        return s;
+        return l;
       },
       get name() {
         return a.current && a.current.name;
       }
     }),
-    [T, s]
+    [T, l]
   );
-  t.useImperativeHandle(N, i);
-  const [ee, E] = t.useState("auto"), te = ue(), ae = de(a, l.dir), g = z !== void 0 ? z : c ? !!s : !0;
+  t.useImperativeHandle(A, i);
+  const [te, E] = t.useState("auto"), ae = de(), re = ce(a, n.dir), v = z !== void 0 ? z : f ? !!l : !0;
   t.useEffect(
     () => {
       a.current && a.current.setCustomValidity && a.current.setCustomValidity(
-        g ? "" : I || ""
+        v ? "" : I || ""
       );
     },
-    [g, I]
-  ), ce(
+    [v, I]
+  ), fe(
     () => {
       a.current && E(`${a.current.scrollHeight}px`);
     },
-    [s]
+    [l]
   );
-  const re = t.useCallback(
-    (n) => {
-      const v = n.target.value;
-      E("auto"), !o && !r && B(v), m && !r && h(
-        m,
-        n,
+  const oe = t.useCallback(
+    (o) => {
+      const h = o.target.value;
+      E("auto"), !s && !r && B(h), p && !r && y(
+        p,
+        o,
         {
           ...i(),
-          value: v
+          value: h
         },
-        { value: v }
+        { value: h }
       );
     },
-    [B, m, r, o]
+    [B, p, r, s]
   ), ne = t.useCallback(
-    (n) => {
-      p && !r && h(
-        p,
-        n,
+    (o) => {
+      b && !r && y(
+        b,
+        o,
         i(),
         void 0
       );
     },
-    [p, r]
-  ), le = t.useCallback(
-    (n) => {
-      b && !r && h(
-        b,
-        n,
+    [b, r]
+  ), se = t.useCallback(
+    (o) => {
+      x && !r && y(
+        x,
+        o,
         i(),
         void 0
       );
     },
-    [b, r]
-  ), oe = {
-    id: K || te,
+    [x, r]
+  ), le = {
+    id: G || ae,
     role: "textbox",
-    name: G,
-    className: O("k-input-inner", "!k-overflow-auto", { "k-resize": !C && x !== "none" }),
+    name: J,
+    className: M("k-input-inner", "!k-overflow-auto", { "k-resize": !C && g !== "none" }),
     ref: a,
     disabled: r,
-    rows: j,
-    placeholder: J,
-    readOnly: q,
-    required: c,
-    tabIndex: fe(U, r),
-    style: C ? { resize: "none", overflow: "hidden", height: ee } : x ? { resize: x } : {},
-    "aria-labelledby": $,
-    "aria-describedby": R,
+    rows: K,
+    placeholder: Q,
+    readOnly: j,
+    required: f,
+    tabIndex: me(W, r),
+    autoFocus: N,
+    style: C ? { resize: "none", overflow: "hidden", height: te } : g ? { resize: g } : {},
+    "aria-labelledby": D,
+    "aria-describedby": $,
     "aria-multiline": !0,
     "aria-disabled": r || void 0,
-    value: o ? f : V,
-    ...W,
-    onChange: re,
+    value: s ? m : V,
+    ...X,
+    onChange: oe,
     onFocus: ne,
-    onBlur: le
+    onBlur: se
   };
   return /* @__PURE__ */ t.createElement(
     "span",
     {
-      className: O(
+      className: M(
         "k-input",
         "k-textarea",
         {
-          [`k-input-${S.sizeMap[u] || u}`]: u,
+          [`k-input-${O.sizeMap[d] || d}`]: d,
           [`k-input-${k}`]: k,
-          [`k-rounded-${S.roundedMap[d] || d}`]: d,
-          "k-invalid": !(g || P !== void 0 || P === !0),
-          "k-required": c,
+          [`k-rounded-${O.roundedMap[c] || c}`]: c,
+          "k-invalid": !(v || P !== void 0 || P === !0),
+          "k-required": f,
           "k-disabled": r
         },
-        D
+        L
       ),
-      style: Q,
-      dir: ae
+      style: U,
+      dir: re
     },
-    l.prefix && /* @__PURE__ */ t.createElement(X, { ...Y }),
-    /* @__PURE__ */ t.createElement("textarea", { ...oe }),
-    l.suffix && /* @__PURE__ */ t.createElement(Z, { ..._ })
+    n.prefix && /* @__PURE__ */ t.createElement(Y, { ...Z }),
+    /* @__PURE__ */ t.createElement("textarea", { ...le }),
+    n.suffix && /* @__PURE__ */ t.createElement(_, { ...ee })
   );
 });
-w.propTypes = {
+S.propTypes = {
   ariaDescribedBy: e.string,
   ariaLabelledBy: e.string,
   autoSize: e.bool,
@@ -183,15 +185,17 @@ w.propTypes = {
   size: e.oneOf([null, "small", "medium", "large"]),
   rounded: e.oneOf([null, "small", "medium", "large", "full"]),
   fillMode: e.oneOf([null, "solid", "flat", "outline"]),
-  resizable: e.oneOf(["none", "both", "horizontal", "vertical"])
+  resizable: e.oneOf(["none", "both", "horizontal", "vertical"]),
+  autoFocus: e.bool
 };
-const y = {
+const u = {
   size: "medium",
   rounded: "medium",
-  fillMode: "solid"
+  fillMode: "solid",
+  autoFocus: !1
 };
-w.displayName = "KendoTextArea";
+S.displayName = "KendoTextArea";
 export {
-  w as TextArea,
-  me as TextAreaPropsContext
+  S as TextArea,
+  pe as TextAreaPropsContext
 };

package/textbox/Textbox.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"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;
+"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;

package/textbox/Textbox.mjs

@@ -7,26 +7,26 @@
  */
 "use client";
 import * as e from "react";
-import i from "prop-types";
-import { validatePackage as T, useCustomComponent as f, useAsyncFocusBlur as P, classNames as S, kendoThemeMaps as m } from "@progress/kendo-react-common";
-import { packageMetadata as O } from "../package-metadata.mjs";
+import a from "prop-types";
+import { validatePackage as P, useCustomComponent as f, useAsyncFocusBlur as S, classNames as O, kendoThemeMaps as m } from "@progress/kendo-react-common";
+import { packageMetadata as $ } from "../package-metadata.mjs";
 const v = e.forwardRef((n, g) => {
-  T(O);
-  const u = e.useRef(null), a = e.useRef(null), r = e.useRef(), k = e.useCallback(
+  P($);
+  const l = e.useRef(null), r = e.useRef(null), o = e.useRef(), k = e.useCallback(
     () => {
       var t;
-      return r.current !== void 0 ? r.current : (t = u.current) == null ? void 0 : t.value;
+      return o.current !== void 0 ? o.current : (t = l.current) == null ? void 0 : t.value;
     },
     []
   );
   e.useImperativeHandle(
-    a,
+    r,
     () => ({
       get element() {
-        return u.current;
+        return l.current;
       },
       get name() {
-        return u.current && u.current.name;
+        return l.current && l.current.name;
       },
       get value() {
         return k();
@@ -34,89 +34,93 @@ const v = e.forwardRef((n, g) => {
     })
   ), e.useImperativeHandle(
     g,
-    () => a.current
+    () => r.current
   );
   const {
-    size: o = l.size,
-    fillMode: d = l.fillMode,
-    rounded: s = l.rounded,
-    className: x,
-    dir: h,
-    style: p,
-    prefix: C = l.prefix,
-    suffix: y = l.suffix,
-    valid: $,
+    size: s = u.size,
+    fillMode: c = u.fillMode,
+    rounded: i = u.rounded,
+    autoFocus: x = u.autoFocus,
+    className: h,
+    dir: p,
+    style: C,
+    prefix: F = u.prefix,
+    suffix: y = u.suffix,
+    valid: q,
     // Destruct to avoid warning when used inside a form field
-    modified: q,
-    touched: H,
-    visited: I,
+    modified: H,
+    touched: I,
+    visited: w,
     ...B
-  } = n, [M] = f(C), [E] = f(y), [F, c] = e.useState(!1), R = (t) => {
-    c(!0);
-  }, _ = (t) => {
-    c(!1);
-  }, b = e.useCallback(
+  } = n, [M] = f(F), [E] = f(y), [R, d] = e.useState(!1), _ = (t) => {
+    d(!0);
+  }, b = (t) => {
+    d(!1);
+  }, z = e.useCallback(
     (t) => {
-      r.current = t.target.value, n.onChange && n.onChange.call(void 0, {
+      o.current = t.target.value, n.onChange && n.onChange.call(void 0, {
         syntheticEvent: t,
         nativeEvent: t.nativeEvent,
         value: t.target.value,
-        target: a.current
-      }), r.current = void 0;
+        target: r.current
+      }), o.current = void 0;
     },
     [n.onChange]
-  ), { onFocus: z, onBlur: N } = P({
-    onFocus: R,
-    onBlur: _,
+  ), { onFocus: N, onBlur: T } = S({
+    onFocus: _,
+    onBlur: b,
     onSyncFocus: n.onFocus,
     onSyncBlur: n.onBlur
   });
   return /* @__PURE__ */ e.createElement(
     "span",
     {
-      style: p,
-      dir: h,
-      className: S(
+      style: C,
+      dir: p,
+      className: O(
         "k-textbox k-input",
         {
-          [`k-input-${m.sizeMap[o] || o}`]: o,
-          [`k-input-${d}`]: d,
-          [`k-rounded-${m.roundedMap[s] || s}`]: s
+          [`k-input-${m.sizeMap[s] || s}`]: s,
+          [`k-input-${c}`]: c,
+          [`k-rounded-${m.roundedMap[i] || i}`]: i
         },
         {
-          "k-focus": F,
+          "k-focus": R,
           "k-required": n.required,
           "k-disabled": n.disabled,
           "k-invalid": n.valid === !1
         },
-        x
+        h
       ),
-      onFocus: z,
-      onBlur: N
+      onFocus: N,
+      onBlur: T
     },
     /* @__PURE__ */ e.createElement(M, null),
     /* @__PURE__ */ e.createElement(
       "input",
       {
-        ref: u,
+        ref: l,
         className: "k-input-inner",
+        autoFocus: x,
         ...B,
-        onChange: b
+        onChange: z
       }
     ),
     /* @__PURE__ */ e.createElement(E, null)
   );
-}), l = {
+}), u = {
   prefix: (n) => null,
   suffix: (n) => null,
   size: "medium",
   rounded: "medium",
-  fillMode: "solid"
+  fillMode: "solid",
+  autoFocus: !1
 };
 v.propTypes = {
-  size: i.oneOf([null, "small", "medium", "large"]),
-  rounded: i.oneOf([null, "small", "medium", "large", "full"]),
-  fillMode: i.oneOf([null, "solid", "flat", "outline"])
+  size: a.oneOf([null, "small", "medium", "large"]),
+  rounded: a.oneOf([null, "small", "medium", "large", "full"]),
+  fillMode: a.oneOf([null, "solid", "flat", "outline"]),
+  autoFocus: a.bool
 };
 v.displayName = "KendoReactTextBoxComponent";
 export {