@salutejs/plasma-new-hope 0.384.0-dev.0 → 0.385.0-dev.0

package/dist/css/cjs/index.js

@@ -2,9 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./engines/index.js');
-var index$1 = require('./utils/index.js');
-var index$2 = require('./components/ButtonBase/index.js');
+var index = require('./plasmaCore/index.js');
+var index$1 = require('./engines/index.js');
+var index$2 = require('./utils/index.js');
+var index$3 = require('./components/ButtonBase/index.js');
 var applyBlur = require('./mixins/applyBlur.js');
 var applyEllipsis = require('./mixins/applyEllipsis.js');
 var applySpacing = require('./mixins/applySpacing.js');
@@ -179,7 +180,7 @@ var Indicator = require('./components/Indicator/Indicator.js');
 var Indicator_tokens = require('./components/Indicator/Indicator.tokens.js');
 var Grid = require('./components/Grid/Grid.js');
 var Grid_tokens = require('./components/Grid/Grid.tokens.js');
-var index$3 = require('./components/Grid/utils/index.js');
+var index$4 = require('./components/Grid/utils/index.js');
 var Row = require('./components/Grid/ui/Row/Row.js');
 var Col = require('./components/Grid/ui/Col/Col.js');
 var Progress = require('./components/Progress/Progress.js');
@@ -294,9 +295,10 @@ var UserMessage_tokens = require('./components/_ai/UserMessage/UserMessage.token
 
 
 
-exports.css = index.css;
-exports.cx = index$1.cx;
-exports.ButtonBase = index$2.ButtonBase;
+exports.plasmaCore = index;
+exports.css = index$1.css;
+exports.cx = index$2.cx;
+exports.ButtonBase = index$3.ButtonBase;
 exports.applyBlur = applyBlur.applyBlur;
 exports.blurs = applyBlur.blurs;
 exports.applyEllipsis = applyEllipsis.applyEllipsis;
@@ -637,7 +639,7 @@ exports.indicatorTokens = Indicator_tokens.tokens;
 exports.gridConfig = Grid.gridConfig;
 exports.gridRoot = Grid.gridRoot;
 exports.gridTokens = Grid_tokens.tokens;
-exports.getBaseGridView = index$3.getBaseGridView;
+exports.getBaseGridView = index$4.getBaseGridView;
 exports.Row = Row.Row;
 exports.Col = Col.Col;
 exports.progressConfig = Progress.progressConfig;

package/dist/css/cjs/plasmaCore/components/Badge/Badge.js

@@ -0,0 +1,71 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var styled = require('styled-components');
+var typography = require('../../utils/tokens/typography.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _excluded = ["size", "text", "contentLeft"];
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+/**
+ * Размеры в ремах.
+ */
+var badgeSizes = {
+  l: {
+    textMarginX: '0.25rem',
+    textMarginLeftAfterContent: '0.25rem'
+  },
+  s: {
+    textMarginX: '0.125rem',
+    textMarginLeftAfterContent: '0.125rem'
+  }
+};
+var badgeRootSizes = {
+  l: {
+    height: '1.5rem',
+    padding: '0.25rem',
+    minWidth: '1.5rem',
+    borderRadius: '0.75rem',
+    fontSize: '0.75rem'
+  },
+  s: {
+    height: '1rem',
+    padding: '0.125rem',
+    minWidth: '1rem',
+    borderRadius: '0.5rem',
+    fontSize: '0.625rem'
+  }
+};
+var StyledText = /*#__PURE__*/styled__default.default.span(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral([""])));
+var StyledContent = /*#__PURE__*/styled__default.default.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    display: flex;\n"])));
+var StyledBadge = /*#__PURE__*/styled__default.default.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    width: max-content;\n\n    ", ";\n"])), typography.caption, function (_ref) {
+  var size = _ref.size,
+    circled = _ref.circled;
+  return styled.css(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n        ", ";\n        ", "\n\n        ", " {\n            margin-left: ", ";\n            margin-right: ", ";\n        }\n\n        ", " ~ ", " {\n            margin-left: ", ";\n        }\n    "])), badgeRootSizes[size], circled && styled.css(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n                width: ", ";\n                padding-left: 0;\n                padding-right: 0;\n            "])), badgeRootSizes[size].minWidth), StyledText, badgeSizes[size].textMarginX, badgeSizes[size].textMarginX, StyledContent, StyledText, badgeSizes[size].textMarginLeftAfterContent);
+});
+/**
+ * Небольшая бирка для ячеек и карточек.
+ * Компонент может отображаться в нескольких размерах и цветах, может содержать текст и/или иконку.
+ */
+var Badge = function Badge(_ref2) {
+  var _ref2$size = _ref2.size,
+    size = _ref2$size === void 0 ? 'l' : _ref2$size,
+    text = _ref2.text,
+    contentLeft = _ref2.contentLeft,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded);
+  return /*#__PURE__*/React__default.default.createElement(StyledBadge, _rollupPluginBabelHelpers.extends({
+    size: size
+  }, rest), contentLeft && /*#__PURE__*/React__default.default.createElement(StyledContent, null, contentLeft), text && /*#__PURE__*/React__default.default.createElement(StyledText, null, text));
+};
+
+exports.Badge = Badge;
+exports.badgeRootSizes = badgeRootSizes;
+exports.badgeSizes = badgeSizes;

package/dist/css/cjs/plasmaCore/components/Button/Button.js

@@ -0,0 +1,79 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var styled = require('styled-components');
+var applyDisabled = require('../../utils/mixins/applyDisabled.js');
+var blur = require('../../utils/mixins/blur.js');
+var applyEllipsis = require('../../utils/mixins/applyEllipsis.js');
+var Spinner = require('../Spinner/Spinner.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+/**
+ * Корневой элемент для стилизации кнопки.
+ * Должен быть передан в функцию `createButton`.
+ */
+var ButtonRoot = /*#__PURE__*/styled__default.default.button(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    appearance: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    a& {\n        text-decoration: none;\n    }\n\n    &:focus {\n        outline: none;\n    }\n\n    ", "\n\n    ", "\n"])), function (_ref) {
+  var isLoading = _ref.$isLoading;
+  return !isLoading && applyDisabled.applyDisabled;
+}, blur.applyBlur);
+
+/**
+ * Элемент лоадера для кнопки.
+ */
+var ButtonLoader = /*#__PURE__*/styled__default.default.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    position: absolute;\n"])));
+
+/**
+ * Спиннер по умолчанию с фиксированной шириной.
+ */
+var StyledSpinner = /*#__PURE__*/styled__default.default(Spinner.Spinner)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    width: 1.375rem;\n"])));
+
+/**
+ * Обёртка для содержимого кнопки.
+ */
+var ButtonContentWrapper = /*#__PURE__*/styled__default.default.span(_templateObject4 || (_templateObject4 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    display: flex;\n    align-items: inherit;\n    justify-content: inherit;\n    width: 100%;\n\n    ", "\n"])), function (_ref2) {
+  var isLoading = _ref2.$isLoading;
+  return isLoading && 'opacity: 0;';
+});
+
+/**
+ * A text wrapping element, that used when `text` prop is passed.
+ * @private
+ */
+var ButtonText = /*#__PURE__*/styled__default.default.span(_templateObject5 || (_templateObject5 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    box-sizing: border-box;\n\n    ", "\n\n    ", "\n    ", "\n"])), applyEllipsis.applyEllipsis, function (_ref3) {
+  var isContentLeft = _ref3.$isContentLeft;
+  return isContentLeft && 'margin-left: 0.375rem;';
+}, function (_ref4) {
+  var isContentRight = _ref4.$isContentRight;
+  return isContentRight && 'margin-right: 0.375rem;';
+});
+
+/**
+ * Базовая кнопка.
+ * @deprecated
+ */
+var Button = /*#__PURE__*/React__default.default.forwardRef(
+// eslint-disable-next-line prefer-arrow-callback
+function Button(props, ref) {
+  return /*#__PURE__*/React__default.default.createElement(ButtonRoot, _rollupPluginBabelHelpers.extends({
+    ref: ref
+  }, props));
+});
+Button.defaultProps = {
+  pin: 'square-square',
+  outlined: false
+};
+
+exports.Button = Button;
+exports.ButtonContentWrapper = ButtonContentWrapper;
+exports.ButtonLoader = ButtonLoader;
+exports.ButtonRoot = ButtonRoot;
+exports.ButtonText = ButtonText;
+exports.StyledSpinner = StyledSpinner;

package/dist/css/cjs/plasmaCore/components/Button/Button.mixins.js

@@ -0,0 +1,45 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var styled = require('styled-components');
+var roundness = require('../../utils/utils/roundness.js');
+var addFocus = require('../../utils/mixins/addFocus.js');
+
+var _templateObject;
+/**
+ * Создание специализированного миксина со своими размерами и типографикой.
+ * @param {Record<string, object>} sizes
+ * @param {Record<string, object>} typos
+ */
+var getButtonSizesMixin = function getButtonSizesMixin(sizes, typos) {
+  return function (_ref) {
+    var size = _ref.size,
+      pin = _ref.pin,
+      outlined = _ref.outlined,
+      focused = _ref.focused,
+      isContentLeft = _ref.$isContentLeft,
+      isContentRight = _ref.$isContentRight,
+      shiftLeft = _ref.shiftLeft,
+      shiftRight = _ref.shiftRight,
+      square = _ref.square,
+      stretch = _ref.stretch,
+      theme = _ref.theme;
+    var paddingX = sizes[size].paddingX;
+    if (square) {
+      paddingX = sizes[size].paddingY;
+    } else if (stretch) {
+      paddingX = sizes[size].paddingStretchX;
+    } else if (isContentLeft || isContentRight) {
+      paddingX = sizes[size].paddingContentX;
+    }
+    return styled.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n        height: ", ";\n        padding: ", " ", ";\n        border-radius: ", ";\n\n        ", "\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n    "])), sizes[size].height, sizes[size].paddingY, paddingX, roundness.convertRoundnessMatrix(pin, sizes[size].radius, sizes[size].radiusCircle), stretch && 'width: 100%;', square && " width: ".concat(sizes[size].height, ";"), shiftLeft && "margin-left: calc(-1 * ".concat(paddingX, ");"), shiftRight && "margin-right: calc(-1 * ".concat(paddingX, ");"), typos[size], addFocus.addFocus(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, theme), {}, {
+      focused: focused,
+      outlined: outlined,
+      outlineRadius: roundness.convertRoundnessMatrix(pin, "calc(".concat(sizes[size].radius, " + var(--plasma-outline-size))"), "calc(".concat(sizes[size].radiusCircle, " + var(--plasma-outline-size))"))
+    })));
+  };
+};
+
+exports.getButtonSizesMixin = getButtonSizesMixin;

package/dist/css/cjs/plasmaCore/components/Button/Button.props.js

@@ -0,0 +1,66 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var applyView = require('../../utils/mixins/applyView.js');
+var typography = require('../../utils/tokens/typography.js');
+
+/**
+ * Цветовые виды.
+ */
+var buttonViews = {
+  primary: applyView.views.primary,
+  secondary: applyView.views.secondary,
+  success: applyView.views.success,
+  warning: applyView.views.warning,
+  critical: applyView.views.critical,
+  checked: applyView.views.checked,
+  overlay: applyView.views.overlay,
+  clear: applyView.views.clear
+};
+
+/**
+ * Размеры в rem в соответствии с дизайном.
+ */
+var buttonSizes = {
+  l: {
+    height: 'var(--plasma-button-l-height)',
+    paddingY: 'var(--plasma-button-l-padding-y)',
+    paddingX: 'var(--plasma-button-l-padding-x)',
+    paddingContentX: 'var(--plasma-button-l-padding-content-x)',
+    paddingStretchX: 'var(--plasma-button-l-padding-stretch-x)',
+    radius: 'var(--plasma-button-l-radius)',
+    radiusCircle: 'var(--plasma-button-l-radius-circle)'
+  },
+  m: {
+    height: 'var(--plasma-button-m-height)',
+    paddingY: 'var(--plasma-button-m-padding-y)',
+    paddingX: 'var(--plasma-button-m-padding-x)',
+    paddingContentX: 'var(--plasma-button-m-padding-content-x)',
+    paddingStretchX: 'var(--plasma-button-m-padding-stretch-x)',
+    radius: 'var(--plasma-button-m-radius)',
+    radiusCircle: 'var(--plasma-button-m-radius-circle)'
+  },
+  s: {
+    height: 'var(--plasma-button-s-height)',
+    paddingY: 'var(--plasma-button-s-padding-y)',
+    paddingX: 'var(--plasma-button-s-padding-x)',
+    paddingContentX: 'var(--plasma-button-s-padding-content-x)',
+    paddingStretchX: 'var(--plasma-button-s-padding-stretch-x)',
+    radius: 'var(--plasma-button-s-radius)',
+    radiusCircle: 'var(--plasma-button-s-radius-circle)'
+  }
+};
+
+/**
+ * Размеры типографики кнопки.
+ */
+var buttonTypography = {
+  l: typography.button1,
+  m: typography.button1,
+  s: typography.button2
+};
+
+exports.buttonSizes = buttonSizes;
+exports.buttonTypography = buttonTypography;
+exports.buttonViews = buttonViews;

package/dist/css/cjs/plasmaCore/components/Button/createButton.js

@@ -0,0 +1,59 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var Button = require('./Button.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var _excluded = ["children", "text", "contentLeft", "contentRight", "square", "deviceScale", "loader", "disabled", "isLoading", "type"];
+/**
+ * Функция для создания компонента Button,
+ * что дает возможность кастомизировать вид, пропсы и т.п.,
+ * при этом сохраняя в базе общий интерфейс.
+ */
+function createButton() {
+  var Root = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Button.ButtonRoot;
+  // eslint-disable-next-line prefer-arrow-callback
+  return /*#__PURE__*/React.forwardRef(function Button$1(_ref, ref) {
+    var children = _ref.children,
+      text = _ref.text,
+      contentLeft = _ref.contentLeft,
+      contentRight = _ref.contentRight,
+      square = _ref.square,
+      deviceScale = _ref.deviceScale,
+      _ref$loader = _ref.loader,
+      loader = _ref$loader === void 0 ? /*#__PURE__*/React__default.default.createElement(Button.StyledSpinner, {
+        color: "currentColor",
+        size: 56,
+        deviceScale: deviceScale
+      }) : _ref$loader,
+      disabled = _ref.disabled,
+      isLoading = _ref.isLoading,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'button' : _ref$type,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+    var isContentLeft = Boolean(contentLeft);
+    var isContentRight = Boolean(contentRight);
+    return /*#__PURE__*/React__default.default.createElement(Root, _rollupPluginBabelHelpers.extends({
+      ref: ref,
+      type: type,
+      $isContentLeft: isContentLeft,
+      $isContentRight: isContentRight,
+      $isLoading: isLoading,
+      disabled: isLoading || disabled,
+      square: square !== undefined ? square : !text && !children
+    }, rest), isLoading && /*#__PURE__*/React__default.default.createElement(Button.ButtonLoader, null, loader), /*#__PURE__*/React__default.default.createElement(Button.ButtonContentWrapper, {
+      $isLoading: isLoading
+    }, children, !children && contentLeft, !children && text && /*#__PURE__*/React__default.default.createElement(Button.ButtonText, {
+      $isContentLeft: isContentLeft,
+      $isContentRight: isContentRight
+    }, text), !children && contentRight));
+  });
+}
+
+exports.createButton = createButton;

package/dist/css/cjs/plasmaCore/components/Card/Card.js

@@ -0,0 +1,62 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var styled = require('styled-components');
+var Body = require('../Typography/Body.js');
+var applyDisabled = require('../../utils/mixins/applyDisabled.js');
+var applyRoundness = require('../../utils/mixins/applyRoundness.js');
+var colors = require('../../utils/tokens/colors.js');
+var addFocus = require('../../utils/mixins/addFocus.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _excluded = ["roundness", "children"];
+var _templateObject, _templateObject2, _templateObject3;
+
+// В этих константах задаем размеры в em, чтобы не зависеть напрямую от пикселей
+// В то же время в числителях - значения в пикселях, взятые из макета
+var fontSize = 16;
+var shadowOffset = 8 / fontSize;
+var shadowSize = 24 / fontSize;
+var outlineSize = 2 / fontSize;
+var DEFAULT_ROUNDNESS = 20;
+var StyledCard = /*#__PURE__*/styled__default.default(Body.Body1)(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", "\n    ", ";\n\n    position: relative;\n\n    display: flex;\n    box-sizing: border-box;\n    flex-direction: column;\n    flex-shrink: 0;\n\n    background: ", ";\n    box-shadow: 0 ", "em ", "em rgba(0, 0, 0, 0.1);\n\n    transition: ", ";\n\n    ", "\n"])), applyDisabled.applyDisabled, applyRoundness.applyRoundness, colors.surfaceCard, shadowOffset, shadowSize, function (_ref) {
+  var theme = _ref.theme;
+  return theme.lowPerformance ? 'unset' : 'transform 0.4s ease-in-out';
+}, function (_ref2) {
+  var focused = _ref2.focused,
+    outlined = _ref2.outlined,
+    roundness = _ref2.roundness,
+    scaleOnFocus = _ref2.scaleOnFocus,
+    theme = _ref2.theme;
+  return styled.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n        ", "\n\n        ", "\n\n        &:focus {\n            outline: none;\n        }\n    "])), addFocus.addFocus({
+    lowPerformance: theme.lowPerformance,
+    focused: focused,
+    outlined: outlined,
+    outlineSize: "".concat(outlineSize, "rem"),
+    outlineRadius: "".concat(applyRoundness.radiuses[roundness] + outlineSize, "rem")
+  }), scaleOnFocus && addFocus.syntheticFocus(styled.css(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n                & {\n                    transform: scale(1.04);\n                }\n            "]))), focused));
+});
+/**
+ * Контейнер со скругленными углами с возможностью фокусировки на нем.
+ */
+// eslint-disable-next-line prefer-arrow-callback
+var Card = /*#__PURE__*/React__default.default.forwardRef(function Card(_ref3, ref) {
+  var _ref3$roundness = _ref3.roundness,
+    roundness = _ref3$roundness === void 0 ? DEFAULT_ROUNDNESS : _ref3$roundness,
+    children = _ref3.children,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref3, _excluded);
+  return /*#__PURE__*/React__default.default.createElement(StyledCard, _rollupPluginBabelHelpers.extends({
+    ref: ref,
+    roundness: roundness
+  }, rest), children);
+});
+
+exports.Card = Card;
+exports.StyledCard = StyledCard;

package/dist/css/cjs/plasmaCore/components/Card/CardBody.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var styled = require('styled-components');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _templateObject;
+/**
+ * Помещается в ``<Card />`` и скругляет рамки содержимого внутри него.
+ * Обязательно к использованию для корректного отображения скругленных углов контента.
+ */
+var CardBody = /*#__PURE__*/styled__default.default.div(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    position: relative;\n\n    display: flex;\n    overflow: hidden;\n    flex: 1;\n    flex-direction: column;\n\n    box-sizing: content-box;\n    width: 100%;\n\n    border-radius: inherit;\n"])));
+
+exports.CardBody = CardBody;

package/dist/css/cjs/plasmaCore/components/Card/CardContent.js

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var styled = require('styled-components');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+/**
+ * Компонент для отображения как текстового, так и любого другого контента.
+ */
+var CardContent = /*#__PURE__*/styled__default.default.div(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n\n    position: relative;\n\n    box-sizing: border-box;\n    padding: ", "rem 1rem;\n\n    border-radius: inherit;\n\n    ", "\n\n    ", "\n"])), function (_ref) {
+  var compact = _ref.compact;
+  return compact ? 0.375 : 1;
+}, function (_ref2) {
+  var disabled = _ref2.disabled;
+  return disabled && styled.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n            opacity: 0.5;\n        "])));
+}, function (_ref3) {
+  var cover = _ref3.cover,
+    _ref3$coverGradient = _ref3.coverGradient,
+    coverGradient = _ref3$coverGradient === void 0 ? true : _ref3$coverGradient;
+  return cover && styled.css(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n            position: absolute;\n            top: 0;\n            left: 0;\n            right: 0;\n            bottom: 0;\n\n            justify-content: flex-end;\n\n            ", ";\n        "])), coverGradient && styled.css(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n                background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.74) 100%);\n            "]))));
+});
+
+exports.CardContent = CardContent;

package/dist/css/cjs/plasmaCore/components/Card/CardMedia.js

@@ -0,0 +1,45 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var styled = require('styled-components');
+var Image = require('../Image/Image.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _excluded = ["disabled", "placeholder", "style", "children", "className"];
+var _templateObject, _templateObject2, _templateObject3;
+var StyledImage = /*#__PURE__*/styled__default.default(Image.Image)(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    background-size: cover;\n\n    ", "\n"])), function (_ref) {
+  var $disabled = _ref.$disabled;
+  return $disabled && styled.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n            opacity: 0.5;\n        "])));
+});
+var StyledRoot = /*#__PURE__*/styled__default.default.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    position: relative;\n"])));
+
+/**
+ * Компонент для отображения картинок.
+ */
+var CardMedia = function CardMedia(_ref2) {
+  var disabled = _ref2.disabled,
+    placeholder = _ref2.placeholder,
+    style = _ref2.style,
+    children = _ref2.children,
+    className = _ref2.className,
+    props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded);
+  var imgStyle = _rollupPluginBabelHelpers.objectSpread2({}, style);
+  if (placeholder && !props.src) {
+    imgStyle.backgroundImage = "url('".concat(placeholder, "')");
+  }
+  return /*#__PURE__*/React__default.default.createElement(StyledRoot, {
+    className: className
+  }, /*#__PURE__*/React__default.default.createElement(StyledImage, _rollupPluginBabelHelpers.extends({
+    $disabled: disabled,
+    style: imgStyle
+  }, props)), children);
+};
+
+exports.CardMedia = CardMedia;

package/dist/css/cjs/plasmaCore/components/Card/CardPrice.js

@@ -0,0 +1,37 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var styled = require('styled-components');
+var Body = require('../Typography/Body.js');
+var Price = require('../Price/Price.js');
+var colors = require('../../utils/tokens/colors.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _excluded = ["count", "currency", "oldPrice", "price"];
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var StyledRoot = /*#__PURE__*/styled__default.default(Body.Body2)(_templateObject || (_templateObject = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    display: flex;\n    box-sizing: border-box;\n\n    margin-top: 0.75rem;\n"])));
+var StyledPrice = /*#__PURE__*/styled__default.default(Price.Price)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    height: 2.5rem;\n    color: ", ";\n"])), colors.primary);
+var StyledOldPrice = /*#__PURE__*/styled__default.default(Price.Price)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    height: 2.5rem;\n    margin-left: 0.5rem;\n    color: ", ";\n"])), colors.tertiary);
+var StyledCount = /*#__PURE__*/styled__default.default(Body.Body2)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    box-sizing: border-box;\n    height: 2.5rem;\n    margin-left: 0.5rem;\n\n    color: ", ";\n"])), colors.buttonAccent);
+var CardPrice = function CardPrice(_ref) {
+  var count = _ref.count,
+    currency = _ref.currency,
+    oldPrice = _ref.oldPrice,
+    price = _ref.price,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.default.createElement(StyledRoot, rest, /*#__PURE__*/React__default.default.createElement(StyledPrice, {
+    currency: currency
+  }, price), oldPrice && /*#__PURE__*/React__default.default.createElement(StyledOldPrice, {
+    currency: currency,
+    stroke: true
+  }, oldPrice), count ? /*#__PURE__*/React__default.default.createElement(StyledCount, null, "\xD7", count) : '');
+};
+
+exports.CardPrice = CardPrice;

package/dist/css/cjs/plasmaCore/components/Card/CardTypography.js

@@ -0,0 +1,54 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var styled = require('styled-components');
+var Headline = require('../Typography/Headline.js');
+var Footnote = require('../Typography/Footnote.js');
+var Paragraph = require('../Typography/Paragraph.js');
+var colors = require('../../utils/tokens/colors.js');
+var Body = require('../Typography/Body.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1;
+var views = {
+  primary: colors.primary,
+  secondary: colors.secondary,
+  tertiary: colors.tertiary
+};
+var linesMixin = function linesMixin(_ref) {
+  var _ref$lines = _ref.lines,
+    lines = _ref$lines === void 0 ? 2 : _ref$lines;
+  return styled.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    display: -webkit-box;\n    overflow: hidden;\n    box-sizing: border-box;\n\n    white-space: normal;\n\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: ", ";\n"])), lines);
+};
+var viewMixin = function viewMixin(_ref2) {
+  var _ref2$view = _ref2.view,
+    view = _ref2$view === void 0 ? 'primary' : _ref2$view;
+  return styled.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    transition: ", ";\n    color: ", ";\n"])), function (_ref3) {
+    var theme = _ref3.theme;
+    return theme.lowPerformance ? 'unset' : 'color 0.1s ease-in-out';
+  }, views[view]);
+};
+var CardHeadline1 = /*#__PURE__*/styled__default.default(Headline.Headline1)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n"])), viewMixin);
+var CardHeadline2 = /*#__PURE__*/styled__default.default(Headline.Headline2)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n"])), viewMixin);
+var CardHeadline3 = /*#__PURE__*/styled__default.default(Headline.Headline3)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n"])), viewMixin);
+var CardFootnote1 = /*#__PURE__*/styled__default.default(Footnote.Footnote1)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n"])), viewMixin);
+var CardFootnote2 = /*#__PURE__*/styled__default.default(Footnote.Footnote2)(_templateObject7 || (_templateObject7 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n"])), viewMixin);
+var CardBody1 = /*#__PURE__*/styled__default.default(Body.Body1)(_templateObject8 || (_templateObject8 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n    ", ";\n"])), linesMixin, viewMixin);
+var CardBody2 = /*#__PURE__*/styled__default.default(Body.Body2)(_templateObject9 || (_templateObject9 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n    ", ";\n"])), linesMixin, viewMixin);
+var CardParagraph1 = /*#__PURE__*/styled__default.default(Paragraph.ParagraphText1)(_templateObject0 || (_templateObject0 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n    ", ";\n"])), linesMixin, viewMixin);
+var CardParagraph2 = /*#__PURE__*/styled__default.default(Paragraph.ParagraphText2)(_templateObject1 || (_templateObject1 = /*#__PURE__*/_rollupPluginBabelHelpers.taggedTemplateLiteral(["\n    ", ";\n    ", ";\n"])), linesMixin, viewMixin);
+
+exports.CardBody1 = CardBody1;
+exports.CardBody2 = CardBody2;
+exports.CardFootnote1 = CardFootnote1;
+exports.CardFootnote2 = CardFootnote2;
+exports.CardHeadline1 = CardHeadline1;
+exports.CardHeadline2 = CardHeadline2;
+exports.CardHeadline3 = CardHeadline3;
+exports.CardParagraph1 = CardParagraph1;
+exports.CardParagraph2 = CardParagraph2;