@sima-land/moleculas 12.0.0 → 12.1.0

package/desktop/components/product-card/product-card.module.scss

@@ -9,6 +9,7 @@
   position: absolute;
   top: 8px;
   right: 8px;
+  cursor: pointer;
 }
 
 .control-wrapper {

package/desktop/components/promotion-card/index.d.ts

@@ -15,4 +15,7 @@ export interface PromotionCardProps extends React.HTMLAttributes<HTMLDivElement>
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const PromotionCard: ({ promotionType, href, imageSrc, title, subtitle, dueDate, volumeDiscount, postfix, className, ...restProps }: PromotionCardProps) => JSX.Element;
+export declare const PromotionCard: {
+    ({ promotionType, href, imageSrc, title, subtitle, dueDate, volumeDiscount, postfix, className, ...restProps }: PromotionCardProps): JSX.Element;
+    Placeholder: (props: React.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+};

package/desktop/components/promotion-card/index.js

@@ -40,6 +40,7 @@ const estimate_1 = require("./estimate");
 const watch_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/watch"));
 const classnames_1 = __importDefault(require("classnames"));
 const index_module_scss_1 = __importDefault(require("./index.module.scss"));
+const placeholder_1 = require("./placeholder");
 const PromotionName = {
     gift: 'Подарок',
     special: 'Спецпредложение',
@@ -77,3 +78,4 @@ const PromotionCard = (_a) => {
                     postfix && (react_1.default.createElement("div", { className: index_module_scss_1.default.postfix }, postfix)))))));
 };
 exports.PromotionCard = PromotionCard;
+exports.PromotionCard.Placeholder = placeholder_1.PromotionCardPlaceholder;

package/desktop/components/promotion-card/index.module.scss

@@ -1,5 +1,6 @@
 @use 'node_modules/@sima-land/ui-nucleons/colors';
 @use 'node_modules/@sima-land/ui-nucleons/breakpoints';
+@use './variables';
 @import 'node_modules/@sima-land/ui-nucleons/styling/shadows.module';
 
 .root {
@@ -24,7 +25,7 @@
 .banner {
   position: relative;
   width: 100%;
-  padding-top: calc(100% * (488 / 656)); // соотношение сторон по гайдам
+  padding-top: variables.$banner-height;
   background: colors.$gray8;
   border-radius: 8px 8px 0 0;
   overflow: hidden;

package/desktop/components/promotion-card/placeholder.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+/**
+ * Компонент отображения состояния загрузки карточки акции.
+ * @param props Свойства div.
+ * @return Элемент.
+ */
+export declare const PromotionCardPlaceholder: (props: React.HTMLAttributes<HTMLDivElement>) => JSX.Element;

package/desktop/components/promotion-card/placeholder.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PromotionCardPlaceholder = void 0;
+const react_1 = __importDefault(require("react"));
+const placeholder_module_scss_1 = __importDefault(require("./placeholder.module.scss"));
+const classnames_1 = __importDefault(require("classnames"));
+/**
+ * Компонент отображения состояния загрузки карточки акции.
+ * @param props Свойства div.
+ * @return Элемент.
+ */
+const PromotionCardPlaceholder = (props) => (react_1.default.createElement("div", Object.assign({}, props),
+    react_1.default.createElement("div", { className: classnames_1.default(placeholder_module_scss_1.default.part, placeholder_module_scss_1.default.banner) }),
+    react_1.default.createElement("div", { className: classnames_1.default(placeholder_module_scss_1.default.part, placeholder_module_scss_1.default.text) }),
+    react_1.default.createElement("div", { className: classnames_1.default(placeholder_module_scss_1.default.part, placeholder_module_scss_1.default.text) })));
+exports.PromotionCardPlaceholder = PromotionCardPlaceholder;

package/desktop/components/promotion-card/placeholder.module.scss

@@ -0,0 +1,18 @@
+@use 'node_modules/@sima-land/ui-nucleons/colors';
+@use './variables';
+
+.part {
+  background: colors.$gray4;
+  border-radius: 4px;
+  & + & {
+    margin-top: 12px;
+  }
+}
+
+.banner {
+  padding-top: variables.$banner-height;
+}
+
+.text {
+  height: 48px;
+}

package/desktop/components/promotion-card/variables.scss

@@ -0,0 +1,2 @@
+// соотношение сторон баннера по гайдам
+$banner-height: calc(100% * (488 / 656));

package/package.json

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