@skbkontur/react-ui 6.4.6 → 6.4.7-9ac75.0

package/internal/Menu/Menu.js

@@ -36,6 +36,7 @@ import { MenuSeparator } from '../../components/MenuSeparator/index.js';
 import { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';
 import { ScrollContainer } from '../../components/ScrollContainer/index.js';
 import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { cx } from '../../lib/cx.js';
 import { getDOMRect } from '../../lib/dom/getDOMRect.js';
 import { scrollYCenterIntoNearestScrollable } from '../../lib/dom/scrollYCenterIntoNearestScrollable.js';
 import { isKeyArrowDown, isKeyArrowUp, isKeyEnter } from '../../lib/events/keyboard/identifiers.js';
@@ -43,14 +44,18 @@ import { isBrowser } from '../../lib/globalObject.js';
 import { isInstanceOf } from '../../lib/isInstanceOf.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { getRootNode, rootNode } from '../../lib/rootNode/index.js';
+import { memoizeTheme } from '../../lib/theming/memoizeTheme.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';
 import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
 import { isNonNullable } from '../../lib/utils.js';
 import { CommonWrapper } from '../CommonWrapper/index.js';
-import { getStyles } from './Menu.styles.js';
+import { styles } from './Menu.css.js';
 import { MenuContext } from './MenuContext.js';
 import { MenuNavigation } from './MenuNavigation.js';
+var getSeparatorWithNoMarginTheme = memoizeTheme(function (theme) {
+    return ThemeFactory.create({ menuSeparatorMarginY: '0' }, theme);
+});
 export var MenuDataTids = {
     root: 'Menu__root',
 };
@@ -75,28 +80,28 @@ var Menu = /** @class */ (function (_super) {
         };
         _this.renderHeader = function () {
             var _a;
-            return (React.createElement("div", { className: _this.cx((_a = {},
-                    _a[_this.styles.wrapper()] = true,
-                    _a[_this.styles.headerWrapper()] = true,
+            return (React.createElement("div", { className: cx((_a = {},
+                    _a[styles.wrapper] = true,
+                    _a[styles.headerWrapper] = true,
                     _a)), ref: function (el) {
                     _this.header = el;
                 } },
-                React.createElement("div", { className: _this.styles.contentWrapper() }, _this.props.header),
-                React.createElement("div", { className: _this.styles.menuSeparatorWrapper(_this.theme) }, _this.state.scrollState !== 'top' && _this.renderMenuSeparatorWithNoMargin())));
+                React.createElement("div", { className: styles.contentWrapper }, _this.props.header),
+                React.createElement("div", { className: styles.menuSeparatorWrapper }, _this.state.scrollState !== 'top' && _this.renderMenuSeparatorWithNoMargin())));
         };
         _this.renderFooter = function () {
             var _a;
-            return (React.createElement("div", { className: _this.cx((_a = {},
-                    _a[_this.styles.wrapper()] = true,
-                    _a[_this.styles.footerWrapper()] = true,
+            return (React.createElement("div", { className: cx((_a = {},
+                    _a[styles.wrapper] = true,
+                    _a[styles.footerWrapper] = true,
                     _a)), ref: function (el) {
                     _this.footer = el;
                 } },
-                React.createElement("div", { className: _this.styles.menuSeparatorWrapper(_this.theme) }, _this.state.scrollState !== 'bottom' && _this.renderMenuSeparatorWithNoMargin()),
-                React.createElement("div", { className: _this.styles.contentWrapper() }, _this.props.footer)));
+                React.createElement("div", { className: styles.menuSeparatorWrapper }, _this.state.scrollState !== 'bottom' && _this.renderMenuSeparatorWithNoMargin()),
+                React.createElement("div", { className: styles.contentWrapper }, _this.props.footer)));
         };
         _this.renderMenuSeparatorWithNoMargin = function () {
-            return (React.createElement(ThemeContext.Provider, { value: ThemeFactory.create({ menuSeparatorMarginY: '0' }, _this.theme) },
+            return (React.createElement(ThemeContext.Provider, { value: getSeparatorWithNoMarginTheme(_this.theme) },
                 React.createElement(MenuSeparator, null)));
         };
         _this.setInitialSelection = function () {
@@ -238,7 +243,6 @@ var Menu = /** @class */ (function (_super) {
     };
     Menu.prototype.render = function () {
         var _this = this;
-        this.styles = getStyles(this.emotion);
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return _this.renderMain();
@@ -313,18 +317,18 @@ var Menu = /** @class */ (function (_super) {
         var isMobile = this.isMobileLayout;
         var themeGTE6_1 = isThemeGTE(this.theme, '6.1');
         return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
-            React.createElement("div", { "data-tid": MenuDataTids.root, className: this.cx(getAlignRightClass(this.props, this.cx, this.styles), (_a = {},
-                    _a[this.styles.root(this.theme)] = true,
-                    _a[this.styles.hasMargin(this.theme)] = hasMargin,
-                    _a[this.styles.mobileRoot(this.theme)] = isMobile,
-                    _a[this.styles.mobileRoot6_1()] = themeGTE6_1 && isMobile,
-                    _a[this.styles.shadow(this.theme)] = !isMobile,
+            React.createElement("div", { "data-tid": MenuDataTids.root, className: cx(getAlignRightClass(this.props), (_a = {},
+                    _a[styles.root] = true,
+                    _a[styles.hasMargin] = hasMargin,
+                    _a[styles.mobileRoot] = isMobile,
+                    _a[styles.mobileRoot6_1] = themeGTE6_1 && isMobile,
+                    _a[styles.shadow] = !isMobile,
                     _a)), style: this.getStyle(this.props), id: this.props.id, onKeyDown: this.handleKeyDown, tabIndex: 0 },
                 this.props.header && this.renderHeader(),
                 React.createElement(ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, onScrollStateChangeY: this.handleScrollStateChange, disabled: this.props.disableScrollContainer, offsetY: offsetY },
-                    React.createElement("div", { className: this.cx((_b = {},
-                            _b[this.styles.scrollContainer(this.theme)] = true,
-                            _b[this.styles.scrollContainerMobile(this.theme)] = isMobile,
+                    React.createElement("div", { className: cx((_b = {},
+                            _b[styles.scrollContainer] = true,
+                            _b[styles.scrollContainerMobile] = isMobile,
                             _b)), ref: this.contentRef },
                         React.createElement(MenuContext.Provider, { value: {
                                 navigation: this.menuNavigation,
@@ -374,9 +378,9 @@ function childrenToArray(children) {
     });
     return ret;
 }
-var getAlignRightClass = function (props, cx, styles) {
+var getAlignRightClass = function (props) {
     if (props.align === 'right') {
-        return cx(styles.alignRight());
+        return cx(styles.alignRight);
     }
     return null;
 };

package/internal/Menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","sourceRoot":"","sources":["Menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { CSSProperties, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { MenuItem } from '../../components/MenuItem/index.js';\nimport { MenuItemDataTids } from '../../components/MenuItem/index.js';\nimport { MenuSeparator } from '../../components/MenuSeparator/index.js';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { ScrollContainer } from '../../components/ScrollContainer/index.js';\nimport type { ScrollContainerScrollStateY } from '../../components/ScrollContainer/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { getDOMRect } from '../../lib/dom/getDOMRect.js';\nimport { scrollYCenterIntoNearestScrollable } from '../../lib/dom/scrollYCenterIntoNearestScrollable.js';\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter } from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isBrowser } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { getRootNode, rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport { isNonNullable } from '../../lib/utils.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { CommonWrapper } from '../CommonWrapper/index.js';\nimport { getStyles } from './Menu.styles.js';\nimport { MenuContext } from './MenuContext.js';\nimport { MenuNavigation } from './MenuNavigation.js';\n\nexport interface MenuProps extends CommonProps, Pick<HTMLAttributes<HTMLDivElement>, 'id'> {\n  children: React.ReactNode;\n  hasMargin?: boolean;\n  /**\n   * Максимальная высота применяется только для скролл контейнера\n   *\n   * Высота `header` и `footer` в нее не включены\n   */\n  maxHeight?: number | string;\n  onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n  width?: number | string;\n  preventWindowScroll?: boolean;\n  /**\n   * Отключение кастомного скролла контейнера\n   */\n  disableScrollContainer?: boolean;\n  align?: 'left' | 'right';\n  /**\n   * Отключает выравнивание текста пунктов меню относительно иконок в других пунктах.\n   */\n  preventIconsOffset?: boolean;\n  onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  /**\n   * Циклический перебор айтемов меню (по-дефолтну включен)\n   */\n  cyclicSelection?: boolean;\n  initialSelectedItemIndex?: number;\n}\n\nexport interface MenuState {\n  maxHeight: number | string;\n  scrollState: ScrollContainerScrollStateY;\n  enableIconPadding: boolean;\n}\n\nexport const MenuDataTids = {\n  root: 'Menu__root',\n} as const;\n\ntype DefaultProps = Required<\n  Pick<\n    MenuProps,\n    | 'align'\n    | 'width'\n    | 'hasMargin'\n    | 'maxHeight'\n    | 'preventWindowScroll'\n    | 'cyclicSelection'\n    | 'initialSelectedItemIndex'\n  >\n>;\n\n@withRenderEnvironment\n@responsiveLayout\n@rootNode\nexport class Menu extends React.PureComponent<MenuProps, MenuState> {\n  public static __KONTUR_REACT_UI__ = 'Menu';\n  public static displayName = 'Menu';\n\n  public static defaultProps: DefaultProps = {\n    align: 'left',\n    width: 'auto',\n    maxHeight: 300,\n    hasMargin: true,\n    preventWindowScroll: true,\n    cyclicSelection: true,\n    initialSelectedItemIndex: -1,\n  };\n\n  private getProps = createPropsGetter(Menu.defaultProps);\n\n  public state: MenuState = {\n    maxHeight: this.getProps().maxHeight || 'none',\n    scrollState: 'top',\n    enableIconPadding: false,\n  };\n\n  private globalObject!: GlobalObject;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n  private theme!: Theme;\n  private scrollContainer: Nullable<ScrollContainer>;\n  private isMobileLayout!: boolean;\n  private unmounted = false;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private header: Nullable<HTMLDivElement>;\n  private footer: Nullable<HTMLDivElement>;\n  private contentRef = React.createRef<HTMLDivElement>();\n  private menuNavigation: MenuNavigation<MenuItem> = new MenuNavigation(this.contentRef, MenuItemDataTids.content);\n\n  public componentWillUnmount(): void {\n    this.unmounted = true;\n  }\n\n  public componentDidMount(): void {\n    this.setInitialSelection();\n    this.calculateMaxHeight();\n    this.unmounted = false;\n  }\n\n  public componentDidUpdate(prevProps: MenuProps): void {\n    if (this.shouldRecalculateMaxHeight(prevProps)) {\n      this.calculateMaxHeight();\n    }\n\n    if (prevProps.maxHeight !== this.getProps().maxHeight) {\n      this.setState({\n        maxHeight: this.props.maxHeight || 'none',\n      });\n    }\n  }\n\n  public focus(): void {\n    this.focusOnRootElement();\n  }\n\n  private focusOnRootElement = (): void => {\n    const rootNode = getRootNode(this);\n    if (isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n      rootNode?.focus();\n    }\n  };\n\n  public render() {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public up() {\n    this.move(-1);\n  }\n\n  /**\n   * @public\n   */\n  public down() {\n    this.move(1);\n  }\n\n  /**\n   * @public\n   */\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\n    this.menuNavigation.highlightedItem?.navigate();\n    return this.menuNavigation.select(event);\n  }\n\n  /**\n   * @public\n   */\n  public reset(): void {\n    this.menuNavigation.reset();\n  }\n\n  /**\n   * @public\n   */\n  public hasHighlightedItem() {\n    return !!this.menuNavigation.highlightedItem;\n  }\n\n  public highlightItem(index: number) {\n    this.menuNavigation.highlightByIndex(index);\n  }\n\n  /**\n   * Прокручивает список к пункту с `state=\"selected\"` без навигационного highlight.\n   * @public\n   */\n  public scrollToSelectedMenuItem(): void {\n    const selectedItem = this.menuNavigation.items.find((item) => item.props.state === 'selected' && item.isEnabled());\n    if (!selectedItem) {\n      return;\n    }\n\n    const rootNode = getRootNode(selectedItem);\n    if (!isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n      return;\n    }\n\n    if (this.props.disableScrollContainer) {\n      scrollYCenterIntoNearestScrollable(rootNode);\n      return;\n    }\n\n    this.scrollContainer?.scrollTo(rootNode);\n  }\n\n  private renderMain() {\n    if (this.isEmpty()) {\n      return null;\n    }\n    const { hasMargin, maxHeight, preventWindowScroll } = this.getProps();\n\n    const offsetY = {\n      top: `${this.theme.scrollContainerScrollBarOffsetY}`,\n      right: 0,\n      bottom: `${this.theme.scrollContainerScrollBarOffsetY}`,\n    };\n\n    const isMobile = this.isMobileLayout;\n    const themeGTE6_1 = isThemeGTE(this.theme, '6.1');\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div\n          data-tid={MenuDataTids.root}\n          className={this.cx(getAlignRightClass(this.props, this.cx, this.styles), {\n            [this.styles.root(this.theme)]: true,\n            [this.styles.hasMargin(this.theme)]: hasMargin,\n            [this.styles.mobileRoot(this.theme)]: isMobile,\n            [this.styles.mobileRoot6_1()]: themeGTE6_1 && isMobile,\n            [this.styles.shadow(this.theme)]: !isMobile,\n          })}\n          style={this.getStyle(this.props)}\n          id={this.props.id}\n          onKeyDown={this.handleKeyDown}\n          tabIndex={0}\n        >\n          {this.props.header && this.renderHeader()}\n          <ScrollContainer\n            ref={this.refScrollContainer}\n            maxHeight={maxHeight}\n            preventWindowScroll={preventWindowScroll}\n            onScrollStateChangeY={this.handleScrollStateChange}\n            disabled={this.props.disableScrollContainer}\n            offsetY={offsetY}\n          >\n            <div\n              className={this.cx({\n                [this.styles.scrollContainer(this.theme)]: true,\n                [this.styles.scrollContainerMobile(this.theme)]: isMobile,\n              })}\n              ref={this.contentRef}\n            >\n              <MenuContext.Provider\n                value={{\n                  navigation: this.menuNavigation,\n                  onItemClick: this.props.onItemClick,\n                  enableIconPadding: this.state.enableIconPadding,\n                  setEnableIconPadding: this.setEnableIconPadding,\n                }}\n              >\n                {this.props.children}\n              </MenuContext.Provider>\n            </div>\n          </ScrollContainer>\n          {this.props.footer && this.renderFooter()}\n        </div>\n      </CommonWrapper>\n    );\n  }\n\n  private renderHeader = () => {\n    return (\n      <div\n        className={this.cx({\n          [this.styles.wrapper()]: true,\n          [this.styles.headerWrapper()]: true,\n        })}\n        ref={(el) => {\n          this.header = el;\n        }}\n      >\n        <div className={this.styles.contentWrapper()}>{this.props.header}</div>\n        <div className={this.styles.menuSeparatorWrapper(this.theme)}>\n          {this.state.scrollState !== 'top' && this.renderMenuSeparatorWithNoMargin()}\n        </div>\n      </div>\n    );\n  };\n\n  private renderFooter = () => {\n    return (\n      <div\n        className={this.cx({\n          [this.styles.wrapper()]: true,\n          [this.styles.footerWrapper()]: true,\n        })}\n        ref={(el) => {\n          this.footer = el;\n        }}\n      >\n        <div className={this.styles.menuSeparatorWrapper(this.theme)}>\n          {this.state.scrollState !== 'bottom' && this.renderMenuSeparatorWithNoMargin()}\n        </div>\n        <div className={this.styles.contentWrapper()}>{this.props.footer}</div>\n      </div>\n    );\n  };\n\n  private renderMenuSeparatorWithNoMargin = () => {\n    return (\n      <ThemeContext.Provider value={ThemeFactory.create({ menuSeparatorMarginY: '0' }, this.theme)}>\n        <MenuSeparator />\n      </ThemeContext.Provider>\n    );\n  };\n\n  private setInitialSelection = () => {\n    for (let i = this.getProps().initialSelectedItemIndex; i > -1; i--) {\n      this.down();\n    }\n  };\n\n  private shouldRecalculateMaxHeight = (prevProps: MenuProps): boolean => {\n    const { header, footer, children } = this.props;\n    const maxHeight = this.getProps().maxHeight;\n    const prevMaxHeight = prevProps.maxHeight;\n    const prevHeader = prevProps.header;\n    const prevFooter = prevProps.footer;\n    const prevChildrenCount = React.Children.count(prevProps.children);\n\n    return (\n      maxHeight !== prevMaxHeight ||\n      footer !== prevFooter ||\n      header !== prevHeader ||\n      React.Children.count(children) !== prevChildrenCount\n    );\n  };\n\n  private calculateMaxHeight = () => {\n    const maxHeight = this.getProps().maxHeight;\n    let parsedMaxHeight = maxHeight;\n    const rootNode = getRootNode(this);\n\n    if (typeof maxHeight === 'string' && isBrowser(this.globalObject) && rootNode) {\n      const rootElementMaxHeight = this.globalObject.getComputedStyle?.(rootNode).maxHeight;\n\n      if (rootElementMaxHeight) {\n        parsedMaxHeight = parseFloat(rootElementMaxHeight);\n      }\n    }\n\n    const calculatedMaxHeight =\n      typeof parsedMaxHeight === 'number'\n        ? parsedMaxHeight +\n          ((this.header && getDOMRect(this.header).height) || 0) +\n          ((this.footer && getDOMRect(this.footer).height) || 0)\n        : maxHeight;\n\n    this.setState({\n      maxHeight: calculatedMaxHeight || 'none',\n    });\n  };\n\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n    this.scrollContainer = scrollContainer;\n  };\n\n  private scrollToSelected = () => {\n    const highlightedItem = this.menuNavigation.highlightedItem;\n    if (this.scrollContainer && highlightedItem) {\n      const rootNode = getRootNode(highlightedItem);\n      // TODO: Remove this check once IF-647 is resolved\n      if (isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n        this.scrollContainer.scrollTo(rootNode);\n      }\n    }\n  };\n\n  private scrollToTop = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToTop();\n    }\n  };\n\n  private scrollToBottom = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToBottom();\n    }\n  };\n\n  private scroll = (nextIndex: number) => {\n    switch (nextIndex) {\n      case 0:\n        this.scrollToTop?.();\n        break;\n      case this.menuNavigation.items.length - 1:\n        this.scrollToBottom?.();\n        break;\n      default:\n        this.scrollToSelected?.();\n    }\n  };\n\n  private move(step: number) {\n    if (this.unmounted) {\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n      return;\n    }\n    const nextIndex = this.menuNavigation.move(step, this.getProps().cyclicSelection);\n    this.scroll(nextIndex);\n  }\n\n  private isEmpty() {\n    const { children } = this.props;\n    return !children || !childrenToArray(children).filter(isNonNullable).length;\n  }\n\n  private handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (typeof this.props.onKeyDown === 'function') {\n      this.props.onKeyDown(event);\n    }\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (isKeyArrowUp(event)) {\n      event.preventDefault();\n      this.up();\n    } else if (isKeyArrowDown(event)) {\n      event.preventDefault();\n      this.down();\n    } else if (isKeyEnter(event)) {\n      this.menuNavigation.select(event);\n    }\n  };\n\n  private getStyle = (props: MenuProps): CSSProperties => {\n    if (props.align === 'right') {\n      return {\n        maxWidth: props.width,\n        minWidth: props.width,\n        maxHeight: this.state.maxHeight,\n      };\n    }\n\n    return {\n      width: props.width,\n      maxHeight: this.state.maxHeight,\n    };\n  };\n\n  private handleScrollStateChange = (scrollState: ScrollContainerScrollStateY) => {\n    if (this.state.scrollState !== scrollState) {\n      this.setState({ scrollState });\n    }\n  };\n\n  private setEnableIconPadding = (isIconPaddingEnabled: boolean) => {\n    !this.getProps().preventIconsOffset && this.setState({ enableIconPadding: isIconPaddingEnabled });\n  };\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n  const ret: React.ReactNode[] = [];\n  // Use forEach instead of map to avoid cloning for key unifying.\n  React.Children.forEach(children, (child) => {\n    ret.push(child);\n  });\n  return ret;\n}\n\nconst getAlignRightClass = (props: MenuProps, cx: Emotion['cx'], styles: ReturnType<typeof getStyles>) => {\n  if (props.align === 'right') {\n    return cx(styles.alignRight());\n  }\n\n  return null;\n};\n"]}
+{"version":3,"file":"Menu.js","sourceRoot":"","sources":["Menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { CSSProperties, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { MenuItem } from '../../components/MenuItem/index.js';\nimport { MenuItemDataTids } from '../../components/MenuItem/index.js';\nimport { MenuSeparator } from '../../components/MenuSeparator/index.js';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { ScrollContainer } from '../../components/ScrollContainer/index.js';\nimport type { ScrollContainerScrollStateY } from '../../components/ScrollContainer/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { cx } from '../../lib/cx.js';\nimport { getDOMRect } from '../../lib/dom/getDOMRect.js';\nimport { scrollYCenterIntoNearestScrollable } from '../../lib/dom/scrollYCenterIntoNearestScrollable.js';\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter } from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { isBrowser } from '../../lib/globalObject.js';\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { getRootNode, rootNode } from '../../lib/rootNode/index.js';\nimport { memoizeTheme } from '../../lib/theming/memoizeTheme.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport { isNonNullable } from '../../lib/utils.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { CommonWrapper } from '../CommonWrapper/index.js';\nimport { styles } from './Menu.css.js';\nimport { MenuContext } from './MenuContext.js';\nimport { MenuNavigation } from './MenuNavigation.js';\n\nconst getSeparatorWithNoMarginTheme = memoizeTheme((theme: Theme) =>\n  ThemeFactory.create({ menuSeparatorMarginY: '0' }, theme),\n);\n\nexport interface MenuProps extends CommonProps, Pick<HTMLAttributes<HTMLDivElement>, 'id'> {\n  children: React.ReactNode;\n  hasMargin?: boolean;\n  /**\n   * Максимальная высота применяется только для скролл контейнера\n   *\n   * Высота `header` и `footer` в нее не включены\n   */\n  maxHeight?: number | string;\n  onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n  width?: number | string;\n  preventWindowScroll?: boolean;\n  /**\n   * Отключение кастомного скролла контейнера\n   */\n  disableScrollContainer?: boolean;\n  align?: 'left' | 'right';\n  /**\n   * Отключает выравнивание текста пунктов меню относительно иконок в других пунктах.\n   */\n  preventIconsOffset?: boolean;\n  onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  /**\n   * Циклический перебор айтемов меню (по-дефолтну включен)\n   */\n  cyclicSelection?: boolean;\n  initialSelectedItemIndex?: number;\n}\n\nexport interface MenuState {\n  maxHeight: number | string;\n  scrollState: ScrollContainerScrollStateY;\n  enableIconPadding: boolean;\n}\n\nexport const MenuDataTids = {\n  root: 'Menu__root',\n} as const;\n\ntype DefaultProps = Required<\n  Pick<\n    MenuProps,\n    | 'align'\n    | 'width'\n    | 'hasMargin'\n    | 'maxHeight'\n    | 'preventWindowScroll'\n    | 'cyclicSelection'\n    | 'initialSelectedItemIndex'\n  >\n>;\n\n@withRenderEnvironment\n@responsiveLayout\n@rootNode\nexport class Menu extends React.PureComponent<MenuProps, MenuState> {\n  public static __KONTUR_REACT_UI__ = 'Menu';\n  public static displayName = 'Menu';\n\n  public static defaultProps: DefaultProps = {\n    align: 'left',\n    width: 'auto',\n    maxHeight: 300,\n    hasMargin: true,\n    preventWindowScroll: true,\n    cyclicSelection: true,\n    initialSelectedItemIndex: -1,\n  };\n\n  private getProps = createPropsGetter(Menu.defaultProps);\n\n  public state: MenuState = {\n    maxHeight: this.getProps().maxHeight || 'none',\n    scrollState: 'top',\n    enableIconPadding: false,\n  };\n\n  private globalObject!: GlobalObject;\n  private theme!: Theme;\n  private scrollContainer: Nullable<ScrollContainer>;\n  private isMobileLayout!: boolean;\n  private unmounted = false;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private header: Nullable<HTMLDivElement>;\n  private footer: Nullable<HTMLDivElement>;\n  private contentRef = React.createRef<HTMLDivElement>();\n  private menuNavigation: MenuNavigation<MenuItem> = new MenuNavigation(this.contentRef, MenuItemDataTids.content);\n\n  public componentWillUnmount(): void {\n    this.unmounted = true;\n  }\n\n  public componentDidMount(): void {\n    this.setInitialSelection();\n    this.calculateMaxHeight();\n    this.unmounted = false;\n  }\n\n  public componentDidUpdate(prevProps: MenuProps): void {\n    if (this.shouldRecalculateMaxHeight(prevProps)) {\n      this.calculateMaxHeight();\n    }\n\n    if (prevProps.maxHeight !== this.getProps().maxHeight) {\n      this.setState({\n        maxHeight: this.props.maxHeight || 'none',\n      });\n    }\n  }\n\n  public focus(): void {\n    this.focusOnRootElement();\n  }\n\n  private focusOnRootElement = (): void => {\n    const rootNode = getRootNode(this);\n    if (isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n      rootNode?.focus();\n    }\n  };\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public up() {\n    this.move(-1);\n  }\n\n  /**\n   * @public\n   */\n  public down() {\n    this.move(1);\n  }\n\n  /**\n   * @public\n   */\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\n    this.menuNavigation.highlightedItem?.navigate();\n    return this.menuNavigation.select(event);\n  }\n\n  /**\n   * @public\n   */\n  public reset(): void {\n    this.menuNavigation.reset();\n  }\n\n  /**\n   * @public\n   */\n  public hasHighlightedItem() {\n    return !!this.menuNavigation.highlightedItem;\n  }\n\n  public highlightItem(index: number) {\n    this.menuNavigation.highlightByIndex(index);\n  }\n\n  /**\n   * Прокручивает список к пункту с `state=\"selected\"` без навигационного highlight.\n   * @public\n   */\n  public scrollToSelectedMenuItem(): void {\n    const selectedItem = this.menuNavigation.items.find((item) => item.props.state === 'selected' && item.isEnabled());\n    if (!selectedItem) {\n      return;\n    }\n\n    const rootNode = getRootNode(selectedItem);\n    if (!isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n      return;\n    }\n\n    if (this.props.disableScrollContainer) {\n      scrollYCenterIntoNearestScrollable(rootNode);\n      return;\n    }\n\n    this.scrollContainer?.scrollTo(rootNode);\n  }\n\n  private renderMain() {\n    if (this.isEmpty()) {\n      return null;\n    }\n    const { hasMargin, maxHeight, preventWindowScroll } = this.getProps();\n\n    const offsetY = {\n      top: `${this.theme.scrollContainerScrollBarOffsetY}`,\n      right: 0,\n      bottom: `${this.theme.scrollContainerScrollBarOffsetY}`,\n    };\n\n    const isMobile = this.isMobileLayout;\n    const themeGTE6_1 = isThemeGTE(this.theme, '6.1');\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div\n          data-tid={MenuDataTids.root}\n          className={cx(getAlignRightClass(this.props), {\n            [styles.root]: true,\n            [styles.hasMargin]: hasMargin,\n            [styles.mobileRoot]: isMobile,\n            [styles.mobileRoot6_1]: themeGTE6_1 && isMobile,\n            [styles.shadow]: !isMobile,\n          })}\n          style={this.getStyle(this.props)}\n          id={this.props.id}\n          onKeyDown={this.handleKeyDown}\n          tabIndex={0}\n        >\n          {this.props.header && this.renderHeader()}\n          <ScrollContainer\n            ref={this.refScrollContainer}\n            maxHeight={maxHeight}\n            preventWindowScroll={preventWindowScroll}\n            onScrollStateChangeY={this.handleScrollStateChange}\n            disabled={this.props.disableScrollContainer}\n            offsetY={offsetY}\n          >\n            <div\n              className={cx({\n                [styles.scrollContainer]: true,\n                [styles.scrollContainerMobile]: isMobile,\n              })}\n              ref={this.contentRef}\n            >\n              <MenuContext.Provider\n                value={{\n                  navigation: this.menuNavigation,\n                  onItemClick: this.props.onItemClick,\n                  enableIconPadding: this.state.enableIconPadding,\n                  setEnableIconPadding: this.setEnableIconPadding,\n                }}\n              >\n                {this.props.children}\n              </MenuContext.Provider>\n            </div>\n          </ScrollContainer>\n          {this.props.footer && this.renderFooter()}\n        </div>\n      </CommonWrapper>\n    );\n  }\n\n  private renderHeader = () => {\n    return (\n      <div\n        className={cx({\n          [styles.wrapper]: true,\n          [styles.headerWrapper]: true,\n        })}\n        ref={(el) => {\n          this.header = el;\n        }}\n      >\n        <div className={styles.contentWrapper}>{this.props.header}</div>\n        <div className={styles.menuSeparatorWrapper}>\n          {this.state.scrollState !== 'top' && this.renderMenuSeparatorWithNoMargin()}\n        </div>\n      </div>\n    );\n  };\n\n  private renderFooter = () => {\n    return (\n      <div\n        className={cx({\n          [styles.wrapper]: true,\n          [styles.footerWrapper]: true,\n        })}\n        ref={(el) => {\n          this.footer = el;\n        }}\n      >\n        <div className={styles.menuSeparatorWrapper}>\n          {this.state.scrollState !== 'bottom' && this.renderMenuSeparatorWithNoMargin()}\n        </div>\n        <div className={styles.contentWrapper}>{this.props.footer}</div>\n      </div>\n    );\n  };\n\n  private renderMenuSeparatorWithNoMargin = () => {\n    return (\n      <ThemeContext.Provider value={getSeparatorWithNoMarginTheme(this.theme)}>\n        <MenuSeparator />\n      </ThemeContext.Provider>\n    );\n  };\n\n  private setInitialSelection = () => {\n    for (let i = this.getProps().initialSelectedItemIndex; i > -1; i--) {\n      this.down();\n    }\n  };\n\n  private shouldRecalculateMaxHeight = (prevProps: MenuProps): boolean => {\n    const { header, footer, children } = this.props;\n    const maxHeight = this.getProps().maxHeight;\n    const prevMaxHeight = prevProps.maxHeight;\n    const prevHeader = prevProps.header;\n    const prevFooter = prevProps.footer;\n    const prevChildrenCount = React.Children.count(prevProps.children);\n\n    return (\n      maxHeight !== prevMaxHeight ||\n      footer !== prevFooter ||\n      header !== prevHeader ||\n      React.Children.count(children) !== prevChildrenCount\n    );\n  };\n\n  private calculateMaxHeight = () => {\n    const maxHeight = this.getProps().maxHeight;\n    let parsedMaxHeight = maxHeight;\n    const rootNode = getRootNode(this);\n\n    if (typeof maxHeight === 'string' && isBrowser(this.globalObject) && rootNode) {\n      const rootElementMaxHeight = this.globalObject.getComputedStyle?.(rootNode).maxHeight;\n\n      if (rootElementMaxHeight) {\n        parsedMaxHeight = parseFloat(rootElementMaxHeight);\n      }\n    }\n\n    const calculatedMaxHeight =\n      typeof parsedMaxHeight === 'number'\n        ? parsedMaxHeight +\n          ((this.header && getDOMRect(this.header).height) || 0) +\n          ((this.footer && getDOMRect(this.footer).height) || 0)\n        : maxHeight;\n\n    this.setState({\n      maxHeight: calculatedMaxHeight || 'none',\n    });\n  };\n\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n    this.scrollContainer = scrollContainer;\n  };\n\n  private scrollToSelected = () => {\n    const highlightedItem = this.menuNavigation.highlightedItem;\n    if (this.scrollContainer && highlightedItem) {\n      const rootNode = getRootNode(highlightedItem);\n      // TODO: Remove this check once IF-647 is resolved\n      if (isInstanceOf(rootNode, this.globalObject.HTMLElement)) {\n        this.scrollContainer.scrollTo(rootNode);\n      }\n    }\n  };\n\n  private scrollToTop = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToTop();\n    }\n  };\n\n  private scrollToBottom = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToBottom();\n    }\n  };\n\n  private scroll = (nextIndex: number) => {\n    switch (nextIndex) {\n      case 0:\n        this.scrollToTop?.();\n        break;\n      case this.menuNavigation.items.length - 1:\n        this.scrollToBottom?.();\n        break;\n      default:\n        this.scrollToSelected?.();\n    }\n  };\n\n  private move(step: number) {\n    if (this.unmounted) {\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n      return;\n    }\n    const nextIndex = this.menuNavigation.move(step, this.getProps().cyclicSelection);\n    this.scroll(nextIndex);\n  }\n\n  private isEmpty() {\n    const { children } = this.props;\n    return !children || !childrenToArray(children).filter(isNonNullable).length;\n  }\n\n  private handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (typeof this.props.onKeyDown === 'function') {\n      this.props.onKeyDown(event);\n    }\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (isKeyArrowUp(event)) {\n      event.preventDefault();\n      this.up();\n    } else if (isKeyArrowDown(event)) {\n      event.preventDefault();\n      this.down();\n    } else if (isKeyEnter(event)) {\n      this.menuNavigation.select(event);\n    }\n  };\n\n  private getStyle = (props: MenuProps): CSSProperties => {\n    if (props.align === 'right') {\n      return {\n        maxWidth: props.width,\n        minWidth: props.width,\n        maxHeight: this.state.maxHeight,\n      };\n    }\n\n    return {\n      width: props.width,\n      maxHeight: this.state.maxHeight,\n    };\n  };\n\n  private handleScrollStateChange = (scrollState: ScrollContainerScrollStateY) => {\n    if (this.state.scrollState !== scrollState) {\n      this.setState({ scrollState });\n    }\n  };\n\n  private setEnableIconPadding = (isIconPaddingEnabled: boolean) => {\n    !this.getProps().preventIconsOffset && this.setState({ enableIconPadding: isIconPaddingEnabled });\n  };\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n  const ret: React.ReactNode[] = [];\n  // Use forEach instead of map to avoid cloning for key unifying.\n  React.Children.forEach(children, (child) => {\n    ret.push(child);\n  });\n  return ret;\n}\n\nconst getAlignRightClass = (props: MenuProps) => {\n  if (props.align === 'right') {\n    return cx(styles.alignRight);\n  }\n\n  return null;\n};\n"]}

package/internal/MenuMessage/MenuMessage.css.d.ts

@@ -0,0 +1,18 @@
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const root: string;
+export declare const rootMobile: string;
+export declare const rootMobileLarge: string;
+export declare const rootMobileMedium: string;
+export declare const rootMobileSmall: string;
+export declare const styles: {
+    root: string;
+    rootMobile: string;
+    rootMobileLarge: string;
+    rootMobileMedium: string;
+    rootMobileSmall: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+};

package/internal/MenuMessage/MenuMessage.css.js

@@ -0,0 +1,10 @@
+
+export var root = 'react-ui-MenuMessage__root';
+export var rootLarge = 'react-ui-MenuMessage__rootLarge';
+export var rootMedium = 'react-ui-MenuMessage__rootMedium';
+export var rootMobile = 'react-ui-MenuMessage__rootMobile';
+export var rootMobileLarge = 'react-ui-MenuMessage__rootMobileLarge';
+export var rootMobileMedium = 'react-ui-MenuMessage__rootMobileMedium';
+export var rootMobileSmall = 'react-ui-MenuMessage__rootMobileSmall';
+export var rootSmall = 'react-ui-MenuMessage__rootSmall';
+export var styles = {root:'react-ui-MenuMessage__root',rootMobile:'react-ui-MenuMessage__rootMobile',rootMobileLarge:'react-ui-MenuMessage__rootMobileLarge',rootMobileMedium:'react-ui-MenuMessage__rootMobileMedium',rootMobileSmall:'react-ui-MenuMessage__rootMobileSmall',rootSmall:'react-ui-MenuMessage__rootSmall',rootMedium:'react-ui-MenuMessage__rootMedium',rootLarge:'react-ui-MenuMessage__rootLarge'};

package/internal/MenuMessage/MenuMessage.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuMessage.css.js","sourceRoot":"","sources":["MenuMessage.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AAEjD,4GAA4G;AAC5G,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC;IAC7B,QAAQ,EAAE,CAAC,CAAC,wBAAwB;IACpC,UAAU,EAAE,CAAC,CAAC,0BAA0B;CACzC,CAAC,CAAC;AACH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,QAAQ,EAAE,CAAC,CAAC,yBAAyB;IACrC,UAAU,EAAE,CAAC,CAAC,2BAA2B;CAC1C,CAAC,CAAC;AACH,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC;IAC7B,QAAQ,EAAE,CAAC,CAAC,wBAAwB;IACpC,UAAU,EAAE,CAAC,CAAC,0BAA0B;CACzC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC,CAAC,kBAAkB;IAC7B,OAAO,EAAE,UAAG,CAAC,CAAC,mBAAmB,cAAI,CAAC,CAAC,mBAAmB,cAAI,CAAC,CAAC,mBAAmB,cAAI,CAAC,CAAC,mBAAmB,CAAE;IAC9G,KAAK,EAAE,CAAC,CAAC,oBAAoB;IAC7B,UAAU,EAAE,CAAC,CAAC,aAAa;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,QAAQ,EAAE,CAAC,CAAC,yBAAyB;IACrC,UAAU,EAAE,CAAC,CAAC,2BAA2B;IACzC,OAAO,EAAE,CAAC,CAAC,wBAAwB;CACpC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC;IACnC,QAAQ,EAAE,CAAC,CAAC,8BAA8B;IAC1C,UAAU,EAAE,CAAC,CAAC,gCAAgC;IAC9C,OAAO,EAAE,CAAC,CAAC,6BAA6B;CACzC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,gBAAgB,GAAG,KAAK,CAAC;IACpC,QAAQ,EAAE,CAAC,CAAC,+BAA+B;IAC3C,UAAU,EAAE,CAAC,CAAC,iCAAiC;IAC/C,OAAO,EAAE,CAAC,CAAC,8BAA8B;CAC1C,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC;IACnC,QAAQ,EAAE,CAAC,CAAC,8BAA8B;IAC1C,UAAU,EAAE,CAAC,CAAC,gCAAgC;IAC9C,OAAO,EAAE,CAAC,CAAC,6BAA6B;CACzC,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,UAAU,YAAA;IACV,eAAe,iBAAA;IACf,gBAAgB,kBAAA;IAChB,eAAe,iBAAA;IACf,SAAS,WAAA;IACT,UAAU,YAAA;IACV,SAAS,WAAA;CACV,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\n\n// порядок вызова в cx(...): размер, затем root, затем мобильные размеры — поэтому размеры объявлены первыми\nexport const rootSmall = style({\n  fontSize: t.menuMessageFontSizeSmall,\n  lineHeight: t.menuMessageLineHeightSmall,\n});\nexport const rootMedium = style({\n  fontSize: t.menuMessageFontSizeMedium,\n  lineHeight: t.menuMessageLineHeightMedium,\n});\nexport const rootLarge = style({\n  fontSize: t.menuMessageFontSizeLarge,\n  lineHeight: t.menuMessageLineHeightLarge,\n});\n\nexport const root = style({\n  margin: 0,\n  display: t.menuMessageDisplay,\n  padding: `${t.menuMessagePaddingY} ${t.menuMessagePaddingX} ${t.menuMessagePaddingY} ${t.menuMessagePaddingX}`,\n  color: t.menuMessageTextColor,\n  background: t.menuMessageBg,\n});\n\nexport const rootMobile = style({\n  fontSize: t.menuMessageFontSizeMobile,\n  lineHeight: t.menuMessageLineHeightMobile,\n  padding: t.menuMessagePaddingMobile,\n});\n\nexport const rootMobileLarge = style({\n  fontSize: t.mobileMenuMessageFontSizeLarge,\n  lineHeight: t.mobileMenuMessageLineHeightLarge,\n  padding: t.mobileMenuMessagePaddingLarge,\n});\n\nexport const rootMobileMedium = style({\n  fontSize: t.mobileMenuMessageFontSizeMedium,\n  lineHeight: t.mobileMenuMessageLineHeightMedium,\n  padding: t.mobileMenuMessagePaddingMedium,\n});\n\nexport const rootMobileSmall = style({\n  fontSize: t.mobileMenuMessageFontSizeSmall,\n  lineHeight: t.mobileMenuMessageLineHeightSmall,\n  padding: t.mobileMenuMessagePaddingSmall,\n});\n\nexport const styles = {\n  root,\n  rootMobile,\n  rootMobileLarge,\n  rootMobileMedium,\n  rootMobileSmall,\n  rootSmall,\n  rootMedium,\n  rootLarge,\n};\n"]}

package/internal/MenuMessage/MenuMessage.js

@@ -22,11 +22,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React, { useContext } from 'react';
 import { useResponsiveLayout } from '../../components/ResponsiveLayout/index.js';
+import { cx } from '../../lib/cx.js';
 import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
-import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
-import { getStyles } from './MenuMessage.styles.js';
+import { styles } from './MenuMessage.css.js';
 export var MenuMessageDataTids = {
     root: 'MenuMessage__root',
 };
@@ -34,37 +34,35 @@ export var MenuMessage = forwardRefAndName('MenuMessage', function (_a, ref) {
     var _b;
     var children = _a.children, className = _a.className, _c = _a.size, size = _c === void 0 ? 'small' : _c, _d = _a.as, Tag = _d === void 0 ? 'p' : _d, rest = __rest(_a, ["children", "className", "size", "as"]);
     var isMobile = useResponsiveLayout().isMobile;
-    var cx = useEmotion().cx;
-    var styles = useStyles(getStyles);
     var theme = useContext(ThemeContext);
     var themeGTE6_1 = isThemeGTE(theme, '6.1');
     var getMenuMessageSizeClassName = function () {
         switch (size) {
             case 'large':
-                return cx(styles.rootLarge(theme));
+                return cx(styles.rootLarge);
             case 'medium':
-                return cx(styles.rootMedium(theme));
+                return cx(styles.rootMedium);
             case 'small':
             default:
-                return cx(styles.rootSmall(theme));
+                return cx(styles.rootSmall);
         }
     };
     var getMenuMessageSizeMobileClassName = function () {
         if (!themeGTE6_1) {
-            return cx(styles.rootMobile(theme));
+            return cx(styles.rootMobile);
         }
         switch (size) {
             case 'large':
-                return cx(styles.rootMobileLarge(theme));
+                return cx(styles.rootMobileLarge);
             case 'medium':
-                return cx(styles.rootMobileMedium(theme));
+                return cx(styles.rootMobileMedium);
             case 'small':
             default:
-                return cx(styles.rootMobileSmall(theme));
+                return cx(styles.rootMobileSmall);
         }
     };
     return (React.createElement(Tag, __assign({ ref: ref, "data-tid": MenuMessageDataTids.root, className: cx(getMenuMessageSizeClassName(), (_b = {},
-            _b[styles.root(theme)] = true,
+            _b[styles.root] = true,
             _b[getMenuMessageSizeMobileClassName()] = isMobile,
             _b), className) }, rest), children));
 });

package/internal/MenuMessage/MenuMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuMessage.js","sourceRoot":"","sources":["MenuMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAG/D,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAQpD,MAAM,CAAC,IAAM,mBAAmB,GAAG;IACjC,IAAI,EAAE,mBAAmB;CACjB,CAAC;AAEX,MAAM,CAAC,IAAM,WAAW,GAAG,iBAAiB,CAC1C,aAAa,EACb,UAAC,EAA+D,EAAE,GAAG;;IAAlE,IAAA,QAAQ,cAAA,EAAE,SAAS,eAAA,EAAE,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EAAE,UAAa,EAAT,GAAG,mBAAG,GAAG,KAAA,EAAK,IAAI,cAA7D,uCAA+D,CAAF;IACpD,IAAA,QAAQ,GAAK,mBAAmB,EAAE,SAA1B,CAA2B;IAEnC,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IACpC,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACvC,IAAM,WAAW,GAAG,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAC7C,IAAM,2BAA2B,GAAG;QAClC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;YACrC,KAAK,QAAQ;gBACX,OAAO,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC;YACtC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEF,IAAM,iCAAiC,GAAG;QACxC,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,OAAO,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC;QACtC,CAAC;QACD,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,EAAE,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC;YAC3C,KAAK,QAAQ;gBACX,OAAO,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;YAC5C,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,EAAE,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,GAAG,aACF,GAAG,EAAE,GAAG,cACE,mBAAmB,CAAC,IAAI,EAClC,SAAS,EAAE,EAAE,CACX,2BAA2B,EAAE;YAE3B,GAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAG,IAAI;YAC1B,GAAC,iCAAiC,EAAE,IAAG,QAAQ;iBAEjD,SAAS,CACV,IACG,IAAI,GAEP,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { useResponsiveLayout } from '../../components/ResponsiveLayout/index.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { getStyles } from './MenuMessage.styles.js';\n\nexport interface MenuMessageProps extends CommonProps {\n  children: React.ReactNode;\n  as?: React.ElementType;\n  size?: SizeProp;\n}\n\nexport const MenuMessageDataTids = {\n  root: 'MenuMessage__root',\n} as const;\n\nexport const MenuMessage = forwardRefAndName<HTMLOrSVGElement, MenuMessageProps>(\n  'MenuMessage',\n  ({ children, className, size = 'small', as: Tag = 'p', ...rest }, ref) => {\n    const { isMobile } = useResponsiveLayout();\n\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n    const theme = useContext(ThemeContext);\n    const themeGTE6_1 = isThemeGTE(theme, '6.1');\n    const getMenuMessageSizeClassName = () => {\n      switch (size) {\n        case 'large':\n          return cx(styles.rootLarge(theme));\n        case 'medium':\n          return cx(styles.rootMedium(theme));\n        case 'small':\n        default:\n          return cx(styles.rootSmall(theme));\n      }\n    };\n\n    const getMenuMessageSizeMobileClassName = (): string => {\n      if (!themeGTE6_1) {\n        return cx(styles.rootMobile(theme));\n      }\n      switch (size) {\n        case 'large':\n          return cx(styles.rootMobileLarge(theme));\n        case 'medium':\n          return cx(styles.rootMobileMedium(theme));\n        case 'small':\n        default:\n          return cx(styles.rootMobileSmall(theme));\n      }\n    };\n\n    return (\n      <Tag\n        ref={ref}\n        data-tid={MenuMessageDataTids.root}\n        className={cx(\n          getMenuMessageSizeClassName(),\n          {\n            [styles.root(theme)]: true,\n            [getMenuMessageSizeMobileClassName()]: isMobile,\n          },\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Tag>\n    );\n  },\n);\n"]}
+{"version":3,"file":"MenuMessage.js","sourceRoot":"","sources":["MenuMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC;AACjF,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAG/D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAQ9C,MAAM,CAAC,IAAM,mBAAmB,GAAG;IACjC,IAAI,EAAE,mBAAmB;CACjB,CAAC;AAEX,MAAM,CAAC,IAAM,WAAW,GAAG,iBAAiB,CAC1C,aAAa,EACb,UAAC,EAA+D,EAAE,GAAG;;IAAlE,IAAA,QAAQ,cAAA,EAAE,SAAS,eAAA,EAAE,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EAAE,UAAa,EAAT,GAAG,mBAAG,GAAG,KAAA,EAAK,IAAI,cAA7D,uCAA+D,CAAF;IACpD,IAAA,QAAQ,GAAK,mBAAmB,EAAE,SAA1B,CAA2B;IAE3C,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACvC,IAAM,WAAW,GAAG,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAC7C,IAAM,2BAA2B,GAAG;QAClC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;YAC9B,KAAK,QAAQ;gBACX,OAAO,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YAC/B,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAChC,CAAC;IACH,CAAC,CAAC;IAEF,IAAM,iCAAiC,GAAG;QACxC,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,OAAO,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;QAC/B,CAAC;QACD,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,EAAE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;YACpC,KAAK,QAAQ;gBACX,OAAO,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;YACrC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,EAAE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;QACtC,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,GAAG,aACF,GAAG,EAAE,GAAG,cACE,mBAAmB,CAAC,IAAI,EAClC,SAAS,EAAE,EAAE,CACX,2BAA2B,EAAE;YAE3B,GAAC,MAAM,CAAC,IAAI,IAAG,IAAI;YACnB,GAAC,iCAAiC,EAAE,IAAG,QAAQ;iBAEjD,SAAS,CACV,IACG,IAAI,GAEP,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { useResponsiveLayout } from '../../components/ResponsiveLayout/index.js';\nimport { cx } from '../../lib/cx.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { styles } from './MenuMessage.css.js';\n\nexport interface MenuMessageProps extends CommonProps {\n  children: React.ReactNode;\n  as?: React.ElementType;\n  size?: SizeProp;\n}\n\nexport const MenuMessageDataTids = {\n  root: 'MenuMessage__root',\n} as const;\n\nexport const MenuMessage = forwardRefAndName<HTMLOrSVGElement, MenuMessageProps>(\n  'MenuMessage',\n  ({ children, className, size = 'small', as: Tag = 'p', ...rest }, ref) => {\n    const { isMobile } = useResponsiveLayout();\n\n    const theme = useContext(ThemeContext);\n    const themeGTE6_1 = isThemeGTE(theme, '6.1');\n    const getMenuMessageSizeClassName = () => {\n      switch (size) {\n        case 'large':\n          return cx(styles.rootLarge);\n        case 'medium':\n          return cx(styles.rootMedium);\n        case 'small':\n        default:\n          return cx(styles.rootSmall);\n      }\n    };\n\n    const getMenuMessageSizeMobileClassName = (): string => {\n      if (!themeGTE6_1) {\n        return cx(styles.rootMobile);\n      }\n      switch (size) {\n        case 'large':\n          return cx(styles.rootMobileLarge);\n        case 'medium':\n          return cx(styles.rootMobileMedium);\n        case 'small':\n        default:\n          return cx(styles.rootMobileSmall);\n      }\n    };\n\n    return (\n      <Tag\n        ref={ref}\n        data-tid={MenuMessageDataTids.root}\n        className={cx(\n          getMenuMessageSizeClassName(),\n          {\n            [styles.root]: true,\n            [getMenuMessageSizeMobileClassName()]: isMobile,\n          },\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Tag>\n    );\n  },\n);\n"]}

package/internal/MobilePopup/MobilePopup.css.d.ts

@@ -0,0 +1,30 @@
+export declare const root: string;
+export declare const wrapper: string;
+export declare const content: string;
+export declare const container: string;
+export declare const root6_1: string;
+export declare const wrapper6_1: string;
+export declare const contentSmall6_1: string;
+export declare const contentMedium6_1: string;
+export declare const contentLarge6_1: string;
+export declare const containerBase6_1: string;
+export declare const containerBottom6_1: string;
+export declare const bg: string;
+export declare const bottomIndent: string;
+export declare const zIndex: string;
+export declare const jsStyles: {
+    root: string;
+    wrapper: string;
+    content: string;
+    container: string;
+    root6_1: string;
+    wrapper6_1: string;
+    contentSmall6_1: string;
+    contentMedium6_1: string;
+    contentLarge6_1: string;
+    containerBase6_1: string;
+    containerBottom6_1: string;
+    bg: string;
+    bottomIndent: string;
+    zIndex: string;
+};

package/internal/MobilePopup/MobilePopup.css.js

@@ -0,0 +1,16 @@
+
+export var bg = 'react-ui-MobilePopup__bg';
+export var bottomIndent = 'react-ui-MobilePopup__bottomIndent';
+export var container = 'react-ui-MobilePopup__container';
+export var containerBase6_1 = 'react-ui-MobilePopup__containerBase6_1';
+export var containerBottom6_1 = 'react-ui-MobilePopup__containerBottom6_1';
+export var content = 'react-ui-MobilePopup__content';
+export var contentLarge6_1 = 'react-ui-MobilePopup__contentLarge6_1';
+export var contentMedium6_1 = 'react-ui-MobilePopup__contentMedium6_1';
+export var contentSmall6_1 = 'react-ui-MobilePopup__contentSmall6_1';
+export var jsStyles = {root:'react-ui-MobilePopup__root',wrapper:'react-ui-MobilePopup__wrapper',content:'react-ui-MobilePopup__content',container:'react-ui-MobilePopup__container',root6_1:'react-ui-MobilePopup__root6_1',wrapper6_1:'react-ui-MobilePopup__wrapper6_1',contentSmall6_1:'react-ui-MobilePopup__contentSmall6_1',contentMedium6_1:'react-ui-MobilePopup__contentMedium6_1',contentLarge6_1:'react-ui-MobilePopup__contentLarge6_1',containerBase6_1:'react-ui-MobilePopup__containerBase6_1',containerBottom6_1:'react-ui-MobilePopup__containerBottom6_1',bg:'react-ui-MobilePopup__bg',bottomIndent:'react-ui-MobilePopup__bottomIndent',zIndex:'react-ui-MobilePopup__zIndex'};
+export var root = 'react-ui-MobilePopup__root';
+export var root6_1 = 'react-ui-MobilePopup__root6_1';
+export var wrapper = 'react-ui-MobilePopup__wrapper';
+export var wrapper6_1 = 'react-ui-MobilePopup__wrapper6_1';
+export var zIndex = 'react-ui-MobilePopup__zIndex';

package/internal/MobilePopup/MobilePopup.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobilePopup.css.js","sourceRoot":"","sources":["MobilePopup.css.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AAEjD,IAAM,UAAU,GAAG,EAAE,eAAe,EAAE,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAW,CAAC;AAElF,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;IACd,aAAa,EAAE,QAAQ;IACvB,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,UAAU;IAC1B,YAAY,EAAE,CAAC,CAAC,gCAAgC;IAChD,QAAQ,EAAE,QAAQ;IAClB,aAAa,EAAE,CAAC,CAAC,iCAAiC;IAClD,UAAU,EAAE,CAAC,CAAC,aAAa;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC;AAE5G,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC;AAE/D,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC;IAC7B,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC,CAAC,qBAAqB;IAC5B,IAAI,EAAE,CAAC,CAAC,uBAAuB;IAC/B,KAAK,EAAE,CAAC,CAAC,uBAAuB;IAChC,MAAM,EAAE,MAAM;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;IACd,aAAa,EAAE,QAAQ;IACvB,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,UAAU;IAC1B,YAAY,EAAE,CAAC,CAAC,gCAAgC;IAChD,QAAQ,EAAE,QAAQ;IAClB,UAAU,EAAE,CAAC,CAAC,aAAa;IAC3B,SAAS,EAAE,CAAC,4BAAqB,CAAC,CAAC,oBAAoB,OAAI,EAAE,6BAAsB,CAAC,CAAC,oBAAoB,OAAI,CAAC;CAC/G,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAAC;IAC9B,QAAQ,EAAE,OAAO;IACjB,GAAG,EAAE,CAAC,CAAC,oBAAoB;IAC3B,MAAM,EAAE,CAAC,CAAC,oBAAoB;IAC9B,KAAK,EAAE,CAAC,CAAC,oBAAoB;IAC7B,IAAI,EAAE,CAAC,CAAC,oBAAoB;IAC5B,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,uBAAM,UAAU,KAAE,OAAO,EAAE,CAAC,CAAC,uBAAuB,IAAG,CAAC;AAE5F,MAAM,CAAC,IAAM,gBAAgB,GAAG,KAAK,uBAAM,UAAU,KAAE,OAAO,EAAE,CAAC,CAAC,wBAAwB,IAAG,CAAC;AAE9F,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,uBAAM,UAAU,KAAE,OAAO,EAAE,CAAC,CAAC,uBAAuB,IAAG,CAAC;AAE5F,MAAM,CAAC,IAAM,gBAAgB,GAAG,KAAK,CAAC;IACpC,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,4BAAqB,CAAC,CAAC,oBAAoB,OAAI;CAC1D,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,kBAAkB,GAAG,KAAK,CAAC;IACtC,MAAM,EAAE,CAAC;IACT,SAAS,EAAE,4BAAqB,CAAC,CAAC,oBAAoB,OAAI;CAC3D,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,EAAE,GAAG,KAAK,CAAC;IACtB,QAAQ,EAAE,OAAO;IACjB,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;IACR,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,IAAI;IACZ,WAAW,EAAE,MAAM;IACnB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,KAAK;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,KAAK,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;AAElD,MAAM,CAAC,IAAM,MAAM,GAAG,KAAK,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAC;AAEtD,qFAAqF;AACrF,CAAC,eAAe,EAAE,gBAAgB,EAAE,eAAe,CAAC,CAAC,OAAO,CAAC,UAAC,GAAG;IAC/D,OAAA,WAAW,CAAC,UAAG,GAAG,wBAAqB,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAAtD,CAAsD,CACvD,CAAC;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG;IACtB,IAAI,MAAA;IACJ,OAAO,SAAA;IACP,OAAO,SAAA;IACP,SAAS,WAAA;IACT,OAAO,SAAA;IACP,UAAU,YAAA;IACV,eAAe,iBAAA;IACf,gBAAgB,kBAAA;IAChB,eAAe,iBAAA;IACf,gBAAgB,kBAAA;IAChB,kBAAkB,oBAAA;IAClB,EAAE,IAAA;IACF,YAAY,cAAA;IACZ,MAAM,QAAA;CACP,CAAC","sourcesContent":["import { globalStyle, style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\n\nconst content6_1 = { backgroundColor: t.bgDefault, overflowY: 'scroll' } as const;\n\nexport const root = style({\n  width: '100%',\n  height: '100%',\n  flexDirection: 'column',\n  display: 'flex',\n  justifyContent: 'flex-end',\n  borderRadius: t.mobilePopupContainerBorderRadius,\n  overflow: 'hidden',\n  paddingBottom: t.mobilePopupContainerBottomPadding,\n  background: t.menuBgDefault,\n});\n\nexport const wrapper = style({ position: 'fixed', top: 0, bottom: 0, right: 0, left: 0, overflow: 'auto' });\n\nexport const content = style({ backgroundColor: t.bgDefault });\n\nexport const container = style({\n  position: 'absolute',\n  top: t.mobilePopupTopPadding,\n  left: t.mobilePopupOuterIndentY,\n  right: t.mobilePopupOuterIndentY,\n  zIndex: 100000,\n});\n\nexport const root6_1 = style({\n  width: '100%',\n  height: '100%',\n  flexDirection: 'column',\n  display: 'flex',\n  justifyContent: 'flex-end',\n  borderRadius: t.mobilePopupContainerBorderRadius,\n  overflow: 'hidden',\n  background: t.menuBgDefault,\n  maxHeight: [`calc(100vh - (2 * ${t.mobilePopupPositionY}))`, `calc(100dvh - (2 * ${t.mobilePopupPositionY}))`],\n});\n\nexport const wrapper6_1 = style({\n  position: 'fixed',\n  top: t.mobilePopupPositionY,\n  bottom: t.mobilePopupPositionY,\n  right: t.mobilePopupPositionX,\n  left: t.mobilePopupPositionX,\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const contentSmall6_1 = style({ ...content6_1, padding: t.mobilePopupPaddingSmall });\n\nexport const contentMedium6_1 = style({ ...content6_1, padding: t.mobilePopupPaddingMedium });\n\nexport const contentLarge6_1 = style({ ...content6_1, padding: t.mobilePopupPaddingLarge });\n\nexport const containerBase6_1 = style({\n  position: 'absolute',\n  zIndex: 100000,\n  minWidth: `calc(100vw - (2 * ${t.mobilePopupPositionX}))`,\n});\n\nexport const containerBottom6_1 = style({\n  bottom: 0,\n  maxHeight: `calc(100vh - (2 * ${t.mobilePopupPositionY}))`,\n});\n\nexport const bg = style({\n  position: 'fixed',\n  top: 0,\n  bottom: 0,\n  right: 0,\n  left: 0,\n  zIndex: 9999,\n  touchAction: 'none',\n  background: '#333333',\n  opacity: '50%',\n});\n\nexport const bottomIndent = style({ height: 80 });\n\nexport const zIndex = style({ position: 'relative' });\n\n// вложенные правила — после баз всех классов файла, как было в склеенном CSS Emotion\n[contentSmall6_1, contentMedium6_1, contentLarge6_1].forEach((cls) =>\n  globalStyle(`${cls}::-webkit-scrollbar`, { width: 0 }),\n);\n\nexport const jsStyles = {\n  root,\n  wrapper,\n  content,\n  container,\n  root6_1,\n  wrapper6_1,\n  contentSmall6_1,\n  contentMedium6_1,\n  contentLarge6_1,\n  containerBase6_1,\n  containerBottom6_1,\n  bg,\n  bottomIndent,\n  zIndex,\n};\n"]}

package/internal/MobilePopup/MobilePopup.d.ts

@@ -48,9 +48,6 @@ export declare class MobilePopup extends React.Component<MobilePopupProps> {
     static displayName: string;
     private refForTransition;
     static readonly defaultRootNode: null;
-    private emotion;
-    private cx;
-    private jsStyles;
     private theme;
     getRootNode: TGetRootNode;
     private setRootNode;

package/internal/MobilePopup/MobilePopup.js

@@ -21,7 +21,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import React from 'react';
 import { Transition } from 'react-transition-group';
-import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { cx } from '../../lib/cx.js';
 import { rootNode } from '../../lib/rootNode/index.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
@@ -29,7 +29,7 @@ import { HideBodyVerticalScroll } from '../HideBodyVerticalScroll/index.js';
 import { RenderContainer } from '../RenderContainer/index.js';
 import { RenderLayer } from '../RenderLayer/index.js';
 import { ZIndex } from '../ZIndex/index.js';
-import { getJsStyles } from './MobilePopup.styles.js';
+import { jsStyles } from './MobilePopup.css.js';
 import { MobilePopupFooter } from './MobilePopupFooter/index.js';
 import { MobilePopupHeader } from './MobilePopupHeader/index.js';
 export var MobilePopupDataTids = {
@@ -62,20 +62,19 @@ var MobilePopup = /** @class */ (function (_super) {
         _this.getContentClassName6_1 = function () {
             switch (_this.props.size) {
                 case 'small':
-                    return _this.jsStyles.contentSmall6_1(_this.theme);
+                    return jsStyles.contentSmall6_1;
                 case 'medium':
-                    return _this.jsStyles.contentMedium6_1(_this.theme);
+                    return jsStyles.contentMedium6_1;
                 case 'large':
-                    return _this.jsStyles.contentLarge6_1(_this.theme);
+                    return jsStyles.contentLarge6_1;
                 default:
-                    return _this.jsStyles.contentSmall6_1(_this.theme);
+                    return jsStyles.contentSmall6_1;
             }
         };
         return _this;
     }
     MobilePopup.prototype.render = function () {
         var _this = this;
-        this.jsStyles = getJsStyles(this.emotion);
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return _this.renderMain();
@@ -85,24 +84,24 @@ var MobilePopup = /** @class */ (function (_super) {
         var _a;
         var themeGTE6_1 = isThemeGTE(this.theme, '6.1');
         var align = (_a = this.props.verticalAlign) !== null && _a !== void 0 ? _a : 'bottom';
-        var content = (React.createElement(ZIndex, { id: this.props.id, className: this.jsStyles.zIndex(), priority: 'MobilePopup' },
-            React.createElement(Transition, { in: this.props.opened, onExited: this.props.onClose, mountOnEnter: true, unmountOnExit: true, timeout: 0, nodeRef: this.refForTransition }, themeGTE6_1 ? (React.createElement("div", { className: this.jsStyles.wrapper6_1(this.theme), ref: this.refForTransition },
+        var content = (React.createElement(ZIndex, { id: this.props.id, className: jsStyles.zIndex, priority: 'MobilePopup' },
+            React.createElement(Transition, { in: this.props.opened, onExited: this.props.onClose, mountOnEnter: true, unmountOnExit: true, timeout: 0, nodeRef: this.refForTransition }, themeGTE6_1 ? (React.createElement("div", { className: jsStyles.wrapper6_1, ref: this.refForTransition },
                 React.createElement(RenderLayer, { onClickOutside: this.close },
-                    React.createElement("div", { ref: this.setRootNode, "data-tid": MobilePopupDataTids.container, className: this.cx(this.jsStyles.containerBase6_1(this.theme), align === 'bottom' && this.jsStyles.containerBottom6_1(this.theme)) },
-                        React.createElement("div", { "data-tid": MobilePopupDataTids.root, className: this.jsStyles.root6_1(this.theme) },
+                    React.createElement("div", { ref: this.setRootNode, "data-tid": MobilePopupDataTids.container, className: cx(jsStyles.containerBase6_1, align === 'bottom' && jsStyles.containerBottom6_1) },
+                        React.createElement("div", { "data-tid": MobilePopupDataTids.root, className: jsStyles.root6_1 },
                             React.createElement(MobilePopupHeader, { size: this.props.size, caption: this.props.caption }, this.props.headerChildComponent),
                             React.createElement("div", { className: this.getContentClassName6_1() }, this.props.children),
                             React.createElement(MobilePopupFooter, { size: this.props.size }, this.props.footerChildComponent)))),
-                React.createElement("div", { "data-tid": MobilePopupDataTids.backdrop, className: this.jsStyles.bg(), onClick: this.backdropClick, onMouseDown: this.backdropStopPropagation, onPointerDownCapture: this.backdropStopPropagation, onPointerUpCapture: this.backdropStopPropagation }),
-                React.createElement(HideBodyVerticalScroll, null))) : (React.createElement("div", { className: this.jsStyles.wrapper(), ref: this.refForTransition },
+                React.createElement("div", { "data-tid": MobilePopupDataTids.backdrop, className: jsStyles.bg, onClick: this.backdropClick, onMouseDown: this.backdropStopPropagation, onPointerDownCapture: this.backdropStopPropagation, onPointerUpCapture: this.backdropStopPropagation }),
+                React.createElement(HideBodyVerticalScroll, null))) : (React.createElement("div", { className: jsStyles.wrapper, ref: this.refForTransition },
                 React.createElement(RenderLayer, { onClickOutside: this.close },
-                    React.createElement("div", { ref: this.setRootNode, "data-tid": MobilePopupDataTids.container, className: this.jsStyles.container(this.theme) },
-                        React.createElement("div", { "data-tid": MobilePopupDataTids.root, className: this.jsStyles.root(this.theme) },
+                    React.createElement("div", { ref: this.setRootNode, "data-tid": MobilePopupDataTids.container, className: jsStyles.container },
+                        React.createElement("div", { "data-tid": MobilePopupDataTids.root, className: jsStyles.root },
                             React.createElement(MobilePopupHeader, { caption: this.props.caption }, this.props.headerChildComponent),
-                            React.createElement("div", { className: this.jsStyles.content(this.theme) }, this.props.children),
+                            React.createElement("div", { className: jsStyles.content }, this.props.children),
                             React.createElement(MobilePopupFooter, null, this.props.footerChildComponent)),
-                        React.createElement("div", { onClick: this.close, className: this.jsStyles.bottomIndent() }))),
-                React.createElement("div", { "data-tid": MobilePopupDataTids.backdrop, className: this.jsStyles.bg(), onClick: this.backdropClick, onMouseDown: this.backdropStopPropagation, onPointerDownCapture: this.backdropStopPropagation, onPointerUpCapture: this.backdropStopPropagation }),
+                        React.createElement("div", { onClick: this.close, className: jsStyles.bottomIndent }))),
+                React.createElement("div", { "data-tid": MobilePopupDataTids.backdrop, className: jsStyles.bg, onClick: this.backdropClick, onMouseDown: this.backdropStopPropagation, onPointerDownCapture: this.backdropStopPropagation, onPointerUpCapture: this.backdropStopPropagation }),
                 React.createElement(HideBodyVerticalScroll, null))))));
         if (this.props.withoutRenderContainer) {
             return content;
@@ -114,7 +113,6 @@ var MobilePopup = /** @class */ (function (_super) {
     // see #2873 and #2895
     MobilePopup.defaultRootNode = null;
     MobilePopup = __decorate([
-        withRenderEnvironment,
         rootNode
     ], MobilePopup);
     return MobilePopup;