@megafon/ui-core 8.17.0 → 8.17.1

package/dist/es/components/Selector/Selector.d.ts

@@ -1,41 +0,0 @@
-import * as React from 'react';
-import './Selector.scss';
-export interface ISelectorProps {
-    /** Цвет селектора */
-    color?: 'dark' | 'light';
-    /** Базовый тип компонента */
-    type?: 'radio' | 'checkbox';
-    /** Значение */
-    value: string;
-    /** Имя для тега form */
-    name?: string;
-    /** Управление состоянием вкл/выкл компонента */
-    checked?: boolean;
-    /** Управление состоянием компонента при типе checkbox */
-    checkedOptions?: string[];
-    /** Отключение компонента */
-    disabled?: boolean;
-    /** Отобразить компонент в состоянии ошибки */
-    error?: boolean;
-    /** Дополнительный класс корневого элемента */
-    className?: string;
-    /** Дополнительные классы для внутренних элементов */
-    classes?: {
-        label?: string;
-        customInput?: string;
-    };
-    /** Дополнительные data атрибуты к внутренним элементам */
-    dataAttrs?: {
-        root?: Record<string, string>;
-        label?: Record<string, string>;
-        input?: Record<string, string>;
-        customInput?: Record<string, string>;
-    };
-    children?: React.ReactNode;
-    /** Обработчик изменения значения 'value' */
-    onChange?: (value: string | string[]) => void;
-    /** Ссылка на input */
-    inputRef?: React.Ref<HTMLInputElement>;
-}
-declare const Selector: React.FC<ISelectorProps>;
-export default Selector;

package/dist/es/components/Selector/Selector.js

@@ -1,70 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _extends from "@babel/runtime/helpers/extends";
-import "core-js/modules/es.array.concat.js";
-import "core-js/modules/es.array.filter.js";
-import "core-js/modules/es.array.includes.js";
-import "core-js/modules/es.function.name.js";
-import "core-js/modules/es.object.to-string.js";
-import "core-js/modules/es.string.includes.js";
-import * as React from 'react';
-import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
-import "./Selector.css";
-var CheckedIcon = function CheckedIcon(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    viewBox: "0 0 14 12"
-  }, props), /*#__PURE__*/React.createElement("path", {
-    d: "M4.523 8.368L12.386 0 14 1.914 4.523 12 0 7.187l1.614-1.914 2.909 3.095z"
-  }));
-};
-var cn = cnCreate('mfui-selector');
-var Selector = function Selector(_ref) {
-  var _ref$color = _ref.color,
-    color = _ref$color === void 0 ? 'dark' : _ref$color,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'radio' : _ref$type,
-    value = _ref.value,
-    name = _ref.name,
-    checked = _ref.checked,
-    _ref$checkedOptions = _ref.checkedOptions,
-    checkedOptions = _ref$checkedOptions === void 0 ? [] : _ref$checkedOptions,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    error = _ref.error,
-    className = _ref.className,
-    _ref$classes = _ref.classes,
-    classes = _ref$classes === void 0 ? {} : _ref$classes,
-    dataAttrs = _ref.dataAttrs,
-    children = _ref.children,
-    onChange = _ref.onChange,
-    inputRef = _ref.inputRef;
-  var handleChange = function handleChange() {
-    if (type === 'radio') {
-      return onChange === null || onChange === void 0 ? void 0 : onChange(value);
-    }
-    var isChecked = checkedOptions.includes(value);
-    var newCheckedOptions = isChecked ? checkedOptions.filter(function (option) {
-      return option !== value;
-    }) : [].concat(_toConsumableArray(checkedOptions), [value]);
-    return onChange === null || onChange === void 0 ? void 0 : onChange(newCheckedOptions);
-  };
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: cn('', className)
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("label", _extends({
-    className: cn('label', _defineProperty(_defineProperty(_defineProperty({}, color, true), "disabled", disabled), "error", error), classes.label)
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.label)), /*#__PURE__*/React.createElement("input", _extends({
-    className: cn('input'),
-    type: type,
-    name: name,
-    value: value,
-    checked: type === 'radio' ? checked : checkedOptions.includes(value),
-    disabled: disabled,
-    onChange: handleChange,
-    ref: inputRef
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input))), /*#__PURE__*/React.createElement("div", _extends({
-    className: cn('custom-input', classes.customInput)
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.customInput)), /*#__PURE__*/React.createElement(CheckedIcon, {
-    className: cn('icon')
-  })), children));
-};
-export default Selector;

package/dist/es/components/Sliders/Slider/Slider.css

@@ -1 +0,0 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-slider{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-slider__head{display:grid;font-size:15px;font-weight:500;grid-template-columns:auto 55%;line-height:24px;margin-bottom:8px}.mfui-slider__range-input{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--spbSky0);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--brandGreen)),to(var(--brandGreen)));background-image:linear-gradient(var(--brandGreen),var(--brandGreen));background-repeat:no-repeat;border-radius:100px;cursor:pointer;height:12px;margin:6px 0;outline:none}.mfui-slider__range-input:focus{outline:none}.mfui-slider__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);height:24px;width:24px}.mfui-slider__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:24px;width:24px}.mfui-slider__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:24px;width:24px}.mfui-slider__range-input::-webkit-slider-runnable-track{-webkit-appearance:none;background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.mfui-slider__range-input::-moz-range-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider__range-input::-ms-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider_disabled .mfui-slider__head{color:var(--spbSky3)}.mfui-slider_disabled .mfui-slider__range-input{background-image:-webkit-gradient(linear,left top,left bottom,from(var(--spbSky1)),to(var(--spbSky1)));background-image:linear-gradient(var(--spbSky1),var(--spbSky1));cursor:default}.mfui-slider_disabled .mfui-slider__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);-webkit-box-shadow:none;box-shadow:none;height:24px;width:24px}.mfui-slider_disabled .mfui-slider__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:24px;width:24px}.mfui-slider_disabled .mfui-slider__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:24px;width:24px}

package/dist/es/components/Sliders/Slider/Slider.d.ts

@@ -1,39 +0,0 @@
-import * as React from 'react';
-import './Slider.scss';
-export interface ISlider {
-    /** Дополнительный класс корневого элемента */
-    className?: string;
-    /** Текущее значение */
-    value?: number;
-    /** Минимальное значение */
-    minValue: number;
-    /** Максимальное значение */
-    maxValue: number;
-    /** Лейбл */
-    label?: string;
-    /** Тип выводимого значения */
-    displayValueType?: 'input' | 'line';
-    /** Единица измерения выводимого значения */
-    displayValueUnit?: string;
-    /** Переводит компонент в контролируемое состояние */
-    isControlled?: boolean;
-    /** Шаг */
-    step?: number;
-    /** Тип встроенной шкалы */
-    scale?: 'interval' | 'base';
-    /** Кастомная шкала */
-    customScale?: string[];
-    /** Переводит компонент в выключенное состояние */
-    disabled?: boolean;
-    /** Дополнительные data атрибуты к внутренним элементам */
-    dataAttrs?: {
-        root?: Record<string, string>;
-        input?: Record<string, string>;
-        rangeInput?: Record<string, string>;
-        scale?: Record<string, string>;
-    };
-    /** Обработчик изменения значения */
-    onChange?: (value: number) => void;
-}
-declare const Slider: React.FC<ISlider>;
-export default Slider;

package/dist/es/components/Sliders/Slider/Slider.js

@@ -1,95 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import * as React from 'react';
-import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
-import ValueField from "../../ValueField/ValueField";
-import SliderScale from "../components/SliderScale/SliderScale";
-import { getRangeValue, getTrackSize, removeFirstZeros } from "../helpers";
-import "./Slider.css";
-var cn = cnCreate('mfui-slider');
-var Slider = function Slider(_ref) {
-  var className = _ref.className,
-    label = _ref.label,
-    displayValueType = _ref.displayValueType,
-    displayValueUnit = _ref.displayValueUnit,
-    _ref$value = _ref.value,
-    outerValue = _ref$value === void 0 ? 0 : _ref$value,
-    minValue = _ref.minValue,
-    maxValue = _ref.maxValue,
-    _ref$isControlled = _ref.isControlled,
-    isControlled = _ref$isControlled === void 0 ? false : _ref$isControlled,
-    _ref$step = _ref.step,
-    step = _ref$step === void 0 ? 1 : _ref$step,
-    scale = _ref.scale,
-    customScale = _ref.customScale,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    dataAttrs = _ref.dataAttrs,
-    onChange = _ref.onChange;
-  var outerRangeValue = getRangeValue(outerValue, minValue, maxValue, step);
-  var _React$useState = React.useState(null),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    rawInputValue = _React$useState2[0],
-    setRawInputValue = _React$useState2[1];
-  var _React$useState3 = React.useState(outerRangeValue),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    innerRangeValue = _React$useState4[0],
-    setInnerRangeValue = _React$useState4[1];
-  var rangeValue = isControlled ? outerRangeValue : innerRangeValue;
-  var trackSize = getTrackSize(rangeValue, minValue, maxValue);
-  var showHead = !!label || !!displayValueType;
-  var handleInputChange = function handleInputChange(isRange) {
-    return function (e) {
-      var targetValue = removeFirstZeros(e.target.value);
-      var newRangeValue = getRangeValue(targetValue, minValue, maxValue, step);
-      !isControlled && setInnerRangeValue(newRangeValue);
-      !isRange && setRawInputValue(targetValue);
-      onChange === null || onChange === void 0 ? void 0 : onChange(newRangeValue);
-    };
-  };
-  var handleInputBlur = function handleInputBlur() {
-    setRawInputValue(null);
-  };
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: cn({
-      disabled: disabled
-    }, [className])
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), showHead && /*#__PURE__*/React.createElement("div", {
-    className: cn('head')
-  }, !!label && /*#__PURE__*/React.createElement("div", {
-    className: cn('label')
-  }, label), !!displayValueType && /*#__PURE__*/React.createElement(ValueField, {
-    isControlled: true,
-    position: "right",
-    value: rawInputValue !== null && rawInputValue !== void 0 ? rawInputValue : rangeValue,
-    fieldType: displayValueType,
-    valueUnit: displayValueUnit,
-    disabled: disabled,
-    onChange: handleInputChange(false),
-    onBlur: handleInputBlur,
-    dataAttrs: {
-      input: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input
-    }
-  })), /*#__PURE__*/React.createElement("input", _extends({
-    className: cn('range-input'),
-    type: "range",
-    value: rangeValue,
-    min: minValue,
-    max: maxValue,
-    onChange: handleInputChange(true),
-    disabled: disabled,
-    style: {
-      backgroundSize: "".concat(trackSize, "% 100%")
-    }
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.rangeInput))), (!!scale || !!customScale) && /*#__PURE__*/React.createElement(SliderScale, {
-    minValue: minValue,
-    maxValue: maxValue,
-    scale: scale,
-    customScale: customScale,
-    disabled: disabled,
-    dataAttrs: {
-      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.scale
-    }
-  }));
-};
-export default Slider;

package/dist/es/components/Sliders/SliderRange/SliderRange.css

@@ -1 +0,0 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-slider-range{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-slider-range__head{font-size:15px;font-weight:500;line-height:24px;margin-bottom:8px}.mfui-slider-range__display-values{display:grid;grid-template-columns:45% 45%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-top:8px;width:100%}.mfui-slider-range__range-container{cursor:pointer;height:12px;margin:6px 0;position:relative}.mfui-slider-range__range-input{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;height:0;margin:0;outline:none;pointer-events:none;position:absolute;top:50%;width:100%}.mfui-slider-range__range-input_left{z-index:1}.mfui-slider-range__range-input_left.mfui-slider-range__range-input_over{z-index:3}.mfui-slider-range__range-input_right{z-index:2}.mfui-slider-range__range-input:focus{outline:none}.mfui-slider-range__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-range__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-range__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-range__range-track{background-color:var(--spbSky0);border-radius:100px;cursor:pointer;height:100%;left:0;padding:0 12px;position:absolute;right:0;z-index:0}.mfui-slider-range__range-track-inner{height:100%;position:relative;width:100%}.mfui-slider-range__range-track-segment{background-color:var(--brandGreen);border-radius:100px;height:100%;position:absolute}.mfui-slider-range_disabled .mfui-slider-range__head{color:var(--spbSky3)}.mfui-slider-range_disabled .mfui-slider-range__range-track{cursor:default}.mfui-slider-range_disabled .mfui-slider-range__range-input{background-image:-webkit-gradient(linear,left top,left bottom,from(var(--spbSky1)),to(var(--spbSky1)));background-image:linear-gradient(var(--spbSky1),var(--spbSky1));cursor:default}.mfui-slider-range_disabled .mfui-slider-range__range-track-segment{background-color:var(--spbSky1)}.mfui-slider-range_disabled .mfui-slider-range__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);-webkit-box-shadow:none;box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-range_disabled .mfui-slider-range__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-range_disabled .mfui-slider-range__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}

package/dist/es/components/Sliders/SliderRange/SliderRange.d.ts

@@ -1,47 +0,0 @@
-import * as React from 'react';
-import './SliderRange.scss';
-export interface ISliderRange {
-    /** Дополнительный класс корневого элемента */
-    className?: string;
-    /** Текущее значение ползунка слева */
-    leftValue?: number;
-    /** Текущее значение ползунка справа */
-    rightValue?: number;
-    /** Минимальное значение */
-    minValue: number;
-    /** Максимальное значение */
-    maxValue: number;
-    /** Лейбл */
-    label?: string;
-    /** Тип выводимого значения */
-    displayValueType?: 'input' | 'line';
-    /** Префикс для выводимого значения слева */
-    displayLeftValuePrefix?: string;
-    /** Префикс для выводимого значения справа */
-    displayRightValuePrefix?: string;
-    /** Единица измерения выводимого значения */
-    displayValueUnit?: string;
-    /** Переводит компонент в контролируемое состояние */
-    isControlled?: boolean;
-    /** Шаг */
-    step?: number;
-    /** Тип встроенной шкалы */
-    scale?: 'interval' | 'base';
-    /** Кастомная шкала */
-    customScale?: string[];
-    /** Переводит компонент в выключенное состояние */
-    disabled?: boolean;
-    /** Дополнительные data атрибуты к внутренним элементам */
-    dataAttrs?: {
-        root?: Record<string, string>;
-        leftInput?: Record<string, string>;
-        rightInput?: Record<string, string>;
-        leftRangeInput?: Record<string, string>;
-        rightRangeInput?: Record<string, string>;
-        scale?: Record<string, string>;
-    };
-    /** Обработчик изменения значения */
-    onChange?: (leftValue: number, rightValue: number) => void;
-}
-declare const SliderRange: React.FC<ISliderRange>;
-export default SliderRange;

package/dist/es/components/Sliders/SliderRange/SliderRange.js

@@ -1,207 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import * as React from 'react';
-import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
-import ValueField from "../../ValueField/ValueField";
-import SliderScale from "../components/SliderScale/SliderScale";
-import { getRangeValue, removeFirstZeros } from "../helpers";
-import { getTrackSize, getRangeValueByPageX, checkForThumbAtEndOfTrack } from "./helpers";
-import "./SliderRange.css";
-var THUMB_SIZE = 24;
-var cn = cnCreate('mfui-slider-range');
-var SliderRange = function SliderRange(_ref) {
-  var className = _ref.className,
-    label = _ref.label,
-    displayValueType = _ref.displayValueType,
-    displayLeftValuePrefix = _ref.displayLeftValuePrefix,
-    displayRightValuePrefix = _ref.displayRightValuePrefix,
-    displayValueUnit = _ref.displayValueUnit,
-    outerLeftValue = _ref.leftValue,
-    outerRightValue = _ref.rightValue,
-    minValue = _ref.minValue,
-    maxValue = _ref.maxValue,
-    _ref$isControlled = _ref.isControlled,
-    isControlled = _ref$isControlled === void 0 ? false : _ref$isControlled,
-    _ref$step = _ref.step,
-    step = _ref$step === void 0 ? 1 : _ref$step,
-    scale = _ref.scale,
-    customScale = _ref.customScale,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    dataAttrs = _ref.dataAttrs,
-    onChange = _ref.onChange;
-  var outerLeftRangeValue = getRangeValue(outerLeftValue !== null && outerLeftValue !== void 0 ? outerLeftValue : minValue, minValue, maxValue, step);
-  var outerRightRangeValue = getRangeValue(outerRightValue !== null && outerRightValue !== void 0 ? outerRightValue : maxValue, minValue, maxValue, step);
-  var leftRangeInputRef = React.useRef(null);
-  var rightRangeInputRef = React.useRef(null);
-  var rangeTrackRef = React.useRef(null);
-  var rangeTrackInnerRef = React.useRef(null);
-  var _React$useState = React.useState(null),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    rawLeftInputValue = _React$useState2[0],
-    setRawLeftInputValue = _React$useState2[1];
-  var _React$useState3 = React.useState(null),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    rawRightInputValue = _React$useState4[0],
-    setRawRightInputValue = _React$useState4[1];
-  var _React$useState5 = React.useState(outerLeftRangeValue),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    innerLeftRangeValue = _React$useState6[0],
-    setInnerLeftRangeValue = _React$useState6[1];
-  var _React$useState7 = React.useState(outerRightRangeValue),
-    _React$useState8 = _slicedToArray(_React$useState7, 2),
-    innerRightRangeValue = _React$useState8[0],
-    setInnerRightRangeValue = _React$useState8[1];
-  var leftRangeValue = isControlled ? outerLeftRangeValue : innerLeftRangeValue;
-  var rightRangeValue = isControlled ? outerRightRangeValue : innerRightRangeValue;
-  var trackSize = getTrackSize(leftRangeValue, rightRangeValue, minValue, maxValue);
-  var isThumbAtEndOfTrack = checkForThumbAtEndOfTrack(leftRangeValue, minValue, maxValue, THUMB_SIZE);
-  var showHead = !!label || !!displayValueType;
-  var handleRangeTrackPointerUp = function handleRangeTrackPointerUp(e) {
-    if (!rangeTrackInnerRef.current || disabled) {
-      return;
-    }
-    var clickValue = getRangeValueByPageX(e.pageX, minValue, maxValue, rangeTrackInnerRef.current);
-    var newRangeValue = getRangeValue(clickValue, minValue, maxValue, step);
-    var leftHalfTrack = leftRangeValue + (rightRangeValue - leftRangeValue) / 2;
-    if (newRangeValue < leftHalfTrack) {
-      !isControlled && setInnerLeftRangeValue(newRangeValue);
-      onChange === null || onChange === void 0 ? void 0 : onChange(newRangeValue, rightRangeValue);
-    } else {
-      !isControlled && setInnerRightRangeValue(newRangeValue);
-      onChange === null || onChange === void 0 ? void 0 : onChange(leftRangeValue, newRangeValue);
-    }
-  };
-  var handleRangeTrackPointerLeave = React.useCallback(function () {
-    var _a, _b, _c;
-    (_a = leftRangeInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    (_b = rightRangeInputRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-    (_c = rangeTrackRef.current) === null || _c === void 0 ? void 0 : _c.removeEventListener('pointerleave', handleRangeTrackPointerLeave);
-  }, []);
-  var handleRangeTrackPointerDown = function handleRangeTrackPointerDown() {
-    var _a;
-    if (disabled) {
-      return;
-    }
-    (_a = rangeTrackRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('pointerleave', handleRangeTrackPointerLeave);
-  };
-  var handleLeftInputChange = function handleLeftInputChange(isRange) {
-    return function (e) {
-      var targetValue = removeFirstZeros(e.target.value);
-      var newRangeValue = getRangeValue(targetValue, minValue, rightRangeValue, step);
-      !isControlled && setInnerLeftRangeValue(newRangeValue);
-      !isRange && setRawLeftInputValue(targetValue);
-      onChange === null || onChange === void 0 ? void 0 : onChange(newRangeValue, rightRangeValue);
-    };
-  };
-  var handleRightInputChange = function handleRightInputChange(isRange) {
-    return function (e) {
-      var targetValue = removeFirstZeros(e.target.value);
-      var newRangeValue = getRangeValue(targetValue, leftRangeValue, maxValue, step);
-      !isControlled && setInnerRightRangeValue(newRangeValue);
-      !isRange && setRawRightInputValue(targetValue);
-      onChange === null || onChange === void 0 ? void 0 : onChange(leftRangeValue, newRangeValue);
-    };
-  };
-  var handleInputBlur = function handleInputBlur(isLeft) {
-    return function () {
-      if (isLeft) {
-        setRawLeftInputValue(null);
-      } else {
-        setRawRightInputValue(null);
-      }
-    };
-  };
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: cn({
-      disabled: disabled
-    }, [className])
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
-    style: {
-      '--thumbSize': "".concat(THUMB_SIZE, "px")
-    }
-  }), showHead && /*#__PURE__*/React.createElement("div", {
-    className: cn('head')
-  }, !!label && /*#__PURE__*/React.createElement("div", {
-    className: cn('label')
-  }, label), !!displayValueType && /*#__PURE__*/React.createElement("div", {
-    className: cn('display-values')
-  }, /*#__PURE__*/React.createElement(ValueField, {
-    isControlled: true,
-    position: "left",
-    value: rawLeftInputValue !== null && rawLeftInputValue !== void 0 ? rawLeftInputValue : leftRangeValue,
-    fieldType: displayValueType,
-    valuePrefix: displayLeftValuePrefix,
-    valueUnit: displayValueUnit,
-    disabled: disabled,
-    onChange: handleLeftInputChange(false),
-    onBlur: handleInputBlur(true),
-    dataAttrs: {
-      input: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.leftInput
-    }
-  }), /*#__PURE__*/React.createElement(ValueField, {
-    isControlled: true,
-    position: "right",
-    value: rawRightInputValue !== null && rawRightInputValue !== void 0 ? rawRightInputValue : rightRangeValue,
-    fieldType: displayValueType,
-    valuePrefix: displayRightValuePrefix,
-    valueUnit: displayValueUnit,
-    disabled: disabled,
-    onChange: handleRightInputChange(false),
-    onBlur: handleInputBlur(false),
-    dataAttrs: {
-      input: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.rightInput
-    }
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: cn('range-container')
-  }, /*#__PURE__*/React.createElement("input", _extends({
-    className: cn('range-input', {
-      left: true,
-      over: isThumbAtEndOfTrack
-    }),
-    type: "range",
-    value: leftRangeValue,
-    min: minValue,
-    max: maxValue,
-    onChange: handleLeftInputChange(true),
-    disabled: disabled
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.leftRangeInput), {
-    ref: leftRangeInputRef
-  })), /*#__PURE__*/React.createElement("input", _extends({
-    className: cn('range-input', {
-      right: true
-    }),
-    type: "range",
-    value: rightRangeValue,
-    min: minValue,
-    max: maxValue,
-    onChange: handleRightInputChange(true),
-    disabled: disabled
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.rightRangeInput), {
-    ref: rightRangeInputRef
-  })), /*#__PURE__*/React.createElement("div", {
-    className: cn('range-track'),
-    onPointerUp: handleRangeTrackPointerUp,
-    onPointerDown: handleRangeTrackPointerDown,
-    ref: rangeTrackRef
-  }, /*#__PURE__*/React.createElement("div", {
-    className: cn('range-track-inner'),
-    ref: rangeTrackInnerRef
-  }, /*#__PURE__*/React.createElement("div", {
-    className: cn('range-track-segment'),
-    style: {
-      left: "".concat(trackSize.left, "%"),
-      right: "".concat(trackSize.right, "%")
-    }
-  })))), (!!scale || !!customScale) && /*#__PURE__*/React.createElement(SliderScale, {
-    minValue: minValue,
-    maxValue: maxValue,
-    scale: scale,
-    customScale: customScale,
-    disabled: disabled,
-    dataAttrs: {
-      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.scale
-    }
-  }));
-};
-export default SliderRange;

package/dist/es/components/Sliders/SliderRange/helpers.d.ts

@@ -1,6 +0,0 @@
-export declare const getTrackSize: (vleftValue: number | undefined, rightValue: number | undefined, minValue: number, maxValue: number) => {
-    left: number;
-    right: number;
-};
-export declare const getRangeValueByPageX: (pageX: number, minValue: number, maxValue: number, trackInnerNode: HTMLDivElement) => number;
-export declare const checkForThumbAtEndOfTrack: (leftRangeValue: number, minValue: number, maxValue: number, thumbSize: number) => boolean;

package/dist/es/components/Sliders/SliderRange/helpers.js

@@ -1,29 +0,0 @@
-import "core-js/modules/es.number.constructor.js";
-import "core-js/modules/es.number.to-fixed.js";
-export var getTrackSize = function getTrackSize() {
-  var vleftValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-  var rightValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-  var minValue = arguments.length > 2 ? arguments[2] : undefined;
-  var maxValue = arguments.length > 3 ? arguments[3] : undefined;
-  var valueDifference = maxValue - minValue;
-  if (valueDifference <= 0) {
-    return {
-      left: 0,
-      right: 0
-    };
-  }
-  var leftPercent = (vleftValue - minValue) * 100 / valueDifference;
-  var rightPercent = (maxValue - rightValue) * 100 / valueDifference;
-  return {
-    left: Number(leftPercent.toFixed(3)),
-    right: Number(rightPercent.toFixed(3))
-  };
-};
-export var getRangeValueByPageX = function getRangeValueByPageX(pageX, minValue, maxValue, trackInnerNode) {
-  var clickPosition = pageX - trackInnerNode.getBoundingClientRect().left;
-  var clickPositionPercent = clickPosition * 100 / trackInnerNode.offsetWidth;
-  return (maxValue - minValue) * clickPositionPercent / 100 + minValue;
-};
-export var checkForThumbAtEndOfTrack = function checkForThumbAtEndOfTrack(leftRangeValue, minValue, maxValue, thumbSize) {
-  return leftRangeValue > maxValue - thumbSize * (maxValue - minValue) / 100;
-};

package/dist/es/components/Sliders/SliderRatio/SliderRatio.css

@@ -1 +0,0 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-slider-ratio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-slider-ratio__head{font-size:15px;font-weight:500;line-height:24px;margin-bottom:8px}.mfui-slider-ratio__display-values{display:grid;grid-template-columns:45% 45%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-top:8px;width:100%}.mfui-slider-ratio__range-container{position:relative;width:100%}.mfui-slider-ratio__range-input{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--brandPurple);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--brandGreen)),to(var(--brandGreen)));background-image:linear-gradient(var(--brandGreen),var(--brandGreen));background-repeat:no-repeat;border-radius:100px;cursor:pointer;display:block;height:12px;margin:6px 0;outline:none;pointer-events:none;position:relative;width:100%;z-index:1}.mfui-slider-ratio__range-input:focus{outline:none}.mfui-slider-ratio__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(img/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(img/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(img/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-webkit-slider-runnable-track{-webkit-appearance:none;background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.mfui-slider-ratio__range-input::-moz-range-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider-ratio__range-input::-ms-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider-ratio__range-track{cursor:pointer;height:100%;position:absolute;top:0;width:100%;z-index:0}.mfui-slider-ratio__scale{bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;left:calc(var(--thumbSize)/2);position:absolute;right:calc(var(--thumbSize)/2);top:0;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;pointer-events:none}.mfui-slider-ratio__scale-item{background-color:var(--stcWhite);border-radius:50%;height:4px;width:4px}.mfui-slider-ratio__scale-item:first-child{margin-left:-2px}.mfui-slider-ratio__scale-item:last-child{margin-right:-2px}.mfui-slider-ratio_disabled .mfui-slider-ratio__head{color:var(--spbSky3)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input{background-color:var(--spbSky1);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--spbSky0)),to(var(--spbSky0)));background-image:linear-gradient(var(--spbSky0),var(--spbSky0));cursor:default}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(img/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);-webkit-box-shadow:none;box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(img/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(img/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-track{cursor:default}.mfui-slider-ratio_disabled .mfui-slider-ratio__scale{display:none}

package/dist/es/components/Sliders/SliderRatio/SliderRatio.d.ts

@@ -1,41 +0,0 @@
-import * as React from 'react';
-import { ValueType } from './types';
-import './SliderRatio.scss';
-export interface ISliderRatio {
-    /** Дополнительный класс корневого элемента */
-    className?: string;
-    /** Список значений */
-    values: ValueType[];
-    /** Индекс текущего значения */
-    index?: number;
-    /** Лейбл */
-    label?: string;
-    /** Тип выводимого значения */
-    displayValueType?: 'input' | 'line';
-    /** Префикс для выводимого значения слева */
-    displayLeftValuePrefix?: string;
-    /** Префикс для выводимого значения справа */
-    displayRightValuePrefix?: string;
-    /** Единица измерения выводимого значения слева */
-    displayLeftValueUnit?: string;
-    /** Единица измерения выводимого значения справа */
-    displayRightValueUnit?: string;
-    /** Переводит компонент в контролируемое состояние */
-    isControlled?: boolean;
-    /** Переводит компонент в выключенное состояние */
-    disabled?: boolean;
-    /** Включает отображение шкалы */
-    showScale?: boolean;
-    /** Дополнительные data атрибуты к внутренним элементам */
-    dataAttrs?: {
-        root?: Record<string, string>;
-        leftInput?: Record<string, string>;
-        rightInput?: Record<string, string>;
-        rangeInput?: Record<string, string>;
-        scale?: Record<string, string>;
-    };
-    /** Обработчик изменения значения */
-    onChange?: (index: number) => void;
-}
-declare const SliderRatio: React.FC<ISliderRatio>;
-export default SliderRatio;