@megafon/ui-core 5.18.1 → 6.0.0-beta.2

package/dist/lib/components/Carousel/useGradient.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties } from 'react';
 import SwiperCore from 'swiper';
 import { SlidesSettingsType } from './Carousel';
-declare type SwiperConfig = {
+type SwiperConfig = {
     instance: SwiperCore | undefined;
     slidesSettings: SlidesSettingsType;
     isLocked: boolean;

package/dist/lib/components/Carousel/useGradient.js

@@ -4,45 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = require("react");
-
 var _uiHelpers = require("@megafon/ui-helpers");
-
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
-
 var _throttleTime = _interopRequireDefault(require("../../constants/throttleTime"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var _default = function _default(gradient, swiper) {
+var _default = exports["default"] = function _default(gradient, swiper) {
   var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      slidesGap = _useState2[0],
-      setSlidesGap = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    slidesGap = _useState2[0],
+    setSlidesGap = _useState2[1];
   var swiperInstance = swiper.instance,
-      slidesSettings = swiper.slidesSettings,
-      isLocked = swiper.isLocked;
+    slidesSettings = swiper.slidesSettings,
+    isLocked = swiper.isLocked;
   var isGradientEnable = gradient && !isLocked;
   (0, _react.useEffect)(function () {
     var isTouch = window.innerWidth < _uiHelpers.breakpoints.DESKTOP_SMALL_START;
     var isPossibleToSetGap = isGradientEnable && swiperInstance && !isTouch;
-
     if (!isPossibleToSetGap) {
       return undefined;
     }
-
-    var setCurrenSlidesGap = function setCurrenSlidesGap() {
-      var currentBreakpoint = swiperInstance.getBreakpoint(slidesSettings);
+    var setCurrentSlidesGap = function setCurrentSlidesGap() {
+      var currentBreakpoint = swiperInstance.currentBreakpoint;
       var currentSpaceBetweenValue = slidesSettings[currentBreakpoint].spaceBetween;
       setSlidesGap(currentSpaceBetweenValue);
     };
-
-    setCurrenSlidesGap();
-    var throttledHandler = (0, _lodash["default"])(setCurrenSlidesGap, _throttleTime["default"].resize);
+    setCurrentSlidesGap();
+    var throttledHandler = (0, _lodash["default"])(setCurrentSlidesGap, _throttleTime["default"].resize);
     window.addEventListener('resize', throttledHandler);
     return function () {
       window.removeEventListener('resize', throttledHandler);
@@ -52,6 +41,4 @@ var _default = function _default(gradient, swiper) {
     '--gap': "".concat(slidesGap, "px")
   };
   return isGradientEnable ? gradientStyles : {};
-};
-
-exports["default"] = _default;
+};

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

@@ -1,5 +1,5 @@
-import React from 'react';
-import './Checkbox.less';
+import * as React from 'react';
+import './Checkbox.scss';
 export interface ICheckboxProps {
     /** Цвет чекбокса */
     color?: 'dark' | 'light';
@@ -31,8 +31,8 @@ export interface ICheckboxProps {
     /** Отобразить компонент в состоянии ошибки */
     error?: boolean;
     /** Дополнительный контент справа */
-    extraContent?: JSX.Element[] | Element[] | JSX.Element | Element | string;
-    children: JSX.Element[] | Element[] | JSX.Element | Element | string;
+    extraContent?: JSX.Element[] | Element[] | JSX.Element | Element | string | React.ReactNode;
+    children: JSX.Element[] | Element[] | JSX.Element | Element | string | React.ReactNode;
     /** Обработчик изменения значения */
     onChange?: (checked: boolean) => void;
 }

package/dist/lib/components/Checkbox/Checkbox.js

@@ -1,77 +1,59 @@
 "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); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 require("core-js/modules/es.function.name.js");
-
-var _react = _interopRequireWildcard(require("react"));
-
+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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 var CheckedIcon = function CheckedIcon(props) {
-  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
+  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 20 20"
-  }, props), /*#__PURE__*/_react["default"].createElement("path", {
+  }, props), /*#__PURE__*/React.createElement("path", {
     d: "M8.832 11.547L6.619 9.335l-1.414 1.413 2.462 2.462 1.445 1.446 5.932-8.486-1.638-1.148-4.574 6.525z"
   }));
 };
-
 var CHANGE_KEY = 'change';
 var cn = (0, _uiHelpers.cnCreate)('mfui-checkbox');
-
 var Checkbox = function Checkbox(_ref) {
   var className = _ref.className,
-      _ref$fontSize = _ref.fontSize,
-      fontSize = _ref$fontSize === void 0 ? 'regular' : _ref$fontSize,
-      name = _ref.name,
-      _ref$color = _ref.color,
-      color = _ref$color === void 0 ? 'dark' : _ref$color,
-      value = _ref.value,
-      _ref$checked = _ref.checked,
-      checked = _ref$checked === void 0 ? false : _ref$checked,
-      disabled = _ref.disabled,
-      error = _ref.error,
-      children = _ref.children,
-      extraContent = _ref.extraContent,
-      dataAttrs = _ref.dataAttrs,
-      classes = _ref.classes,
-      onChange = _ref.onChange;
+    _ref$fontSize = _ref.fontSize,
+    fontSize = _ref$fontSize === void 0 ? 'regular' : _ref$fontSize,
+    name = _ref.name,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'dark' : _ref$color,
+    value = _ref.value,
+    _ref$checked = _ref.checked,
+    checked = _ref$checked === void 0 ? false : _ref$checked,
+    disabled = _ref.disabled,
+    error = _ref.error,
+    children = _ref.children,
+    extraContent = _ref.extraContent,
+    dataAttrs = _ref.dataAttrs,
+    classes = _ref.classes,
+    onChange = _ref.onChange;
   var isTouch = (0, _uiHelpers.detectTouch)();
-
-  var _useState = (0, _react.useState)(checked),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      isChecked = _useState2[0],
-      setIsChecked = _useState2[1];
-
-  (0, _react.useEffect)(function () {
+  var _React$useState = React.useState(checked),
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    isChecked = _React$useState2[0],
+    setIsChecked = _React$useState2[1];
+  React.useEffect(function () {
     setIsChecked(checked);
   }, [checked]);
-
   var handleChange = function handleChange(e) {
     if ((0, _uiHelpers.checkEventIsClickOrEnterPress)(e) || e.type === CHANGE_KEY) {
       setIsChecked(!isChecked);
       onChange === null || onChange === void 0 ? void 0 : onChange(!isChecked);
     }
   };
-
-  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn('', {
       'font-size': fontSize,
       color: color,
@@ -79,13 +61,13 @@ var Checkbox = function Checkbox(_ref) {
       disabled: disabled,
       error: error
     }, className)
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn('inner', [classes === null || classes === void 0 ? void 0 : classes.inner])
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner)), /*#__PURE__*/_react["default"].createElement("label", {
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner)), /*#__PURE__*/React.createElement("label", {
     className: cn('label', {
       'no-touch': !isTouch
     })
-  }, /*#__PURE__*/_react["default"].createElement("input", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
+  }, /*#__PURE__*/React.createElement("input", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
     className: cn('input'),
     type: "checkbox",
     tabIndex: -1,
@@ -94,38 +76,16 @@ var Checkbox = function Checkbox(_ref) {
     checked: isChecked,
     onChange: handleChange,
     disabled: disabled
-  })), /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.customInput), {
+  })), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.customInput), {
     tabIndex: 0,
     role: "checkbox",
     "aria-checked": isChecked,
     className: cn('custom-input', [classes === null || classes === void 0 ? void 0 : classes.icon]),
     onKeyDown: handleChange
-  }), /*#__PURE__*/_react["default"].createElement(CheckedIcon, {
+  }), /*#__PURE__*/React.createElement(CheckedIcon, {
     className: cn('icon')
-  })), children), extraContent && /*#__PURE__*/_react["default"].createElement("span", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.extraContent), {
+  })), children), extraContent && /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.extraContent), {
     className: cn('extra-content')
   }), extraContent)));
 };
-
-Checkbox.propTypes = {
-  className: PropTypes.string,
-  fontSize: PropTypes.oneOf(['regular', 'small']),
-  color: PropTypes.oneOf(['dark', 'light']),
-  name: PropTypes.string,
-  value: PropTypes.string,
-  checked: PropTypes.bool,
-  disabled: PropTypes.bool,
-  error: PropTypes.bool,
-  dataAttrs: PropTypes.shape({
-    root: PropTypes.objectOf(PropTypes.string.isRequired),
-    inner: PropTypes.objectOf(PropTypes.string.isRequired),
-    input: PropTypes.objectOf(PropTypes.string.isRequired),
-    customInput: PropTypes.objectOf(PropTypes.string.isRequired),
-    extraContent: PropTypes.objectOf(PropTypes.string.isRequired)
-  }),
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element, PropTypes.string]).isRequired,
-  extraContent: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element, PropTypes.string]),
-  onChange: PropTypes.func
-};
-var _default = Checkbox;
-exports["default"] = _default;
+var _default = exports["default"] = Checkbox;

package/dist/lib/components/Chips/Chip.d.ts

@@ -1,17 +1,16 @@
-import React, { Ref } from 'react';
-import * as PropTypes from 'prop-types';
-import './Chip.less';
-export declare type ChipIdType = number | string;
+import * as React from 'react';
+import './Chip.scss';
+export type ChipIdType = number | string;
 export declare const ChipColors: {
     readonly DEFAULT: "default";
     readonly BLACK: "black";
 };
-export declare type ChipColorsType = typeof ChipColors[keyof typeof ChipColors];
+export type ChipColorsType = (typeof ChipColors)[keyof typeof ChipColors];
 export declare const ChipArrow: {
     readonly UP: "up";
     readonly DOWN: "down";
 };
-export declare type ChipArrowType = typeof ChipArrow[keyof typeof ChipArrow];
+export type ChipArrowType = (typeof ChipArrow)[keyof typeof ChipArrow];
 export interface IChipProps {
     /** Идентификатор */
     id: ChipIdType;
@@ -49,26 +48,7 @@ export interface IChipProps {
         arrow?: Record<string, string>;
     };
     /** Ссылка на элемент */
-    rootRef?: Ref<HTMLButtonElement>;
+    rootRef?: React.Ref<HTMLButtonElement>;
 }
 declare const Chip: React.FC<IChipProps>;
-export declare const ChipPropType: {
-    id: PropTypes.Validator<string | number>;
-    color: PropTypes.Requireable<"default" | "black">;
-    checked: PropTypes.Requireable<boolean>;
-    disabled: PropTypes.Requireable<boolean>;
-    icon: PropTypes.Requireable<PropTypes.ReactElementLike>;
-    counterValue: PropTypes.Requireable<number>;
-    arrow: PropTypes.Requireable<"down" | "up">;
-    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-    children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    className: PropTypes.Requireable<string>;
-    classes: PropTypes.Requireable<{
-        [x: string]: string | null | undefined;
-    }>;
-    dataAttrs: PropTypes.Requireable<{
-        [x: string]: object | null | undefined;
-    }>;
-    rootRef: PropTypes.Requireable<any>;
-};
 export default Chip;

package/dist/lib/components/Chips/Chip.js

@@ -1,84 +1,65 @@
 "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); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.ChipPropType = exports.ChipArrow = exports.ChipColors = void 0;
-
+exports["default"] = exports.ChipColors = exports.ChipArrow = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-require("core-js/modules/es.object.values.js");
-
-var _react = _interopRequireDefault(require("react"));
-
+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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 var ArrowDown = function ArrowDown(props) {
-  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
+  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 20 20"
-  }, props), /*#__PURE__*/_react["default"].createElement("path", {
+  }, props), /*#__PURE__*/React.createElement("path", {
     d: "M6 8h8l-4 5z",
     fillRule: "evenodd",
     clipRule: "evenodd"
   }));
 };
-
 var ArrowUp = function ArrowUp(props) {
-  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
+  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 20 20"
-  }, props), /*#__PURE__*/_react["default"].createElement("path", {
+  }, props), /*#__PURE__*/React.createElement("path", {
     d: "M14 12H6l4-5z",
     fillRule: "evenodd",
     clipRule: "evenodd"
   }));
 };
-
-var ChipColors = {
+var ChipColors = exports.ChipColors = {
   DEFAULT: 'default',
   BLACK: 'black'
 };
-exports.ChipColors = ChipColors;
-var ChipArrow = {
+var ChipArrow = exports.ChipArrow = {
   UP: 'up',
   DOWN: 'down'
 };
-exports.ChipArrow = ChipArrow;
 var cn = (0, _uiHelpers.cnCreate)('mfui-chip');
-
 var Chip = function Chip(_ref) {
   var id = _ref.id,
-      _ref$color = _ref.color,
-      color = _ref$color === void 0 ? 'default' : _ref$color,
-      _ref$checked = _ref.checked,
-      checked = _ref$checked === void 0 ? false : _ref$checked,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      icon = _ref.icon,
-      counterValue = _ref.counterValue,
-      arrow = _ref.arrow,
-      onClick = _ref.onClick,
-      children = _ref.children,
-      className = _ref.className,
-      _ref$classes = _ref.classes,
-      classes = _ref$classes === void 0 ? {} : _ref$classes,
-      dataAttrs = _ref.dataAttrs,
-      rootRef = _ref.rootRef;
-
-  var handleClick = _react["default"].useCallback(function (e) {
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'default' : _ref$color,
+    _ref$checked = _ref.checked,
+    checked = _ref$checked === void 0 ? false : _ref$checked,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    icon = _ref.icon,
+    counterValue = _ref.counterValue,
+    arrow = _ref.arrow,
+    onClick = _ref.onClick,
+    children = _ref.children,
+    className = _ref.className,
+    _ref$classes = _ref.classes,
+    classes = _ref$classes === void 0 ? {} : _ref$classes,
+    dataAttrs = _ref.dataAttrs,
+    rootRef = _ref.rootRef;
+  var handleClick = React.useCallback(function (e) {
     onClick === null || onClick === void 0 ? void 0 : onClick(e, id);
   }, [onClick, id]);
-
-  return /*#__PURE__*/_react["default"].createElement("button", (0, _extends2["default"])({
+  return /*#__PURE__*/React.createElement("button", (0, _extends2["default"])({
     type: "button",
     className: cn({
       color: color,
@@ -90,35 +71,14 @@ var Chip = function Chip(_ref) {
     disabled: disabled,
     onClick: handleClick,
     ref: rootRef
-  }), !!icon && /*#__PURE__*/_react["default"].createElement("span", (0, _extends2["default"])({
+  }), !!icon && /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({
     className: cn('icon', [classes.icon])
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.icon)), icon), /*#__PURE__*/_react["default"].createElement("span", (0, _extends2["default"])({
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.icon)), icon), /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({
     className: cn('inner', [classes.inner])
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner)), children), !!counterValue && /*#__PURE__*/_react["default"].createElement("span", (0, _extends2["default"])({
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner)), children), !!counterValue && /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({
     className: cn('counter', [classes.counter])
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.counter)), counterValue), !!arrow && /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.counter)), counterValue), !!arrow && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn('icon-arrow')
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow)), arrow === 'up' ? /*#__PURE__*/_react["default"].createElement(ArrowUp, null) : /*#__PURE__*/_react["default"].createElement(ArrowDown, null)));
-};
-
-var ChipPropType = {
-  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  color: PropTypes.oneOf(Object.values(ChipColors)),
-  checked: PropTypes.bool,
-  disabled: PropTypes.bool,
-  icon: PropTypes.element,
-  counterValue: PropTypes.number,
-  arrow: PropTypes.oneOf(Object.values(ChipArrow)),
-  onClick: PropTypes.func,
-  children: PropTypes.node,
-  className: PropTypes.string,
-  classes: PropTypes.objectOf(PropTypes.string),
-  dataAttrs: PropTypes.objectOf(PropTypes.object),
-  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
-    current: PropTypes.elementType
-  }), PropTypes.any])])
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow)), arrow === 'up' ? /*#__PURE__*/React.createElement(ArrowUp, null) : /*#__PURE__*/React.createElement(ArrowDown, null)));
 };
-exports.ChipPropType = ChipPropType;
-Chip.propTypes = ChipPropType;
-var _default = Chip;
-exports["default"] = _default;
+var _default = exports["default"] = Chip;

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

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 import { ChipColorsType, ChipIdType, IChipProps } from './Chip';
-import './Chips.less';
+import './Chips.scss';
 export interface IChipsProps {
     /** Массив элементов */
     items: IChipProps[];