@sima-land/moleculas 13.2.3 → 14.0.0

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

@@ -1,56 +0,0 @@
-import React, { Component } from 'react';
-import { BadgeProps } from '../../../common/components/badge';
-export interface ItemImageProps {
-    src?: string;
-    alt?: string;
-    hasWishButton?: boolean;
-    wishProps?: {
-        isWished?: boolean;
-        className?: string;
-        onClick?: React.MouseEventHandler;
-    };
-    className?: string;
-    onClick?: React.MouseEventHandler;
-    badges?: BadgeProps[];
-    withBlur?: boolean;
-    itemUrl?: string;
-    isFetchingWishItems?: boolean;
-    onLoadImage?: (duration: number) => void;
-}
-/**
- * Компонент изображения товара с избранным.
- * @param props Свойства компонента.
- * @param props.src Ссылка на изображение.
- * @param props.alt Alt для изображения.
- * @param props.className Дополнительный класс для компонента.
- * @param props.onClick Обработчик клика по картинке.
- * @param props.badges Шильдики.
- * @param props.wishProps Свойства для избранного.
- * @param props.withBlur Добавление блюра.
- * @param props.isFetchingWishItems Признак загрузки добавления товара в список избранного.
- */
-export declare class ItemImage extends Component<ItemImageProps> {
-    bootStartTime: number;
-    image: any;
-    /**
-     * @inheritdoc
-     */
-    constructor(props: any);
-    /**
-     * @inheritdoc
-     */
-    componentDidMount(): void;
-    /**
-     * Возвращает фото.
-     * @param {Object} image Данные изображения.
-     * @param {string} image.src Url изображения.
-     * @param {string} image.alt Alt изображения.
-     * @param {Function} onClick Колбэк на клик по изображению.
-     * @return {Object} Свойства для компонента.
-     */
-    getImage: ({ src, alt }: any, onClick: any) => JSX.Element;
-    /**
-     * @inheritdoc
-     */
-    render(): JSX.Element;
-}

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

@@ -1,88 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-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 badge_list_1 = require("../../../common/components/badge-list");
-const badge_1 = require("../../../common/components/badge");
-const wish_button_1 = require("../../../common/components/wish-button");
-const eighteen_plus_svg_1 = __importDefault(require("../../../common/icons/eighteen-plus.svg"));
-const bind_1 = __importDefault(require("classnames/bind"));
-const item_image_module_scss_1 = __importDefault(require("./item-image.module.scss"));
-const cx = bind_1.default.bind(item_image_module_scss_1.default);
-/**
- * Компонент изображения товара с избранным.
- * @param props Свойства компонента.
- * @param props.src Ссылка на изображение.
- * @param props.alt Alt для изображения.
- * @param props.className Дополнительный класс для компонента.
- * @param props.onClick Обработчик клика по картинке.
- * @param props.badges Шильдики.
- * @param props.wishProps Свойства для избранного.
- * @param props.withBlur Добавление блюра.
- * @param props.isFetchingWishItems Признак загрузки добавления товара в список избранного.
- */
-class ItemImage extends react_1.Component {
-    /**
-     * @inheritdoc
-     */
-    constructor(props) {
-        super(props);
-        /**
-         * Возвращает фото.
-         * @param {Object} image Данные изображения.
-         * @param {string} image.src Url изображения.
-         * @param {string} image.alt Alt изображения.
-         * @param {Function} onClick Колбэк на клик по изображению.
-         * @return {Object} Свойства для компонента.
-         */
-        this.getImage = ({ src, alt }, onClick) => (react_1.default.createElement("img", { className: cx('image'), src: src, alt: alt, ref: this.image, onClick: onClick }));
-        this.image = (0, react_1.createRef)();
-        this.bootStartTime = Date.now();
-    }
-    /**
-     * @inheritdoc
-     */
-    componentDidMount() {
-        const img = this.image.current;
-        const { onLoadImage } = this.props;
-        img && img.complete && (onLoadImage === null || onLoadImage === void 0 ? void 0 : onLoadImage(Date.now() - this.bootStartTime));
-    }
-    /**
-     * @inheritdoc
-     */
-    render() {
-        const { src, alt, hasWishButton, wishProps, className, onClick, badges, withBlur, itemUrl, isFetchingWishItems, } = this.props;
-        return (react_1.default.createElement("div", { className: cx('wrapper', className) },
-            withBlur && (react_1.default.createElement("div", { className: cx('with-blur') },
-                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 }, withBlur ? (react_1.default.createElement("div", { className: cx('with-filter-blur'), children: this.getImage({ src, alt }, onClick) })) : (this.getImage({ src, alt }, onClick)))),
-            Array.isArray(badges) && Boolean(badges.length) && !withBlur && (react_1.default.createElement("div", { className: cx('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 === null || wishProps === void 0 ? void 0 : wishProps.isWished, className: wishProps === null || wishProps === void 0 ? void 0 : wishProps.className, onClick: wishProps === null || wishProps === void 0 ? void 0 : wishProps.onClick, disabled: isFetchingWishItems }))));
-    }
-}
-exports.ItemImage = ItemImage;

package/mobile/components/item-image/item-image.module.scss

@@ -1,79 +0,0 @@
-.wrapper {
-  min-width: 1px;
-  position: relative;
-  display: flex;
-  flex-flow: column;
-  &.row {
-    .image-wrapper {
-      min-height: 108px;
-      @media (min-width: 600px) {
-        min-height: 200px;
-      }
-      @media (min-width: 960px) {
-        min-height: 256px;
-      }
-    }
-    .badges {
-      margin-top: 4px;
-    }
-  }
-}
-
-.image-wrapper {
-  background: #fafafa;
-  overflow: hidden;
-  position: relative;
-  box-sizing: border-box;
-  padding-bottom: 100%;
-  height: 0;
-  .with-filter-blur {
-    filter: blur(24px);
-  }
-  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-    a {
-      display: block;
-      position: relative;
-    }
-    a::before {
-      content: '';
-      display: block;
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background-color: rgba(0, 0, 0, 0.04);
-    }
-  }
-}
-
-.badges {
-  margin-top: 4px;
-  margin-bottom: 8px;
-}
-
-.image {
-  display: block;
-  filter: brightness(96%);
-  width: 100%;
-  height: auto;
-  font-size: 14px;
-  min-height: 1px;
-  min-width: 1px;
-}
-
-.with-blur {
-  position: absolute;
-  top: -5px;
-  left: -5px;
-  width: calc(100% + 10px);
-  height: calc(100% + 10px);
-  background: rgba(255, 255, 255, 0.5);
-  z-index: 10;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-    background: rgba(255, 255, 255, 0.95);
-  }
-}