ecomlab-components-next 0.1.237 → 0.1.238

package/dist/stories/LongTileArticleBox/LongTileArticleBox.js

@@ -120,7 +120,7 @@ var LongTileArticleBox = function LongTileArticleBox(_ref) {
     className: "title"
   }, search ? (0, _highlightWord.hightlightWord)(search, articleName) : articleName), /*#__PURE__*/React.createElement("div", {
     className: "description-content"
-  }, /*#__PURE__*/React.createElement("p", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "text_description"
   }, Array.isArray(annotation) ? annotation !== null && annotation !== void 0 && annotation[0] ? (0, _htmlReactParser["default"])(annotation === null || annotation === void 0 ? void 0 : annotation[0]) : '' : annotation ? (0, _htmlReactParser["default"])(annotation) : '')), /*#__PURE__*/React.createElement("div", {
     className: "text-and-info-box"

package/dist/stories/ShortTileArticleBox/ShortTileArticleBox.js

@@ -112,7 +112,7 @@ var ShortTileArticleBox = function ShortTileArticleBox(_ref) {
     className: "title"
   }, search ? (0, _highlightWord.hightlightWord)(search, articleName) : articleName), /*#__PURE__*/React.createElement("div", {
     className: "description-content"
-  }, /*#__PURE__*/React.createElement("p", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "text_description"
   }, Array.isArray(annotation) ? annotation !== null && annotation !== void 0 && annotation[0] ? (0, _htmlReactParser["default"])(annotation === null || annotation === void 0 ? void 0 : annotation[0]) : '' : annotation ? (0, _htmlReactParser["default"])(annotation) : '')), /*#__PURE__*/React.createElement("div", {
     className: "text-and-info-box"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ecomlab-components-next",
-  "version": "0.1.237",
+  "version": "0.1.238",
   "description": "A set of common and reusable React components",
   "main": "dist/index.js",
   "files": [

package/dist/components/Buttons/SignUpButton/ButtonSignUp.js

@@ -1,75 +0,0 @@
-"use strict";
-'use client';
-
-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 _react = _interopRequireWildcard(require("react"));
-var _image = _interopRequireDefault(require("next/image"));
-var _ButtonSignUpModule = _interopRequireDefault(require("./ButtonSignUp.module.scss"));
-var _calendar = _interopRequireDefault(require("./calendar.svg"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-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 && {}.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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-var ButtonSignUp = function ButtonSignUp(_ref) {
-  var onClick = _ref.onClick,
-    _ref$media = _ref.media,
-    media = _ref$media === void 0 ? '1000px' : _ref$media,
-    _ref$isMobile = _ref.isMobile,
-    isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile;
-  var _useState = (0, _react.useState)(getMatches),
-    _useState2 = _slicedToArray(_useState, 2),
-    screenWidth = _useState2[0],
-    setScreenWidth = _useState2[1];
-  var getMatches = function getMatches() {
-    return typeof window !== 'undefined' ? window.matchMedia("(max-width:".concat(media, ")")).matches : false;
-  };
-  (0, _react.useEffect)(function () {
-    var mediaQuery = window.matchMedia("(max-width: ".concat(media, ")"));
-    var onResize = function onResize(e) {
-      return setScreenWidth(e.matches);
-    };
-    mediaQuery.addEventListener('change', onResize);
-    return function () {
-      return mediaQuery.removeEventListener('change', onResize);
-    };
-  }, [media]);
-  var collapsed = !isMobile && screenWidth;
-  var buttonClassName = [_ButtonSignUpModule["default"].buttonSignUp, isMobile ? _ButtonSignUpModule["default"].small : '', collapsed ? _ButtonSignUpModule["default"].collapsed : ''].join(' ').trim();
-  var buttonStyles = {
-    maxWidth: collapsed && '56px',
-    padding: collapsed ? '0' : '0 16px',
-    justifyContent: collapsed && 'center'
-  };
-  var imageWrapperStyles = {
-    '--after-left': collapsed ? '-11px' : 'calc(100% - 6px)',
-    '--after-top': collapsed ? '-11px' : '-2px'
-  };
-  return /*#__PURE__*/_react["default"].createElement("button", {
-    className: buttonClassName,
-    style: buttonStyles,
-    type: "button",
-    onClick: onClick
-  }, isMobile ? /*#__PURE__*/_react["default"].createElement("span", {
-    className: _ButtonSignUpModule["default"].secondaryText
-  }, "\u0417\u0430\u043F\u0438\u0441\u0430\u0442\u044C\u0441\u044F") : !collapsed ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _ButtonSignUpModule["default"].primaryText
-  }, "\u041E\u043D\u043B\u0430\u0439\u043D \u0437\u0430\u043F\u0438\u0441\u044C"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _ButtonSignUpModule["default"].secondaryText
-  }, "\u0417\u0430\u043F\u0438\u0441\u0430\u0442\u044C\u0441\u044F")) : null, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _ButtonSignUpModule["default"].imageWrapper,
-    style: imageWrapperStyles
-  }, /*#__PURE__*/_react["default"].createElement(_image["default"], {
-    src: _calendar["default"],
-    alt: "icon-calendar"
-  })));
-};
-var _default = exports["default"] = ButtonSignUp;

package/dist/components/Buttons/SignUpButton/ButtonSignUp.module.scss

@@ -1,92 +0,0 @@
-.buttonSignUp {
-  align-items: center;
-  background: #fff;
-  border: 1px solid #c6e7c9;
-  border-radius: 12px;
-  color: #042b8f;
-  cursor: pointer;
-  display: flex;
-  gap: 8px;
-  justify-content: space-between;
-  line-height: 16px;
-  min-height: 56px;
-  max-width: 188px;
-  padding: 0 16px;
-  transition: background 0.3s, box-shadow 0.3s;
-
-  &:hover, &:focus {
-    opacity: none;
-    background: #225df4;
-    box-shadow: inset 0 0 24px 0 rgba(27, 54, 123, 0.16);
-
-    .primaryText {
-      display: none;
-      opacity: 0;
-    }
-
-    .secondaryText {
-      display: block;
-      opacity: 1;
-    }
-  }
-}
-
-.small {
-  max-width: 146px;
-  min-height: 32px;
-  padding: 16px;
-
-  &:hover .secondaryText {
-    color: #fff;
-  }
-
-  .secondaryText {
-    display: block;
-    color: inherit;
-  }
-}
-
-.imageWrapper {
-  align-items: center;
-  display: flex;
-  height: 22px;
-  justify-content: center;
-  width: 22px;
-  position: relative;
-
-  &::after {
-    content: '';
-    width: 12px;
-    height: 12px;
-    position: absolute;
-    z-index: 1;
-    top: var(--after-top);
-    left: var(--after-left);
-    background-color: #57cc6a;
-    border-radius: 50%;
-    border: 2px solid #9ae0a6;
-  }
-
-  img {
-    min-height: 100%;
-    min-width: 100%;
-  }
-}
-
-.primaryText,
-.secondaryText {
-  font-family: 'Open Sans', sans-serif;
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 700;
-  text-align: center;
-  line-height: 16px;
-  display: inline-block;
-  width: 100%;
-  transition: opacity 0.3s, color 0.3s;
-}
-
-.secondaryText {
-  display: none;
-  color: #fff;
-}

package/dist/components/Buttons/SignUpButton/ButtonSignUp.stories.js

@@ -1,30 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _ButtonSignUp = _interopRequireDefault(require("./ButtonSignUp"));
-var _addonActions = require("@storybook/addon-actions");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var _default = exports["default"] = {
-  title: 'ButtonSignUp',
-  component: _ButtonSignUp["default"],
-  args: {
-    onClick: _addonActions.action
-  }
-};
-var Default = exports.Default = {
-  render: function render(args) {
-    return /*#__PURE__*/React.createElement("div", {
-      style: {
-        display: 'flex',
-        gap: '10px',
-        flexDirection: 'column'
-      }
-    }, /*#__PURE__*/React.createElement(_ButtonSignUp["default"], args), /*#__PURE__*/React.createElement(_ButtonSignUp["default"], _extends({}, args, {
-      isMobile: true
-    })));
-  }
-};

package/dist/components/Buttons/SignUpButton/calendar.svg

@@ -1,14 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 30 30" fill="none">
-    <path
-        d="M9 0.5C4.30558 0.5 0.5 4.30558 0.5 9V21C0.5 25.6944 4.30558 29.5 9 29.5H21C25.6944 29.5 29.5 25.6944 29.5 21V9C29.5 4.30558 25.6944 0.5 21 0.5H9Z"
-        fill="#225DF4" />
-    <path
-        d="M9 0.5C4.30558 0.5 0.5 4.30558 0.5 9V21C0.5 25.6944 4.30558 29.5 9 29.5H21C25.6944 29.5 29.5 25.6944 29.5 21V9C29.5 4.30558 25.6944 0.5 21 0.5H9Z" />
-    <path
-        d="M18.0625 8.67V7.5C18.0625 7.1925 17.8075 6.9375 17.5 6.9375C17.1925 6.9375 16.9375 7.1925 16.9375 7.5V8.625H12.0625V7.5C12.0625 7.1925 11.8075 6.9375 11.5 6.9375C11.1925 6.9375 10.9375 7.1925 10.9375 7.5V8.67C8.9125 8.8575 7.93 10.065 7.78 11.8575C7.765 12.075 7.945 12.255 8.155 12.255H20.845C21.0625 12.255 21.2425 12.0675 21.22 11.8575C21.07 10.065 20.0875 8.8575 18.0625 8.67Z"
-        fill="white" />
-    <path
-        d="M20.5 13.38H8.5C8.0875 13.38 7.75 13.7175 7.75 14.13V18.75C7.75 21 8.875 22.5 11.5 22.5H17.5C20.125 22.5 21.25 21 21.25 18.75V14.13C21.25 13.7175 20.9125 13.38 20.5 13.38ZM12.4075 19.6575C12.3325 19.725 12.25 19.7775 12.16 19.815C12.07 19.8525 11.9725 19.875 11.875 19.875C11.7775 19.875 11.68 19.8525 11.59 19.815C11.5 19.7775 11.4175 19.725 11.3425 19.6575C11.2075 19.515 11.125 19.32 11.125 19.125C11.125 18.93 11.2075 18.735 11.3425 18.5925C11.4175 18.525 11.5 18.4725 11.59 18.435C11.77 18.36 11.98 18.36 12.16 18.435C12.25 18.4725 12.3325 18.525 12.4075 18.5925C12.5425 18.735 12.625 18.93 12.625 19.125C12.625 19.32 12.5425 19.515 12.4075 19.6575ZM12.565 16.785C12.5275 16.875 12.475 16.9575 12.4075 17.0325C12.3325 17.1 12.25 17.1525 12.16 17.19C12.07 17.2275 11.9725 17.25 11.875 17.25C11.7775 17.25 11.68 17.2275 11.59 17.19C11.5 17.1525 11.4175 17.1 11.3425 17.0325C11.275 16.9575 11.2225 16.875 11.185 16.785C11.1475 16.695 11.125 16.5975 11.125 16.5C11.125 16.4025 11.1475 16.305 11.185 16.215C11.2225 16.125 11.275 16.0425 11.3425 15.9675C11.4175 15.9 11.5 15.8475 11.59 15.81C11.77 15.735 11.98 15.735 12.16 15.81C12.25 15.8475 12.3325 15.9 12.4075 15.9675C12.475 16.0425 12.5275 16.125 12.565 16.215C12.6025 16.305 12.625 16.4025 12.625 16.5C12.625 16.5975 12.6025 16.695 12.565 16.785ZM15.0325 17.0325C14.9575 17.1 14.875 17.1525 14.785 17.19C14.695 17.2275 14.5975 17.25 14.5 17.25C14.4025 17.25 14.305 17.2275 14.215 17.19C14.125 17.1525 14.0425 17.1 13.9675 17.0325C13.8325 16.89 13.75 16.695 13.75 16.5C13.75 16.305 13.8325 16.11 13.9675 15.9675C14.0425 15.9 14.125 15.8475 14.215 15.81C14.395 15.7275 14.605 15.7275 14.785 15.81C14.875 15.8475 14.9575 15.9 15.0325 15.9675C15.1675 16.11 15.25 16.305 15.25 16.5C15.25 16.695 15.1675 16.89 15.0325 17.0325Z"
-        fill="white" />
-    <script xmlns="" />
-</svg>

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

@@ -1,83 +0,0 @@
-"use strict";
-'use client';
-
-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 _react = _interopRequireWildcard(require("react"));
-require("./Checkbox.scss");
-var _excluded = ["id", "value", "onChange", "containerClassName", "inputClassName", "className", "children", "green", "yellow", "red", "grey", "disabled", "stopPropagation"];
-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 && {}.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 _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
-var Checkbox = function Checkbox(_ref) {
-  var id = _ref.id,
-    value = _ref.value,
-    onChange = _ref.onChange,
-    containerClassName = _ref.containerClassName,
-    inputClassName = _ref.inputClassName,
-    className = _ref.className,
-    children = _ref.children,
-    _ref$green = _ref.green,
-    green = _ref$green === void 0 ? false : _ref$green,
-    _ref$yellow = _ref.yellow,
-    yellow = _ref$yellow === void 0 ? false : _ref$yellow,
-    _ref$red = _ref.red,
-    red = _ref$red === void 0 ? false : _ref$red,
-    _ref$grey = _ref.grey,
-    grey = _ref$grey === void 0 ? false : _ref$grey,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$stopPropagation = _ref.stopPropagation,
-    stopPropagation = _ref$stopPropagation === void 0 ? true : _ref$stopPropagation,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var _useState = (0, _react.useState)(value),
-    _useState2 = _slicedToArray(_useState, 2),
-    _value = _useState2[0],
-    set_value = _useState2[1];
-  var _onChange = function _onChange(e) {
-    set_value(e.target.checked);
-    if (onChange) {
-      onChange(e.target.checked);
-    }
-  };
-  var colorCheckbox = function colorCheckbox() {
-    if (green) return 'checkbox-container_green';
-    if (red) return 'checkbox-container_red';
-    if (grey) return 'checkbox-container_grey';
-    if (yellow) return 'checkbox-container_yellow';
-  };
-  (0, _react.useEffect)(function () {
-    set_value(value);
-  }, [value]);
-  return /*#__PURE__*/_react["default"].createElement("label", {
-    onClick: function onClick(e) {
-      if (stopPropagation) {
-        e.stopPropagation();
-      }
-    },
-    className: "checkbox-container ".concat(colorCheckbox() || '', " ").concat(containerClassName ? containerClassName : "")
-  }, /*#__PURE__*/_react["default"].createElement("input", _extends({
-    type: "checkbox",
-    disabled: disabled,
-    id: id,
-    className: "checkbox " + (inputClassName ? inputClassName : ""),
-    checked: _value,
-    onChange: _onChange
-  }, props)), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "checkbox-element " + (className ? className : "")
-  }), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "checkbox-container__text"
-  }, " ", children));
-};
-var _default = exports["default"] = Checkbox;

package/dist/components/Checkbox/Checkbox/Checkbox.scss

@@ -1,136 +0,0 @@
-.checkbox-container,
-.checkbox-container_green,
-.checkbox-container_red,
-.checkbox-container_yellow,
-.checkbox-container_grey {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 8px;
-    cursor: pointer;
-
-    &__text {
-        color: #0B110B;
-        font-family: NunitoSans;
-        font-size: 13px;
-        font-style: normal;
-        font-weight: 600;
-        line-height: 15px;
-        overflow: hidden;
-    }
-
-    .checkbox-element {
-        display: inline-block;
-        font-family: 'Montserrat';
-        font-style: normal;
-        font-weight: 400;
-        font-size: 11px;
-        line-height: 15px;
-        vertical-align: middle;
-
-        &::before {
-            content: "";
-            display: inline-block;
-            width: 16px;
-            height: 16px;
-            left: 344px;
-            top: 321px;
-            // authorization box differences
-            border: none;
-            border: 1px solid #C5D3C5;
-            background-color: #fff;
-            border-radius: 4px;
-            vertical-align: middle;
-        }
-    }
-
-    .checkbox {
-        opacity: 0;
-        position: fixed;
-        width: 1px;
-        height: 1px;
-        clip: rect(1px, 1px, 1px, 1px);
-
-        &:checked~.checkbox-element::before {
-            background-image: url('./img/check.svg');
-            background-position: center;
-            background-size: 10px;
-            background-color: #0009E8;
-            vertical-align: middle;
-            background-repeat: no-repeat;
-            background-position: center;
-        }
-    }
-}
-
-// Green checkbox
-.checkbox-container_green {
-
-    .checkbox-element {
-        &::before {
-            border: 1px solid #83E38C;
-            background-color: #F0FFF1;
-        }
-    }
-
-    .checkbox {
-
-        &:checked~.checkbox-element::before {
-            background-color: #83E38C;
-        }
-    }
-}
-
-// Grey checkbox
-.checkbox-container_grey {
-
-    .checkbox-element {
-        &::before {
-            border: 1px solid #9199A5;
-            background-color: #F0F2F4;
-        }
-    }
-
-    .checkbox {
-
-        &:checked~.checkbox-element::before {
-            background-color: #9199A5;
-        }
-    }
-}
-
-// Red checkbox
-.checkbox-container_red {
-
-    .checkbox-element {
-        &::before {
-            border: 1px solid #FF7E7E;
-            background-color: #FFF0F0;
-        }
-    }
-
-    .checkbox {
-
-        &:checked~.checkbox-element::before {
-            background-color: #FF7E7E;
-        }
-    }
-}
-
-// Yellow checkbox
-.checkbox-container_yellow {
-
-    .checkbox-element {
-        &::before {
-            border: 1px solid #FFDC75;
-            background-color: #FFFDF0;
-        }
-    }
-
-    .checkbox {
-
-        &:checked~.checkbox-element::before {
-            background-color: #FFDC75;
-        }
-    }
-}

package/dist/components/Checkbox/Checkbox/Checkbox.stories.js

@@ -1,46 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _Checkbox = _interopRequireDefault(require("./Checkbox"));
-var _addonActions = require("@storybook/addon-actions");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var _default = exports["default"] = {
-  title: 'Checkbox',
-  component: _Checkbox["default"],
-  args: {
-    id: 1,
-    value: true,
-    onChange: (0, _addonActions.action)('onChange'),
-    containerClassName: 'test-c',
-    inputClassName: 'test-i',
-    className: 'test',
-    children: /*#__PURE__*/React.createElement("span", null, "test"),
-    uncontrolled: false
-  }
-};
-var Default = exports.Default = {
-  render: function render(args) {
-    return /*#__PURE__*/React.createElement("div", {
-      style: {
-        display: 'flex',
-        gap: '10px',
-        flexDirection: 'column',
-        justifyContent: 'center',
-        alignItems: 'center',
-        height: '100%'
-      }
-    }, /*#__PURE__*/React.createElement(_Checkbox["default"], args), /*#__PURE__*/React.createElement(_Checkbox["default"], _extends({
-      green: true
-    }, args)), /*#__PURE__*/React.createElement(_Checkbox["default"], _extends({
-      grey: true
-    }, args)), /*#__PURE__*/React.createElement(_Checkbox["default"], _extends({
-      yellow: true
-    }, args)), /*#__PURE__*/React.createElement(_Checkbox["default"], _extends({
-      red: true
-    }, args)));
-  }
-};

package/dist/components/Checkbox/Checkbox/img/check.svg

@@ -1,3 +0,0 @@
-<svg width="10" height="8" viewBox="0 0 10 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path id="Vector" d="M8.33268 1.5L3.74935 6.08333L1.66602 4" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

package/dist/main.js

@@ -1,14 +0,0 @@
-/*
- * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
- * This devtool is neither made for production nor for readable output files.
- * It uses "eval()" calls to create a separate source file in the browser devtools.
- * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
- * or disable the default devtool with "devtool: false".
- * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
- */
-/******/ (() => { // webpackBootstrap
-/******/ 	"use strict";
-/******/ 	
-/******/ 	
-/******/ })()
-;

package/dist/stories/InputDynamicWidth/InputDynamicWidth.js

@@ -1,85 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _close_icon = _interopRequireDefault(require("./img/close_icon.svg"));
-var _react = require("react");
-require("./InputDynamicWidth.scss");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-var InputDynamicWidth = function InputDynamicWidth(_ref) {
-  var onChange = _ref.onChange,
-    _ref$placeholder = _ref.placeholder,
-    placeholder = _ref$placeholder === void 0 ? 'Поиск' : _ref$placeholder,
-    _ref$maxWidth = _ref.maxWidth,
-    maxWidth = _ref$maxWidth === void 0 ? false : _ref$maxWidth,
-    _ref$position = _ref.position,
-    position = _ref$position === void 0 ? 'right' : _ref$position,
-    _ref$isOpen = _ref.isOpen,
-    isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
-    value = _ref.value;
-  var _useState = (0, _react.useState)(value ? value : ''),
-    _useState2 = _slicedToArray(_useState, 2),
-    valueInside = _useState2[0],
-    setValueInside = _useState2[1];
-  var _useState3 = (0, _react.useState)(isOpen ? true : false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isFocus = _useState4[0],
-    setIsFocus = _useState4[1];
-  (0, _react.useEffect)(function () {
-    if (onChange) {
-      onChange(valueInside);
-    }
-  }, [valueInside]);
-  (0, _react.useEffect)(function () {
-    setValueInside(value);
-  }, [value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "input-dynamic-width-bar",
-    style: {
-      justifyContent: position == 'left' ? 'end' : ''
-    },
-    onClick: function onClick(e) {
-      setIsFocus(true);
-    }
-  }, /*#__PURE__*/React.createElement("input", {
-    type: "text",
-    inputMode: "text",
-    placeholder: placeholder ? placeholder : 'Поиск',
-    className: isFocus ? "input-dynamic-width-bar__search_active" : "input-dynamic-width-bar__search",
-    readOnly: !isFocus,
-    autoComplete: 'off',
-    onBlur: function onBlur(e) {
-      if (valueInside === '') {
-        if (!isOpen) {
-          setIsFocus(false);
-        }
-      }
-    },
-    value: valueInside,
-    onChange: function onChange(e) {
-      setValueInside(e.target.value);
-    },
-    style: {
-      maxWidth: maxWidth ? maxWidth : ''
-    }
-  }), ((valueInside === null || valueInside === void 0 ? void 0 : valueInside.length) && isFocus) > 0 && /*#__PURE__*/React.createElement("div", {
-    className: "input-dynamic-width-bar__btn_close",
-    type: "button",
-    onClick: function onClick(e) {
-      e.stopPropagation(e);
-      setValueInside('');
-      if (!isOpen) {
-        setIsFocus(false);
-      }
-    }
-  }, /*#__PURE__*/React.createElement("img", _close_icon["default"])));
-};
-var _default = exports["default"] = InputDynamicWidth;