@progress/kendo-react-inputs 14.5.0-develop.7 → 14.5.0-develop.9

package/rating/Rating.mjs

@@ -7,21 +7,21 @@
  */
 import * as a from "react";
 import c from "prop-types";
-import { usePropsContext as te, useDir as ae, Keys as R, IconWrap as y, toIconName as B, classNames as ne, getTabIndex as le, createPropsContext as se, svgIconPropType as S } from "@progress/kendo-react-common";
-import { starOutlineIcon as $, starIcon as K } from "@progress/kendo-svg-icons";
-import { RatingItem as oe } from "./RatingItem.mjs";
-import { RATING_ACTION as r, ratingReducer as ie } from "./rating-reducer.mjs";
-import { calcIsFirstHalf as L, toRound as D, getRemainder as re, isHalf as ce, isSelected as F, isCorrectValue as A } from "./utils/index.mjs";
-import { ratingAriaLabel as X, messages as ue } from "../messages/index.mjs";
-import { useLocalization as me } from "@progress/kendo-react-intl";
-const q = (n, g, v) => {
-  const [e, N] = a.useState(n);
+import { usePropsContext as ee, useDir as te, Keys as R, IconWrap as y, toIconName as H, classNames as ae, getTabIndex as ne, createPropsContext as le, svgIconPropType as $ } from "@progress/kendo-react-common";
+import { starIcon as N } from "@progress/kendo-svg-icons";
+import { RatingItem as se } from "./RatingItem.mjs";
+import { RATING_ACTION as r, ratingReducer as oe } from "./rating-reducer.mjs";
+import { calcIsFirstHalf as K, toRound as D, getRemainder as ie, isHalf as re, isSelected as O, isCorrectValue as L } from "./utils/index.mjs";
+import { ratingAriaLabel as A, messages as ce } from "../messages/index.mjs";
+import { useLocalization as ue } from "@progress/kendo-react-intl";
+const X = (n, g, v) => {
+  const [e, z] = a.useState(n);
   return [e, (h) => {
-    const o = ie(g.state || e, { ...h, ...g });
-    v && v(o, h.event), N(o);
+    const o = oe(g.state || e, { ...h, ...g });
+    v && v(o, h.event), z(o);
   }];
-}, de = se(), G = a.forwardRef((n, g) => {
-  const v = te(de, n), e = {
+}, me = le(), q = a.forwardRef((n, g) => {
+  const v = ee(me, n), e = {
     dir: s.dir,
     min: s.min,
     max: s.max,
@@ -33,12 +33,12 @@ const q = (n, g, v) => {
     selection: s.selection,
     precision: s.precision,
     ...v
-  }, N = me(), m = a.useRef(null), h = a.useRef(null), o = ae(h, e.dir);
+  }, z = ue(), m = a.useRef(null), h = a.useRef(null), o = te(h, e.dir);
   a.useImperativeHandle(m, () => ({
     element: h.current,
     props: e
   })), a.useImperativeHandle(g, () => m.current);
-  const W = a.useCallback(
+  const G = a.useCallback(
     (t, l) => {
       e.onChange && m.current && e.onChange.call(void 0, {
         value: t,
@@ -47,7 +47,7 @@ const q = (n, g, v) => {
       });
     },
     [e.onChange]
-  ), I = a.useMemo(() => e.min !== void 0 ? e.min : s.min, [e.min]), x = a.useMemo(() => e.max !== void 0 ? e.max : s.max, [e.max]), d = a.useMemo(() => e.precision || s.precision, [e.precision]), i = a.useMemo(() => e.step !== void 0 ? e.step : s.step, [e.step]), V = a.useMemo(() => e.readonly || s.readonly, [e.readonly]), k = a.useMemo(() => e.disabled || s.disabled, [e.disabled]), _ = a.useMemo(() => e.item || s.item, [e.item]), [H, p] = q(
+  ), I = a.useMemo(() => e.min !== void 0 ? e.min : s.min, [e.min]), x = a.useMemo(() => e.max !== void 0 ? e.max : s.max, [e.max]), d = a.useMemo(() => e.precision || s.precision, [e.precision]), i = a.useMemo(() => e.step !== void 0 ? e.step : s.step, [e.step]), V = a.useMemo(() => e.readonly || s.readonly, [e.readonly]), k = a.useMemo(() => e.disabled || s.disabled, [e.disabled]), W = a.useMemo(() => e.item || s.item, [e.item]), [T, p] = X(
     e.defaultValue !== void 0 ? e.defaultValue : s.defaultValue,
     {
       state: e.value,
@@ -55,24 +55,24 @@ const q = (n, g, v) => {
       max: x,
       step: d === "half" ? i / 2 : i
     },
-    W
-  ), [T, O] = q(null, {
+    G
+  ), [P, B] = X(null, {
     state: e.value,
     min: I,
     max: x,
     step: d === "half" ? i / 2 : i,
     precision: d
   }), u = a.useMemo(
-    () => e.value !== void 0 ? e.value : H,
-    [e.value, H]
-  ), C = a.useMemo(() => T, [T]), z = a.useMemo(
+    () => e.value !== void 0 ? e.value : T,
+    [e.value, T]
+  ), C = a.useMemo(() => P, [P]), F = a.useMemo(
     () => e.selection || s.selection,
     [e.selection]
-  ), E = a.useMemo(() => i / (d === "half" ? 2 : 1), [i, d]), j = a.useCallback(
+  ), E = a.useMemo(() => i / (d === "half" ? 2 : 1), [i, d]), _ = a.useCallback(
     (t) => {
       if (!(!t.target || !t.target.element || V || k)) {
         if (d === "half") {
-          const l = t.target.element.getBoundingClientRect(), M = L(o || "ltr", l, t.syntheticEvent.clientX) ? D(t.target.value - i / 2, E) : t.target.value;
+          const l = t.target.element.getBoundingClientRect(), M = K(o || "ltr", l, t.syntheticEvent.clientX) ? D(t.target.value - i / 2, E) : t.target.value;
           p({ type: r.select, payload: M, event: t.syntheticEvent });
         } else
           p({
@@ -91,7 +91,7 @@ const q = (n, g, v) => {
       }
     },
     [e.onClick, p, u]
-  ), J = a.useCallback(
+  ), j = a.useCallback(
     (t) => {
       if (!(V || k)) {
         switch (t.keyCode) {
@@ -134,7 +134,7 @@ const q = (n, g, v) => {
       }
     },
     [e.onKeyDown, p, u]
-  ), Q = a.useCallback(
+  ), J = a.useCallback(
     (t) => {
       if (e.onFocus) {
         const l = {
@@ -145,7 +145,7 @@ const q = (n, g, v) => {
       }
     },
     [e.onFocus]
-  ), U = a.useCallback(
+  ), Q = a.useCallback(
     (t) => {
       if (e.onBlur) {
         const l = {
@@ -156,28 +156,28 @@ const q = (n, g, v) => {
       }
     },
     [e.onBlur]
-  ), Y = a.useCallback(
+  ), U = a.useCallback(
     (t) => {
       if (!(!t.target || !t.target.element))
         if (d === "half") {
-          const l = t.target.element.getBoundingClientRect(), M = L(o || "ltr", l, t.syntheticEvent.clientX) ? t.target.value - i / 2 : t.target.value;
-          O({ type: r.select, payload: M, event: t.syntheticEvent });
+          const l = t.target.element.getBoundingClientRect(), M = K(o || "ltr", l, t.syntheticEvent.clientX) ? t.target.value - i / 2 : t.target.value;
+          B({ type: r.select, payload: M, event: t.syntheticEvent });
         } else
-          O({
+          B({
             type: r.select,
             payload: t.target.value,
             event: t.syntheticEvent
           });
     },
     [d, i, o]
-  ), Z = a.useCallback((t) => {
-    O({ type: r.reset, event: t.syntheticEvent });
-  }, []), P = [], ee = re(D(x - I, E), i);
+  ), Y = a.useCallback((t) => {
+    B({ type: r.reset, event: t.syntheticEvent });
+  }, []), S = [], Z = ie(D(x - I, E), i);
   for (let t = I; t <= x; t = D(t + i, E)) {
-    const l = D(t + ee, E), f = d === "half" ? ce(l, C !== null ? C : u !== null ? u : 0, i) : !1, M = F(l, u, i, z), w = F(l, C !== null ? C : u, i, z), b = F(l, C, i, z);
-    P.push(
+    const l = D(t + Z, E), f = d === "half" ? re(l, C !== null ? C : u !== null ? u : 0, i) : !1, M = O(l, u, i, F), w = O(l, C !== null ? C : u, i, F), b = O(l, C, i, F);
+    S.push(
       /* @__PURE__ */ a.createElement(
-        _,
+        W,
         {
           key: l,
           value: l,
@@ -188,22 +188,22 @@ const q = (n, g, v) => {
           half: f,
           selected: M || w,
           hovered: b,
-          onClick: j,
-          onMouseMove: Y,
-          onMouseLeave: Z
+          onClick: _,
+          onMouseMove: U,
+          onMouseLeave: Y
         },
         f && /* @__PURE__ */ a.createElement("span", { className: "k-rating-precision-complement" }, !(e.icon || e.svgIconOutline) && /* @__PURE__ */ a.createElement(
           y,
           {
-            name: "star-outline",
-            icon: $,
+            name: "star",
+            icon: N,
             style: { clipPath: `${o === "rtl" ? "inset(0 50% 0 0)" : "inset(0 0 0 50%)"}` },
             size: "xlarge"
           }
         ), (e.icon || e.svgIconOutline) && /* @__PURE__ */ a.createElement(
           y,
           {
-            name: B(`${e.icon}-outline`),
+            name: H(`${e.icon}-outline`),
             icon: e.svgIconOutline,
             size: "xlarge"
           }
@@ -212,23 +212,23 @@ const q = (n, g, v) => {
           y,
           {
             name: "star",
-            icon: K,
+            icon: N,
             style: { clipPath: `${o === "rtl" ? "inset(0 0 0 50%)" : "inset(0 50% 0 0)"}` },
             size: "xlarge"
           }
         ), (e.icon || e.svgIcon) && /* @__PURE__ */ a.createElement(
           y,
           {
-            name: e.icon ? B(e.icon) : void 0,
+            name: e.icon ? H(e.icon) : void 0,
             icon: e.svgIcon,
             size: "xlarge"
           }
         )),
         f && /* @__PURE__ */ a.createElement("span", { style: { width: "24px", height: "24px", display: "block" } }),
-        !f && !(e.icon || e.svgIcon) && (b || w && !b) && /* @__PURE__ */ a.createElement(y, { name: "star", icon: K, size: "xlarge" }) || !(e.icon || e.svgIcon) && !b && !w && /* @__PURE__ */ a.createElement(y, { name: "star-outline", icon: $, size: "xlarge" }) || (e.icon || e.svgIcon) && (b || w && !b) && /* @__PURE__ */ a.createElement(y, { name: e.icon, icon: e.svgIcon, size: "xlarge" }) || (e.icon || e.svgIcon) && !b && /* @__PURE__ */ a.createElement(
+        !f && !(e.icon || e.svgIcon) && (b || w && !b) && /* @__PURE__ */ a.createElement(y, { name: "star", icon: N, size: "xlarge" }) || !(e.icon || e.svgIcon) && !b && !w && /* @__PURE__ */ a.createElement(y, { name: "star", icon: N, size: "xlarge" }) || (e.icon || e.svgIcon) && (b || w && !b) && /* @__PURE__ */ a.createElement(y, { name: e.icon, icon: e.svgIcon, size: "xlarge" }) || (e.icon || e.svgIcon) && !b && /* @__PURE__ */ a.createElement(
           y,
           {
-            name: B(`${e.icon}-outline`),
+            name: H(`${e.icon}-outline`),
             icon: e.svgIconOutline,
             size: "xlarge"
           }
@@ -244,8 +244,8 @@ const q = (n, g, v) => {
       ref: h,
       role: "slider",
       dir: o,
-      tabIndex: le(e.tabIndex, e.disabled, void 0),
-      className: ne(
+      tabIndex: ne(e.tabIndex, e.disabled, void 0),
+      className: ae(
         "k-rating",
         {
           "k-rtl": o === "rtl",
@@ -254,27 +254,27 @@ const q = (n, g, v) => {
         },
         e.className
       ),
-      onKeyDown: J,
-      onFocus: Q,
-      onBlur: U,
+      onKeyDown: j,
+      onFocus: J,
+      onBlur: Q,
       "aria-valuemin": I,
       "aria-valuemax": x,
       "aria-valuenow": u !== null ? u : void 0,
       "aria-disabled": k ? "true" : void 0,
-      "aria-label": N.toLanguageString(X, ue[X]),
+      "aria-label": z.toLanguageString(A, ce[A]),
       "aria-labelledby": e.ariaLabelledBy,
       "aria-describedby": e.ariaDescribedBy
     },
     /* @__PURE__ */ a.createElement("input", { id: "rating", className: "k-hidden", readOnly: V, disabled: k }),
-    /* @__PURE__ */ a.createElement("span", { className: "k-rating-container" }, P),
+    /* @__PURE__ */ a.createElement("span", { className: "k-rating-container" }, S),
     e.label && /* @__PURE__ */ a.createElement("span", { className: "k-rating-label" }, e.label)
   );
-}), pe = {
+}), de = {
   id: c.string,
   dir: c.oneOf(["ltr", "rtl"]),
   selection: c.oneOf(["continues", "single"]),
   precision: c.oneOf(["item", "half"]),
-  value: (n, g, v) => n.value && n.min && n.max && n.step && !(n.precision === "half" ? A(n.min, n.max, n.step / 2, n.value) : A(n.min, n.max, n.step, n.value)) && n.precision === "half" ? new Error(
+  value: (n, g, v) => n.value && n.min && n.max && n.step && !(n.precision === "half" ? L(n.min, n.max, n.step / 2, n.value) : L(n.min, n.max, n.step, n.value)) && n.precision === "half" ? new Error(
     `Invalid prop + ${g} supplied to ${v}.
                     The value of the { value } property is not correct, please check your values.
                     `
@@ -292,24 +292,24 @@ const q = (n, g, v) => {
   readonly: c.bool,
   disabled: c.bool,
   icon: c.string,
-  svgIcon: S,
-  svgIconOutline: S,
+  svgIcon: $,
+  svgIconOutline: $,
   ariaDescribedBy: c.string
 }, s = {
   dir: "ltr",
   min: 1,
   max: 5,
   step: 1,
-  item: oe,
+  item: se,
   defaultValue: null,
   readonly: !1,
   disabled: !1,
   selection: "continues",
   precision: "item"
 };
-G.displayName = "KendoReactRating";
-G.propTypes = pe;
+q.displayName = "KendoReactRating";
+q.propTypes = de;
 export {
-  G as Rating,
-  de as RatingPropsContext
+  q as Rating,
+  me as RatingPropsContext
 };

package/slider/Slider.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 a=require("react"),r=require("prop-types"),c=require("@progress/kendo-react-common"),F=require("@progress/kendo-react-intl"),m=require("../messages/index.js"),ae=require("./SliderLabel.js"),j=require("@progress/kendo-react-buttons"),f=require("@progress/kendo-svg-icons");function le(e){const h=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const d in e)if(d!=="default"){const v=Object.getOwnPropertyDescriptor(e,d);Object.defineProperty(h,d,v.get?v:{enumerable:!0,get:()=>e[d]})}}return h.default=e,Object.freeze(h)}const i=le(a),k={step:1,largeStep:10,buttons:!1,vertical:!1,disabled:!1,tabIndex:0},E=i.forwardRef((e,h)=>{var K,M,O;const{step:d=k.step,largeStep:v=k.largeStep,vertical:l=k.vertical,disabled:u=k.disabled,tabIndex:P=k.tabIndex}=e,[U,H]=a.useState((K=e.defaultValue)!=null?K:e.min),[W,V]=a.useState(!1),[R,X]=a.useState(e.dir),L=a.useRef(null),y=a.useRef(null),A=a.useMemo(()=>new F.LocalizationService,[]),z=a.useRef(null),N=e.value!==void 0,I=N&&e.value!==void 0?e.value:U,s=a.useMemo(()=>{const{min:t,max:n}=e;return I<t?t:I>n?n:I},[I,e.min,e.max]),C=a.useMemo(()=>{const{min:t,max:n}=e,o=n-t;return o===0?0:(s-t)/o*100},[s,e.min,e.max]),b=(M=e.dir)!=null?M:R;a.useEffect(()=>{if(e.dir===void 0&&y.current){const n=window.getComputedStyle(y.current).direction;n!==R&&X(n)}},[e.dir,R]);const q=a.useCallback(t=>{let n=t;for(;n;){if(n.getAttribute(ae.SLIDER_LABEL_ATTRIBUTE))return!0;n=n.parentElement}return!1},[]),g=a.useCallback((t,n)=>{const o=Math.min(Math.max(n,e.min),e.max);N||H(o),c.dispatchEvent(e.onChange,t,z.current,{value:o})},[e.min,e.max,e.onChange,N]),G=a.useCallback(()=>{V(!0)},[]),Y=a.useCallback(()=>{V(!1)},[]),J=a.useCallback(t=>{if(u)return;let n;t.keyCode===c.Keys.left||t.keyCode===c.Keys.down?n=s-(d||0):t.keyCode===c.Keys.right||t.keyCode===c.Keys.up?n=s+(d||0):t.keyCode===c.Keys.pageDown?n=s-(v||0):t.keyCode===c.Keys.pageUp?n=s+(v||0):t.keyCode===c.Keys.home?n=e.min:t.keyCode===c.Keys.end&&(n=e.max),n!==void 0&&(t.preventDefault(),g(t,n))},[s,d,v,e.min,e.max,g,u]),Q=a.useCallback(t=>{t.preventDefault(),!u&&g(t,s-(d||0))},[s,d,g,u]),Z=a.useCallback(t=>{t.preventDefault(),!u&&g(t,s+(d||0))},[s,d,g,u]),w=a.useCallback(t=>{const n=t.element.getBoundingClientRect();let o;l?o=n.bottom-t.event.clientY:o=b==="rtl"?n.right-t.event.clientX:t.event.clientX-n.left;const S=l?n.height:n.width,x=o/S;g(t,e.min+x*(e.max-e.min))},[l,e.min,e.max,b,g]),$=a.useCallback(t=>{q(t.event.originalEvent.target)||(t.event.isTouch&&t.event.originalEvent.preventDefault(),w(t))},[q,w]),p=a.useCallback(t=>{t.event.originalEvent.preventDefault(),w(t)},[w]),D=a.useCallback(()=>{y.current&&y.current.focus()},[]),ee=a.useCallback(t=>{if(!t.enabled)return t.children;let n,o,S,x;return b==="rtl"?(n=l?f.caretAltUpIcon:f.caretAltLeftIcon,o=l?f.caretAltDownIcon:f.caretAltRightIcon,S=l?"caret-alt-up":"caret-alt-left",x=l?"caret-alt-down":"caret-alt-right"):(n=l?f.caretAltUpIcon:f.caretAltRightIcon,o=l?f.caretAltDownIcon:f.caretAltLeftIcon,S=l?"caret-alt-up":"caret-alt-right",x=l?"caret-alt-down":"caret-alt-left"),i.createElement(i.Fragment,null,i.createElement(j.Button,{className:"k-button-decrease",rounded:"full",icon:x,svgIcon:o,title:t.decrementTitle,onClick:t.decrement}),t.children,i.createElement(j.Button,{className:"k-button-increase",rounded:"full",icon:S,svgIcon:n,title:t.incrementTitle,onClick:t.increment}))},[b,l]);a.useImperativeHandle(h,()=>({props:e,sliderTrack:L.current,focus:D}),[e,D]),a.useEffect(()=>{z.current={props:e,sliderTrack:L.current,focus:D}},[e,D]);const te=l?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},ne=l?{paddingTop:0,height:"100%"}:{};let T;return l?T={bottom:"calc("+C+"%)",zIndex:1}:b==="rtl"?T={right:"calc("+C+"% - 13px)",zIndex:1}:T={left:"calc("+C+"%)",zIndex:1},i.createElement("div",{ref:y,dir:b,id:e.id,style:{gap:0,...e.style},onFocus:G,onBlur:Y,onKeyDown:J,className:c.classNames("k-slider",{"k-focus":W,"k-disabled":u,"k-slider-horizontal":!l,"k-slider-vertical":l},e.className)},ee({enabled:(O=e.buttons)!=null?O:k.buttons,decrement:Q,increment:Z,incrementTitle:A.toLanguageString(m.sliderIncreaseValue,m.messages[m.sliderIncreaseValue]),decrementTitle:A.toLanguageString(m.sliderDecreaseValue,m.messages[m.sliderDecreaseValue]),children:i.createElement(c.Draggable,{onDrag:p,onPress:$,autoScroll:!1},i.createElement("div",{className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...te}},e.children&&i.createElement("ul",{className:"k-reset k-slider-items",style:{margin:0,...ne}},i.Children.map(e.children,(t,n)=>t&&i.cloneElement(t,{position:100*(t.props.position-e.min)/(e.max-e.min),vertical:l,firstTick:n===0,lastTick:n===i.Children.count(e.children)-1},t.props.children))),i.createElement("div",{className:"k-slider-track",style:l?{bottom:0,height:"100%"}:{[b==="rtl"?"right":"left"]:0,width:"100%"},ref:L},i.createElement("div",{className:"k-slider-selection",style:l?{height:C+"%"}:{width:C+"%"}}),i.createElement("span",{role:"slider","aria-valuemin":e.min,"aria-valuemax":e.max,"aria-valuenow":s,"aria-valuetext":String(s),"aria-orientation":l?"vertical":void 0,"aria-disabled":u?"true":void 0,"aria-labelledby":e.ariaLabelledBy,"aria-describedby":e.ariaDescribedBy,"aria-label":e.ariaLabel,tabIndex:c.getTabIndex(P,u,void 0),className:"k-draghandle k-draghandle-end",title:A.toLanguageString(m.sliderDragTitle,m.messages[m.sliderDragTitle]),style:T}))))}))});E.displayName="Slider";const _=c.createPropsContext(),B=c.withPropsContext(_,E);B.displayName="KendoReactSlider";B.propTypes={value:r.number,defaultValue:r.number,min:r.number.isRequired,max:r.number.isRequired,step:r.number,largeStep:r.number,onChange:r.func,style:r.object,className:r.string,buttons:r.bool,tabIndex:r.number,disabled:r.bool,vertical:r.bool,id:r.string,ariaDescribedBy:r.string,ariaLabelledBy:r.string,ariaLabel:r.string,dir:r.oneOf(["ltr","rtl"]),children:r.node};F.registerForLocalization(E);exports.Slider=B;exports.SliderPropsContext=_;exports.SliderWithoutContext=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),r=require("prop-types"),c=require("@progress/kendo-react-common"),F=require("@progress/kendo-react-intl"),m=require("../messages/index.js"),ae=require("./SliderLabel.js"),j=require("@progress/kendo-react-buttons"),f=require("@progress/kendo-svg-icons");function le(e){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const d in e)if(d!=="default"){const b=Object.getOwnPropertyDescriptor(e,d);Object.defineProperty(k,d,b.get?b:{enumerable:!0,get:()=>e[d]})}}return k.default=e,Object.freeze(k)}const i=le(a),h={step:1,largeStep:10,buttons:!1,vertical:!1,disabled:!1,tabIndex:0},E=i.forwardRef((e,k)=>{var A,M,O;const{step:d=h.step,largeStep:b=h.largeStep,vertical:l=h.vertical,disabled:u=h.disabled,tabIndex:P=h.tabIndex}=e,[U,H]=a.useState((A=e.defaultValue)!=null?A:e.min),[W,z]=a.useState(!1),[R,X]=a.useState(e.dir),L=a.useRef(null),y=a.useRef(null),N=a.useMemo(()=>new F.LocalizationService,[]),q=a.useRef(null),B=e.value!==void 0,I=B&&e.value!==void 0?e.value:U,o=a.useMemo(()=>{const{min:t,max:n}=e;return I<t?t:I>n?n:I},[I,e.min,e.max]),C=a.useMemo(()=>{const{min:t,max:n}=e,s=n-t;return s===0?0:(o-t)/s*100},[o,e.min,e.max]),v=(M=e.dir)!=null?M:R;a.useEffect(()=>{if(e.dir===void 0&&y.current){const n=window.getComputedStyle(y.current).direction;n!==R&&X(n)}},[e.dir,R]);const K=a.useCallback(t=>{let n=t;for(;n;){if(n.getAttribute(ae.SLIDER_LABEL_ATTRIBUTE))return!0;n=n.parentElement}return!1},[]),g=a.useCallback((t,n)=>{const s=Math.min(Math.max(n,e.min),e.max);B||H(s),c.dispatchEvent(e.onChange,t,q.current,{value:s})},[e.min,e.max,e.onChange,B]),G=a.useCallback(()=>{z(!0)},[]),Y=a.useCallback(()=>{z(!1)},[]),J=a.useCallback(t=>{if(u)return;let n;t.keyCode===c.Keys.left||t.keyCode===c.Keys.down?n=o-(d||0):t.keyCode===c.Keys.right||t.keyCode===c.Keys.up?n=o+(d||0):t.keyCode===c.Keys.pageDown?n=o-(b||0):t.keyCode===c.Keys.pageUp?n=o+(b||0):t.keyCode===c.Keys.home?n=e.min:t.keyCode===c.Keys.end&&(n=e.max),n!==void 0&&(t.preventDefault(),g(t,n))},[o,d,b,e.min,e.max,g,u]),Q=a.useCallback(t=>{t.preventDefault(),!u&&g(t,o-(d||0))},[o,d,g,u]),Z=a.useCallback(t=>{t.preventDefault(),!u&&g(t,o+(d||0))},[o,d,g,u]),w=a.useCallback(t=>{const n=t.element.getBoundingClientRect();let s;l?s=n.bottom-t.event.clientY:s=v==="rtl"?n.right-t.event.clientX:t.event.clientX-n.left;const S=l?n.height:n.width,x=s/S;g(t,e.min+x*(e.max-e.min))},[l,e.min,e.max,v,g]),$=a.useCallback(t=>{K(t.event.originalEvent.target)||(t.event.isTouch&&t.event.originalEvent.preventDefault(),w(t))},[K,w]),p=a.useCallback(t=>{t.event.originalEvent.preventDefault(),w(t)},[w]),D=a.useCallback(()=>{y.current&&y.current.focus()},[]),ee=a.useCallback(t=>{if(!t.enabled)return t.children;let n,s,S,x;return v==="rtl"?(n=l?f.chevronUpIcon:f.chevronLeftIcon,s=l?f.chevronDownIcon:f.chevronRightIcon,S=l?"chevron-up":"chevron-left",x=l?"chevron-down":"chevron-right"):(n=l?f.chevronUpIcon:f.chevronRightIcon,s=l?f.chevronDownIcon:f.chevronLeftIcon,S=l?"chevron-up":"chevron-right",x=l?"chevron-down":"chevron-left"),i.createElement(i.Fragment,null,i.createElement(j.Button,{className:"k-button-decrease",rounded:"full",icon:x,svgIcon:s,title:t.decrementTitle,onClick:t.decrement}),t.children,i.createElement(j.Button,{className:"k-button-increase",rounded:"full",icon:S,svgIcon:n,title:t.incrementTitle,onClick:t.increment}))},[v,l]);a.useImperativeHandle(k,()=>({props:e,sliderTrack:L.current,focus:D}),[e,D]),a.useEffect(()=>{q.current={props:e,sliderTrack:L.current,focus:D}},[e,D]);const te=l?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},ne=l?{paddingTop:0,height:"100%"}:{};let T;return l?T={bottom:"calc("+C+"%)",zIndex:1}:v==="rtl"?T={right:"calc("+C+"% - 13px)",zIndex:1}:T={left:"calc("+C+"%)",zIndex:1},i.createElement("div",{ref:y,dir:v,id:e.id,style:{gap:0,...e.style},onFocus:G,onBlur:Y,onKeyDown:J,className:c.classNames("k-slider",{"k-focus":W,"k-disabled":u,"k-slider-horizontal":!l,"k-slider-vertical":l},e.className)},ee({enabled:(O=e.buttons)!=null?O:h.buttons,decrement:Q,increment:Z,incrementTitle:N.toLanguageString(m.sliderIncreaseValue,m.messages[m.sliderIncreaseValue]),decrementTitle:N.toLanguageString(m.sliderDecreaseValue,m.messages[m.sliderDecreaseValue]),children:i.createElement(c.Draggable,{onDrag:p,onPress:$,autoScroll:!1},i.createElement("div",{className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...te}},e.children&&i.createElement("ul",{className:"k-reset k-slider-items",style:{margin:0,...ne}},i.Children.map(e.children,(t,n)=>t&&i.cloneElement(t,{position:100*(t.props.position-e.min)/(e.max-e.min),vertical:l,firstTick:n===0,lastTick:n===i.Children.count(e.children)-1},t.props.children))),i.createElement("div",{className:"k-slider-track",style:l?{bottom:0,height:"100%"}:{[v==="rtl"?"right":"left"]:0,width:"100%"},ref:L},i.createElement("div",{className:"k-slider-selection",style:l?{height:C+"%"}:{width:C+"%"}}),i.createElement("span",{role:"slider","aria-valuemin":e.min,"aria-valuemax":e.max,"aria-valuenow":o,"aria-valuetext":String(o),"aria-orientation":l?"vertical":void 0,"aria-disabled":u?"true":void 0,"aria-labelledby":e.ariaLabelledBy,"aria-describedby":e.ariaDescribedBy,"aria-label":e.ariaLabel,tabIndex:c.getTabIndex(P,u,void 0),className:"k-draghandle k-draghandle-end",title:N.toLanguageString(m.sliderDragTitle,m.messages[m.sliderDragTitle]),style:T}))))}))});E.displayName="Slider";const _=c.createPropsContext(),V=c.withPropsContext(_,E);V.displayName="KendoReactSlider";V.propTypes={value:r.number,defaultValue:r.number,min:r.number.isRequired,max:r.number.isRequired,step:r.number,largeStep:r.number,onChange:r.func,style:r.object,className:r.string,buttons:r.bool,tabIndex:r.number,disabled:r.bool,vertical:r.bool,id:r.string,ariaDescribedBy:r.string,ariaLabelledBy:r.string,ariaLabel:r.string,dir:r.oneOf(["ltr","rtl"]),children:r.node};F.registerForLocalization(E);exports.Slider=V;exports.SliderPropsContext=_;exports.SliderWithoutContext=E;

package/slider/Slider.mjs

@@ -5,15 +5,15 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as l from "react";
+import * as r from "react";
 import { useState as L, useRef as R, useMemo as N, useEffect as q, useCallback as o, useImperativeHandle as me } from "react";
 import i from "prop-types";
 import { withPropsContext as ue, dispatchEvent as fe, Keys as m, classNames as ge, Draggable as ve, getTabIndex as he, createPropsContext as be } from "@progress/kendo-react-common";
 import { LocalizationService as ye, registerForLocalization as ke } from "@progress/kendo-react-intl";
-import { sliderDragTitle as H, messages as A, sliderDecreaseValue as O, sliderIncreaseValue as X } from "../messages/index.mjs";
+import { sliderDragTitle as H, messages as z, sliderDecreaseValue as O, sliderIncreaseValue as X } from "../messages/index.mjs";
 import { SLIDER_LABEL_ATTRIBUTE as xe } from "./SliderLabel.mjs";
 import { Button as _ } from "@progress/kendo-react-buttons";
-import { caretAltUpIcon as j, caretAltLeftIcon as G, caretAltDownIcon as W, caretAltRightIcon as Y } from "@progress/kendo-svg-icons";
+import { chevronUpIcon as j, chevronLeftIcon as G, chevronDownIcon as W, chevronRightIcon as Y } from "@progress/kendo-svg-icons";
 const g = {
   step: 1,
   largeStep: 10,
@@ -21,7 +21,7 @@ const g = {
   vertical: !1,
   disabled: !1,
   tabIndex: 0
-}, z = l.forwardRef((t, P) => {
+}, B = r.forwardRef((t, P) => {
   var M, K, U;
   const {
     step: u = g.step,
@@ -29,13 +29,13 @@ const g = {
     vertical: a = g.vertical,
     disabled: d = g.disabled,
     tabIndex: Q = g.tabIndex
-  } = t, [Z, $] = L((M = t.defaultValue) != null ? M : t.min), [p, B] = L(!1), [I, ee] = L(t.dir), E = R(null), v = R(null), T = N(() => new ye(), []), V = R(null), D = t.value !== void 0, k = D && t.value !== void 0 ? t.value : Z, r = N(() => {
+  } = t, [Z, $] = L((M = t.defaultValue) != null ? M : t.min), [p, V] = L(!1), [I, ee] = L(t.dir), E = R(null), v = R(null), T = N(() => new ye(), []), A = R(null), D = t.value !== void 0, k = D && t.value !== void 0 ? t.value : Z, l = N(() => {
     const { min: e, max: n } = t;
     return k < e ? e : k > n ? n : k;
   }, [k, t.min, t.max]), h = N(() => {
     const { min: e, max: n } = t, c = n - e;
-    return c === 0 ? 0 : (r - e) / c * 100;
-  }, [r, t.min, t.max]), f = (K = t.dir) != null ? K : I;
+    return c === 0 ? 0 : (l - e) / c * 100;
+  }, [l, t.min, t.max]), f = (K = t.dir) != null ? K : I;
   q(() => {
     if (t.dir === void 0 && v.current) {
       const n = window.getComputedStyle(v.current).direction;
@@ -53,31 +53,31 @@ const g = {
   }, []), s = o(
     (e, n) => {
       const c = Math.min(Math.max(n, t.min), t.max);
-      D || $(c), fe(t.onChange, e, V.current, { value: c });
+      D || $(c), fe(t.onChange, e, A.current, { value: c });
     },
     [t.min, t.max, t.onChange, D]
   ), te = o(() => {
-    B(!0);
+    V(!0);
   }, []), ne = o(() => {
-    B(!1);
+    V(!1);
   }, []), ae = o(
     (e) => {
       if (d)
         return;
       let n;
-      e.keyCode === m.left || e.keyCode === m.down ? n = r - (u || 0) : e.keyCode === m.right || e.keyCode === m.up ? n = r + (u || 0) : e.keyCode === m.pageDown ? n = r - (C || 0) : e.keyCode === m.pageUp ? n = r + (C || 0) : e.keyCode === m.home ? n = t.min : e.keyCode === m.end && (n = t.max), n !== void 0 && (e.preventDefault(), s(e, n));
+      e.keyCode === m.left || e.keyCode === m.down ? n = l - (u || 0) : e.keyCode === m.right || e.keyCode === m.up ? n = l + (u || 0) : e.keyCode === m.pageDown ? n = l - (C || 0) : e.keyCode === m.pageUp ? n = l + (C || 0) : e.keyCode === m.home ? n = t.min : e.keyCode === m.end && (n = t.max), n !== void 0 && (e.preventDefault(), s(e, n));
     },
-    [r, u, C, t.min, t.max, s, d]
+    [l, u, C, t.min, t.max, s, d]
   ), ie = o(
     (e) => {
-      e.preventDefault(), !d && s(e, r - (u || 0));
+      e.preventDefault(), !d && s(e, l - (u || 0));
     },
-    [r, u, s, d]
-  ), le = o(
+    [l, u, s, d]
+  ), re = o(
     (e) => {
-      e.preventDefault(), !d && s(e, r + (u || 0));
+      e.preventDefault(), !d && s(e, l + (u || 0));
     },
-    [r, u, s, d]
+    [l, u, s, d]
   ), x = o(
     (e) => {
       const n = e.element.getBoundingClientRect();
@@ -87,7 +87,7 @@ const g = {
       s(e, t.min + y * (t.max - t.min));
     },
     [a, t.min, t.max, f, s]
-  ), re = o(
+  ), le = o(
     (e) => {
       F(e.event.originalEvent.target) || (e.event.isTouch && e.event.originalEvent.preventDefault(), x(e));
     },
@@ -104,7 +104,7 @@ const g = {
       if (!e.enabled)
         return e.children;
       let n, c, b, y;
-      return f === "rtl" ? (n = a ? j : G, c = a ? W : Y, b = a ? "caret-alt-up" : "caret-alt-left", y = a ? "caret-alt-down" : "caret-alt-right") : (n = a ? j : Y, c = a ? W : G, b = a ? "caret-alt-up" : "caret-alt-right", y = a ? "caret-alt-down" : "caret-alt-left"), /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(
+      return f === "rtl" ? (n = a ? j : G, c = a ? W : Y, b = a ? "chevron-up" : "chevron-left", y = a ? "chevron-down" : "chevron-right") : (n = a ? j : Y, c = a ? W : G, b = a ? "chevron-up" : "chevron-right", y = a ? "chevron-down" : "chevron-left"), /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(
         _,
         {
           className: "k-button-decrease",
@@ -114,7 +114,7 @@ const g = {
           title: e.decrementTitle,
           onClick: e.decrement
         }
-      ), e.children, /* @__PURE__ */ l.createElement(
+      ), e.children, /* @__PURE__ */ r.createElement(
         _,
         {
           className: "k-button-increase",
@@ -137,7 +137,7 @@ const g = {
     }),
     [t, S]
   ), q(() => {
-    V.current = {
+    A.current = {
       props: t,
       sliderTrack: E.current,
       focus: S
@@ -145,7 +145,7 @@ const g = {
   }, [t, S]);
   const de = a ? { marginTop: "0.5rem", marginBottom: "0.5rem" } : { marginLeft: "0.5rem", marginRight: "0.5rem" }, se = a ? { paddingTop: 0, height: "100%" } : {};
   let w;
-  return a ? w = { bottom: "calc(" + h + "%)", zIndex: 1 } : f === "rtl" ? w = { right: "calc(" + h + "% - 13px)", zIndex: 1 } : w = { left: "calc(" + h + "%)", zIndex: 1 }, /* @__PURE__ */ l.createElement(
+  return a ? w = { bottom: "calc(" + h + "%)", zIndex: 1 } : f === "rtl" ? w = { right: "calc(" + h + "% - 13px)", zIndex: 1 } : w = { left: "calc(" + h + "%)", zIndex: 1 }, /* @__PURE__ */ r.createElement(
     "div",
     {
       ref: v,
@@ -169,16 +169,16 @@ const g = {
     oe({
       enabled: (U = t.buttons) != null ? U : g.buttons,
       decrement: ie,
-      increment: le,
+      increment: re,
       incrementTitle: T.toLanguageString(
         X,
-        A[X]
+        z[X]
       ),
       decrementTitle: T.toLanguageString(
         O,
-        A[O]
+        z[O]
       ),
-      children: /* @__PURE__ */ l.createElement(ve, { onDrag: ce, onPress: re, autoScroll: !1 }, /* @__PURE__ */ l.createElement(
+      children: /* @__PURE__ */ r.createElement(ve, { onDrag: ce, onPress: le, autoScroll: !1 }, /* @__PURE__ */ r.createElement(
         "div",
         {
           className: "k-slider-track-wrap",
@@ -189,38 +189,38 @@ const g = {
             ...de
           }
         },
-        t.children && /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-slider-items", style: { margin: 0, ...se } }, l.Children.map(t.children, (e, n) => e && l.cloneElement(
+        t.children && /* @__PURE__ */ r.createElement("ul", { className: "k-reset k-slider-items", style: { margin: 0, ...se } }, r.Children.map(t.children, (e, n) => e && r.cloneElement(
           e,
           {
             position: 100 * (e.props.position - t.min) / (t.max - t.min),
             vertical: a,
             firstTick: n === 0,
-            lastTick: n === l.Children.count(t.children) - 1
+            lastTick: n === r.Children.count(t.children) - 1
           },
           e.props.children
         ))),
-        /* @__PURE__ */ l.createElement(
+        /* @__PURE__ */ r.createElement(
           "div",
           {
             className: "k-slider-track",
             style: a ? { bottom: 0, height: "100%" } : { [f === "rtl" ? "right" : "left"]: 0, width: "100%" },
             ref: E
           },
-          /* @__PURE__ */ l.createElement(
+          /* @__PURE__ */ r.createElement(
             "div",
             {
               className: "k-slider-selection",
               style: a ? { height: h + "%" } : { width: h + "%" }
             }
           ),
-          /* @__PURE__ */ l.createElement(
+          /* @__PURE__ */ r.createElement(
             "span",
             {
               role: "slider",
               "aria-valuemin": t.min,
               "aria-valuemax": t.max,
-              "aria-valuenow": r,
-              "aria-valuetext": String(r),
+              "aria-valuenow": l,
+              "aria-valuetext": String(l),
               "aria-orientation": a ? "vertical" : void 0,
               "aria-disabled": d ? "true" : void 0,
               "aria-labelledby": t.ariaLabelledBy,
@@ -230,7 +230,7 @@ const g = {
               className: "k-draghandle k-draghandle-end",
               title: T.toLanguageString(
                 H,
-                A[H]
+                z[H]
               ),
               style: w
             }
@@ -240,8 +240,8 @@ const g = {
     })
   );
 });
-z.displayName = "Slider";
-const Se = be(), J = ue(Se, z);
+B.displayName = "Slider";
+const Se = be(), J = ue(Se, B);
 J.displayName = "KendoReactSlider";
 J.propTypes = {
   value: i.number,
@@ -264,9 +264,9 @@ J.propTypes = {
   dir: i.oneOf(["ltr", "rtl"]),
   children: i.node
 };
-ke(z);
+ke(B);
 export {
   J as Slider,
   Se as SliderPropsContext,
-  z as SliderWithoutContext
+  B as SliderWithoutContext
 };