@progress/kendo-react-inputs 8.2.0-develop.22 → 8.2.0-develop.24

package/slider/Slider.mjs

@@ -8,14 +8,14 @@
 "use client";
 import * as i from "react";
 import a from "prop-types";
-import { Keys as o, validatePackage as y, classNames as w, Draggable as x, getTabIndex as S, dispatchEvent as T, createPropsContext as E, withPropsContext as D } from "@progress/kendo-react-common";
-import { provideLocalizationService as I, registerForLocalization as L } from "@progress/kendo-react-intl";
-import { sliderIncreaseValue as d, messages as p, sliderDecreaseValue as m, sliderDragTitle as u } from "../messages/index.mjs";
-import { SLIDER_LABEL_ATTRIBUTE as C } from "./SliderLabel.mjs";
+import { Keys as n, validatePackage as y, classNames as w, Draggable as S, getTabIndex as x, dispatchEvent as T, createPropsContext as E, withPropsContext as D } from "@progress/kendo-react-common";
+import { provideLocalizationService as C, registerForLocalization as I } from "@progress/kendo-react-intl";
+import { sliderIncreaseValue as d, messages as h, sliderDecreaseValue as m, sliderDragTitle as u } from "../messages/index.mjs";
+import { SLIDER_LABEL_ATTRIBUTE as L } from "./SliderLabel.mjs";
 import { packageMetadata as B } from "../package-metadata.mjs";
 import { Button as v } from "@progress/kendo-react-buttons";
 import { caretAltUpIcon as g, caretAltLeftIcon as f, caretAltRightIcon as b, caretAltDownIcon as k } from "@progress/kendo-svg-icons";
-const h = class h extends i.Component {
+const p = class p extends i.Component {
   constructor(s) {
     super(s), this.state = {
       value: this.props.defaultValue === void 0 ? this.props.min : this.props.defaultValue,
@@ -24,14 +24,14 @@ const h = class h extends i.Component {
     }, this._sliderTrack = null, this._element = null, this.buttons = (t) => {
       if (!t.enabled)
         return t.children;
-      const e = this.state.dir === "rtl" ? this.props.vertical ? g : f : this.props.vertical ? g : b, n = this.state.dir === "rtl" ? this.props.vertical ? k : b : this.props.vertical ? k : f, r = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-up" : "caret-alt-left" : this.props.vertical ? "caret-alt-up" : "caret-alt-right", l = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-down" : "caret-alt-right" : this.props.vertical ? "caret-alt-down" : "caret-alt-left";
+      const e = this.state.dir === "rtl" ? this.props.vertical ? g : f : this.props.vertical ? g : b, l = this.state.dir === "rtl" ? this.props.vertical ? k : b : this.props.vertical ? k : f, r = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-up" : "caret-alt-left" : this.props.vertical ? "caret-alt-up" : "caret-alt-right", o = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-down" : "caret-alt-right" : this.props.vertical ? "caret-alt-down" : "caret-alt-left";
       return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
         v,
         {
           className: "k-button-decrease",
           rounded: "full",
-          icon: l,
-          svgIcon: n,
+          icon: o,
+          svgIcon: l,
           title: t.decrementTitle,
           onClick: t.decrement
         }
@@ -51,7 +51,7 @@ const h = class h extends i.Component {
     }, this.isLabel = (t) => {
       let e = t;
       for (; e; ) {
-        if (e.getAttribute(C))
+        if (e.getAttribute(L))
           return !0;
         e = e.parentElement;
       }
@@ -62,7 +62,7 @@ const h = class h extends i.Component {
       this.setState({ focused: !1 });
     }, this.onKeyDown = (t) => {
       let e;
-      t.keyCode === o.left || t.keyCode === o.down ? e = this.state.value - (this.props.step || 0) : t.keyCode === o.right || t.keyCode === o.up ? e = this.state.value + (this.props.step || 0) : t.keyCode === o.home ? e = this.props.min : t.keyCode === o.end && (e = this.props.max), e !== void 0 && (t.preventDefault(), this.change(t, e));
+      t.keyCode === n.left || t.keyCode === n.down ? e = this.state.value - (this.props.step || 0) : t.keyCode === n.right || t.keyCode === n.up ? e = this.state.value + (this.props.step || 0) : t.keyCode === n.pageDown ? e = this.state.value - (this.props.largeStep || 0) : t.keyCode === n.pageUp ? e = this.state.value + (this.props.largeStep || 0) : t.keyCode === n.home ? e = this.props.min : t.keyCode === n.end && (e = this.props.max), e !== void 0 && (t.preventDefault(), this.change(t, e));
     }, this.decrement = (t) => {
       t.preventDefault(), this.change(t, this.state.value - (this.props.step || 0));
     }, this.increment = (t) => {
@@ -72,16 +72,16 @@ const h = class h extends i.Component {
     }, this.dragOver = (t) => {
       t.event.originalEvent.preventDefault(), this.drag(t);
     }, this.drag = (t) => {
-      const e = t.element.getBoundingClientRect(), n = this.props.vertical ? e.bottom - t.event.clientY : this.state.dir === "rtl" ? e.right - t.event.clientX : t.event.clientX - e.left, r = this.props.vertical ? e.height : e.width, l = n / r;
-      this.change(t, this.props.min + l * (this.props.max - this.props.min));
+      const e = t.element.getBoundingClientRect(), l = this.props.vertical ? e.bottom - t.event.clientY : this.state.dir === "rtl" ? e.right - t.event.clientX : t.event.clientX - e.left, r = this.props.vertical ? e.height : e.width, o = l / r;
+      this.change(t, this.props.min + o * (this.props.max - this.props.min));
     }, y(B);
   }
   /**
    * @hidden
    */
   static getDerivedStateFromProps(s, t) {
-    const e = s.value !== void 0 ? s.value : t.value, { min: n, max: r } = s;
-    return e === void 0 ? null : { value: Math.min(Math.max(e, n), r) };
+    const e = s.value !== void 0 ? s.value : t.value, { min: l, max: r } = s;
+    return e === void 0 ? null : { value: Math.min(Math.max(e, l), r) };
   }
   /**
    * @hidden
@@ -96,7 +96,7 @@ const h = class h extends i.Component {
    * @hidden
    */
   render() {
-    const s = I(this), t = (this.state.value - this.props.min) / (this.props.max - this.props.min) * 100, e = this.props.vertical ? { marginTop: "0.5rem", marginBottom: "0.5rem" } : { marginLeft: "0.5rem", marginRight: "0.5rem" }, n = this.props.vertical ? { paddingTop: 0, height: "100%" } : {};
+    const s = C(this), t = (this.state.value - this.props.min) / (this.props.max - this.props.min) * 100, e = this.props.vertical ? { marginTop: "0.5rem", marginBottom: "0.5rem" } : { marginLeft: "0.5rem", marginRight: "0.5rem" }, l = this.props.vertical ? { paddingTop: 0, height: "100%" } : {};
     return /* @__PURE__ */ i.createElement(
       "div",
       {
@@ -124,10 +124,10 @@ const h = class h extends i.Component {
           enabled: this.props.buttons,
           decrement: this.decrement,
           increment: this.increment,
-          incrementTitle: s.toLanguageString(d, p[d]),
-          decrementTitle: s.toLanguageString(m, p[m])
+          incrementTitle: s.toLanguageString(d, h[d]),
+          decrementTitle: s.toLanguageString(m, h[m])
         },
-        /* @__PURE__ */ i.createElement(x, { onDrag: this.dragOver, onPress: this.dragStart, autoScroll: !1 }, /* @__PURE__ */ i.createElement(
+        /* @__PURE__ */ i.createElement(S, { onDrag: this.dragOver, onPress: this.dragStart, autoScroll: !1 }, /* @__PURE__ */ i.createElement(
           "div",
           {
             className: "k-slider-track-wrap",
@@ -142,15 +142,15 @@ const h = class h extends i.Component {
             "ul",
             {
               className: "k-reset k-slider-items",
-              style: { margin: 0, ...n }
+              style: { margin: 0, ...l }
             },
-            i.Children.map(this.props.children, (r, l) => r && i.cloneElement(
+            i.Children.map(this.props.children, (r, o) => r && i.cloneElement(
               r,
               {
                 position: 100 * (r.props.position - this.props.min) / (this.props.max - this.props.min),
                 vertical: this.props.vertical,
-                firstTick: l === 0,
-                lastTick: l === i.Children.count(this.props.children) - 1
+                firstTick: o === 0,
+                lastTick: o === i.Children.count(this.props.children) - 1
               },
               r.props.children
             ))
@@ -182,9 +182,9 @@ const h = class h extends i.Component {
                 "aria-labelledby": this.props.ariaLabelledBy,
                 "aria-describedby": this.props.ariaDescribedBy,
                 "aria-label": this.props.ariaLabel,
-                tabIndex: S(this.props.tabIndex, this.props.disabled, void 0),
+                tabIndex: x(this.props.tabIndex, this.props.disabled, void 0),
                 className: "k-draghandle k-draghandle-end",
-                title: s.toLanguageString(u, p[u]),
+                title: s.toLanguageString(u, h[u]),
                 style: this.props.vertical ? { bottom: "calc(" + t + "%)", zIndex: 1 } : this.state.dir === "rtl" ? { right: "calc(" + t + "% - 13px)", zIndex: 1 } : { left: "calc(" + t + "%)", zIndex: 1 }
               }
             )
@@ -203,7 +203,7 @@ const h = class h extends i.Component {
     t = Math.min(Math.max(t, this.props.min), this.props.max), this.setState({ value: t }), T(this.props.onChange, s, this, { value: t });
   }
 };
-h.displayName = "Slider", h.propTypes = {
+p.displayName = "Slider", p.propTypes = {
   min: a.number.isRequired,
   max: a.number.isRequired,
   value: a.number,
@@ -214,10 +214,10 @@ h.displayName = "Slider", h.propTypes = {
   ariaLabel: a.string
   // TODO: validation when buttons is set to true, but no step is provided
 };
-let c = h;
+let c = p;
 const A = E(), N = D(A, c);
 N.displayName = "KendoReactSlider";
-L(c);
+I(c);
 export {
   N as Slider,
   A as SliderPropsContext,