@skbkontur/react-ui 1.12.2 → 2.0.0-beta.4

package/components/MenuItem/MenuItem.styles.js

@@ -1,28 +1,81 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var Emotion_1 = require("../../lib/theming/Emotion");
-var Mixins_1 = require("../../lib/styles/Mixins");
-var jsStyles = {
-  root: function root(t) {
-    return Emotion_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      ", ";\n\n      line-height: 18px;\n      padding: 6px 18px 7px 8px;\n    "], ["\n      ", ";\n\n      line-height: 18px;\n      padding: 6px 18px 7px 8px;\n    "])), Mixins_1.resetButton());
-  },
-  hover: function hover(t) {
-    // Color with !important in purpose to override `a:hover`
-    return Emotion_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n      background: ", ";\n      color: ", " !important;\n    "], ["\n      background: ", ";\n      color: ", " !important;\n    "])), t.dropdownMenuHoverBg, t.textColorInvert);
-  },
-  selected: function selected(t) {
-    return Emotion_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n      background: ", ";\n    "], ["\n      background: ", ";\n    "])), t.dropdownMenuSelectedBg);
-  },
-  disabled: function disabled(t) {
-    return Emotion_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), t.textColorDisabled);
-  },
-  link: function link(t) {
-    return Emotion_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), t.linkColor);
-  },
-  withIcon: function withIcon(t) {
-    return Emotion_1.css(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n      padding-left: ", ";\n    "], ["\n      padding-left: ", ";\n    "])), t.menuItemPaddingForIcon);
-  } };
-
-exports["default"] = jsStyles;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+import { resetButton } from '../../lib/styles/Mixins.js';
+import { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from './MenuItem.mixins.js';
+export var getMenuItemPaddings = function (_a) {
+    var menuItemPaddingX = _a.menuItemPaddingX, menuItemPaddingY = _a.menuItemPaddingY;
+    var paddingX = menuItemPaddingX;
+    var paddingY = menuItemPaddingY;
+    return { paddingX: paddingX, paddingY: paddingY };
+};
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        root: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      ", ";\n\n      cursor: pointer;\n      display: ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ", ";\n      }\n    "], ["\n      ", ";\n\n      cursor: pointer;\n      display: ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ", ";\n      }\n    "])), resetButton(), t.menuItemDisplay, t.menuItemTextColor, t.menuItemBorderRadius, t.menuItemGap);
+        },
+        rootSmall: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXSmall, t.menuItemPaddingYSmall, t.menuItemLineHeightSmall, t.menuItemFontSizeSmall));
+        },
+        rootMedium: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXMedium, t.menuItemPaddingYMedium, t.menuItemLineHeightMedium, t.menuItemFontSizeMedium));
+        },
+        rootLarge: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXLarge, t.menuItemPaddingYLarge, t.menuItemLineHeightLarge, t.menuItemFontSizeLarge));
+        },
+        rootMobile: function (t) {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "], ["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])), t.menuItemFontSizeMobile, t.menuItemLineHeightMobile, t.menuItemPaddingMobile);
+        },
+        hover: function (t) {
+            // Color with !important in purpose to override `a:hover`
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      background: ", " !important;\n      color: ", " !important;\n    "], ["\n      background: ", " !important;\n      color: ", " !important;\n    "])), t.menuItemHoverBg, t.menuItemHoverColor);
+        },
+        selected: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      background: ", " !important;\n    "], ["\n      background: ", " !important;\n    "])), t.menuItemSelectedBg);
+        },
+        disabled: function (t) {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n      cursor: default;\n    "], ["\n      background: ", ";\n      color: ", ";\n      cursor: default;\n    "])), t.menuItemDisabledBg, t.menuItemDisabledColor);
+        },
+        nonSelectable: function () {
+            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      cursor: default;\n    "], ["\n      cursor: default;\n    "])));
+        },
+        loose: function () {
+            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      padding-left: 15px;\n    "], ["\n      padding-left: 15px;\n    "])));
+        },
+        withIconSmall: function (t) {
+            return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconSmall));
+        },
+        withIconMedium: function (t) {
+            return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconMedium));
+        },
+        withIconLarge: function (t) {
+            return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconLarge));
+        },
+        comment: function (t) {
+            return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      color: ", ";\n      opacity: ", ";\n      white-space: normal;\n      padding-top: 4px;\n    "], ["\n      color: ", ";\n      opacity: ", ";\n      white-space: normal;\n      padding-top: 4px;\n    "])), t.menuItemCommentColor, t.menuItemCommentOpacity);
+        },
+        commentHover: function (t) {
+            return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      color: ", ";\n      opacity: ", ";\n    "], ["\n      color: ", ";\n      opacity: ", ";\n    "])), t.menuItemCommentColorHover, t.menuItemCommentOpacityHover);
+        },
+        icon: function () {
+            return css(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n      display: inline-block;\n      position: absolute;\n      transform: translateY(0px); // icon shifts one pixel up in firefox on medium size without this property\n    "], ["\n      display: inline-block;\n      position: absolute;\n      transform: translateY(0px); // icon shifts one pixel up in firefox on medium size without this property\n    "])));
+        },
+        iconSmall: function (t) {
+            return css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall));
+        },
+        iconMedium: function (t) {
+            return css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium));
+        },
+        iconLarge: function (t) {
+            return css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge));
+        },
+        mobileContentWithIcon: function () {
+            return css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n      margin-left: 8px;\n    "], ["\n      margin-left: 8px;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20;
+//# sourceMappingURL=MenuItem.styles.js.map

package/components/MenuItem/MenuItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.styles.js","sourceRoot":"","sources":["MenuItem.styles.ts"],"names":[],"mappings":";;;AACA,qDAAgD;AAChD,kDAAsD;AAEtD,IAAM,QAAQ,GAAG;IACf,IAAI,YAAC,CAAS;QACZ,OAAO,aAAG,8JAAA,UACN,EAAa,uEAIhB,KAJG,oBAAW,EAAE,EAIf;IACJ,CAAC;IACD,KAAK,YAAC,CAAS;QACb,yDAAyD;QACzD,OAAO,aAAG,2IAAA,sBACM,EAAqB,kBAC1B,EAAiB,oBAC3B,KAFe,CAAC,CAAC,mBAAmB,EAC1B,CAAC,CAAC,eAAe,EAC1B;IACJ,CAAC;IACD,QAAQ,YAAC,CAAS;QAChB,OAAO,aAAG,4GAAA,sBACM,EAAwB,SACvC,KADe,CAAC,CAAC,sBAAsB,EACtC;IACJ,CAAC;IACD,QAAQ,YAAC,CAAS;QAChB,OAAO,aAAG,uGAAA,iBACC,EAAmB,SAC7B,KADU,CAAC,CAAC,iBAAiB,EAC5B;IACJ,CAAC;IACD,IAAI,YAAC,CAAS;QACZ,OAAO,aAAG,uGAAA,iBACC,EAAW,SACrB,KADU,CAAC,CAAC,SAAS,EACpB;IACJ,CAAC;IACD,QAAQ,YAAC,CAAS;QAChB,OAAO,aAAG,8GAAA,wBACQ,EAAwB,SACzC,KADiB,CAAC,CAAC,sBAAsB,EACxC;IACJ,CAAC;CACF,CAAC;AAEF,kBAAe,QAAQ,CAAC"}
+{"version":3,"file":"MenuItem.styles.js","sourceRoot":"","sources":["../../../components/MenuItem/MenuItem.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport { resetButton } from '../../lib/styles/Mixins.js';\n\nimport { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from './MenuItem.mixins.js';\n\nexport const getMenuItemPaddings = ({\n  menuItemPaddingX,\n  menuItemPaddingY,\n}: Record<'menuItemPaddingX' | 'menuItemPaddingY', string>): Record<'paddingX' | 'paddingY', string> => {\n  const paddingX = menuItemPaddingX;\n  const paddingY = menuItemPaddingY;\n\n  return { paddingX, paddingY };\n};\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root(t: Theme) {\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: ${t.menuItemDisplay};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n      border-radius: ${t.menuItemBorderRadius};\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ${t.menuItemGap};\n      }\n    `;\n  },\n\n  rootSmall(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXSmall,\n        t.menuItemPaddingYSmall,\n        t.menuItemLineHeightSmall,\n        t.menuItemFontSizeSmall,\n      )};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXMedium,\n        t.menuItemPaddingYMedium,\n        t.menuItemLineHeightMedium,\n        t.menuItemFontSizeMedium,\n      )};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXLarge,\n        t.menuItemPaddingYLarge,\n        t.menuItemLineHeightLarge,\n        t.menuItemFontSizeLarge,\n      )};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.menuItemFontSizeMobile};\n      line-height: ${t.menuItemLineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: ${t.menuItemDisabledBg};\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  nonSelectable() {\n    return css`\n      cursor: default;\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIconSmall(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconSmall)}\n    `;\n  },\n  withIconMedium(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconMedium)}\n    `;\n  },\n  withIconLarge(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconLarge)}\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      opacity: ${t.menuItemCommentOpacity};\n      white-space: normal;\n      padding-top: 4px;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: ${t.menuItemCommentOpacityHover};\n    `;\n  },\n  icon() {\n    return css`\n      display: inline-block;\n      position: absolute;\n      transform: translateY(0px); // icon shifts one pixel up in firefox on medium size without this property\n    `;\n  },\n  iconSmall(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall)};\n    `;\n  },\n  iconMedium(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium)};\n    `;\n  },\n  iconLarge(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge)};\n    `;\n  },\n  mobileContentWithIcon() {\n    return css`\n      margin-left: 8px;\n    `;\n  },\n}));\n"]}

package/components/MenuItem/index.d.ts

@@ -1 +1 @@
-export { default, MenuItemProps, MenuItemState, MenuItemElement, isMenuItem } from './MenuItem';
+export * from './MenuItem.js';

package/components/MenuItem/index.js

@@ -1,5 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var MenuItem_1 = require("./MenuItem");
-exports["default"] = MenuItem_1["default"];
-exports.isMenuItem = MenuItem_1.isMenuItem;
+export * from './MenuItem.js';
+//# sourceMappingURL=index.js.map

package/components/MenuItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";;AAAA,uCAAgG;AAAvF,6BAAA,OAAO,CAAA;AAAiD,gCAAA,UAAU,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/MenuItem/index.tsx"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC","sourcesContent":["export * from './MenuItem.js';\n"]}

package/components/MenuSeparator/MenuSeparator.d.ts

@@ -1,10 +1,12 @@
-import * as React from 'react';
-/**
- * Разделитель в меню.
- */
-export default class MenuSeparator extends React.Component<{}> {
-    static __KONTUR_REACT_UI__: string;
-    private theme;
-    render(): JSX.Element;
-    private renderMain;
-}
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+export type MenuSeparatorProps = CommonProps;
+export declare const MenuSeparatorDataTids: {
+    readonly root: "MenuSeparator__root";
+};
+/**
+ * `MenuSeparator` добавляет разделительную линию между элементами меню.
+ *
+ * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.
+ */
+declare const MenuSeparator: import("../../lib/forwardRefAndName.js").ReactUIComponentWithRef<HTMLDivElement, CommonProps> & Record<never, never>;
+export { MenuSeparator };

package/components/MenuSeparator/MenuSeparator.js

@@ -1,30 +1,39 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var React = tslib_1.__importStar(require("react"));
-var MenuSeparator_module_less_1 = tslib_1.__importDefault(require("./MenuSeparator.module.css"));
-var Emotion_1 = require("../../lib/theming/Emotion");
-var MenuSeparator_styles_1 = tslib_1.__importDefault(require("./MenuSeparator.styles"));
-var ThemeConsumer_1 = require("../ThemeConsumer");
-/**
- * Разделитель в меню.
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React, { useContext } from 'react';
+import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { ResponsiveLayout } from '../ResponsiveLayout/index.js';
+import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
+import { getStyles } from './MenuSeparator.styles.js';
+export var MenuSeparatorDataTids = {
+    root: 'MenuSeparator__root',
+};
+/**
+ * `MenuSeparator` добавляет разделительную линию между элементами меню.
+ *
+ * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.
  */
-var MenuSeparator = /** @class */function (_super) {
-  tslib_1.__extends(MenuSeparator, _super);
-  function MenuSeparator() {
-    return _super !== null && _super.apply(this, arguments) || this;
-  }
-  MenuSeparator.prototype.render = function () {
-    var _this = this;
-    return React.createElement(ThemeConsumer_1.ThemeConsumer, null, function (theme) {
-      _this.theme = theme;
-      return _this.renderMain();
-    });
-  };
-  MenuSeparator.prototype.renderMain = function () {
-    return React.createElement("div", { className: Emotion_1.cx(MenuSeparator_module_less_1["default"].root, MenuSeparator_styles_1["default"].root(this.theme)) });
-  };
-  MenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';
-  return MenuSeparator;
-}(React.Component);
-exports["default"] = MenuSeparator;
+var MenuSeparator = forwardRefAndName('MenuSeparator', function MenuSeparator(props, ref) {
+    var theme = useContext(ThemeContext);
+    var cx = useEmotion().cx;
+    var styles = useStyles(getStyles);
+    return (React.createElement(CommonWrapper, __assign({}, props),
+        React.createElement(ResponsiveLayout, null, function (_a) {
+            var _b;
+            var isMobile = _a.isMobile;
+            return (React.createElement("div", { ref: ref, "data-tid": MenuSeparatorDataTids.root, className: cx((_b = {}, _b[styles.root(theme)] = true, _b[styles.rootMobile(theme)] = isMobile, _b)) }));
+        })));
+});
+export { MenuSeparator };
+//# sourceMappingURL=MenuSeparator.js.map

package/components/MenuSeparator/MenuSeparator.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuSeparator.js","sourceRoot":"","sources":["MenuSeparator.tsx"],"names":[],"mappings":";;;AAAA,mDAA+B;AAC/B,kGAAiD;AACjD,qDAA+C;AAC/C,wFAA8C;AAC9C,kDAAiD;AAGjD;;GAEG;AACH;IAA2C,yCAAmB;IAA9D;;IAmBA,CAAC;IAdQ,8BAAM,GAAb;QAAA,iBASC;QARC,OAAO,CACL,oBAAC,6BAAa,QACX,UAAA,KAAK;YACJ,KAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,OAAO,KAAI,CAAC,UAAU,EAAE,CAAC;QAC3B,CAAC,CACa,CACjB,CAAC;IACJ,CAAC;IAEO,kCAAU,GAAlB;QACE,OAAO,6BAAK,SAAS,EAAE,YAAE,CAAC,mCAAM,CAAC,IAAI,EAAE,8BAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAI,CAAC;IACxE,CAAC;IAjBa,iCAAmB,GAAG,eAAe,CAAC;IAkBtD,oBAAC;CAAA,AAnBD,CAA2C,KAAK,CAAC,SAAS,GAmBzD;kBAnBoB,aAAa"}
+{"version":3,"file":"MenuSeparator.js","sourceRoot":"","sources":["../../../components/MenuSeparator/MenuSeparator.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAItD,MAAM,CAAC,IAAM,qBAAqB,GAAG;IACnC,IAAI,EAAE,qBAAqB;CACnB,CAAC;AAEX;;;;GAIG;AACH,IAAM,aAAa,GAAG,iBAAiB,CACrC,eAAe,EACf,SAAS,aAAa,CAAC,KAAyB,EAAE,GAA8B;IAC9E,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC/B,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpC,OAAO,CACL,oBAAC,aAAa,eAAK,KAAK;QACtB,oBAAC,gBAAgB,QACd,UAAC,EAAY;;gBAAV,QAAQ,cAAA;YACV,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,cACE,qBAAqB,CAAC,IAAI,EACpC,SAAS,EAAE,EAAE,WAAG,GAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAG,IAAI,EAAE,GAAC,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,IAAG,QAAQ,MAAG,GACnF,CACH,CAAC;QACJ,CAAC,CACgB,CACL,CACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\n\nimport { getStyles } from './MenuSeparator.styles.js';\n\nexport type MenuSeparatorProps = CommonProps;\n\nexport const MenuSeparatorDataTids = {\n  root: 'MenuSeparator__root',\n} as const;\n\n/**\n * `MenuSeparator` добавляет разделительную линию между элементами меню.\n *\n * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.\n */\nconst MenuSeparator = forwardRefAndName(\n  'MenuSeparator',\n  function MenuSeparator(props: MenuSeparatorProps, ref: React.Ref<HTMLDivElement>) {\n    const theme = useContext(ThemeContext);\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n\n    return (\n      <CommonWrapper {...props}>\n        <ResponsiveLayout>\n          {({ isMobile }) => {\n            return (\n              <div\n                ref={ref}\n                data-tid={MenuSeparatorDataTids.root}\n                className={cx({ [styles.root(theme)]: true, [styles.rootMobile(theme)]: isMobile })}\n              />\n            );\n          }}\n        </ResponsiveLayout>\n      </CommonWrapper>\n    );\n  },\n);\n\nexport { MenuSeparator };\n"]}

package/components/MenuSeparator/MenuSeparator.styles.d.ts

@@ -1,5 +1,5 @@
-import { ITheme } from '../../lib/theming/Theme';
-declare const jsStyles: {
-    root(t: ITheme): string;
-};
-export default jsStyles;
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    root(t: Theme): string;
+    rootMobile(t: Theme): string;
+}>;

package/components/MenuSeparator/MenuSeparator.styles.js

@@ -1,11 +1,18 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var Emotion_1 = require("../../lib/theming/Emotion");
-var jsStyles = {
-  root: function root(t) {
-    return Emotion_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      border-top: 1px solid ", ";\n    "], ["\n      border-top: 1px solid ", ";\n    "])), t.menuSeparatorBorderColor);
-  } };
-
-exports["default"] = jsStyles;
-var templateObject_1;
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        root: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      margin: ", " ", ";\n      border-top: ", " solid ", ";\n    "], ["\n      margin: ", " ", ";\n      border-top: ", " solid ", ";\n    "])), t.menuSeparatorMarginY, t.menuSeparatorMarginX, t.menuSeparatorBorderWidth, t.menuSeparatorBorderColor);
+        },
+        rootMobile: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      margin: ", " ", ";\n      border-radius: 1px;\n    "], ["\n      margin: ", " ", ";\n      border-radius: 1px;\n    "])), t.mobileMenuSeparatorMarginY, t.mobileMenuSeparatorMarginX);
+        },
+    });
+});
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=MenuSeparator.styles.js.map

package/components/MenuSeparator/MenuSeparator.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuSeparator.styles.js","sourceRoot":"","sources":["MenuSeparator.styles.ts"],"names":[],"mappings":";;;AAAA,qDAAgD;AAGhD,IAAM,QAAQ,GAAG;IACf,IAAI,YAAC,CAAS;QACZ,OAAO,aAAG,sHAAA,gCACgB,EAA0B,SACnD,KADyB,CAAC,CAAC,wBAAwB,EAClD;IACJ,CAAC;CACF,CAAC;AAEF,kBAAe,QAAQ,CAAC"}
+{"version":3,"file":"MenuSeparator.styles.js","sourceRoot":"","sources":["../../../components/MenuSeparator/MenuSeparator.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI,YAAC,CAAQ;YACX,OAAO,GAAG,yIAAA,kBACE,EAAsB,GAAI,EAAsB,uBAC5C,EAA0B,SAAU,EAA0B,SAC7E,KAFW,CAAC,CAAC,oBAAoB,EAAI,CAAC,CAAC,oBAAoB,EAC5C,CAAC,CAAC,wBAAwB,EAAU,CAAC,CAAC,wBAAwB,EAC5E;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,gIAAA,kBACE,EAA4B,GAAI,EAA4B,oCAEvE,KAFW,CAAC,CAAC,0BAA0B,EAAI,CAAC,CAAC,0BAA0B,EAEtE;QACJ,CAAC;KACF,CAAC;AAd8D,CAc9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root(t: Theme) {\n    return css`\n      margin: ${t.menuSeparatorMarginY} ${t.menuSeparatorMarginX};\n      border-top: ${t.menuSeparatorBorderWidth} solid ${t.menuSeparatorBorderColor};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      margin: ${t.mobileMenuSeparatorMarginY} ${t.mobileMenuSeparatorMarginX};\n      border-radius: 1px;\n    `;\n  },\n}));\n"]}

package/components/MenuSeparator/index.d.ts

@@ -1 +1 @@
-export { default } from './MenuSeparator';
+export * from './MenuSeparator.js';

package/components/MenuSeparator/index.js

@@ -1,4 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var MenuSeparator_1 = require("./MenuSeparator");
-exports["default"] = MenuSeparator_1["default"];
+export * from './MenuSeparator.js';
+//# sourceMappingURL=index.js.map

package/components/MenuSeparator/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";;AAAA,iDAA0C;AAAjC,kCAAA,OAAO,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/MenuSeparator/index.tsx"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './MenuSeparator.js';\n"]}

package/components/MiniModal/MiniModal.d.ts

@@ -0,0 +1,25 @@
+import type { ModalProps } from '../Modal/index.js';
+import { Modal } from '../Modal/index.js';
+import { MiniModalFooter } from './MiniModalFooter.js';
+import { MiniModalHeader } from './MiniModalHeader.js';
+import { MiniModalBody } from './MiniModalBody.js';
+import { MiniModalIndent } from './MiniModalIndent.js';
+export declare const MiniModalDataTids: {
+    readonly icon: "MiniModal__icon";
+    readonly title: "MiniModal__title";
+    readonly description: "MiniModal__description";
+    readonly actions: "MiniModal__actions";
+    readonly indent: "MiniModal__indent";
+};
+/**
+ * `MiniModal` — модальное диалоговое окно, которое предполагает обязательный отклик пользователя по одному из доступных действий. Обёртка над Modal.
+ * Закрытие окна по клику на фон или "крестик" не рекомендуется, т.к. у этих действий нет однозначного описания в отличие от кнопок с названиями, наподобие "Сохранить", "Подтвердить" и т.п.
+ *
+ * По макету предполагается, что все кнопки должны быть среднего размера `size = medium`.
+ */
+export declare const MiniModal: import("../../lib/forwardRefAndName.js").ReactUIComponentWithRef<Modal, ModalProps> & {
+    Header: typeof MiniModalHeader;
+    Indent: typeof MiniModalIndent;
+    Footer: typeof MiniModalFooter;
+    Body: typeof MiniModalBody;
+};

package/components/MiniModal/MiniModal.js

@@ -0,0 +1,55 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useContext } from 'react';
+import { Modal } from '../Modal/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
+import { getMiniModalTheme } from './getMiniModalTheme.js';
+import { MiniModalFooter } from './MiniModalFooter.js';
+import { MiniModalHeader } from './MiniModalHeader.js';
+import { MiniModalBody } from './MiniModalBody.js';
+import { MiniModalIndent } from './MiniModalIndent.js';
+export var MiniModalDataTids = {
+    icon: 'MiniModal__icon',
+    title: 'MiniModal__title',
+    description: 'MiniModal__description',
+    actions: 'MiniModal__actions',
+    indent: 'MiniModal__indent',
+};
+/**
+ * `MiniModal` — модальное диалоговое окно, которое предполагает обязательный отклик пользователя по одному из доступных действий. Обёртка над Modal.
+ * Закрытие окна по клику на фон или "крестик" не рекомендуется, т.к. у этих действий нет однозначного описания в отличие от кнопок с названиями, наподобие "Сохранить", "Подтвердить" и т.п.
+ *
+ * По макету предполагается, что все кнопки должны быть среднего размера `size = medium`.
+ */
+export var MiniModal = forwardRefAndName('MiniModal', function (_a, ref) {
+    var children = _a.children, propsTheme = _a.theme, mobileAppearance = _a.mobileAppearance, rest = __rest(_a, ["children", "theme", "mobileAppearance"]);
+    var contextTheme = useContext(ThemeContext);
+    return (React.createElement(ThemeContext.Provider, { value: getMiniModalTheme(contextTheme, propsTheme) },
+        React.createElement(Modal, __assign({ width: 400, mobileAppearance: mobileAppearance !== null && mobileAppearance !== void 0 ? mobileAppearance : 'center', noClose: true, ref: ref }, rest), children)));
+});
+MiniModal.Header = MiniModalHeader;
+MiniModal.Footer = MiniModalFooter;
+MiniModal.Indent = MiniModalIndent;
+MiniModal.Body = MiniModalBody;
+//# sourceMappingURL=MiniModal.js.map

package/components/MiniModal/MiniModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniModal.js","sourceRoot":"","sources":["../../../components/MiniModal/MiniModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,MAAM,CAAC,IAAM,iBAAiB,GAAG;IAC/B,IAAI,EAAE,iBAAiB;IACvB,KAAK,EAAE,kBAAkB;IACzB,WAAW,EAAE,wBAAwB;IACrC,OAAO,EAAE,oBAAoB;IAC7B,MAAM,EAAE,mBAAmB;CACnB,CAAC;AAEX;;;;;GAKG;AACH,MAAM,CAAC,IAAM,SAAS,GAAG,iBAAiB,CASxC,WAAW,EAAE,UAAC,EAA0D,EAAE,GAAG;IAA7D,IAAA,QAAQ,cAAA,EAAS,UAAU,WAAA,EAAE,gBAAgB,sBAAA,EAAK,IAAI,cAAxD,yCAA0D,CAAF;IACtE,IAAM,YAAY,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAE9C,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,iBAAiB,CAAC,YAAY,EAAE,UAAU,CAAC;QACvE,oBAAC,KAAK,aAAC,KAAK,EAAE,GAAG,EAAE,gBAAgB,EAAE,gBAAgB,aAAhB,gBAAgB,cAAhB,gBAAgB,GAAI,QAAQ,EAAE,OAAO,QAAC,GAAG,EAAE,GAAG,IAAM,IAAI,GAC1F,QAAQ,CACH,CACc,CACzB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,SAAS,CAAC,MAAM,GAAG,eAAe,CAAC;AACnC,SAAS,CAAC,MAAM,GAAG,eAAe,CAAC;AACnC,SAAS,CAAC,MAAM,GAAG,eAAe,CAAC;AACnC,SAAS,CAAC,IAAI,GAAG,aAAa,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport type { ModalProps } from '../Modal/index.js';\nimport { Modal } from '../Modal/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\n\nimport { getMiniModalTheme } from './getMiniModalTheme.js';\nimport { MiniModalFooter } from './MiniModalFooter.js';\nimport { MiniModalHeader } from './MiniModalHeader.js';\nimport { MiniModalBody } from './MiniModalBody.js';\nimport { MiniModalIndent } from './MiniModalIndent.js';\n\nexport const MiniModalDataTids = {\n  icon: 'MiniModal__icon',\n  title: 'MiniModal__title',\n  description: 'MiniModal__description',\n  actions: 'MiniModal__actions',\n  indent: 'MiniModal__indent',\n} as const;\n\n/**\n * `MiniModal` — модальное диалоговое окно, которое предполагает обязательный отклик пользователя по одному из доступных действий. Обёртка над Modal.\n * Закрытие окна по клику на фон или \"крестик\" не рекомендуется, т.к. у этих действий нет однозначного описания в отличие от кнопок с названиями, наподобие \"Сохранить\", \"Подтвердить\" и т.п.\n *\n * По макету предполагается, что все кнопки должны быть среднего размера `size = medium`.\n */\nexport const MiniModal = forwardRefAndName<\n  Modal,\n  ModalProps,\n  {\n    Header: typeof MiniModalHeader;\n    Indent: typeof MiniModalIndent;\n    Footer: typeof MiniModalFooter;\n    Body: typeof MiniModalBody;\n  }\n>('MiniModal', ({ children, theme: propsTheme, mobileAppearance, ...rest }, ref) => {\n  const contextTheme = useContext(ThemeContext);\n\n  return (\n    <ThemeContext.Provider value={getMiniModalTheme(contextTheme, propsTheme)}>\n      <Modal width={400} mobileAppearance={mobileAppearance ?? 'center'} noClose ref={ref} {...rest}>\n        {children}\n      </Modal>\n    </ThemeContext.Provider>\n  );\n});\n\nMiniModal.Header = MiniModalHeader;\nMiniModal.Footer = MiniModalFooter;\nMiniModal.Indent = MiniModalIndent;\nMiniModal.Body = MiniModalBody;\n"]}

package/components/MiniModal/MiniModal.styles.d.ts

@@ -0,0 +1,11 @@
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    icon(): string;
+    description(t: Theme): string;
+    title(): string;
+    titleWithIcon(t: Theme): string;
+    actions(): string;
+    actionsIndent(t: Theme): string;
+    actionsRow(t: Theme): string;
+    actionsColumn(t: Theme): string;
+}>;

package/components/MiniModal/MiniModal.styles.js

@@ -0,0 +1,37 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+import { globalClasses as buttonGlobalClasses } from '../Button/Button.styles.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        icon: function () {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      text-align: center;\n    "], ["\n      text-align: center;\n    "])));
+        },
+        description: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      text-align: center;\n      font-size: ", ";\n      line-height: ", ";\n    "], ["\n      text-align: center;\n      font-size: ", ";\n      line-height: ", ";\n    "])), t.miniModalDescriptionFontSize, t.miniModalDescriptionLineHeight);
+        },
+        title: function () {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      text-align: center;\n    "], ["\n      text-align: center;\n    "])));
+        },
+        titleWithIcon: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      margin-top: ", ";\n    "], ["\n      margin-top: ", ";\n    "])), t.miniModalTitleMarginTop);
+        },
+        actions: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      display: flex;\n      justify-content: stretch;\n      text-align: center;\n\n      .", " {\n        width: 100%;\n      }\n    "], ["\n      display: flex;\n      justify-content: stretch;\n      text-align: center;\n\n      .", " {\n        width: 100%;\n      }\n    "])), buttonGlobalClasses.root);
+        },
+        actionsIndent: function (t) {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      padding: ", " 0;\n    "], ["\n      padding: ", " 0;\n    "])), t.miniModalCancelIndent);
+        },
+        actionsRow: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      flex-direction: row;\n      > *:nth-of-type(1) {\n        margin-right: calc(", " / 2);\n      }\n      > *:nth-of-type(2) {\n        margin-left: calc(", " / 2);\n      }\n    "], ["\n      flex-direction: row;\n      > *:nth-of-type(1) {\n        margin-right: calc(", " / 2);\n      }\n      > *:nth-of-type(2) {\n        margin-left: calc(", " / 2);\n      }\n    "])), t.miniModalActionGap, t.miniModalActionGap);
+        },
+        actionsColumn: function (t) {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      flex-direction: column;\n      > *:nth-of-type(2) {\n        margin-top: ", ";\n      }\n      > *:nth-of-type(3) {\n        margin-top: ", ";\n      }\n    "], ["\n      flex-direction: column;\n      > *:nth-of-type(2) {\n        margin-top: ", ";\n      }\n      > *:nth-of-type(3) {\n        margin-top: ", ";\n      }\n    "])), t.miniModalActionGap, t.miniModalActionGap);
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
+//# sourceMappingURL=MiniModal.styles.js.map

package/components/MiniModal/MiniModal.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniModal.styles.js","sourceRoot":"","sources":["../../../components/MiniModal/MiniModal.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,OAAO,EAAE,aAAa,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAElF,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI;YACF,OAAO,GAAG,sGAAA,mCAET,KAAC;QACJ,CAAC;QAED,WAAW,YAAC,CAAQ;YAClB,OAAO,GAAG,wJAAA,gDAEK,EAA8B,wBAC5B,EAAgC,SAChD,KAFc,CAAC,CAAC,4BAA4B,EAC5B,CAAC,CAAC,8BAA8B,EAC/C;QACJ,CAAC;QAED,KAAK;YACH,OAAO,GAAG,sGAAA,mCAET,KAAC;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,oGAAA,sBACM,EAAyB,SACxC,KADe,CAAC,CAAC,uBAAuB,EACvC;QACJ,CAAC;QAED,OAAO;YACL,OAAO,GAAG,6MAAA,+FAKL,EAAwB,yCAG5B,KAHI,mBAAmB,CAAC,IAAI,EAG3B;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,mGAAA,mBACG,EAAuB,WACnC,KADY,CAAC,CAAC,qBAAqB,EAClC;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,8PAAA,uFAGe,EAAoB,yEAGrB,EAAoB,uBAE3C,KALwB,CAAC,CAAC,kBAAkB,EAGrB,CAAC,CAAC,kBAAkB,EAE1C;QACJ,CAAC;QAED,aAAa,YAAC,CAAQ;YACpB,OAAO,GAAG,0OAAA,mFAGQ,EAAoB,8DAGpB,EAAoB,kBAErC,KALiB,CAAC,CAAC,kBAAkB,EAGpB,CAAC,CAAC,kBAAkB,EAEpC;QACJ,CAAC;KACF,CAAC;AApE8D,CAoE9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { globalClasses as buttonGlobalClasses } from '../Button/Button.styles.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  icon() {\n    return css`\n      text-align: center;\n    `;\n  },\n\n  description(t: Theme) {\n    return css`\n      text-align: center;\n      font-size: ${t.miniModalDescriptionFontSize};\n      line-height: ${t.miniModalDescriptionLineHeight};\n    `;\n  },\n\n  title() {\n    return css`\n      text-align: center;\n    `;\n  },\n\n  titleWithIcon(t: Theme) {\n    return css`\n      margin-top: ${t.miniModalTitleMarginTop};\n    `;\n  },\n\n  actions() {\n    return css`\n      display: flex;\n      justify-content: stretch;\n      text-align: center;\n\n      .${buttonGlobalClasses.root} {\n        width: 100%;\n      }\n    `;\n  },\n\n  actionsIndent(t: Theme) {\n    return css`\n      padding: ${t.miniModalCancelIndent} 0;\n    `;\n  },\n\n  actionsRow(t: Theme) {\n    return css`\n      flex-direction: row;\n      > *:nth-of-type(1) {\n        margin-right: calc(${t.miniModalActionGap} / 2);\n      }\n      > *:nth-of-type(2) {\n        margin-left: calc(${t.miniModalActionGap} / 2);\n      }\n    `;\n  },\n\n  actionsColumn(t: Theme) {\n    return css`\n      flex-direction: column;\n      > *:nth-of-type(2) {\n        margin-top: ${t.miniModalActionGap};\n      }\n      > *:nth-of-type(3) {\n        margin-top: ${t.miniModalActionGap};\n      }\n    `;\n  },\n}));\n"]}

package/components/MiniModal/MiniModalBody.d.ts

@@ -0,0 +1,7 @@
+import type { ModalBodyProps } from '../Modal/index.js';
+/**
+ * Обёртка над Modal.Body
+ *
+ * @visibleName MiniModal.Body
+ */
+export declare const MiniModalBody: import("../../lib/forwardRefAndName.js").ReactUIComponentWithRef<HTMLDivElement, ModalBodyProps> & Record<never, never>;

package/components/MiniModal/MiniModalBody.js

@@ -0,0 +1,44 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
+import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
+import { Modal } from '../Modal/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { MiniModalDataTids } from './MiniModal.js';
+import { getStyles } from './MiniModal.styles.js';
+/**
+ * Обёртка над Modal.Body
+ *
+ * @visibleName MiniModal.Body
+ */
+export var MiniModalBody = forwardRefAndName('MiniModalBody', function (_a, ref) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    var cx = useEmotion().cx;
+    var styles = useStyles(getStyles);
+    return (React.createElement(Modal.Body, __assign({}, rest),
+        React.createElement(ThemeContext.Consumer, null, function (theme) {
+            return (React.createElement("div", { "data-tid": MiniModalDataTids.description, ref: ref, className: cx(styles.description(theme)) }, children));
+        })));
+});
+//# sourceMappingURL=MiniModalBody.js.map

package/components/MiniModal/MiniModalBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniModalBody.js","sourceRoot":"","sources":["../../../components/MiniModal/MiniModalBody.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAElD;;;;GAIG;AACH,MAAM,CAAC,IAAM,aAAa,GAAG,iBAAiB,CAC5C,eAAe,EACf,UAAC,EAAqB,EAAE,GAAG;IAAxB,IAAA,QAAQ,cAAA,EAAK,IAAI,cAAnB,YAAqB,CAAF;IACV,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpC,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,eAAK,IAAI;QAClB,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK;YACL,OAAO,CACL,yCAAe,iBAAiB,CAAC,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,IAC7F,QAAQ,CACL,CACP,CAAC;QACJ,CAAC,CACqB,CACb,CACd,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import React from 'react';\n\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport type { ModalBodyProps } from '../Modal/index.js';\nimport { Modal } from '../Modal/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\n\nimport { MiniModalDataTids } from './MiniModal.js';\nimport { getStyles } from './MiniModal.styles.js';\n\n/**\n * Обёртка над Modal.Body\n *\n * @visibleName MiniModal.Body\n */\nexport const MiniModalBody = forwardRefAndName<HTMLDivElement, ModalBodyProps>(\n  'MiniModalBody',\n  ({ children, ...rest }, ref) => {\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n\n    return (\n      <Modal.Body {...rest}>\n        <ThemeContext.Consumer>\n          {(theme) => {\n            return (\n              <div data-tid={MiniModalDataTids.description} ref={ref} className={cx(styles.description(theme))}>\n                {children}\n              </div>\n            );\n          }}\n        </ThemeContext.Consumer>\n      </Modal.Body>\n    );\n  },\n);\n"]}

package/components/MiniModal/MiniModalFooter.d.ts

@@ -0,0 +1,13 @@
+import type { ModalFooterProps } from '../Modal/index.js';
+interface MiniModalFooterProps extends ModalFooterProps {
+    /** Задает направление позиционирования кнопок. `row` работает только для 2 элементов, в других случаях автоматически включиться `column`.
+     * @default row */
+    direction?: 'row' | 'column';
+}
+/**
+ * Обёртка над Modal.Footer
+ *
+ * @visibleName MiniModal.Footer
+ */
+export declare const MiniModalFooter: import("../../lib/forwardRefAndName.js").ReactUIComponentWithRef<HTMLDivElement, MiniModalFooterProps> & Record<never, never>;
+export {};