npm - @skbkontur/react-ui - Versions diffs - 2.17.6 → 2.17.8 - Mend

@skbkontur/react-ui 2.17.6 → 2.17.8

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 (33) hide show

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

@@ -45,13 +45,15 @@ export var SidePage = /*#__PURE__*/function (_React$Component) {
     _this.state = {};
     _this.theme = void 0;
     _this.stackSubscription = null;
-    _this.layoutRef = null;
+    _this.layout = null;
     _this.footer = null;
+    _this.header = null;
     _this.updateLayout = function () {
-      if (_this.footer) {
-        _this.footer.update();
-      }
+      var _this$header, _this$footer;
+      (_this$header = _this.header) == null ? void 0 : _this$header.update();
+      (_this$footer = _this.footer) == null ? void 0 : _this$footer.update();
     };
     _this.getSidePageContextProps = function () {
@@ -78,17 +80,18 @@ export var SidePage = /*#__PURE__*/function (_React$Component) {
         requestClose: _this.requestClose,
         getWidth: _this.getWidth,
         updateLayout: _this.updateLayout,
-        footerRef: _this.footerRef
+        footerRef: _this.footerRef,
+        headerRef: _this.headerRef
       };
       return sidePageContextProps;
     };
     _this.getWidth = function () {
-      if (!_this.layoutRef) {
+      if (!_this.layout) {
         return 'auto';
       }
-      return _this.layoutRef.getBoundingClientRect().width;
+      return _this.layout.getBoundingClientRect().width;
     };
     _this.handleStackChange = function (stack) {
@@ -141,10 +144,18 @@ export var SidePage = /*#__PURE__*/function (_React$Component) {
       }
     };
+    _this.headerRef = function (ref) {
+      _this.header = ref;
+    };
     _this.footerRef = function (ref) {
       _this.footer = ref;
     };
+    _this.layoutRef = function (ref) {
+      _this.layout = ref;
+    };
     return _this;
   }
@@ -197,8 +208,7 @@ export var SidePage = /*#__PURE__*/function (_React$Component) {
   };
   _proto.renderContainer = function renderContainer() {
-    var _cn,
-        _this3 = this;
+    var _cn;
     var _this$props2 = this.props,
         width = _this$props2.width,
@@ -221,9 +231,7 @@ export var SidePage = /*#__PURE__*/function (_React$Component) {
       className: cn(jsStyles.wrapper(this.theme), this.state.hasShadow && jsStyles.shadow(this.theme)),
       style: this.getSidebarStyle()
     }, /*#__PURE__*/React.createElement("div", {
-      ref: function ref(_) {
-        return _this3.layoutRef = _;
-      },
+      ref: this.layoutRef,
       className: jsStyles.layout()
     }, /*#__PURE__*/React.createElement(SidePageContext.Provider, {
       value: this.getSidePageContextProps()

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePage.tsx"],"names":["React","CSSTransition","cn","isKeyEscape","LayoutEvents","stopPropagation","HideBodyVerticalScroll","ModalStack","RenderContainer","RenderLayer","ZIndex","ThemeContext","CommonWrapper","SidePageBody","SidePageContainer","SidePageContext","SidePageFooter","SidePageHeader","jsStyles","isFooter","isHeader","TRANSITION_TIMEOUT","SidePage","state","theme","stackSubscription","layoutRef","footer","updateLayout","update","getSidePageContextProps","hasHeader","hasFooter","hasPanel","Children","toArray","props","children","forEach","child","panel","sidePageContextProps","requestClose","getWidth","footerRef","getBoundingClientRect","width","handleStackChange","stack","sidePages","filter","x","fromLeft","currentSidePagePosition","indexOf","hasMargin","length","hasShadow","hasBackground","isBlocking","setState","stackPosition","handleClickOutside","e","ignoreBackgroundClick","MouseEvent","clientX","document","documentElement","clientWidth","handleKeyDown","disableClose","onClose","ref","componentDidMount","window","addEventListener","add","componentWillUnmount","removeEventListener","remove","render","renderMain","blockBackground","disableAnimations","renderShadow","getTransitionNames","enter","exit","renderContainer","root","leftSide","Boolean","emit","wrapper","shadow","getSidebarStyle","_","layout","overlay","background","backgroundGray","sidePageStyle","marginLeft","marginRight","transition","transitionRight","transitionLeft","enterActive","transitionActive","transitionLeave","exitActive","transitionLeaveActive","appear","appearActive","Component","__KONTUR_REACT_UI__","Header","Body","Footer","Container"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport { CSSTransition } from 'react-transition-group';\r\nimport cn from 'classnames';\r\n\r\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { stopPropagation } from '../../lib/events/stopPropagation';\r\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\r\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\r\nimport { RenderContainer } from '../../internal/RenderContainer';\r\nimport { RenderLayer } from '../../internal/RenderLayer';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { SidePageBody } from './SidePageBody';\r\nimport { SidePageContainer } from './SidePageContainer';\r\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\r\nimport { SidePageFooter } from './SidePageFooter';\r\nimport { SidePageHeader } from './SidePageHeader';\r\nimport { jsStyles } from './SidePage.styles';\r\nimport { isFooter, isHeader } from './helpers';\r\n\r\nexport interface SidePageProps extends CommonProps {\r\n /*\r\n Добавить блокирующий фон, когда сайдпейдж открыт\r\n /\r\n blockBackground?: boolean;\r\n\r\n /\r\n Отключает событие onClose, также дизейблит кнопку закрытия сайдпейджа\r\n /\r\n disableClose?: boolean;\r\n\r\n /\r\n Не закрывать сайдпейдж при клике на фон.\r\n /\r\n ignoreBackgroundClick?: boolean;\r\n\r\n /\r\n Задать ширину сайдпейджа\r\n /\r\n width?: number \| string;\r\n\r\n /\r\n Вызывается, когда пользователь запросил закрытие сайдпейджа (нажал на фон, на\r\n * Escape или на крестик).\r\n /\r\n onClose?: () => void;\r\n\r\n /\r\n Показывать сайдпэйдж слева\r\n \r\n /\r\n fromLeft?: boolean;\r\n\r\n /*\r\n Отключить анимации\r\n \r\n /\r\n disableAnimations?: boolean;\r\n}\r\n\r\nexport interface SidePageState {\r\n stackPosition?: number;\r\n hasMargin?: boolean;\r\n hasShadow?: boolean;\r\n hasBackground?: boolean;\r\n}\r\n\r\nconst TRANSITION_TIMEOUT = 200;\r\n\r\n/*\r\n Сайдпейдж\r\n \r\n Содержит в себе три компоненты: SidePage.Header,\r\n * SidePage.Body и SidePage.Footer\r\n \r\n Для отображения серой плашки в футере в компонент\r\n * Footer необходимо передать пропс panel\r\n /\r\nexport class SidePage extends React.Component<SidePageProps, SidePageState> {\r\n public static __KONTUR_REACT_UI__ = 'SidePage';\r\n\r\n public static Header = SidePageHeader;\r\n public static Body = SidePageBody;\r\n public static Footer = SidePageFooter;\r\n public static Container = SidePageContainer;\r\n public state: SidePageState = {};\r\n private theme!: Theme;\r\n private stackSubscription: ModalStackSubscription \| null = null;\r\n private layoutRef: HTMLElement \| null = null;\r\n private footer: SidePageFooter \| null = null;\r\n\r\n public componentDidMount() {\r\n window.addEventListener('keydown', this.handleKeyDown);\r\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\r\n }\r\n\r\n public componentWillUnmount() {\r\n window.removeEventListener('keydown', this.handleKeyDown);\r\n if (this.stackSubscription != null) {\r\n this.stackSubscription.remove();\r\n }\r\n ModalStack.remove(this);\r\n }\r\n\r\n /\r\n Обновляет разметку компонента.\r\n * @public\r\n */\r\n public updateLayout = (): void => {\r\n if (this.footer) {\r\n this.footer.update();\r\n }\r\n };\r\n\r\n public render(): JSX.Element {\r\n return (\r\n <ThemeContext.Consumer>\r\n {theme => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const { blockBackground, disableAnimations } = this.props;\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <RenderContainer>\r\n <div>\r\n {blockBackground && this.renderShadow()}\r\n <CSSTransition\r\n in\r\n classNames={this.getTransitionNames()}\r\n appear={!disableAnimations}\r\n enter={!disableAnimations}\r\n exit={false}\r\n timeout={{\r\n enter: TRANSITION_TIMEOUT,\r\n exit: TRANSITION_TIMEOUT,\r\n }}\r\n >\r\n {this.renderContainer()}\r\n </CSSTransition>\r\n </div>\r\n </RenderContainer>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private renderContainer(): JSX.Element {\r\n const { width, blockBackground, fromLeft } = this.props;\r\n\r\n return (\r\n <ZIndex\r\n priority={'Sidepage'}\r\n data-tid=\"SidePage__root\"\r\n className={cn({\r\n [jsStyles.root()]: true,\r\n [jsStyles.leftSide(this.theme)]: Boolean(fromLeft),\r\n })}\r\n onScroll={LayoutEvents.emit}\r\n createStackingContext\r\n style={{ width: width \|\| (blockBackground ? 800 : 500) }}\r\n >\r\n <RenderLayer onClickOutside={this.handleClickOutside} active>\r\n <div\r\n data-tid=\"SidePage__container\"\r\n className={cn(jsStyles.wrapper(this.theme), this.state.hasShadow && jsStyles.shadow(this.theme))}\r\n style={this.getSidebarStyle()}\r\n >\r\n <div ref={_ => (this.layoutRef = _)} className={jsStyles.layout()}>\r\n <SidePageContext.Provider value={this.getSidePageContextProps()}>\r\n {this.props.children}\r\n </SidePageContext.Provider>\r\n </div>\r\n </div>\r\n </RenderLayer>\r\n </ZIndex>\r\n );\r\n }\r\n\r\n private getSidePageContextProps = (): SidePageContextType => {\r\n let hasHeader = false;\r\n let hasFooter = false;\r\n let hasPanel = false;\r\n\r\n React.Children.toArray(this.props.children).forEach(child => {\r\n if (isHeader(child)) {\r\n hasHeader = true;\r\n }\r\n if (isFooter(child)) {\r\n hasFooter = true;\r\n if (child.props.panel) {\r\n hasPanel = true;\r\n }\r\n }\r\n });\r\n\r\n const sidePageContextProps: SidePageContextType = {\r\n hasHeader,\r\n hasFooter,\r\n hasPanel,\r\n requestClose: this.requestClose,\r\n getWidth: this.getWidth,\r\n updateLayout: this.updateLayout,\r\n footerRef: this.footerRef,\r\n };\r\n\r\n return sidePageContextProps;\r\n };\r\n\r\n private getWidth = () => {\r\n if (!this.layoutRef) {\r\n return 'auto';\r\n }\r\n return this.layoutRef.getBoundingClientRect().width;\r\n };\r\n\r\n private renderShadow(): JSX.Element {\r\n return (\r\n <ZIndex priority={'Sidepage'} className={jsStyles.overlay()} onScroll={LayoutEvents.emit}>\r\n <HideBodyVerticalScroll key=\"hbvs\" />\r\n <div\r\n key=\"overlay\"\r\n className={cn({\r\n [jsStyles.background()]: true,\r\n [jsStyles.backgroundGray(this.theme)]: this.state.hasBackground,\r\n })}\r\n />\r\n </ZIndex>\r\n );\r\n }\r\n\r\n private getSidebarStyle(): React.CSSProperties {\r\n const sidePageStyle: React.CSSProperties = {};\r\n\r\n if (this.state.hasMargin) {\r\n if (this.props.fromLeft) {\r\n sidePageStyle.marginLeft = 20;\r\n } else {\r\n sidePageStyle.marginRight = 20;\r\n }\r\n }\r\n\r\n return sidePageStyle;\r\n }\r\n\r\n private getTransitionNames(): Record<string, string> {\r\n const transition = this.props.fromLeft ? jsStyles.transitionRight : jsStyles.transitionLeft;\r\n\r\n return {\r\n enter: transition(),\r\n enterActive: jsStyles.transitionActive(),\r\n exit: jsStyles.transitionLeave(),\r\n exitActive: jsStyles.transitionLeaveActive(),\r\n appear: transition(),\r\n appearActive: jsStyles.transitionActive(),\r\n };\r\n }\r\n\r\n private handleStackChange = (stack: ReadonlyArray<React.Component>) => {\r\n const sidePages = stack.filter(x => x instanceof SidePage && x.props.fromLeft === this.props.fromLeft);\r\n const currentSidePagePosition = sidePages.indexOf(this);\r\n\r\n const hasMargin = sidePages.length > 1 && currentSidePagePosition === sidePages.length - 1;\r\n const hasShadow = sidePages.length < 3 \|\| currentSidePagePosition > sidePages.length - 3;\r\n const hasBackground = ModalStack.isBlocking(this);\r\n\r\n this.setState({\r\n stackPosition: stack.indexOf(this),\r\n hasMargin,\r\n hasShadow,\r\n hasBackground,\r\n });\r\n };\r\n\r\n private handleClickOutside = (e: Event) => {\r\n if (this.state.stackPosition === 0 && !this.props.ignoreBackgroundClick) {\r\n // ignore mousedown on window scrollbar\r\n if (e instanceof MouseEvent && e.clientX > document.documentElement.clientWidth) {\r\n return;\r\n }\r\n this.requestClose();\r\n }\r\n };\r\n\r\n private handleKeyDown = (e: KeyboardEvent) => {\r\n if (this.state.stackPosition !== 0) {\r\n return;\r\n }\r\n if (isKeyEscape(e)) {\r\n stopPropagation(e);\r\n this.requestClose();\r\n }\r\n };\r\n\r\n private requestClose = () => {\r\n if (this.props.disableClose) {\r\n return;\r\n }\r\n if (this.props.onClose) {\r\n this.props.onClose();\r\n }\r\n };\r\n\r\n private footerRef = (ref: SidePageFooter \| null) => {\r\n this.footer = ref;\r\n };\r\n}\r\n"]}
1	+ {"version":3,"sources":["SidePage.tsx"],"names":["React","CSSTransition","cn","isKeyEscape","LayoutEvents","stopPropagation","HideBodyVerticalScroll","ModalStack","RenderContainer","RenderLayer","ZIndex","ThemeContext","CommonWrapper","SidePageBody","SidePageContainer","SidePageContext","SidePageFooter","SidePageHeader","jsStyles","isFooter","isHeader","TRANSITION_TIMEOUT","SidePage","state","theme","stackSubscription","layout","footer","header","updateLayout","update","getSidePageContextProps","hasHeader","hasFooter","hasPanel","Children","toArray","props","children","forEach","child","panel","sidePageContextProps","requestClose","getWidth","footerRef","headerRef","getBoundingClientRect","width","handleStackChange","stack","sidePages","filter","x","fromLeft","currentSidePagePosition","indexOf","hasMargin","length","hasShadow","hasBackground","isBlocking","setState","stackPosition","handleClickOutside","e","ignoreBackgroundClick","MouseEvent","clientX","document","documentElement","clientWidth","handleKeyDown","disableClose","onClose","ref","layoutRef","componentDidMount","window","addEventListener","add","componentWillUnmount","removeEventListener","remove","render","renderMain","blockBackground","disableAnimations","renderShadow","getTransitionNames","enter","exit","renderContainer","root","leftSide","Boolean","emit","wrapper","shadow","getSidebarStyle","overlay","background","backgroundGray","sidePageStyle","marginLeft","marginRight","transition","transitionRight","transitionLeft","enterActive","transitionActive","transitionLeave","exitActive","transitionLeaveActive","appear","appearActive","Component","__KONTUR_REACT_UI__","Header","Body","Footer","Container"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport { CSSTransition } from 'react-transition-group';\r\nimport cn from 'classnames';\r\n\r\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { stopPropagation } from '../../lib/events/stopPropagation';\r\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\r\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\r\nimport { RenderContainer } from '../../internal/RenderContainer';\r\nimport { RenderLayer } from '../../internal/RenderLayer';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { SidePageBody } from './SidePageBody';\r\nimport { SidePageContainer } from './SidePageContainer';\r\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\r\nimport { SidePageFooter } from './SidePageFooter';\r\nimport { SidePageHeader } from './SidePageHeader';\r\nimport { jsStyles } from './SidePage.styles';\r\nimport { isFooter, isHeader } from './helpers';\r\n\r\nexport interface SidePageProps extends CommonProps {\r\n /*\r\n Добавить блокирующий фон, когда сайдпейдж открыт\r\n /\r\n blockBackground?: boolean;\r\n\r\n /\r\n Отключает событие onClose, также дизейблит кнопку закрытия сайдпейджа\r\n /\r\n disableClose?: boolean;\r\n\r\n /\r\n Не закрывать сайдпейдж при клике на фон.\r\n /\r\n ignoreBackgroundClick?: boolean;\r\n\r\n /\r\n Задать ширину сайдпейджа\r\n /\r\n width?: number \| string;\r\n\r\n /\r\n Вызывается, когда пользователь запросил закрытие сайдпейджа (нажал на фон, на\r\n * Escape или на крестик).\r\n /\r\n onClose?: () => void;\r\n\r\n /\r\n Показывать сайдпэйдж слева\r\n \r\n /\r\n fromLeft?: boolean;\r\n\r\n /*\r\n Отключить анимации\r\n \r\n /\r\n disableAnimations?: boolean;\r\n}\r\n\r\nexport interface SidePageState {\r\n stackPosition?: number;\r\n hasMargin?: boolean;\r\n hasShadow?: boolean;\r\n hasBackground?: boolean;\r\n}\r\n\r\nconst TRANSITION_TIMEOUT = 200;\r\n\r\n/*\r\n Сайдпейдж\r\n \r\n Содержит в себе три компоненты: SidePage.Header,\r\n * SidePage.Body и SidePage.Footer\r\n \r\n Для отображения серой плашки в футере в компонент\r\n * Footer необходимо передать пропс panel\r\n /\r\nexport class SidePage extends React.Component<SidePageProps, SidePageState> {\r\n public static __KONTUR_REACT_UI__ = 'SidePage';\r\n\r\n public static Header = SidePageHeader;\r\n public static Body = SidePageBody;\r\n public static Footer = SidePageFooter;\r\n public static Container = SidePageContainer;\r\n public state: SidePageState = {};\r\n private theme!: Theme;\r\n private stackSubscription: ModalStackSubscription \| null = null;\r\n private layout: HTMLElement \| null = null;\r\n private footer: SidePageFooter \| null = null;\r\n private header: SidePageHeader \| null = null;\r\n\r\n public componentDidMount() {\r\n window.addEventListener('keydown', this.handleKeyDown);\r\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\r\n }\r\n\r\n public componentWillUnmount() {\r\n window.removeEventListener('keydown', this.handleKeyDown);\r\n if (this.stackSubscription != null) {\r\n this.stackSubscription.remove();\r\n }\r\n ModalStack.remove(this);\r\n }\r\n\r\n /\r\n Обновляет разметку компонента.\r\n * @public\r\n */\r\n public updateLayout = (): void => {\r\n this.header?.update();\r\n this.footer?.update();\r\n };\r\n\r\n public render(): JSX.Element {\r\n return (\r\n <ThemeContext.Consumer>\r\n {(theme) => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const { blockBackground, disableAnimations } = this.props;\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <RenderContainer>\r\n <div>\r\n {blockBackground && this.renderShadow()}\r\n <CSSTransition\r\n in\r\n classNames={this.getTransitionNames()}\r\n appear={!disableAnimations}\r\n enter={!disableAnimations}\r\n exit={false}\r\n timeout={{\r\n enter: TRANSITION_TIMEOUT,\r\n exit: TRANSITION_TIMEOUT,\r\n }}\r\n >\r\n {this.renderContainer()}\r\n </CSSTransition>\r\n </div>\r\n </RenderContainer>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private renderContainer(): JSX.Element {\r\n const { width, blockBackground, fromLeft } = this.props;\r\n\r\n return (\r\n <ZIndex\r\n priority={'Sidepage'}\r\n data-tid=\"SidePage__root\"\r\n className={cn({\r\n [jsStyles.root()]: true,\r\n [jsStyles.leftSide(this.theme)]: Boolean(fromLeft),\r\n })}\r\n onScroll={LayoutEvents.emit}\r\n createStackingContext\r\n style={{ width: width \|\| (blockBackground ? 800 : 500) }}\r\n >\r\n <RenderLayer onClickOutside={this.handleClickOutside} active>\r\n <div\r\n data-tid=\"SidePage__container\"\r\n className={cn(jsStyles.wrapper(this.theme), this.state.hasShadow && jsStyles.shadow(this.theme))}\r\n style={this.getSidebarStyle()}\r\n >\r\n <div ref={this.layoutRef} className={jsStyles.layout()}>\r\n <SidePageContext.Provider value={this.getSidePageContextProps()}>\r\n {this.props.children}\r\n </SidePageContext.Provider>\r\n </div>\r\n </div>\r\n </RenderLayer>\r\n </ZIndex>\r\n );\r\n }\r\n\r\n private getSidePageContextProps = (): SidePageContextType => {\r\n let hasHeader = false;\r\n let hasFooter = false;\r\n let hasPanel = false;\r\n\r\n React.Children.toArray(this.props.children).forEach((child) => {\r\n if (isHeader(child)) {\r\n hasHeader = true;\r\n }\r\n if (isFooter(child)) {\r\n hasFooter = true;\r\n if (child.props.panel) {\r\n hasPanel = true;\r\n }\r\n }\r\n });\r\n\r\n const sidePageContextProps: SidePageContextType = {\r\n hasHeader,\r\n hasFooter,\r\n hasPanel,\r\n requestClose: this.requestClose,\r\n getWidth: this.getWidth,\r\n updateLayout: this.updateLayout,\r\n footerRef: this.footerRef,\r\n headerRef: this.headerRef,\r\n };\r\n\r\n return sidePageContextProps;\r\n };\r\n\r\n private getWidth = () => {\r\n if (!this.layout) {\r\n return 'auto';\r\n }\r\n return this.layout.getBoundingClientRect().width;\r\n };\r\n\r\n private renderShadow(): JSX.Element {\r\n return (\r\n <ZIndex priority={'Sidepage'} className={jsStyles.overlay()} onScroll={LayoutEvents.emit}>\r\n <HideBodyVerticalScroll key=\"hbvs\" />\r\n <div\r\n key=\"overlay\"\r\n className={cn({\r\n [jsStyles.background()]: true,\r\n [jsStyles.backgroundGray(this.theme)]: this.state.hasBackground,\r\n })}\r\n />\r\n </ZIndex>\r\n );\r\n }\r\n\r\n private getSidebarStyle(): React.CSSProperties {\r\n const sidePageStyle: React.CSSProperties = {};\r\n\r\n if (this.state.hasMargin) {\r\n if (this.props.fromLeft) {\r\n sidePageStyle.marginLeft = 20;\r\n } else {\r\n sidePageStyle.marginRight = 20;\r\n }\r\n }\r\n\r\n return sidePageStyle;\r\n }\r\n\r\n private getTransitionNames(): Record<string, string> {\r\n const transition = this.props.fromLeft ? jsStyles.transitionRight : jsStyles.transitionLeft;\r\n\r\n return {\r\n enter: transition(),\r\n enterActive: jsStyles.transitionActive(),\r\n exit: jsStyles.transitionLeave(),\r\n exitActive: jsStyles.transitionLeaveActive(),\r\n appear: transition(),\r\n appearActive: jsStyles.transitionActive(),\r\n };\r\n }\r\n\r\n private handleStackChange = (stack: ReadonlyArray<React.Component>) => {\r\n const sidePages = stack.filter((x) => x instanceof SidePage && x.props.fromLeft === this.props.fromLeft);\r\n const currentSidePagePosition = sidePages.indexOf(this);\r\n\r\n const hasMargin = sidePages.length > 1 && currentSidePagePosition === sidePages.length - 1;\r\n const hasShadow = sidePages.length < 3 \|\| currentSidePagePosition > sidePages.length - 3;\r\n const hasBackground = ModalStack.isBlocking(this);\r\n\r\n this.setState({\r\n stackPosition: stack.indexOf(this),\r\n hasMargin,\r\n hasShadow,\r\n hasBackground,\r\n });\r\n };\r\n\r\n private handleClickOutside = (e: Event) => {\r\n if (this.state.stackPosition === 0 && !this.props.ignoreBackgroundClick) {\r\n // ignore mousedown on window scrollbar\r\n if (e instanceof MouseEvent && e.clientX > document.documentElement.clientWidth) {\r\n return;\r\n }\r\n this.requestClose();\r\n }\r\n };\r\n\r\n private handleKeyDown = (e: KeyboardEvent) => {\r\n if (this.state.stackPosition !== 0) {\r\n return;\r\n }\r\n if (isKeyEscape(e)) {\r\n stopPropagation(e);\r\n this.requestClose();\r\n }\r\n };\r\n\r\n private requestClose = () => {\r\n if (this.props.disableClose) {\r\n return;\r\n }\r\n if (this.props.onClose) {\r\n this.props.onClose();\r\n }\r\n };\r\n\r\n private headerRef = (ref: SidePageHeader \| null) => {\r\n this.header = ref;\r\n };\r\n\r\n private footerRef = (ref: SidePageFooter \| null) => {\r\n this.footer = ref;\r\n };\r\n\r\n private layoutRef = (ref: HTMLDivElement \| null) => {\r\n this.layout = ref;\r\n };\r\n}\r\n"]}

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

@@ -61,8 +61,9 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
     state: SidePageState;
     private theme;
     private stackSubscription;
-    private layoutRef;
+    private layout;
     private footer;
+    private header;
     componentDidMount(): void;
     componentWillUnmount(): void;
     /**
@@ -82,5 +83,7 @@ export declare class SidePage extends React.Component<SidePageProps, SidePageSta
     private handleClickOutside;
     private handleKeyDown;
     private requestClose;
+    private headerRef;
     private footerRef;
+    private layoutRef;
 }

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

@@ -9,6 +9,9 @@ export var SidePageContext = /*#__PURE__*/React.createContext({
   updateLayout: function updateLayout() {
     return undefined;
   },
+  headerRef: function headerRef() {
+    return undefined;
+  },
   footerRef: function footerRef() {
     return undefined;
   }

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageContext.ts"],"names":["React","SidePageContext","createContext","requestClose","undefined","getWidth","updateLayout","footerRef","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB~~;;;;;;;;;;;;;;AAcA~~,OAAO,IAAMC,eAAe,gBAAGD,KAAK,CAACE,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,EAAzC,CAAxB;;;~~AAOPH~~,eAAe,~~CAACO~~,WAAhB,GAA8B,iBAA9B","sourcesContent":["import React from 'react';\r\n\r\nimport { SidePageFooter } from './SidePageFooter';\r\n\r\nexport interface SidePageContextType {\r\n requestClose: () => void;\r\n getWidth: () => number \| string;\r\n updateLayout: () => void;\r\n footerRef: (ref: SidePageFooter \| null) => void;\r\n hasHeader?: boolean;\r\n hasFooter?: boolean;\r\n hasPanel?: boolean;\r\n}\r\n\r\nexport const SidePageContext = React.createContext<SidePageContextType>({\r\n requestClose: () => undefined,\r\n getWidth: () => 'auto',\r\n updateLayout: () => undefined,\r\n footerRef: () => undefined,\r\n});\r\n\r\nSidePageContext.displayName = 'SidePageContext';\r\n"]}
1	+ {"version":3,"sources":["SidePageContext.ts"],"names":["React","SidePageContext","createContext","requestClose","undefined","getWidth","updateLayout","headerRef","footerRef","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;;;;;;;;;;;;;;AAgBA,OAAO,IAAMC,eAAe,gBAAGD,KAAK,CAACE,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;;;AAQPH,eAAe,CAACQ,WAAhB,GAA8B,iBAA9B","sourcesContent":["import React from 'react';\r\n\r\nimport { SidePageHeader } from './SidePageHeader';\r\nimport { SidePageFooter } from './SidePageFooter';\r\n\r\nexport interface SidePageContextType {\r\n requestClose: () => void;\r\n getWidth: () => number \| string;\r\n updateLayout: () => void;\r\n headerRef: (ref: SidePageHeader \| null) => void;\r\n footerRef: (ref: SidePageFooter \| null) => void;\r\n hasHeader?: boolean;\r\n hasFooter?: boolean;\r\n hasPanel?: boolean;\r\n}\r\n\r\nexport const SidePageContext = React.createContext<SidePageContextType>({\r\n requestClose: () => undefined,\r\n getWidth: () => 'auto',\r\n updateLayout: () => undefined,\r\n headerRef: () => undefined,\r\n footerRef: () => undefined,\r\n});\r\n\r\nSidePageContext.displayName = 'SidePageContext';\r\n"]}

package/components/SidePage/SidePageContext.d.ts CHANGED Viewed

@@ -1,9 +1,11 @@
 import React from 'react';
+import { SidePageHeader } from './SidePageHeader';
 import { SidePageFooter } from './SidePageFooter';
 export interface SidePageContextType {
     requestClose: () => void;
     getWidth: () => number | string;
     updateLayout: () => void;
+    headerRef: (ref: SidePageHeader | null) => void;
     footerRef: (ref: SidePageFooter | null) => void;
     hasHeader?: boolean;
     hasFooter?: boolean;

package/components/SidePage/SidePageHeader/SidePageHeader.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
 import cn from 'classnames';
@@ -29,19 +30,29 @@ export var SidePageHeader = /*#__PURE__*/function (_React$Component) {
     _this.state = {
       isReadyToFix: false
     };
+    _this.context = _this.context;
     _this.theme = void 0;
     _this.wrapper = null;
+    _this.sticky = null;
     _this.lastRegularHeight = 0;
     _this.componentDidMount = function () {
       window.addEventListener('scroll', _this.update, true);
+      _this.context.headerRef(_assertThisInitialized(_this));
     };
     _this.componentWillUnmount = function () {
       window.removeEventListener('scroll', _this.update, true);
+      _this.context.headerRef(null);
     };
     _this.update = function () {
+      var _this$sticky;
+      (_this$sticky = _this.sticky) == null ? void 0 : _this$sticky.reflow();
       _this.updateReadyToFix();
     };
@@ -100,6 +111,10 @@ export var SidePageHeader = /*#__PURE__*/function (_React$Component) {
       _this.wrapper = el;
     };
+    _this.stickyRef = function (el) {
+      _this.sticky = el;
+    };
     return _this;
   }
@@ -119,7 +134,8 @@ export var SidePageHeader = /*#__PURE__*/function (_React$Component) {
     return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement("div", {
       ref: this.wrapperRef
     }, isReadyToFix ? /*#__PURE__*/React.createElement(Sticky, {
-      side: "top"
+      side: "top",
+      ref: this.stickyRef
     }, this.renderHeader) : this.renderHeader()));
   };
@@ -148,4 +164,5 @@ export var SidePageHeader = /*#__PURE__*/function (_React$Component) {
   return SidePageHeader;
 }(React.Component);
-SidePageHeader.__KONTUR_REACT_UI__ = 'SidePageHeader';
+SidePageHeader.__KONTUR_REACT_UI__ = 'SidePageHeader';
+SidePageHeader.contextType = SidePageContext;

package/components/SidePage/SidePageHeader/SidePageHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","cn","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","jsStyles","SidePageContext","SidePageHeader","state","isReadyToFix","theme","wrapper","lastRegularHeight","componentDidMount","window","addEventListener","update","componentWillUnmount","removeEventListener","updateReadyToFix","renderHeader","fixed","header","headerFixed","renderClose","title","titleFixed","props","children","renderCloseContent","requestClose","close","closeIcon","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperScrolledUp","getBoundingClientRect","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","render","renderMain","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__"],"mappings":"~~wIAAA~~,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,EAAP,MAAe,YAAf;;AAEA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,SAAT,QAA0B,gCAA1B;AACA,SAASC,UAAT,QAA2B,iBAA3B;AACA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAAsBC,aAAtB,QAA2C,8BAA3C;;AAEA,SAASC,QAAT,QAAyB,mBAAzB;AACA,SAASC,eAAT,~~QAAgC~~,~~mBAAhC~~;;;;;;;;;;AAUA;AACA;AACA;AACA;AACA;AACA,WAAaC,cAAb;;;AAGSC,IAAAA,KAHT,GAGiB;AACbC,MAAAA,YAAY,EAAE,KADD,EAHjB~~;;;AAOUC~~,IAAAA,~~KAPV~~;~~AAQUC~~,IAAAA,~~OARV~~,~~GAQwC~~,~~IARxC~~;~~AASUC~~,IAAAA,~~iBATV~~,~~GAS8B~~,~~CAT9B~~;;;;;;;;;;;;;;;;;;~~AA2BSC~~,IAAAA,~~iBA3BT~~,~~GA2B6B~~,YAAM;AAC/BC,MAAAA,MAAM,CAACC,gBAAP,CAAwB,QAAxB,EAAkC,MAAKC,MAAvC,EAA+C,IAA/C;AACD,~~KA7BH~~;;~~AA+BSC~~,IAAAA,~~oBA/BT~~,~~GA+BgC~~,YAAM;~~AAClCH~~,MAAAA,MAAM,~~CAACI~~,mBAAP,CAA2B,QAA3B,EAAqC,~~MAAKF~~,MAA1C,EAAkD,IAAlD;AACD,~~KAjCH~~;;~~AAmCSA~~,IAAAA,~~MAnCT~~,~~GAmCkB~~,YAAM;AACpB,~~YAAKG~~,gBAAL;AACD,~~KArCH;;;;;;;;;;;;;;;;;;;;;;;;AA6DUC~~,IAAAA,~~YA7DV~~,~~GA6DyB~~,UAACC,KAAD,EAAmB,mBAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACxC;AACE,qCAAK,SAAS,~~EAAEtB~~,EAAE,CAACM,QAAQ,~~CAACiB~~,MAAT,CAAgB,~~MAAKZ~~,KAArB,CAAD,~~iBAAiCL~~,QAAQ,~~CAACkB~~,WAAT,CAAqB,~~MAAKb~~,KAA1B,CAAjC,~~IAAoEW~~,KAApE,OAAlB;AACG,cAAKG,WAAL,EADH;AAEE,qCAAK,SAAS,~~EAAEzB~~,EAAE,CAACM,QAAQ,~~CAACoB~~,KAAT,CAAe,~~MAAKf~~,KAApB,CAAD,~~mBAAgCL~~,QAAQ,~~CAACqB~~,UAAT,EAAhC,IAAwDL,KAAxD,QAAlB;~~AACGnB~~,QAAAA,UAAU,CAAC,~~MAAKyB~~,KAAL,CAAWC,QAAZ,CAAV,GAAkC,MAAKD,KAAL,CAAWC,QAAX,CAAoBP,KAApB,CAAlC,GAA+D,MAAKM,KAAL,CAAWC,QAD7E,CAFF,CADF;;;;AAQD,~~KAtEH~~;;~~AAwEUC~~,IAAAA,~~kBAxEV~~,~~GAwE~~+B,UAACR,KAAD;AAC3B,4BAAC,eAAD,CAAiB,QAAjB;AACG,4CAAGS,YAAH,QAAGA,YAAH;AACC;AACE,cAAA,SAAS,~~EAAE/B~~,EAAE,CAACM,QAAQ,~~CAAC0B~~,KAAT,CAAe,~~MAAKrB~~,KAApB,CAAD;~~AACVL~~,cAAAA,QAAQ,~~CAACgB~~,KAAT,CAAe,~~MAAKX~~,KAApB,CADU,~~IACmBW~~,KADnB,QADf;;AAIE,cAAA,OAAO,EAAES,YAJX;AAKE,0BAAS,iBALX;;AAOE;AACE,cAAA,SAAS,~~EAAE/B~~,EAAE,CAACM,QAAQ,~~CAAC2B~~,SAAT,CAAmB,~~MAAKtB~~,KAAxB,CAAD;~~AACVL~~,cAAAA,QAAQ,~~CAACgB~~,KAAT,CAAe,~~MAAKX~~,KAApB,CADU,~~IACmBW~~,KADnB,QADf;;;AAKE,gCAAC,SAAD,OALF,CAPF,CADD,GADH,CAD2B,~~GAxE~~/B;;;;;;;~~AA8FUG~~,IAAAA,~~WA9FV~~,~~GA8FwB~~,YAAM;AAC1B,UAAMS,YAAY,GAAGC,QAAQ,CAAC,~~MAAKxB~~,KAAL,~~CAAWyB~~,0BAAZ,CAA7B;;AAEA;AACE,4BAAC,MAAD,IAAQ,IAAI,EAAC,KAAb,EAAmB,MAAM,EAAEF,YAA3B;AACG,cAAKJ,kBADR,CADF;;;AAKD,~~KAtGH~~;;~~AAwGUV~~,IAAAA,~~gBAxGV~~,~~GAwG6B~~,YAAM;AAC/B,UAAI,~~MAAKR~~,OAAT,EAAkB;AAChB,~~YAAMyB~~,iBAAiB,GAAG,~~MAAKzB~~,OAAL,~~CAAa0B~~,qBAAb,GAAqCC,GAA/D;AACA,~~YAAM7B~~,YAAY,GAAG,~~MAAK8B~~,aAAL,GAAqBH,iBAArB,IAA0C,MAAKI,iBAApE;AACA,cAAKC,QAAL,CAAc,~~UAAAjC~~,~~KAAK~~,~~UAAKA~~,KAAK,CAACC,YAAN,KAAuBA,YAAvB,GAAsC,EAAEA,YAAY,EAAZA,YAAF,EAAtC,GAAyDD,~~KAA9D~~,~~EAAnB~~;AACD;AACF,~~KA9GH~~;;~~AAgHUkC~~,IAAAA,~~UAhHV~~,~~GAgHuB~~,UAACC,EAAD,EAA4B;AAC/C,~~YAAKhC~~,OAAL,~~GAAegC~~,EAAf;AACD,~~KAlHH~~,~~4DAuCSC~~,~~MAvCT~~,~~GAuCE~~,kBAA6B,mBAC3B,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,~~UAAAlC~~,~~KAAK~~,~~EAAI~~,~~CACR~~,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,~~CAACmC~~,UAAL,EAAP,CACD,CAJH,CADF,CAQD,~~CAhDH~~,~~QAkDUA~~,~~UAlDV~~,~~GAkDE~~,sBAAqB,~~KACXpC~~,YADW,GACM,KAAKD,KADX,CACXC,YADW,CAEnB,oBACE,oBAAC,aAAD,EAAmB,~~KAAKkB~~,KAAxB,eACE,6BAAK,GAAG,EAAE,KAAKe,UAAf,~~IACGjC~~,YAAY,~~gBAAG~~,oBAAC,MAAD,IAAQ,IAAI,EAAC,KAAb,~~IAAoB~~,~~KAAKW~~,~~YAAzB~~,~~CAAH~~,~~GAAqD~~,KAAKA,YAAL,~~EADpE~~,CADF,CADF,~~CAOD~~,~~CA3DH~~,~~2EAWqC~~,~~KACzBX~~,YADyB,GACR,KAAKD,KADG,CACzBC,YADyB,CAEjC,IAAI,CAAC,~~KAAKE~~,OAAV,EAAmB,CACjB,OAAO,CAAP,CACD,CACD,IAAI,~~CAACF~~,YAAL,EAAmB,CACjB,~~KAAKG~~,iBAAL,GAAyB,~~KAAKD~~,OAAL,~~CAAa0B~~,qBAAb,~~GAAqCS~~,MAA9D,CACD,CACD,OAAO,~~KAAKlC~~,iBAAZ,CACD,~~CApBH~~,~~oDAsByC~~,~~KAC7BF~~,KAD6B,GACnB,IADmB,CAC7BA,KAD6B,CAErC,~~OAAOwB~~,QAAQ,~~CAACxB~~,KAAK,~~CAACqC~~,6BAAP,CAAR,~~GAAgDb~~,QAAQ,~~CAACxB~~,KAAK,~~CAACsC~~,2BAAP,CAAR,GAA8C,CAArG,CACD,~~CAzBH~~,~~6BAAoClD~~,KAAK,~~CAACmD~~,SAA1C,~~EAAa1C~~,c,~~CACG2C~~,mB,GAAsB,gB","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { Sticky } from '../Sticky';\r\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './SidePage.styles';\r\nimport { SidePageContext } from './SidePageContext';\r\n\r\nexport interface SidePageHeaderProps extends CommonProps {\r\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\r\n}\r\n\r\nexport interface SidePageHeaderState {\r\n isReadyToFix: boolean;\r\n}\r\n\r\n/*\r\n Шапка сайдпейджа\r\n \r\n @visibleName SidePage.Header\r\n /\r\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\r\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\r\n\r\n public state = {\r\n isReadyToFix: false,\r\n };\r\n\r\n private theme!: Theme;\r\n private wrapper: HTMLElement \| null = null;\r\n private lastRegularHeight = 0;\r\n\r\n public get regularHeight(): number {\r\n const { isReadyToFix } = this.state;\r\n if (!this.wrapper) {\r\n return 0;\r\n }\r\n if (!isReadyToFix) {\r\n this.lastRegularHeight = this.wrapper.getBoundingClientRect().height;\r\n }\r\n return this.lastRegularHeight;\r\n }\r\n\r\n public get fixedHeaderHeight(): number {\r\n const { theme } = this;\r\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) 2;\r\n }\r\n\r\n public componentDidMount = () => {\r\n window.addEventListener('scroll', this.update, true);\r\n };\r\n\r\n public componentWillUnmount = () => {\r\n window.removeEventListener('scroll', this.update, true);\r\n };\r\n\r\n public update = () => {\r\n this.updateReadyToFix();\r\n };\r\n\r\n public render(): JSX.Element {\r\n return (\r\n <ThemeContext.Consumer>\r\n {theme => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const { isReadyToFix } = this.state;\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div ref={this.wrapperRef}>\r\n {isReadyToFix ? <Sticky side=\"top\">{this.renderHeader}</Sticky> : this.renderHeader()}\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private renderHeader = (fixed = false) => {\r\n return (\r\n <div className={cn(jsStyles.header(this.theme), { [jsStyles.headerFixed(this.theme)]: fixed })}>\r\n {this.renderClose()}\r\n <div className={cn(jsStyles.title(this.theme), { [jsStyles.titleFixed()]: fixed })}>\r\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\r\n </div>\r\n </div>\r\n );\r\n };\r\n\r\n private renderCloseContent = (fixed: boolean) => (\r\n <SidePageContext.Consumer>\r\n {({ requestClose }) => (\r\n <a\r\n className={cn(jsStyles.close(this.theme), {\r\n [jsStyles.fixed(this.theme)]: fixed,\r\n })}\r\n onClick={requestClose}\r\n data-tid=\"SidePage__close\"\r\n >\r\n <span\r\n className={cn(jsStyles.closeIcon(this.theme), {\r\n [jsStyles.fixed(this.theme)]: fixed,\r\n })}\r\n >\r\n <CrossIcon />\r\n </span>\r\n </a>\r\n )}\r\n </SidePageContext.Consumer>\r\n );\r\n\r\n private renderClose = () => {\r\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\r\n\r\n return (\r\n <Sticky side=\"top\" offset={stickyOffset}>\r\n {this.renderCloseContent}\r\n </Sticky>\r\n );\r\n };\r\n\r\n private updateReadyToFix = () => {\r\n if (this.wrapper) {\r\n const wrapperScrolledUp = this.wrapper.getBoundingClientRect().top;\r\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\r\n this.setState(state => (state.isReadyToFix !== isReadyToFix ? { isReadyToFix } : state));\r\n }\r\n };\r\n\r\n private wrapperRef = (el: HTMLElement \| null) => {\r\n this.wrapper = el;\r\n };\r\n}\r\n"]}
1	+ {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","cn","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","jsStyles","SidePageContext","SidePageHeader","state","isReadyToFix","context","theme","wrapper","sticky","lastRegularHeight","componentDidMount","window","addEventListener","update","headerRef","componentWillUnmount","removeEventListener","reflow","updateReadyToFix","renderHeader","fixed","header","headerFixed","renderClose","title","titleFixed","props","children","renderCloseContent","requestClose","close","closeIcon","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperScrolledUp","getBoundingClientRect","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","stickyRef","render","renderMain","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { Sticky } from '../Sticky';\r\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './SidePage.styles';\r\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\r\n\r\nexport interface SidePageHeaderProps extends CommonProps {\r\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\r\n}\r\n\r\nexport interface SidePageHeaderState {\r\n isReadyToFix: boolean;\r\n}\r\n\r\n/*\r\n Шапка сайдпейджа\r\n \r\n @visibleName SidePage.Header\r\n /\r\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\r\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\r\n\r\n public state = {\r\n isReadyToFix: false,\r\n };\r\n\r\n public static contextType = SidePageContext;\r\n public context: SidePageContextType = this.context;\r\n\r\n private theme!: Theme;\r\n private wrapper: HTMLElement \| null = null;\r\n private sticky: Sticky \| null = null;\r\n private lastRegularHeight = 0;\r\n\r\n public get regularHeight(): number {\r\n const { isReadyToFix } = this.state;\r\n if (!this.wrapper) {\r\n return 0;\r\n }\r\n if (!isReadyToFix) {\r\n this.lastRegularHeight = this.wrapper.getBoundingClientRect().height;\r\n }\r\n return this.lastRegularHeight;\r\n }\r\n\r\n public get fixedHeaderHeight(): number {\r\n const { theme } = this;\r\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) 2;\r\n }\r\n\r\n public componentDidMount = () => {\r\n window.addEventListener('scroll', this.update, true);\r\n this.context.headerRef(this);\r\n };\r\n\r\n public componentWillUnmount = () => {\r\n window.removeEventListener('scroll', this.update, true);\r\n this.context.headerRef(null);\r\n };\r\n\r\n public update = () => {\r\n this.sticky?.reflow();\r\n this.updateReadyToFix();\r\n };\r\n\r\n public render(): JSX.Element {\r\n return (\r\n <ThemeContext.Consumer>\r\n {(theme) => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const { isReadyToFix } = this.state;\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div ref={this.wrapperRef}>\r\n {isReadyToFix ? (\r\n <Sticky side=\"top\" ref={this.stickyRef}>\r\n {this.renderHeader}\r\n </Sticky>\r\n ) : (\r\n this.renderHeader()\r\n )}\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private renderHeader = (fixed = false) => {\r\n return (\r\n <div className={cn(jsStyles.header(this.theme), { [jsStyles.headerFixed(this.theme)]: fixed })}>\r\n {this.renderClose()}\r\n <div className={cn(jsStyles.title(this.theme), { [jsStyles.titleFixed()]: fixed })}>\r\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\r\n </div>\r\n </div>\r\n );\r\n };\r\n\r\n private renderCloseContent = (fixed: boolean) => (\r\n <SidePageContext.Consumer>\r\n {({ requestClose }) => (\r\n <a\r\n className={cn(jsStyles.close(this.theme), {\r\n [jsStyles.fixed(this.theme)]: fixed,\r\n })}\r\n onClick={requestClose}\r\n data-tid=\"SidePage__close\"\r\n >\r\n <span\r\n className={cn(jsStyles.closeIcon(this.theme), {\r\n [jsStyles.fixed(this.theme)]: fixed,\r\n })}\r\n >\r\n <CrossIcon />\r\n </span>\r\n </a>\r\n )}\r\n </SidePageContext.Consumer>\r\n );\r\n\r\n private renderClose = () => {\r\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\r\n\r\n return (\r\n <Sticky side=\"top\" offset={stickyOffset}>\r\n {this.renderCloseContent}\r\n </Sticky>\r\n );\r\n };\r\n\r\n private updateReadyToFix = () => {\r\n if (this.wrapper) {\r\n const wrapperScrolledUp = this.wrapper.getBoundingClientRect().top;\r\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\r\n this.setState((state) => (state.isReadyToFix !== isReadyToFix ? { isReadyToFix } : state));\r\n }\r\n };\r\n\r\n private wrapperRef = (el: HTMLElement \| null) => {\r\n this.wrapper = el;\r\n };\r\n\r\n private stickyRef = (el: Sticky \| null) => {\r\n this.sticky = el;\r\n };\r\n}\r\n"]}

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

@@ -1,5 +1,6 @@
 import React from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
+import { SidePageContextType } from './SidePageContext';
 export interface SidePageHeaderProps extends CommonProps {
     children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);
 }
@@ -16,8 +17,11 @@ export declare class SidePageHeader extends React.Component<SidePageHeaderProps,
     state: {
         isReadyToFix: boolean;
     };
+    static contextType: React.Context<SidePageContextType>;
+    context: SidePageContextType;
     private theme;
     private wrapper;
+    private sticky;
     private lastRegularHeight;
     get regularHeight(): number;
     get fixedHeaderHeight(): number;
@@ -31,4 +35,5 @@ export declare class SidePageHeader extends React.Component<SidePageHeaderProps,
     private renderClose;
     private updateReadyToFix;
     private wrapperRef;
+    private stickyRef;
 }

package/components/Sticky/Sticky/Sticky.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","cn","LayoutEvents","isFunction","ZIndex","CommonWrapper","jsStyles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","wrapper","inner","layoutSubscription","remove","reflowCounter","refWrapper","ref","refInner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","getBoundingClientRect","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport shallowEqual from 'shallowequal';\r\nimport cn from 'classnames';\r\n\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './Sticky.styles';\r\n\r\nconst MAX_REFLOW_RETRIES = 5;\r\n\r\nexport interface StickyProps extends CommonProps {\r\n side: 'top' \| 'bottom';\r\n /*\r\n Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\r\n * @default 0\r\n /\r\n offset: number;\r\n getStop?: () => Nullable<HTMLElement>;\r\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\r\n}\r\n\r\nexport interface StickyState {\r\n fixed: boolean;\r\n deltaHeight: number;\r\n height?: number;\r\n width?: number;\r\n left?: number;\r\n stopped: boolean;\r\n relativeTop: number;\r\n}\r\n\r\nexport class Sticky extends React.Component<StickyProps, StickyState> {\r\n public static __KONTUR_REACT_UI__ = 'Sticky';\r\n\r\n public static propTypes = {\r\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n /\r\n Функция, которая возвращает DOM-элемент, который нельзя пересекать.\r\n /\r\n getStop: PropTypes.func,\r\n\r\n /\r\n Отступ от границы в пикселях\r\n */\r\n offset: PropTypes.number,\r\n\r\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\r\n };\r\n\r\n public static defaultProps = { offset: 0 };\r\n\r\n public state: StickyState = {\r\n fixed: false,\r\n deltaHeight: 0,\r\n stopped: false,\r\n relativeTop: 0,\r\n };\r\n\r\n private wrapper: Nullable<HTMLElement>;\r\n private inner: Nullable<HTMLElement>;\r\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\r\n private reflowCounter = 0;\r\n\r\n public componentDidMount() {\r\n this.reflow();\r\n\r\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\r\n }\r\n\r\n public componentWillUnmount() {\r\n if (this.layoutSubscription.remove) {\r\n this.layoutSubscription.remove();\r\n }\r\n }\r\n\r\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\r\n if (!shallowEqual(prevProps, this.props) \|\| !shallowEqual(prevState, this.state)) {\r\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\r\n LayoutEvents.emit();\r\n this.reflowCounter += 1;\r\n return;\r\n }\r\n }\r\n this.reflowCounter = 0;\r\n }\r\n\r\n public render() {\r\n let { children } = this.props;\r\n const { side, offset } = this.props;\r\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\r\n const innerStyle: React.CSSProperties = {};\r\n\r\n if (fixed) {\r\n if (stopped) {\r\n innerStyle.top = relativeTop;\r\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\r\n } else {\r\n innerStyle.width = width;\r\n innerStyle[side] = offset;\r\n innerStyle.left = left;\r\n }\r\n }\r\n\r\n if (isFunction(children)) {\r\n children = children(fixed);\r\n }\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div ref={this.refWrapper} className={jsStyles.wrapper()}>\r\n <ZIndex\r\n priority=\"Sticky\"\r\n applyZIndex={fixed}\r\n className={cn(jsStyles.inner(), {\r\n [jsStyles.fixed()]: fixed && !stopped,\r\n [jsStyles.stopped()]: stopped,\r\n })}\r\n style={innerStyle}\r\n wrapperRef={this.refInner}\r\n >\r\n <div className={jsStyles.container()}>{children}</div>\r\n </ZIndex>\r\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\r\n\r\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\r\n\r\n private reflow = () => {\r\n const { documentElement } = document;\r\n\r\n if (!documentElement) {\r\n throw Error('There is no \"documentElement\" in document');\r\n }\r\n\r\n const windowHeight = window.innerHeight \|\| documentElement.clientHeight;\r\n if (!this.wrapper \|\| !this.inner) {\r\n return;\r\n }\r\n const { top, bottom, left } = this.wrapper.getBoundingClientRect();\r\n const { width, height } = this.inner.getBoundingClientRect();\r\n const { offset, getStop, side } = this.props;\r\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\r\n const fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;\r\n\r\n this.setState({ fixed, left });\r\n\r\n if (fixed && !prevFixed) {\r\n this.setState({ width, height });\r\n }\r\n\r\n if (fixed) {\r\n const stop = getStop && getStop();\r\n if (stop) {\r\n const deltaHeight = prevHeight - height;\r\n const stopRect = stop.getBoundingClientRect();\r\n const outerHeight = height + offset;\r\n let stopped = false;\r\n let relativeTop = 0;\r\n\r\n if (side === 'top') {\r\n stopped = stopRect.top - outerHeight < 0;\r\n relativeTop = stopRect.top - prevHeight - top;\r\n } else {\r\n stopped = stopRect.bottom + outerHeight > windowHeight;\r\n relativeTop = stopRect.bottom - top;\r\n }\r\n\r\n this.setState({ relativeTop, deltaHeight, stopped });\r\n }\r\n }\r\n };\r\n}\r\n"]}
1	+ {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","cn","LayoutEvents","isFunction","ZIndex","CommonWrapper","jsStyles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","wrapper","inner","layoutSubscription","remove","reflowCounter","refWrapper","ref","refInner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","getBoundingClientRect","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport shallowEqual from 'shallowequal';\r\nimport cn from 'classnames';\r\n\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './Sticky.styles';\r\n\r\nconst MAX_REFLOW_RETRIES = 5;\r\n\r\nexport interface StickyProps extends CommonProps {\r\n side: 'top' \| 'bottom';\r\n /*\r\n Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\r\n * @default 0\r\n /\r\n offset: number;\r\n getStop?: () => Nullable<HTMLElement>;\r\n children?: React.ReactNode \| ((fixed: boolean) => React.ReactNode);\r\n}\r\n\r\nexport interface StickyState {\r\n fixed: boolean;\r\n deltaHeight: number;\r\n height?: number;\r\n width?: number;\r\n left?: number;\r\n stopped: boolean;\r\n relativeTop: number;\r\n}\r\n\r\nexport class Sticky extends React.Component<StickyProps, StickyState> {\r\n public static __KONTUR_REACT_UI__ = 'Sticky';\r\n\r\n public static propTypes = {\r\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n /\r\n Функция, которая возвращает DOM-элемент, который нельзя пересекать.\r\n /\r\n getStop: PropTypes.func,\r\n\r\n /\r\n Отступ от границы в пикселях\r\n /\r\n offset: PropTypes.number,\r\n\r\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\r\n };\r\n\r\n public static defaultProps = { offset: 0 };\r\n\r\n public state: StickyState = {\r\n fixed: false,\r\n deltaHeight: 0,\r\n stopped: false,\r\n relativeTop: 0,\r\n };\r\n\r\n private wrapper: Nullable<HTMLElement>;\r\n private inner: Nullable<HTMLElement>;\r\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\r\n private reflowCounter = 0;\r\n\r\n public componentDidMount() {\r\n this.reflow();\r\n\r\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\r\n }\r\n\r\n public componentWillUnmount() {\r\n if (this.layoutSubscription.remove) {\r\n this.layoutSubscription.remove();\r\n }\r\n }\r\n\r\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\r\n if (!shallowEqual(prevProps, this.props) \|\| !shallowEqual(prevState, this.state)) {\r\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\r\n LayoutEvents.emit();\r\n this.reflowCounter += 1;\r\n return;\r\n }\r\n }\r\n this.reflowCounter = 0;\r\n }\r\n\r\n public render() {\r\n let { children } = this.props;\r\n const { side, offset } = this.props;\r\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\r\n const innerStyle: React.CSSProperties = {};\r\n\r\n if (fixed) {\r\n if (stopped) {\r\n innerStyle.top = relativeTop;\r\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\r\n } else {\r\n innerStyle.width = width;\r\n innerStyle[side] = offset;\r\n innerStyle.left = left;\r\n }\r\n }\r\n\r\n if (isFunction(children)) {\r\n children = children(fixed);\r\n }\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div ref={this.refWrapper} className={jsStyles.wrapper()}>\r\n <ZIndex\r\n priority=\"Sticky\"\r\n applyZIndex={fixed}\r\n className={cn(jsStyles.inner(), {\r\n [jsStyles.fixed()]: fixed && !stopped,\r\n [jsStyles.stopped()]: stopped,\r\n })}\r\n style={innerStyle}\r\n wrapperRef={this.refInner}\r\n >\r\n <div className={jsStyles.container()}>{children}</div>\r\n </ZIndex>\r\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\r\n\r\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\r\n\r\n /\r\n Пересчитать габариты и позицию залипшего элемента\r\n \r\n @public\r\n */\r\n public reflow = () => {\r\n const { documentElement } = document;\r\n\r\n if (!documentElement) {\r\n throw Error('There is no \"documentElement\" in document');\r\n }\r\n\r\n const windowHeight = window.innerHeight \|\| documentElement.clientHeight;\r\n if (!this.wrapper \|\| !this.inner) {\r\n return;\r\n }\r\n const { top, bottom, left } = this.wrapper.getBoundingClientRect();\r\n const { width, height } = this.inner.getBoundingClientRect();\r\n const { offset, getStop, side } = this.props;\r\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\r\n const fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;\r\n\r\n this.setState({ fixed, left });\r\n\r\n if (fixed && !prevFixed) {\r\n this.setState({ width, height });\r\n }\r\n\r\n if (fixed) {\r\n const stop = getStop && getStop();\r\n if (stop) {\r\n const deltaHeight = prevHeight - height;\r\n const stopRect = stop.getBoundingClientRect();\r\n const outerHeight = height + offset;\r\n let stopped = false;\r\n let relativeTop = 0;\r\n\r\n if (side === 'top') {\r\n stopped = stopRect.top - outerHeight < 0;\r\n relativeTop = stopRect.top - prevHeight - top;\r\n } else {\r\n stopped = stopRect.bottom + outerHeight > windowHeight;\r\n relativeTop = stopRect.bottom - top;\r\n }\r\n\r\n this.setState({ relativeTop, deltaHeight, stopped });\r\n }\r\n }\r\n };\r\n}\r\n"]}

package/components/Sticky/Sticky.d.ts CHANGED Viewed

@@ -49,5 +49,10 @@ export declare class Sticky extends React.Component<StickyProps, StickyState> {
     render(): JSX.Element;
     private refWrapper;
     private refInner;
-    private reflow;
+    /**
+     * Пересчитать габариты и позицию залипшего элемента
+     *
+     * @public
+     */
+    reflow: () => void;
 }

package/components/TokenInput/TokenInput/TokenInput.js CHANGED Viewed

@@ -181,13 +181,16 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
       }
       if (isBlurToMenu || _this.state.preventBlur) {
-        event.preventDefault(); // первый focus нужен для предотвращения/уменьшения моргания в других браузерах
+        var _this$input;
-        _this.input.focus(); // в firefox не работает без второго focus
+        event.preventDefault(); // первый focus нужен для предотвращения/уменьшения моргания в других браузерах
+        (_this$input = _this.input) == null ? void 0 : _this$input.focus(); // в firefox не работает без второго focus
         process.nextTick(function () {
-          return _this.input.focus();
+          var _this$input2;
+          return (_this$input2 = _this.input) == null ? void 0 : _this$input2.focus();
         });
         _this.dispatch({
@@ -252,14 +255,15 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
     };
     _this.handleWrapperMouseDown = function (event) {
+      var _this$wrapper;
       _this.dispatch({
         type: 'SET_PREVENT_BLUR',
         payload: true
       });
       var target = event.target;
-      var isClickOnToken = target && _this.wrapper.contains(target) && target !== _this.wrapper && target !== _this.input;
+      var isClickOnToken = target && ((_this$wrapper = _this.wrapper) == null ? void 0 : _this$wrapper.contains(target)) && target !== _this.wrapper && target !== _this.input;
       if (!isClickOnToken) {
         _this.dispatch({
@@ -427,6 +431,8 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
     };
     _this.handleInputKeyDown = function (e) {
+      var _this$input3, _this$input4;
       e.stopPropagation();
       if (_this.type !== TokenInputType.WithReference && _this.props.delimiters.includes(e.key)) {
@@ -467,8 +473,7 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
           break;
         case isKeyEscape(e):
-          _this.input.blur();
+          (_this$input3 = _this.input) == null ? void 0 : _this$input3.blur();
           break;
         case isKeyBackspace(e):
@@ -476,7 +481,7 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
           break;
         case isKeyArrowLeft(e):
-          if (_this.input.selectionStart === 0) {
+          if (((_this$input4 = _this.input) == null ? void 0 : _this$input4.selectionStart) === 0) {
             _this.moveFocusToLastToken();
           }
@@ -486,7 +491,9 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
     _this.focusInput = function () {
       process.nextTick(function () {
-        return _this.input.focus();
+        var _this$input5;
+        return (_this$input5 = _this.input) == null ? void 0 : _this$input5.focus();
       });
     };
@@ -497,6 +504,8 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
     };
     _this.handleWrapperKeyDown = function (e) {
+      var _this$wrapper2;
       switch (true) {
         case isKeyBackspace(e):
         case isKeyDelete(e):
@@ -511,9 +520,10 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
               _this.dispatch({
                 type: 'REMOVE_ALL_ACTIVE_TOKENS'
               }, function () {
-                LayoutEvents.emit();
+                var _this$input6;
-                _this.input.focus();
+                LayoutEvents.emit();
+                (_this$input6 = _this.input) == null ? void 0 : _this$input6.focus();
               });
             }
@@ -526,8 +536,7 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
           break;
         case isKeyEscape(e):
-          _this.wrapper.blur();
+          (_this$wrapper2 = _this.wrapper) == null ? void 0 : _this$wrapper2.blur();
           break;
         case isKeyEnter(e):
@@ -573,7 +582,9 @@ export var TokenInput = (_dec = locale('TokenInput', TokenInputLocaleHelper), _d
         _this.dispatch({
           type: 'REMOVE_ALL_ACTIVE_TOKENS'
         }, function () {
-          return _this.input.focus();
+          var _this$input7;
+          return (_this$input7 = _this.input) == null ? void 0 : _this$input7.focus();
         });
       } else if (!isLeftEdge) {
         _this.dispatch({