@sberbusiness/triplex-next 1.34.0 → 1.35.0

package/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDot.js

@@ -1,158 +1,226 @@
-import { jsxs as b, Fragment as B, jsx as f } from "react/jsx-runtime";
-import { useState as a, useContext as re, useRef as le, useLayoutEffect as L, useEffect as ae } from "react";
-import { u as ie, c as ne, l as k } from "../../../../chunks/vendor-D5cfSbgz.js";
-import { SliderExtendedUtils as o } from "../../SliderExtendedUtils.js";
-import { SliderExtendedContext as ce } from "../../SliderExtendedContext.js";
-import { SliderExtendedMoveHandler as ue } from "../SliderExtendedMoveHandler.js";
-import { SliderExtendedDotActions as O } from "./SliderExtendedDotActions.js";
-import { useSliderExtendedDotTabIndex as me } from "./useSliderExtendedDotTabIndex.js";
-import { KeyDownListener as F } from "../../../KeyDownListener/KeyDownListener.js";
-import { EVENT_KEY_CODES as p } from "../../../../utils/keyboard.js";
-import { createSizeToClassNameMap as fe } from "../../../../utils/classNameMaps.js";
-const pe = "sliderExtendedDot__f9376d5d", xe = "focusedByClick__029d458a", he = "disabled__e9c0c10c", ge = "dragByMouse__4dacb440", De = "lg__1a20e2aa", i = {
-  sliderExtendedDot: pe,
-  focusedByClick: xe,
-  disabled: he,
-  dragByMouse: ge,
-  lg: De
-}, Ee = fe(i), ye = ({
-  children: K,
-  className: P,
-  onBlur: x,
-  onChange: r,
-  onFocus: h,
-  onMouseDown: g,
-  onTouchStart: D,
-  value: d,
-  ...A
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState, useContext, useRef, useLayoutEffect, useEffect } from "react";
+import { u as uniqueId, c as clsx, l as lodashExports } from "../../../../chunks/vendor-Bco_z_Yi.js";
+import { SliderExtendedUtils } from "../../SliderExtendedUtils.js";
+import { SliderExtendedContext } from "../../SliderExtendedContext.js";
+import { SliderExtendedMoveHandler } from "../SliderExtendedMoveHandler.js";
+import { SliderExtendedDotActions } from "./SliderExtendedDotActions.js";
+import { useSliderExtendedDotTabIndex } from "./useSliderExtendedDotTabIndex.js";
+import { KeyDownListener } from "../../../KeyDownListener/KeyDownListener.js";
+import { EVENT_KEY_CODES } from "../../../../utils/keyboard.js";
+import { createSizeToClassNameMap } from "../../../../utils/classNameMaps.js";
+const sliderExtendedDot = "sliderExtendedDot__c6ad6caa";
+const focusedByClick = "focusedByClick__a468a744";
+const disabled = "disabled__f5553adf";
+const dragByMouse = "dragByMouse__3d9385cc";
+const lg = "lg__6c6f1e8b";
+const styles = {
+  sliderExtendedDot,
+  focusedByClick,
+  disabled,
+  dragByMouse,
+  lg
+};
+const sizeToClassNameMap = createSizeToClassNameMap(styles);
+const SliderExtendedDot = ({
+  children,
+  className,
+  onBlur,
+  onChange,
+  onFocus,
+  onMouseDown,
+  onTouchStart,
+  value,
+  ...htmlSpanAttributes
 }) => {
-  const [W, N] = a(!1), [X, E] = a(!1), [H, n] = a(!1), [l] = a(ie()), [U, M] = a(0), {
-    addDot: j,
-    disabled: _,
-    dots: z,
-    focused: y,
-    isHoverOrDragTrack: w,
-    max: c,
-    min: u,
-    railNode: m,
-    removeDot: q,
-    reverse: v,
-    setFocused: V,
-    steps: s,
-    updateDot: G,
-    size: Y
-  } = re(ce), $ = me(_, l, z, y), C = le(null);
-  L(() => () => q(l), []), ae(() => {
-    const e = o.getNormalizedValue({ max: c, min: u, value: d });
-    j({
-      changeValue: r,
-      id: l,
-      normalizedValue: e,
-      stepIndex: o.getStepIndexByNormalizedValue({ normalizedValue: e, steps: s }),
-      value: d
+  const [isFocused, setIsFocused] = useState(false);
+  const [isFocusedByClick, setIsFocusedByClick] = useState(false);
+  const [isDragged, setIsDragged] = useState(false);
+  const [id] = useState(uniqueId());
+  const [leftPosition, setLeftPosition] = useState(0);
+  const {
+    addDot,
+    disabled: disabled2,
+    dots,
+    focused: focusedSlider,
+    isHoverOrDragTrack,
+    max,
+    min,
+    railNode,
+    removeDot,
+    reverse,
+    setFocused: setFocusedSlider,
+    steps,
+    updateDot,
+    size
+  } = useContext(SliderExtendedContext);
+  const tabIndex = useSliderExtendedDotTabIndex(disabled2, id, dots, focusedSlider);
+  const ref = useRef(null);
+  useLayoutEffect(() => () => removeDot(id), []);
+  useEffect(() => {
+    const normalizedValue = SliderExtendedUtils.getNormalizedValue({ max, min, value });
+    addDot({
+      changeValue: onChange,
+      id,
+      normalizedValue,
+      stepIndex: SliderExtendedUtils.getStepIndexByNormalizedValue({ normalizedValue, steps }),
+      value
     });
-  }, []), L(() => {
-    const e = o.getNormalizedValue({ max: c, min: u, value: d });
-    M(v ? 100 - e : e), G({
-      changeValue: r,
-      id: l,
-      normalizedValue: e,
-      stepIndex: o.getStepIndexByNormalizedValue({
-        normalizedValue: e,
-        steps: s
+  }, []);
+  useLayoutEffect(() => {
+    const nextNormalizedValue = SliderExtendedUtils.getNormalizedValue({ max, min, value });
+    if (reverse) {
+      setLeftPosition(100 - nextNormalizedValue);
+    } else {
+      setLeftPosition(nextNormalizedValue);
+    }
+    updateDot({
+      changeValue: onChange,
+      id,
+      normalizedValue: nextNormalizedValue,
+      stepIndex: SliderExtendedUtils.getStepIndexByNormalizedValue({
+        normalizedValue: nextNormalizedValue,
+        steps
       }),
-      value: d
+      value
     });
-  }, [r, d, c, u, s]);
-  const J = (e) => (t) => {
-    E(!0), n(!0), document.addEventListener("mouseup", R), e(t), g == null || g(t);
-  }, Q = (e) => {
-    if (m) {
-      let t = o.getNormalizedCursorValue({
-        cursorXPosition: e.clientX,
-        railNode: m
+  }, [onChange, value, max, min, steps]);
+  const handleMouseDown = (onTargetMouseDown) => (event) => {
+    setIsFocusedByClick(true);
+    setIsDragged(true);
+    document.addEventListener("mouseup", handleDocumentMouseUp);
+    onTargetMouseDown(event);
+    onMouseDown == null ? void 0 : onMouseDown(event);
+  };
+  const handleMouseMove = (event) => {
+    if (railNode) {
+      let normalizedValue = SliderExtendedUtils.getNormalizedCursorValue({
+        cursorXPosition: event.clientX,
+        railNode
       });
-      v && (t = 100 - t);
-      const S = o.getNearestStep({ normalizedValue: t, steps: s });
-      r(S.value);
+      if (reverse) {
+        normalizedValue = 100 - normalizedValue;
+      }
+      const nextStep = SliderExtendedUtils.getNearestStep({ normalizedValue, steps });
+      onChange(nextStep.value);
+    }
+  };
+  const handleDocumentMouseUp = () => {
+    setIsDragged(false);
+    document.removeEventListener("mouseup", handleDocumentMouseUp);
+  };
+  const handleTouchStart = (onTargetTouchStart) => (event) => {
+    if (event.touches.length != 1) {
+      return;
+    }
+    setIsFocusedByClick(true);
+    setIsDragged(true);
+    document.addEventListener("touchend", handleDocumentTouchEnd);
+    onTargetTouchStart(event);
+    onTouchStart == null ? void 0 : onTouchStart(event);
+  };
+  const handleTouchMove = (event) => {
+    if (event.touches.length != 1) {
+      return;
+    }
+    if (event.cancelable) {
+      event.preventDefault();
     }
-  }, R = () => {
-    n(!1), document.removeEventListener("mouseup", R);
-  }, Z = (e) => (t) => {
-    t.touches.length == 1 && (E(!0), n(!0), document.addEventListener("touchend", T), e(t), D == null || D(t));
-  }, ee = (e) => {
-    if (e.touches.length == 1 && (e.cancelable && e.preventDefault(), m)) {
-      let t = o.getNormalizedCursorValue({
-        cursorXPosition: e.touches[0].clientX,
-        railNode: m
+    if (railNode) {
+      let normalizedValue = SliderExtendedUtils.getNormalizedCursorValue({
+        cursorXPosition: event.touches[0].clientX,
+        railNode
       });
-      v && (t = 100 - t);
-      const S = o.getNearestStep({ normalizedValue: t, steps: s });
-      r(S.value);
+      if (reverse) {
+        normalizedValue = 100 - normalizedValue;
+      }
+      const nextStep = SliderExtendedUtils.getNearestStep({ normalizedValue, steps });
+      onChange(nextStep.value);
+    }
+  };
+  const handleDocumentTouchEnd = (event) => {
+    if (event.cancelable) {
+      event.preventDefault();
+    }
+    setIsDragged(false);
+    document.removeEventListener("touchend", handleDocumentTouchEnd);
+  };
+  const getCurrentDot = () => dots.filter((d) => d.id === id)[0];
+  const handleKeyDownToMoveLeft = (event) => {
+    event.preventDefault();
+    SliderExtendedDotActions.moveToPrevStep(getCurrentDot(), steps);
+  };
+  const handleKeyDownToMoveRight = (event) => {
+    event.preventDefault();
+    SliderExtendedDotActions.moveToNextStep(getCurrentDot(), steps);
+  };
+  const handleFocus = (event) => {
+    if (!focusedSlider) {
+      setFocusedSlider(true);
+    }
+    setIsFocused(true);
+    onFocus == null ? void 0 : onFocus(event);
+  };
+  const handleBlur = (event) => {
+    if (focusedSlider) {
+      setFocusedSlider(false);
     }
-  }, T = (e) => {
-    e.cancelable && e.preventDefault(), n(!1), document.removeEventListener("touchend", T);
-  }, I = () => z.filter((e) => e.id === l)[0], te = (e) => {
-    e.preventDefault(), O.moveToPrevStep(I(), s);
-  }, oe = (e) => {
-    e.preventDefault(), O.moveToNextStep(I(), s);
-  }, se = (e) => {
-    y || V(!0), N(!0), h == null || h(e);
-  }, de = (e) => {
-    y && V(!1), E(!1), N(!1), x == null || x(e);
+    setIsFocusedByClick(false);
+    setIsFocused(false);
+    onBlur == null ? void 0 : onBlur(event);
   };
-  return /* @__PURE__ */ b(B, { children: [
-    W && /* @__PURE__ */ b(B, { children: [
-      /* @__PURE__ */ f(
-        F,
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isFocused && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        KeyDownListener,
         {
-          onMatch: te,
-          eventKeyCode: [p.ARROW_LEFT, p.ARROW_DOWN]
+          onMatch: handleKeyDownToMoveLeft,
+          eventKeyCode: [EVENT_KEY_CODES.ARROW_LEFT, EVENT_KEY_CODES.ARROW_DOWN]
         }
       ),
-      /* @__PURE__ */ f(
-        F,
+      /* @__PURE__ */ jsx(
+        KeyDownListener,
         {
-          onMatch: oe,
-          eventKeyCode: [p.ARROW_RIGHT, p.ARROW_UP]
+          onMatch: handleKeyDownToMoveRight,
+          eventKeyCode: [EVENT_KEY_CODES.ARROW_RIGHT, EVENT_KEY_CODES.ARROW_UP]
         }
       )
     ] }),
-    /* @__PURE__ */ f(
-      ue,
+    /* @__PURE__ */ jsx(
+      SliderExtendedMoveHandler,
       {
-        onMouseMove: k.throttle(Q, 50),
-        onTouchMove: k.throttle(ee),
-        targetRef: C,
-        children: ({ onTargetMouseDown: e, onTargetTouchStart: t }) => /* @__PURE__ */ f(
+        onMouseMove: lodashExports.throttle(handleMouseMove, 50),
+        onTouchMove: lodashExports.throttle(handleTouchMove),
+        targetRef: ref,
+        children: ({ onTargetMouseDown, onTargetTouchStart }) => /* @__PURE__ */ jsx(
           "span",
           {
-            tabIndex: $,
+            tabIndex,
             role: "slider",
-            "aria-valuemin": u,
-            "aria-valuenow": d,
-            "aria-valuemax": c,
-            ...A,
-            className: ne(i.sliderExtendedDot, Ee[Y], P, {
-              [i.disabled]: _,
-              [i.dragByMouse]: H || w,
-              [i.focusedByClick]: X
+            "aria-valuemin": min,
+            "aria-valuenow": value,
+            "aria-valuemax": max,
+            ...htmlSpanAttributes,
+            className: clsx(styles.sliderExtendedDot, sizeToClassNameMap[size], className, {
+              [styles.disabled]: disabled2,
+              [styles.dragByMouse]: isDragged || isHoverOrDragTrack,
+              [styles.focusedByClick]: isFocusedByClick
             }),
-            onBlur: de,
-            onFocus: se,
-            onMouseDown: J(e),
-            onTouchStart: Z(t),
-            style: { left: `${U}%` },
-            ref: C,
-            children: K
+            onBlur: handleBlur,
+            onFocus: handleFocus,
+            onMouseDown: handleMouseDown(onTargetMouseDown),
+            onTouchStart: handleTouchStart(onTargetTouchStart),
+            style: { left: `${leftPosition}%` },
+            ref,
+            children
           }
         )
       }
     )
   ] });
 };
-ye.displayName = "SliderExtendedDot";
+SliderExtendedDot.displayName = "SliderExtendedDot";
 export {
-  ye as SliderExtendedDot
+  SliderExtendedDot
 };
 //# sourceMappingURL=SliderExtendedDot.js.map

package/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderExtendedDot.js","sources":["../../../../../src/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDot.tsx"],"sourcesContent":["import React, { useState, useEffect, useContext, useRef, useLayoutEffect } from \"react\";\nimport { throttle } from \"lodash\";\nimport { SliderExtendedUtils } from \"../../SliderExtendedUtils\";\nimport { SliderExtendedContext } from \"../../SliderExtendedContext\";\nimport { SliderExtendedMoveHandler, TOnTargetMouseDown, TOnTargetTouchStart } from \"../SliderExtendedMoveHandler\";\nimport { SliderExtendedDotActions } from \"./SliderExtendedDotActions\";\nimport { useSliderExtendedDotTabIndex } from \"./useSliderExtendedDotTabIndex\";\nimport { uniqueId } from \"lodash-es\";\nimport { KeyDownListener } from \"@sberbusiness/triplex-next/components/KeyDownListener\";\nimport { EVENT_KEY_CODES } from \"@sberbusiness/triplex-next/utils/keyboard\";\nimport clsx from \"clsx\";\nimport { createSizeToClassNameMap } from \"@sberbusiness/triplex-next/utils/classNameMaps\";\nimport styles from \"./styles/SliderExtendedDot.module.less\";\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\n/** Свойства компонента SlideExtendedDot. */\nexport interface ISliderExtendedDotProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"onChange\" | \"value\"> {\n    onChange: (value: number) => void;\n    value: number;\n}\n\n/** Компонент SliderExtendedDot. Слайдер может иметь 1 или 2 SliderExtendedDot. */\nexport const SliderExtendedDot: React.FC<ISliderExtendedDotProps> = ({\n    children,\n    className,\n    onBlur,\n    onChange,\n    onFocus,\n    onMouseDown,\n    onTouchStart,\n    value,\n    ...htmlSpanAttributes\n}) => {\n    // Кнопка в фокусе.\n    const [isFocused, setIsFocused] = useState(false);\n    // Кнопка получила фокус при клике.\n    const [isFocusedByClick, setIsFocusedByClick] = useState(false);\n    // Кнопка в текущий момент перетаскивается мышью.\n    const [isDragged, setIsDragged] = useState(false);\n    const [id] = useState(uniqueId());\n    const [leftPosition, setLeftPosition] = useState(0);\n    const {\n        addDot,\n        disabled,\n        dots,\n        focused: focusedSlider,\n        isHoverOrDragTrack,\n        max,\n        min,\n        railNode,\n        removeDot,\n        reverse,\n        setFocused: setFocusedSlider,\n        steps,\n        updateDot,\n        size,\n    } = useContext(SliderExtendedContext);\n\n    const tabIndex = useSliderExtendedDotTabIndex(disabled, id, dots, focusedSlider);\n    const ref = useRef(null);\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    useLayoutEffect(() => () => removeDot(id), []);\n\n    useEffect(() => {\n        const normalizedValue = SliderExtendedUtils.getNormalizedValue({ max, min, value });\n\n        // Добавление Dot в контекст.\n        addDot({\n            changeValue: onChange,\n            id,\n            normalizedValue,\n            stepIndex: SliderExtendedUtils.getStepIndexByNormalizedValue({ normalizedValue, steps }),\n            value,\n        });\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    useLayoutEffect(() => {\n        const nextNormalizedValue = SliderExtendedUtils.getNormalizedValue({ max, min, value });\n\n        if (reverse) {\n            setLeftPosition(100 - nextNormalizedValue);\n        } else {\n            setLeftPosition(nextNormalizedValue);\n        }\n\n        updateDot({\n            changeValue: onChange,\n            id,\n            normalizedValue: nextNormalizedValue,\n            stepIndex: SliderExtendedUtils.getStepIndexByNormalizedValue({\n                normalizedValue: nextNormalizedValue,\n                steps,\n            }),\n            value,\n        });\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [onChange, value, max, min, steps]);\n\n    const handleMouseDown = (onTargetMouseDown: TOnTargetMouseDown) => (event: React.MouseEvent<HTMLSpanElement>) => {\n        setIsFocusedByClick(true);\n\n        setIsDragged(true);\n        document.addEventListener(\"mouseup\", handleDocumentMouseUp);\n\n        onTargetMouseDown(event);\n        onMouseDown?.(event);\n    };\n\n    const handleMouseMove = (event: MouseEvent) => {\n        if (railNode) {\n            let normalizedValue = SliderExtendedUtils.getNormalizedCursorValue({\n                cursorXPosition: event.clientX,\n                railNode,\n            });\n            if (reverse) {\n                normalizedValue = 100 - normalizedValue;\n            }\n            const nextStep = SliderExtendedUtils.getNearestStep({ normalizedValue, steps });\n\n            onChange(nextStep.value);\n        }\n    };\n\n    const handleDocumentMouseUp = () => {\n        setIsDragged(false);\n\n        document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\n    };\n\n    const handleTouchStart =\n        (onTargetTouchStart: TOnTargetTouchStart) => (event: React.TouchEvent<HTMLSpanElement>) => {\n            if (event.touches.length != 1) {\n                return;\n            }\n\n            setIsFocusedByClick(true);\n\n            setIsDragged(true);\n            document.addEventListener(\"touchend\", handleDocumentTouchEnd);\n\n            onTargetTouchStart(event);\n            onTouchStart?.(event);\n        };\n\n    const handleTouchMove = (event: TouchEvent) => {\n        if (event.touches.length != 1) {\n            return;\n        }\n\n        if (event.cancelable) {\n            event.preventDefault();\n        }\n\n        if (railNode) {\n            let normalizedValue = SliderExtendedUtils.getNormalizedCursorValue({\n                cursorXPosition: event.touches[0].clientX,\n                railNode,\n            });\n            if (reverse) {\n                normalizedValue = 100 - normalizedValue;\n            }\n            const nextStep = SliderExtendedUtils.getNearestStep({ normalizedValue, steps });\n\n            onChange(nextStep.value);\n        }\n    };\n\n    const handleDocumentTouchEnd = (event: TouchEvent) => {\n        if (event.cancelable) {\n            event.preventDefault();\n        }\n\n        setIsDragged(false);\n\n        document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\n    };\n\n    /**\n     * Возвращает текущую кнопку из контекста.\n     */\n    const getCurrentDot = () => dots.filter((d) => d.id === id)[0];\n\n    /**\n     * Обработчик сочетаний клавиш, меняющих значение слайдера на меньшее.\n     */\n    const handleKeyDownToMoveLeft = (event: KeyboardEvent) => {\n        // Предотвращает скролл страницы.\n        event.preventDefault();\n\n        SliderExtendedDotActions.moveToPrevStep(getCurrentDot(), steps);\n    };\n\n    /**\n     * Обработчик сочетаний клавиш, меняющих значение слайдера на большее.\n     */\n    const handleKeyDownToMoveRight = (event: KeyboardEvent) => {\n        // Предотвращает скролл страницы.\n        event.preventDefault();\n\n        SliderExtendedDotActions.moveToNextStep(getCurrentDot(), steps);\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n        if (!focusedSlider) {\n            setFocusedSlider(true);\n        }\n\n        setIsFocused(true);\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: React.FocusEvent<HTMLSpanElement>) => {\n        if (focusedSlider) {\n            setFocusedSlider(false);\n        }\n\n        setIsFocusedByClick(false);\n        setIsFocused(false);\n        onBlur?.(event);\n    };\n\n    return (\n        <>\n            {isFocused && (\n                <>\n                    <KeyDownListener\n                        onMatch={handleKeyDownToMoveLeft}\n                        eventKeyCode={[EVENT_KEY_CODES.ARROW_LEFT, EVENT_KEY_CODES.ARROW_DOWN]}\n                    />\n                    <KeyDownListener\n                        onMatch={handleKeyDownToMoveRight}\n                        eventKeyCode={[EVENT_KEY_CODES.ARROW_RIGHT, EVENT_KEY_CODES.ARROW_UP]}\n                    />\n                </>\n            )}\n\n            <SliderExtendedMoveHandler\n                onMouseMove={throttle(handleMouseMove, 50)}\n                onTouchMove={throttle(handleTouchMove)}\n                targetRef={ref}\n            >\n                {({ onTargetMouseDown, onTargetTouchStart }) => (\n                    <span\n                        tabIndex={tabIndex}\n                        role=\"slider\"\n                        aria-valuemin={min}\n                        aria-valuenow={value}\n                        aria-valuemax={max}\n                        {...htmlSpanAttributes}\n                        className={clsx(styles.sliderExtendedDot, sizeToClassNameMap[size], className, {\n                            [styles.disabled]: disabled,\n                            [styles.dragByMouse]: isDragged || isHoverOrDragTrack,\n                            [styles.focusedByClick]: isFocusedByClick,\n                        })}\n                        onBlur={handleBlur}\n                        onFocus={handleFocus}\n                        onMouseDown={handleMouseDown(onTargetMouseDown)}\n                        onTouchStart={handleTouchStart(onTargetTouchStart)}\n                        style={{ left: `${leftPosition}%` }}\n                        ref={ref}\n                    >\n                        {children}\n                    </span>\n                )}\n            </SliderExtendedMoveHandler>\n        </>\n    );\n};\n\nSliderExtendedDot.displayName = \"SliderExtendedDot\";\n"],"names":["disabled","throttle"],"mappings":"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"}

package/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDotActions.js

@@ -1,12 +1,16 @@
-const t = {
-  moveToNextStep: (e, n) => {
-    e.stepIndex < n.length - 1 && e.changeValue(n[e.stepIndex + 1].value);
+const SliderExtendedDotActions = {
+  moveToNextStep: (dot, steps) => {
+    if (dot.stepIndex < steps.length - 1) {
+      dot.changeValue(steps[dot.stepIndex + 1].value);
+    }
   },
-  moveToPrevStep: (e, n) => {
-    e.stepIndex > 0 && e.changeValue(n[e.stepIndex - 1].value);
+  moveToPrevStep: (dot, steps) => {
+    if (dot.stepIndex > 0) {
+      dot.changeValue(steps[dot.stepIndex - 1].value);
+    }
   }
 };
 export {
-  t as SliderExtendedDotActions
+  SliderExtendedDotActions
 };
 //# sourceMappingURL=SliderExtendedDotActions.js.map

package/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDotActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderExtendedDotActions.js","sources":["../../../../../src/components/SliderExtended/components/SliderExtendedDot/SliderExtendedDotActions.ts"],"sourcesContent":["import { ISliderExtendedDot, ISliderExtendedStep } from \"../../SliderExtendedContext\";\n\ninterface ISliderExtendedDotActions {\n    /**\n     * Перемещение точки на следующий шаг.\n     */\n    moveToNextStep: (dot: ISliderExtendedDot, steps: ISliderExtendedStep[]) => void;\n    /**\n     * Перемещение точки на предыдущий шаг.\n     */\n    moveToPrevStep: (dot: ISliderExtendedDot, steps: ISliderExtendedStep[]) => void;\n}\n\nexport const SliderExtendedDotActions: ISliderExtendedDotActions = {\n    moveToNextStep: (dot, steps) => {\n        if (dot.stepIndex < steps.length - 1) {\n            dot.changeValue(steps[dot.stepIndex + 1].value);\n        }\n    },\n    moveToPrevStep: (dot, steps) => {\n        if (dot.stepIndex > 0) {\n            dot.changeValue(steps[dot.stepIndex - 1].value);\n        }\n    },\n};\n"],"names":[],"mappings":"AAaO,MAAM,2BAAsD;AAAA,EAC/D,gBAAgB,CAAC,KAAK,UAAU;AAC5B,QAAI,IAAI,YAAY,MAAM,SAAS,GAAG;AAClC,UAAI,YAAY,MAAM,IAAI,YAAY,CAAC,EAAE,KAAK;AAAA,IAClD;AAAA,EACJ;AAAA,EACA,gBAAgB,CAAC,KAAK,UAAU;AAC5B,QAAI,IAAI,YAAY,GAAG;AACnB,UAAI,YAAY,MAAM,IAAI,YAAY,CAAC,EAAE,KAAK;AAAA,IAClD;AAAA,EACJ;AACJ;"}

package/components/SliderExtended/components/SliderExtendedDot/useSliderExtendedDotTabIndex.js

@@ -1,21 +1,55 @@
-import { useState as u, useLayoutEffect as a } from "react";
-const x = (f, s, t, n) => {
-  const [o, e] = u(-1);
-  return a(() => {
-    t.length === 2 ? [...t].sort((i, l) => i.value - l.value)[0].id === s && e(0) : e(0);
-  }, []), a(() => {
-    if (t.length === 2) {
-      const r = [...t].sort((i, l) => i.value - l.value);
-      n ? r[1].id === s ? e(3) : e(1) : r[0].id === s ? e(0) : e(-1);
+import { useState, useLayoutEffect } from "react";
+const useSliderExtendedDotTabIndex = (disabled, dotId, dots, focusedSlider) => {
+  const [tabIndex, setTabIndex] = useState(-1);
+  useLayoutEffect(() => {
+    if (dots.length === 2) {
+      const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);
+      if (sortDotsArr[0].id === dotId) {
+        setTabIndex(0);
+      }
+    } else {
+      setTabIndex(0);
     }
-  }, [n]), a(() => {
-    if (t.length === 2) {
-      const r = [...t].sort((i, l) => i.value - l.value);
-      n ? r[0].id === s ? e(1) : e(3) : r[0].id === s ? e(0) : e(-1);
+  }, []);
+  useLayoutEffect(() => {
+    if (dots.length === 2) {
+      const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);
+      if (focusedSlider) {
+        if (sortDotsArr[1].id === dotId) {
+          setTabIndex(3);
+        } else {
+          setTabIndex(1);
+        }
+      } else {
+        if (sortDotsArr[0].id === dotId) {
+          setTabIndex(0);
+        } else {
+          setTabIndex(-1);
+        }
+      }
     }
-  }, [t]), f ? -1 : o;
+  }, [focusedSlider]);
+  useLayoutEffect(() => {
+    if (dots.length === 2) {
+      const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);
+      if (focusedSlider) {
+        if (sortDotsArr[0].id === dotId) {
+          setTabIndex(1);
+        } else {
+          setTabIndex(3);
+        }
+      } else {
+        if (sortDotsArr[0].id === dotId) {
+          setTabIndex(0);
+        } else {
+          setTabIndex(-1);
+        }
+      }
+    }
+  }, [dots]);
+  return disabled ? -1 : tabIndex;
 };
 export {
-  x as useSliderExtendedDotTabIndex
+  useSliderExtendedDotTabIndex
 };
 //# sourceMappingURL=useSliderExtendedDotTabIndex.js.map

package/components/SliderExtended/components/SliderExtendedDot/useSliderExtendedDotTabIndex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSliderExtendedDotTabIndex.js","sources":["../../../../../src/components/SliderExtended/components/SliderExtendedDot/useSliderExtendedDotTabIndex.tsx"],"sourcesContent":["import { ISliderExtendedDot } from \"../../SliderExtendedContext\";\nimport { useState, useLayoutEffect } from \"react\";\n\n/**\n * Хук, возвращающий tabIndex.\n * Если слайдер имеет два ползунка, tabIndex динамически меняется в зависимости от положения ползунков.\n * По-умолчанию, SliderExtendedDot с меньшим value имеет tabIndex - 0, SliderExtendedDot с большим value и SliderExtendedTrack имеют tabIndex - -1.\n * Когда SliderExtendedDot или SliderExtendedTrack перемещаются, tabIndex для SliderExtendedDot c меньшим value становится равен 1, SliderExtendedTrack - 2, SliderExtendedDot c большим value - 3,\n * чтобы можно было последовательно передвигаться по этим элементам через Tab.\n */\nexport const useSliderExtendedDotTabIndex = (\n    disabled: boolean,\n    dotId: string,\n    dots: ISliderExtendedDot[],\n    focusedSlider: boolean,\n): number => {\n    const [tabIndex, setTabIndex] = useState(-1);\n\n    useLayoutEffect(() => {\n        if (dots.length === 2) {\n            const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);\n            if (sortDotsArr[0].id === dotId) {\n                setTabIndex(0);\n            }\n        } else {\n            setTabIndex(0);\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    useLayoutEffect(() => {\n        if (dots.length === 2) {\n            const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);\n\n            if (focusedSlider) {\n                if (sortDotsArr[1].id === dotId) {\n                    setTabIndex(3);\n                } else {\n                    setTabIndex(1);\n                }\n            } else {\n                if (sortDotsArr[0].id === dotId) {\n                    setTabIndex(0);\n                } else {\n                    setTabIndex(-1);\n                }\n            }\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [focusedSlider]);\n\n    useLayoutEffect(() => {\n        if (dots.length === 2) {\n            const sortDotsArr = [...dots].sort((dot1, dot2) => dot1.value - dot2.value);\n\n            if (focusedSlider) {\n                if (sortDotsArr[0].id === dotId) {\n                    setTabIndex(1);\n                } else {\n                    setTabIndex(3);\n                }\n            } else {\n                if (sortDotsArr[0].id === dotId) {\n                    setTabIndex(0);\n                } else {\n                    setTabIndex(-1);\n                }\n            }\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [dots]);\n\n    return disabled ? -1 : tabIndex;\n};\n"],"names":[],"mappings":";AAUO,MAAM,+BAA+B,CACxC,UACA,OACA,MACA,kBACS;AACT,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAE3C,kBAAgB,MAAM;AAClB,QAAI,KAAK,WAAW,GAAG;AACnB,YAAM,cAAc,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,MAAM,SAAS,KAAK,QAAQ,KAAK,KAAK;AAC1E,UAAI,YAAY,CAAC,EAAE,OAAO,OAAO;AAC7B,oBAAY,CAAC;AAAA,MACjB;AAAA,IACJ,OAAO;AACH,kBAAY,CAAC;AAAA,IACjB;AAAA,EAEJ,GAAG,CAAA,CAAE;AAEL,kBAAgB,MAAM;AAClB,QAAI,KAAK,WAAW,GAAG;AACnB,YAAM,cAAc,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,MAAM,SAAS,KAAK,QAAQ,KAAK,KAAK;AAE1E,UAAI,eAAe;AACf,YAAI,YAAY,CAAC,EAAE,OAAO,OAAO;AAC7B,sBAAY,CAAC;AAAA,QACjB,OAAO;AACH,sBAAY,CAAC;AAAA,QACjB;AAAA,MACJ,OAAO;AACH,YAAI,YAAY,CAAC,EAAE,OAAO,OAAO;AAC7B,sBAAY,CAAC;AAAA,QACjB,OAAO;AACH,sBAAY,EAAE;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAAA,EAEJ,GAAG,CAAC,aAAa,CAAC;AAElB,kBAAgB,MAAM;AAClB,QAAI,KAAK,WAAW,GAAG;AACnB,YAAM,cAAc,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,MAAM,SAAS,KAAK,QAAQ,KAAK,KAAK;AAE1E,UAAI,eAAe;AACf,YAAI,YAAY,CAAC,EAAE,OAAO,OAAO;AAC7B,sBAAY,CAAC;AAAA,QACjB,OAAO;AACH,sBAAY,CAAC;AAAA,QACjB;AAAA,MACJ,OAAO;AACH,YAAI,YAAY,CAAC,EAAE,OAAO,OAAO;AAC7B,sBAAY,CAAC;AAAA,QACjB,OAAO;AACH,sBAAY,EAAE;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAAA,EAEJ,GAAG,CAAC,IAAI,CAAC;AAET,SAAO,WAAW,KAAK;AAC3B;"}

package/components/SliderExtended/components/SliderExtendedMarks/SliderExtendedMark.js

@@ -1,48 +1,51 @@
-import { jsxs as E, jsx as l } from "react/jsx-runtime";
-import C from "react";
-import { SliderExtendedContext as M } from "../../SliderExtendedContext.js";
-import { SliderExtendedMarkActions as s } from "./SliderExtendedMarkActions.js";
-import { c as o } from "../../../../chunks/vendor-D5cfSbgz.js";
-import { s as e } from "../../../../chunks/SliderExtendedMarks.module-BONXJjKi.js";
-import { EComponentSize as z } from "../../../../enums/EComponentSize.js";
-import { ETextSize as c } from "../../../Typography/enums.js";
-import { Text as N } from "../../../Typography/Text.js";
-import { createSizeToClassNameMap as T } from "../../../../utils/classNameMaps.js";
-const y = T(e), g = ({
-  children: x,
-  className: p,
-  value: t,
-  ...f
+import { jsxs, jsx } from "react/jsx-runtime";
+import React__default from "react";
+import { SliderExtendedContext } from "../../SliderExtendedContext.js";
+import { SliderExtendedMarkActions } from "./SliderExtendedMarkActions.js";
+import { c as clsx } from "../../../../chunks/vendor-Bco_z_Yi.js";
+import { s as styles } from "../../../../chunks/SliderExtendedMarks.module-CziHvvVc.js";
+import { EComponentSize } from "../../../../enums/EComponentSize.js";
+import { ETextSize } from "../../../Typography/enums.js";
+import { Text } from "../../../Typography/Text.js";
+import { createSizeToClassNameMap } from "../../../../utils/classNameMaps.js";
+const sizeToClassNameMap = createSizeToClassNameMap(styles);
+const SliderExtendedMark = ({
+  children,
+  className,
+  value,
+  ...htmlSpanAttributes
 }) => {
-  const { disabled: i, dots: r, min: a, max: S, reverse: d, size: m } = C.useContext(M), n = () => s.moveNearestDot({ dots: r, value: t }), k = m === z.LG ? c.B3 : c.B4;
-  return /* @__PURE__ */ E(
+  const { disabled, dots, min, max, reverse, size } = React__default.useContext(SliderExtendedContext);
+  const handleClick = () => SliderExtendedMarkActions.moveNearestDot({ dots, value });
+  const textSize = size === EComponentSize.LG ? ETextSize.B3 : ETextSize.B4;
+  return /* @__PURE__ */ jsxs(
     "span",
     {
-      className: o(e.sliderExtendedMark, y[m], p, {
+      className: clsx(styles.sliderExtendedMark, sizeToClassNameMap[size], className, {
         // Одна из SliderExtended.Dot, находится на текущей позиции.
-        [e.active]: s.isActive({ dots: r, value: t }) && !i,
-        [e.disabled]: i,
-        [e.reverse]: d
+        [styles.active]: SliderExtendedMarkActions.isActive({ dots, value }) && !disabled,
+        [styles.disabled]: disabled,
+        [styles.reverse]: reverse
       }),
-      ...f,
-      style: s.getStyle({ max: S, min: a, reverse: d, value: t }),
+      ...htmlSpanAttributes,
+      style: SliderExtendedMarkActions.getStyle({ max, min, reverse, value }),
       children: [
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ jsx(
           "span",
           {
-            className: o(e.sliderExtendedMarkDot, {
-              [e.inSelectedRange]: s.isInSelectedRange({ dots: r, min: a, value: t })
+            className: clsx(styles.sliderExtendedMarkDot, {
+              [styles.inSelectedRange]: SliderExtendedMarkActions.isInSelectedRange({ dots, min, value })
             }),
-            onClick: n
+            onClick: handleClick
           }
         ),
-        /* @__PURE__ */ l(N, { className: o(e.sliderExtendedMarkText), size: k, onClick: n, children: x })
+        /* @__PURE__ */ jsx(Text, { className: clsx(styles.sliderExtendedMarkText), size: textSize, onClick: handleClick, children })
       ]
     }
   );
 };
-g.displayName = "SliderExtendedMark";
+SliderExtendedMark.displayName = "SliderExtendedMark";
 export {
-  g as SliderExtendedMark
+  SliderExtendedMark
 };
 //# sourceMappingURL=SliderExtendedMark.js.map

package/components/SliderExtended/components/SliderExtendedMarks/SliderExtendedMark.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderExtendedMark.js","sources":["../../../../../src/components/SliderExtended/components/SliderExtendedMarks/SliderExtendedMark.tsx"],"sourcesContent":["import React from \"react\";\nimport { SliderExtendedContext } from \"../../SliderExtendedContext\";\nimport { SliderExtendedMarkActions } from \"./SliderExtendedMarkActions\";\nimport clsx from \"clsx\";\nimport styles from \"./styles/SliderExtendedMarks.module.less\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport { ETextSize } from \"@sberbusiness/triplex-next/components/Typography/enums\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\nimport { createSizeToClassNameMap } from \"@sberbusiness/triplex-next/utils/classNameMaps\";\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\n/** Свойства компонента SliderExtendedMark. */\nexport interface ISliderExtendedMarkProps extends React.HTMLAttributes<HTMLSpanElement> {\n    value: number;\n}\n\n/** Компонент SliderExtendedMark. */\nexport const SliderExtendedMark: React.FC<ISliderExtendedMarkProps> = ({\n    children,\n    className,\n    value,\n    ...htmlSpanAttributes\n}) => {\n    const { disabled, dots, min, max, reverse, size } = React.useContext(SliderExtendedContext);\n\n    const handleClick = () => SliderExtendedMarkActions.moveNearestDot({ dots, value });\n    const textSize = size === EComponentSize.LG ? ETextSize.B3 : ETextSize.B4;\n\n    return (\n        <span\n            className={clsx(styles.sliderExtendedMark, sizeToClassNameMap[size], className, {\n                // Одна из SliderExtended.Dot, находится на текущей позиции.\n                [styles.active]: SliderExtendedMarkActions.isActive({ dots, value }) && !disabled,\n                [styles.disabled]: disabled,\n                [styles.reverse]: reverse,\n            })}\n            {...htmlSpanAttributes}\n            style={SliderExtendedMarkActions.getStyle({ max, min, reverse, value })}\n        >\n            <span\n                className={clsx(styles.sliderExtendedMarkDot, {\n                    [styles.inSelectedRange]: SliderExtendedMarkActions.isInSelectedRange({ dots, min, value }),\n                })}\n                onClick={handleClick}\n            />\n            <Text className={clsx(styles.sliderExtendedMarkText)} size={textSize} onClick={handleClick}>\n                {children}\n            </Text>\n        </span>\n    );\n};\n\nSliderExtendedMark.displayName = \"SliderExtendedMark\";\n"],"names":["React"],"mappings":";;;;;;;;;;AAUA,MAAM,qBAAqB,yBAAyB,MAAM;AAQnD,MAAM,qBAAyD,CAAC;AAAA,EACnE;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAM;AACF,QAAM,EAAE,UAAU,MAAM,KAAK,KAAK,SAAS,SAASA,eAAM,WAAW,qBAAqB;AAE1F,QAAM,cAAc,MAAM,0BAA0B,eAAe,EAAE,MAAM,OAAO;AAClF,QAAM,WAAW,SAAS,eAAe,KAAK,UAAU,KAAK,UAAU;AAEvE,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW,KAAK,OAAO,oBAAoB,mBAAmB,IAAI,GAAG,WAAW;AAAA;AAAA,QAE5E,CAAC,OAAO,MAAM,GAAG,0BAA0B,SAAS,EAAE,MAAM,OAAO,KAAK,CAAC;AAAA,QACzE,CAAC,OAAO,QAAQ,GAAG;AAAA,QACnB,CAAC,OAAO,OAAO,GAAG;AAAA,MAAA,CACrB;AAAA,MACA,GAAG;AAAA,MACJ,OAAO,0BAA0B,SAAS,EAAE,KAAK,KAAK,SAAS,OAAO;AAAA,MAEtE,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAW,KAAK,OAAO,uBAAuB;AAAA,cAC1C,CAAC,OAAO,eAAe,GAAG,0BAA0B,kBAAkB,EAAE,MAAM,KAAK,MAAA,CAAO;AAAA,YAAA,CAC7F;AAAA,YACD,SAAS;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb,oBAAC,MAAA,EAAK,WAAW,KAAK,OAAO,sBAAsB,GAAG,MAAM,UAAU,SAAS,aAC1E,SAAA,CACL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEA,mBAAmB,cAAc;"}