@progress/kendo-react-inputs 8.1.0-develop.8 → 8.1.0

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

package/checkbox/Checkbox.mjs

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

package/colors/ColorPicker.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 ce=require("react"),a=require("prop-types"),n=require("@progress/kendo-react-common"),ie=require("../package-metadata.js"),ue=require("./Picker.js"),de=require("./ColorGradient.js"),M=require("./ColorPalette.js"),pe=require("@progress/kendo-react-buttons"),fe=require("@progress/kendo-svg-icons"),A=require("../messages/index.js"),me=require("@progress/kendo-react-intl");function ke(l){const m=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const o in l)if(o!=="default"){const k=Object.getOwnPropertyDescriptor(l,o);Object.defineProperty(m,o,k.get?k:{enumerable:!0,get:()=>l[o]})}}return m.default=l,Object.freeze(m)}const e=ke(ce),be={opacity:!0},ge={palette:M.DEFAULT_PRESET,tileSize:M.DEFAULT_TILE_SIZE},B=l=>l!==void 0,z=n.createPropsContext(),C=e.forwardRef((l,m)=>{n.validatePackage(ie.packageMetadata);const o=n.usePropsContext(z,l),k=me.useLocalization(),{size:E=v.size,rounded:y=v.rounded,fillMode:q=v.fillMode,popupSettings:F,gradientSettings:H,paletteSettings:V,valid:j,disabled:P,tabIndex:G,view:b,icon:T,svgIcon:S,iconClassName:g,onChange:w,onFocus:I,onBlur:R,onActiveColorClick:D,className:U}=o,r=e.useRef(null),N=e.useRef(null),O=e.useRef(null),d=e.useRef(),$=e.useRef(null),[W,x]=e.useState(!1),[Z,J]=e.useState(o.defaultValue),[Q,X]=e.useState(!1),h=B(o.value),i=B(o.open),c=h?o.value:Z,p=i?o.open:Q,K=e.useCallback(()=>{r.current&&r.current.focus()},[]);e.useImperativeHandle(m,()=>({element:r.current,actionElement:$.current,value:c,focus:K}),[c,K]);const u=e.useCallback((t,f)=>{i||(!t&&!f&&r&&r.current&&r.current.focus(),X(t))},[i]),Y=e.useCallback(t=>{const{altKey:f,keyCode:s}=t;if(s===n.Keys.esc){u(!1);return}if(s===n.Keys.enter&&!i){t.preventDefault(),t.stopPropagation(),u(!p);return}f&&(s===n.Keys.up||s===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),s===n.Keys.up&&r&&r.current&&(r.current.focus(),u(!1)),s===n.Keys.down&&u(!0))},[p,i]),ee=e.useCallback(()=>{i||(N.current?N.current.focus():O.current&&O.current.focus())},[i]),te=e.useCallback(()=>{u(!p,!0)},[p]),ne=e.useCallback(t=>{D&&D.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:c})},[D,c]),oe=e.useCallback(t=>{d.current?(clearTimeout(d.current),d.current=void 0):x(!0),I&&I.call(void 0,{nativeEvent:t.nativeEvent,syntheticEvent:t})},[I]),ae=e.useCallback(()=>{u(!1,!0),x(!1),d.current=void 0},[]),re=e.useCallback(t=>{clearTimeout(d.current),d.current=window.setTimeout(ae),R&&R.call(void 0,{nativeEvent:t.nativeEvent,syntheticEvent:t})},[R]),L=e.useCallback((t,f)=>{const s=f?t.rgbaValue:t.value;h||J(s),f&&u(!1),w&&w.call(void 0,{value:s,nativeEvent:t.nativeEvent,syntheticEvent:t.syntheticEvent})},[h,w]),le=e.useCallback(t=>L(t,!0),[B,L]),_=n.useDir(r,o.dir),se=j!==!1;return e.createElement("span",{id:o.id,role:"combobox","aria-label":o.ariaLabel,"aria-labelledby":o.ariaLabelledBy,"aria-describedby":o.ariaDescribedBy,"aria-haspopup":"dialog","aria-expanded":p,"aria-disabled":P?"true":void 0,className:n.classNames("k-colorpicker","k-picker","k-icon-picker",{[`k-picker-${n.kendoThemeMaps.sizeMap[E]||E}`]:E,[`k-picker-${q}`]:q,[`k-rounded-${n.kendoThemeMaps.roundedMap[y]||y}`]:y,"k-invalid":!se,"k-disabled":P,"k-focus":W,className:U}),ref:r,tabIndex:n.getTabIndex(G,P),title:o.title,onKeyDown:Y,onFocus:oe,onBlur:re,dir:_},e.createElement(ue.Picker,{dir:_,open:p,onOpen:ee,popupAnchor:r.current||void 0,popupSettings:{...F},input:e.createElement("span",{onClick:ne,className:"k-input-inner"},e.createElement("span",{className:n.classNames("k-value-icon","k-color-preview",{"k-no-color":!c,"k-icon-color-preview":T||S||g})},g&&e.createElement("span",{className:n.classNames("k-color-preview-icon",g)}),!g&&(T||S)&&e.createElement(n.IconWrap,{name:T,icon:S}),e.createElement("span",{className:"k-color-preview-mask",style:{backgroundColor:c}}))),button:e.createElement(pe.Button,{tabIndex:-1,type:"button",onClick:te,className:"k-input-button",rounded:null,icon:"caret-alt-down",svgIcon:fe.caretAltDownIcon,"aria-label":k.toLanguageString(A.colorPickerDropdownButtonAriaLabel,A.messages[A.colorPickerDropdownButtonAriaLabel])}),content:e.createElement(e.Fragment,null,(b==="combo"||b==="gradient")&&e.createElement(de.ColorGradient,{...H,tabIndex:0,ref:N,value:c,onChange:L}),(b==="combo"||b==="palette")&&e.createElement(M.ColorPalette,{...V,ref:O,value:c,onChange:le}))}))});C.propTypes={value:a.string,defaultValue:a.string,disabled:a.bool,view:a.oneOf(["gradient","palette","combo"]),dir:a.string,id:a.string,icon:a.string,svgIcon:n.svgIconPropType,ariaLabelledBy:a.string,ariaDescribedBy:a.string,size:a.oneOf([null,"small","medium","large"]),rounded:a.oneOf([null,"small","medium","large","full"]),fillMode:a.oneOf([null,"solid","flat","outline"]),className:a.string};const v={size:"medium",rounded:"medium",fillMode:"solid",view:"palette",gradientSettings:be,paletteSettings:ge};C.defaultProps=v;C.displayName="KendoColorPicker";exports.ColorPicker=C;exports.ColorPickerPropsContext=z;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ce=require("react"),a=require("prop-types"),n=require("@progress/kendo-react-common"),ie=require("../package-metadata.js"),ue=require("./Picker.js"),de=require("./ColorGradient.js"),B=require("./ColorPalette.js"),pe=require("@progress/kendo-react-buttons"),fe=require("@progress/kendo-svg-icons"),L=require("../messages/index.js"),me=require("@progress/kendo-react-intl");function ke(l){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const o in l)if(o!=="default"){const b=Object.getOwnPropertyDescriptor(l,o);Object.defineProperty(k,o,b.get?b:{enumerable:!0,get:()=>l[o]})}}return k.default=l,Object.freeze(k)}const e=ke(ce),be={opacity:!0},ge={palette:B.DEFAULT_PRESET,tileSize:B.DEFAULT_TILE_SIZE},A=l=>l!==void 0,z=n.createPropsContext(),M=e.forwardRef((l,k)=>{n.validatePackage(ie.packageMetadata);const o=n.usePropsContext(z,l),b=me.useLocalization(),{size:C=m.size,rounded:E=m.rounded,fillMode:q=m.fillMode,gradientSettings:F=m.gradientSettings,paletteSettings:H=m.paletteSettings,view:g=m.view,popupSettings:V,valid:j,disabled:y,tabIndex:G,icon:P,svgIcon:S,iconClassName:v,onChange:T,onFocus:w,onBlur:I,onActiveColorClick:R,className:U}=o,r=e.useRef(null),D=e.useRef(null),N=e.useRef(null),d=e.useRef(),$=e.useRef(null),[W,x]=e.useState(!1),[Z,J]=e.useState(o.defaultValue),[Q,X]=e.useState(!1),O=A(o.value),i=A(o.open),c=O?o.value:Z,p=i?o.open:Q,K=e.useCallback(()=>{r.current&&r.current.focus()},[]);e.useImperativeHandle(k,()=>({element:r.current,actionElement:$.current,value:c,focus:K}),[c,K]);const u=e.useCallback((t,f)=>{i||(!t&&!f&&r&&r.current&&r.current.focus(),X(t))},[i]),Y=e.useCallback(t=>{const{altKey:f,keyCode:s}=t;if(s===n.Keys.esc){u(!1);return}if(s===n.Keys.enter&&!i){t.preventDefault(),t.stopPropagation(),u(!p);return}f&&(s===n.Keys.up||s===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),s===n.Keys.up&&r&&r.current&&(r.current.focus(),u(!1)),s===n.Keys.down&&u(!0))},[p,i]),ee=e.useCallback(()=>{i||(D.current?D.current.focus():N.current&&N.current.focus())},[i]),te=e.useCallback(()=>{u(!p,!0)},[p]),ne=e.useCallback(t=>{R&&R.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:c})},[R,c]),oe=e.useCallback(t=>{d.current?(clearTimeout(d.current),d.current=void 0):x(!0),w&&w.call(void 0,{nativeEvent:t.nativeEvent,syntheticEvent:t})},[w]),ae=e.useCallback(()=>{u(!1,!0),x(!1),d.current=void 0},[]),re=e.useCallback(t=>{clearTimeout(d.current),d.current=window.setTimeout(ae),I&&I.call(void 0,{nativeEvent:t.nativeEvent,syntheticEvent:t})},[I]),h=e.useCallback((t,f)=>{const s=f?t.rgbaValue:t.value;O||J(s),f&&u(!1),T&&T.call(void 0,{value:s,nativeEvent:t.nativeEvent,syntheticEvent:t.syntheticEvent})},[O,T]),le=e.useCallback(t=>h(t,!0),[A,h]),_=n.useDir(r,o.dir),se=j!==!1;return e.createElement("span",{id:o.id,role:"combobox","aria-label":o.ariaLabel,"aria-labelledby":o.ariaLabelledBy,"aria-describedby":o.ariaDescribedBy,"aria-haspopup":"dialog","aria-expanded":p,"aria-disabled":y?"true":void 0,className:n.classNames("k-colorpicker","k-picker","k-icon-picker",{[`k-picker-${n.kendoThemeMaps.sizeMap[C]||C}`]:C,[`k-picker-${q}`]:q,[`k-rounded-${n.kendoThemeMaps.roundedMap[E]||E}`]:E,"k-invalid":!se,"k-disabled":y,"k-focus":W,className:U}),ref:r,tabIndex:n.getTabIndex(G,y),title:o.title,onKeyDown:Y,onFocus:oe,onBlur:re,dir:_},e.createElement(ue.Picker,{dir:_,open:p,onOpen:ee,popupAnchor:r.current||void 0,popupSettings:{...V},input:e.createElement("span",{onClick:ne,className:"k-input-inner"},e.createElement("span",{className:n.classNames("k-value-icon","k-color-preview",{"k-no-color":!c,"k-icon-color-preview":P||S||v})},v&&e.createElement("span",{className:n.classNames("k-color-preview-icon",v)}),!v&&(P||S)&&e.createElement(n.IconWrap,{name:P,icon:S}),e.createElement("span",{className:"k-color-preview-mask",style:{backgroundColor:c}}))),button:e.createElement(pe.Button,{tabIndex:-1,type:"button",onClick:te,className:"k-input-button",rounded:null,icon:"caret-alt-down",svgIcon:fe.caretAltDownIcon,"aria-label":b.toLanguageString(L.colorPickerDropdownButtonAriaLabel,L.messages[L.colorPickerDropdownButtonAriaLabel])}),content:e.createElement(e.Fragment,null,(g==="combo"||g==="gradient")&&e.createElement(de.ColorGradient,{...F,tabIndex:0,ref:D,value:c,onChange:h}),(g==="combo"||g==="palette")&&e.createElement(B.ColorPalette,{...H,ref:N,value:c,onChange:le}))}))});M.propTypes={value:a.string,defaultValue:a.string,disabled:a.bool,view:a.oneOf(["gradient","palette","combo"]),dir:a.string,id:a.string,icon:a.string,svgIcon:n.svgIconPropType,ariaLabelledBy:a.string,ariaDescribedBy:a.string,size:a.oneOf([null,"small","medium","large"]),rounded:a.oneOf([null,"small","medium","large","full"]),fillMode:a.oneOf([null,"solid","flat","outline"]),className:a.string};const m={size:"medium",rounded:"medium",fillMode:"solid",view:"palette",gradientSettings:be,paletteSettings:ge};M.displayName="KendoColorPicker";exports.ColorPicker=M;exports.ColorPickerPropsContext=z;

package/colors/ColorPicker.mjs

@@ -8,42 +8,42 @@
 "use client";
 import * as e from "react";
 import n from "prop-types";
-import { createPropsContext as se, validatePackage as ce, usePropsContext as ue, Keys as p, useDir as de, classNames as h, kendoThemeMaps as O, getTabIndex as pe, IconWrap as fe, svgIconPropType as me } from "@progress/kendo-react-common";
+import { createPropsContext as se, validatePackage as ce, usePropsContext as ue, Keys as p, useDir as de, classNames as h, kendoThemeMaps as H, getTabIndex as pe, IconWrap as fe, svgIconPropType as me } from "@progress/kendo-react-common";
 import { packageMetadata as ke } from "../package-metadata.mjs";
-import { Picker as be } from "./Picker.mjs";
-import { ColorGradient as ve } from "./ColorGradient.mjs";
+import { Picker as ve } from "./Picker.mjs";
+import { ColorGradient as be } from "./ColorGradient.mjs";
 import { ColorPalette as ge, DEFAULT_PRESET as Ee, DEFAULT_TILE_SIZE as Ce } from "./ColorPalette.mjs";
 import { Button as ye } from "@progress/kendo-react-buttons";
 import { caretAltDownIcon as Te } from "@progress/kendo-svg-icons";
-import { colorPickerDropdownButtonAriaLabel as z, messages as Se } from "../messages/index.mjs";
-import { useLocalization as Pe } from "@progress/kendo-react-intl";
-const we = {
+import { colorPickerDropdownButtonAriaLabel as O, messages as Se } from "../messages/index.mjs";
+import { useLocalization as we } from "@progress/kendo-react-intl";
+const Ie = {
   opacity: !0
-}, Ie = {
+}, Pe = {
   palette: Ee,
   tileSize: Ce
-}, L = (b) => b !== void 0, De = se(), A = e.forwardRef((b, M) => {
+}, L = (v) => v !== void 0, De = se(), z = e.forwardRef((v, M) => {
   ce(ke);
-  const o = ue(De, b), V = Pe(), {
-    size: v = k.size,
-    rounded: g = k.rounded,
-    fillMode: x = k.fillMode,
-    popupSettings: _,
-    gradientSettings: K,
-    paletteSettings: G,
+  const o = ue(De, v), V = we(), {
+    size: b = f.size,
+    rounded: g = f.rounded,
+    fillMode: A = f.fillMode,
+    gradientSettings: _ = f.gradientSettings,
+    paletteSettings: K = f.paletteSettings,
+    view: m = f.view,
+    popupSettings: G,
     valid: U,
     disabled: E,
     tabIndex: $,
-    view: f,
     icon: C,
     svgIcon: y,
-    iconClassName: m,
+    iconClassName: k,
     onChange: T,
     onFocus: S,
-    onBlur: P,
-    onActiveColorClick: w,
+    onBlur: w,
+    onActiveColorClick: I,
     className: W
-  } = o, a = e.useRef(null), I = e.useRef(null), D = e.useRef(null), c = e.useRef(), Z = e.useRef(null), [j, B] = e.useState(!1), [q, J] = e.useState(o.defaultValue), [Q, X] = e.useState(!1), N = L(o.value), i = L(o.open), l = N ? o.value : q, u = i ? o.open : Q, F = e.useCallback(
+  } = o, a = e.useRef(null), P = e.useRef(null), D = e.useRef(null), c = e.useRef(), Z = e.useRef(null), [j, x] = e.useState(!1), [q, J] = e.useState(o.defaultValue), [Q, X] = e.useState(!1), N = L(o.value), i = L(o.open), l = N ? o.value : q, u = i ? o.open : Q, B = e.useCallback(
     () => {
       a.current && a.current.focus();
     },
@@ -54,8 +54,8 @@ const we = {
     element: a.current,
     actionElement: Z.current,
     value: l,
-    focus: F
-  }), [l, F]);
+    focus: B
+  }), [l, B]);
   const s = e.useCallback(
     (t, d) => {
       i || (!t && !d && a && a.current && a.current.focus(), X(t));
@@ -77,7 +77,7 @@ const we = {
     [u, i]
   ), ee = e.useCallback(
     () => {
-      i || (I.current ? I.current.focus() : D.current && D.current.focus());
+      i || (P.current ? P.current.focus() : D.current && D.current.focus());
     },
     [i]
   ), te = e.useCallback(
@@ -87,16 +87,16 @@ const we = {
     [u]
   ), ne = e.useCallback(
     (t) => {
-      w && w.call(void 0, {
+      I && I.call(void 0, {
         syntheticEvent: t,
         nativeEvent: t.nativeEvent,
         value: l
       });
     },
-    [w, l]
+    [I, l]
   ), oe = e.useCallback(
     (t) => {
-      c.current ? (clearTimeout(c.current), c.current = void 0) : B(!0), S && S.call(void 0, {
+      c.current ? (clearTimeout(c.current), c.current = void 0) : x(!0), S && S.call(void 0, {
         nativeEvent: t.nativeEvent,
         syntheticEvent: t
       });
@@ -104,17 +104,17 @@ const we = {
     [S]
   ), ae = e.useCallback(
     () => {
-      s(!1, !0), B(!1), c.current = void 0;
+      s(!1, !0), x(!1), c.current = void 0;
     },
     []
   ), re = e.useCallback(
     (t) => {
-      clearTimeout(c.current), c.current = window.setTimeout(ae), P && P.call(void 0, {
+      clearTimeout(c.current), c.current = window.setTimeout(ae), w && w.call(void 0, {
         nativeEvent: t.nativeEvent,
         syntheticEvent: t
       });
     },
-    [P]
+    [w]
   ), R = e.useCallback(
     (t, d) => {
       const r = d ? t.rgbaValue : t.value;
@@ -128,7 +128,7 @@ const we = {
   ), le = e.useCallback(
     (t) => R(t, !0),
     [L, R]
-  ), H = de(a, o.dir), ie = U !== !1;
+  ), F = de(a, o.dir), ie = U !== !1;
   return /* @__PURE__ */ e.createElement(
     "span",
     {
@@ -145,9 +145,9 @@ const we = {
         "k-picker",
         "k-icon-picker",
         {
-          [`k-picker-${O.sizeMap[v] || v}`]: v,
-          [`k-picker-${x}`]: x,
-          [`k-rounded-${O.roundedMap[g] || g}`]: g,
+          [`k-picker-${H.sizeMap[b] || b}`]: b,
+          [`k-picker-${A}`]: A,
+          [`k-rounded-${H.roundedMap[g] || g}`]: g,
           "k-invalid": !ie,
           "k-disabled": E,
           "k-focus": j,
@@ -160,16 +160,16 @@ const we = {
       onKeyDown: Y,
       onFocus: oe,
       onBlur: re,
-      dir: H
+      dir: F
     },
     /* @__PURE__ */ e.createElement(
-      be,
+      ve,
       {
-        dir: H,
+        dir: F,
         open: u,
         onOpen: ee,
         popupAnchor: a.current || void 0,
-        popupSettings: { ..._ },
+        popupSettings: { ...G },
         input: /* @__PURE__ */ e.createElement("span", { onClick: ne, className: "k-input-inner" }, /* @__PURE__ */ e.createElement(
           "span",
           {
@@ -178,12 +178,12 @@ const we = {
               "k-color-preview",
               {
                 "k-no-color": !l,
-                "k-icon-color-preview": C || y || m
+                "k-icon-color-preview": C || y || k
               }
             )
           },
-          m && /* @__PURE__ */ e.createElement("span", { className: h("k-color-preview-icon", m) }),
-          !m && (C || y) && /* @__PURE__ */ e.createElement(fe, { name: C, icon: y }),
+          k && /* @__PURE__ */ e.createElement("span", { className: h("k-color-preview-icon", k) }),
+          !k && (C || y) && /* @__PURE__ */ e.createElement(fe, { name: C, icon: y }),
           /* @__PURE__ */ e.createElement("span", { className: "k-color-preview-mask", style: { backgroundColor: l } })
         )),
         button: /* @__PURE__ */ e.createElement(
@@ -196,22 +196,22 @@ const we = {
             rounded: null,
             icon: "caret-alt-down",
             svgIcon: Te,
-            "aria-label": V.toLanguageString(z, Se[z])
+            "aria-label": V.toLanguageString(O, Se[O])
           }
         ),
-        content: /* @__PURE__ */ e.createElement(e.Fragment, null, (f === "combo" || f === "gradient") && /* @__PURE__ */ e.createElement(
-          ve,
+        content: /* @__PURE__ */ e.createElement(e.Fragment, null, (m === "combo" || m === "gradient") && /* @__PURE__ */ e.createElement(
+          be,
           {
-            ...K,
+            ..._,
             tabIndex: 0,
-            ref: I,
+            ref: P,
             value: l,
             onChange: R
           }
-        ), (f === "combo" || f === "palette") && /* @__PURE__ */ e.createElement(
+        ), (m === "combo" || m === "palette") && /* @__PURE__ */ e.createElement(
           ge,
           {
-            ...G,
+            ...K,
             ref: D,
             value: l,
             onChange: le
@@ -221,7 +221,7 @@ const we = {
     )
   );
 });
-A.propTypes = {
+z.propTypes = {
   value: n.string,
   defaultValue: n.string,
   disabled: n.bool,
@@ -237,17 +237,16 @@ A.propTypes = {
   fillMode: n.oneOf([null, "solid", "flat", "outline"]),
   className: n.string
 };
-const k = {
+const f = {
   size: "medium",
   rounded: "medium",
   fillMode: "solid",
   view: "palette",
-  gradientSettings: we,
-  paletteSettings: Ie
+  gradientSettings: Ie,
+  paletteSettings: Pe
 };
-A.defaultProps = k;
-A.displayName = "KendoColorPicker";
+z.displayName = "KendoColorPicker";
 export {
-  A as ColorPicker,
+  z as ColorPicker,
   De as ColorPickerPropsContext
 };