@sima-land/moleculas 12.3.0 → 13.0.0

package/common/components/product-info/product-info.module.scss

@@ -1,37 +1,47 @@
+@use 'node_modules/@sima-land/ui-nucleons/colors';
+@use 'node_modules/@sima-land/ui-nucleons/breakpoints';
+
 .image-overlay {
   position: relative;
   max-width: 100%;
   margin-bottom: 8px;
-}
-
-.favorite-btn {
-  position: absolute;
-  top: 4px;
-  right: 4px;
+  overflow: hidden;
+  aspect-ratio: 1 / 1;
 }
 
 .image-link {
   display: block;
-  // фиксируем соотношение сторон чтобы размер не скакал при загрузке изображения
-  &::before {
-    display: block;
-    content: '';
-    padding-top: 100%;
-    pointer-events: none;
-  }
+  height: 100%;
 }
 
 .image {
   display: block;
-  position: absolute;
-  top: 0;
-  left: 0;
+  object-fit: contain;
   width: 100%;
   height: 100%;
-  object-fit: contain;
+  &:not(.adult) {
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+  &.adult {
+    opacity: 0.2;
+    filter: blur(24px);
+    pointer-events: none;
+  }
+}
+
+.adult-icon {
+  position: absolute;
+  width: 40%;
+  height: 40%;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  fill: colors.$gray38;
 }
 
-.on-image {
+.image-buttons {
   position: absolute;
   top: 0;
   left: 0;
@@ -43,6 +53,32 @@
   }
 }
 
+.image-button {
+  display: block;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  position: absolute;
+  --gutter: 8px;
+  right: var(--gutter);
+  cursor: pointer;
+  &:nth-child(1) {
+    top: var(--gutter);
+  }
+  &:nth-child(2) {
+    bottom: var(--gutter);
+  }
+  &:nth-child(n + 3) {
+    display: none;
+  }
+  &:hover {
+    fill: colors.$gray54;
+  }
+  @include breakpoints.down('ml') {
+    --gutter: 4px;
+  }
+}
+
 .badges {
   margin-bottom: 8px;
 }
@@ -52,34 +88,50 @@
   display: flex;
   align-items: center;
 
-  // чтобы старая цена скрывалась если не влазит, согласовано с дизайнерами
-  height: 24px;
-  overflow: hidden;
-  flex-wrap: wrap;
+  font-size: 16px;
+  font-weight: 700;
+  line-height: 24px;
+
+  // чтобы старая цена скрывалась если не влазит
+  &.height-limit {
+    height: 24px;
+    overflow: hidden;
+    flex-wrap: wrap;
+  }
 }
 
 .price {
-  font-size: 16px;
-  font-weight: 600;
-  line-height: 24px;
+  font-size: inherit;
+  line-height: inherit;
   margin-right: 8px;
 }
 
 .old-price {
   font-size: 12px;
   line-height: 16px;
+  font-weight: 400;
 }
 
 .link {
-  overflow: hidden;
-  word-break: break-word;
-  max-height: 40px;
   max-width: 100%;
   font-size: 14px;
   line-height: 20px;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
+  &.line-clamp {
+    overflow: hidden;
+    word-break: break-word;
+    max-height: 40px;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+  }
+}
+
+.adult-info {
+  display: block;
+  max-width: 100%;
+  font-size: 14px;
+  line-height: 20px;
+  color: colors.$gray87;
 }
 
 .trademark-link {
@@ -91,3 +143,74 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+// футер
+.footer {
+  margin-top: 16px;
+}
+
+.text-button {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 600;
+  &:hover,
+  &:active {
+    font-weight: 600;
+  }
+  @include breakpoints.down('ml') {
+    font-size: 14px;
+    line-height: 20px;
+  }
+}
+
+.wait-list-added-text {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 600;
+  color: colors.$gray24;
+  @include breakpoints.down('ml') {
+    font-size: 14px;
+    line-height: 20px;
+  }
+}
+
+// блок корзины
+.control-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 16px;
+  &.loading {
+    .control {
+      background: colors.$gray4;
+      border-radius: 4px;
+    }
+    .unit-text::before {
+      content: '';
+      display: block;
+      background: colors.$gray4;
+      border-radius: 4px;
+      width: 48px;
+      height: 16px;
+    }
+  }
+}
+
+.control {
+  width: 122px;
+  height: 40px;
+  margin-right: 16px;
+}
+
+.unit-text {
+  padding-top: 12px; // чтобы при переносе на следующую строку правильно отступил от кнопки
+  font-size: 12px;
+  line-height: 16px;
+  color: colors.$gray38;
+}
+
+.bottom-text {
+  margin-top: 12px;
+  font-size: 12px;
+  line-height: 16px;
+  color: colors.$gray38;
+}

package/common/components/product-info/types.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export interface ProductInfoProps {
+    restriction?: 'adult' | 'unavailable';
+    children?: React.ReactNode;
+}

package/common/components/product-info/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/common/components/product-info/utils.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ProductInfoProps } from './types';
+export declare const ProductInfoContext: import("react").Context<Pick<ProductInfoProps, "restriction">>;

package/{mobile/components/product-slider → common/components/product-info}/utils.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SliderContext = void 0;
+exports.ProductInfoContext = void 0;
 const react_1 = require("react");
-exports.SliderContext = react_1.createContext({ needLoadImages: false });
+exports.ProductInfoContext = (0, react_1.createContext)({});

package/common/components/quick-view-button/index.js

@@ -44,7 +44,7 @@ const cx = bind_1.default.bind(quick_view_button_module_scss_1.default);
  * @param props Свойства компонента.
  * @return Элемент.
  */
-exports.QuickViewButton = react_1.forwardRef((_a, ref) => {
+exports.QuickViewButton = (0, react_1.forwardRef)((_a, ref) => {
     var { onClick, className } = _a, restProps = __rest(_a, ["onClick", "className"]);
     return (react_1.default.createElement(quick_view_svg_1.default, Object.assign({}, restProps, { ref: ref, role: 'button', "aria-label": '\u0411\u044B\u0441\u0442\u0440\u044B\u0439 \u043F\u0440\u043E\u0441\u043C\u043E\u0442\u0440', className: cx('root', className), width: 24, height: 24, onClick: onClick, "data-testid": 'quick-view-button' })));
 });

package/common/components/wish-button/index.js

@@ -49,7 +49,7 @@ const cx = bind_1.default.bind(wish_button_module_scss_1.default);
  * @param props.disabled Признак загрузки добавления товара в список избранного.
  * @return Элемент.
  */
-exports.WishButton = react_1.forwardRef((_a, ref) => {
+exports.WishButton = (0, react_1.forwardRef)((_a, ref) => {
     var { checked, className, onClick, disabled } = _a, restProps = __rest(_a, ["checked", "className", "onClick", "disabled"]);
     const Icon = checked ? filled_heart_svg_1.default : heart_svg_1.default;
     return (react_1.default.createElement(Icon, Object.assign({}, restProps, { ref: ref, role: 'button', "aria-label": checked ? 'Убрать из избранного' : 'Добавить в избранное', className: cx('button', className, { checked, disabled }), onClick: disabled ? undefined : onClick, "data-testid": 'favorite-button', width: 24, height: 24 })));

package/common/icons/eighteen-plus.svg

@@ -1,3 +1,5 @@
 <svg width="36" height="36" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.3" fill-rule="evenodd" d="M106.163 37.2641H101.212V23.2372H87.1854V18.2862H101.212V4.2587H106.163V18.2862H120.191V23.2372H106.163V37.2641ZM70.2788 52.7828C71.5464 54.2213 73.8876 55.6569 77.3059 57.0961C80.3783 55.7891 82.5529 54.3858 83.831 52.8827C85.1099 51.3788 85.7497 49.6254 85.7497 47.6209C85.7497 45.4231 84.9714 43.6746 83.4134 42.3782C81.8561 41.0824 79.7118 40.4356 76.9846 40.4356C74.2968 40.4356 72.1918 41.088 70.6662 42.3943C69.1412 43.7006 68.3777 45.4442 68.3777 47.6209C68.3777 49.6254 69.0104 51.3472 70.2788 52.7828ZM69.0217 66.3583C67.5832 68.0449 66.8633 70.0648 66.8633 72.4166C66.8633 75.0306 67.759 77.0667 69.5532 78.5269C71.3467 79.9872 73.8658 80.7142 77.1119 80.7142C80.315 80.7142 82.8053 79.9549 84.5883 78.4299C86.3719 76.905 87.2655 74.8148 87.2655 72.1558C87.2655 70.0438 86.4282 68.1652 84.7507 66.5221C83.0739 64.8762 80.1526 63.2817 75.9848 61.7349C72.7824 63.1277 70.4616 64.6688 69.0217 66.3583ZM65.0585 54.0083C63.7698 52.039 63.1237 49.8328 63.1237 47.3917C63.1237 43.9298 64.3857 41.1689 66.9111 39.1103C69.4358 37.0524 72.814 36.0225 77.0479 36.0225C81.3464 36.0225 84.7507 37.0356 87.2655 39.0618C89.7797 41.088 91.0368 43.8869 91.0368 47.4592C91.0368 49.8117 90.3168 51.9553 88.8762 53.8951C87.4378 55.8327 85.1388 57.5967 81.9792 59.1863C85.8031 61.0368 88.5226 62.9822 90.1333 65.019C91.7469 67.0557 92.5519 69.4131 92.5519 72.0911C92.5519 76.0564 91.1858 79.2188 88.4586 81.5825C85.7286 83.9448 81.989 85.1273 77.2426 85.1273C72.2136 85.1273 68.3461 84.0094 65.6378 81.7786C62.9296 79.545 61.5762 76.3826 61.5762 72.2872C61.5762 66.8216 64.8645 62.5617 71.4395 59.5126C68.474 57.8154 66.3472 55.9804 65.0585 54.0083ZM62.0185 123.903C27.8404 123.903 0.133301 96.1964 0.133301 62.0183C0.133301 27.8402 27.8404 0.133118 62.0185 0.133118C69.2333 0.133118 76.1606 1.3677 82.5986 3.63789C82.6471 4.73608 82.6471 8.81386 82.6471 8.79698C76.2274 6.28845 69.3261 5.0841 62.0185 5.0841C30.5746 5.0841 5.08428 30.5744 5.08428 62.0183C5.08428 93.4621 30.5746 118.952 62.0185 118.952C93.4623 118.952 118.953 93.4621 118.953 62.0183C118.953 54.7296 117.583 47.7608 115.087 41.3552C117.817 41.3897 119.9 41.3897 120.38 41.3833C122.662 47.8368 123.904 54.7823 123.904 62.0183C123.904 96.1964 96.1966 123.903 62.0185 123.903ZM32.6789 50.2019L29.8434 46.4791L42.3165 36.7101H46.8273V84.4728H41.6071V50.4311C41.6071 47.5991 41.6922 44.9212 41.8651 42.3943C41.413 42.852 40.9082 43.3322 40.35 43.8335C39.7918 44.3341 37.2347 46.4573 32.6789 50.2019Z" transform="matrix(0.2903226,0,0,0.2903226,0,0)"/>
+  <path fill-rule="evenodd"
+    d="M106.163 37.2641H101.212V23.2372H87.1854V18.2862H101.212V4.2587H106.163V18.2862H120.191V23.2372H106.163V37.2641ZM70.2788 52.7828C71.5464 54.2213 73.8876 55.6569 77.3059 57.0961C80.3783 55.7891 82.5529 54.3858 83.831 52.8827C85.1099 51.3788 85.7497 49.6254 85.7497 47.6209C85.7497 45.4231 84.9714 43.6746 83.4134 42.3782C81.8561 41.0824 79.7118 40.4356 76.9846 40.4356C74.2968 40.4356 72.1918 41.088 70.6662 42.3943C69.1412 43.7006 68.3777 45.4442 68.3777 47.6209C68.3777 49.6254 69.0104 51.3472 70.2788 52.7828ZM69.0217 66.3583C67.5832 68.0449 66.8633 70.0648 66.8633 72.4166C66.8633 75.0306 67.759 77.0667 69.5532 78.5269C71.3467 79.9872 73.8658 80.7142 77.1119 80.7142C80.315 80.7142 82.8053 79.9549 84.5883 78.4299C86.3719 76.905 87.2655 74.8148 87.2655 72.1558C87.2655 70.0438 86.4282 68.1652 84.7507 66.5221C83.0739 64.8762 80.1526 63.2817 75.9848 61.7349C72.7824 63.1277 70.4616 64.6688 69.0217 66.3583ZM65.0585 54.0083C63.7698 52.039 63.1237 49.8328 63.1237 47.3917C63.1237 43.9298 64.3857 41.1689 66.9111 39.1103C69.4358 37.0524 72.814 36.0225 77.0479 36.0225C81.3464 36.0225 84.7507 37.0356 87.2655 39.0618C89.7797 41.088 91.0368 43.8869 91.0368 47.4592C91.0368 49.8117 90.3168 51.9553 88.8762 53.8951C87.4378 55.8327 85.1388 57.5967 81.9792 59.1863C85.8031 61.0368 88.5226 62.9822 90.1333 65.019C91.7469 67.0557 92.5519 69.4131 92.5519 72.0911C92.5519 76.0564 91.1858 79.2188 88.4586 81.5825C85.7286 83.9448 81.989 85.1273 77.2426 85.1273C72.2136 85.1273 68.3461 84.0094 65.6378 81.7786C62.9296 79.545 61.5762 76.3826 61.5762 72.2872C61.5762 66.8216 64.8645 62.5617 71.4395 59.5126C68.474 57.8154 66.3472 55.9804 65.0585 54.0083ZM62.0185 123.903C27.8404 123.903 0.133301 96.1964 0.133301 62.0183C0.133301 27.8402 27.8404 0.133118 62.0185 0.133118C69.2333 0.133118 76.1606 1.3677 82.5986 3.63789C82.6471 4.73608 82.6471 8.81386 82.6471 8.79698C76.2274 6.28845 69.3261 5.0841 62.0185 5.0841C30.5746 5.0841 5.08428 30.5744 5.08428 62.0183C5.08428 93.4621 30.5746 118.952 62.0185 118.952C93.4623 118.952 118.953 93.4621 118.953 62.0183C118.953 54.7296 117.583 47.7608 115.087 41.3552C117.817 41.3897 119.9 41.3897 120.38 41.3833C122.662 47.8368 123.904 54.7823 123.904 62.0183C123.904 96.1964 96.1966 123.903 62.0185 123.903ZM32.6789 50.2019L29.8434 46.4791L42.3165 36.7101H46.8273V84.4728H41.6071V50.4311C41.6071 47.5991 41.6922 44.9212 41.8651 42.3943C41.413 42.852 40.9082 43.3322 40.35 43.8335C39.7918 44.3341 37.2347 46.4573 32.6789 50.2019Z"
+    transform="matrix(0.2903226,0,0,0.2903226,0,0)" />
 </svg>

package/desktop/components/breadcrumbs/index.js

@@ -47,12 +47,12 @@ exports.Breadcrumbs = Breadcrumbs;
  */
 const Breadcrumb = ({ data, onSiblingsPopupOpen, isSiblingActive, }) => {
     var _a;
-    const popupRef = react_1.useRef(null);
-    const [withPopup, togglePopup] = react_1.useState(false);
+    const popupRef = (0, react_1.useRef)(null);
+    const [withPopup, togglePopup] = (0, react_1.useState)(false);
     // с useOutsideClick не работает после обновления React до 17 версии, пока так
-    react_1.useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (withPopup) {
-            return on_1.default(window, 'mousedown', togglePopup.bind(null, false));
+            return (0, on_1.default)(window, 'mousedown', togglePopup.bind(null, false));
         }
     }, [withPopup]);
     const selfName = (react_1.default.createElement(link_1.Link, { color: 'gray87', href: data.url }, data.name));
@@ -74,6 +74,6 @@ const Breadcrumb = ({ data, onSiblingsPopupOpen, isSiblingActive, }) => {
                         selfName,
                         react_1.default.createElement(square_arrow_down_svg_1.default, { "data-testid": 'breadcrumb:siblings-closer', className: cx('toggle-icon', 'close'), onClick: () => togglePopup(false) })),
                     react_1.default.createElement("ul", { className: cx('siblings') },
-                        data.siblings.state === 'fetching' && (react_1.default.createElement(react_1.default.Fragment, null, lodash_1.times(8).map(index => (react_1.default.createElement("div", { key: index, className: cx('sibling-placeholder') }))))),
+                        data.siblings.state === 'fetching' && (react_1.default.createElement(react_1.default.Fragment, null, (0, lodash_1.times)(8).map(index => (react_1.default.createElement("div", { key: index, className: cx('sibling-placeholder') }))))),
                         data.siblings.state === 'ready' && (react_1.default.createElement(react_1.default.Fragment, null, (_a = data.siblings.data) === null || _a === void 0 ? void 0 : _a.map((sibling, index) => (react_1.default.createElement("li", { key: index, className: cx('sibling'), "data-testid": 'breadcrumb-sibling' }, isSiblingActive(sibling) ? (react_1.default.createElement("span", { className: cx('active') }, sibling.name)) : (react_1.default.createElement(link_1.Link, { color: 'gray87', className: cx('link'), href: sibling.url, children: sibling.name }))))))))))))));
 };

package/desktop/components/gallery-modal/components/all-round-view.js

@@ -36,16 +36,16 @@ const turn_left_svg_1 = __importDefault(require("../icons/turn-left.svg"));
 const turn_right_svg_1 = __importDefault(require("../icons/turn-right.svg"));
 const cx = bind_1.default.bind(all_round_view_module_scss_1.default);
 const AllRoundView = ({ photos }) => {
-    const imageRef = react_1.useRef(null);
-    const dragStartRef = react_1.useRef(null);
-    const [state, setState] = react_1.useState('autoplay');
+    const imageRef = (0, react_1.useRef)(null);
+    const dragStartRef = (0, react_1.useRef)(null);
+    const [state, setState] = (0, react_1.useState)('autoplay');
     const autoplay = state === 'autoplay';
     const ChangeState = (bindState) => () => setState(bindState);
-    const [index, setIndex] = react_1.useState(0);
-    const indexRef = identity_1.useIdentityRef(index);
-    const photosReady = utils_1.useImagesLoad(photos);
+    const [index, setIndex] = (0, react_1.useState)(0);
+    const indexRef = (0, identity_1.useIdentityRef)(index);
+    const photosReady = (0, utils_1.useImagesLoad)(photos);
     // запуск/остановка вращения
-    react_1.useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (state !== 'default' && photosReady) {
             const timerId = window.setInterval(() => {
                 const increment = state === 'turn-left' ? -1 : 1;
@@ -55,14 +55,14 @@ const AllRoundView = ({ photos }) => {
         }
     }, [state, photosReady]);
     // перетаскивание
-    react_1.useEffect(() => {
+    (0, react_1.useEffect)(() => {
         // переданное число всегда замениться на такое, которое будет в промежутке от 0 до количества фото
         const wrap = (value) => (photos.length + value) % photos.length;
         const image = imageRef.current;
         const imageWidth = image.clientWidth;
         const imageLeft = image.getBoundingClientRect().left;
         const offList = [
-            on_1.default(image, 'pointerdown', e => {
+            (0, on_1.default)(image, 'pointerdown', e => {
                 e.preventDefault();
                 setState('default');
                 image.style.touchAction = 'none';
@@ -71,7 +71,7 @@ const AllRoundView = ({ photos }) => {
                     index: indexRef.current,
                 };
             }),
-            on_1.default(window, 'pointermove', e => {
+            (0, on_1.default)(window, 'pointermove', e => {
                 if (dragStartRef.current !== null) {
                     const startX = dragStartRef.current.position;
                     const currentX = e.clientX - imageLeft;
@@ -81,7 +81,7 @@ const AllRoundView = ({ photos }) => {
                     setIndex(nextIndex);
                 }
             }),
-            on_1.default(window, 'pointerup', () => {
+            (0, on_1.default)(window, 'pointerup', () => {
                 dragStartRef.current = null;
                 image.style.touchAction = '';
             }),

package/desktop/components/gallery-modal/components/gallery-modal.js

@@ -49,23 +49,23 @@ const bind_1 = __importDefault(require("classnames/bind"));
 const gallery_modal_module_scss_1 = __importDefault(require("./gallery-modal.module.scss"));
 const cx = bind_1.default.bind(gallery_modal_module_scss_1.default);
 const GalleryModal = ({ media, defaultMediaIndex = 0, review, onClose, onGoToReview, onMediaChange, withScrollDisable, scrollDisableOptions, onVideoEvent, }) => {
-    const [currentIndex, setCurrent] = react_1.useState(defaultMediaIndex);
-    const thumbnailsRef = react_1.useRef(null);
-    const areaRef = react_1.useRef(null);
+    const [currentIndex, setCurrent] = (0, react_1.useState)(defaultMediaIndex);
+    const thumbnailsRef = (0, react_1.useRef)(null);
+    const areaRef = (0, react_1.useRef)(null);
     const footerGutter = 40;
     const footerHeight = 20;
     const correction = review ? footerGutter + footerHeight : 0;
-    const size = utils_1.useRectFit(areaRef, { correction });
+    const size = (0, utils_1.useRectFit)(areaRef, { correction });
     const innerStyles = Object.assign({}, (size !== null && {
         '--area-height': `${size + correction}px`,
         '--all-round-view-size': `${size}px`,
     }));
-    const handlerRef = identity_1.useIdentityRef(onMediaChange);
-    react_1.useEffect(() => {
+    const handlerRef = (0, identity_1.useIdentityRef)(onMediaChange);
+    (0, react_1.useEffect)(() => {
         var _a;
         (_a = handlerRef.current) === null || _a === void 0 ? void 0 : _a.call(handlerRef, media[currentIndex], currentIndex);
         thumbnailsRef.current &&
-            scroll_to_child_1.scrollToChild(thumbnailsRef.current, thumbnailsRef.current.children[currentIndex]);
+            (0, scroll_to_child_1.scrollToChild)(thumbnailsRef.current, thumbnailsRef.current.children[currentIndex]);
     }, [currentIndex]);
     return (react_1.default.createElement(modal_1.Modal, Object.assign({ size: 'fullscreen', onClose: onClose }, { withScrollDisable, scrollDisableOptions }),
         react_1.default.createElement(modal_1.Modal.Header, { onClose: onClose }),

package/desktop/components/gallery-modal/components/image-overlay.js

@@ -20,6 +20,6 @@ const classnames_1 = __importDefault(require("classnames"));
 const image_overlay_module_scss_1 = __importDefault(require("./image-overlay.module.scss"));
 const ImageOverlay = (_a) => {
     var { className, children } = _a, restProps = __rest(_a, ["className", "children"]);
-    return (react_1.default.createElement("div", Object.assign({ className: classnames_1.default(image_overlay_module_scss_1.default.root, className) }, restProps), children));
+    return (react_1.default.createElement("div", Object.assign({ className: (0, classnames_1.default)(image_overlay_module_scss_1.default.root, className) }, restProps), children));
 };
 exports.ImageOverlay = ImageOverlay;

package/desktop/components/gallery-modal/components/review-info.js

@@ -9,7 +9,7 @@ const link_1 = require("@sima-land/ui-nucleons/link");
 const rating_1 = require("@sima-land/ui-nucleons/rating");
 const classnames_1 = __importDefault(require("classnames"));
 const review_info_module_scss_1 = __importDefault(require("./review-info.module.scss"));
-const ReviewInfo = ({ rating, author, onGoToReview, className }) => (react_1.default.createElement("div", { className: classnames_1.default(review_info_module_scss_1.default.root, className) },
+const ReviewInfo = ({ rating, author, onGoToReview, className }) => (react_1.default.createElement("div", { className: (0, classnames_1.default)(review_info_module_scss_1.default.root, className) },
     react_1.default.createElement(rating_1.Rating, { value: rating }),
     react_1.default.createElement("div", { className: review_info_module_scss_1.default.author }, author),
     onGoToReview && (react_1.default.createElement(link_1.Link, { className: review_info_module_scss_1.default.link, pseudo: true, onClick: onGoToReview, "data-testid": 'gallery-modal:go-to-review-link' }, "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043A \u043E\u0442\u0437\u044B\u0432\u0443"))));

package/desktop/components/gallery-modal/utils.js

@@ -12,8 +12,8 @@ const on_1 = __importDefault(require("@sima-land/ui-nucleons/helpers/on"));
  * @return Загружены ли все фото.
  */
 const useImagesLoad = (srcList) => {
-    const [loadedCount, setLoadedCount] = react_1.useState(0);
-    react_1.useEffect(() => {
+    const [loadedCount, setLoadedCount] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
         srcList.forEach(src => {
             const image = new Image();
             image.onload = () => setLoadedCount(c => c + 1);
@@ -31,8 +31,8 @@ exports.useImagesLoad = useImagesLoad;
  * @return Размер или null.
  */
 const useRectFit = (areaRef, { correction }) => {
-    const [size, setSize] = react_1.useState(null);
-    react_1.useEffect(() => {
+    const [size, setSize] = (0, react_1.useState)(null);
+    (0, react_1.useEffect)(() => {
         const calcSquareSize = () => {
             if (areaRef.current) {
                 const availWidth = areaRef.current.clientWidth;
@@ -46,7 +46,7 @@ const useRectFit = (areaRef, { correction }) => {
             }
         };
         calcSquareSize();
-        return on_1.default(window, 'resize', () => window.requestAnimationFrame(calcSquareSize));
+        return (0, on_1.default)(window, 'resize', () => window.requestAnimationFrame(calcSquareSize));
     }, [areaRef]);
     return size;
 };

package/desktop/components/item-image/index.d.ts

@@ -60,7 +60,7 @@ export interface ItemImageProps {
  * @param {boolean} props.hasSelectionButton Признак наличия кнопки выделения товара.
  * @return {ReactElement} Компонент изображения.
  */
-export default class ItemImage extends Component<ItemImageProps, any> {
+export declare class ItemImage extends Component<ItemImageProps, any> {
     bootStartTime: any;
     image: any;
     imageWrapper: any;

package/desktop/components/item-image/index.js

@@ -22,12 +22,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ItemImage = void 0;
 const react_1 = __importStar(require("react"));
 const link_1 = require("@sima-land/ui-nucleons/link");
 const bind_1 = __importDefault(require("classnames/bind"));
 const lodash_1 = require("lodash");
 const item_image_module_scss_1 = __importDefault(require("./item-image.module.scss"));
 const badge_list_1 = require("../../../common/components/badge-list");
+const badge_1 = require("../../../common/components/badge");
 const eighteen_plus_svg_1 = __importDefault(require("../../../common/icons/eighteen-plus.svg"));
 const selected_svg_1 = __importDefault(require("../../../common/icons/selected.svg"));
 const wish_button_1 = require("../../../common/components/wish-button");
@@ -88,8 +90,8 @@ class ItemImage extends react_1.Component {
         this.state = {
             currentPhotoIndex: null,
         };
-        this.image = react_1.createRef();
-        this.imageWrapper = react_1.createRef();
+        this.image = (0, react_1.createRef)();
+        this.imageWrapper = (0, react_1.createRef)();
         this.bootStartTime = Date.now();
     }
     /**
@@ -98,7 +100,7 @@ class ItemImage extends react_1.Component {
     componentDidMount() {
         const img = this.image.current;
         const { onLoadImage } = this.props;
-        if (img && img.complete && lodash_1.isFunction(onLoadImage)) {
+        if (img && img.complete && (0, lodash_1.isFunction)(onLoadImage)) {
             onLoadImage(Date.now() - this.bootStartTime);
         }
     }
@@ -111,7 +113,7 @@ class ItemImage extends react_1.Component {
         const currentPhoto = currentPhotoIndex === null ? src : photos[currentPhotoIndex];
         return (react_1.default.createElement("div", { className: cx('wrapper', className), ref: this.imageWrapper, onMouseLeave: () => this.setState({ currentPhotoIndex: null }) },
             withBlur && (react_1.default.createElement("div", { className: cx('with-blur') },
-                react_1.default.createElement(eighteen_plus_svg_1.default, { width: 124, height: 124 }))),
+                react_1.default.createElement(eighteen_plus_svg_1.default, { width: 124, height: 124, opacity: '0.3' }))),
             react_1.default.createElement("div", { className: cx('image-wrapper') },
                 react_1.default.createElement(link_1.Link, { href: itemUrl },
                     Array.isArray(photos) && photos.length > 1 && !withBlur && this.imageWrapper.current && (react_1.default.createElement("div", { className: cx('fake-hover-wrapper', fakeDivClassName) }, photos.map((value, index) => (react_1.default.createElement("div", { className: cx('fake-hover', { selected: index === currentPhotoIndex }), style: {
@@ -123,11 +125,11 @@ class ItemImage extends react_1.Component {
                     withBlur ? (react_1.default.createElement("div", { className: cx('with-filter-blur'), children: this.getImage({ src: currentPhoto, alt }, onClick) })) : (this.getImage({ src: currentPhoto, alt }, onClick))),
                 hasTrashButton && (react_1.default.createElement(trash_cart_svg_1.default, { width: 24, height: 24, color: 'gray87', className: cx('icon', buttonsPos, trashButtonProps.className), onClick: trashButtonProps.onClick, "data-testid": 'item-image:remove-button' }))),
             Array.isArray(badges) && Boolean(badges.length) && (react_1.default.createElement("div", { className: cx('badges') },
-                react_1.default.createElement(badge_list_1.BadgeList, { items: badges }))),
+                react_1.default.createElement(badge_list_1.BadgeList, null, badges.map((badge, index) => (react_1.default.createElement(badge_1.Badge, Object.assign({ key: index }, badge))))))),
             hasWishButton && (react_1.default.createElement(wish_button_1.WishButton, { checked: wishProps.isWished, className: cx('icon', buttonsPos, hasTrashButton && 'as-second', wishProps.className), onClick: wishProps.onClick, disabled: isFetchingWishItems })),
             hasQuickPreview && (react_1.default.createElement(quick_view_button_1.QuickViewButton, { onClick: quickViewBtnProps.onClick, className: cx('icon', buttonsPos, (hasTrashButton || hasWishButton) && 'as-second', hasTrashButton && hasWishButton && 'as-third', quickViewBtnProps.className) })),
             hasSelectionButton && selectionProps && (react_1.default.createElement("div", { onClick: selectionProps.onSelect, className: cx('selection-container') },
                 react_1.default.createElement("div", { className: cx('selection-circle') }, selectionProps.isSelected && react_1.default.createElement(selected_svg_1.default, { width: 56, height: 56 }))))));
     }
 }
-exports.default = ItemImage;
+exports.ItemImage = ItemImage;

package/desktop/components/modifiers/button/index.js

@@ -33,9 +33,9 @@ const typesList = Object.values(constants_1.MODIFIERS_TYPES);
 /**
  * Компонент модификатора.
  */
-exports.ModifierButton = react_1.forwardRef(function ModifierButton({ count = null, content, selected, color, image, type: typeProp = 'text', className, onClick, isMarkdown: hasMarkdown, squared = [constants_1.MODIFIERS_TYPES.color, constants_1.MODIFIERS_TYPES.image].includes(typeProp), 'data-testid': testId = 'modifier-button', }, ref) {
+exports.ModifierButton = (0, react_1.forwardRef)(function ModifierButton({ count = null, content, selected, color, image, type: typeProp = 'text', className, onClick, isMarkdown: hasMarkdown, squared = [constants_1.MODIFIERS_TYPES.color, constants_1.MODIFIERS_TYPES.image].includes(typeProp), 'data-testid': testId = 'modifier-button', }, ref) {
     const type = typesList.includes(typeProp) ? typeProp : 'text';
-    const hasCount = lodash_1.isNumber(count) && count >= 0;
+    const hasCount = (0, lodash_1.isNumber)(count) && count >= 0;
     return (react_1.default.createElement("div", { ref: ref, className: cx('modifier-button', squared && 'squared', selected && 'selected', className), style: color ? { background: color } : undefined, onClick: onClick, "data-testid": testId },
         (hasCount || hasMarkdown) && (react_1.default.createElement("span", { className: cx('label', hasCount && 'with-count'), "data-testid": 'modifier-button:badge' },
             hasCount && (count > 99 ? '99+' : count),

package/desktop/components/modifiers/group/index.js

@@ -48,13 +48,13 @@ const createHiddenNodeIndexFinder = (container) => (childNode) => {
     return childOffsetTop - container.offsetTop >= container.clientHeight;
 };
 exports.createHiddenNodeIndexFinder = createHiddenNodeIndexFinder;
-const defaultGetItemType = prop_1.default('type');
-const defaultGetItemCount = prop_1.default('count');
-const defaultGetItemColor = prop_1.default('color');
-const defaultGetItemContent = prop_1.default('content');
-const defaultIsSelectedItem = prop_1.default('selected');
-const defaultGetItemImage = prop_1.default('image');
-const defaultGetIsMarkdown = prop_1.default('isMarkdown');
+const defaultGetItemType = (0, prop_1.default)('type');
+const defaultGetItemCount = (0, prop_1.default)('count');
+const defaultGetItemColor = (0, prop_1.default)('color');
+const defaultGetItemContent = (0, prop_1.default)('content');
+const defaultIsSelectedItem = (0, prop_1.default)('selected');
+const defaultGetItemImage = (0, prop_1.default)('image');
+const defaultGetIsMarkdown = (0, prop_1.default)('isMarkdown');
 /**
  * Возвращает компонент списка модификаторов.
  * @param {Object} props Свойства компонента.
@@ -82,12 +82,12 @@ class ModifiersGroup extends react_1.Component {
             lastVisibleChildIndex: null,
         };
         this.windowWidth = 0;
-        this.containerRef = react_1.createRef();
-        this.showingButtonRef = react_1.createRef();
+        this.containerRef = (0, react_1.createRef)();
+        this.showingButtonRef = (0, react_1.createRef)();
         /**
          * Сбрасывает информацию о видимых и невидимых дочерних узлах контейнера.
          */
-        this.resetVisibleNodesData = lodash_1.debounce(() => {
+        this.resetVisibleNodesData = (0, lodash_1.debounce)(() => {
             if (document.documentElement.offsetWidth !== this.windowWidth) {
                 this.windowWidth = document.documentElement.offsetWidth;
                 this.setState({
@@ -107,7 +107,7 @@ class ModifiersGroup extends react_1.Component {
                 const showingButtonEl = this.showingButtonRef.current;
                 if (containerEl && showingButtonEl) {
                     const childList = [...containerEl.children];
-                    const firstHiddenNodeIndex = childList.findIndex(exports.createHiddenNodeIndexFinder(containerEl));
+                    const firstHiddenNodeIndex = childList.findIndex((0, exports.createHiddenNodeIndexFinder)(containerEl));
                     if (firstHiddenNodeIndex !== -1) {
                         const lastVisibleElIndex = firstHiddenNodeIndex - 1;
                         const lastVisibleNode = childList[lastVisibleElIndex];
@@ -143,7 +143,7 @@ class ModifiersGroup extends react_1.Component {
      */
     componentDidMount() {
         this.windowWidth = document.documentElement.offsetWidth;
-        this.removeGlobalListener = on_1.default(window, 'resize', this.resetVisibleNodesData);
+        this.removeGlobalListener = (0, on_1.default)(window, 'resize', this.resetVisibleNodesData);
         this.checkVisibleNodes();
     }
     /**

package/desktop/components/modifiers/widget/index.js

@@ -27,9 +27,9 @@ const ModifiersWidget = ({ title, items, sizesTableUrl, onSelectItem, }) => (rea
         " (",
         items.length,
         "\u00A0",
-        get_declination_1.default(items.length, ['вариант', 'варианта', 'вариантов']),
+        (0, get_declination_1.default)(items.length, ['вариант', 'варианта', 'вариантов']),
         "):")),
-    react_1.default.createElement(group_1.ModifiersGroup, { items: items, getItemContent: prop_1.default('name'), getItemCount: prop_1.default('inCartQty'), onSelectItem: (item, selected) => {
+    react_1.default.createElement(group_1.ModifiersGroup, { items: items, getItemContent: (0, prop_1.default)('name'), getItemCount: (0, prop_1.default)('inCartQty'), onSelectItem: (item, selected) => {
             !selected && onSelectItem && onSelectItem(item);
         } }),
     Boolean(sizesTableUrl) && (react_1.default.createElement(link_1.Link, { href: sizesTableUrl, className: cx('modifiers-link') }, "\u0422\u0430\u0431\u043B\u0438\u0446\u0430 \u0440\u0430\u0437\u043C\u0435\u0440\u043E\u0432"))));

package/desktop/components/person-modal/index.d.ts

@@ -36,4 +36,3 @@ export interface PersonModalProps {
  * @return Элемент.
  */
 export declare const PersonModal: ({ name, appointment, photoUrl, email, skype, social, phoneHref, phoneText, secondPhoneHref, secondPhoneText, arbitraryLinkProps, onClose, withScrollDisable, scrollDisableOptions, }: PersonModalProps) => JSX.Element;
-export default PersonModal;

package/desktop/components/person-modal/index.js

@@ -21,7 +21,7 @@ const cx = bind_1.default.bind(person_modal_module_scss_1.default);
  * @return Элемент.
  */
 const PersonModal = ({ name, appointment, photoUrl, email, skype, social, phoneHref, phoneText, secondPhoneHref, secondPhoneText, arbitraryLinkProps, onClose, withScrollDisable, scrollDisableOptions, }) => {
-    keydown_1.useKeydown('Escape', onClose);
+    (0, keydown_1.useKeydown)('Escape', onClose);
     return (react_1.default.createElement(modal_1.Modal, { size: 's', withScrollDisable: withScrollDisable, scrollDisableOptions: scrollDisableOptions, onClose: onClose },
         react_1.default.createElement(modal_1.Modal.Body, null,
             react_1.default.createElement("div", { className: cx('main') },
@@ -53,4 +53,3 @@ const PersonModal = ({ name, appointment, photoUrl, email, skype, social, phoneH
                 react_1.default.createElement(clean_buttons_1.Clean.Button, { onClick: onClose }, "\u0417\u0430\u043A\u0440\u044B\u0442\u044C")))));
 };
 exports.PersonModal = PersonModal;
-exports.default = exports.PersonModal;