@progress/kendo-react-inputs 11.4.0 → 12.0.0-develop.10

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

package/textarea/TextArea.mjs

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