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

@skbkontur/react-ui 2.17.7 → 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 (29) hide show

package/components/ScrollContainer/ScrollContainer/ScrollContainer.js CHANGED Viewed

@@ -327,11 +327,17 @@ export var ScrollContainer = /*#__PURE__*/function (_React$Component) {
   _proto.getImmediateScrollState = function getImmediateScrollState() {
     if (!this.inner || this.inner.scrollTop === 0) {
       return 'top';
-    } else if (this.inner.scrollTop === this.inner.scrollHeight - this.inner.clientHeight) {
+    } // Zoom in Chrome causes problems
+    // https://github.com/skbkontur/retail-ui/pull/2705
+    var maxScrollPos = this.inner.scrollHeight - this.inner.clientHeight;
+    if (Math.abs(maxScrollPos - this.inner.scrollTop) <= 1) {
       return 'bottom';
-    } else {
-      return 'scroll';
     }
+    return 'scroll';
   };
   return ScrollContainer;

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["ScrollContainer.tsx"],"names":["React","PropTypes","cn","LayoutEvents","getScrollWidth","CommonWrapper","jsStyles","HIDE_SCROLLBAR_OFFSET","MIN_SCROLL_SIZE","ScrollContainer","state","scrollActive","scrollSize","scrollPos","hover","scrolling","scrollState","inner","scroll","refInner","element","props","preventWindowScroll","addEventListener","handleInnerScrollWheel","passive","removeEventListener","refScroll","handleScrollWheel","handleNativeScroll","event","reflow","onScroll","preventDefault","emit","containerHeight","offsetHeight","contentHeight","scrollHeight","scrollTop","Math","max","getImmediateScrollState","onScrollStateChange","setState","handleScrollMouseDown","target","window","document","initialY","clientY","initialScrollTop","mouseMove","mouseMoveEvent","ratio","deltaY","Object","prototype","hasOwnProperty","call","returnValue","mouseUp","WheelEvent","handleMouseMove","right","currentTarget","getBoundingClientRect","pageX","setHover","handleMouseLeave","componentDidMount","componentDidUpdate","prevProps","render","scrollClass","scrollInvert","Boolean","invert","scrollHover","scrollStyle","top","height","innerStyle","marginRight","paddingRight","maxHeight","scrollBehavior","scrollBehaviour","root","children","scrollTo","maxScroll","offsetTop","minScroll","scrollToTop","scrollToBottom","clientHeight","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","string","number","oneOf","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport cn from 'classnames';\r\n\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './ScrollContainer.styles';\r\n\r\nconst HIDE_SCROLLBAR_OFFSET = 30;\r\nconst MIN_SCROLL_SIZE = 20;\r\n\r\nexport type ScrollContainerScrollState = 'top' \| 'scroll' \| 'bottom';\r\n\r\nexport type ScrollBehaviour = 'auto' \| 'smooth';\r\n\r\nexport interface ScrollContainerProps extends CommonProps {\r\n invert?: boolean;\r\n maxHeight?: React.CSSProperties['maxHeight'];\r\n preventWindowScroll?: boolean;\r\n /*\r\n Поведение скролла (https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior)\r\n * @default 'auto'\r\n /\r\n scrollBehaviour?: ScrollBehaviour;\r\n onScrollStateChange?: (scrollState: ScrollContainerScrollState) => void;\r\n onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;\r\n}\r\n\r\nexport interface ScrollContainerState {\r\n scrollActive: boolean;\r\n hover: boolean;\r\n scrolling: boolean;\r\n scrollSize: number;\r\n scrollPos: number;\r\n scrollState: ScrollContainerScrollState;\r\n}\r\n\r\nexport class ScrollContainer extends React.Component<ScrollContainerProps, ScrollContainerState> {\r\n public static __KONTUR_REACT_UI__ = 'ScrollContainer';\r\n\r\n public static propTypes = {\r\n invert: PropTypes.bool,\r\n maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n scrollBehaviour: PropTypes.oneOf(['auto', 'smooth']),\r\n preventWindowScroll: PropTypes.bool,\r\n onScrollStateChange: PropTypes.func,\r\n };\r\n\r\n public static defaultProps = {\r\n scrollBehaviour: 'auto',\r\n };\r\n\r\n public state: ScrollContainerState = {\r\n scrollActive: false,\r\n scrollSize: 0,\r\n scrollPos: 0,\r\n\r\n // Mouse is moving where big scrollbar can be located.\r\n hover: false,\r\n // True when scroll is following mouse (mouse down on scroll).\r\n scrolling: false,\r\n scrollState: 'top',\r\n };\r\n\r\n private inner: Nullable<HTMLElement>;\r\n private scroll: Nullable<HTMLElement>;\r\n\r\n public componentDidMount() {\r\n this.reflow();\r\n }\r\n\r\n public componentDidUpdate(prevProps: ScrollContainerProps) {\r\n if (this.inner) {\r\n if (prevProps.preventWindowScroll && !this.props.preventWindowScroll) {\r\n this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\r\n }\r\n if (!prevProps.preventWindowScroll && this.props.preventWindowScroll) {\r\n this.inner.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\r\n }\r\n }\r\n this.reflow();\r\n }\r\n\r\n public render() {\r\n const state = this.state;\r\n const props = this.props;\r\n let scroll = null;\r\n\r\n if (state.scrollActive) {\r\n const scrollClass = cn({\r\n [jsStyles.scroll()]: true,\r\n [jsStyles.scrollInvert()]: Boolean(props.invert),\r\n [jsStyles.scrollHover()]: state.hover \|\| state.scrolling,\r\n });\r\n const scrollStyle = {\r\n top: state.scrollPos,\r\n height: state.scrollSize,\r\n };\r\n scroll = (\r\n <div\r\n ref={this.refScroll}\r\n className={scrollClass}\r\n style={scrollStyle}\r\n onMouseDown={this.handleScrollMouseDown}\r\n />\r\n );\r\n }\r\n\r\n const innerStyle: React.CSSProperties = {\r\n // hide vertical scrollbar with a little extra space\r\n marginRight: -1 HIDE_SCROLLBAR_OFFSET,\r\n paddingRight: HIDE_SCROLLBAR_OFFSET - getScrollWidth(),\r\n\r\n maxHeight: props.maxHeight,\r\n scrollBehavior: props.scrollBehaviour,\r\n };\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div className={jsStyles.root()} onMouseMove={this.handleMouseMove} onMouseLeave={this.handleMouseLeave}>\r\n {scroll}\r\n <div\r\n data-tid=\"ScrollContainer__inner\"\r\n className={jsStyles.inner()}\r\n style={innerStyle}\r\n ref={this.refInner}\r\n onScroll={this.handleNativeScroll}\r\n >\r\n {props.children}\r\n </div>\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n /*\r\n @public\r\n /\r\n public scrollTo(element: HTMLElement) {\r\n if (!element \|\| !this.inner) {\r\n return;\r\n }\r\n const maxScroll = element.offsetTop;\r\n if (this.inner.scrollTop > maxScroll) {\r\n this.inner.scrollTop = maxScroll;\r\n return;\r\n }\r\n\r\n const minScroll = element.offsetTop + element.scrollHeight - this.inner.offsetHeight;\r\n if (this.inner.scrollTop < minScroll) {\r\n this.inner.scrollTop = minScroll;\r\n }\r\n }\r\n\r\n /\r\n @public\r\n /\r\n public scrollToTop() {\r\n if (!this.inner) {\r\n return;\r\n }\r\n this.inner.scrollTop = 0;\r\n }\r\n\r\n /\r\n @public\r\n /\r\n public scrollToBottom() {\r\n if (!this.inner) {\r\n return;\r\n }\r\n this.inner.scrollTop = this.inner.scrollHeight - this.inner.offsetHeight;\r\n }\r\n\r\n private refInner = (element: HTMLElement \| null) => {\r\n if (!this.inner && element && this.props.preventWindowScroll) {\r\n element.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\r\n }\r\n if (this.inner && !element) {\r\n this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\r\n }\r\n this.inner = element;\r\n };\r\n\r\n private refScroll = (element: HTMLElement \| null) => {\r\n if (!this.scroll && element) {\r\n element.addEventListener('wheel', this.handleScrollWheel, { passive: false });\r\n }\r\n if (this.scroll && !element) {\r\n this.scroll.removeEventListener('wheel', this.handleScrollWheel);\r\n }\r\n this.scroll = element;\r\n };\r\n\r\n private handleNativeScroll = (event: React.UIEvent<HTMLDivElement>) => {\r\n this.reflow();\r\n this.props.onScroll?.(event);\r\n if (this.props.preventWindowScroll) {\r\n event.preventDefault();\r\n return;\r\n }\r\n LayoutEvents.emit();\r\n };\r\n\r\n private reflow = () => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const containerHeight = this.inner.offsetHeight;\r\n const contentHeight = this.inner.scrollHeight;\r\n const scrollTop = this.inner.scrollTop;\r\n\r\n const scrollActive = containerHeight < contentHeight;\r\n\r\n if (!scrollActive && !this.state.scrollActive) {\r\n return;\r\n }\r\n\r\n let scrollSize = 0;\r\n let scrollPos = 0;\r\n let scrollState = this.state.scrollState;\r\n\r\n if (scrollActive) {\r\n scrollSize = Math.max((containerHeight / contentHeight) containerHeight, MIN_SCROLL_SIZE);\r\n scrollPos = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - scrollSize);\r\n }\r\n\r\n if (\r\n this.state.scrollActive !== scrollActive \|\|\r\n this.state.scrollSize !== scrollSize \|\|\r\n this.state.scrollPos !== scrollPos\r\n ) {\r\n scrollState = this.getImmediateScrollState();\r\n\r\n if (scrollState !== this.state.scrollState) {\r\n this.props.onScrollStateChange?.(scrollState);\r\n }\r\n\r\n this.setState({\r\n scrollActive,\r\n scrollSize,\r\n scrollPos,\r\n scrollState,\r\n });\r\n }\r\n };\r\n\r\n private handleScrollMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const target: Document = window.document;\r\n const initialY = event.clientY;\r\n const initialScrollTop = this.inner.scrollTop;\r\n\r\n const mouseMove = (mouseMoveEvent: MouseEvent) => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const ratio =\r\n (this.inner.scrollHeight - this.inner.offsetHeight) / (this.inner.offsetHeight - this.state.scrollSize);\r\n const deltaY = (mouseMoveEvent.clientY - initialY) * ratio;\r\n\r\n this.inner.scrollTop = initialScrollTop + deltaY;\r\n\r\n if (mouseMoveEvent.preventDefault) {\r\n mouseMoveEvent.preventDefault();\r\n }\r\n\r\n if (Object.prototype.hasOwnProperty.call(mouseMoveEvent, 'returnValue')) {\r\n (mouseMoveEvent as MouseEvent & {\r\n returnValue: boolean;\r\n }).returnValue = false;\r\n }\r\n };\r\n\r\n const mouseUp = () => {\r\n target.removeEventListener('mousemove', mouseMove);\r\n target.removeEventListener('mouseup', mouseUp);\r\n this.setState({ scrolling: false });\r\n };\r\n\r\n target.addEventListener('mousemove', mouseMove);\r\n target.addEventListener('mouseup', mouseUp);\r\n this.setState({ scrolling: true });\r\n\r\n event.preventDefault();\r\n };\r\n\r\n private handleScrollWheel = (event: Event) => {\r\n if (!this.inner \|\| !(event instanceof WheelEvent)) {\r\n return;\r\n }\r\n\r\n if (event.deltaY > 0 && this.inner.scrollHeight <= this.inner.scrollTop + this.inner.offsetHeight) {\r\n return;\r\n }\r\n if (event.deltaY < 0 && this.inner.scrollTop <= 0) {\r\n return;\r\n }\r\n\r\n this.inner.scrollTop += event.deltaY;\r\n event.preventDefault();\r\n };\r\n\r\n private handleInnerScrollWheel = (event: Event) => {\r\n if (!this.inner \|\| !(event instanceof WheelEvent)) {\r\n return;\r\n }\r\n\r\n if (this.state.scrollActive) {\r\n if (event.deltaY > 0 && this.inner.scrollHeight <= this.inner.scrollTop + this.inner.offsetHeight) {\r\n event.preventDefault();\r\n return false;\r\n }\r\n if (event.deltaY < 0 && this.inner.scrollTop <= 0) {\r\n event.preventDefault();\r\n return false;\r\n }\r\n }\r\n };\r\n\r\n private handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\r\n const right = event.currentTarget.getBoundingClientRect().right - event.pageX;\r\n this.setHover(right <= 12);\r\n };\r\n\r\n private handleMouseLeave = () => {\r\n this.setHover(false);\r\n };\r\n\r\n private setHover(hover: boolean) {\r\n if (this.state.hover !== hover) {\r\n this.setState({ hover });\r\n }\r\n }\r\n\r\n private getImmediateScrollState(): ScrollContainerScrollState {\r\n if (!this.inner \|\| this.inner.scrollTop === 0) {\r\n return 'top';\r\n } else if (this.inner.scrollTop === this.inner.scrollHeight - this.inner.clientHeight) {\r\n return 'bottom';\r\n } else {\r\n return 'scroll';\r\n }\r\n }\r\n}\r\n"]}
1	+ {"version":3,"sources":["ScrollContainer.tsx"],"names":["React","PropTypes","cn","LayoutEvents","getScrollWidth","CommonWrapper","jsStyles","HIDE_SCROLLBAR_OFFSET","MIN_SCROLL_SIZE","ScrollContainer","state","scrollActive","scrollSize","scrollPos","hover","scrolling","scrollState","inner","scroll","refInner","element","props","preventWindowScroll","addEventListener","handleInnerScrollWheel","passive","removeEventListener","refScroll","handleScrollWheel","handleNativeScroll","event","reflow","onScroll","preventDefault","emit","containerHeight","offsetHeight","contentHeight","scrollHeight","scrollTop","Math","max","getImmediateScrollState","onScrollStateChange","setState","handleScrollMouseDown","target","window","document","initialY","clientY","initialScrollTop","mouseMove","mouseMoveEvent","ratio","deltaY","Object","prototype","hasOwnProperty","call","returnValue","mouseUp","WheelEvent","handleMouseMove","right","currentTarget","getBoundingClientRect","pageX","setHover","handleMouseLeave","componentDidMount","componentDidUpdate","prevProps","render","scrollClass","scrollInvert","Boolean","invert","scrollHover","scrollStyle","top","height","innerStyle","marginRight","paddingRight","maxHeight","scrollBehavior","scrollBehaviour","root","children","scrollTo","maxScroll","offsetTop","minScroll","scrollToTop","scrollToBottom","maxScrollPos","clientHeight","abs","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","string","number","oneOf","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport cn from 'classnames';\r\n\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './ScrollContainer.styles';\r\n\r\nconst HIDE_SCROLLBAR_OFFSET = 30;\r\nconst MIN_SCROLL_SIZE = 20;\r\n\r\nexport type ScrollContainerScrollState = 'top' \| 'scroll' \| 'bottom';\r\n\r\nexport type ScrollBehaviour = 'auto' \| 'smooth';\r\n\r\nexport interface ScrollContainerProps extends CommonProps {\r\n invert?: boolean;\r\n maxHeight?: React.CSSProperties['maxHeight'];\r\n preventWindowScroll?: boolean;\r\n /*\r\n Поведение скролла (https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior)\r\n * @default 'auto'\r\n /\r\n scrollBehaviour?: ScrollBehaviour;\r\n onScrollStateChange?: (scrollState: ScrollContainerScrollState) => void;\r\n onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;\r\n}\r\n\r\nexport interface ScrollContainerState {\r\n scrollActive: boolean;\r\n hover: boolean;\r\n scrolling: boolean;\r\n scrollSize: number;\r\n scrollPos: number;\r\n scrollState: ScrollContainerScrollState;\r\n}\r\n\r\nexport class ScrollContainer extends React.Component<ScrollContainerProps, ScrollContainerState> {\r\n public static __KONTUR_REACT_UI__ = 'ScrollContainer';\r\n\r\n public static propTypes = {\r\n invert: PropTypes.bool,\r\n maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n scrollBehaviour: PropTypes.oneOf(['auto', 'smooth']),\r\n preventWindowScroll: PropTypes.bool,\r\n onScrollStateChange: PropTypes.func,\r\n };\r\n\r\n public static defaultProps = {\r\n scrollBehaviour: 'auto',\r\n };\r\n\r\n public state: ScrollContainerState = {\r\n scrollActive: false,\r\n scrollSize: 0,\r\n scrollPos: 0,\r\n\r\n // Mouse is moving where big scrollbar can be located.\r\n hover: false,\r\n // True when scroll is following mouse (mouse down on scroll).\r\n scrolling: false,\r\n scrollState: 'top',\r\n };\r\n\r\n private inner: Nullable<HTMLElement>;\r\n private scroll: Nullable<HTMLElement>;\r\n\r\n public componentDidMount() {\r\n this.reflow();\r\n }\r\n\r\n public componentDidUpdate(prevProps: ScrollContainerProps) {\r\n if (this.inner) {\r\n if (prevProps.preventWindowScroll && !this.props.preventWindowScroll) {\r\n this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\r\n }\r\n if (!prevProps.preventWindowScroll && this.props.preventWindowScroll) {\r\n this.inner.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\r\n }\r\n }\r\n this.reflow();\r\n }\r\n\r\n public render() {\r\n const state = this.state;\r\n const props = this.props;\r\n let scroll = null;\r\n\r\n if (state.scrollActive) {\r\n const scrollClass = cn({\r\n [jsStyles.scroll()]: true,\r\n [jsStyles.scrollInvert()]: Boolean(props.invert),\r\n [jsStyles.scrollHover()]: state.hover \|\| state.scrolling,\r\n });\r\n const scrollStyle = {\r\n top: state.scrollPos,\r\n height: state.scrollSize,\r\n };\r\n scroll = (\r\n <div\r\n ref={this.refScroll}\r\n className={scrollClass}\r\n style={scrollStyle}\r\n onMouseDown={this.handleScrollMouseDown}\r\n />\r\n );\r\n }\r\n\r\n const innerStyle: React.CSSProperties = {\r\n // hide vertical scrollbar with a little extra space\r\n marginRight: -1 HIDE_SCROLLBAR_OFFSET,\r\n paddingRight: HIDE_SCROLLBAR_OFFSET - getScrollWidth(),\r\n\r\n maxHeight: props.maxHeight,\r\n scrollBehavior: props.scrollBehaviour,\r\n };\r\n\r\n return (\r\n <CommonWrapper {...this.props}>\r\n <div className={jsStyles.root()} onMouseMove={this.handleMouseMove} onMouseLeave={this.handleMouseLeave}>\r\n {scroll}\r\n <div\r\n data-tid=\"ScrollContainer__inner\"\r\n className={jsStyles.inner()}\r\n style={innerStyle}\r\n ref={this.refInner}\r\n onScroll={this.handleNativeScroll}\r\n >\r\n {props.children}\r\n </div>\r\n </div>\r\n </CommonWrapper>\r\n );\r\n }\r\n\r\n /*\r\n @public\r\n /\r\n public scrollTo(element: HTMLElement) {\r\n if (!element \|\| !this.inner) {\r\n return;\r\n }\r\n const maxScroll = element.offsetTop;\r\n if (this.inner.scrollTop > maxScroll) {\r\n this.inner.scrollTop = maxScroll;\r\n return;\r\n }\r\n\r\n const minScroll = element.offsetTop + element.scrollHeight - this.inner.offsetHeight;\r\n if (this.inner.scrollTop < minScroll) {\r\n this.inner.scrollTop = minScroll;\r\n }\r\n }\r\n\r\n /\r\n @public\r\n /\r\n public scrollToTop() {\r\n if (!this.inner) {\r\n return;\r\n }\r\n this.inner.scrollTop = 0;\r\n }\r\n\r\n /\r\n @public\r\n /\r\n public scrollToBottom() {\r\n if (!this.inner) {\r\n return;\r\n }\r\n this.inner.scrollTop = this.inner.scrollHeight - this.inner.offsetHeight;\r\n }\r\n\r\n private refInner = (element: HTMLElement \| null) => {\r\n if (!this.inner && element && this.props.preventWindowScroll) {\r\n element.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\r\n }\r\n if (this.inner && !element) {\r\n this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\r\n }\r\n this.inner = element;\r\n };\r\n\r\n private refScroll = (element: HTMLElement \| null) => {\r\n if (!this.scroll && element) {\r\n element.addEventListener('wheel', this.handleScrollWheel, { passive: false });\r\n }\r\n if (this.scroll && !element) {\r\n this.scroll.removeEventListener('wheel', this.handleScrollWheel);\r\n }\r\n this.scroll = element;\r\n };\r\n\r\n private handleNativeScroll = (event: React.UIEvent<HTMLDivElement>) => {\r\n this.reflow();\r\n this.props.onScroll?.(event);\r\n if (this.props.preventWindowScroll) {\r\n event.preventDefault();\r\n return;\r\n }\r\n LayoutEvents.emit();\r\n };\r\n\r\n private reflow = () => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const containerHeight = this.inner.offsetHeight;\r\n const contentHeight = this.inner.scrollHeight;\r\n const scrollTop = this.inner.scrollTop;\r\n\r\n const scrollActive = containerHeight < contentHeight;\r\n\r\n if (!scrollActive && !this.state.scrollActive) {\r\n return;\r\n }\r\n\r\n let scrollSize = 0;\r\n let scrollPos = 0;\r\n let scrollState = this.state.scrollState;\r\n\r\n if (scrollActive) {\r\n scrollSize = Math.max((containerHeight / contentHeight) containerHeight, MIN_SCROLL_SIZE);\r\n scrollPos = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - scrollSize);\r\n }\r\n\r\n if (\r\n this.state.scrollActive !== scrollActive \|\|\r\n this.state.scrollSize !== scrollSize \|\|\r\n this.state.scrollPos !== scrollPos\r\n ) {\r\n scrollState = this.getImmediateScrollState();\r\n\r\n if (scrollState !== this.state.scrollState) {\r\n this.props.onScrollStateChange?.(scrollState);\r\n }\r\n\r\n this.setState({\r\n scrollActive,\r\n scrollSize,\r\n scrollPos,\r\n scrollState,\r\n });\r\n }\r\n };\r\n\r\n private handleScrollMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const target: Document = window.document;\r\n const initialY = event.clientY;\r\n const initialScrollTop = this.inner.scrollTop;\r\n\r\n const mouseMove = (mouseMoveEvent: MouseEvent) => {\r\n if (!this.inner) {\r\n return;\r\n }\r\n\r\n const ratio =\r\n (this.inner.scrollHeight - this.inner.offsetHeight) / (this.inner.offsetHeight - this.state.scrollSize);\r\n const deltaY = (mouseMoveEvent.clientY - initialY) * ratio;\r\n\r\n this.inner.scrollTop = initialScrollTop + deltaY;\r\n\r\n if (mouseMoveEvent.preventDefault) {\r\n mouseMoveEvent.preventDefault();\r\n }\r\n\r\n if (Object.prototype.hasOwnProperty.call(mouseMoveEvent, 'returnValue')) {\r\n (mouseMoveEvent as MouseEvent & {\r\n returnValue: boolean;\r\n }).returnValue = false;\r\n }\r\n };\r\n\r\n const mouseUp = () => {\r\n target.removeEventListener('mousemove', mouseMove);\r\n target.removeEventListener('mouseup', mouseUp);\r\n this.setState({ scrolling: false });\r\n };\r\n\r\n target.addEventListener('mousemove', mouseMove);\r\n target.addEventListener('mouseup', mouseUp);\r\n this.setState({ scrolling: true });\r\n\r\n event.preventDefault();\r\n };\r\n\r\n private handleScrollWheel = (event: Event) => {\r\n if (!this.inner \|\| !(event instanceof WheelEvent)) {\r\n return;\r\n }\r\n\r\n if (event.deltaY > 0 && this.inner.scrollHeight <= this.inner.scrollTop + this.inner.offsetHeight) {\r\n return;\r\n }\r\n if (event.deltaY < 0 && this.inner.scrollTop <= 0) {\r\n return;\r\n }\r\n\r\n this.inner.scrollTop += event.deltaY;\r\n event.preventDefault();\r\n };\r\n\r\n private handleInnerScrollWheel = (event: Event) => {\r\n if (!this.inner \|\| !(event instanceof WheelEvent)) {\r\n return;\r\n }\r\n\r\n if (this.state.scrollActive) {\r\n if (event.deltaY > 0 && this.inner.scrollHeight <= this.inner.scrollTop + this.inner.offsetHeight) {\r\n event.preventDefault();\r\n return false;\r\n }\r\n if (event.deltaY < 0 && this.inner.scrollTop <= 0) {\r\n event.preventDefault();\r\n return false;\r\n }\r\n }\r\n };\r\n\r\n private handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\r\n const right = event.currentTarget.getBoundingClientRect().right - event.pageX;\r\n this.setHover(right <= 12);\r\n };\r\n\r\n private handleMouseLeave = () => {\r\n this.setHover(false);\r\n };\r\n\r\n private setHover(hover: boolean) {\r\n if (this.state.hover !== hover) {\r\n this.setState({ hover });\r\n }\r\n }\r\n\r\n private getImmediateScrollState(): ScrollContainerScrollState {\r\n if (!this.inner \|\| this.inner.scrollTop === 0) {\r\n return 'top';\r\n }\r\n\r\n // Zoom in Chrome causes problems\r\n // https://github.com/skbkontur/retail-ui/pull/2705\r\n const maxScrollPos = this.inner.scrollHeight - this.inner.clientHeight;\r\n if (Math.abs(maxScrollPos - this.inner.scrollTop) <= 1) {\r\n return 'bottom';\r\n }\r\n\r\n return 'scroll';\r\n }\r\n}\r\n"]}

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/package.json CHANGED Viewed

@@ -1,11 +1,11 @@
 {
   "name": "@skbkontur/react-ui",
-  "version": "2.17.7",
+  "version": "2.17.8",
   "description": "UI Components",
   "main": "cjs/index.js",
   "module": "index.js",
   "sideEffects": false,
-  "homepage": "https://tech.skbkontur.ru/react-ui/2.17.7/",
+  "homepage": "https://tech.skbkontur.ru/react-ui/2.17.8/",
   "repository": {
     "type": "git",
     "url": "git@github.com:skbkontur/retail-ui.git"