@sima-land/moleculas 15.2.0 → 15.3.1

package/common/components/badge/index.js

@@ -47,7 +47,7 @@ const cx = bind_1.default.bind(badge_module_scss_1.default);
 exports.Badge = (0, react_1.forwardRef)(function Badge(_a, ref) {
     var { className, color, fields, href, style, 'data-testid': testId = 'badge' } = _a, restProps = __rest(_a, ["className", "color", "fields", "href", "style", 'data-testid']);
     const iconOnly = fields.length === 1 && fields[0].type === 'svg-url';
-    return (react_1.default.createElement("a", Object.assign({ ref: ref }, restProps, { "data-testid": testId, href: href, style: Object.assign(Object.assign({}, style), { '--badge-color': color }), className: cx('root', iconOnly && 'icon-only', href && 'interactive', className), children: iconOnly ? (react_1.default.createElement("img", { className: cx('icon'), src: fields[0].value })) : (
+    return (react_1.default.createElement("a", Object.assign({ ref: ref }, restProps, { "data-testid": testId, href: href, style: Object.assign(Object.assign({}, style), { '--badge-color': color }), className: cx('root', iconOnly && 'icon-only', href && 'interactive', className), children: iconOnly ? (react_1.default.createElement("img", { className: cx('icon'), src: fields[0].value, alt: '' })) : (
         // вложенный span нужен для того чтобы объединить `display: inline-flex` и `text-overflow: ellipsis`
         react_1.default.createElement("span", { className: cx('content') }, fields.reduce((acc, item, i) => {
             let result = null;

package/common/components/badge-list/index.js

@@ -33,10 +33,10 @@ const cx = bind_1.default.bind(badge_list_module_scss_1.default);
  * @param props Свойства компонента.
  * @return Элемент.
  */
-const BadgeList = ({ children, className, lineLimit, style }) => (react_1.default.createElement("div", { className: cx('root', className, lineLimit && 'line-limit'), style: lineLimit ? Object.assign(Object.assign({}, style), { '--line-limit': lineLimit }) : style }, react_1.Children.toArray(children).map(child => {
+const BadgeList = ({ children, className, lineLimit, style }) => (react_1.default.createElement("div", { className: cx('root', className, lineLimit && 'line-limit'), style: lineLimit ? Object.assign(Object.assign({}, style), { '--line-limit': lineLimit }) : style }, react_1.Children.toArray(children).map((child, index) => {
     switch (true) {
         case (0, react_1.isValidElement)(child) && child.type === badge_1.Badge:
-            return react_1.default.createElement(BadgeListSlot, null, child);
+            return react_1.default.createElement(BadgeListSlot, { key: index }, child);
         case (0, react_1.isValidElement)(child) && child.type === BadgeListSlot:
             return child;
         default:

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

@@ -15,19 +15,21 @@ exports.UNAVAILABLE_REASON = {
     onlyForLegalEntities: 'Товар доступен только для юридических лиц',
 };
 const ProductInfo = ({ restriction, children }) => {
-    const { image, badges, prices, title, trademark, footer } = (0, define_slots_1.defineSlots)(children, {
+    const { image, badges, prices, title, trademark, footer, secondaryInfo } = (0, define_slots_1.defineSlots)(children, {
         image: parts_1.Parts.Image,
         badges: parts_1.Parts.Badges,
         prices: parts_1.Parts.Prices,
         title: parts_1.Parts.Title,
         trademark: parts_1.Parts.TrademarkLink,
         footer: parts_1.Parts.Footer,
+        secondaryInfo: parts_1.Parts.SecondaryInfo,
     });
     return (react_1.default.createElement(utils_1.ProductInfoContext.Provider, { value: { restriction } },
         image,
         restriction !== 'adult' && badges,
         prices,
         title,
+        restriction !== 'adult' && secondaryInfo,
         !restriction && trademark,
         footer));
 };

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

@@ -1,5 +1,6 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { LinkProps } from '@sima-land/ui-nucleons/link';
+import { HintProps } from '@sima-land/ui-nucleons/hint';
 import { StrokedSVGProps } from '@sima-land/ui-nucleons/stroked-svg';
 import { BadgeListProps } from '../badge-list';
 export interface ImageProps {
@@ -10,14 +11,22 @@ export interface ImageProps {
     children?: React.ReactNode;
     opacity?: number;
 }
+declare function SecondaryInfo({ children }: {
+    children: ReactNode;
+}): JSX.Element;
 export declare const Parts: {
     readonly Image: ({ src, alt, href, onClick, children, opacity }: ImageProps) => JSX.Element;
-    readonly ImageButton: ({ icon, fill, onClick, hint, "data-testid": testId, }: {
+    readonly ImageButton: ({ icon, fill, onClick, hint, hintDirection, "data-testid": testId, position, }: {
         icon: StrokedSVGProps['component'];
         fill?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
         hint?: string | undefined;
+        hintDirection?: ("left" | "right" | "bottom" | "top") | undefined;
         'data-testid'?: string | undefined;
+        position?: {
+            x: 'left' | 'right';
+            y: 'top' | 'bottom';
+        } | undefined;
     }) => JSX.Element;
     readonly Badges: (props: BadgeListProps) => JSX.Element;
     readonly Prices: ({ price, oldPrice, currencyGrapheme, unavailableReason, }: {
@@ -28,6 +37,7 @@ export declare const Parts: {
     }) => JSX.Element;
     readonly Title: ({ children, href, onClick }: Pick<LinkProps, 'children' | 'href' | 'onClick'>) => JSX.Element;
     readonly TrademarkLink: ({ href, children, onClick, }: Pick<LinkProps, 'href' | 'children' | 'onClick'>) => JSX.Element;
+    readonly SecondaryInfo: typeof SecondaryInfo;
     readonly Footer: React.FC<{}>;
     readonly FooterContext: React.Context<{
         className?: string | undefined;
@@ -42,3 +52,4 @@ export declare const Parts: {
     readonly WaitListAddButton: ({ className, ...props }: LinkProps) => JSX.Element;
     readonly WaitListAddedLink: ({ className, ...props }: LinkProps) => JSX.Element;
 };
+export {};

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

@@ -51,17 +51,17 @@ const cx = bind_1.default.bind(product_info_module_scss_1.default);
  * @param props Свойства.
  * @return Элемент.
  */
-const ImageButton = ({ icon, fill, onClick, hint, 'data-testid': testId, }) => {
+const ImageButton = ({ icon, fill, onClick, hint, hintDirection = 'left', 'data-testid': testId, position, }) => {
     const commonProps = {
         role: 'banner',
         component: icon,
         fill,
         strokeWidth: 1.5,
-        className: cx('image-button'),
+        className: cx('image-button', position && 'positioned', position && `${position.x}-${position.y}`),
         onClick,
         'data-testid': testId,
     };
-    return hint ? (react_1.default.createElement(with_hint_1.WithHint, { hint: hint, direction: 'left' }, (ref, toggle) => (react_1.default.createElement(stroked_svg_1.StrokedSVG, Object.assign({}, commonProps, { ref: ref, onMouseEnter: () => toggle(true), onMouseLeave: () => toggle(false) }))))) : (react_1.default.createElement(stroked_svg_1.StrokedSVG, Object.assign({}, commonProps)));
+    return hint ? (react_1.default.createElement(with_hint_1.WithHint, { hint: hint, direction: hintDirection }, (ref, toggle) => (react_1.default.createElement(stroked_svg_1.StrokedSVG, Object.assign({}, commonProps, { ref: ref, onMouseEnter: () => toggle(true), onMouseLeave: () => toggle(false) }))))) : (react_1.default.createElement(stroked_svg_1.StrokedSVG, Object.assign({}, commonProps)));
 };
 /**
  * Слот - изображение товара.
@@ -165,6 +165,9 @@ const WaitListAddedLink = (_a) => {
             '\u00A0',
             "\u043E\u0436\u0438\u0434\u0430\u043D\u0438\u044F")));
 };
+function SecondaryInfo({ children }) {
+    return react_1.default.createElement("div", { className: cx('secondary-info') }, children);
+}
 exports.Parts = {
     // основные компоненты-слоты и компоненты-запчасти
     Image,
@@ -173,6 +176,7 @@ exports.Parts = {
     Prices,
     Title,
     TrademarkLink,
+    SecondaryInfo,
     // компоненты-слоты и компоненты-запчасти, предназначенные для вывода футера (dcе что ниже ссылки на торговую марку)
     Footer,
     FooterContext,

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

@@ -63,6 +63,8 @@
 }
 
 .image-button {
+  width: 24px;
+  height: 24px;
   display: block;
   border: 0;
   outline: 0;
@@ -71,13 +73,39 @@
   --gutter: 8px;
   right: var(--gutter);
   cursor: pointer;
-  &:nth-child(1) {
+  &:not(.positioned) {
+    &:nth-child(1) {
+      top: var(--gutter);
+    }
+    &:nth-child(2) {
+      bottom: var(--gutter);
+    }
+    &:nth-child(3) {
+      top: var(--gutter);
+      left: var(--gutter);
+    }
+    &:nth-child(3) {
+      top: var(--gutter);
+      left: var(--gutter);
+    }
+  }
+  &.left-top {
+    left: var(--gutter);
     top: var(--gutter);
   }
-  &:nth-child(2) {
+  &.left-bottom {
+    left: var(--gutter);
     bottom: var(--gutter);
   }
-  &:nth-child(n + 3) {
+  &.right-top {
+    right: var(--gutter);
+    top: var(--gutter);
+  }
+  &.right-bottom {
+    right: var(--gutter);
+    bottom: var(--gutter);
+  }
+  &:nth-child(n + 5) {
     display: none;
   }
   &:hover {
@@ -143,6 +171,13 @@
   color: colors.$basic-gray87;
 }
 
+.secondary-info {
+  margin-top: 8px;
+  font-size: 14px;
+  line-height: 20px;
+  color: colors.$basic-gray38;
+}
+
 .trademark-link {
   display: block;
   margin-top: 8px;

package/desktop/components/breadcrumbs/index.js

@@ -55,7 +55,7 @@ const Breadcrumb = ({ data, onSiblingsPopupOpen, isSiblingActive, }) => {
             return (0, on_1.default)(window, 'mousedown', togglePopup.bind(null, false));
         }
     }, [withPopup]);
-    const selfName = (react_1.default.createElement(link_1.Link, { color: 'basic-gray87', href: data.url }, data.name));
+    const selfName = (react_1.default.createElement(link_1.Link, { color: 'basic-gray87', href: data.url, pseudo: !data.url }, data.name));
     return (react_1.default.createElement("div", { "data-testid": 'breadcrumb', className: cx('breadcrumb') },
         selfName,
         data.siblings && (react_1.default.createElement(react_1.default.Fragment, null,

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

@@ -42,7 +42,12 @@ const ReviewInfo = ({ rating, author, onGoToReview, content, className, notAffec
             setClamped(contentEl.scrollHeight > contentEl.clientHeight);
         }
     }, [opened]);
+    (0, react_1.useEffect)(() => {
+        setClamped(false);
+        setOpened(false);
+    }, [content, author]);
     (0, react_1.useEffect)(checkClamp, [content, opened]);
+    // @todo что делать если при изменении размеров изменилось состояние обрезания?
     (0, react_1.useEffect)(() => (0, on_1.default)(window, 'resize', checkClamp), [content, checkClamp]);
     return (react_1.default.createElement("div", { className: cx('root', className, opened && shadows_1.BoxShadow.z2straight) },
         loading && (react_1.default.createElement(Layout, null,

package/mobile/components/breadcrumbs/index.d.ts

@@ -2,7 +2,7 @@
 export interface BreadcrumbsProps {
     items: {
         name: string;
-        url: string;
+        url?: string;
     }[];
 }
 export declare const Breadcrumbs: ({ items }: BreadcrumbsProps) => JSX.Element;

package/mobile/components/breadcrumbs/index.js

@@ -7,5 +7,5 @@ exports.Breadcrumbs = void 0;
 const link_1 = require("@sima-land/ui-nucleons/link");
 const react_1 = __importDefault(require("react"));
 const breadcrumbs_module_scss_1 = __importDefault(require("./breadcrumbs.module.scss"));
-const Breadcrumbs = ({ items }) => (react_1.default.createElement("nav", { className: breadcrumbs_module_scss_1.default.root }, items.map((item, index) => (react_1.default.createElement(link_1.Link, { key: index, href: item.url, color: 'basic-gray87', className: breadcrumbs_module_scss_1.default.item }, item.name)))));
+const Breadcrumbs = ({ items }) => (react_1.default.createElement("nav", { className: breadcrumbs_module_scss_1.default.root }, items.map((item, index) => (react_1.default.createElement(link_1.Link, { key: index, href: item.url, pseudo: !item.url, color: 'basic-gray87', className: breadcrumbs_module_scss_1.default.item, "data-testid": 'breadcrumb' }, item.name)))));
 exports.Breadcrumbs = Breadcrumbs;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sima-land/moleculas",
-  "version": "15.2.0",
+  "version": "15.3.1",
   "repository": "ssh://git@github.com:sima-land/moleculas.git",
   "author": "www.sima-land.ru team",
   "license": "Apache-2.0",