@progress/kendo-react-inputs 13.3.0-develop.9 → 13.4.0-develop.1

package/textarea/TextArea.mjs

@@ -7,7 +7,7 @@
  */
 import * as t from "react";
 import e from "prop-types";
-import { createPropsContext as be, usePropsContext as xe, useCustomComponent as B, useId as ge, useDir as ve, useIsomorphicLayoutEffect as he, dispatchEvent as C, classNames as N, getTabIndex as ye, kendoThemeMaps as H } from "@progress/kendo-react-common";
+import { createPropsContext as be, usePropsContext as xe, useCustomComponent as B, useId as ve, useDir as ge, useIsomorphicLayoutEffect as he, dispatchEvent as C, getTabIndex as ye, classNames as N, kendoThemeMaps as H } from "@progress/kendo-react-common";
 const ke = be(), R = t.forwardRef(($, q) => {
   const i = xe(ke, $), {
     size: m = n.size,
@@ -22,7 +22,7 @@ const ke = be(), R = t.forwardRef(($, q) => {
     autoSize: u,
     className: J,
     defaultValue: Q,
-    disabled: r,
+    disabled: o,
     readOnly: U,
     required: d,
     rows: W,
@@ -35,14 +35,14 @@ const ke = be(), R = t.forwardRef(($, q) => {
     valid: w,
     validationMessage: S,
     validityStyles: F,
-    onChange: g,
-    onFocus: v,
+    onChange: v,
+    onFocus: g,
     onBlur: h,
     // Removed to support direct use in Form Field component
     visited: Ce,
     touched: ze,
     modified: we,
-    resizable: s,
+    resizable: l,
     inputAttributes: te,
     textareaStyle: I,
     ...ae
@@ -50,7 +50,7 @@ const ke = be(), R = t.forwardRef(($, q) => {
     a.current && a.current.focus();
   }, []), T = t.useCallback(() => {
     a.current && a.current.blur();
-  }, []), [E, M] = t.useState(Q), [re, P] = t.useState(!1), [oe, le] = B(L), [se, ne] = B(j), c = x !== void 0, f = c ? x : E, l = t.useCallback(() => ({
+  }, []), [E, M] = t.useState(Q), [oe, P] = t.useState(!1), [re, se] = B(L), [le, ne] = B(j), c = x !== void 0, f = c ? x : E, s = t.useCallback(() => ({
     element: a,
     focus: O,
     blur: T,
@@ -61,69 +61,69 @@ const ke = be(), R = t.forwardRef(($, q) => {
       return a.current && a.current.name;
     }
   }), [T, O, f]);
-  t.useImperativeHandle(q, l);
-  const [V, A] = t.useState("auto"), ie = ge(), ue = ve(a, i.dir), y = w !== void 0 ? w : d ? !!f : !0;
+  t.useImperativeHandle(q, s);
+  const [V, A] = t.useState("auto"), ie = ve(), ue = ge(a, i.dir), y = w !== void 0 ? w : d ? !!f : !0;
   t.useEffect(() => {
     a.current && a.current.setCustomValidity && a.current.setCustomValidity(y ? "" : S || "");
   }, [y, S]), he(() => {
     a.current && A(`${a.current.scrollHeight}px`);
   }, [f]);
   const de = t.useCallback(
-    (o) => {
-      const k = o.target.value;
-      A("auto"), !c && !r && M(k), g && !r && C(
-        g,
-        o,
+    (r) => {
+      const k = r.target.value;
+      A("auto"), !c && !o && M(k), v && !o && C(
+        v,
+        r,
         {
-          ...l(),
+          ...s(),
           value: k
         },
         { value: k }
       );
     },
-    [M, g, r, c]
+    [M, v, o, c]
   ), ce = t.useCallback(
-    (o) => {
-      P(!0), v && !r && C(v, o, l(), void 0);
+    (r) => {
+      P(!0), g && !o && C(g, r, s(), void 0);
     },
-    [v, r, l]
+    [g, o, s]
   ), fe = t.useCallback(
-    (o) => {
-      P(!1), h && !r && C(h, o, l(), void 0);
+    (r) => {
+      P(!1), h && !o && C(h, r, s(), void 0);
     },
-    [h, r, l]
+    [h, o, s]
   ), me = t.useMemo(() => {
-    let o = {};
-    return u ? o = {
+    let r = {};
+    return u ? r = {
       resize: "none",
       overflow: "hidden",
       height: V
-    } : s && (o = { resize: s }), {
-      ...o,
+    } : l && (r = { resize: l }), {
+      ...r,
       ...I
     };
-  }, [u, s, V, I]), pe = {
+  }, [u, l, V, I]), pe = {
     id: X || ie,
     role: "textbox",
     name: Y,
     className: N("k-input-inner", "!k-overflow-auto", {
-      "k-resize": !u && s !== "none",
-      "k-resize-none": u || s === "none",
+      "k-resize": !u && l !== "none",
+      "k-resize-none": u || l === "none",
       "!k-flex-none": b === "vertical"
     }),
     ref: a,
-    disabled: r,
+    disabled: o,
     rows: W,
     placeholder: Z,
     readOnly: U,
     required: d,
-    tabIndex: ye(ee, r),
+    tabIndex: ye(ee, o),
     autoFocus: D,
     style: me,
     "aria-labelledby": G,
     "aria-describedby": K,
     "aria-multiline": !0,
-    "aria-disabled": r || void 0,
+    "aria-disabled": o || void 0,
     "aria-required": d,
     value: c ? x : E,
     ...Object.assign({}, ae, te),
@@ -143,8 +143,8 @@ const ke = be(), R = t.forwardRef(($, q) => {
           [`k-rounded-${H.roundedMap[p] || p}`]: p,
           "k-invalid": !(y || F !== void 0 || F === !0),
           "k-required": d,
-          "k-disabled": r,
-          "k-focus": re,
+          "k-disabled": o,
+          "k-focus": oe,
           "!k-flex-col": b === "vertical",
           "!k-flex-row": b === "horizontal"
         },
@@ -153,9 +153,9 @@ const ke = be(), R = t.forwardRef(($, q) => {
       style: _,
       dir: ue
     },
-    i.prefix && /* @__PURE__ */ t.createElement(oe, { ...le }),
+    i.prefix && /* @__PURE__ */ t.createElement(re, { ...se }),
     /* @__PURE__ */ t.createElement("textarea", { ...pe }),
-    i.suffix && /* @__PURE__ */ t.createElement(se, { ...ne })
+    i.suffix && /* @__PURE__ */ t.createElement(le, { ...ne })
   );
 });
 R.propTypes = {
@@ -177,17 +177,17 @@ R.propTypes = {
   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"]),
+  size: e.oneOf(["small", "medium", "large"]),
+  rounded: e.oneOf(["small", "medium", "large", "full"]),
+  fillMode: e.oneOf(["solid", "flat", "outline"]),
   resizable: e.oneOf(["none", "both", "horizontal", "vertical"]),
   autoFocus: e.bool,
   flow: e.oneOf(["vertical", "horizontal"])
 };
 const n = {
-  size: "medium",
-  rounded: "medium",
-  fillMode: "solid",
+  size: void 0,
+  rounded: void 0,
+  fillMode: void 0,
   autoFocus: !1,
   flow: "horizontal"
 };

package/textarea/interfaces/TextAreaBlurEvent.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { TextAreaHandle } from './../TextArea.js';
+import { BaseEvent } from '@progress/kendo-react-common';
+/**
+ * The arguments for the `onBlur` TextArea event.
+ */
+export interface TextAreaBlurEvent extends BaseEvent<TextAreaHandle> {
+}

package/textarea/interfaces/TextAreaChangeEvent.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { TextAreaHandle } from './../TextArea.js';
+import { BaseEvent } from '@progress/kendo-react-common';
+/**
+ * The arguments for the `onChange` TextArea event.
+ */
+export interface TextAreaChangeEvent extends BaseEvent<TextAreaHandle> {
+    /**
+     * The new value of the TextArea.
+     */
+    value: string;
+}

package/textarea/interfaces/TextAreaFocusEvent.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { TextAreaHandle } from './../TextArea.js';
+import { BaseEvent } from '@progress/kendo-react-common';
+/**
+ * The arguments for the `onFocus` TextArea event.
+ */
+export interface TextAreaFocusEvent extends BaseEvent<TextAreaHandle> {
+}

package/textarea/interfaces/TextAreaProps.d.ts

@@ -0,0 +1,199 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { CustomComponent, FormComponentProps } from '@progress/kendo-react-common';
+import { TextAreaBlurEvent } from './TextAreaBlurEvent.js';
+import { TextAreaChangeEvent } from './TextAreaChangeEvent.js';
+import { TextAreaFocusEvent } from './TextAreaFocusEvent.js';
+/**
+ * @hidden
+ */
+type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
+/**
+ * Represents the props of the [KendoReact TextArea component](https://www.telerik.com/kendo-react-ui/components/inputs/textarea).
+ */
+export interface TextAreaProps extends FormComponentProps, Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'prefix'> {
+    /**
+     * Identifies the element(s) which will describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
+     * For example these elements could contain error or hint message.
+     */
+    ariaDescribedBy?: string;
+    /**
+     * Identifies the element(s) which will label the component.
+     */
+    ariaLabelledBy?: string;
+    /**
+     * Specifies if the textarea element will resize its height automatically ([see example](https://www.telerik.com/kendo-react-ui/components/inputs/textarea/sizing)).
+     * Defaults to `false`.
+     *
+     * Setting the value of the prop to `true` will make the TextArea component to ignore the resize behavior of the `resizable` prop.
+     */
+    autoSize?: boolean;
+    /**
+     * Specifies a list of CSS classes that will be added to the TextArea.
+     */
+    className?: string;
+    /**
+     * The default value of the TextArea ([see example](https://www.telerik.com/kendo-react-ui/components/inputs/textarea/default_state)).
+     */
+    defaultValue?: string | string[] | number;
+    /**
+     * Represents the `dir` HTML attribute.
+     */
+    dir?: string;
+    /**
+     * Specifies if the TextArea is disabled ([see example](https://www.telerik.com/kendo-react-ui/components/inputs/textarea/disabled)).
+     */
+    disabled?: boolean;
+    /**
+     * Sets the read-only state of the TextArea.
+     */
+    readOnly?: boolean;
+    /**
+     * Specifies an exact height size for the TextArea to take ([see example](https://www.telerik.com/kendo-react-ui/components/inputs/textarea/sizing)).
+     */
+    rows?: number;
+    /**
+     * Sets the `id` of the TextArea.
+     */
+    id?: string;
+    /**
+     * Specifies the `name` property of the `textarea` DOM element.
+     *
+     * This property is part of the [FormComponentProps](https://www.telerik.com/kendo-react-ui/components/common/api/formcomponentprops) interface.
+     */
+    name?: string;
+    /**
+     * The hint that is displayed when the TextArea is empty.
+     */
+    placeholder?: string;
+    /**
+     * Sets additional CSS styles to the TextArea.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets the `tabIndex` property of the TextArea.
+     * Defaults to `0`.
+     */
+    tabIndex?: number;
+    /**
+     * Sets the value to be submitted ([see example](https://www.telerik.com/kendo-react-ui/components/inputs/textarea/controlled_mode)).
+     */
+    value?: string | string[] | number;
+    /**
+     * The event handler that will be fired when the changes the selected value.
+     */
+    onChange?: (event: TextAreaChangeEvent) => void;
+    /**
+     * The event handler that will be fired when TextArea is focused.
+     */
+    onFocus?: (event: TextAreaFocusEvent) => void;
+    /**
+     * The event handler that will be fired when TextArea is blurred.
+     */
+    onBlur?: (event: TextAreaBlurEvent) => void;
+    /**
+     * Configures the `size` of the TextArea.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     *
+     * @default undefined (theme-controlled)
+     *
+     * @example
+     * ```tsx
+     * <TextArea size="large" />
+     * ```
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Configures the `roundness` of the TextArea.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - full
+     *
+     * @default undefined (theme-controlled)
+     *
+     * @example
+     * ```tsx
+     * <TextArea rounded="full" />
+     * ```
+     */
+    rounded?: 'small' | 'medium' | 'large' | 'full';
+    /**
+     * Configures the `fillMode` of the TextArea.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     *
+     * @default undefined (theme-controlled)
+     *
+     * @example
+     * ```tsx
+     * <TextArea fillMode="outline" />
+     * ```
+     */
+    fillMode?: 'solid' | 'flat' | 'outline';
+    /**
+     * Sets a custom prefix to the TextArea component.
+     */
+    prefix?: CustomComponent<any>;
+    /**
+     * Sets a custom suffix to the TextArea component.
+     */
+    suffix?: CustomComponent<any>;
+    /**
+     * Defines the resize behavior of the TextArea.
+     * The available options are:
+     * - none &mdash; The TextArea cannot be resized.
+     * - vertical &mdash; The TextArea can be resized vertically.
+     * - horizontal &mdash; The TextArea can be resized horizontally.
+     * - both(default) &mdash; The TextArea can be resized both vertically and horizontally.
+     *
+     *
+     * To be able to resize the TextArea, you should not set the `autoSize` property to `true`.
+     * To be able to resize the component horizontally, add the following inline style to the TextArea:
+     *
+     * ```html
+     * <TextArea resizable='horizontal' style={{width: 'auto'}}  />
+     * ```
+     */
+    resizable?: 'none' | 'vertical' | 'horizontal' | 'both';
+    /**
+     * Represents the `autoFocus` HTML attribute that will be applied to the input element of the TextArea. (Defaults to `false`)
+     */
+    autoFocus?: boolean;
+    /**
+     * Sets the HTML attributes of the inner focusable input element.
+     * Attributes which are essential for certain component functionalities cannot be changed.
+     */
+    inputAttributes?: React.InputHTMLAttributes<HTMLInputElement>;
+    /**
+     * Configures the orientation/flow of the TextArea layout when using prefix or suffix.
+     *
+     * The available options are:
+     * - horizontal &mdash; Prefix and suffix are positioned to the left and right of the textarea(default).
+     * - vertical &mdash; Prefix and suffix are positioned above and below the textarea.
+     *
+     * @default `horizontal`
+     */
+    flow?: 'horizontal' | 'vertical';
+    /**
+     * Sets custom styles to the native textarea element
+     *
+     * @hidden
+     */
+    textareaStyle?: React.CSSProperties;
+}
+export {};

package/textbox/Textbox.d.ts

@@ -0,0 +1,99 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { BaseEvent, CustomComponent, InputsClassStructure } from '@progress/kendo-react-common';
+import * as React from 'react';
+export interface TextBoxChangeEvent extends BaseEvent<TextBoxHandle> {
+    /**
+     * The original React change event.
+     */
+    syntheticEvent: React.ChangeEvent<HTMLInputElement>;
+    /**
+     * The current value of the TextBox component.
+     */
+    value: React.InputHTMLAttributes<HTMLInputElement>['value'];
+}
+/**
+ * Represents the properties of the KendoReact [TextBox](https://www.telerik.com/kendo-react-ui/components/inputs/api/textbox) component
+ */
+export interface TextBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'onChange'> {
+    /**
+     * Configures the `size` of the TextBox.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     *
+     * @default `medium`
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Configures the `roundness` of the TextBox.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - full
+     *
+     * @default `medium`
+     */
+    rounded?: 'small' | 'medium' | 'large' | 'full';
+    /**
+     * Configures the `fillMode` of the TextBox.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     *
+     * @default `solid`
+     */
+    fillMode?: 'solid' | 'flat' | 'outline';
+    /**
+     * The `onChange` callback of the `input` element inside the TextBox.
+     */
+    onChange?: (event: TextBoxChangeEvent) => void;
+    /**
+     * Indicates if the component is in `valid` state
+     */
+    valid?: boolean;
+    /**
+     * Sets a custom prefix to the TextBox component.
+     */
+    prefix?: CustomComponent<any>;
+    /**
+     * Sets a custom suffix to the TextBox component.
+     */
+    suffix?: CustomComponent<any>;
+    /**
+     * Represents the `autoFocus` HTML attribute that will be applied to the input element of the TextBox. (Defaults to `false`)
+     */
+    autoFocus?: boolean;
+    /**
+     * @hidden
+     */
+    unstyled?: InputsClassStructure;
+    /**
+     * Sets the HTML attributes of the inner focusable input element.
+     * Attributes which are essential for certain component functionalities cannot be changed.
+     */
+    inputAttributes?: React.InputHTMLAttributes<HTMLInputElement>;
+}
+/**
+ * Represent the `ref` of the TextBox component.
+ */
+export type TextBoxHandle = {
+    element: HTMLInputElement | null;
+    value: TextBoxProps['value'];
+    name?: string | null;
+};
+/**
+ * Represents the [KendoReact TextBox component](https://www.telerik.com/kendo-react-ui/components/inputs/textbox).
+ */
+export declare const TextBox: React.ForwardRefExoticComponent<TextBoxProps & React.RefAttributes<TextBoxHandle | null>>;

package/textbox/Textbox.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),a=require("prop-types"),o=require("@progress/kendo-react-common");function A(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(s,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return s.default=e,Object.freeze(s)}const t=A(w),d=t.forwardRef((e,s)=>{const n=t.useRef(null),l=t.useRef(null),c=t.useRef(void 0),f=o.useUnstyled(),i=f&&f.uTextBox,y=t.useCallback(()=>{var u;return c.current!==void 0?c.current:(u=n.current)==null?void 0:u.value},[]);t.useImperativeHandle(l,()=>({get element(){return n.current},get name(){return n.current&&n.current.name},get value(){return y()}})),t.useImperativeHandle(s,()=>l.current);const{size:m=r.size,fillMode:g=r.fillMode,rounded:v=r.rounded,autoFocus:B=r.autoFocus,inputAttributes:h,className:x,dir:F,style:_,prefix:O=r.prefix,suffix:T=r.suffix,valid:D,onFocus:p,onBlur:R,modified:I,touched:H,visited:G,...q}=e,[N]=o.useCustomComponent(O),[S]=o.useCustomComponent(T),[b,C]=t.useState(!1),j=u=>{C(!0)},E=u=>{C(!1)},M=t.useCallback(u=>{c.current=u.target.value,e.onChange&&e.onChange.call(void 0,{syntheticEvent:u,nativeEvent:u.nativeEvent,value:u.target.value,target:l.current}),c.current=void 0},[e.onChange]),{onFocus:P,onBlur:z}=o.useAsyncFocusBlur({onFocus:j,onBlur:E,onSyncFocus:p,onSyncBlur:R}),k=t.useMemo(()=>o.classNames(o.uTextBox.wrapper({c:i,rounded:v,fillMode:g,size:m,focused:b,required:e.required,disabled:e.disabled,invalid:e.valid===!1}),x),[x,g,b,e.disabled,e.required,e.valid,v,m,i]);return t.createElement("span",{style:_,dir:F,className:k,onFocus:P,onBlur:z},t.createElement(N,null),t.createElement("input",{ref:n,className:o.classNames(o.uTextBox.inputInner({c:i})),autoFocus:B,...Object.assign({},q,h),"aria-required":e.required,onChange:M}),t.createElement(S,null))}),r={prefix:e=>null,suffix:e=>null,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};d.propTypes={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,inputAttributes:a.object};d.displayName="KendoReactTextBoxComponent";exports.TextBox=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),l=require("prop-types"),o=require("@progress/kendo-react-common");function D(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=D(A),m=t.forwardRef((e,r)=>{const n=t.useRef(null),a=t.useRef(null),i=t.useRef(void 0),v=o.useUnstyled(),y=v&&v.uTextBox,C=t.useCallback(()=>{var u;return i.current!==void 0?i.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 C()}})),t.useImperativeHandle(r,()=>a.current);const{size:c=s.size,fillMode:f=s.fillMode,rounded:d=s.rounded,autoFocus:h=s.autoFocus,inputAttributes:k,className:g,dir:_,style:p,prefix:B=s.prefix,suffix:M=s.suffix,valid:I,onFocus:F,onBlur:S,modified:$,touched:w,visited:H,validationMessage:G,autoSize:K,textareaStyle:U,...T}=e,[O]=o.useCustomComponent(B),[R]=o.useCustomComponent(M),[x,b]=t.useState(!1),q=u=>{b(!0)},z=u=>{b(!1)},N=t.useCallback(u=>{i.current=u.target.value,e.onChange&&e.onChange.call(void 0,{syntheticEvent:u,nativeEvent:u.nativeEvent,value:u.target.value,target:a.current}),i.current=void 0},[e.onChange]),{onFocus:j,onBlur:E}=o.useAsyncFocusBlur({onFocus:q,onBlur:z,onSyncFocus:F,onSyncBlur:S}),P=t.useMemo(()=>o.classNames("k-input","k-textbox",{[`k-input-${o.kendoThemeMaps.sizeMap[c]||c}`]:c,[`k-input-${f}`]:f,[`k-rounded-${o.kendoThemeMaps.roundedMap[d]||d}`]:d,"k-focus":x,"k-required":e.required,"k-disabled":e.disabled,"k-invalid":e.valid===!1},g),[g,f,x,e.disabled,e.required,e.valid,d,c]);return t.createElement("span",{style:p,dir:_,className:P,onFocus:j,onBlur:E},t.createElement(O,null),t.createElement("input",{ref:n,className:o.classNames(o.uTextBox.inputInner({c:y})),autoFocus:h,...Object.assign({},T,k),"aria-required":e.required,onChange:N}),t.createElement(R,null))}),s={prefix:e=>null,suffix:e=>null,size:void 0,rounded:void 0,fillMode:void 0,autoFocus:!1};m.propTypes={size:l.oneOf(["small","medium","large"]),rounded:l.oneOf(["small","medium","large","full"]),fillMode:l.oneOf(["solid","flat","outline"]),autoFocus:l.bool,inputAttributes:l.object};m.displayName="KendoReactTextBoxComponent";exports.TextBox=m;