npm - @skbkontur/react-ui - Versions diffs - 0.0.0-444dd4e7b3 → 0.0.0-48840c3b9c - Mend

@skbkontur/react-ui 0.0.0-444dd4e7b3 → 0.0.0-48840c3b9c

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1909) hide show

package/cjs/components/SidePage/SidePage.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePage.styles.ts"],"names":["styles","root","css","mobileRoot","overlay","body","t","modalBodyTextColor","mobileBody","container","sidePagePaddingLeft","sidePagePaddingRight","mobileContainer","mobileSidePagePaddingLeft","mobileSidePagePaddingRight","mobileSidePagePaddingBottom","containerWithoutHeader","sidePagePaddingTop","mobileContainerWithoutHeader","mobileSidePagePaddingTop","containerWithoutFooter","sidePagePaddingBottom","containerWithPanel","focusLock","wrapper","sidePageBgDefault","wrapperLeft","wrapperMarginLeft","wrapperMarginRight","headerWrapper","header","sidePageHeaderFontSize","sidePageHeaderLineHeight","sidePageHeaderPaddingTop","sidePageHeaderPaddingBottom","sidePageHeaderTextColor","sidePageHeaderFontWeight","mobileHeader","mobileSidePageHeaderFontSize","mobileSidePageHeaderLineHeight","mobileSidePageHeaderPaddingTop","mobileSidePageHeaderPaddingBottom","headerFixed","sidePageHeaderFixedFontSize","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","sidePageFixedHeaderShadow","title","paddingRight","parseInt","sidePageCloseButtonPadding","sidePageCloseButtonLegacyPaddingLeft","sidePageCloseIconSize","mobileTitle","mobileSidePageCloseButtonPadding","titleFixed","background","backgroundGray","sidePageBackingBg","sidePageBackingBgOpacity","shadow","sidePageContainerShadow","close","sidePageCloseButtonColor","sidePageCloseButtonClickArea","sidePageCloseButtonHoverColor","mobileClose","mobileSidePageCloseButtonClickArea","closeFocus","borderColorFocus","wrapperClose","mobileWrapperClose","panel","sidePageFooterPanelBg","sidePageFooterPanelPaddingTop","sidePageFooterPanelPaddingBottom","wrapperCloseFixed","footerWrapper","footer","sidePageFooterTextColor","positionStatic","footerContent","sidePageFooterPaddingTop","sidePageFooterPaddingBottom","mobileFooterContent","mobileSidePageFooterPadding","footerFixed","sidePageFixedFooterShadow","panelFixed","sidePageFixedPanelShadow","transitionLeft","transitionRight","transitionActive","transitionLeave","transitionLeaveActive"],"mappings":"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","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n root() {\n return css`\n height: 100%;\n position: fixed;\n top: 0;\n `;\n },\n\n mobileRoot() {\n return css`\n width: 100%;\n `;\n },\n\n overlay() {\n return css`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n `;\n },\n\n body(t: Theme) {\n return css`\n flex: 1 0 auto;\n z-index: 0;\n color: ${t.modalBodyTextColor};\n `;\n },\n\n mobileBody() {\n return css`\n font-size: 16px;\n line-height: 22px;\n `;\n },\n\n container(t: Theme) {\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${t.sidePagePaddingRight};\n `;\n },\n\n mobileContainer(t: Theme) {\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${t.mobileSidePagePaddingRight};\n padding-bottom: ${t.mobileSidePagePaddingBottom};\n `;\n },\n\n containerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.sidePagePaddingTop};\n `;\n },\n\n mobileContainerWithoutHeader(t: Theme) {\n return css`\n padding-top: ${t.mobileSidePagePaddingTop};\n `;\n },\n\n containerWithoutFooter(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n containerWithPanel(t: Theme) {\n return css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n focusLock() {\n return css`\n height: 100%;\n `;\n },\n\n wrapper(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n float: right;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n position: relative;\n white-space: normal;\n align-items: stretch;\n display: flex;\n flex-direction: column;\n `;\n },\n\n wrapperLeft() {\n return css`\n float: left;\n `;\n },\n\n wrapperMarginLeft() {\n return css`\n margin-left: 20px;\n `;\n },\n\n wrapperMarginRight() {\n return css`\n margin-right: 20px;\n `;\n },\n\n headerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n header(t: Theme) {\n return css`\n font-size: ${t.sidePageHeaderFontSize};\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n width: 100%;\n position: relative;\n color: ${t.sidePageHeaderTextColor};\n font-weight: ${t.sidePageHeaderFontWeight};\n `;\n },\n\n mobileHeader(t: Theme) {\n return css`\n font-size: ${t.mobileSidePageHeaderFontSize};\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n `;\n },\n\n headerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n font-size: ${t.sidePageHeaderFixedFontSize};\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n\n &:after {\n bottom: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedHeaderShadow};\n }\n `;\n },\n\n title(t: Theme) {\n const paddingRight =\n parseInt(t.sidePageCloseButtonPadding) +\n parseInt(t.sidePageCloseButtonLegacyPaddingLeft) +\n parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n mobileTitle(t: Theme) {\n const paddingRight = parseInt(t.mobileSidePageCloseButtonPadding) * 2 + parseInt(t.sidePageCloseIconSize);\n return css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n titleFixed() {\n return css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n },\n\n background() {\n return css`\n height: 100%;\n position: absolute;\n width: 100%;\n `;\n },\n\n backgroundGray(t: Theme) {\n return css`\n background: ${t.sidePageBackingBg};\n opacity: ${t.sidePageBackingBgOpacity};\n `;\n },\n\n shadow(t: Theme) {\n return css`\n box-shadow: ${t.sidePageContainerShadow};\n `;\n },\n\n close(t: Theme) {\n return css`\n ${resetButton()};\n cursor: pointer;\n color: ${t.sidePageCloseButtonColor};\n padding: ${t.sidePageCloseButtonClickArea};\n margin: -${t.sidePageCloseButtonClickArea};\n font-size: 0;\n\n &:focus,\n &:hover {\n color: ${t.sidePageCloseButtonHoverColor};\n }\n\n & > svg {\n width: ${t.sidePageCloseIconSize};\n height: ${t.sidePageCloseIconSize};\n box-sizing: content-box;\n }\n `;\n },\n\n mobileClose(t: Theme) {\n return css`\n padding: ${t.mobileSidePageCloseButtonClickArea};\n margin: -${t.mobileSidePageCloseButtonClickArea};\n font-size: 0;\n `;\n },\n\n closeFocus(t: Theme) {\n return css`\n outline: 2px solid ${t.borderColorFocus};\n `;\n },\n\n wrapperClose(t: Theme) {\n return css`\n box-sizing: border-box;\n height: 100%;\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n position: absolute;\n right: ${t.sidePageCloseButtonPadding};\n top: 0;\n `;\n },\n\n mobileWrapperClose(t: Theme) {\n return css`\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n right: ${t.mobileSidePageCloseButtonPadding};\n `;\n },\n\n panel(t: Theme) {\n return css`\n background: ${t.sidePageFooterPanelBg};\n padding: ${t.sidePageFooterPanelPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPanelPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n wrapperCloseFixed(t: Theme) {\n return css`\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n `;\n },\n\n footerWrapper() {\n return css`\n flex: 0 0 auto;\n `;\n },\n\n footer(t: Theme) {\n return css`\n bottom: 0;\n position: fixed;\n z-index: 10;\n color: ${t.sidePageFooterTextColor};\n `;\n },\n\n positionStatic() {\n return css`\n position: static;\n `;\n },\n\n footerContent(t: Theme) {\n return css`\n padding: ${t.sidePageFooterPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n mobileFooterContent(t: Theme) {\n return css`\n display: flex;\n flex-flow: column nowrap;\n padding: ${t.mobileSidePageFooterPadding};\n `;\n },\n\n footerFixed(t: Theme) {\n return css`\n background: ${t.sidePageBgDefault};\n\n &:before {\n top: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedFooterShadow};\n }\n `;\n },\n\n panelFixed(t: Theme) {\n return css`\n &:before {\n box-shadow: ${t.sidePageFixedPanelShadow};\n }\n `;\n },\n\n transitionLeft() {\n return css`\n transform: translateX(100px);\n `;\n },\n\n transitionRight() {\n return css`\n transform: translateX(-100px);\n `;\n },\n\n transitionActive() {\n return css`\n transition: transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);\n opacity: 1 !important;\n transform: translate(0, 0) !important;\n `;\n },\n\n transitionLeave() {\n return css`\n opacity: 1;\n `;\n },\n\n transitionLeaveActive() {\n return css`\n opacity: 0.01 !important;\n transition: opacity 0.15s ease-out;\n `;\n },\n});\n"]}
1	+ {"version":3,"sources":["SidePage.styles.ts"],"names":["getStyles","emotion","root","css","mobileRoot","overlay","body","t","modalBodyTextColor","mobileBody","container","sidePagePaddingLeft","sidePagePaddingRight","mobileContainer","mobileSidePagePaddingLeft","mobileSidePagePaddingRight","mobileSidePagePaddingBottom","containerWithoutHeader","sidePagePaddingTop","mobileContainerWithoutHeader","mobileSidePagePaddingTop","containerWithoutFooter","sidePagePaddingBottom","containerWithPanel","focusLock","wrapper","sidePageBgDefault","wrapperLeft","wrapperMarginLeft","wrapperMarginRight","headerWrapper","header","sidePageHeaderFontSize","sidePageHeaderLineHeight","sidePageHeaderPaddingTop","sidePageHeaderPaddingBottom","sidePageHeaderTextColor","sidePageHeaderFontWeight","mobileHeader","mobileSidePageHeaderFontSize","mobileSidePageHeaderLineHeight","mobileSidePageHeaderPaddingTop","mobileSidePageHeaderPaddingBottom","headerFixed","sidePageHeaderFixedFontSize","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","sidePageFixedHeaderShadow","title","paddingRight","parseInt","sidePageCloseButtonPadding","sidePageCloseButtonLegacyPaddingLeft","sidePageCloseIconSize","mobileTitle","mobileSidePageCloseButtonPadding","titleFixed","background","backgroundGray","sidePageBackingBg","sidePageBackingBgOpacity","shadow","sidePageContainerShadow","close","sidePageCloseButtonColor","sidePageCloseButtonClickArea","sidePageCloseButtonHoverColor","mobileClose","mobileSidePageCloseButtonClickArea","closeFocus","borderColorFocus","wrapperClose","mobileWrapperClose","panel","sidePageFooterPanelBg","sidePageFooterPanelPaddingTop","sidePageFooterPanelPaddingBottom","wrapperCloseFixed","footerWrapper","footer","sidePageFooterTextColor","positionStatic","footerContent","sidePageFooterPaddingTop","sidePageFooterPaddingBottom","mobileFooterContent","mobileSidePageFooterPadding","footerFixed","sidePageFixedFooterShadow","panelFixed","sidePageFixedPanelShadow","transitionLeft","transitionRight","transitionActive","transitionLeave","transitionLeaveActive"],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const getStyles = (emotion: Emotion) =>\n memoizeStyle({\n root() {\n return emotion.css`\n height: 100%;\n position: fixed;\n top: 0;\n `;\n },\n\n mobileRoot() {\n return emotion.css`\n width: 100%;\n `;\n },\n\n overlay() {\n return emotion.css`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n `;\n },\n\n body(t: Theme) {\n return emotion.css`\n flex: 1 0 auto;\n z-index: 0;\n color: ${t.modalBodyTextColor};\n `;\n },\n\n mobileBody() {\n return emotion.css`\n font-size: 16px;\n line-height: 22px;\n `;\n },\n\n container(t: Theme) {\n return emotion.css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${t.sidePagePaddingRight};\n `;\n },\n\n mobileContainer(t: Theme) {\n return emotion.css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${t.mobileSidePagePaddingRight};\n padding-bottom: ${t.mobileSidePagePaddingBottom};\n `;\n },\n\n containerWithoutHeader(t: Theme) {\n return emotion.css`\n padding-top: ${t.sidePagePaddingTop};\n `;\n },\n\n mobileContainerWithoutHeader(t: Theme) {\n return emotion.css`\n padding-top: ${t.mobileSidePagePaddingTop};\n `;\n },\n\n containerWithoutFooter(t: Theme) {\n return emotion.css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n containerWithPanel(t: Theme) {\n return emotion.css`\n padding-bottom: ${t.sidePagePaddingBottom};\n `;\n },\n\n focusLock() {\n return emotion.css`\n height: 100%;\n `;\n },\n\n wrapper(t: Theme) {\n return emotion.css`\n background: ${t.sidePageBgDefault};\n float: right;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n position: relative;\n white-space: normal;\n align-items: stretch;\n display: flex;\n flex-direction: column;\n `;\n },\n\n wrapperLeft() {\n return emotion.css`\n float: left;\n `;\n },\n\n wrapperMarginLeft() {\n return emotion.css`\n margin-left: 20px;\n `;\n },\n\n wrapperMarginRight() {\n return emotion.css`\n margin-right: 20px;\n `;\n },\n\n headerWrapper() {\n return emotion.css`\n flex: 0 0 auto;\n `;\n },\n\n header(t: Theme) {\n return emotion.css`\n font-size: ${t.sidePageHeaderFontSize};\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n width: 100%;\n position: relative;\n color: ${t.sidePageHeaderTextColor};\n font-weight: ${t.sidePageHeaderFontWeight};\n `;\n },\n\n mobileHeader(t: Theme) {\n return emotion.css`\n font-size: ${t.mobileSidePageHeaderFontSize};\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n `;\n },\n\n headerFixed(t: Theme) {\n return emotion.css`\n background: ${t.sidePageBgDefault};\n font-size: ${t.sidePageHeaderFixedFontSize};\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n\n &:after {\n bottom: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedHeaderShadow};\n }\n `;\n },\n\n title(t: Theme) {\n const paddingRight =\n parseInt(t.sidePageCloseButtonPadding) +\n parseInt(t.sidePageCloseButtonLegacyPaddingLeft) +\n parseInt(t.sidePageCloseIconSize);\n return emotion.css`\n padding-left: ${t.sidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n mobileTitle(t: Theme) {\n const paddingRight = parseInt(t.mobileSidePageCloseButtonPadding) * 2 + parseInt(t.sidePageCloseIconSize);\n return emotion.css`\n padding-left: ${t.mobileSidePagePaddingLeft};\n padding-right: ${paddingRight}px;\n `;\n },\n\n titleFixed() {\n return emotion.css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n },\n\n background() {\n return emotion.css`\n height: 100%;\n position: absolute;\n width: 100%;\n `;\n },\n\n backgroundGray(t: Theme) {\n return emotion.css`\n background: ${t.sidePageBackingBg};\n opacity: ${t.sidePageBackingBgOpacity};\n `;\n },\n\n shadow(t: Theme) {\n return emotion.css`\n box-shadow: ${t.sidePageContainerShadow};\n `;\n },\n\n close(t: Theme) {\n return emotion.css`\n ${resetButton(emotion)};\n cursor: pointer;\n color: ${t.sidePageCloseButtonColor};\n padding: ${t.sidePageCloseButtonClickArea};\n margin: -${t.sidePageCloseButtonClickArea};\n font-size: 0;\n\n &:focus,\n &:hover {\n color: ${t.sidePageCloseButtonHoverColor};\n }\n\n & > svg {\n width: ${t.sidePageCloseIconSize};\n height: ${t.sidePageCloseIconSize};\n box-sizing: content-box;\n }\n `;\n },\n\n mobileClose(t: Theme) {\n return emotion.css`\n padding: ${t.mobileSidePageCloseButtonClickArea};\n margin: -${t.mobileSidePageCloseButtonClickArea};\n font-size: 0;\n `;\n },\n\n closeFocus(t: Theme) {\n return emotion.css`\n outline: 2px solid ${t.borderColorFocus};\n `;\n },\n\n wrapperClose(t: Theme) {\n return emotion.css`\n box-sizing: border-box;\n height: 100%;\n line-height: ${t.sidePageHeaderLineHeight};\n padding: ${t.sidePageHeaderPaddingTop} 0 ${t.sidePageHeaderPaddingBottom};\n position: absolute;\n right: ${t.sidePageCloseButtonPadding};\n top: 0;\n `;\n },\n\n mobileWrapperClose(t: Theme) {\n return emotion.css`\n line-height: ${t.mobileSidePageHeaderLineHeight};\n padding: ${t.mobileSidePageHeaderPaddingTop} 0 ${t.mobileSidePageHeaderPaddingBottom};\n right: ${t.mobileSidePageCloseButtonPadding};\n `;\n },\n\n panel(t: Theme) {\n return emotion.css`\n background: ${t.sidePageFooterPanelBg};\n padding: ${t.sidePageFooterPanelPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPanelPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n wrapperCloseFixed(t: Theme) {\n return emotion.css`\n line-height: ${t.sidePageHeaderFixedLineHeight};\n padding: ${t.sidePageHeaderFixedPaddingY} 0;\n `;\n },\n\n footerWrapper() {\n return emotion.css`\n flex: 0 0 auto;\n `;\n },\n\n footer(t: Theme) {\n return emotion.css`\n bottom: 0;\n position: fixed;\n z-index: 10;\n color: ${t.sidePageFooterTextColor};\n `;\n },\n\n positionStatic() {\n return emotion.css`\n position: static;\n `;\n },\n\n footerContent(t: Theme) {\n return emotion.css`\n padding: ${t.sidePageFooterPaddingTop} ${t.sidePagePaddingRight} ${t.sidePageFooterPaddingBottom}\n ${t.sidePagePaddingLeft};\n `;\n },\n\n mobileFooterContent(t: Theme) {\n return emotion.css`\n display: flex;\n flex-flow: column nowrap;\n padding: ${t.mobileSidePageFooterPadding};\n `;\n },\n\n footerFixed(t: Theme) {\n return emotion.css`\n background: ${t.sidePageBgDefault};\n\n &:before {\n top: 0px;\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n left: 0;\n z-index: -1;\n box-shadow: ${t.sidePageFixedFooterShadow};\n }\n `;\n },\n\n panelFixed(t: Theme) {\n return emotion.css`\n &:before {\n box-shadow: ${t.sidePageFixedPanelShadow};\n }\n `;\n },\n\n transitionLeft() {\n return emotion.css`\n transform: translateX(100px);\n `;\n },\n\n transitionRight() {\n return emotion.css`\n transform: translateX(-100px);\n `;\n },\n\n transitionActive() {\n return emotion.css`\n transition: transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);\n opacity: 1 !important;\n transform: translate(0, 0) !important;\n `;\n },\n\n transitionLeave() {\n return emotion.css`\n opacity: 1;\n `;\n },\n\n transitionLeaveActive() {\n return emotion.css`\n opacity: 0.01 !important;\n transition: opacity 0.15s ease-out;\n `;\n },\n });\n"]}

package/cjs/components/SidePage/SidePageBody.d.ts CHANGED Viewed

@@ -14,8 +14,10 @@ export declare const SidePageBodyDataTids: {
  */
 export declare class SidePageBody extends React.Component<SidePageBodyProps> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static contextType: React.Context<SidePageContextType>;
     context: SidePageContextType;
+    private emotion;
     private isMobileLayout;
     private setRootNode;
     componentDidUpdate(): void;

package/cjs/components/SidePage/SidePageBody.js CHANGED Viewed

@@ -1,10 +1,11 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.SidePageBodyDataTids = exports.SidePageBody = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.SidePageBodyDataTids = exports.SidePageBody = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _CommonWrapper = require("../../internal/CommonWrapper");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _decorator = require("../ResponsiveLayout/decorator");
 var _Emotion = require("../../lib/theming/Emotion");
 var _rootNode = require("../../lib/rootNode");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _SidePage = require("./SidePage.styles");
 var _SidePageContext = require("./SidePageContext");var _class, _class2, _temp;
@@ -27,29 +28,39 @@ SidePageBody = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
     context = _this.context;return _this;}var _proto = SidePageBody.prototype;_proto.
   componentDidUpdate = function componentDidUpdate() {
     this.context.updateLayout();
   };_proto.
   render = function render() {var _this2 = this;
     return /*#__PURE__*/(
-      _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
-      function (theme) {var _cx;
+      _react.default.createElement(_Emotion.EmotionConsumer, null,
+      function (emotion) {
+        _this2.emotion = emotion;
         return /*#__PURE__*/(
-          _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), /*#__PURE__*/
-          _react.default.createElement("div", {
-            "data-tid": SidePageBodyDataTids.root,
-            className: (0, _Emotion.cx)(_SidePage.styles.body(theme), (_cx = {}, _cx[_SidePage.styles.mobileBody()] = _this2.isMobileLayout, _cx)) },
+          _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
+          function (theme) {var _this2$emotion$cx;
+            var styles = (0, _SidePage.getStyles)(_this2.emotion);
+            return /*#__PURE__*/(
+              _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), /*#__PURE__*/
+              _react.default.createElement("div", {
+                "data-tid": SidePageBodyDataTids.root,
+                className: _this2.emotion.cx(styles.body(theme), (_this2$emotion$cx = {}, _this2$emotion$cx[styles.mobileBody()] = _this2.isMobileLayout, _this2$emotion$cx)) },
+              _this2.props.children)));
-          _this2.props.children)));
+          }));
       }));
-  };return SidePageBody;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageBody', _class2.contextType = _SidePageContext.SidePageContext, _temp)) || _class) || _class;exports.SidePageBody = SidePageBody;
+  };return SidePageBody;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageBody', _class2.displayName = 'SidePageBody', _class2.contextType = _SidePageContext.SidePageContext, _temp)) || _class) || _class;exports.SidePageBody = SidePageBody;

package/cjs/components/SidePage/SidePageBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageBody.tsx"],"names":["SidePageBodyDataTids","root","SidePageBody","responsiveLayout","rootNode","context","componentDidUpdate","updateLayout","render","theme","setRootNode","props","~~styles~~","body","mobileBody","isMobileLayout","children","React","Component","__KONTUR_REACT_UI__","contextType","SidePageContext"],"mappings":"~~yWAAA;;AAEA~~;AACA;AACA;AACA;AACA;;AAEA;AACA,oD;;;;;;AAMO,IAAMA,oBAAoB,GAAG;AAClCC,EAAAA,IAAI,EAAE,oBAD4B,EAA7B;;AAGP;AACA;AACA;AACA;AACA,G;;;AAGaC,Y,OAFZC,2B,eACAC,kB~~;;;;AAKQC~~,IAAAA,O,GAA+B,MAAKA,O~~;;;;AAIpCC~~,EAAAA,kB,GAAP,8BAA4B;AAC1B,SAAKD,OAAL,CAAaE,YAAb;AACD,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,~~gBAACC~~,KAAD,EAAW;AACV;AACE,~~uCAAC~~,4BAAD,2BAAe,WAAW,EAAE,MAAI,~~CAACC~~,WAAjC,IAAkD,MAAI,CAACC,KAAvD;AACE;AACE,~~wBAAUX~~,oBAAoB,CAACC,IADjC;AAEE,~~YAAA~~,SAAS,EAAE,~~iBAAGW~~,~~iBAAOC~~,IAAP,~~CAAYJ~~,KAAZ,~~CAAH~~,~~iBAA0BG~~,~~iBAAOE~~,UAAP,~~EAA1B~~,~~IAAgD~~,MAAI,CAACC,~~cAArD~~,~~OAFb~~;;AAIG,~~UAAA~~,MAAI,CAACJ,KAAL,CAAWK,QAJd,CADF,CADF;;;;AAUD,~~OAZH~~,CADF;;;~~AAgBD~~,G,~~uBA7B~~+BC,eAAMC,S,WACxBC,mB,GAAsB,c,~~UAEtBC~~,W,GAAcC,gC","sourcesContent":["import React from 'react';\n\nimport { ~~CommonProps,~~ ~~CommonWrapper~~ } from '~~../../internal~~/~~CommonWrapper~~';\nimport { ~~ThemeContext~~ } from '../../~~lib~~/~~theming/ThemeContext~~';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { ~~styles~~ } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageBodyProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nexport const SidePageBodyDataTids = {\n root: 'SidePageBody__root',\n} as const;\n/*\n Тело для сайдпейджа\n \n @visibleName SidePage.Body\n */\n@responsiveLayout\n@rootNode\nexport class SidePageBody extends React.Component<SidePageBodyProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageBody';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate() {\n this.context.updateLayout();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageBodyDataTids.root}\n className={cx(styles.body(theme), { [styles.mobileBody()]: this.isMobileLayout })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n}\n"]}
1	+ {"version":3,"sources":["SidePageBody.tsx"],"names":["SidePageBodyDataTids","root","SidePageBody","responsiveLayout","rootNode","context","componentDidUpdate","updateLayout","render","emotion","theme","styles","setRootNode","props","cx","body","mobileBody","isMobileLayout","children","React","Component","__KONTUR_REACT_UI__","displayName","contextType","SidePageContext"],"mappings":"iXAAA;;;AAGA;AACA;AACA;AACA;AACA;;AAEA;AACA,oD;;;;;;AAMO,IAAMA,oBAAoB,GAAG;AAClCC,EAAAA,IAAI,EAAE,oBAD4B,EAA7B;;AAGP;AACA;AACA;AACA;AACA,G;;;AAGaC,Y,OAFZC,2B,eACAC,kB;;;;;AAMQC,IAAAA,O,GAA+B,MAAKA,O;;;;;AAKpCC,EAAAA,kB,GAAP,8BAA4B;AAC1B,SAAKD,OAAL,CAAaE,YAAb;AACD,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,wBAAD;AACG,gBAACC,OAAD,EAAa;AACZ,QAAA,MAAI,CAACA,OAAL,GAAeA,OAAf;AACA;AACE,uCAAC,0BAAD,CAAc,QAAd;AACG,oBAACC,KAAD,EAAW;AACV,gBAAMC,MAAM,GAAG,yBAAU,MAAI,CAACF,OAAf,CAAf;AACA;AACE,2CAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACG,WAAjC,IAAkD,MAAI,CAACC,KAAvD;AACE;AACE,4BAAUb,oBAAoB,CAACC,IADjC;AAEE,gBAAA,SAAS,EAAE,MAAI,CAACQ,OAAL,CAAaK,EAAb,CAAgBH,MAAM,CAACI,IAAP,CAAYL,KAAZ,CAAhB,6CAAuCC,MAAM,CAACK,UAAP,EAAvC,IAA6D,MAAI,CAACC,cAAlE,qBAFb;;AAIG,cAAA,MAAI,CAACJ,KAAL,CAAWK,QAJd,CADF,CADF;;;;AAUD,WAbH,CADF;;;AAiBD,OApBH,CADF;;;AAwBD,G,uBAvC+BC,eAAMC,S,WACxBC,mB,GAAsB,c,UACtBC,W,GAAc,c,UAEdC,W,GAAcC,gC","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageBodyProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nexport const SidePageBodyDataTids = {\n root: 'SidePageBody__root',\n} as const;\n/*\n Тело для сайдпейджа\n \n @visibleName SidePage.Body\n */\n@responsiveLayout\n@rootNode\nexport class SidePageBody extends React.Component<SidePageBodyProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageBody';\n public static displayName = 'SidePageBody';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private emotion!: Emotion;\n private isMobileLayout!: boolean;\n private setRootNode!: TSetRootNode;\n\n public componentDidUpdate() {\n this.context.updateLayout();\n }\n\n public render() {\n return (\n <EmotionConsumer>\n {(emotion) => {\n this.emotion = emotion;\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n const styles = getStyles(this.emotion);\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageBodyDataTids.root}\n className={this.emotion.cx(styles.body(theme), { [styles.mobileBody()]: this.isMobileLayout })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }}\n </EmotionConsumer>\n );\n }\n}\n"]}

package/cjs/components/SidePage/SidePageCloseButton.d.ts CHANGED Viewed

@@ -1 +1,5 @@
-export declare const SidePageCloseButton: () => JSX.Element;
+export declare const SidePageCloseButton: {
+    (): JSX.Element;
+    __KONTUR_REACT_UI__: string;
+    displayName: string;
+};

package/cjs/components/SidePage/SidePageCloseButton.js CHANGED Viewed

@@ -1,22 +1,23 @@
-"use strict";exports.__esModule = true;exports.SidePageCloseButton = void 0;var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.SidePageCloseButton = void 0;var _react = _interopRequireWildcard(require("react"));
 var _globalObject = require("@skbkontur/global-object");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _useLocaleForControl = require("../../lib/locale/useLocaleForControl");
 var _CrossIcon = require("../../internal/icons/CrossIcon");
 var _Emotion = require("../../lib/theming/Emotion");
 var _keyListener = require("../../lib/events/keyListener");
+var _useTheme = require("../../lib/theming/useTheme");
 var _SidePage = require("./SidePage.styles");
 var _locale = require("./locale");
 var _SidePageHeader = require("./SidePageHeader");
-var _SidePageContext = require("./SidePageContext");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _SidePageContext = require("./SidePageContext");
-var SidePageCloseButton = function SidePageCloseButton() {var _cx;
+var SidePageCloseButton = function SidePageCloseButton() {var _emotion$cx;
+  var emotion = (0, _Emotion.useEmotion)();
   var _useState = (0, _react.useState)(false),isFocusedByTab = _useState[0],setIsFocusedByTab = _useState[1];
   var locale = (0, _useLocaleForControl.useLocaleForControl)('SidePage', _locale.SidePageLocaleHelper);
-  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+  var theme = (0, _useTheme.useTheme)();
   var sidePageContext = (0, _react.useContext)(_SidePageContext.SidePageContext);
   var handleFocus = function handleFocus() {
@@ -31,11 +32,13 @@ var SidePageCloseButton = function SidePageCloseButton() {var _cx;
     setIsFocusedByTab(false);
   };
+  var styles = (0, _SidePage.getStyles)(emotion);
   return /*#__PURE__*/(
     _react.default.createElement("button", {
       "aria-label": locale == null ? void 0 : locale.closeButtonAriaLabel,
-      className: (0, _Emotion.cx)(_SidePage.styles.close(theme), (_cx = {}, _cx[
-      _SidePage.styles.closeFocus(theme)] = isFocusedByTab, _cx)),
+      className: emotion.cx(styles.close(theme), (_emotion$cx = {}, _emotion$cx[
+      styles.closeFocus(theme)] = isFocusedByTab, _emotion$cx)),
       onFocus: handleFocus,
       onBlur: handleBlur,
@@ -45,4 +48,7 @@ var SidePageCloseButton = function SidePageCloseButton() {var _cx;
     _react.default.createElement(_CrossIcon.CrossIcon, null)));
-};exports.SidePageCloseButton = SidePageCloseButton;
+};exports.SidePageCloseButton = SidePageCloseButton;
+SidePageCloseButton.__KONTUR_REACT_UI__ = 'SidePageCloseButton';
+SidePageCloseButton.displayName = 'SidePageCloseButton';

package/cjs/components/SidePage/SidePageCloseButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageCloseButton.tsx"],"names":["SidePageCloseButton","isFocusedByTab","setIsFocusedByTab","locale","SidePageLocaleHelper","theme","~~ThemeContext","~~sidePageContext","SidePageContext","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","handleBlur","closeButtonAriaLabel","~~styles~~","close","closeFocus","requestClose","SidePageHeaderDataTids"],"mappings":"~~4EAAA~~;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA~~,oD~~;;AAEO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,GAAM;AACvC,kBAA4C,qBAAS,KAAT,CAA5C,CAAOC,cAAP,gBAAuBC,iBAAvB;;AAEA,MAAMC,MAAM,GAAG,8CAAoB,UAApB,EAAgCC,4BAAhC,CAAf;AACA,MAAMC,KAAK,GAAG,~~uBAAWC,0BAAX,CAAd~~;AACA,MAAMC,eAAe,GAAG,uBAAWC,gCAAX,CAAxB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBC,+BAAaC,qBAAb,+CAAaA,qBAAb,CAAqC,YAAM;AACzC,UAAIC,yBAAYC,YAAhB,EAA8B;~~AAC5BX~~,QAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACD;AACF,KAJD;AAKD,GAND;;AAQA,~~MAAMY~~,UAAU,GAAG,SAAbA,UAAa,GAAM;~~AACvBZ~~,IAAAA,iBAAiB,CAAC,KAAD,CAAjB;AACD,GAFD;;AAIA;AACE;AACE,~~oBAAYC~~,MAAZ,oBAAYA,MAAM,CAAEY,oBADtB;AAEE,MAAA,SAAS,~~EAAE~~,~~iBAAGC~~,~~iBAAOC~~,KAAP,CAAaZ,KAAb,~~CAAH~~;~~AACRW~~,~~uBAAOE~~,UAAP,CAAkBb,KAAlB,CADQ,IACmBJ,cADnB,~~OAFb~~;;AAKE,MAAA,OAAO,~~EAAEQ~~,WALX;AAME,MAAA,MAAM,EAAEK,UANV;AAOE,MAAA,OAAO,EAAEP,eAAe,~~CAACY~~,YAP3B;AAQE,kBAAUC,uCAAuBH,KARnC;;AAUE,iCAAC,oBAAD,OAVF,CADF;;;AAcD,~~CAjCM~~,C","sourcesContent":["import React, { useContext, useState } from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { ~~ThemeContext~~ } from '../../lib/~~theming~~/~~ThemeContext~~';\nimport { ~~useLocaleForControl~~ } from '../../~~lib~~/~~locale~~/~~useLocaleForControl~~';\nimport { ~~CrossIcon~~ } from '../../~~internal~~/~~icons~~/~~CrossIcon~~';\nimport { cx } from '../../lib/~~theming~~/~~Emotion~~';\nimport { ~~keyListener~~ } from '../../lib/~~events~~/~~keyListener~~';\n\nimport { ~~styles~~ } from './SidePage.styles';\nimport { SidePageLocaleHelper } from './locale';\nimport { SidePageHeaderDataTids } from './SidePageHeader';\nimport { SidePageContext } from './SidePageContext';\n\nexport const SidePageCloseButton = () => {\n const [isFocusedByTab, setIsFocusedByTab] = useState(false);\n\n const locale = useLocaleForControl('SidePage', SidePageLocaleHelper);\n const theme = ~~useContext~~(~~ThemeContext~~);\n const sidePageContext = useContext(SidePageContext);\n\n const handleFocus = () => {\n globalObject.requestAnimationFrame?.(() => {\n if (keyListener.isTabPressed) {\n setIsFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setIsFocusedByTab(false);\n };\n\n return (\n <button\n aria-label={locale?.closeButtonAriaLabel}\n className={cx(styles.close(theme), {\n [styles.closeFocus(theme)]: isFocusedByTab,\n })}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onClick={sidePageContext.requestClose}\n data-tid={SidePageHeaderDataTids.close}\n >\n <CrossIcon />\n </button>\n );\n};\n"]}
1	+ {"version":3,"sources":["SidePageCloseButton.tsx"],"names":["SidePageCloseButton","emotion","isFocusedByTab","setIsFocusedByTab","locale","SidePageLocaleHelper","theme","sidePageContext","SidePageContext","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","handleBlur","styles","closeButtonAriaLabel","cx","close","closeFocus","requestClose","SidePageHeaderDataTids","__KONTUR_REACT_UI__","displayName"],"mappings":"2KAAA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,GAAM;AACvC,MAAMC,OAAO,GAAG,0BAAhB;AACA,kBAA4C,qBAAS,KAAT,CAA5C,CAAOC,cAAP,gBAAuBC,iBAAvB;;AAEA,MAAMC,MAAM,GAAG,8CAAoB,UAApB,EAAgCC,4BAAhC,CAAf;AACA,MAAMC,KAAK,GAAG,yBAAd;AACA,MAAMC,eAAe,GAAG,uBAAWC,gCAAX,CAAxB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBC,+BAAaC,qBAAb,+CAAaA,qBAAb,CAAqC,YAAM;AACzC,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BV,QAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACD;AACF,KAJD;AAKD,GAND;;AAQA,MAAMW,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvBX,IAAAA,iBAAiB,CAAC,KAAD,CAAjB;AACD,GAFD;;AAIA,MAAMY,MAAM,GAAG,yBAAUd,OAAV,CAAf;;AAEA;AACE;AACE,oBAAYG,MAAZ,oBAAYA,MAAM,CAAEY,oBADtB;AAEE,MAAA,SAAS,EAAEf,OAAO,CAACgB,EAAR,CAAWF,MAAM,CAACG,KAAP,CAAaZ,KAAb,CAAX;AACRS,MAAAA,MAAM,CAACI,UAAP,CAAkBb,KAAlB,CADQ,IACmBJ,cADnB,eAFb;;AAKE,MAAA,OAAO,EAAEO,WALX;AAME,MAAA,MAAM,EAAEK,UANV;AAOE,MAAA,OAAO,EAAEP,eAAe,CAACa,YAP3B;AAQE,kBAAUC,uCAAuBH,KARnC;;AAUE,iCAAC,oBAAD,OAVF,CADF;;;AAcD,CApCM,C;;AAsCPlB,mBAAmB,CAACsB,mBAApB,GAA0C,qBAA1C;AACAtB,mBAAmB,CAACuB,WAApB,GAAkC,qBAAlC","sourcesContent":["import React, { useContext, useState } from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { useLocaleForControl } from '../../lib/locale/useLocaleForControl';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { useEmotion } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport { getStyles } from './SidePage.styles';\nimport { SidePageLocaleHelper } from './locale';\nimport { SidePageHeaderDataTids } from './SidePageHeader';\nimport { SidePageContext } from './SidePageContext';\n\nexport const SidePageCloseButton = () => {\n const emotion = useEmotion();\n const [isFocusedByTab, setIsFocusedByTab] = useState(false);\n\n const locale = useLocaleForControl('SidePage', SidePageLocaleHelper);\n const theme = useTheme();\n const sidePageContext = useContext(SidePageContext);\n\n const handleFocus = () => {\n globalObject.requestAnimationFrame?.(() => {\n if (keyListener.isTabPressed) {\n setIsFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setIsFocusedByTab(false);\n };\n\n const styles = getStyles(emotion);\n\n return (\n <button\n aria-label={locale?.closeButtonAriaLabel}\n className={emotion.cx(styles.close(theme), {\n [styles.closeFocus(theme)]: isFocusedByTab,\n })}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onClick={sidePageContext.requestClose}\n data-tid={SidePageHeaderDataTids.close}\n >\n <CrossIcon />\n </button>\n );\n};\n\nSidePageCloseButton.__KONTUR_REACT_UI__ = 'SidePageCloseButton';\nSidePageCloseButton.displayName = 'SidePageCloseButton';\n"]}

package/cjs/components/SidePage/SidePageContainer.d.ts CHANGED Viewed

@@ -11,7 +11,9 @@ export declare const SidePageContainerDataTids: {
  */
 export declare class SidePageContainer extends React.Component<SidePageContainerProps> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     private theme;
+    private emotion;
     private isMobileLayout;
     private setRootNode;
     render(): JSX.Element;

package/cjs/components/SidePage/SidePageContainer.js CHANGED Viewed

@@ -1,14 +1,15 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.SidePageContainerDataTids = exports.SidePageContainer = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.SidePageContainerDataTids = exports.SidePageContainer = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
 var _decorator = require("../ResponsiveLayout/decorator");
 var _rootNode = require("../../lib/rootNode");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
-var _SidePage = require("./SidePage.styles");
-var _SidePageContext = require("./SidePageContext");var _class, _class2, _temp;
+var _SidePageContext = require("./SidePageContext");
+var _SidePage = require("./SidePage.styles");var _class, _class2, _temp;
@@ -30,31 +31,42 @@ SidePageContainer = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.root
   render = function render() {var _this = this;
     return /*#__PURE__*/(
-      _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
-      function (theme) {
-        _this.theme = theme;
-        return _this.renderMain();
+      _react.default.createElement(_Emotion.EmotionConsumer, null,
+      function (emotion) {
+        _this.emotion = emotion;
+        return /*#__PURE__*/(
+          _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
+          function (theme) {
+            _this.theme = theme;
+            return _this.renderMain();
+          }));
       }));
   };_proto.
   renderMain = function renderMain() {var _this2 = this;
+    var styles = (0, _SidePage.getStyles)(this.emotion);
     return /*#__PURE__*/(
       _react.default.createElement(_SidePageContext.SidePageContext.Consumer, null,
-      function (_ref) {var _cx;var hasHeader = _ref.hasHeader,hasFooter = _ref.hasFooter,hasPanel = _ref.hasPanel;return /*#__PURE__*/(
+      function (_ref) {var _this2$emotion$cx;var hasHeader = _ref.hasHeader,hasFooter = _ref.hasFooter,hasPanel = _ref.hasPanel;return /*#__PURE__*/(
           _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), /*#__PURE__*/
           _react.default.createElement("div", {
             "data-tid": SidePageContainerDataTids.root,
-            className: (0, _Emotion.cx)((_cx = {}, _cx[
-            _SidePage.styles.container(_this2.theme)] = true, _cx[
-            _SidePage.styles.containerWithoutHeader(_this2.theme)] = !hasHeader, _cx[
-            _SidePage.styles.containerWithoutFooter(_this2.theme)] = !hasFooter, _cx[
-            _SidePage.styles.containerWithPanel(_this2.theme)] = hasPanel, _cx[
-            _SidePage.styles.mobileContainer(_this2.theme)] = _this2.isMobileLayout, _cx[
-            _SidePage.styles.mobileContainerWithoutHeader(_this2.theme)] = _this2.isMobileLayout && !hasHeader, _cx)) },
+            className: _this2.emotion.cx((_this2$emotion$cx = {}, _this2$emotion$cx[
+            styles.container(_this2.theme)] = true, _this2$emotion$cx[
+            styles.containerWithoutHeader(_this2.theme)] = !hasHeader, _this2$emotion$cx[
+            styles.containerWithoutFooter(_this2.theme)] = !hasFooter, _this2$emotion$cx[
+            styles.containerWithPanel(_this2.theme)] = hasPanel, _this2$emotion$cx[
+            styles.mobileContainer(_this2.theme)] = _this2.isMobileLayout, _this2$emotion$cx[
+            styles.mobileContainerWithoutHeader(_this2.theme)] = _this2.isMobileLayout && !hasHeader, _this2$emotion$cx)) },
           _this2.props.children)));}));
@@ -63,4 +75,4 @@ SidePageContainer = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.root
-  };return SidePageContainer;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageContainer', _temp)) || _class) || _class;exports.SidePageContainer = SidePageContainer;
+  };return SidePageContainer;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageContainer', _class2.displayName = 'SidePageContainer', _temp)) || _class) || _class;exports.SidePageContainer = SidePageContainer;

package/cjs/components/SidePage/SidePageContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageContainer.tsx"],"names":["SidePageContainerDataTids","root","SidePageContainer","responsiveLayout","rootNode","render","theme","renderMain","hasHeader","hasFooter","hasPanel","setRootNode","props","~~styles~~","container","containerWithoutHeader","containerWithoutFooter","containerWithPanel","mobileContainer","isMobileLayout","mobileContainerWithoutHeader","children","React","Component","__KONTUR_REACT_UI__"],"mappings":"~~mXAAA~~;;AAEA;AACA~~;;AAEA~~;AACA;AACA;;AAEA;AACA,oD;;;;AAIO,IAAMA,yBAAyB,GAAG;AACvCC,EAAAA,IAAI,EAAE,yBADiC,EAAlC;;;AAIP;AACA;AACA;AACA;AACA,G;;;AAGaC,iB,OAFZC,2B,eACAC,kB~~;;;;;;;AAQQC~~,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,~~gBAACC~~,KAAD,EAAW;AACV,~~QAAA~~,KAAI,CAACA,KAAL,GAAaA,KAAb;AACA,~~eAAO~~,KAAI,CAACC,UAAL,EAAP;AACD,~~OAJH~~,CADF;;;AAQD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB;AACE,mCAAC,gCAAD,CAAiB,QAAjB;AACG,~~mCAAGC~~,SAAH,QAAGA,SAAH,CAAcC,SAAd,QAAcA,SAAd,CAAyBC,QAAzB,QAAyBA,QAAzB;AACC,uCAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACC,WAAjC,IAAkD,MAAI,CAACC,KAAvD;AACE;AACE,~~wBAAUZ~~,yBAAyB,CAACC,IADtC;AAEE,YAAA,SAAS,EAAE;~~AACRY~~,~~6BAAOC~~,SAAP,CAAiB,MAAI,~~CAACR~~,KAAtB,CADQ,IACuB,IADvB;~~AAERO~~,~~6BAAOE~~,sBAAP,CAA8B,MAAI,~~CAACT~~,KAAnC,CAFQ,IAEoC,~~CAACE~~,SAFrC;~~AAGRK~~,~~6BAAOG~~,sBAAP,CAA8B,MAAI,~~CAACV~~,KAAnC,CAHQ,IAGoC,~~CAACG~~,SAHrC;~~AAIRI~~,~~6BAAOI~~,kBAAP,CAA0B,MAAI,~~CAACX~~,KAA/B,CAJQ,~~IAIgCI~~,QAJhC;~~AAKRG~~,~~6BAAOK~~,eAAP,CAAuB,MAAI,~~CAACZ~~,KAA5B,CALQ,IAK6B,MAAI,~~CAACa~~,cALlC;~~AAMRN~~,~~6BAAOO~~,4BAAP,CAAoC,MAAI,~~CAACd~~,KAAzC,CANQ,IAM0C,MAAI,~~CAACa~~,cAAL,IAAuB,CAACX,SANlE,~~OAFb~~;;;AAWG,UAAA,MAAI,CAACI,KAAL,CAAWS,QAXd,CADF,CADD,GADH,CADF;;;;;;AAqBD,G,~~4BAxCoCC~~,eAAMC,S,WAC7BC,mB,GAAsB,mB","sourcesContent":["import React from 'react';\n\nimport { ~~ThemeContext~~ } from '~~../../lib~~/~~theming~~/~~ThemeContext~~';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { ~~styles~~ } from './~~SidePage.styles~~';\nimport { ~~SidePageContext~~ } from './~~SidePageContext~~';\n\nexport type SidePageContainerProps = CommonProps;\n\nexport const SidePageContainerDataTids = {\n root: 'SidePageContainer__root',\n} as const;\n\n/*\n Контейнер с отступами\n \n @visibleName SidePage.Container\n */\n@responsiveLayout\n@rootNode\nexport class SidePageContainer extends React.Component<SidePageContainerProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageContainer';\n\n private theme!: Theme;\n private isMobileLayout!: boolean;\n private setRootNode!: TSetRootNode;\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 public renderMain() {\n return (\n <SidePageContext.Consumer>\n {({ hasHeader, hasFooter, hasPanel }) => (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageContainerDataTids.root}\n className={cx({\n [styles.container(this.theme)]: true,\n [styles.containerWithoutHeader(this.theme)]: !hasHeader,\n [styles.containerWithoutFooter(this.theme)]: !hasFooter,\n [styles.containerWithPanel(this.theme)]: hasPanel,\n [styles.mobileContainer(this.theme)]: this.isMobileLayout,\n [styles.mobileContainerWithoutHeader(this.theme)]: this.isMobileLayout && !hasHeader,\n })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n )}\n </SidePageContext.Consumer>\n );\n }\n}\n"]}
1	+ {"version":3,"sources":["SidePageContainer.tsx"],"names":["SidePageContainerDataTids","root","SidePageContainer","responsiveLayout","rootNode","render","emotion","theme","renderMain","styles","hasHeader","hasFooter","hasPanel","setRootNode","props","cx","container","containerWithoutHeader","containerWithoutFooter","containerWithPanel","mobileContainer","isMobileLayout","mobileContainerWithoutHeader","children","React","Component","__KONTUR_REACT_UI__","displayName"],"mappings":"2XAAA;;;AAGA;;AAEA;AACA;AACA;AACA;;AAEA;AACA,6C;;;;AAIO,IAAMA,yBAAyB,GAAG;AACvCC,EAAAA,IAAI,EAAE,yBADiC,EAAlC;;;AAIP;AACA;AACA;AACA;AACA,G;;;AAGaC,iB,OAFZC,2B,eACAC,kB;;;;;;;;;AAUQC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,wBAAD;AACG,gBAACC,OAAD,EAAa;AACZ,QAAA,KAAI,CAACA,OAAL,GAAeA,OAAf;AACA;AACE,uCAAC,0BAAD,CAAc,QAAd;AACG,oBAACC,KAAD,EAAW;AACV,YAAA,KAAI,CAACA,KAAL,GAAaA,KAAb;AACA,mBAAO,KAAI,CAACC,UAAL,EAAP;AACD,WAJH,CADF;;;AAQD,OAXH,CADF;;;AAeD,G;;AAEMA,EAAAA,U,GAAP,sBAAoB;AAClB,QAAMC,MAAM,GAAG,yBAAU,KAAKH,OAAf,CAAf;;AAEA;AACE,mCAAC,gCAAD,CAAiB,QAAjB;AACG,iDAAGI,SAAH,QAAGA,SAAH,CAAcC,SAAd,QAAcA,SAAd,CAAyBC,QAAzB,QAAyBA,QAAzB;AACC,uCAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACC,WAAjC,IAAkD,MAAI,CAACC,KAAvD;AACE;AACE,wBAAUd,yBAAyB,CAACC,IADtC;AAEE,YAAA,SAAS,EAAE,MAAI,CAACK,OAAL,CAAaS,EAAb;AACRN,YAAAA,MAAM,CAACO,SAAP,CAAiB,MAAI,CAACT,KAAtB,CADQ,IACuB,IADvB;AAERE,YAAAA,MAAM,CAACQ,sBAAP,CAA8B,MAAI,CAACV,KAAnC,CAFQ,IAEoC,CAACG,SAFrC;AAGRD,YAAAA,MAAM,CAACS,sBAAP,CAA8B,MAAI,CAACX,KAAnC,CAHQ,IAGoC,CAACI,SAHrC;AAIRF,YAAAA,MAAM,CAACU,kBAAP,CAA0B,MAAI,CAACZ,KAA/B,CAJQ,IAIgCK,QAJhC;AAKRH,YAAAA,MAAM,CAACW,eAAP,CAAuB,MAAI,CAACb,KAA5B,CALQ,IAK6B,MAAI,CAACc,cALlC;AAMRZ,YAAAA,MAAM,CAACa,4BAAP,CAAoC,MAAI,CAACf,KAAzC,CANQ,IAM0C,MAAI,CAACc,cAAL,IAAuB,CAACX,SANlE,qBAFb;;;AAWG,UAAA,MAAI,CAACI,KAAL,CAAWS,QAXd,CADF,CADD,GADH,CADF;;;;;;AAqBD,G,4BAnDoCC,eAAMC,S,WAC7BC,mB,GAAsB,mB,UACtBC,W,GAAc,mB","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { Theme } from '../../lib/theming/Theme';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { SidePageContext } from './SidePageContext';\nimport { getStyles } from './SidePage.styles';\n\nexport type SidePageContainerProps = CommonProps;\n\nexport const SidePageContainerDataTids = {\n root: 'SidePageContainer__root',\n} as const;\n\n/*\n Контейнер с отступами\n \n @visibleName SidePage.Container\n */\n@responsiveLayout\n@rootNode\nexport class SidePageContainer extends React.Component<SidePageContainerProps> {\n public static __KONTUR_REACT_UI__ = 'SidePageContainer';\n public static displayName = 'SidePageContainer';\n\n private theme!: Theme;\n private emotion!: Emotion;\n private isMobileLayout!: boolean;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <EmotionConsumer>\n {(emotion) => {\n this.emotion = emotion;\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }}\n </EmotionConsumer>\n );\n }\n\n public renderMain() {\n const styles = getStyles(this.emotion);\n\n return (\n <SidePageContext.Consumer>\n {({ hasHeader, hasFooter, hasPanel }) => (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageContainerDataTids.root}\n className={this.emotion.cx({\n [styles.container(this.theme)]: true,\n [styles.containerWithoutHeader(this.theme)]: !hasHeader,\n [styles.containerWithoutFooter(this.theme)]: !hasFooter,\n [styles.containerWithPanel(this.theme)]: hasPanel,\n [styles.mobileContainer(this.theme)]: this.isMobileLayout,\n [styles.mobileContainerWithoutHeader(this.theme)]: this.isMobileLayout && !hasHeader,\n })}\n >\n {this.props.children}\n </div>\n </CommonWrapper>\n )}\n </SidePageContext.Consumer>\n );\n }\n}\n"]}

package/cjs/components/SidePage/SidePageContext.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.SidePageContext = void 0;var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.SidePageContext = void 0;var _react = _interopRequireDefault(require("react"));

package/cjs/components/SidePage/SidePageContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageContext.ts"],"names":["SidePageContext","React","createContext","requestClose","undefined","getWidth","updateLayout","headerRef","footerRef","displayName"],"mappings":"~~6JAAA~~;;;;;;;;;;;;;;;;;;;AAmBO,IAAMA,eAAe,gBAAGC,eAAMC,aAAN,CAAyC;AACtEC,EAAAA,YAAY,EAAE,gCAAMC,SAAN,EADwD;AAEtEC,EAAAA,QAAQ,EAAE,4BAAM,MAAN,EAF4D;AAGtEC,EAAAA,YAAY,EAAE,gCAAMF,SAAN,EAHwD;AAItEG,EAAAA,SAAS,EAAE,6BAAMH,SAAN,EAJ2D;AAKtEI,EAAAA,SAAS,EAAE,6BAAMJ,SAAN,EAL2D,EAAzC,CAAxB,C;;;AAQPJ,eAAe,CAACS,WAAhB,GAA8B,iBAA9B","sourcesContent":["import React from 'react';\n\nimport { SidePageFooter } from './SidePageFooter';\nimport { SidePageHeader } from './SidePageHeader';\n\nexport interface SidePageContextType {\n requestClose: () => void;\n getWidth: () => number \| string;\n updateLayout: () => void;\n headerRef: (ref: SidePageHeader \| null) => void;\n footerRef: (ref: SidePageFooter \| null) => void;\n hasHeader?: boolean;\n hasFooter?: boolean;\n hasPanel?: boolean;\n setHasHeader?: (value?: boolean) => void;\n setHasFooter?: (value?: boolean) => void;\n setHasPanel?: (value?: boolean) => void;\n}\n\nexport const SidePageContext = React.createContext<SidePageContextType>({\n requestClose: () => undefined,\n getWidth: () => 'auto',\n updateLayout: () => undefined,\n headerRef: () => undefined,\n footerRef: () => undefined,\n});\n\nSidePageContext.displayName = 'SidePageContext';\n"]}
1	+ {"version":3,"sources":["SidePageContext.ts"],"names":["SidePageContext","React","createContext","requestClose","undefined","getWidth","updateLayout","headerRef","footerRef","displayName"],"mappings":"qKAAA;;;;;;;;;;;;;;;;;;;AAmBO,IAAMA,eAAe,gBAAGC,eAAMC,aAAN,CAAyC;AACtEC,EAAAA,YAAY,EAAE,gCAAMC,SAAN,EADwD;AAEtEC,EAAAA,QAAQ,EAAE,4BAAM,MAAN,EAF4D;AAGtEC,EAAAA,YAAY,EAAE,gCAAMF,SAAN,EAHwD;AAItEG,EAAAA,SAAS,EAAE,6BAAMH,SAAN,EAJ2D;AAKtEI,EAAAA,SAAS,EAAE,6BAAMJ,SAAN,EAL2D,EAAzC,CAAxB,C;;;AAQPJ,eAAe,CAACS,WAAhB,GAA8B,iBAA9B","sourcesContent":["import React from 'react';\n\nimport { SidePageFooter } from './SidePageFooter';\nimport { SidePageHeader } from './SidePageHeader';\n\nexport interface SidePageContextType {\n requestClose: () => void;\n getWidth: () => number \| string;\n updateLayout: () => void;\n headerRef: (ref: SidePageHeader \| null) => void;\n footerRef: (ref: SidePageFooter \| null) => void;\n hasHeader?: boolean;\n hasFooter?: boolean;\n hasPanel?: boolean;\n setHasHeader?: (value?: boolean) => void;\n setHasFooter?: (value?: boolean) => void;\n setHasPanel?: (value?: boolean) => void;\n}\n\nexport const SidePageContext = React.createContext<SidePageContextType>({\n requestClose: () => undefined,\n getWidth: () => 'auto',\n updateLayout: () => undefined,\n headerRef: () => undefined,\n footerRef: () => undefined,\n});\n\nSidePageContext.displayName = 'SidePageContext';\n"]}

package/cjs/components/SidePage/SidePageFooter.d.ts CHANGED Viewed

@@ -30,11 +30,13 @@ export declare const SidePageFooterDataTids: {
  */
 export declare class SidePageFooter extends React.Component<SidePageFooterProps, SidePageFooterState> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static contextType: React.Context<SidePageContextType>;
     context: SidePageContextType;
     private isMobileLayout;
     state: SidePageFooterState;
     private theme;
+    private emotion;
     private content;
     private layoutSub;
     private setRootNode;

package/cjs/components/SidePage/SidePageFooter.js CHANGED Viewed

@@ -1,7 +1,7 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.SidePageFooterDataTids = exports.SidePageFooter = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.SidePageFooterDataTids = exports.SidePageFooter = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
@@ -12,9 +12,10 @@ var _Gapped = require("../Gapped");
 var _utils = require("../../lib/utils");
 var _ModalSeparator = require("../Modal/ModalSeparator");
 var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
-var _SidePage = require("./SidePage.styles");
-var _SidePageContext = require("./SidePageContext");var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _SidePageContext = require("./SidePageContext");
+var _SidePage = require("./SidePage.styles");var _class, _class2, _temp;
@@ -51,6 +52,7 @@ SidePageFooter = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNod
     context = _this.context;_this.
@@ -59,6 +61,7 @@ SidePageFooter = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNod
     content = null;_this.
     layoutSub = null;_this.
@@ -99,6 +102,13 @@ SidePageFooter = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNod
@@ -158,6 +168,7 @@ SidePageFooter = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNod
     refContent = function (node) {
@@ -172,11 +183,11 @@ SidePageFooter = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNod
         var _fixed = wrapperRect.top > contentRect.top;
         _this.setState({ fixed: _fixed });
       }
-    };return _this;}var _proto = SidePageFooter.prototype;_proto.componentDidMount = function componentDidMount() {var _this$context$setHasF, _this$context, _this$context$setHasP, _this$context2;this.context.footerRef(this);this.update();this.layoutSub = LayoutEvents.addListener(this.update);(_this$context$setHasF = (_this$context = this.context).setHasFooter) == null ? void 0 : _this$context$setHasF.call(_this$context);(_this$context$setHasP = (_this$context2 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP.call(_this$context2, this.props.panel);};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$context$setHasP2, _this$context3;this.props.panel !== prevProps.panel && ((_this$context$setHasP2 = (_this$context3 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP2.call(_this$context3, this.props.panel));};_proto.componentWillUnmount = function componentWillUnmount() {var _this$context$setHasF2, _this$context4, _this$context$setHasP3, _this$context5;this.context.footerRef(null);if (this.layoutSub) {this.layoutSub.remove();}(_this$context$setHasF2 = (_this$context4 = this.context).setHasFooter) == null ? void 0 : _this$context$setHasF2.call(_this$context4, false);(_this$context$setHasP3 = (_this$context5 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP3.call(_this$context5, false);};_proto.getSticky = function getSticky() {if (typeof this.props.sticky !== 'undefined') {return this.props.sticky;}if (this.isMobileLayout) {return false;}return true;};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this3 = this;var separator = null;if ((0, _ThemeHelpers.isTheme2022)(this.theme)) {separator = (this.props.panel || this.state.fixed) && /*#__PURE__*/_react.default.createElement(_ModalSeparator.ModalSeparator, { fixed: this.state.fixed });}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": SidePageFooterDataTids.root, style: { height: this.getContentHeight() }, className: _SidePage.styles.footerWrapper() }, /*#__PURE__*/_react.default.createElement(_SidePageContext.SidePageContext.Consumer, null, function (_ref) {var _cx, _cx2;var getWidth = _ref.getWidth;return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_SidePage.styles.footer(_this3.theme), (_cx = {}, _cx[_SidePage.styles.positionStatic()] = !_this3.getSticky(), _cx)), style: { width: getWidth() } }, separator, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_SidePage.styles.footerContent(_this3.theme), (_cx2 = {}, _cx2[_SidePage.styles.footerFixed(_this3.theme)] = _this3.state.fixed, _cx2[_SidePage.styles.panel(_this3.theme)] = !!_this3.props.panel, _cx2[_SidePage.styles.panelFixed(_this3.theme)] = !!_this3.props.panel && _this3.state.fixed, _cx2[_SidePage.styles.mobileFooterContent(_this3.theme)] = _this3.isMobileLayout, _cx2)), ref: _this3.refContent }, (0, _utils.isNonNullable)(_this3.props.gap) ? /*#__PURE__*/_react.default.createElement(_Gapped.Gapped, { vertical: _this3.isMobileLayout, gap: _this3.props.gap }, _this3.props.children) : _this3.props.children));})));};_proto.
+    };return _this;}var _proto = SidePageFooter.prototype;_proto.componentDidMount = function componentDidMount() {var _this$context$setHasF, _this$context, _this$context$setHasP, _this$context2;this.context.footerRef(this);this.update();this.layoutSub = LayoutEvents.addListener(this.update);(_this$context$setHasF = (_this$context = this.context).setHasFooter) == null ? void 0 : _this$context$setHasF.call(_this$context);(_this$context$setHasP = (_this$context2 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP.call(_this$context2, this.props.panel);};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$context$setHasP2, _this$context3;this.props.panel !== prevProps.panel && ((_this$context$setHasP2 = (_this$context3 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP2.call(_this$context3, this.props.panel));};_proto.componentWillUnmount = function componentWillUnmount() {var _this$context$setHasF2, _this$context4, _this$context$setHasP3, _this$context5;this.context.footerRef(null);if (this.layoutSub) {this.layoutSub.remove();}(_this$context$setHasF2 = (_this$context4 = this.context).setHasFooter) == null ? void 0 : _this$context$setHasF2.call(_this$context4, false);(_this$context$setHasP3 = (_this$context5 = this.context).setHasPanel) == null ? void 0 : _this$context$setHasP3.call(_this$context5, false);};_proto.getSticky = function getSticky() {if (typeof this.props.sticky !== 'undefined') {return this.props.sticky;}if (this.isMobileLayout) {return false;}return true;};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.renderMain = function renderMain() {var _this3 = this;var separator = null;if ((0, _ThemeHelpers.isTheme2022)(this.theme)) {separator = (this.props.panel || this.state.fixed) && /*#__PURE__*/_react.default.createElement(_ModalSeparator.ModalSeparator, { fixed: this.state.fixed });}var styles = (0, _SidePage.getStyles)(this.emotion);return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": SidePageFooterDataTids.root, style: { height: this.getContentHeight() }, className: styles.footerWrapper() }, /*#__PURE__*/_react.default.createElement(_SidePageContext.SidePageContext.Consumer, null, function (_ref) {var _this3$emotion$cx, _this3$emotion$cx2;var getWidth = _ref.getWidth;return /*#__PURE__*/_react.default.createElement("div", { className: _this3.emotion.cx(styles.footer(_this3.theme), (_this3$emotion$cx = {}, _this3$emotion$cx[styles.positionStatic()] = !_this3.getSticky(), _this3$emotion$cx)), style: { width: getWidth() } }, separator, /*#__PURE__*/_react.default.createElement("div", { className: _this3.emotion.cx(styles.footerContent(_this3.theme), (_this3$emotion$cx2 = {}, _this3$emotion$cx2[styles.footerFixed(_this3.theme)] = _this3.state.fixed, _this3$emotion$cx2[styles.panel(_this3.theme)] = !!_this3.props.panel, _this3$emotion$cx2[styles.panelFixed(_this3.theme)] = !!_this3.props.panel && _this3.state.fixed, _this3$emotion$cx2[styles.mobileFooterContent(_this3.theme)] = _this3.isMobileLayout, _this3$emotion$cx2)), ref: _this3.refContent }, (0, _utils.isNonNullable)(_this3.props.gap) ? /*#__PURE__*/_react.default.createElement(_Gapped.Gapped, { vertical: _this3.isMobileLayout, gap: _this3.props.gap }, _this3.props.children) : _this3.props.children));})));};_proto.
   getContentHeight = function getContentHeight() {
     if (!this.content) {
       return 'auto';
     }
     return (0, _getDOMRect.getDOMRect)(this.content).height;
-  };return SidePageFooter;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageFooter', _class2.contextType = _SidePageContext.SidePageContext, _temp)) || _class) || _class;exports.SidePageFooter = SidePageFooter;
+  };return SidePageFooter;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'SidePageFooter', _class2.displayName = 'SidePageFooter', _class2.contextType = _SidePageContext.SidePageContext, _temp)) || _class) || _class;exports.SidePageFooter = SidePageFooter;

package/cjs/components/SidePage/SidePageFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageFooter.tsx"],"names":["SidePageFooterDataTids","root","SidePageFooter","responsiveLayout","rootNode","context","state","fixed","content","layoutSub","update","setProperStyles","refContent","node","wrapper","wrapperRect","contentRect","top","setState","componentDidMount","footerRef","LayoutEvents","addListener","setHasFooter","setHasPanel","props","panel","componentDidUpdate","prevProps","componentWillUnmount","remove","getSticky","sticky","isMobileLayout","render","theme","renderMain","separator","setRootNode","height","getContentHeight","styles","footerWrapper","getWidth","footer","positionStatic","width","footerContent","footerFixed","panelFixed","mobileFooterContent","gap","children","React","Component","__KONTUR_REACT_UI__","contextType","SidePageContext"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\nimport { ModalSeparator } from '../Modal/ModalSeparator';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageFooterProps extends Omit<CommonProps, 'children'> {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n /\n Закрепляет футер снизу сайдпейджа\n /\n sticky?: boolean;\n /\n Задаёт отступ между элементами футера\n /\n gap?: GappedProps['gap'];\n}\n\ninterface SidePageFooterState {\n fixed: boolean;\n}\n\nexport const SidePageFooterDataTids = {\n root: 'SidePageFooter__root',\n} as const;\n\n/\n Футер сайдпейджа.\n \n @visibleName SidePage.Footer\n */\n@responsiveLayout\n@rootNode\nexport class SidePageFooter extends React.Component<SidePageFooterProps, SidePageFooterState> {\n public static __KONTUR_REACT_UI__ = 'SidePageFooter';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n\n public state: SidePageFooterState = {\n fixed: false,\n };\n\n private theme!: Theme;\n private content: HTMLElement \| null = null;\n private layoutSub: ReturnType<typeof LayoutEvents.addListener> \| null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.context.footerRef(this);\n this.update();\n this.layoutSub = LayoutEvents.addListener(this.update);\n this.context.setHasFooter?.();\n this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentDidUpdate(prevProps: Readonly<SidePageFooterProps>) {\n this.props.panel !== prevProps.panel && this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentWillUnmount() {\n this.context.footerRef(null);\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n this.context.setHasFooter?.(false);\n this.context.setHasPanel?.(false);\n }\n\n public getSticky() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public update = () => {\n this.setProperStyles();\n };\n\n private renderMain() {\n let separator: React.ReactNode = null;\n if (isTheme2022(this.theme)) {\n separator = (this.props.panel \|\| this.state.fixed) && <ModalSeparator fixed={this.state.fixed} />;\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageFooterDataTids.root}\n style={{ height: this.getContentHeight() }}\n className={styles.footerWrapper()}\n >\n <SidePageContext.Consumer>\n {({ getWidth }) => (\n <div\n className={cx(styles.footer(this.theme), {\n [styles.positionStatic()]: !this.getSticky(),\n })}\n style={{\n width: getWidth(),\n }}\n >\n {separator}\n <div\n className={cx(styles.footerContent(this.theme), {\n [styles.footerFixed(this.theme)]: this.state.fixed,\n [styles.panel(this.theme)]: !!this.props.panel,\n [styles.panelFixed(this.theme)]: !!this.props.panel && this.state.fixed,\n [styles.mobileFooterContent(this.theme)]: this.isMobileLayout,\n })}\n ref={this.refContent}\n >\n {isNonNullable(this.props.gap) ? (\n <Gapped vertical={this.isMobileLayout} gap={this.props.gap}>\n {this.props.children}\n </Gapped>\n ) : (\n this.props.children\n )}\n </div>\n </div>\n )}\n </SidePageContext.Consumer>\n </div>\n </CommonWrapper>\n );\n }\n\n private refContent = (node: HTMLElement \| null) => {\n this.content = node;\n };\n\n private setProperStyles = () => {\n const wrapper = getRootNode(this);\n if (wrapper && this.content) {\n const wrapperRect = getDOMRect(wrapper);\n const contentRect = getDOMRect(this.content);\n const fixed = wrapperRect.top > contentRect.top;\n this.setState({ fixed });\n }\n };\n\n private getContentHeight() {\n if (!this.content) {\n return 'auto';\n }\n return getDOMRect(this.content).height;\n }\n}\n"]}
1	+ {"version":3,"sources":["SidePageFooter.tsx"],"names":["SidePageFooterDataTids","root","SidePageFooter","responsiveLayout","rootNode","context","state","fixed","content","layoutSub","update","setProperStyles","refContent","node","wrapper","wrapperRect","contentRect","top","setState","componentDidMount","footerRef","LayoutEvents","addListener","setHasFooter","setHasPanel","props","panel","componentDidUpdate","prevProps","componentWillUnmount","remove","getSticky","sticky","isMobileLayout","render","emotion","theme","renderMain","separator","styles","setRootNode","height","getContentHeight","footerWrapper","getWidth","cx","footer","positionStatic","width","footerContent","footerFixed","panelFixed","mobileFooterContent","gap","children","React","Component","__KONTUR_REACT_UI__","displayName","contextType","SidePageContext"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\nimport { ModalSeparator } from '../Modal/ModalSeparator';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\nimport { getStyles } from './SidePage.styles';\n\nexport interface SidePageFooterProps extends Omit<CommonProps, 'children'> {\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n /\n Закрепляет футер снизу сайдпейджа\n /\n sticky?: boolean;\n /\n Задаёт отступ между элементами футера\n /\n gap?: GappedProps['gap'];\n}\n\ninterface SidePageFooterState {\n fixed: boolean;\n}\n\nexport const SidePageFooterDataTids = {\n root: 'SidePageFooter__root',\n} as const;\n\n/\n Футер сайдпейджа.\n \n @visibleName SidePage.Footer\n */\n@responsiveLayout\n@rootNode\nexport class SidePageFooter extends React.Component<SidePageFooterProps, SidePageFooterState> {\n public static __KONTUR_REACT_UI__ = 'SidePageFooter';\n public static displayName = 'SidePageFooter';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n private isMobileLayout!: boolean;\n\n public state: SidePageFooterState = {\n fixed: false,\n };\n\n private theme!: Theme;\n private emotion!: Emotion;\n private content: HTMLElement \| null = null;\n private layoutSub: ReturnType<typeof LayoutEvents.addListener> \| null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.context.footerRef(this);\n this.update();\n this.layoutSub = LayoutEvents.addListener(this.update);\n this.context.setHasFooter?.();\n this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentDidUpdate(prevProps: Readonly<SidePageFooterProps>) {\n this.props.panel !== prevProps.panel && this.context.setHasPanel?.(this.props.panel);\n }\n\n public componentWillUnmount() {\n this.context.footerRef(null);\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n this.context.setHasFooter?.(false);\n this.context.setHasPanel?.(false);\n }\n\n public getSticky() {\n if (typeof this.props.sticky !== 'undefined') {\n return this.props.sticky;\n }\n\n if (this.isMobileLayout) {\n return false;\n }\n\n return true;\n }\n\n public render(): JSX.Element {\n return (\n <EmotionConsumer>\n {(emotion) => {\n this.emotion = emotion;\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }}\n </EmotionConsumer>\n );\n }\n\n public update = () => {\n this.setProperStyles();\n };\n\n private renderMain() {\n let separator: React.ReactNode = null;\n if (isTheme2022(this.theme)) {\n separator = (this.props.panel \|\| this.state.fixed) && <ModalSeparator fixed={this.state.fixed} />;\n }\n\n const styles = getStyles(this.emotion);\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div\n data-tid={SidePageFooterDataTids.root}\n style={{ height: this.getContentHeight() }}\n className={styles.footerWrapper()}\n >\n <SidePageContext.Consumer>\n {({ getWidth }) => (\n <div\n className={this.emotion.cx(styles.footer(this.theme), {\n [styles.positionStatic()]: !this.getSticky(),\n })}\n style={{\n width: getWidth(),\n }}\n >\n {separator}\n <div\n className={this.emotion.cx(styles.footerContent(this.theme), {\n [styles.footerFixed(this.theme)]: this.state.fixed,\n [styles.panel(this.theme)]: !!this.props.panel,\n [styles.panelFixed(this.theme)]: !!this.props.panel && this.state.fixed,\n [styles.mobileFooterContent(this.theme)]: this.isMobileLayout,\n })}\n ref={this.refContent}\n >\n {isNonNullable(this.props.gap) ? (\n <Gapped vertical={this.isMobileLayout} gap={this.props.gap}>\n {this.props.children}\n </Gapped>\n ) : (\n this.props.children\n )}\n </div>\n </div>\n )}\n </SidePageContext.Consumer>\n </div>\n </CommonWrapper>\n );\n }\n\n private refContent = (node: HTMLElement \| null) => {\n this.content = node;\n };\n\n private setProperStyles = () => {\n const wrapper = getRootNode(this);\n if (wrapper && this.content) {\n const wrapperRect = getDOMRect(wrapper);\n const contentRect = getDOMRect(this.content);\n const fixed = wrapperRect.top > contentRect.top;\n this.setState({ fixed });\n }\n };\n\n private getContentHeight() {\n if (!this.content) {\n return 'auto';\n }\n return getDOMRect(this.content).height;\n }\n}\n"]}

package/cjs/components/SidePage/SidePageHeader.d.ts CHANGED Viewed

@@ -20,12 +20,14 @@ export declare const SidePageHeaderDataTids: {
  */
 export declare class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static contextType: React.Context<SidePageContextType>;
     context: SidePageContextType;
     private isMobileLayout;
     state: SidePageHeaderState;
     static defaultProps: Partial<SidePageHeaderProps>;
     private theme;
+    private emotion;
     private wrapper;
     private sticky;
     private lastRegularHeight;