@progress/kendo-react-inputs 8.2.0-develop.2 → 8.2.0-develop.21

package/checkbox/Checkbox.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 ve=require("react"),t=require("prop-types"),o=require("@progress/kendo-react-common"),Ce=require("../package-metadata.js"),ye=require("@progress/kendo-react-intl"),I=require("../messages/index.js");function xe(s){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const r in s)if(r!=="default"){const m=Object.getOwnPropertyDescriptor(s,r);Object.defineProperty(u,r,m.get?m:{enumerable:!0,get:()=>s[r]})}}return u.default=s,Object.freeze(u)}const e=xe(ve),W=o.createPropsContext(),O=e.forwardRef((s,u)=>{o.validatePackage(Ce.packageMetadata);const r=o.usePropsContext(W,s),{ariaDescribedBy:m,ariaLabelledBy:G,checked:B,className:J,labelClassName:Q,children:X,defaultChecked:Y,disabled:n,defaultValue:Z,id:q,size:h=A.size,rounded:g=A.rounded,label:z,labelPlacement:D,name:ee,labelOptional:te,onChange:v,onFocus:C,onBlur:y,tabIndex:ae,value:i,required:x,valid:T,validationMessage:F,validityStyles:K,visited:Pe,touched:Ee,modified:Ve,...ne}=r,l=e.useRef(null),R=e.useCallback(()=>{l.current&&l.current.focus()},[]),d=e.useCallback(()=>({element:l.current,focus:R,get name(){return l.current&&l.current.name}}),[R]);e.useImperativeHandle(u,d);const[oe,le]=e.useState(Y),[ce,se]=e.useState(Z),w=typeof i=="boolean"||i===null,P=B!==void 0,b=w,E=b?i:ce,k=P?B:b?void 0:oe,j=k===void 0&&E,V=j?E:k,p=j||b?i===null?i:void 0:i||E,L=V===null||p===null,_=o.useId(),re=ye.useLocalization(),H=a=>re.toLanguageString(a,I.messages[a]),U=H(I.checkboxValidation),ie=H(I.checkboxOptionalText),M=T!==void 0?T:x?!!k:!0;e.useEffect(()=>{l.current&&l.current.setCustomValidity&&l.current.setCustomValidity(M?"":F||U)},[M,F,U]);const f=e.useCallback((a,c)=>{!b&&!n&&(se(c),!P&&!n&&le(c)),v&&!n&&o.dispatchEvent(v,a,{...d(),value:c},{value:c})},[P,n,v,b,d]),de=e.useCallback(a=>{const c=a.target.checked;f(a,c)},[f,i]),ue=e.useCallback(a=>{if(n)return;const{keyCode:c}=a,ge=a.currentTarget.checked;c===o.Keys.space&&(a.preventDefault(),a.stopPropagation(),f(a,!ge))},[n,f]),be=e.useCallback(a=>{if(n)return;const{keyCode:c}=a;c===o.Keys.space&&a.preventDefault()},[n]),me=e.useCallback(a=>{C&&!n&&o.dispatchEvent(C,a,d(),void 0)},[C,n,d]),ke=e.useCallback(a=>{y&&!n&&o.dispatchEvent(y,a,d(),void 0)},[y,n,d]),pe=o.useDir(l,r.dir),fe=o.classNames("k-checkbox-wrap",J),$={type:"checkbox",className:o.classNames("k-checkbox",{[`k-checkbox-${o.kendoThemeMaps.sizeMap[h]||h}`]:h,[`k-rounded-${o.kendoThemeMaps.roundedMap[g]||g}`]:g,"k-indeterminate":L,"k-disabled":n,"k-invalid k-invalid":!(M||K!==void 0||K===!0)}),ref:l,name:ee,id:q||_,"aria-labelledby":G,"aria-describedby":m,checked:!!V,disabled:n,tabIndex:o.getTabIndex(ae,n),role:"checkbox",required:x!==void 0?x:!1,"aria-checked":k||V?!0:L?"mixed":!1,"aria-disabled":n||void 0,...ne,onChange:de,onKeyDown:ue,onKeyUp:be,onFocus:me,onBlur:ke},he=p===void 0?e.createElement("input",{...$}):e.createElement("input",{...$,value:w?void 0:p===null?"":p}),N=z!==void 0?e.createElement("label",{className:o.classNames("k-checkbox-label",Q),htmlFor:q||_,style:{userSelect:"none"}},e.createElement(e.Fragment,null,z),te&&e.createElement("span",{className:"k-label-optional"},ie)):null,S=e.createElement("span",{className:fe},he,X);return e.createElement(e.Fragment,null,D==="before"?e.createElement("div",{dir:"rtl"},S,N):D==="after"?e.createElement("div",{dir:"ltr"},S,N):e.createElement("div",{dir:pe},S,N))});O.propTypes={checked:t.bool,className:t.string,defaultChecked:t.bool,defaultValue:t.any,dir:t.string,disabled:t.bool,id:t.string,size:t.oneOf([null,"small","medium","large"]),rounded:t.oneOf([null,"small","medium","large"]),ariaLabelledBy:t.string,ariaDescribedBy:t.string,label:t.any,labelPlacement:t.string,labelOptional:t.bool,name:t.string,tabIndex:t.number,value:t.any,validationMessage:t.string,required:t.bool,validate:t.bool,valid:t.bool,onChange:t.func,onFocus:t.func,onBlur:t.func};const A={size:"medium",rounded:"medium"};O.displayName="KendoCheckbox";exports.Checkbox=O;exports.CheckboxPropsContext=W;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ce=require("react"),t=require("prop-types"),o=require("@progress/kendo-react-common"),ye=require("../package-metadata.js"),xe=require("@progress/kendo-react-intl"),S=require("../messages/index.js");function Pe(s){const d=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const r in s)if(r!=="default"){const m=Object.getOwnPropertyDescriptor(s,r);Object.defineProperty(d,r,m.get?m:{enumerable:!0,get:()=>s[r]})}}return d.default=s,Object.freeze(d)}const e=Pe(Ce),A=o.createPropsContext(),I=e.forwardRef((s,d)=>{o.validatePackage(ye.packageMetadata);const r=o.usePropsContext(A,s),{ariaDescribedBy:m,ariaLabelledBy:W,checked:O,className:G,labelClassName:J,children:Q,defaultChecked:X,disabled:n,defaultValue:Y,id:B,size:f=$.size,rounded:h=$.rounded,label:F,labelPlacement:q,name:Z,labelOptional:ee,onChange:g,onFocus:v,onBlur:C,tabIndex:te,value:i,required:y,valid:z,validationMessage:D,validityStyles:T,autoFocus:ae,visited:Ee,touched:Ve,modified:Me,...ne}=r,l=e.useRef(null),K=e.useCallback(()=>{l.current&&l.current.focus()},[]),u=e.useCallback(()=>({element:l.current,focus:K,get name(){return l.current&&l.current.name}}),[K]);e.useImperativeHandle(d,u);const[oe,le]=e.useState(X),[ce,se]=e.useState(Y),R=typeof i=="boolean"||i===null,x=O!==void 0,b=R,P=b?i:ce,E=x?O:b?void 0:oe,w=E===void 0&&P,j=w?P:E,k=w||b?i===null?i:void 0:i||P,re=j===null||k===null,L=o.useId(),ie=xe.useLocalization(),_=a=>ie.toLanguageString(a,S.messages[a]),H=_(S.checkboxValidation),ue=_(S.checkboxOptionalText),V=z!==void 0?z:y?!!E:!0;e.useEffect(()=>{l.current&&l.current.setCustomValidity&&l.current.setCustomValidity(V?"":D||H)},[V,D,H]);const p=e.useCallback((a,c)=>{!b&&!n&&(se(c),!x&&!n&&le(c)),g&&!n&&o.dispatchEvent(g,a,{...u(),value:c},{value:c})},[x,n,g,b,u]),de=e.useCallback(a=>{const c=a.target.checked;p(a,c)},[p,i]),be=e.useCallback(a=>{if(n)return;const{keyCode:c}=a,ve=a.currentTarget.checked;c===o.Keys.space&&(a.preventDefault(),a.stopPropagation(),p(a,!ve))},[n,p]),me=e.useCallback(a=>{if(n)return;const{keyCode:c}=a;c===o.Keys.space&&a.preventDefault()},[n]),ke=e.useCallback(a=>{v&&!n&&o.dispatchEvent(v,a,u(),void 0)},[v,n,u]),pe=e.useCallback(a=>{C&&!n&&o.dispatchEvent(C,a,u(),void 0)},[C,n,u]),fe=o.useDir(l,r.dir),he=o.classNames("k-checkbox-wrap",G),U={type:"checkbox",className:o.classNames("k-checkbox",{[`k-checkbox-${o.kendoThemeMaps.sizeMap[f]||f}`]:f,[`k-rounded-${o.kendoThemeMaps.roundedMap[h]||h}`]:h,"k-indeterminate":re,"k-disabled":n,"k-invalid k-invalid":!(V||T!==void 0||T===!0)}),ref:l,name:Z,id:B||L,disabled:n,required:y!==void 0?y:!1,tabIndex:o.getTabIndex(te,n),role:"checkbox",checked:!!j,"aria-describedby":m,"aria-labelledby":W,"aria-disabled":n||void 0,autoFocus:ae,...ne,onChange:de,onKeyDown:be,onKeyUp:me,onFocus:ke,onBlur:pe},ge=k===void 0?e.createElement("input",{...U}):e.createElement("input",{...U,value:R?void 0:k===null?"":k}),M=F!==void 0?e.createElement("label",{className:o.classNames("k-checkbox-label",J),htmlFor:B||L,style:{userSelect:"none"}},e.createElement(e.Fragment,null,F),ee&&e.createElement("span",{className:"k-label-optional"},ue)):null,N=e.createElement("span",{className:he},ge,Q);return e.createElement(e.Fragment,null,q==="before"?e.createElement("div",{dir:"rtl"},N,M):q==="after"?e.createElement("div",{dir:"ltr"},N,M):e.createElement("div",{dir:fe},N,M))});I.propTypes={checked:t.bool,className:t.string,defaultChecked:t.bool,defaultValue:t.any,dir:t.string,disabled:t.bool,id:t.string,size:t.oneOf([null,"small","medium","large"]),rounded:t.oneOf([null,"small","medium","large"]),ariaLabelledBy:t.string,ariaDescribedBy:t.string,label:t.any,labelPlacement:t.string,labelOptional:t.bool,name:t.string,tabIndex:t.number,value:t.any,validationMessage:t.string,required:t.bool,validate:t.bool,valid:t.bool,autoFocus:t.bool,onChange:t.func,onFocus:t.func,onBlur:t.func};const $={size:"medium",rounded:"medium",autoFocus:!1};I.displayName="KendoCheckbox";exports.Checkbox=I;exports.CheckboxPropsContext=A;

package/checkbox/Checkbox.mjs

@@ -8,173 +8,174 @@
 "use client";
 import * as e from "react";
 import a from "prop-types";
-import { createPropsContext as ge, validatePackage as ye, usePropsContext as xe, useId as Ve, dispatchEvent as E, Keys as U, useDir as Ee, classNames as P, kendoThemeMaps as $, getTabIndex as Pe } from "@progress/kendo-react-common";
-import { packageMetadata as Be } from "../package-metadata.mjs";
+import { createPropsContext as ye, validatePackage as xe, usePropsContext as Ve, useId as Ee, dispatchEvent as V, Keys as H, useDir as Pe, classNames as E, kendoThemeMaps as U, getTabIndex as Be } from "@progress/kendo-react-common";
+import { packageMetadata as Fe } from "../package-metadata.mjs";
 import { useLocalization as Ie } from "@progress/kendo-react-intl";
 import { messages as Me, checkboxValidation as Ne, checkboxOptionalText as ze } from "../messages/index.mjs";
-const Se = ge(), W = e.forwardRef((j, G) => {
-  ye(Be);
-  const B = xe(Se, j), {
-    ariaDescribedBy: J,
-    ariaLabelledBy: Q,
-    checked: I,
-    className: X,
-    labelClassName: Y,
-    children: Z,
-    defaultChecked: _,
-    disabled: l,
-    defaultValue: ee,
-    id: M,
-    size: m = A.size,
-    rounded: b = A.rounded,
-    label: N,
-    labelPlacement: z,
-    name: ae,
-    labelOptional: te,
-    onChange: p,
-    onFocus: k,
-    onBlur: f,
-    tabIndex: le,
+const Se = ye(), A = e.forwardRef((W, j) => {
+  xe(Fe);
+  const P = Ve(Se, W), {
+    ariaDescribedBy: G,
+    ariaLabelledBy: J,
+    checked: B,
+    className: Q,
+    labelClassName: X,
+    children: Y,
+    defaultChecked: Z,
+    disabled: o,
+    defaultValue: _,
+    id: F,
+    size: u = $.size,
+    rounded: m = $.rounded,
+    label: I,
+    labelPlacement: M,
+    name: ee,
+    labelOptional: ae,
+    onChange: b,
+    onFocus: p,
+    onBlur: k,
+    tabIndex: te,
     value: s,
-    required: h,
-    valid: S,
-    validationMessage: D,
-    validityStyles: F,
+    required: f,
+    valid: N,
+    validationMessage: z,
+    validityStyles: S,
+    autoFocus: oe,
     // Removed to support direct use in Form Field component
     visited: De,
-    touched: Fe,
-    modified: Ke,
-    ...ne
-  } = B, n = e.useRef(null), K = e.useCallback(
+    touched: Ke,
+    modified: Te,
+    ...le
+  } = P, l = e.useRef(null), D = e.useCallback(
     () => {
-      n.current && n.current.focus();
+      l.current && l.current.focus();
     },
     []
   ), c = e.useCallback(
     () => ({
-      element: n.current,
-      focus: K,
+      element: l.current,
+      focus: D,
       get name() {
-        return n.current && n.current.name;
+        return l.current && l.current.name;
       }
     }),
-    [K]
+    [D]
   );
-  e.useImperativeHandle(G, c);
-  const [oe, se] = e.useState(_), [ce, re] = e.useState(ee), T = typeof s == "boolean" || s === null, v = I !== void 0, r = T, C = r ? s : ce, i = v ? I : r ? void 0 : oe, w = i === void 0 && C, g = w ? C : i, d = w || r ? s === null ? s : void 0 : s || C, L = g === null || d === null, O = Ve(), ie = Ie(), R = (t) => ie.toLanguageString(t, Me[t]), q = R(Ne), de = R(ze), y = S !== void 0 ? S : h ? !!i : !0;
+  e.useImperativeHandle(j, c);
+  const [ne, se] = e.useState(Z), [ce, re] = e.useState(_), K = typeof s == "boolean" || s === null, h = B !== void 0, r = K, v = r ? s : ce, C = h ? B : r ? void 0 : ne, T = C === void 0 && v, w = T ? v : C, i = T || r ? s === null ? s : void 0 : s || v, ie = w === null || i === null, L = Ee(), de = Ie(), O = (t) => de.toLanguageString(t, Me[t]), R = O(Ne), ue = O(ze), g = N !== void 0 ? N : f ? !!C : !0;
   e.useEffect(
     () => {
-      n.current && n.current.setCustomValidity && n.current.setCustomValidity(
-        y ? "" : D || q
+      l.current && l.current.setCustomValidity && l.current.setCustomValidity(
+        g ? "" : z || R
       );
     },
-    [y, D, q]
+    [g, z, R]
   );
-  const u = e.useCallback(
-    (t, o) => {
-      !r && !l && (re(o), !v && !l && se(o)), p && !l && E(
-        p,
+  const d = e.useCallback(
+    (t, n) => {
+      !r && !o && (re(n), !h && !o && se(n)), b && !o && V(
+        b,
         t,
         {
           ...c(),
-          value: o
+          value: n
         },
-        { value: o }
+        { value: n }
       );
     },
-    [v, l, p, r, c]
-  ), ue = e.useCallback(
-    (t) => {
-      const o = t.target.checked;
-      u(t, o);
-    },
-    [u, s]
+    [h, o, b, r, c]
   ), me = e.useCallback(
     (t) => {
-      if (l)
-        return;
-      const { keyCode: o } = t, Ce = t.currentTarget.checked;
-      o === U.space && (t.preventDefault(), t.stopPropagation(), u(t, !Ce));
+      const n = t.target.checked;
+      d(t, n);
     },
-    [l, u]
+    [d, s]
   ), be = e.useCallback(
     (t) => {
-      if (l)
+      if (o)
         return;
-      const { keyCode: o } = t;
-      o === U.space && t.preventDefault();
+      const { keyCode: n } = t, ge = t.currentTarget.checked;
+      n === H.space && (t.preventDefault(), t.stopPropagation(), d(t, !ge));
     },
-    [l]
+    [o, d]
   ), pe = e.useCallback(
     (t) => {
-      k && !l && E(
-        k,
+      if (o)
+        return;
+      const { keyCode: n } = t;
+      n === H.space && t.preventDefault();
+    },
+    [o]
+  ), ke = e.useCallback(
+    (t) => {
+      p && !o && V(
+        p,
         t,
         c(),
         void 0
       );
     },
-    [k, l, c]
-  ), ke = e.useCallback(
+    [p, o, c]
+  ), fe = e.useCallback(
     (t) => {
-      f && !l && E(
-        f,
+      k && !o && V(
+        k,
         t,
         c(),
         void 0
       );
     },
-    [f, l, c]
-  ), fe = Ee(n, B.dir), he = P(
+    [k, o, c]
+  ), he = Pe(l, P.dir), ve = E(
     "k-checkbox-wrap",
-    X
-  ), H = {
+    Q
+  ), q = {
     type: "checkbox",
-    className: P(
+    className: E(
       "k-checkbox",
       {
-        [`k-checkbox-${$.sizeMap[m] || m}`]: m,
-        [`k-rounded-${$.roundedMap[b] || b}`]: b,
-        "k-indeterminate": L,
-        "k-disabled": l,
-        "k-invalid k-invalid": !(y || F !== void 0 || F === !0)
+        [`k-checkbox-${U.sizeMap[u] || u}`]: u,
+        [`k-rounded-${U.roundedMap[m] || m}`]: m,
+        "k-indeterminate": ie,
+        "k-disabled": o,
+        "k-invalid k-invalid": !(g || S !== void 0 || S === !0)
       }
     ),
-    ref: n,
-    name: ae,
-    id: M || O,
-    "aria-labelledby": Q,
-    "aria-describedby": J,
-    checked: !!g,
-    disabled: l,
-    tabIndex: Pe(le, l),
+    ref: l,
+    name: ee,
+    id: F || L,
+    disabled: o,
+    required: f !== void 0 ? f : !1,
+    tabIndex: Be(te, o),
     role: "checkbox",
-    required: h !== void 0 ? h : !1,
-    "aria-checked": i || g ? !0 : L ? "mixed" : !1,
-    "aria-disabled": l || void 0,
-    ...ne,
-    onChange: ue,
-    onKeyDown: me,
-    onKeyUp: be,
-    onFocus: pe,
-    onBlur: ke
-  }, ve = (
+    checked: !!w,
+    "aria-describedby": G,
+    "aria-labelledby": J,
+    "aria-disabled": o || void 0,
+    autoFocus: oe,
+    ...le,
+    onChange: me,
+    onKeyDown: be,
+    onKeyUp: pe,
+    onFocus: ke,
+    onBlur: fe
+  }, Ce = (
     // removing value prop is required due to bug in react where
     // value set to undefined override default submit value
-    d === void 0 ? /* @__PURE__ */ e.createElement("input", { ...H }) : /* @__PURE__ */ e.createElement("input", { ...H, value: T ? void 0 : d === null ? "" : d })
-  ), x = N !== void 0 ? /* @__PURE__ */ e.createElement(
+    i === void 0 ? /* @__PURE__ */ e.createElement("input", { ...q }) : /* @__PURE__ */ e.createElement("input", { ...q, value: K ? void 0 : i === null ? "" : i })
+  ), y = I !== void 0 ? /* @__PURE__ */ e.createElement(
     "label",
     {
-      className: P("k-checkbox-label", Y),
-      htmlFor: M || O,
+      className: E("k-checkbox-label", X),
+      htmlFor: F || L,
       style: { userSelect: "none" }
     },
-    /* @__PURE__ */ e.createElement(e.Fragment, null, N),
-    te && /* @__PURE__ */ e.createElement("span", { className: "k-label-optional" }, de)
-  ) : null, V = /* @__PURE__ */ e.createElement("span", { className: he }, ve, Z);
-  return /* @__PURE__ */ e.createElement(e.Fragment, null, z === "before" ? /* @__PURE__ */ e.createElement("div", { dir: "rtl" }, V, x) : z === "after" ? /* @__PURE__ */ e.createElement("div", { dir: "ltr" }, V, x) : /* @__PURE__ */ e.createElement("div", { dir: fe }, V, x));
+    /* @__PURE__ */ e.createElement(e.Fragment, null, I),
+    ae && /* @__PURE__ */ e.createElement("span", { className: "k-label-optional" }, ue)
+  ) : null, x = /* @__PURE__ */ e.createElement("span", { className: ve }, Ce, Y);
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, M === "before" ? /* @__PURE__ */ e.createElement("div", { dir: "rtl" }, x, y) : M === "after" ? /* @__PURE__ */ e.createElement("div", { dir: "ltr" }, x, y) : /* @__PURE__ */ e.createElement("div", { dir: he }, x, y));
 });
-W.propTypes = {
+A.propTypes = {
   checked: a.bool,
   className: a.string,
   defaultChecked: a.bool,
@@ -196,16 +197,18 @@ W.propTypes = {
   required: a.bool,
   validate: a.bool,
   valid: a.bool,
+  autoFocus: a.bool,
   onChange: a.func,
   onFocus: a.func,
   onBlur: a.func
 };
-const A = {
+const $ = {
   size: "medium",
-  rounded: "medium"
+  rounded: "medium",
+  autoFocus: !1
 };
-W.displayName = "KendoCheckbox";
+A.displayName = "KendoCheckbox";
 export {
-  W as Checkbox,
+  A as Checkbox,
   Se as CheckboxPropsContext
 };