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

package/dist/css/es/plasmaCore/components/Price/Price.js

@@ -0,0 +1,32 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+import styled, { css } from 'styled-components';
+import { formatCurrency } from '../../utils/utils/formatCurrency.js';
+
+var _excluded = ["children", "currency", "minimumFractionDigits", "stroke", "periodicity"];
+var _templateObject, _templateObject2, _templateObject3;
+var StyledPrice = /*#__PURE__*/styled.span(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", ";\n"])), function (_ref) {
+  var $stroke = _ref.$stroke;
+  return $stroke && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n            text-decoration: line-through;\n        "])));
+});
+var StyledPeriodicity = /*#__PURE__*/styled.span(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n    padding-left: 0.25rem;\n"])));
+
+/**
+ * Компонент для отображения цены / стоимости / суммы.
+ */
+var Price = function Price(_ref2) {
+  var children = _ref2.children,
+    _ref2$currency = _ref2.currency,
+    currency = _ref2$currency === void 0 ? 'rub' : _ref2$currency,
+    _ref2$minimumFraction = _ref2.minimumFractionDigits,
+    minimumFractionDigits = _ref2$minimumFraction === void 0 ? 0 : _ref2$minimumFraction,
+    _ref2$stroke = _ref2.stroke,
+    stroke = _ref2$stroke === void 0 ? false : _ref2$stroke,
+    periodicity = _ref2.periodicity,
+    rest = _objectWithoutProperties(_ref2, _excluded);
+  return /*#__PURE__*/React.createElement(StyledPrice, _extends({
+    $stroke: stroke
+  }, rest), formatCurrency(children, currency, minimumFractionDigits), periodicity && /*#__PURE__*/React.createElement(StyledPeriodicity, null, periodicity));
+};
+
+export { Price };

package/dist/css/es/plasmaCore/components/SSRProvider/SSRProvider.js

@@ -0,0 +1,22 @@
+import React, { createContext } from 'react';
+
+var SSRContext = /*#__PURE__*/createContext({
+  uniqId: null
+});
+
+/**
+ * Провайдер обязателен для использования, необходимо обернуть в него все приложение.
+ *
+ * Используется для корректного озвучивания скринридерами Radiobox и Checkbox компонент.
+ */
+var SSRProvider = function SSRProvider(_ref) {
+  var children = _ref.children;
+  var value = {
+    uniqId: 0
+  };
+  return /*#__PURE__*/React.createElement(SSRContext.Provider, {
+    value: value
+  }, children);
+};
+
+export { SSRContext, SSRProvider };

package/dist/css/es/plasmaCore/components/Spinner/Spinner.js

@@ -0,0 +1,49 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+import styled, { css, keyframes } from 'styled-components';
+import { SpinnerSvg } from './SpinnerSvg.js';
+import { useUniqId } from '../../utils/hooks/useUniqId.js';
+import { accent } from '../../utils/tokens/colors.js';
+
+var _excluded = ["id", "size", "color", "deviceScale"];
+var _templateObject, _templateObject2, _templateObject3;
+var rotateAnimation = /*#__PURE__*/keyframes(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    from {\n        transform: rotate(0);\n    }\n\n    to {\n        transform: rotate(360deg);\n    }\n"])));
+var StyledRoot = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    display: flex;\n    box-sizing: border-box;\n\n    ", "\n\n    animation: ", " 1s linear infinite;\n"])), function (_ref) {
+  var $size = _ref.$size;
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        width: ", ";\n        height: ", ";\n    "])), $size, $size);
+}, rotateAnimation);
+var scalingPixelBasis = 16;
+var sizeFormatting = function sizeFormatting(size) {
+  var deviceScale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+  if (typeof size === 'number' || !size.endsWith('rem') && !size.endsWith('px')) {
+    return "".concat(Number(size) / (scalingPixelBasis * deviceScale), "rem");
+  }
+  return size;
+};
+
+/**
+ * Компонент для отображения индикатора загрузки.
+ */
+var Spinner = function Spinner(props) {
+  var id = props.id,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 56 : _props$size,
+    _props$color = props.color,
+    color = _props$color === void 0 ? accent : _props$color,
+    deviceScale = props.deviceScale,
+    rest = _objectWithoutProperties(props, _excluded);
+  var uniqId = useUniqId();
+  var innerId = id || uniqId;
+  var currentSize = sizeFormatting(size, deviceScale);
+  return /*#__PURE__*/React.createElement(StyledRoot, _extends({
+    id: innerId,
+    $size: currentSize
+  }, rest), /*#__PURE__*/React.createElement(SpinnerSvg, {
+    id: innerId,
+    width: size,
+    height: size,
+    color: color
+  }));
+};
+
+export { Spinner };

package/dist/css/es/plasmaCore/components/Spinner/SpinnerSvg.js

@@ -0,0 +1,65 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+
+var _excluded = ["id", "color"];
+var SpinnerSvg = function SpinnerSvg(_ref) {
+  var id = _ref.id,
+    color = _ref.color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 56 56",
+    fill: "none"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M28 0C12.536 0 0 12.536 0 28s12.536 28 28 28h.055H28v-4C14.745 52 4 41.255 4 28S14.745 4 28 4V0z",
+    fill: "url(#prefix__paint0_linear".concat(id, ")")
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M56 28c0 14.791-11.47 26.904-26 27.93-1.102.077-2-.825-2-1.93s.899-1.991 2-2.082C42.318 50.902 52 40.58 52 28 52 14.745 41.255 4 28 4V0c15.464 0 28 12.536 28 28z",
+    fill: "url(#prefix__paint1_linear".concat(id, ")")
+  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    id: "prefix__paint0_linear".concat(id),
+    x1: 0,
+    y1: 56,
+    x2: 0,
+    y2: 0,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: color,
+    stopOpacity: 0
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.048,
+    stopColor: color,
+    stopOpacity: 0
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.952,
+    stopColor: color,
+    stopOpacity: 0.5
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: color,
+    stopOpacity: 0.5
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    id: "prefix__paint1_linear".concat(id),
+    x1: 28,
+    y1: 56,
+    x2: 28,
+    y2: 0,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: color
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.048,
+    stopColor: color
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.952,
+    stopColor: color,
+    stopOpacity: 0.5
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: color,
+    stopOpacity: 0.5
+  }))));
+};
+
+export { SpinnerSvg };

package/dist/css/es/plasmaCore/components/Typography/Body.js

@@ -0,0 +1,11 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { body1, body2, body3 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2, _templateObject3;
+var Body1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, body1);
+var Body2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, body2);
+var Body3 = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, body3);
+
+export { Body1, Body2, Body3 };

package/dist/css/es/plasmaCore/components/Typography/Button.js

@@ -0,0 +1,10 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { button1, button2 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2;
+var Button1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, button1);
+var Button2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, button2);
+
+export { Button1, Button2 };

package/dist/css/es/plasmaCore/components/Typography/Caption.js

@@ -0,0 +1,9 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { caption } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject;
+var Caption = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, caption);
+
+export { Caption };

package/dist/css/es/plasmaCore/components/Typography/Display.js

@@ -0,0 +1,11 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { display1, display2, display3 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2, _templateObject3;
+var Display1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, display1);
+var Display2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, display2);
+var Display3 = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, display3);
+
+export { Display1, Display2, Display3 };

package/dist/css/es/plasmaCore/components/Typography/Footnote.js

@@ -0,0 +1,10 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { footnote1, footnote2 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2;
+var Footnote1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, footnote1);
+var Footnote2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, footnote2);
+
+export { Footnote1, Footnote2 };

package/dist/css/es/plasmaCore/components/Typography/Headline.js

@@ -0,0 +1,16 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { headline1, headline2, headline3, headline4 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var Headline1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline1);
+var Headline2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline2);
+var Headline3 = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline3);
+var Headline4 = /*#__PURE__*/styled.div(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline4);
+var H1 = /*#__PURE__*/styled.h1(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n    margin: 0;\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline1);
+var H2 = /*#__PURE__*/styled.h2(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n    margin: 0;\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline2);
+var H3 = /*#__PURE__*/styled.h3(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n    margin: 0;\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline3);
+var H4 = /*#__PURE__*/styled.h4(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral(["\n    margin: 0;\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, headline4);
+
+export { H1, H2, H3, H4, Headline1, Headline2, Headline3, Headline4 };

package/dist/css/es/plasmaCore/components/Typography/Paragraph.js

@@ -0,0 +1,13 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { paragraph1, paragraph2 } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var ParagraphText1 = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, paragraph1);
+var ParagraphText2 = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n"])), applyHyphens, applySpacing, paragraph2);
+var P1 = /*#__PURE__*/styled.p(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    margin: 0;\n"])), applyHyphens, applySpacing, paragraph1);
+var P = P1;
+var P2 = /*#__PURE__*/styled.p(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    margin: 0;\n"])), applyHyphens, applySpacing, paragraph2);
+
+export { P, P1, P2, ParagraphText1, ParagraphText2 };

package/dist/css/es/plasmaCore/components/Typography/Underline.js

@@ -0,0 +1,9 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+import { underline } from '../../utils/tokens/typography.js';
+import { applyHyphens, applySpacing } from '@salutejs/plasma-typo';
+
+var _templateObject;
+var Underline = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n\n    text-transform: uppercase;\n"])), applyHyphens, applySpacing, underline);
+
+export { Underline };

package/dist/css/es/plasmaCore/index.js

@@ -0,0 +1,55 @@
+export { Card, StyledCard } from './components/Card/Card.js';
+export { CardBody } from './components/Card/CardBody.js';
+export { CardContent } from './components/Card/CardContent.js';
+export { CardMedia } from './components/Card/CardMedia.js';
+export { CardPrice } from './components/Card/CardPrice.js';
+export { CardBody1, CardBody2, CardFootnote1, CardFootnote2, CardHeadline1, CardHeadline2, CardHeadline3, CardParagraph1, CardParagraph2 } from './components/Card/CardTypography.js';
+export { FieldContent, FieldHelper, FieldPlaceholder, FieldRoot } from './components/Field/Field.js';
+export { fieldBackgroundStatuses, fieldStatuses } from './components/Field/Field.statuses.js';
+export { Image } from './components/Image/Image.js';
+export { Price } from './components/Price/Price.js';
+export { SSRContext, SSRProvider } from './components/SSRProvider/SSRProvider.js';
+export { Body1, Body2, Body3 } from './components/Typography/Body.js';
+export { Button1, Button2 } from './components/Typography/Button.js';
+export { Caption } from './components/Typography/Caption.js';
+export { Display1, Display2, Display3 } from './components/Typography/Display.js';
+export { Footnote1, Footnote2 } from './components/Typography/Footnote.js';
+export { H1, H2, H3, H4, Headline1, Headline2, Headline3, Headline4 } from './components/Typography/Headline.js';
+export { P, P1, P2, ParagraphText1, ParagraphText2 } from './components/Typography/Paragraph.js';
+export { Underline } from './components/Typography/Underline.js';
+export { Badge, badgeSizes } from './components/Badge/Badge.js';
+export { Button, ButtonRoot } from './components/Button/Button.js';
+export { buttonSizes, buttonTypography, buttonViews } from './components/Button/Button.props.js';
+export { getButtonSizesMixin } from './components/Button/Button.mixins.js';
+export { createButton } from './components/Button/createButton.js';
+export { Spinner } from './components/Spinner/Spinner.js';
+export { useDebouncedFunction } from './utils/hooks/useDebouncedFunction.js';
+export { useForkRef } from './utils/hooks/useForkRef.js';
+export { useIsomorphicLayoutEffect } from './utils/hooks/useIsomorphicLayoutEffect.js';
+export { useUniqId } from './utils/hooks/useUniqId.js';
+export { useResizeObserver } from './utils/hooks/useResizeObserver.js';
+export { useFocusTrap } from './utils/hooks/useFocusTrap.js';
+export { addFocus, syntheticFocus } from './utils/mixins/addFocus.js';
+export { applyBlur, blurs } from './utils/mixins/blur.js';
+export { applyDisabled } from './utils/mixins/applyDisabled.js';
+export { applyEllipsis } from './utils/mixins/applyEllipsis.js';
+export { applyMaxLines } from './utils/mixins/applyMaxLines.js';
+export { applyNoSelect } from './utils/mixins/applyNoSelect.js';
+export { applyRoundness, radiuses } from './utils/mixins/applyRoundness.js';
+export { applySkeletonGradient } from './utils/mixins/applySkeletonGradient.js';
+export { applyView, views } from './utils/mixins/applyView.js';
+export { applyScrollSnap } from './utils/mixins/applyScrollSnap.js';
+export { applyHyphens, applySpacing, spacing } from '@salutejs/plasma-typo';
+export { shadows } from './utils/mixins/shadows.js';
+export { accent, background, backgroundPrimary, backgroundSecondary, backgroundTertiary, black, blackPrimary, blackSecondary, blackTertiary, buttonAccent, buttonChecked, buttonCritical, buttonFocused, buttonPrimary, buttonSecondary, buttonSuccess, buttonWarning, critical, dark01, dark02, dark03, gradient, inverse, overlay, paragraph, primary, secondary, skeletonGradient, skeletonGradientLighter, speechBubbleReceived, speechBubbleSent, success, surfaceCard, surfaceLiquid01, surfaceLiquid02, surfaceLiquid03, surfaceSolid01, surfaceSolid02, surfaceSolid03, tertiary, text, transparent, voicePhraseGradient, warning, white, whitePrimary, whiteSecondary, whiteTertiary } from './utils/tokens/colors.js';
+export { body1, body2, body3, button1, button2, caption, display1, display2, display3, footnote1, footnote2, headline1, headline2, headline3, headline4, paragraph1, paragraph2, underline } from './utils/tokens/typography.js';
+export { animatedScrollToX, animatedScrollToY } from './utils/utils/animatedScrollTo.js';
+export { canUseDOM } from './utils/utils/canUseDOM.js';
+export { convertRoundnessMatrix } from './utils/utils/roundness.js';
+export { extractTextFrom } from './utils/utils/extractTextFrom.js';
+export { monthLongName, monthShortName, padZeroNumber } from './utils/utils/formatters.js';
+export { formatCurrency } from './utils/utils/formatCurrency.js';
+export { setRef } from './utils/utils/setRef.js';
+export { toCssSize } from './utils/utils/toCssSize.js';
+export { transformStyles } from './utils/utils/transformStyles.js';
+export { IS_REACT_18, safeFlushSync, safeUseId } from './utils/utils/react.js';

package/dist/css/es/plasmaCore/utils/hooks/useDebouncedFunction.js

@@ -0,0 +1,40 @@
+import React from 'react';
+
+/**
+ * @param {Function} func
+ * @param {number} delay
+ * @param {boolean} cleanUp
+ * https://habr.com/ru/company/domclick/blog/510616/
+ */
+function useDebouncedFunction(func, delay, cleanUp) {
+  var timeoutRef = React.useRef();
+
+  /**
+   * Очистка таймера
+   */
+  function clearTimer() {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = undefined;
+    }
+  }
+
+  /**
+   * Очищаем таймер при анмаунте компонента, если cleanUp выставлен в true
+   * и тем самым отменяем последний запланированный вызов
+   */
+  React.useEffect(function () {
+    return cleanUp ? clearTimer : undefined;
+  }, [cleanUp]);
+  return function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    clearTimer();
+    timeoutRef.current = setTimeout(function () {
+      return func.apply(void 0, args);
+    }, delay);
+  };
+}
+
+export { useDebouncedFunction };

package/dist/css/es/plasmaCore/utils/hooks/useFocusTrap.js

@@ -0,0 +1,92 @@
+import { useRef, useCallback, useEffect } from 'react';
+import { FocusManager } from '../utils/focusManager.js';
+import { focusSelector, isTabble, isFocusable } from '../utils/tabbable.js';
+import { scopeTab } from '../utils/scopeTab.js';
+
+// Находим элемент для фокуса
+var getFocusElement = function getFocusElement(node, firstFocusSelector) {
+  var focusElement = null;
+  if (firstFocusSelector) {
+    if (typeof firstFocusSelector === 'string') {
+      focusElement = node.querySelector(firstFocusSelector);
+    } else if (firstFocusSelector.current) {
+      focusElement = firstFocusSelector.current;
+    }
+  }
+  if (!focusElement) {
+    var children = Array.from(node.querySelectorAll(focusSelector));
+    focusElement = children.find(function (el) {
+      return isTabble(el);
+    }) || null;
+  }
+
+  // Если ничего не нашлось, то может ли сама нода быть под фокусом
+  if (!focusElement && isFocusable(node)) {
+    focusElement = node;
+  }
+  return focusElement;
+};
+var processNode = function processNode(node, firstFocusSelector, ref) {
+  if (ref !== null && ref !== void 0 && ref.current) {
+    ref.current.removeEventListener('animationend', function () {
+      processNode(node, firstFocusSelector, ref);
+    });
+  }
+  var focusElement = getFocusElement(node, firstFocusSelector);
+  if (focusElement) {
+    focusElement.focus();
+  }
+};
+var focusManager = /*#__PURE__*/new FocusManager();
+
+/**
+ *  Захватывает фокус внутри DOM node.
+ * */
+var useFocusTrap = function useFocusTrap() {
+  var active = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  var firstFocusSelector = arguments.length > 1 ? arguments[1] : undefined;
+  var focusAfterNode = arguments.length > 2 ? arguments[2] : undefined;
+  var focusAfterAnimation = arguments.length > 3 ? arguments[3] : undefined;
+  var ref = useRef();
+  var setRef = useCallback(function (node) {
+    if (ref.current) {
+      focusManager.teardownScopedFocus();
+      focusManager.returnFocus();
+    }
+    if (active && node) {
+      focusManager.setupScopedFocus(node);
+      focusManager.markForFocusAfter(focusAfterNode);
+
+      // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.
+      setTimeout(function () {
+        if (ref !== null && ref !== void 0 && ref.current && node.ownerDocument && focusAfterAnimation) {
+          ref.current.addEventListener('animationend', function () {
+            processNode(node, firstFocusSelector, ref);
+          });
+        } else if (node.ownerDocument) {
+          processNode(node, firstFocusSelector);
+        }
+      });
+      ref.current = node;
+      return;
+    }
+    ref.current = null;
+  }, [active, firstFocusSelector]);
+  useEffect(function () {
+    if (!active) {
+      return;
+    }
+    var handleKeyDown = function handleKeyDown(event) {
+      if (event.key === 'Tab' && ref.current) {
+        scopeTab(ref.current, event);
+      }
+    };
+    document.addEventListener('keydown', handleKeyDown);
+    return function () {
+      document.removeEventListener('keydown', handleKeyDown);
+    };
+  }, [active]);
+  return setRef;
+};
+
+export { useFocusTrap };

package/dist/css/es/plasmaCore/utils/hooks/useForkRef.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { setRef } from '../utils/setRef.js';
+
+/**
+ * Позволяет переиспользовать объект `ref` внутри forwardRef.
+ * @param {React.Ref<T>} refOne
+ * @param {React.Ref<T>} refTwo
+ * @return {Function React.Ref}
+ */
+var useForkRef = function useForkRef(refOne, refTwo) {
+  return React.useMemo(function () {
+    if (refOne == null && refTwo === null) {
+      return null;
+    }
+    return function (refOb) {
+      setRef(refOne, refOb);
+      setRef(refTwo, refOb);
+    };
+  }, [refOne, refTwo]);
+};
+
+export { useForkRef };

package/dist/css/es/plasmaCore/utils/hooks/useIsomorphicLayoutEffect.js

@@ -0,0 +1,9 @@
+import { useLayoutEffect, useEffect } from 'react';
+import { canUseDOM } from '../utils/canUseDOM.js';
+
+/**
+ * Runs effect safely on server.
+ */
+var useIsomorphicLayoutEffect = canUseDOM ? useLayoutEffect : useEffect;
+
+export { useIsomorphicLayoutEffect };

package/dist/css/es/plasmaCore/utils/hooks/useResizeObserver.js

@@ -0,0 +1,32 @@
+import { useEffect } from 'react';
+
+/**
+ * Отслеживает изменение размеров переданного элемента
+ * @param {React.Ref<T>} ref - реф элемента, за которым нужно следить
+ * @callback callback - функция, которая вызывается при изменении элемента
+ * @param {Element} element - элемент, размер которого изменился
+ */
+var useResizeObserver = function useResizeObserver(ref, callback) {
+  useEffect(function () {
+    /* istanbul ignore if: убираем проверку на рефы из покрытия */
+    if (!(ref !== null && ref !== void 0 && ref.current)) {
+      return;
+    }
+    var current = ref.current;
+    var resizeObserver = new window.ResizeObserver(function () {
+      window.requestAnimationFrame(function () {
+        callback(current);
+      });
+    });
+    resizeObserver.observe(ref.current);
+    return function () {
+      /* istanbul ignore if: убираем проверку на рефы из покрытия */
+      if (!(ref !== null && ref !== void 0 && ref.current)) {
+        return;
+      }
+      resizeObserver.unobserve(ref.current);
+    };
+  }, [ref]);
+};
+
+export { useResizeObserver };

package/dist/css/es/plasmaCore/utils/hooks/useUniqId.js

@@ -0,0 +1,19 @@
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { useContext, useState } from 'react';
+import { SSRContext } from '../../components/SSRProvider/SSRProvider.js';
+
+var noSSRId = 0;
+function useUniqId() {
+  var context = useContext(SSRContext);
+  var _useState = useState(function () {
+      if (context.uniqId !== null) {
+        return "plasma-uniq-id-ssr-".concat(++context.uniqId);
+      }
+      return "plasma-uniq-id-".concat(++noSSRId);
+    }),
+    _useState2 = _slicedToArray(_useState, 1),
+    id = _useState2[0];
+  return id;
+}
+
+export { useUniqId };

package/dist/css/es/plasmaCore/utils/mixins/addFocus.js

@@ -0,0 +1,49 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { css } from 'styled-components';
+import 'focus-visible';
+import { buttonFocused } from '../tokens/colors.js';
+
+var _templateObject, _templateObject2, _templateObject3;
+var syntheticFocus = function syntheticFocus(ruleset, focused) {
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    &.focus-visible:focus,\n    &[data-focus-visible-added] {\n        outline: none;\n        ", "\n    }\n\n    ", ";\n"])), ruleset, focused && ruleset);
+};
+
+/**
+ * Миксин для добавления фокусной рамки к элементу через псевдоэлемент before
+ * @param {FocusProps} props
+ * @example
+ * // Выведет фокусную рамку размером 2em, скруглением 5em, отступом 2em и цветом 'rebeccapurple'.
+ * addFocus({
+ *  outlineSize: '2em',
+ *  outlineOffset: '2em',
+ *  outlineRadius: '5em',
+ *  outlineColor: 'rebeccapurple',
+ * });
+ * @example
+ * // Выведет outline размером 4em, скруглением 10px 1px, без отступа и цветом 'greenyellow'.
+ * addFocus({
+ *  outlineSize: '4em',
+ *  outlineOffset: '0',
+ *  outlineRadius: '10em 1em',
+ *  outlineColor: 'greenyellow',
+ * });
+ */
+var addFocus = function addFocus(_ref) {
+  var lowPerformance = _ref.lowPerformance,
+    focused = _ref.focused,
+    _ref$outlined = _ref.outlined,
+    outlined = _ref$outlined === void 0 ? true : _ref$outlined,
+    _ref$outlineSize = _ref.outlineSize,
+    outlineSize = _ref$outlineSize === void 0 ? '0.125rem' : _ref$outlineSize,
+    _ref$outlineOffset = _ref.outlineOffset,
+    outlineOffset = _ref$outlineOffset === void 0 ? outlineSize : _ref$outlineOffset,
+    _ref$outlineColor = _ref.outlineColor,
+    outlineColor = _ref$outlineColor === void 0 ? buttonFocused : _ref$outlineColor,
+    _ref$outlineRadius = _ref.outlineRadius,
+    outlineRadius = _ref$outlineRadius === void 0 ? 0 : _ref$outlineRadius,
+    _ref$synthesizeFocus = _ref.synthesizeFocus,
+    synthesizeFocus = _ref$synthesizeFocus === void 0 ? syntheticFocus : _ref$synthesizeFocus;
+  return outlined && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        position: relative;\n\n        &::before {\n            content: '';\n\n            position: absolute;\n            top: -", ";\n            left: -", ";\n            right: -", ";\n            bottom: -", ";\n\n            display: block;\n            box-sizing: content-box;\n\n            border: ", " solid transparent;\n            border-radius: ", ";\n\n            transition: ", ";\n\n            pointer-events: none;\n        }\n\n        ", "\n    "])), outlineOffset, outlineOffset, outlineOffset, outlineOffset, outlineSize, outlineRadius, lowPerformance ? 'unset' : 'box-shadow 0.2s ease-in-out', synthesizeFocus(css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n                &::before {\n                    box-shadow: 0 0 0 ", " ", ";\n                }\n            "])), outlineSize, outlineColor), focused));
+};
+
+export { addFocus, syntheticFocus };

package/dist/css/es/plasmaCore/utils/mixins/applyDisabled.js

@@ -0,0 +1,16 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { css } from 'styled-components';
+
+var _templateObject, _templateObject2;
+var disabledCss = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    opacity: 0.4;\n    cursor: not-allowed;\n\n    /* stylelint-disable-next-line selector-nested-pattern */\n    &:hover,\n    &:active {\n        transform: none;\n    }\n"])));
+
+/**
+ * Миксин неактивной кнопки
+ */
+var applyDisabled = function applyDisabled(_ref) {
+  var disabled = _ref.disabled,
+    $disabled = _ref.$disabled;
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    &:disabled {\n        ", "\n    }\n\n    ", "\n"])), disabledCss, (disabled || $disabled) && disabledCss);
+};
+
+export { applyDisabled };

package/dist/css/es/plasmaCore/utils/mixins/applyEllipsis.js

@@ -0,0 +1,9 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { css } from 'styled-components';
+
+var _templateObject;
+var applyEllipsis = function applyEllipsis() {
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    "])));
+};
+
+export { applyEllipsis };