@progress/kendo-react-inputs 13.4.0-develop.2 → 13.4.0-develop.4

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

package/checkbox/Checkbox.mjs

@@ -10,20 +10,20 @@ import e from "prop-types";
 import { createPropsContext as ye, usePropsContext as xe, useId as Ve, dispatchEvent as V, Keys as H, useDir as Ee, classNames as E, getTabIndex as Pe, kendoThemeMaps as U } from "@progress/kendo-react-common";
 import { useLocalization as Be } from "@progress/kendo-react-intl";
 import { messages as Ie, checkboxValidation as Ne, checkboxOptionalText as ze } from "../messages/index.mjs";
-const Fe = ye(), A = a.forwardRef((W, j) => {
-  const P = xe(Fe, W), {
-    ariaDescribedBy: G,
-    ariaLabelledBy: J,
+const Fe = ye(), $ = a.forwardRef((A, W) => {
+  const P = xe(Fe, A), {
+    ariaDescribedBy: j,
+    ariaLabelledBy: G,
     checked: B,
-    className: Q,
-    labelClassName: X,
-    children: Y,
-    defaultChecked: Z,
+    className: J,
+    labelClassName: Q,
+    children: X,
+    defaultChecked: Y,
     disabled: o,
-    defaultValue: _,
+    defaultValue: Z,
     id: I,
-    size: b = $.size,
-    rounded: m = $.rounded,
+    size: b = _.size,
+    rounded: m = _.rounded,
     label: N,
     labelPlacement: z,
     name: ee,
@@ -55,8 +55,8 @@ const Fe = ye(), A = a.forwardRef((W, j) => {
     }),
     [D]
   );
-  a.useImperativeHandle(j, c);
-  const [le, se] = a.useState(Z), [ce, re] = a.useState(_), K = typeof s == "boolean" || s === null, h = B !== void 0, r = K, v = r ? s : ce, C = h ? B : r ? void 0 : le, T = C === void 0 && v, w = T ? v : C, d = T || r ? s === null ? s : void 0 : s || v, ie = w === null || d === null, L = Ve(), de = Be(), O = (t) => de.toLanguageString(t, Ie[t]), q = O(Ne), ue = O(ze), g = F !== void 0 ? F : i ? !!C : !0;
+  a.useImperativeHandle(W, c);
+  const [le, se] = a.useState(Y), [ce, re] = a.useState(Z), K = typeof s == "boolean" || s === null, h = B !== void 0, r = K, v = r ? s : ce, C = h ? B : r ? void 0 : le, T = C === void 0 && v, w = T ? v : C, d = T || r ? s === null ? s : void 0 : s || v, ie = w === null || d === null, L = Ve(), de = Be(), O = (t) => de.toLanguageString(t, Ie[t]), q = O(Ne), ue = O(ze), g = F !== void 0 ? F : i ? !!C : !0;
   a.useEffect(() => {
     n.current && n.current.setCustomValidity && n.current.setCustomValidity(g ? "" : M || q);
   }, [g, M, q]);
@@ -105,7 +105,7 @@ const Fe = ye(), A = a.forwardRef((W, j) => {
       f && !o && V(f, t, c(), void 0);
     },
     [f, o, c]
-  ), he = Ee(n, P.dir), ve = E("k-checkbox-wrap", Q), R = {
+  ), he = Ee(n, P.dir), ve = E("k-checkbox-wrap", J), R = {
     type: "checkbox",
     className: E("k-checkbox", {
       [`k-checkbox-${U.sizeMap[b] || b}`]: b,
@@ -122,8 +122,8 @@ const Fe = ye(), A = a.forwardRef((W, j) => {
     tabIndex: Pe(te, o),
     role: "checkbox",
     checked: !!w,
-    "aria-describedby": G,
-    "aria-labelledby": J,
+    "aria-describedby": j,
+    "aria-labelledby": G,
     "aria-disabled": o || void 0,
     "aria-required": i,
     autoFocus: oe,
@@ -140,16 +140,16 @@ const Fe = ye(), A = a.forwardRef((W, j) => {
   ), y = N !== void 0 ? /* @__PURE__ */ a.createElement(
     "label",
     {
-      className: E("k-checkbox-label", X),
+      className: E("k-checkbox-label", Q),
       htmlFor: I || L,
       style: { userSelect: "none" }
     },
     N,
     ae && /* @__PURE__ */ a.createElement("span", { className: "k-label-optional" }, ue)
-  ) : null, x = /* @__PURE__ */ a.createElement("span", { className: ve }, Ce, Y);
+  ) : null, x = /* @__PURE__ */ a.createElement("span", { className: ve }, Ce, X);
   return /* @__PURE__ */ a.createElement(a.Fragment, null, z === "before" ? /* @__PURE__ */ a.createElement("div", { dir: "rtl" }, x, y) : z === "after" ? /* @__PURE__ */ a.createElement("div", { dir: "ltr" }, x, y) : /* @__PURE__ */ a.createElement("div", { dir: he }, x, y));
 });
-A.propTypes = {
+$.propTypes = {
   checked: e.bool,
   className: e.string,
   defaultChecked: e.bool,
@@ -158,7 +158,7 @@ A.propTypes = {
   disabled: e.bool,
   id: e.string,
   size: e.oneOf(["small", "medium", "large"]),
-  rounded: e.oneOf(["small", "medium", "large"]),
+  rounded: e.oneOf(["small", "medium", "large", "none"]),
   ariaLabelledBy: e.string,
   ariaDescribedBy: e.string,
   label: e.any,
@@ -176,12 +176,12 @@ A.propTypes = {
   onFocus: e.func,
   onBlur: e.func
 };
-const $ = {
+const _ = {
   size: void 0,
   rounded: void 0
 };
-A.displayName = "KendoCheckbox";
+$.displayName = "KendoCheckbox";
 export {
-  A as Checkbox,
+  $ as Checkbox,
   Fe as CheckboxPropsContext
 };

package/checkbox/interfaces/CheckboxProps.d.ts

@@ -91,7 +91,7 @@ export interface CheckboxProps extends ToggleBaseProps, FormComponentProps, Omit
      *
      * @default `medium`
      */
-    rounded?: 'small' | 'medium' | 'large';
+    rounded?: 'small' | 'medium' | 'large' | 'none';
     /**
      * Identifies the element(s) which will describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
      * For example these elements could contain error or hint message.

package/colors/ColorGradient.mjs

@@ -7,7 +7,7 @@
  */
 import * as r from "react";
 import o from "prop-types";
-import { withIdHOC as F, createPropsContext as G, withPropsContext as M, validatePackage as A, getLicenseMessage as N, canUseDOM as I, Navigation as f, getActiveElement as b, disableNavigatableContainer as C, focusFirstFocusableChild as _, enableNavigatableContainer as T, keepFocusInContainer as O, TABBABLE_ELEMENTS as z, getTabIndex as k, classNames as B, kendoThemeMaps as P, Draggable as V, WatermarkOverlay as K } from "@progress/kendo-react-common";
+import { withIdHOC as F, createPropsContext as G, withPropsContext as M, validatePackage as A, getLicenseMessage as _, canUseDOM as N, Navigation as f, getActiveElement as b, disableNavigatableContainer as C, focusFirstFocusableChild as I, enableNavigatableContainer as T, keepFocusInContainer as O, TABBABLE_ELEMENTS as z, getTabIndex as k, classNames as B, kendoThemeMaps as P, Draggable as V, WatermarkOverlay as K } from "@progress/kendo-react-common";
 import { packageMetadata as R } from "../package-metadata.mjs";
 import { Slider as S } from "../slider/Slider.mjs";
 import { isPresent as y, fitIntoBounds as E } from "./utils/misc.mjs";
@@ -69,7 +69,7 @@ const ae = "rgba", L = "rgba(255, 255, 255, 1)", g = 2, v = 5, h = class h exten
     }, this.onKeyDown = (e) => {
       var s;
       (s = this.navigation) == null || s.triggerKeyboardEvent(e);
-    }, this.showLicenseWatermark = !A(R, { component: "ColorGradient" }), this.licenseMessage = N(R);
+    }, this.showLicenseWatermark = !A(R, { component: "ColorGradient" }), this.licenseMessage = _(R);
     const a = t.value || t.defaultValue || d(L, ae);
     this.state = Object.assign({}, h.getStateFromValue(a), {
       isFirstRender: !0,
@@ -86,7 +86,7 @@ const ae = "rgba", L = "rgba(255, 255, 255, 1)", g = 2, v = 5, h = class h exten
    * @hidden
    */
   componentDidMount() {
-    if (this.setAlphaSliderBackground(this.state.backgroundColor), this.state.isFirstRender && this.setState({ isFirstRender: !1 }), this.gradientWrapper && (this.resizeObserver = I && window.ResizeObserver && new window.ResizeObserver(() => {
+    if (this.setAlphaSliderBackground(this.state.backgroundColor), this.state.isFirstRender && this.setState({ isFirstRender: !1 }), this.gradientWrapper && (this.resizeObserver = N && window.ResizeObserver && new window.ResizeObserver(() => {
       this.forceUpdate();
     }), this.resizeObserver && this.resizeObserver.observe(this.gradientWrapper)), this.wrapperRef && this.hsvGradientRef) {
       let t = 0, a = 0;
@@ -122,7 +122,7 @@ const ae = "rgba", L = "rgba(255, 255, 255, 1)", g = 2, v = 5, h = class h exten
             b(document) === t ? C(t) : O(e, t, z);
           },
           Enter: (t, a, e) => {
-            b(document) === t && (_(t), T(t));
+            b(document) === t && (I(t), T(t));
           },
           Escape: (t, a, e) => {
             b(document) !== t && (t.focus(), C(t));

package/colors/ColorInput.d.ts

@@ -21,7 +21,7 @@ export interface ColorInputProps {
     defaultInputMode?: 'rgba' | 'rgb' | 'hex';
     size?: 'small' | 'medium' | 'large';
     fillMode?: 'solid' | 'outline' | 'flat';
-    rounded?: 'small' | 'medium' | 'large' | 'full';
+    rounded?: 'small' | 'medium' | 'large' | 'full' | 'none';
 }
 /**
  * @hidden

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

package/colors/ColorPicker.mjs

@@ -39,7 +39,7 @@ const pt = {
     popupSettings: g,
     valid: ye,
     disabled: N,
-    tabIndex: he,
+    tabIndex: _e,
     icon: O,
     svgIcon: F,
     iconClassName: T,
@@ -47,11 +47,11 @@ const pt = {
     onFocus: H,
     onBlur: W,
     onActiveColorClick: U,
-    className: _e,
+    className: he,
     adaptive: Te,
     adaptiveTitle: Q = w.toLanguageString(ve, L[ve]),
     adaptiveSubtitle: X
-  } = o, s = t.useRef(null), h = t.useRef(null), P = t.useRef(null), m = t.useRef(null), b = t.useRef(void 0), Pe = t.useRef(null), [Re, Y] = t.useState(!1), [Ae, Ie] = t.useState(o.defaultValue || void 0), [ze, Be] = t.useState(!1), [R, Le] = t.useState(), K = j(o.value), k = j(o.open), i = K ? o.value : Ae, p = k ? o.open : ze, ee = t.useRef(i), te = t.useCallback(() => {
+  } = o, s = t.useRef(null), _ = t.useRef(null), P = t.useRef(null), m = t.useRef(null), b = t.useRef(void 0), Pe = t.useRef(null), [Re, Y] = t.useState(!1), [Ae, Ie] = t.useState(o.defaultValue || void 0), [ze, Be] = t.useState(!1), [R, Le] = t.useState(), K = j(o.value), k = j(o.open), i = K ? o.value : Ae, p = k ? o.open : ze, ee = t.useRef(i), te = t.useCallback(() => {
     s.current && s.current.focus();
   }, []);
   t.useImperativeHandle(
@@ -96,16 +96,16 @@ const pt = {
           n.altKey && (n.preventDefault(), n.stopPropagation(), a(!1));
         },
         Tab: (e, l, n) => {
-          var _, ce, se;
+          var h, ce, se;
           if (Je(document) !== s.current) {
-            const ue = (_ = P.current) == null ? void 0 : _.wrapperRef.current, I = (ce = h.current) == null ? void 0 : ce.wrapperRef.current, de = (se = m.current) == null ? void 0 : se.element;
+            const ue = (h = P.current) == null ? void 0 : h.wrapperRef.current, I = (ce = _.current) == null ? void 0 : ce.wrapperRef.current, de = (se = m.current) == null ? void 0 : se.element;
             d === "palette" && ue ? z(n, ue) : d === "gradient" && I ? z(n, I) : d === "combo" && I ? z(n, I.parentElement) : c && de && z(n, de);
           }
         }
       }
     }
   }), [a, k]), De = t.useCallback(ne.triggerKeyboardEvent.bind(ne), []), xe = t.useCallback(() => {
-    k || (h.current && h.current.wrapperRef.current ? pe(h.current.wrapperRef.current) : P.current ? P.current.focus() : m.current && m.current.element && pe(m.current.element));
+    k || (_.current && _.current.wrapperRef.current ? pe(_.current.wrapperRef.current) : P.current ? P.current.focus() : m.current && m.current.element && pe(m.current.element));
   }, [k]), A = (e) => ee.current = e, ae = t.useCallback(
     (e) => {
       const l = {
@@ -151,8 +151,8 @@ const pt = {
     [W]
   ), f = t.useCallback(
     (e, l) => {
-      var _;
-      const n = l ? e.rgbaValue || "" : (_ = e.value) != null ? _ : "";
+      var h;
+      const n = l ? e.rgbaValue || "" : (h = e.value) != null ? h : "";
       K || Ie(n), V && V.call(void 0, {
         value: n,
         nativeEvent: e.nativeEvent,
@@ -173,7 +173,7 @@ const pt = {
       {
         ...E,
         _adaptive: e,
-        ref: h,
+        ref: _,
         isInsidePopup: !0,
         size: e ? "large" : u,
         value: i,
@@ -317,10 +317,10 @@ const pt = {
         "k-invalid": !Ue,
         "k-disabled": N,
         "k-focus": Re,
-        className: _e
+        className: he
       }),
       ref: s,
-      tabIndex: Ye(he, N),
+      tabIndex: Ye(_e, N),
       title: o.title,
       onKeyDown: De,
       onFocus: Oe,
@@ -382,7 +382,7 @@ Ee.propTypes = {
   ariaLabelledBy: r.string,
   ariaDescribedBy: r.string,
   size: r.oneOf(["small", "medium", "large"]),
-  rounded: r.oneOf(["small", "medium", "large", "full"]),
+  rounded: r.oneOf(["small", "medium", "large", "full", "none"]),
   fillMode: r.oneOf(["solid", "flat", "outline"]),
   className: r.string,
   adaptive: r.bool,

package/colors/FlatColorPicker.d.ts

@@ -136,7 +136,7 @@ export interface FlatColorPickerProps {
     /**
      * @hidden
      */
-    rounded?: 'small' | 'medium' | 'large' | 'full';
+    rounded?: 'small' | 'medium' | 'large' | 'full' | 'none';
     /**
      * @hidden
      */

package/colors/FlatColorPicker.mjs

@@ -7,7 +7,7 @@
  */
 import * as a from "react";
 import l from "prop-types";
-import { validatePackage as le, getLicenseMessage as ne, Navigation as oe, getActiveElement as _, disableNavigatableContainer as K, focusFirstFocusableChild as ie, enableNavigatableContainer as re, keepFocusInContainer as ce, classNames as M, getTabIndex as se, kendoThemeMaps as de, WatermarkOverlay as ve } from "@progress/kendo-react-common";
+import { validatePackage as le, getLicenseMessage as ne, Navigation as oe, getActiveElement as B, disableNavigatableContainer as K, focusFirstFocusableChild as ie, enableNavigatableContainer as re, keepFocusInContainer as ce, classNames as M, getTabIndex as se, kendoThemeMaps as de, WatermarkOverlay as ve } from "@progress/kendo-react-common";
 import { ButtonGroup as L, Button as d } from "@progress/kendo-react-buttons";
 import { dropletSliderIcon as V, paletteIcon as G, dropletSlashIcon as ue } from "@progress/kendo-svg-icons";
 import { ColorPalette as ge } from "./ColorPalette.mjs";
@@ -30,7 +30,7 @@ const D = a.forwardRef((e, H) => {
     (h || "ColorGradient") === "ColorGradient"
   ), [s, x] = a.useState(
     (r != null ? r : [])[0] === "gradient" && P === "gradient"
-  ), [i, E] = a.useState(e.value || b || void 0), [g, I] = a.useState(e.value || b || void 0), B = e.value !== void 0 ? e.value : void 0;
+  ), [i, E] = a.useState(e.value || b || void 0), [g, _] = a.useState(e.value || b || void 0), I = e.value !== void 0 ? e.value : void 0;
   a.useEffect(() => {
     E(e.value);
   }, [e.value]);
@@ -43,9 +43,9 @@ const D = a.forwardRef((e, H) => {
       element: y.current,
       focus: R,
       props: e,
-      value: B
+      value: I
     }),
-    [B, R, e]
+    [I, R, e]
   ), a.useImperativeHandle(H, () => f.current);
   const A = a.useCallback(
     (t) => {
@@ -61,7 +61,7 @@ const D = a.forwardRef((e, H) => {
     (t) => {
       var c;
       const n = b || void 0;
-      if (E(n), I(n), (c = e._gradientSettings) != null && c._adaptive && e.setAdaptiveModeValue && e.setAdaptiveModeValue(n), e.onPreviewChange) {
+      if (E(n), _(n), (c = e._gradientSettings) != null && c._adaptive && e.setAdaptiveModeValue && e.setAdaptiveModeValue(n), e.onPreviewChange) {
         const S = {
           value: n,
           nativeEvent: t.nativeEvent,
@@ -87,7 +87,7 @@ const D = a.forwardRef((e, H) => {
     [e.onPreviewChange]
   ), Y = a.useCallback(
     (t) => {
-      if (i !== void 0 && I(i), e.onChange) {
+      if (i !== void 0 && _(i), e.onChange) {
         const n = {
           value: i,
           nativeEvent: t.nativeEvent,
@@ -114,7 +114,7 @@ const D = a.forwardRef((e, H) => {
   ), ee = a.useCallback(
     (t) => {
       var c, S;
-      if ((!t.relatedTarget || !((c = y.current) != null && c.contains(t.relatedTarget))) && !((S = e._gradientSettings) != null && S._adaptive) && (!w && i !== void 0 && I(i), !w && e.onChange)) {
+      if ((!t.relatedTarget || !((c = y.current) != null && c.contains(t.relatedTarget))) && !((S = e._gradientSettings) != null && S._adaptive) && (!w && i !== void 0 && _(i), !w && e.onChange)) {
         const te = {
           value: i,
           nativeEvent: t.nativeEvent,
@@ -132,13 +132,13 @@ const D = a.forwardRef((e, H) => {
       keyboardEvents: {
         keydown: {
           Tab: (t, n, c) => {
-            _(document) === t ? K(t) : ce(c, t);
+            B(document) === t ? K(t) : ce(c, t);
           },
           Enter: (t, n, c) => {
-            _(document) === t && (ie(t), re(t));
+            B(document) === t && (ie(t), re(t));
           },
           Escape: (t, n, c) => {
-            _(document) !== t && (t.focus(), K(t));
+            B(document) !== t && (t.focus(), K(t));
           }
         }
       }
@@ -277,7 +277,7 @@ const D = a.forwardRef((e, H) => {
       "span",
       {
         className: M("k-coloreditor-preview-color", "k-color-preview", {
-          "k-no-color": B === void 0
+          "k-no-color": I === void 0
         })
       },
       /* @__PURE__ */ a.createElement(

package/colors/HexInput.d.ts

@@ -15,7 +15,7 @@ export interface HexInputProps {
     disabled?: boolean;
     size?: 'small' | 'medium' | 'large';
     fillMode?: 'solid' | 'outline' | 'flat';
-    rounded?: 'small' | 'medium' | 'large' | 'full';
+    rounded?: 'small' | 'medium' | 'large' | 'full' | 'none';
 }
 /**
  * @hidden

package/colors/interfaces/ColorGradientProps.d.ts

@@ -152,7 +152,7 @@ export interface ColorGradientProps {
     /**
      * @hidden
      */
-    rounded?: 'small' | 'medium' | 'large' | 'full';
+    rounded?: 'small' | 'medium' | 'large' | 'full' | 'none';
     /**
      * @hidden
      */

package/colors/interfaces/ColorPickerProps.d.ts

@@ -190,7 +190,7 @@ export interface ColorPickerProps {
      * <ColorPicker rounded="full" />
      * ```
      */
-    rounded?: 'small' | 'medium' | 'large' | 'full';
+    rounded?: 'small' | 'medium' | 'large' | 'full' | 'none';
     /**
      * Configures the `fillMode` of the ColorPicker.
      *