@progress/kendo-react-inputs 15.1.1-develop.3 → 15.2.0-develop.2

package/colors/ColorPalette.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 n=require("react"),s=require("prop-types"),se=require("./utils/color-palette.service.js"),w=require("@progress/kendo-react-common"),ne=require("./models/palette-presets.js"),M=require("./utils/color-parser.js"),ae=require("@progress/kendo-react-intl"),O=require("../messages/index.js");function ce(c){const p=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const P in c)if(P!=="default"){const E=Object.getOwnPropertyDescriptor(c,P);Object.defineProperty(p,P,E.get?E:{enumerable:!0,get:()=>c[P]})}}return p.default=c,Object.freeze(p)}const k=ce(n),B=24,j=10,V="office",v={palette:V,columns:j,tileSize:B},H=w.createPropsContext(),ie=c=>{if(Array.isArray(c))return c;if(typeof c=="string"){const p=ne.PALETTEPRESETS[c];if(p)return p.colors}return[]},D=k.forwardRef((c,p)=>{const P=w.usePropsContext(H,c),{palette:E=v.palette,columns:F=v.columns,tileSize:u=v.tileSize,value:x,defaultValue:K,disabled:d=!1,tabIndex:W,onChange:h,onFocus:A,className:Z,size:I,id:G,ariaLabelledBy:J,ariaDescribedBy:Q}=P,S=n.useRef(null),X=n.useRef({focus:()=>{var o;(o=S.current)==null||o.focus()},wrapperRef:S}),_=F!=null?F:v.columns,b=n.useMemo(()=>ie(E),[E]),t=n.useMemo(()=>{const o=new se.ColorPaletteService;return o.setColorMatrix(b,_),o},[b,_]),[g,N]=n.useState(()=>x!==void 0?x:K||""),[L,R]=n.useState(""),y=x!==void 0;n.useEffect(()=>{y&&N(x)},[x,y]);const Y=n.useCallback(o=>{if(d||b.length===0)return;const f=g||b[0];R(f),A&&A(o)},[d,b,g,A]),ee=n.useCallback(()=>{R("")},[]),oe=n.useCallback(o=>{if(d)return;const{key:f}=o,r=()=>L||g||b[0],m=(l,e)=>l<0?e:l>e?0:l;switch(f){case"ArrowRight":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e&&t.colorRows[e.row]){const C=t.colorRows[e.row].length-1,a=m(e.col+1,C),i=t.colorRows[e.row][a];i&&R(i)}}break;case"ArrowLeft":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e&&t.colorRows[e.row]){const C=t.colorRows[e.row].length-1,a=m(e.col-1,C),i=t.colorRows[e.row][a];i&&R(i)}}break;case"ArrowDown":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e){const C=t.colorRows.length-1,a=m(e.row+1,C),i=Math.min(e.col,t.colorRows[a].length-1),T=t.colorRows[a][i];T&&R(T)}}break;case"ArrowUp":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e){const C=t.colorRows.length-1,a=m(e.row-1,C),i=Math.min(e.col,t.colorRows[a].length-1),T=t.colorRows[a][i];T&&R(T)}}break;case"Enter":o.preventDefault();{const l=r();if(l&&(y||N(l),h)){const e=M.parseColor(l,"rgba");w.dispatchEvent(h,o,null,{value:l,rgbaValue:e||""})}}break}},[d,L,g,b,t,y,h]),U=n.useCallback((o,f)=>{if(d)return;const r=o;if(y||N(r),h){const m=M.parseColor(r,"rgba");w.dispatchEvent(h,f,null,{value:r,rgbaValue:m||""})}},[d,h,y]),q=n.useCallback((o,f)=>o.map((r,m)=>{const l=g&&r.toLowerCase()===g.toLowerCase(),e=L&&r.toLowerCase()===L.toLowerCase(),C=w.classNames("k-colorpalette-tile",{"k-selected":l,"k-focus":e}),a={backgroundColor:r};return typeof u=="number"?(a.width=`${u}px`,a.height=`${u}px`):u&&typeof u=="object"&&("width"in u&&(a.width=`${u.width}px`),"height"in u&&(a.height=`${u.height}px`)),k.createElement("td",{key:r,role:"gridcell",className:C,style:a,"aria-label":r,"aria-selected":l?"true":void 0,onClick:i=>U(r,i)})}),[g,L,u,U]),te=n.useCallback(()=>t.colorRows.map((f,r)=>k.createElement("tr",{key:f[0]||r,role:"row"},q(f,r))),[t,q]),z=n.useCallback(()=>({focus:()=>{var o;(o=S.current)==null||o.focus()},wrapperRef:S}),[]);n.useImperativeHandle(X,z),n.useImperativeHandle(p,z);const re=w.classNames("k-colorpalette",Z,{"k-disabled":d,"k-colorpalette-sm":I==="small","k-colorpalette-md":I==="medium","k-colorpalette-lg":I==="large"}),le=ae.useLocalization();return k.createElement("div",{ref:S,role:"grid",className:re,tabIndex:w.getTabIndex(W,d),id:G,"aria-label":le.toLanguageString(O.colorPaletteAriaLabel,O.messages[O.colorPaletteAriaLabel]),"aria-labelledby":J,"aria-describedby":Q,"aria-disabled":d?"true":void 0,onFocus:Y,onBlur:ee,onKeyDown:oe},k.createElement("table",{className:"k-colorpalette-table",role:"none"},k.createElement("tbody",null,te())))});D.displayName="ColorPalette";D.propTypes={palette:s.oneOfType([s.arrayOf(s.string.isRequired),s.string]),columns:s.number,tileSize:s.any,defaultValue:s.string,value:s.string,disabled:s.bool,tabIndex:s.number,onChange:s.func,onFocus:s.func,id:s.string,ariaLabelledBy:s.string,ariaDescribedBy:s.string,className:s.string,size:s.oneOf(["small","medium","large"])};const $=w.withIdHOC(D);$.displayName="KendoReactColorPalette";const ue=D;exports.ColorPalette=$;exports.ColorPalettePropsContext=H;exports.ColorPaletteWithoutContext=ue;exports.DEFAULT_COLUMNS_COUNT=j;exports.DEFAULT_PRESET=V;exports.DEFAULT_TILE_SIZE=B;exports.defaultColorPaletteProps=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),s=require("prop-types"),le=require("./utils/color-palette.service.js"),w=require("@progress/kendo-react-common"),se=require("./models/palette-presets.js"),q=require("./utils/color-parser.js");function ne(c){const p=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const h in c)if(h!=="default"){const E=Object.getOwnPropertyDescriptor(c,h);Object.defineProperty(p,h,E.get?E:{enumerable:!0,get:()=>c[h]})}}return p.default=c,Object.freeze(p)}const k=ne(n),z=24,B=10,j="office",L={palette:j,columns:B,tileSize:z},V=w.createPropsContext(),ae=c=>{if(Array.isArray(c))return c;if(typeof c=="string"){const p=se.PALETTEPRESETS[c];if(p)return p.colors}return[]},D=k.forwardRef((c,p)=>{const h=w.usePropsContext(V,c),{palette:E=L.palette,columns:F=L.columns,tileSize:u=L.tileSize,value:x,defaultValue:$,disabled:d=!1,tabIndex:K,onChange:P,onFocus:I,className:W,size:N,id:Z,ariaLabelledBy:G,ariaDescribedBy:J,ariaLabel:Q}=h,S=n.useRef(null),X=n.useRef({focus:()=>{var o;(o=S.current)==null||o.focus()},wrapperRef:S}),_=F!=null?F:L.columns,b=n.useMemo(()=>ae(E),[E]),t=n.useMemo(()=>{const o=new le.ColorPaletteService;return o.setColorMatrix(b,_),o},[b,_]),[g,O]=n.useState(()=>x!==void 0?x:$||""),[T,R]=n.useState(""),y=x!==void 0;n.useEffect(()=>{y&&O(x)},[x,y]);const Y=n.useCallback(o=>{if(d||b.length===0)return;const f=g||b[0];R(f),I&&I(o)},[d,b,g,I]),ee=n.useCallback(()=>{R("")},[]),oe=n.useCallback(o=>{if(d)return;const{key:f}=o,r=()=>T||g||b[0],m=(l,e)=>l<0?e:l>e?0:l;switch(f){case"ArrowRight":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e&&t.colorRows[e.row]){const C=t.colorRows[e.row].length-1,a=m(e.col+1,C),i=t.colorRows[e.row][a];i&&R(i)}}break;case"ArrowLeft":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e&&t.colorRows[e.row]){const C=t.colorRows[e.row].length-1,a=m(e.col-1,C),i=t.colorRows[e.row][a];i&&R(i)}}break;case"ArrowDown":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e){const C=t.colorRows.length-1,a=m(e.row+1,C),i=Math.min(e.col,t.colorRows[a].length-1),v=t.colorRows[a][i];v&&R(v)}}break;case"ArrowUp":o.preventDefault();{const l=r(),e=t.getCellCoordsFor(l);if(e){const C=t.colorRows.length-1,a=m(e.row-1,C),i=Math.min(e.col,t.colorRows[a].length-1),v=t.colorRows[a][i];v&&R(v)}}break;case"Enter":o.preventDefault();{const l=r();if(l&&(y||O(l),P)){const e=q.parseColor(l,"rgba");w.dispatchEvent(P,o,null,{value:l,rgbaValue:e||""})}}break}},[d,T,g,b,t,y,P]),A=n.useCallback((o,f)=>{if(d)return;const r=o;if(y||O(r),P){const m=q.parseColor(r,"rgba");w.dispatchEvent(P,f,null,{value:r,rgbaValue:m||""})}},[d,P,y]),U=n.useCallback((o,f)=>o.map((r,m)=>{const l=g&&r.toLowerCase()===g.toLowerCase(),e=T&&r.toLowerCase()===T.toLowerCase(),C=w.classNames("k-colorpalette-tile",{"k-selected":l,"k-focus":e}),a={backgroundColor:r};return typeof u=="number"?(a.width=`${u}px`,a.height=`${u}px`):u&&typeof u=="object"&&("width"in u&&(a.width=`${u.width}px`),"height"in u&&(a.height=`${u.height}px`)),k.createElement("td",{key:r,role:"gridcell",className:C,style:a,"aria-label":r,"aria-selected":l?"true":void 0,onClick:i=>A(r,i)})}),[g,T,u,A]),te=n.useCallback(()=>t.colorRows.map((f,r)=>k.createElement("tr",{key:f[0]||r,role:"row"},U(f,r))),[t,U]),M=n.useCallback(()=>({focus:()=>{var o;(o=S.current)==null||o.focus()},wrapperRef:S}),[]);n.useImperativeHandle(X,M),n.useImperativeHandle(p,M);const re=w.classNames("k-colorpalette",W,{"k-disabled":d,"k-colorpalette-sm":N==="small","k-colorpalette-md":N==="medium","k-colorpalette-lg":N==="large"});return k.createElement("div",{ref:S,role:"grid",className:re,tabIndex:w.getTabIndex(K,d),id:Z,"aria-label":Q,"aria-labelledby":G,"aria-describedby":J,"aria-disabled":d?"true":void 0,onFocus:Y,onBlur:ee,onKeyDown:oe},k.createElement("table",{className:"k-colorpalette-table",role:"none"},k.createElement("tbody",null,te())))});D.displayName="ColorPalette";D.propTypes={palette:s.oneOfType([s.arrayOf(s.string.isRequired),s.string]),columns:s.number,tileSize:s.any,defaultValue:s.string,value:s.string,disabled:s.bool,tabIndex:s.number,onChange:s.func,onFocus:s.func,id:s.string,ariaLabelledBy:s.string,ariaDescribedBy:s.string,className:s.string,size:s.oneOf(["small","medium","large"])};const H=w.withIdHOC(D);H.displayName="KendoReactColorPalette";const ce=D;exports.ColorPalette=H;exports.ColorPalettePropsContext=V;exports.ColorPaletteWithoutContext=ce;exports.DEFAULT_COLUMNS_COUNT=B;exports.DEFAULT_PRESET=j;exports.DEFAULT_TILE_SIZE=z;exports.defaultColorPaletteProps=L;

package/colors/ColorPalette.mjs

@@ -6,78 +6,77 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as R from "react";
-import { useRef as O, useMemo as U, useState as V, useEffect as le, useCallback as p, useImperativeHandle as M } from "react";
+import { useRef as O, useMemo as U, useState as V, useEffect as se, useCallback as p, useImperativeHandle as M } from "react";
 import l from "prop-types";
-import { ColorPaletteService as ne } from "./utils/color-palette.service.mjs";
-import { withIdHOC as ae, createPropsContext as ce, usePropsContext as ie, dispatchEvent as _, classNames as H, getTabIndex as ue } from "@progress/kendo-react-common";
-import { PALETTEPRESETS as de } from "./models/palette-presets.mjs";
+import { ColorPaletteService as le } from "./utils/color-palette.service.mjs";
+import { withIdHOC as ne, createPropsContext as ae, usePropsContext as ce, dispatchEvent as _, classNames as H, getTabIndex as ie } from "@progress/kendo-react-common";
+import { PALETTEPRESETS as ue } from "./models/palette-presets.mjs";
 import { parseColor as $ } from "./utils/color-parser.mjs";
-import { useLocalization as fe } from "@progress/kendo-react-intl";
-import { colorPaletteAriaLabel as K, messages as me } from "../messages/index.mjs";
-const Ce = 24, pe = 10, we = "office", L = {
-  palette: we,
-  columns: pe,
-  tileSize: Ce
-}, ge = ce(), be = (w) => {
-  if (Array.isArray(w))
-    return w;
-  if (typeof w == "string") {
-    const E = de[w];
-    if (E)
-      return E.colors;
+const de = 24, fe = 10, Ce = "office", v = {
+  palette: Ce,
+  columns: fe,
+  tileSize: de
+}, we = ae(), pe = (m) => {
+  if (Array.isArray(m))
+    return m;
+  if (typeof m == "string") {
+    const P = ue[m];
+    if (P)
+      return P.colors;
   }
   return [];
-}, v = R.forwardRef((w, E) => {
-  const j = ie(ge, w), {
-    palette: A = L.palette,
-    columns: F = L.columns,
-    tileSize: c = L.tileSize,
+}, F = R.forwardRef((m, P) => {
+  const K = ce(we, m), {
+    palette: I = v.palette,
+    columns: L = v.columns,
+    tileSize: c = v.tileSize,
     value: y,
-    defaultValue: q,
+    defaultValue: j,
     disabled: i = !1,
-    tabIndex: W,
+    tabIndex: q,
     onChange: g,
     onFocus: S,
-    className: Z,
+    className: W,
     size: D,
-    id: G,
-    ariaLabelledBy: J,
-    ariaDescribedBy: Q
-  } = j, k = O(null), X = O({
+    id: Z,
+    ariaLabelledBy: G,
+    ariaDescribedBy: J,
+    ariaLabel: Q
+  } = K, k = O(null), X = O({
     focus: () => {
       var o;
       (o = k.current) == null || o.focus();
     },
     wrapperRef: k
-  }), I = F != null ? F : L.columns, f = U(() => be(A), [A]), t = U(() => {
-    const o = new ne();
-    return o.setColorMatrix(f, I), o;
-  }, [f, I]), [m, T] = V(() => y !== void 0 ? y : q || ""), [x, b] = V(""), h = y !== void 0;
-  le(() => {
+  }), A = L != null ? L : v.columns, f = U(() => pe(I), [I]), t = U(() => {
+    const o = new le();
+    return o.setColorMatrix(f, A), o;
+  }, [f, A]), [C, T] = V(() => y !== void 0 ? y : j || ""), [x, b] = V(""), h = y !== void 0;
+  se(() => {
     h && T(y);
   }, [y, h]);
   const Y = p(
     (o) => {
       if (i || f.length === 0)
         return;
-      const u = m || f[0];
+      const u = C || f[0];
       b(u), S && S(o);
     },
-    [i, f, m, S]
+    [i, f, C, S]
   ), ee = p(() => {
     b("");
   }, []), oe = p(
     (o) => {
       if (i)
         return;
-      const { key: u } = o, r = () => x || m || f[0], C = (s, e) => s < 0 ? e : s > e ? 0 : s;
+      const { key: u } = o, r = () => x || C || f[0], w = (s, e) => s < 0 ? e : s > e ? 0 : s;
       switch (u) {
         case "ArrowRight":
           o.preventDefault();
           {
             const s = r(), e = t.getCellCoordsFor(s);
             if (e && t.colorRows[e.row]) {
-              const d = t.colorRows[e.row].length - 1, n = C(e.col + 1, d), a = t.colorRows[e.row][n];
+              const d = t.colorRows[e.row].length - 1, n = w(e.col + 1, d), a = t.colorRows[e.row][n];
               a && b(a);
             }
           }
@@ -87,7 +86,7 @@ const Ce = 24, pe = 10, we = "office", L = {
           {
             const s = r(), e = t.getCellCoordsFor(s);
             if (e && t.colorRows[e.row]) {
-              const d = t.colorRows[e.row].length - 1, n = C(e.col - 1, d), a = t.colorRows[e.row][n];
+              const d = t.colorRows[e.row].length - 1, n = w(e.col - 1, d), a = t.colorRows[e.row][n];
               a && b(a);
             }
           }
@@ -97,8 +96,8 @@ const Ce = 24, pe = 10, we = "office", L = {
           {
             const s = r(), e = t.getCellCoordsFor(s);
             if (e) {
-              const d = t.colorRows.length - 1, n = C(e.row + 1, d), a = Math.min(e.col, t.colorRows[n].length - 1), P = t.colorRows[n][a];
-              P && b(P);
+              const d = t.colorRows.length - 1, n = w(e.row + 1, d), a = Math.min(e.col, t.colorRows[n].length - 1), E = t.colorRows[n][a];
+              E && b(E);
             }
           }
           break;
@@ -107,8 +106,8 @@ const Ce = 24, pe = 10, we = "office", L = {
           {
             const s = r(), e = t.getCellCoordsFor(s);
             if (e) {
-              const d = t.colorRows.length - 1, n = C(e.row - 1, d), a = Math.min(e.col, t.colorRows[n].length - 1), P = t.colorRows[n][a];
-              P && b(P);
+              const d = t.colorRows.length - 1, n = w(e.row - 1, d), a = Math.min(e.col, t.colorRows[n].length - 1), E = t.colorRows[n][a];
+              E && b(E);
             }
           }
           break;
@@ -127,24 +126,24 @@ const Ce = 24, pe = 10, we = "office", L = {
           break;
       }
     },
-    [i, x, m, f, t, h, g]
+    [i, x, C, f, t, h, g]
   ), N = p(
     (o, u) => {
       if (i)
         return;
       const r = o;
       if (h || T(r), g) {
-        const C = $(r, "rgba");
+        const w = $(r, "rgba");
         _(g, u, null, {
           value: r,
-          rgbaValue: C || ""
+          rgbaValue: w || ""
         });
       }
     },
     [i, g, h]
-  ), z = p(
-    (o, u) => o.map((r, C) => {
-      const s = m && r.toLowerCase() === m.toLowerCase(), e = x && r.toLowerCase() === x.toLowerCase(), d = H("k-colorpalette-tile", {
+  ), B = p(
+    (o, u) => o.map((r, w) => {
+      const s = C && r.toLowerCase() === C.toLowerCase(), e = x && r.toLowerCase() === x.toLowerCase(), d = H("k-colorpalette-tile", {
         "k-selected": s,
         "k-focus": e
       }), n = {
@@ -163,8 +162,8 @@ const Ce = 24, pe = 10, we = "office", L = {
         }
       );
     }),
-    [m, x, c, N]
-  ), te = p(() => t.colorRows.map((u, r) => /* @__PURE__ */ R.createElement("tr", { key: u[0] || r, role: "row" }, z(u, r))), [t, z]), B = p(
+    [C, x, c, N]
+  ), te = p(() => t.colorRows.map((u, r) => /* @__PURE__ */ R.createElement("tr", { key: u[0] || r, role: "row" }, B(u, r))), [t, B]), z = p(
     () => ({
       focus: () => {
         var o;
@@ -174,24 +173,24 @@ const Ce = 24, pe = 10, we = "office", L = {
     }),
     []
   );
-  M(X, B), M(E, B);
-  const re = H("k-colorpalette", Z, {
+  M(X, z), M(P, z);
+  const re = H("k-colorpalette", W, {
     "k-disabled": i,
     "k-colorpalette-sm": D === "small",
     "k-colorpalette-md": D === "medium",
     "k-colorpalette-lg": D === "large"
-  }), se = fe();
+  });
   return /* @__PURE__ */ R.createElement(
     "div",
     {
       ref: k,
       role: "grid",
       className: re,
-      tabIndex: ue(W, i),
-      id: G,
-      "aria-label": se.toLanguageString(K, me[K]),
-      "aria-labelledby": J,
-      "aria-describedby": Q,
+      tabIndex: ie(q, i),
+      id: Z,
+      "aria-label": Q,
+      "aria-labelledby": G,
+      "aria-describedby": J,
       "aria-disabled": i ? "true" : void 0,
       onFocus: Y,
       onBlur: ee,
@@ -200,8 +199,8 @@ const Ce = 24, pe = 10, we = "office", L = {
     /* @__PURE__ */ R.createElement("table", { className: "k-colorpalette-table", role: "none" }, /* @__PURE__ */ R.createElement("tbody", null, te()))
   );
 });
-v.displayName = "ColorPalette";
-v.propTypes = {
+F.displayName = "ColorPalette";
+F.propTypes = {
   palette: l.oneOfType([l.arrayOf(l.string.isRequired), l.string]),
   columns: l.number,
   tileSize: l.any,
@@ -217,17 +216,17 @@ v.propTypes = {
   className: l.string,
   size: l.oneOf(["small", "medium", "large"])
 };
-const he = ae(
-  v
+const me = ne(
+  F
 );
-he.displayName = "KendoReactColorPalette";
-const Fe = v;
+me.displayName = "KendoReactColorPalette";
+const xe = F;
 export {
-  he as ColorPalette,
-  ge as ColorPalettePropsContext,
-  Fe as ColorPaletteWithoutContext,
-  pe as DEFAULT_COLUMNS_COUNT,
-  we as DEFAULT_PRESET,
-  Ce as DEFAULT_TILE_SIZE,
-  L as defaultColorPaletteProps
+  me as ColorPalette,
+  we as ColorPalettePropsContext,
+  xe as ColorPaletteWithoutContext,
+  fe as DEFAULT_COLUMNS_COUNT,
+  Ce as DEFAULT_PRESET,
+  de as DEFAULT_TILE_SIZE,
+  v as defaultColorPaletteProps
 };

package/colors/ColorPicker.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 Me=require("react"),r=require("prop-types"),n=require("@progress/kendo-react-common"),be=require("../package-metadata.js"),Ve=require("./Picker.js"),He=require("./ColorGradient.js"),Y=require("./ColorPalette.js"),q=require("./FlatColorPicker.js"),We=require("@progress/kendo-react-buttons"),Ue=require("@progress/kendo-svg-icons"),u=require("../messages/index.js"),je=require("@progress/kendo-react-intl"),Ge=require("../common/AdaptiveMode.js"),Ke=require("@progress/kendo-react-layout");function $e(g){const _=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(g){for(const P in g)if(P!=="default"){const B=Object.getOwnPropertyDescriptor(g,P);Object.defineProperty(_,P,B.get?B:{enumerable:!0,get:()=>g[P]})}}return _.default=g,Object.freeze(_)}const t=$e(Me),Ze={opacity:!0},Je={palette:Y.DEFAULT_PRESET,tileSize:Y.DEFAULT_TILE_SIZE},X=g=>g!==void 0,Ee=n.createPropsContext(),ee=t.forwardRef((g,_)=>{var fe,ge;const P=!n.validatePackage(be.packageMetadata,{component:"ColorPicker"}),B=n.getLicenseMessage(be.packageMetadata),l=n.usePropsContext(Ee,g),y=je.useLocalization(),te=n.useAdaptiveModeContext(),{size:p=w.size,rounded:C=w.rounded,fillMode:M=w.fillMode,gradientSettings:S=w.gradientSettings,paletteSettings:R=w.paletteSettings,flatColorPickerSettings:A,view:v=l.views?void 0:w.view,views:d=v?void 0:w.views,activeView:ne,popupSettings:b,valid:we,disabled:V,tabIndex:Pe,icon:H,svgIcon:W,iconClassName:F,onChange:U,onFocus:j,onBlur:G,onActiveColorClick:K,className:ye,adaptive:Se,adaptiveTitle:ae=y.toLanguageString(u.colorPickerAdaptiveTitle,u.messages[u.colorPickerAdaptiveTitle]),adaptiveSubtitle:oe,showButtons:h=!0}=l,c=t.useRef(null),I=t.useRef(null),O=t.useRef(null),m=t.useRef(null),T=t.useRef(void 0),re=t.useRef(null),[he,le]=t.useState(!1),[Te,_e]=t.useState(l.defaultValue||void 0),[Re,Ae]=t.useState(!1),[D,Ie]=t.useState(),$=X(l.value),E=X(l.open),i=$?l.value:Te,f=E?l.open:Re,ie=t.useRef(i),z=t.useCallback(()=>{c.current&&c.current.focus()},[]);t.useImperativeHandle(_,()=>({element:c.current,actionElement:re.current,value:i,focus:z}),[i,z]);const ce=t.useRef(null);t.useImperativeHandle(ce,()=>({element:c.current,actionElement:re.current,value:i,focus:z}),[i,z]),n.useWebMcpRegister("colorpicker",ce,l,l.webMcp);const Z=!!(D&&te&&D<=te.medium&&Se);t.useEffect(()=>{const e=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const o=t.useCallback((e,s)=>{E||(!e&&!s&&c&&c.current&&c.current.focus(),Ae(e))},[E]),se=t.useMemo(()=>new n.Navigation({root:c,selectors:[".k-colorpicker",".k-color-picker-popup"],tabIndex:0,keyboardEvents:{keydown:{Escape:(e,s,a)=>{o(!1)},Enter:(e,s,a)=>{!E&&e===c.current&&(a.preventDefault(),a.stopPropagation(),o(!0))},ArrowDown:(e,s,a)=>{a.altKey&&(a.preventDefault(),a.stopPropagation(),o(!0))},ArrowUp:(e,s,a)=>{a.altKey&&(a.preventDefault(),a.stopPropagation(),o(!1))},Tab:(e,s,a)=>{var L,ve,ke;if(n.getActiveElement(document)!==c.current){const me=(L=O.current)==null?void 0:L.wrapperRef.current,x=(ve=I.current)==null?void 0:ve.wrapperRef.current,Ce=(ke=m.current)==null?void 0:ke.element;v==="palette"&&me?n.keepFocusInContainer(a,me):v==="gradient"&&x?n.keepFocusInContainer(a,x):v==="combo"&&x?n.keepFocusInContainer(a,x.parentElement):d&&Ce&&n.keepFocusInContainer(a,Ce)}}}}}),[o,E]),Le=t.useCallback(se.triggerKeyboardEvent.bind(se),[]),Be=t.useCallback(()=>{E||(I.current&&I.current.wrapperRef.current?n.focusFirstFocusableChild(I.current.wrapperRef.current):O.current?O.current.focus():m.current&&m.current.element&&n.focusFirstFocusableChild(m.current.element))},[E]),N=e=>ie.current=e,ue=t.useCallback(e=>{const s={value:ie.current,nativeEvent:e.nativeEvent,syntheticEvent:e};k(s),o(!f,!0)},[f]),J=t.useCallback(()=>{o(!1,!0)},[o]),Fe=t.useCallback(e=>{K&&K.call(void 0,{syntheticEvent:e,nativeEvent:e.nativeEvent,value:i,target:{element:c.current,value:i}})},[K,i]),Oe=t.useCallback(e=>{T.current?(clearTimeout(T.current),T.current=void 0):(le(!0),Z&&!f&&o(!0)),j&&j.call(void 0,{nativeEvent:e.nativeEvent,syntheticEvent:e})},[Z,j,f,o]),De=t.useCallback(()=>{o(!1,!0),le(!1),T.current=void 0},[]),ze=t.useCallback(e=>{clearTimeout(T.current),T.current=window.setTimeout(De),G&&G.call(void 0,{nativeEvent:e.nativeEvent,syntheticEvent:e})},[G]),k=t.useCallback((e,s)=>{var L;const a=s?e.rgbaValue||"":(L=e.value)!=null?L:"";$||_e(a),U&&U.call(void 0,{value:a,nativeEvent:e.nativeEvent,syntheticEvent:e.syntheticEvent,target:{element:c.current,value:a}}),o(!1)},[$,U]),de=t.useCallback(e=>k(e,!0),[X,k]),Q=t.useCallback(e=>t.createElement(t.Fragment,null,(v==="combo"||v==="gradient")&&t.createElement(He.ColorGradient,{...S,_adaptive:e,ref:I,isInsidePopup:!0,role:"none",ariaLabel:void 0,size:e?"large":p,value:i,onChange:k}),(v==="combo"||v==="palette")&&t.createElement(Y.ColorPalette,{...R,ref:O,size:e?"large":p,value:i,onChange:de}),d&&d[0]==="gradient"&&d[1]==="palette"&&t.createElement(q.FlatColorPicker,{...A,_paletteSettings:R,_gradientSettings:{_adaptive:e,...S},ref:m,size:e?"large":p,rounded:C,views:["gradient","palette"],activeView:ne,setOpen:o,showButtons:e?!1:h,value:i,onChange:k,setAdaptiveModeValue:N}),d&&d[0]==="palette"&&d[1]==="gradient"&&t.createElement(q.FlatColorPicker,{...A,_paletteSettings:R,_gradientSettings:{_adaptive:e,...S},ref:m,size:e?"large":p,rounded:C,views:["palette","gradient"],setOpen:o,showButtons:e?!1:h,value:i,onChange:k,setAdaptiveModeValue:N}),d&&d.includes("gradient")&&!d.includes("palette")&&t.createElement(q.FlatColorPicker,{...A,_gradientSettings:{_adaptive:e,...S},ref:m,size:e?"large":p,rounded:C,views:["gradient"],showButtons:e?!1:h,setOpen:o,value:i,onChange:k,setAdaptiveModeValue:N}),d&&d.includes("palette")&&!d.includes("gradient")&&t.createElement(q.FlatColorPicker,{...A,_paletteSettings:R,_gradientSettings:{_adaptive:e,...S},ref:m,size:e?"large":p,rounded:C,views:["palette"],showButtons:e?!1:h,setOpen:o,value:i,onChange:k,setAdaptiveModeValue:N}),P&&t.createElement(n.WatermarkOverlay,{message:B})),[ne,M,A,S,k,de,R,o,p,i,v,d]),Ne=t.useCallback(()=>{var s;const e={animation:!!((s=b==null?void 0:b.animate)==null||s),title:ae,subTitle:oe,expand:f,onClose:J,windowWidth:D,footer:h?{cancelText:y.toLanguageString(u.flatColorPickerCancelBtn,u.messages[u.flatColorPickerCancelBtn]),onCancel:J,applyText:y.toLanguageString(u.flatColorPickerApplyBtn,u.messages[u.flatColorPickerApplyBtn]),onApply:ue}:void 0};return t.createElement(Ge.AdaptiveMode,{...e},t.createElement(Ke.ActionSheetContent,null,Q(!0)))},[b==null?void 0:b.animate,ae,oe,f,J,D,h,y,ue,Q]),xe=t.useCallback(e=>{for(const s of e)Ie(s.target.clientWidth)},[]),pe=n.useDir(c,l.dir),qe=we!==!1;return t.createElement("span",{id:l.id,role:"combobox","aria-label":l.ariaLabel||y.toLanguageString(u.colorPickerAriaLabel,u.messages[u.colorPickerAriaLabel]),"aria-labelledby":l.ariaLabelledBy,"aria-describedby":l.ariaDescribedBy,"aria-haspopup":"dialog","aria-expanded":f,"aria-controls":f?`k-colorpicker-popup-${(fe=l.id)!=null?fe:0}`:void 0,"aria-disabled":V?"true":void 0,className:n.classNames("k-colorpicker","k-picker","k-icon-picker",{[`k-picker-${n.kendoThemeMaps.sizeMap[p]||p}`]:p,[`k-picker-${M}`]:M,[`k-rounded-${n.kendoThemeMaps.roundedMap[C]||C}`]:C,"k-invalid":!qe,"k-disabled":V,"k-focus":he,className:ye}),ref:c,tabIndex:n.getTabIndex(Pe,V),title:l.title,onKeyDown:Le,onFocus:Oe,onBlur:ze,dir:pe},t.createElement(Ve.Picker,{dir:pe,open:f,onOpen:Be,popupAnchor:c.current||void 0,popupSettings:{id:`k-colorpicker-popup-${(ge=l.id)!=null?ge:0}`,...b},input:t.createElement("span",{onClick:Fe,className:"k-input-inner"},t.createElement("span",{className:n.classNames("k-value-icon","k-color-preview",{"k-no-color":!i,"k-icon-color-preview":H||W||F})},F&&t.createElement("span",{className:n.classNames("k-color-preview-icon",F)}),!F&&(H||W)&&t.createElement(n.IconWrap,{name:H,icon:W}),t.createElement("span",{className:"k-color-preview-mask",style:{backgroundColor:i}}))),button:t.createElement(We.Button,{tabIndex:-1,type:"button",onClick:()=>o(!f),className:"k-input-button",icon:"chevron-down",svgIcon:Ue.chevronDownIcon,size:p,"aria-label":y.toLanguageString(u.colorPickerDropdownButtonAriaLabel,u.messages[u.colorPickerDropdownButtonAriaLabel])}),content:Q(!1),_mobileMode:Z,_actionSheet:Ne()}))});ee.propTypes={value:r.string,defaultValue:r.string,disabled:r.bool,view:r.oneOf(["gradient","palette","combo"]),views:r.arrayOf(r.oneOf(["gradient","palette"])),dir:r.string,id:r.string,icon:r.string,svgIcon:n.svgIconPropType,ariaLabelledBy:r.string,ariaDescribedBy:r.string,size:r.oneOf(["small","medium","large"]),rounded:r.oneOf(["small","medium","large","full","none"]),fillMode:r.oneOf(["solid","flat","outline"]),className:r.string,adaptive:r.bool,adaptiveTitle:r.string,adaptiveSubtitle:r.string};const w={size:void 0,rounded:void 0,fillMode:void 0,view:"palette",views:["gradient","palette"],gradientSettings:Ze,paletteSettings:Je};ee.displayName="KendoColorPicker";exports.ColorPicker=ee;exports.ColorPickerPropsContext=Ee;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Me=require("react"),l=require("prop-types"),a=require("@progress/kendo-react-common"),be=require("../package-metadata.js"),Ve=require("./Picker.js"),He=require("./ColorGradient.js"),Y=require("./ColorPalette.js"),M=require("./FlatColorPicker.js"),We=require("@progress/kendo-react-buttons"),Ue=require("@progress/kendo-svg-icons"),n=require("../messages/index.js"),je=require("@progress/kendo-react-intl"),Ge=require("../common/AdaptiveMode.js"),Ke=require("@progress/kendo-react-layout");function $e(g){const T=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(g){for(const y in g)if(y!=="default"){const B=Object.getOwnPropertyDescriptor(g,y);Object.defineProperty(T,y,B.get?B:{enumerable:!0,get:()=>g[y]})}}return T.default=g,Object.freeze(T)}const t=$e(Me),Ze={opacity:!0},Je={palette:Y.DEFAULT_PRESET,tileSize:Y.DEFAULT_TILE_SIZE},X=g=>g!==void 0,Ee=a.createPropsContext(),ee=t.forwardRef((g,T)=>{var fe,ge;const y=!a.validatePackage(be.packageMetadata,{component:"ColorPicker"}),B=a.getLicenseMessage(be.packageMetadata),i=a.usePropsContext(Ee,g),v=je.useLocalization(),te=a.useAdaptiveModeContext(),{size:p=w.size,rounded:b=w.rounded,fillMode:V=w.fillMode,gradientSettings:S=w.gradientSettings,paletteSettings:A=w.paletteSettings,flatColorPickerSettings:R,view:k=i.views?void 0:w.view,views:d=k?void 0:w.views,activeView:ae,popupSettings:E,valid:Pe,disabled:F,tabIndex:we,icon:H,svgIcon:W,iconClassName:O,onChange:U,onFocus:j,onBlur:G,onActiveColorClick:K,className:ye,adaptive:Se,adaptiveTitle:ne=v.toLanguageString(n.colorPickerAdaptiveTitle,n.messages[n.colorPickerAdaptiveTitle]),adaptiveSubtitle:re,showButtons:h=!0}=i,s=t.useRef(null),_=t.useRef(null),D=t.useRef(null),C=t.useRef(null),L=t.useRef(void 0),oe=t.useRef(null),[he,le]=t.useState(!1),[Le,Te]=t.useState(i.defaultValue||void 0),[Ae,Re]=t.useState(!1),[z,_e]=t.useState(),$=X(i.value),P=X(i.open),c=$?i.value:Le,f=P?i.open:Ae,ie=t.useRef(c),N=t.useCallback(()=>{s.current&&s.current.focus()},[]);t.useImperativeHandle(T,()=>({element:s.current,actionElement:oe.current,value:c,focus:N}),[c,N]);const ce=t.useRef(null);t.useImperativeHandle(ce,()=>({element:s.current,actionElement:oe.current,value:c,focus:N}),[c,N]),a.useWebMcpRegister("colorpicker",ce,i,i.webMcp);const Z=!!(z&&te&&z<=te.medium&&Se);t.useEffect(()=>{const e=a.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const o=t.useCallback((e,u)=>{P||(!e&&!u&&s&&s.current&&s.current.focus(),Re(e))},[P]),se=t.useMemo(()=>new a.Navigation({root:s,selectors:[".k-colorpicker",".k-color-picker-popup"],tabIndex:0,keyboardEvents:{keydown:{Escape:(e,u,r)=>{o(!1)},Enter:(e,u,r)=>{!P&&e===s.current&&(r.preventDefault(),r.stopPropagation(),o(!0))},ArrowDown:(e,u,r)=>{r.altKey&&(r.preventDefault(),r.stopPropagation(),o(!0))},ArrowUp:(e,u,r)=>{r.altKey&&(r.preventDefault(),r.stopPropagation(),o(!1))},Tab:(e,u,r)=>{var I,ve,ke;if(a.getActiveElement(document)!==s.current){const me=(I=D.current)==null?void 0:I.wrapperRef.current,q=(ve=_.current)==null?void 0:ve.wrapperRef.current,Ce=(ke=C.current)==null?void 0:ke.element;k==="palette"&&me?a.keepFocusInContainer(r,me):k==="gradient"&&q?a.keepFocusInContainer(r,q):k==="combo"&&q?a.keepFocusInContainer(r,q.parentElement):d&&Ce&&a.keepFocusInContainer(r,Ce)}}}}}),[o,P]),Ie=t.useCallback(se.triggerKeyboardEvent.bind(se),[]),Be=t.useCallback(()=>{P||(_.current&&_.current.wrapperRef.current?a.focusFirstFocusableChild(_.current.wrapperRef.current):D.current?D.current.focus():C.current&&C.current.element&&a.focusFirstFocusableChild(C.current.element))},[P]),x=e=>ie.current=e,ue=t.useCallback(e=>{const u={value:ie.current,nativeEvent:e.nativeEvent,syntheticEvent:e};m(u),o(!f,!0)},[f]),J=t.useCallback(()=>{o(!1,!0)},[o]),Fe=t.useCallback(e=>{K&&K.call(void 0,{syntheticEvent:e,nativeEvent:e.nativeEvent,value:c,target:{element:s.current,value:c}})},[K,c]),Oe=t.useCallback(e=>{L.current?(clearTimeout(L.current),L.current=void 0):(le(!0),Z&&!f&&o(!0)),j&&j.call(void 0,{nativeEvent:e.nativeEvent,syntheticEvent:e})},[Z,j,f,o]),De=t.useCallback(()=>{o(!1,!0),le(!1),L.current=void 0},[]),ze=t.useCallback(e=>{clearTimeout(L.current),L.current=window.setTimeout(De),G&&G.call(void 0,{nativeEvent:e.nativeEvent,syntheticEvent:e})},[G]),m=t.useCallback((e,u)=>{var I;const r=u?e.rgbaValue||"":(I=e.value)!=null?I:"";$||Te(r),U&&U.call(void 0,{value:r,nativeEvent:e.nativeEvent,syntheticEvent:e.syntheticEvent,target:{element:s.current,value:r}}),o(!1)},[$,U]),de=t.useCallback(e=>m(e,!0),[X,m]),Q=t.useCallback(e=>t.createElement(t.Fragment,null,(k==="combo"||k==="gradient")&&t.createElement(He.ColorGradient,{...S,_adaptive:e,ref:_,isInsidePopup:!0,role:"none",ariaLabel:void 0,size:e?"large":p,value:c,onChange:m}),(k==="combo"||k==="palette")&&t.createElement(Y.ColorPalette,{...A,ref:D,size:e?"large":p,value:c,onChange:de}),d&&d[0]==="gradient"&&d[1]==="palette"&&t.createElement(M.FlatColorPicker,{ariaLabel:v.toLanguageString(n.flatColorPickerAriaLabel,n.messages[n.flatColorPickerAriaLabel]),...R,paletteSettings:A,gradientSettings:{_adaptive:e,...S},ref:C,size:e?"large":p,rounded:b,views:["gradient","palette"],activeView:ae,setOpen:o,showButtons:e?!1:h,value:c,onChange:m,setAdaptiveModeValue:x}),d&&d[0]==="palette"&&d[1]==="gradient"&&t.createElement(M.FlatColorPicker,{ariaLabel:v.toLanguageString(n.flatColorPickerAriaLabel,n.messages[n.flatColorPickerAriaLabel]),...R,paletteSettings:A,gradientSettings:{_adaptive:e,...S},ref:C,size:e?"large":p,rounded:b,views:["palette","gradient"],setOpen:o,showButtons:e?!1:h,value:c,onChange:m,setAdaptiveModeValue:x}),d&&d.includes("gradient")&&!d.includes("palette")&&t.createElement(M.FlatColorPicker,{ariaLabel:v.toLanguageString(n.flatColorPickerAriaLabel,n.messages[n.flatColorPickerAriaLabel]),...R,gradientSettings:{_adaptive:e,...S},ref:C,size:e?"large":p,rounded:b,views:["gradient"],showButtons:e?!1:h,setOpen:o,value:c,onChange:m,setAdaptiveModeValue:x}),d&&d.includes("palette")&&!d.includes("gradient")&&t.createElement(M.FlatColorPicker,{ariaLabel:v.toLanguageString(n.flatColorPickerAriaLabel,n.messages[n.flatColorPickerAriaLabel]),...R,paletteSettings:A,gradientSettings:{_adaptive:e,...S},ref:C,size:e?"large":p,rounded:b,views:["palette"],showButtons:e?!1:h,setOpen:o,value:c,onChange:m,setAdaptiveModeValue:x}),y&&t.createElement(a.WatermarkOverlay,{message:B})),[ae,V,R,S,m,de,A,o,p,c,k,d]),Ne=t.useCallback(()=>{var u;const e={animation:!!((u=E==null?void 0:E.animate)==null||u),title:ne,subTitle:re,expand:f,onClose:J,windowWidth:z,footer:h?{cancelText:v.toLanguageString(n.flatColorPickerCancelBtn,n.messages[n.flatColorPickerCancelBtn]),onCancel:J,applyText:v.toLanguageString(n.flatColorPickerApplyBtn,n.messages[n.flatColorPickerApplyBtn]),onApply:ue}:void 0};return t.createElement(Ge.AdaptiveMode,{...e},t.createElement(Ke.ActionSheetContent,null,Q(!0)))},[E==null?void 0:E.animate,ne,re,f,J,z,h,v,ue,Q]),xe=t.useCallback(e=>{for(const u of e)_e(u.target.clientWidth)},[]),pe=a.useDir(s,i.dir),qe=Pe!==!1;return t.createElement("span",{id:i.id,role:"combobox","aria-label":i.ariaLabel,"aria-labelledby":i.ariaLabelledBy,"aria-describedby":i.ariaDescribedBy,"aria-haspopup":"dialog","aria-expanded":f,"aria-controls":f?`k-colorpicker-popup-${(fe=i.id)!=null?fe:0}`:void 0,"aria-disabled":F?"true":void 0,className:a.classNames("k-colorpicker","k-picker","k-icon-picker",{[`k-picker-${a.kendoThemeMaps.sizeMap[p]||p}`]:p,[`k-picker-${V}`]:V,[`k-rounded-${a.kendoThemeMaps.roundedMap[b]||b}`]:b,"k-invalid":!qe,"k-disabled":F,"k-focus":he,className:ye}),ref:s,tabIndex:a.getTabIndex(we,F),title:i.title,onKeyDown:Ie,onFocus:Oe,onBlur:ze,dir:pe},t.createElement(Ve.Picker,{dir:pe,open:f,onOpen:Be,popupAnchor:s.current||void 0,popupSettings:{id:`k-colorpicker-popup-${(ge=i.id)!=null?ge:0}`,...E},input:t.createElement("span",{onClick:Fe,className:"k-input-inner"},t.createElement("span",{className:a.classNames("k-value-icon","k-color-preview",{"k-no-color":!c,"k-icon-color-preview":H||W||O})},O&&t.createElement("span",{className:a.classNames("k-color-preview-icon",O)}),!O&&(H||W)&&t.createElement(a.IconWrap,{name:H,icon:W}),t.createElement("span",{className:"k-color-preview-mask",style:{backgroundColor:c}}))),button:t.createElement(We.Button,{tabIndex:-1,type:"button",onClick:()=>o(!f),className:"k-input-button",disabled:F,icon:"chevron-down",svgIcon:Ue.chevronDownIcon,size:p,"aria-label":v.toLanguageString(n.colorPickerDropdownButtonAriaLabel,n.messages[n.colorPickerDropdownButtonAriaLabel])}),content:Q(!1),_mobileMode:Z,_actionSheet:Ne()}))});ee.propTypes={value:l.string,defaultValue:l.string,disabled:l.bool,view:l.oneOf(["gradient","palette","combo"]),views:l.arrayOf(l.oneOf(["gradient","palette"])),dir:l.string,id:l.string,icon:l.string,svgIcon:a.svgIconPropType,ariaLabelledBy:l.string,ariaDescribedBy:l.string,size:l.oneOf(["small","medium","large"]),rounded:l.oneOf(["small","medium","large","full","none"]),fillMode:l.oneOf(["solid","flat","outline"]),className:l.string,adaptive:l.bool,adaptiveTitle:l.string,adaptiveSubtitle:l.string};const w={size:void 0,rounded:void 0,fillMode:void 0,view:"palette",views:["gradient","palette"],gradientSettings:Ze,paletteSettings:Je};ee.displayName="KendoColorPicker";exports.ColorPicker=ee;exports.ColorPickerPropsContext=Ee;