@megafon/ui-core 5.7.1 → 5.9.0

package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css

@@ -0,0 +1,83 @@
+.mfui-slider-display-value {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  max-width: 45%;
+  color: var(--content);
+  font-weight: 400;
+  background-color: var(--base);
+}
+.mfui-slider-display-value_interactive {
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  min-width: 90px;
+  padding: 7px 16px;
+  border: 1px solid var(--spbSky2);
+  border-radius: 12px;
+  overflow: hidden;
+  cursor: text;
+}
+.mfui-slider-display-value_interactive.mfui-slider-display-value:hover,
+.mfui-slider-display-value_interactive.mfui-slider-display-value_focus {
+  border-color: var(--content);
+}
+.mfui-slider-display-value_disabled {
+  border-color: var(--spbSky0);
+  color: var(--spbSky3);
+  background-color: var(--spbSky0);
+  cursor: default;
+}
+.mfui-slider-display-value_disabled.mfui-slider-display-value_interactive:hover {
+  border-color: var(--spbSky0);
+}
+.mfui-slider-display-value__box {
+  overflow: hidden;
+}
+.mfui-slider-display-value__line {
+  font-weight: 500;
+}
+.mfui-slider-display-value__unit {
+  margin-left: 4px;
+}
+.mfui-slider-display-value_interactive .mfui-slider-display-value__line {
+  height: 0;
+  visibility: hidden;
+  opacity: 0;
+}
+.mfui-slider-display-value__prefix {
+  margin-right: 4px;
+  color: var(--spbSky3);
+}
+.mfui-slider-display-value__input {
+  display: block;
+  width: 10px;
+  min-width: 100%;
+  margin: 0;
+  padding: 0;
+  border: none;
+  border-radius: 0;
+  color: inherit;
+  font-weight: 400;
+  background-color: transparent;
+  outline: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+  cursor: text;
+  opacity: 1;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  caret-color: var(--brandGreen);
+  font-family: inherit;
+  font-size: 15px;
+  line-height: 24px;
+}
+.mfui-slider-display-value__input::-webkit-outer-spin-button,
+.mfui-slider-display-value__input::-webkit-inner-spin-button {
+  margin: 0;
+  -webkit-appearance: none;
+}
+.mfui-slider-display-value__input[type='number'] {
+  -moz-appearance: textfield;
+}

package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import './SliderDisplayValue.less';
+export declare const DisplayValue: {
+    readonly LINE: "line";
+    readonly INPUT: "input";
+};
+export declare type DisplayValueType = typeof DisplayValue[keyof typeof DisplayValue];
+export interface ISliderDisplayValue {
+    className?: string;
+    value: string | number;
+    displayValueType?: DisplayValueType;
+    displayValuePrefix?: string;
+    displayValueUnit?: string;
+    disabled?: boolean;
+    dataAttrs?: {
+        root?: Record<string, string>;
+        input?: Record<string, string>;
+    };
+    onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    onBlur: () => void;
+}
+declare const SliderDisplayValue: React.FC<ISliderDisplayValue>;
+export default SliderDisplayValue;

package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.js

@@ -0,0 +1,104 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.DisplayValue = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+require("core-js/modules/es.object.values.js");
+
+var React = _interopRequireWildcard(require("react"));
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var DisplayValue = {
+  LINE: 'line',
+  INPUT: 'input'
+};
+exports.DisplayValue = DisplayValue;
+var cn = (0, _uiHelpers.cnCreate)('mfui-slider-display-value');
+
+var SliderDisplayValue = function SliderDisplayValue(_ref) {
+  var className = _ref.className,
+      value = _ref.value,
+      displayValueType = _ref.displayValueType,
+      displayValuePrefix = _ref.displayValuePrefix,
+      displayValueUnit = _ref.displayValueUnit,
+      disabled = _ref.disabled,
+      dataAttrs = _ref.dataAttrs,
+      onChange = _ref.onChange,
+      onBlur = _ref.onBlur;
+
+  var _React$useState = React.useState(false),
+      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+      isFocused = _React$useState2[0],
+      setIsFocused = _React$useState2[1];
+
+  var isDisplayValueInput = displayValueType === DisplayValue.INPUT;
+
+  var handleInputBlur = function handleInputBlur() {
+    setIsFocused(false);
+    onBlur();
+  };
+
+  var handleInputFocus = function handleInputFocus() {
+    setIsFocused(true);
+  };
+
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/label-has-associated-control
+    React.createElement("label", (0, _extends2["default"])({
+      className: cn({
+        interactive: isDisplayValueInput,
+        focus: isFocused,
+        disabled: disabled
+      }, [className])
+    }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), !!displayValuePrefix && /*#__PURE__*/React.createElement("div", {
+      className: cn('prefix')
+    }, displayValuePrefix), /*#__PURE__*/React.createElement("div", {
+      className: cn('box')
+    }, isDisplayValueInput && /*#__PURE__*/React.createElement("input", (0, _extends2["default"])({
+      className: cn('input'),
+      type: "number",
+      value: value,
+      onChange: onChange,
+      onBlur: handleInputBlur,
+      onFocus: handleInputFocus,
+      disabled: disabled
+    }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input))), /*#__PURE__*/React.createElement("div", {
+      className: cn('line')
+    }, value)), !!displayValueUnit && /*#__PURE__*/React.createElement("div", {
+      className: cn('unit')
+    }, displayValueUnit))
+  );
+};
+
+SliderDisplayValue.propTypes = {
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+  displayValueType: PropTypes.oneOf(Object.values(DisplayValue)),
+  displayValueUnit: PropTypes.string,
+  disabled: PropTypes.bool,
+  onChange: PropTypes.func.isRequired,
+  onBlur: PropTypes.func.isRequired,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    input: PropTypes.objectOf(PropTypes.string.isRequired)
+  })
+};
+var _default = SliderDisplayValue;
+exports["default"] = _default;

package/dist/lib/components/Sliders/components/SliderScale/SliderScale.css

@@ -0,0 +1,15 @@
+.mfui-slider-scale {
+  font-size: 12px;
+  line-height: 18px;
+  position: relative;
+  height: 18px;
+  margin: 8px 12px 0 12px;
+}
+.mfui-slider-scale_disabled {
+  color: var(--spbSky3);
+}
+.mfui-slider-scale__item {
+  position: absolute;
+  translate: -50% 0;
+  white-space: nowrap;
+}

package/dist/lib/components/Sliders/components/SliderScale/SliderScale.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import './SliderScale.less';
+export declare const Scale: {
+    readonly BASE: "base";
+    readonly INTERVAL: "interval";
+};
+export declare type ScaleType = typeof Scale[keyof typeof Scale];
+export interface ISliderScale {
+    minValue: number;
+    maxValue: number;
+    scale?: ScaleType;
+    customScale?: string[];
+    disabled?: boolean;
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const SliderScale: React.FC<ISliderScale>;
+export default SliderScale;

package/dist/lib/components/Sliders/components/SliderScale/SliderScale.js

@@ -0,0 +1,74 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Scale = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.object.values.js");
+
+var React = _interopRequireWildcard(require("react"));
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+var _helpers = require("./helpers");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var Scale = {
+  BASE: 'base',
+  INTERVAL: 'interval'
+};
+exports.Scale = Scale;
+var cn = (0, _uiHelpers.cnCreate)('mfui-slider-scale');
+
+var SliderScale = function SliderScale(_ref) {
+  var minValue = _ref.minValue,
+      maxValue = _ref.maxValue,
+      _ref$scale = _ref.scale,
+      scale = _ref$scale === void 0 ? 'base' : _ref$scale,
+      customScale = _ref.customScale,
+      disabled = _ref.disabled,
+      dataAttrs = _ref.dataAttrs;
+  var builtInScale = scale === Scale.BASE ? [minValue, maxValue] : (0, _helpers.getIntervalScale)(minValue, maxValue);
+  var currentScale = customScale || builtInScale;
+  var leftOffset = 100 / (currentScale.length - 1);
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: cn({
+      disabled: disabled
+    })
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), currentScale.map(function (item, i) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('item'),
+      style: {
+        left: "calc(".concat(leftOffset * i, "%)")
+      },
+      key: i
+    }, item);
+  }));
+};
+
+SliderScale.propTypes = {
+  minValue: PropTypes.number.isRequired,
+  maxValue: PropTypes.number.isRequired,
+  scale: PropTypes.oneOf(Object.values(Scale)),
+  customScale: PropTypes.arrayOf(PropTypes.string.isRequired),
+  disabled: PropTypes.bool,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  })
+};
+var _default = SliderScale;
+exports["default"] = _default;

package/dist/lib/components/Sliders/components/SliderScale/helpers.d.ts

@@ -0,0 +1,2 @@
+export declare const getIntervalScale: (minValue: number, maxValue: number) => number[];
+export default getIntervalScale;

package/dist/lib/components/Sliders/components/SliderScale/helpers.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.getIntervalScale = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+require("core-js/modules/es.array.from.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.array.reduce.js");
+
+require("core-js/modules/es.array.concat.js");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var SCALE_MAX_LENGTH = 10;
+var SCALE_SEGMENT_COUNT = 9;
+var SCALE_WITHOUT_EDGE_LENGTH = SCALE_MAX_LENGTH - 2;
+
+var getIntervalScale = function getIntervalScale(minValue, maxValue) {
+  var valueDifference = maxValue - minValue;
+
+  if (valueDifference < SCALE_MAX_LENGTH) {
+    return Array.from({
+      length: valueDifference + 1
+    }, function (_, i) {
+      return minValue + i;
+    });
+  }
+
+  var interval = valueDifference / SCALE_SEGMENT_COUNT;
+  var midItems = Array.from(Array(SCALE_WITHOUT_EDGE_LENGTH).keys());
+
+  var _midItems$reduce = midItems.reduce(function (acc) {
+    return {
+      current: acc.current + interval,
+      items: [].concat((0, _toConsumableArray2["default"])(acc.items), [Math.round(acc.current + interval)])
+    };
+  }, {
+    current: minValue,
+    items: []
+  }),
+      items = _midItems$reduce.items;
+
+  return [minValue].concat((0, _toConsumableArray2["default"])(items), [maxValue]);
+};
+
+exports.getIntervalScale = getIntervalScale;
+var _default = getIntervalScale;
+exports["default"] = _default;

package/dist/lib/components/Sliders/helpers.d.ts

@@ -0,0 +1,2 @@
+export declare const getRangeValue: (value: string | number, minValue: number, maxValue: number, step: number) => number;
+export declare const getTrackSize: (value: number | undefined, minValue: number, maxValue: number) => number;

package/dist/lib/components/Sliders/helpers.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getTrackSize = exports.getRangeValue = void 0;
+
+require("core-js/modules/es.number.constructor.js");
+
+require("core-js/modules/es.number.to-fixed.js");
+
+var getRangeValue = function getRangeValue(value, minValue, maxValue, step) {
+  var numberValue = Number(value);
+
+  if (numberValue < minValue) {
+    return minValue;
+  }
+
+  if (numberValue > maxValue) {
+    return maxValue;
+  }
+
+  var valueDifference = maxValue - minValue;
+  var expectedStepCount = valueDifference / step;
+  var receivedStepCount = valueDifference / numberValue;
+  var stepPosition = Math.round(expectedStepCount / receivedStepCount);
+  return step * stepPosition;
+};
+
+exports.getRangeValue = getRangeValue;
+
+var getTrackSize = function getTrackSize() {
+  var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+  var minValue = arguments.length > 1 ? arguments[1] : undefined;
+  var maxValue = arguments.length > 2 ? arguments[2] : undefined;
+  var valueDifference = maxValue - minValue;
+
+  if (valueDifference <= 0) {
+    return 0;
+  }
+
+  var finalValue = value - minValue;
+  var percent = finalValue * 100 / valueDifference;
+  return Number(percent.toFixed(3));
+};
+
+exports.getTrackSize = getTrackSize;

package/dist/lib/components/Switcher/Switcher.css

@@ -145,3 +145,16 @@
 .mfui-switcher_disabled .mfui-switcher__content {
   color: var(--spbSky3);
 }
+.mfui-switcher_theme_on-gray .mfui-switcher__input:not(.mfui-switcher__input_checked),
+.mfui-switcher_theme_on-gray .mfui-switcher__input_disabled {
+  background-color: var(--spbSky2);
+}
+.mfui-switcher_theme_on-gray .mfui-switcher__input:not(.mfui-switcher__input_checked):not(.mfui-switcher__input_disabled):hover {
+  background-color: var(--spbSky3);
+}
+.mfui-switcher_theme_on-gray .mfui-switcher__input_disabled .mfui-switcher__pointer {
+  background-color: var(--spbSky3);
+}
+.mfui-switcher_theme_on-gray .mfui-switcher__timer-icon {
+  fill: var(--spbSky3);
+}

package/dist/lib/components/Switcher/Switcher.d.ts

@@ -12,11 +12,13 @@ export interface ISwitcherProps {
     };
     /** Дополнительный класс корневого элемента */
     className?: string;
+    /** Тема */
+    theme?: 'on-white' | 'on-gray';
     /** Управление состоянием вкл/выкл компонента */
     checked?: boolean;
     /** Состояние ожидание */
     waiting?: boolean;
-    /** сот */
+    /** Состояние отключения */
     disabled?: boolean;
     /** Состояние загрузки */
     showLoader?: boolean;

package/dist/lib/components/Switcher/Switcher.js

@@ -36,6 +36,8 @@ var cn = (0, _uiHelpers.cnCreate)('mfui-switcher');
 var Switcher = function Switcher(_ref) {
   var dataAttrs = _ref.dataAttrs,
       className = _ref.className,
+      _ref$theme = _ref.theme,
+      theme = _ref$theme === void 0 ? 'on-white' : _ref$theme,
       _ref$checked = _ref.checked,
       checked = _ref$checked === void 0 ? false : _ref$checked,
       _ref$disabled = _ref.disabled,
@@ -65,7 +67,8 @@ var Switcher = function Switcher(_ref) {
   }, [isInteractiveDisabled, onChange]);
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn({
-      disabled: disabled
+      disabled: disabled,
+      theme: theme
     }, className)
   }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), isLeftContent && /*#__PURE__*/React.createElement("div", {
     className: cn('content', {
@@ -106,6 +109,7 @@ Switcher.propTypes = {
   className: PropTypes.string,
   textSize: PropTypes.oneOf(['small', 'medium']),
   textPosition: PropTypes.oneOf(['left', 'right']),
+  theme: PropTypes.oneOf(['on-white', 'on-gray']),
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   waiting: PropTypes.bool,

package/dist/lib/components/Tabs/Tabs.css

@@ -80,12 +80,20 @@
   left: auto;
   z-index: 0;
   border-radius: 8px;
-  background-color: var(--stcWhite);
+  overflow: hidden;
+  background-color: var(--base);
   -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
           box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
   -webkit-transition-duration: 0.3s;
           transition-duration: 0.3s;
 }
+.mfui-tabs__underline:before {
+  content: '';
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  background-color: var(--stcWhite20);
+}
 .mfui-tabs__arrow {
   position: absolute;
   top: 50%;
@@ -178,9 +186,9 @@
   padding-left: 8px;
 }
 .mfui-tabs__tab-inner_current {
-  color: var(--stcBlack);
+  color: var(--content);
   cursor: auto;
-  fill: var(--stcBlack);
+  fill: var(--content);
 }
 .mfui-tabs__tab-icon {
   width: 32px;

package/dist/lib/components/TextField/i/textarea-resizer.svg

@@ -0,0 +1 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg"><path d="M1 11L11 1M7 11l4-4"/></svg>

package/dist/lib/index.d.ts

@@ -7,9 +7,12 @@ export { default as Caption } from './components/Caption/Caption';
 export { default as Carousel } from './components/Carousel/Carousel';
 export { default as Checkbox } from './components/Checkbox/Checkbox';
 export { default as checkBreakpointsPropTypes } from './components/Carousel/checkBreakpointsPropTypes';
-export { default as Chip } from './components/Chip/Chip';
+export { default as Chip } from './components/Chips/Chip';
+export { default as Chips } from './components/Chips/Chips';
+export { default as ChipsDropdown } from './components/Chips/components/ChipsDropdown';
 export { default as Collapse } from './components/Collapse/Collapse';
 export { default as ContentArea } from './components/ContentArea/ContentArea';
+export { default as ContentView } from './components/ContentView/ContentView';
 export { default as Counter } from './components/Counter/Counter';
 export { default as CounterBadge } from './components/Badges/components/CounterBadge/CounterBadge';
 export { default as countGraphemes } from './components/TextField/utils/countGraphemes';
@@ -17,7 +20,6 @@ export { default as Day } from './components/Calendar/components/Day/Day';
 export { default as Grid } from './components/Grid/Grid';
 export { default as GridColumn } from './components/Grid/GridColumn';
 export { default as Header } from './components/Header/Header';
-export { default as helpers } from './components/Pagination/helpers';
 export { default as Link } from './components/Link/Link';
 export { default as List } from './components/List/List';
 export { default as ListItem } from './components/List/ListItem';
@@ -38,6 +40,11 @@ export { default as Search } from './components/Search/Search';
 export { default as Select } from './components/Select/Select';
 export { default as Selector } from './components/Selector/Selector';
 export { default as selectReducer } from './components/Select/reducer/selectReducer';
+export { default as Slider } from './components/Sliders/Slider/Slider';
+export { default as SliderDisplayValue } from './components/Sliders/components/SliderDisplayValue/SliderDisplayValue';
+export { default as SliderRange } from './components/Sliders/SliderRange/SliderRange';
+export { default as SliderRatio } from './components/Sliders/SliderRatio/SliderRatio';
+export { default as SliderScale } from './components/Sliders/components/SliderScale/SliderScale';
 export { default as Snackbar } from './components/Snackbar/Snackbar';
 export { default as SnackbarTimer } from './components/Snackbar/SnackbarTimer/SnackbarTimer';
 export { default as Switcher } from './components/Switcher/Switcher';