@megafon/ui-core 6.0.0-beta.4 → 6.0.1

package/dist/lib/components/RadioButton/RadioButton.js

@@ -1,50 +1,70 @@
 "use strict";
 
-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); }
+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"] = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-require("core-js/modules/es.array.concat.js");
-require("core-js/modules/es.array.is-array.js");
+
 require("core-js/modules/es.function.name.js");
+
+require("core-js/modules/es.array.is-array.js");
+
+require("core-js/modules/es.array.concat.js");
+
 var React = _interopRequireWildcard(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
-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; }
+
+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 cn = (0, _uiHelpers.cnCreate)('mfui-radio-button');
+
 var RadioButton = function RadioButton(_ref) {
+  var _cn;
+
   var _ref$color = _ref.color,
-    color = _ref$color === void 0 ? 'dark' : _ref$color,
-    isChecked = _ref.isChecked,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    name = _ref.name,
-    value = _ref.value,
-    _ref$textSize = _ref.textSize,
-    textSize = _ref$textSize === void 0 ? 'medium' : _ref$textSize,
-    children = _ref.children,
-    inputRef = _ref.inputRef,
-    className = _ref.className,
-    _ref$classes = _ref.classes,
-    classes = _ref$classes === void 0 ? {} : _ref$classes,
-    dataAttrs = _ref.dataAttrs,
-    onChange = _ref.onChange;
+      color = _ref$color === void 0 ? 'dark' : _ref$color,
+      isChecked = _ref.isChecked,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      name = _ref.name,
+      value = _ref.value,
+      _ref$textSize = _ref.textSize,
+      textSize = _ref$textSize === void 0 ? 'medium' : _ref$textSize,
+      children = _ref.children,
+      inputRef = _ref.inputRef,
+      className = _ref.className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
+      dataAttrs = _ref.dataAttrs,
+      onChange = _ref.onChange;
   var checkedProp = isChecked !== undefined ? {
     checked: isChecked
   } : {};
   var rootClassNames = Array.isArray(className) ? [].concat((0, _toConsumableArray2["default"])(className), [classes.root]) : [className, classes.root];
+
   var handleChange = function handleChange() {
     return onChange === null || onChange === void 0 ? void 0 : onChange(value);
   };
+
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn(rootClassNames)
   }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("label", {
-    className: cn('label', (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, color, true), "disabled", disabled), classes.label)
+    className: cn('label', (_cn = {}, (0, _defineProperty2["default"])(_cn, color, true), (0, _defineProperty2["default"])(_cn, "disabled", disabled), _cn), classes.label)
   }, /*#__PURE__*/React.createElement("input", (0, _extends2["default"])({}, checkedProp, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
     className: cn('input', (0, _defineProperty2["default"])({}, color, true)),
     type: "radio",
@@ -61,4 +81,31 @@ var RadioButton = function RadioButton(_ref) {
     }, classes.labelText)
   }), children)));
 };
-var _default = exports["default"] = RadioButton;
+
+RadioButton.propTypes = {
+  color: PropTypes.oneOf(['dark', 'light']),
+  value: PropTypes.string.isRequired,
+  name: PropTypes.string,
+  textSize: PropTypes.oneOf(['small', 'medium']),
+  disabled: PropTypes.bool,
+  isChecked: PropTypes.bool,
+  className: PropTypes.string,
+  classes: PropTypes.shape({
+    root: PropTypes.string,
+    label: PropTypes.string,
+    customInput: PropTypes.string,
+    labelText: PropTypes.string
+  }),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    input: PropTypes.objectOf(PropTypes.string.isRequired),
+    text: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  children: PropTypes.node,
+  onChange: PropTypes.func,
+  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
+    current: PropTypes.elementType
+  }), PropTypes.any])])
+};
+var _default = RadioButton;
+exports["default"] = _default;

package/dist/lib/components/Row/Row.css

@@ -1 +1,238 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-row{background-color:var(--base);border:none;border-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--content);display:inline-block;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:12px 16px;position:relative;text-decoration:none;-webkit-transition:background-color,color,-webkit-box-shadow;transition:background-color,color,-webkit-box-shadow;transition:background-color,color,box-shadow;transition:background-color,color,box-shadow,-webkit-box-shadow;-webkit-transition-duration:.3s;transition-duration:.3s;width:100%}@media screen and (min-width:768px){.mfui-row{padding:20px 24px}}@media screen and (min-width:1024px){.mfui-row{padding:24px 32px}}.mfui-row__icon-container,.mfui-row__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-row__icon-container{-ms-flex-negative:0;flex-shrink:0;-webkit-box-pack:center;-ms-flex-pack:center;height:40px;justify-content:center;margin-right:8px;width:40px}@media screen and (max-width:767px){.mfui-row__icon-container{margin-left:-4px}}@media screen and (min-width:768px){.mfui-row__icon-container{height:48px;margin-right:12px;width:48px}}@media screen and (min-width:1024px){.mfui-row__icon-container{height:56px;margin-right:16px;width:56px}}.mfui-row__icon-container svg{fill:var(--content)}.mfui-row__icon-container_colored{background-color:var(--brandGreen20);border-radius:50%}.mfui-row__icon-container_colored svg{fill:var(--brandGreen)}.mfui-row__icon,.mfui-row__icon svg{height:32px;min-width:32px;width:32px}@media screen and (min-width:1024px){.mfui-row__icon,.mfui-row__icon svg{height:40px;min-width:40px;width:40px}}.mfui-row__header{margin-right:auto;padding-right:12px}@media screen and (max-width:767px){.mfui-row__title{font-size:15px;font-weight:500;line-height:24px}}.mfui-row__sub-title{color:var(--spbSky3);font-size:12px;line-height:18px;margin-top:2px}@media screen and (min-width:768px){.mfui-row__sub-title:not(.mfui-row_size_small){font-size:15px;line-height:24px;margin-top:4px}}.mfui-row__arrow{height:32px;min-width:32px;width:32px;fill:var(--spbSky3)}@media screen and (min-width:768px){.mfui-row__arrow{margin-left:4px}}@media screen and (min-width:1024px){.mfui-row__arrow{margin-left:12px}}.mfui-row__children{font-size:15px;font-weight:500;line-height:24px}@media screen and (min-width:768px){.mfui-row__children{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px}}@media screen and (min-width:768px) and (min-width:1280px){.mfui-row__children{font-size:20px;line-height:28px}}.mfui-row_view_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-row_view_stroke{background-color:inherit;border:1px solid var(--spbSky2)}.mfui-row_pointer{cursor:pointer}.mfui-row_pointer.mfui-row_view_shadow:hover{-webkit-box-shadow:0 8px 28px rgba(0,0,0,.1);box-shadow:0 8px 28px rgba(0,0,0,.1)}.mfui-row_pointer.mfui-row_view_shadow:hover:after{background-color:var(--stcWhite10);border-radius:12px;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.mfui-row_pointer.mfui-row_view_stroke:hover{background-color:var(--spbSky0)}.mfui-row_has-arrow{padding-right:8px}@media screen and (min-width:768px){.mfui-row_has-arrow{padding-right:16px}}@media screen and (min-width:1024px){.mfui-row_has-arrow{padding-right:20px}.mfui-row_has-arrow.mfui-row_size_small{padding-right:16px}}@media screen and (min-width:768px){.mfui-row_size_small{padding:16px 24px 16px 20px}}@media screen and (min-width:1024px){.mfui-row_size_small{padding:20px 24px}.mfui-row_size_small .mfui-row__sub-title{font-size:15px;line-height:24px;margin-top:4px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-row_size_small .mfui-row__icon-container{height:40px;width:40px}.mfui-row_size_small .mfui-row__arrow{margin-right:-4px}}.mfui-row_size_small .mfui-row__children{font-size:15px;font-weight:500;line-height:24px}
+.mfui-row {
+  position: relative;
+  display: inline-block;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  height: -webkit-fit-content;
+  height: -moz-fit-content;
+  height: fit-content;
+  padding: 12px 16px;
+  border: none;
+  border-radius: 12px;
+  color: var(--content);
+  text-decoration: none;
+  background-color: var(--base);
+  -webkit-transition: background-color, color, -webkit-box-shadow;
+  transition: background-color, color, -webkit-box-shadow;
+  transition: background-color, color, box-shadow;
+  transition: background-color, color, box-shadow, -webkit-box-shadow;
+  -webkit-transition-duration: 0.3s;
+          transition-duration: 0.3s;
+}
+@media screen and (min-width: 768px) {
+  .mfui-row {
+    padding: 20px 24px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row {
+    padding: 24px 32px;
+  }
+}
+.mfui-row__wrapper {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.mfui-row__icon-container {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-negative: 0;
+      flex-shrink: 0;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 40px;
+  height: 40px;
+  margin-right: 8px;
+}
+@media screen and (max-width: 767px) {
+  .mfui-row__icon-container {
+    margin-left: -4px;
+  }
+}
+@media screen and (min-width: 768px) {
+  .mfui-row__icon-container {
+    width: 48px;
+    height: 48px;
+    margin-right: 12px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row__icon-container {
+    width: 56px;
+    height: 56px;
+    margin-right: 16px;
+  }
+}
+.mfui-row__icon-container svg {
+  fill: var(--content);
+}
+.mfui-row__icon-container_colored {
+  border-radius: 50%;
+  background-color: var(--brandGreen20);
+}
+.mfui-row__icon-container_colored svg {
+  fill: var(--brandGreen);
+}
+.mfui-row__icon,
+.mfui-row__icon svg {
+  width: 32px;
+  min-width: 32px;
+  height: 32px;
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row__icon,
+  .mfui-row__icon svg {
+    width: 40px;
+    min-width: 40px;
+    height: 40px;
+  }
+}
+.mfui-row__header {
+  margin-right: auto;
+  padding-right: 12px;
+}
+@media screen and (max-width: 767px) {
+  .mfui-row__title {
+    font-size: 15px;
+    line-height: 24px;
+    font-weight: 500;
+  }
+}
+.mfui-row__sub-title {
+  font-size: 12px;
+  line-height: 18px;
+  margin-top: 2px;
+  color: var(--spbSky3);
+}
+@media screen and (min-width: 768px) {
+  .mfui-row__sub-title:not(.mfui-row_size_small) {
+    font-size: 15px;
+    line-height: 24px;
+    margin-top: 4px;
+  }
+}
+.mfui-row__arrow {
+  width: 32px;
+  min-width: 32px;
+  height: 32px;
+  fill: var(--spbSky3);
+}
+@media screen and (min-width: 768px) {
+  .mfui-row__arrow {
+    margin-left: 4px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row__arrow {
+    margin-left: 12px;
+  }
+}
+.mfui-row__children {
+  font-size: 15px;
+  line-height: 24px;
+  font-weight: 500;
+}
+@media screen and (min-width: 768px) {
+  .mfui-row__children {
+    font-weight: 500;
+    font-size: 18px;
+    line-height: 24px;
+    letter-spacing: 0.5px;
+  }
+}
+@media screen and (min-width: 768px) and screen and (min-width: 1280px) {
+  .mfui-row__children {
+    font-size: 20px;
+    line-height: 28px;
+  }
+}
+.mfui-row_view_shadow {
+  -webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+          box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+}
+.mfui-row_view_stroke {
+  border: 1px solid var(--spbSky2);
+  background-color: inherit;
+}
+.mfui-row_pointer {
+  cursor: pointer;
+}
+.mfui-row_pointer.mfui-row_view_shadow:hover {
+  -webkit-box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
+          box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
+}
+.mfui-row_pointer.mfui-row_view_shadow:hover:after {
+  content: '';
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  border-radius: 12px;
+  background-color: var(--stcWhite10);
+  pointer-events: none;
+}
+.mfui-row_pointer.mfui-row_view_stroke:hover {
+  background-color: var(--spbSky0);
+}
+.mfui-row_has-arrow {
+  padding-right: 8px;
+}
+@media screen and (min-width: 768px) {
+  .mfui-row_has-arrow {
+    padding-right: 16px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row_has-arrow {
+    padding-right: 20px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row_has-arrow.mfui-row_size_small {
+    padding-right: 16px;
+  }
+}
+@media screen and (min-width: 768px) {
+  .mfui-row_size_small {
+    padding: 16px 24px 16px 20px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row_size_small {
+    padding: 20px 24px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-row_size_small .mfui-row__sub-title {
+    font-size: 15px;
+    line-height: 24px;
+    margin-top: 4px;
+  }
+}
+@media screen and (min-width: 768px) and (max-width: 1023px) {
+  .mfui-row_size_small .mfui-row__icon-container {
+    width: 40px;
+    height: 40px;
+  }
+}
+@media screen and (min-width: 768px) and (max-width: 1023px) {
+  .mfui-row_size_small .mfui-row__arrow {
+    margin-right: -4px;
+  }
+}
+.mfui-row_size_small .mfui-row__children {
+  font-size: 15px;
+  line-height: 24px;
+  font-weight: 500;
+}

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

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import './Row.scss';
+import React from 'react';
+import './Row.less';
 export interface IRowProps {
     /** Заголовок */
     title: string;

package/dist/lib/components/Row/Row.js

@@ -1,57 +1,73 @@
 "use strict";
 
-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); }
+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"] = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
+
+var _react = _interopRequireDefault(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
 var _Header = _interopRequireDefault(require("../Header/Header"));
+
 var _Preloader = _interopRequireDefault(require("../Preloader/Preloader"));
-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 _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 ArrowRight = function ArrowRight(props) {
-  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 32 32"
-  }, props), /*#__PURE__*/React.createElement("path", {
+  }, props), /*#__PURE__*/_react["default"].createElement("path", {
     d: "M12.5 20.8l4.8-4.8-4.8-4.8 1.6-1.7 6.4 6.5-6.4 6.5z"
   }));
 };
+
 var cn = (0, _uiHelpers.cnCreate)('mfui-row');
+
 var Row = function Row(_ref) {
   var title = _ref.title,
-    subTitle = _ref.subTitle,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'big' : _ref$size,
-    _ref$backgroundView = _ref.backgroundView,
-    backgroundView = _ref$backgroundView === void 0 ? 'shadow' : _ref$backgroundView,
-    icon = _ref.icon,
-    _ref$isIconColored = _ref.isIconColored,
-    isIconColored = _ref$isIconColored === void 0 ? false : _ref$isIconColored,
-    _ref$showArrow = _ref.showArrow,
-    showArrow = _ref$showArrow === void 0 ? false : _ref$showArrow,
-    _ref$showLoader = _ref.showLoader,
-    showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
-    href = _ref.href,
-    _ref$target = _ref.target,
-    target = _ref$target === void 0 ? '_self' : _ref$target,
-    rel = _ref.rel,
-    onClick = _ref.onClick,
-    children = _ref.children,
-    className = _ref.className,
-    _ref$classes = _ref.classes,
-    classes = _ref$classes === void 0 ? {} : _ref$classes,
-    dataAttrs = _ref.dataAttrs;
+      subTitle = _ref.subTitle,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'big' : _ref$size,
+      _ref$backgroundView = _ref.backgroundView,
+      backgroundView = _ref$backgroundView === void 0 ? 'shadow' : _ref$backgroundView,
+      icon = _ref.icon,
+      _ref$isIconColored = _ref.isIconColored,
+      isIconColored = _ref$isIconColored === void 0 ? false : _ref$isIconColored,
+      _ref$showArrow = _ref.showArrow,
+      showArrow = _ref$showArrow === void 0 ? false : _ref$showArrow,
+      _ref$showLoader = _ref.showLoader,
+      showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
+      href = _ref.href,
+      _ref$target = _ref.target,
+      target = _ref$target === void 0 ? '_self' : _ref$target,
+      rel = _ref.rel,
+      onClick = _ref.onClick,
+      children = _ref.children,
+      className = _ref.className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
+      dataAttrs = _ref.dataAttrs;
   var ElementType = href ? 'a' : 'div';
   var isActive = !showLoader && (!!href || !!onClick);
   var isSmallSize = size === 'small';
+
   var handleClick = function handleClick(e) {
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
   };
-  return /*#__PURE__*/React.createElement(ElementType, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+
+  return /*#__PURE__*/_react["default"].createElement(ElementType, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       size: size,
       view: backgroundView,
@@ -62,30 +78,50 @@ var Row = function Row(_ref) {
     target: href ? target : undefined,
     rel: rel,
     onClick: handleClick
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('wrapper')
-  }, !!icon && /*#__PURE__*/React.createElement("div", {
+  }, !!icon && /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('icon-container', {
       colored: isIconColored
     })
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('icon')
-  }, icon)), /*#__PURE__*/React.createElement("div", {
+  }, icon)), /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('header')
-  }, /*#__PURE__*/React.createElement(_Header["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_Header["default"], {
     className: cn('title', [classes.title]),
     as: isSmallSize ? 'h5' : 'h3'
-  }, title), !!subTitle && /*#__PURE__*/React.createElement("div", {
+  }, title), !!subTitle && /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('sub-title', [classes.subtitle])
-  }, subTitle)), !showLoader ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  }, subTitle)), !showLoader ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('children')
-  }, children), showArrow && /*#__PURE__*/React.createElement(ArrowRight, (0, _extends2["default"])({
+  }, children), showArrow && /*#__PURE__*/_react["default"].createElement(ArrowRight, (0, _extends2["default"])({
     className: cn('arrow')
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow)))) : /*#__PURE__*/React.createElement(_Preloader["default"], {
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow)))) : /*#__PURE__*/_react["default"].createElement(_Preloader["default"], {
     delay: false,
     dataAttrs: {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.preloader
     }
   })));
 };
-var _default = exports["default"] = Row;
+
+Row.propTypes = {
+  title: PropTypes.string.isRequired,
+  subTitle: PropTypes.string,
+  size: PropTypes.oneOf(['big', 'small']),
+  backgroundView: PropTypes.oneOf(['shadow', 'stroke']),
+  icon: PropTypes.element,
+  isIconColored: PropTypes.bool,
+  showArrow: PropTypes.bool,
+  showLoader: PropTypes.bool,
+  href: PropTypes.string,
+  target: PropTypes.oneOf(['_self', '_blank']),
+  rel: PropTypes.string,
+  onClick: PropTypes.func,
+  children: PropTypes.node,
+  className: PropTypes.string,
+  classes: PropTypes.objectOf(PropTypes.string),
+  dataAttrs: PropTypes.objectOf(PropTypes.object)
+};
+var _default = Row;
+exports["default"] = _default;