@skbkontur/react-ui 3.11.0 → 3.12.2

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 (64) hide show
  1. package/CHANGELOG.md +41 -0
  2. package/cjs/components/DatePicker/DatePicker.d.ts +0 -3
  3. package/cjs/components/DatePicker/DatePicker.js +14 -9
  4. package/cjs/components/DatePicker/DatePicker.js.map +1 -1
  5. package/cjs/components/Select/Select.js +4 -1
  6. package/cjs/components/Select/Select.js.map +1 -1
  7. package/cjs/components/SidePage/SidePage.d.ts +4 -1
  8. package/cjs/components/SidePage/SidePage.js +18 -9
  9. package/cjs/components/SidePage/SidePage.js.map +1 -1
  10. package/cjs/components/SidePage/SidePageContext.d.ts +2 -0
  11. package/cjs/components/SidePage/SidePageContext.js +3 -0
  12. package/cjs/components/SidePage/SidePageContext.js.map +1 -1
  13. package/cjs/components/SidePage/SidePageHeader.d.ts +3 -0
  14. package/cjs/components/SidePage/SidePageHeader.js +26 -8
  15. package/cjs/components/SidePage/SidePageHeader.js.map +1 -1
  16. package/cjs/components/Sticky/Sticky.d.ts +6 -1
  17. package/cjs/components/Sticky/Sticky.js +5 -0
  18. package/cjs/components/Sticky/Sticky.js.map +1 -1
  19. package/cjs/internal/DropdownContainer/DropdownContainer.d.ts +2 -1
  20. package/cjs/internal/DropdownContainer/DropdownContainer.js +25 -10
  21. package/cjs/internal/DropdownContainer/DropdownContainer.js.map +1 -1
  22. package/cjs/internal/DropdownContainer/DropdownContainer.styles.d.ts +3 -0
  23. package/cjs/internal/DropdownContainer/DropdownContainer.styles.js +9 -0
  24. package/cjs/internal/DropdownContainer/DropdownContainer.styles.js.map +1 -0
  25. package/cjs/internal/Menu/Menu.d.ts +2 -0
  26. package/cjs/internal/Menu/Menu.js +33 -3
  27. package/cjs/internal/Menu/Menu.js.map +1 -1
  28. package/cjs/internal/Menu/Menu.styles.d.ts +3 -0
  29. package/cjs/internal/Menu/Menu.styles.js +23 -3
  30. package/cjs/internal/Menu/Menu.styles.js.map +1 -1
  31. package/cjs/internal/Popup/Popup.js +3 -1
  32. package/cjs/internal/Popup/Popup.js.map +1 -1
  33. package/components/DatePicker/DatePicker/DatePicker.js +19 -15
  34. package/components/DatePicker/DatePicker/DatePicker.js.map +1 -1
  35. package/components/DatePicker/DatePicker.d.ts +0 -3
  36. package/components/Select/Select/Select.js +5 -2
  37. package/components/Select/Select/Select.js.map +1 -1
  38. package/components/SidePage/SidePage/SidePage.js +20 -13
  39. package/components/SidePage/SidePage/SidePage.js.map +1 -1
  40. package/components/SidePage/SidePage.d.ts +4 -1
  41. package/components/SidePage/SidePageContext/SidePageContext.js +3 -0
  42. package/components/SidePage/SidePageContext/SidePageContext.js.map +1 -1
  43. package/components/SidePage/SidePageContext.d.ts +2 -0
  44. package/components/SidePage/SidePageHeader/SidePageHeader.js +21 -2
  45. package/components/SidePage/SidePageHeader/SidePageHeader.js.map +1 -1
  46. package/components/SidePage/SidePageHeader.d.ts +3 -0
  47. package/components/Sticky/Sticky/Sticky.js.map +1 -1
  48. package/components/Sticky/Sticky.d.ts +6 -1
  49. package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js +27 -23
  50. package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js.map +1 -1
  51. package/internal/DropdownContainer/DropdownContainer.d.ts +2 -1
  52. package/internal/DropdownContainer/DropdownContainer.styles/DropdownContainer.styles.js +10 -0
  53. package/internal/DropdownContainer/DropdownContainer.styles/DropdownContainer.styles.js.map +1 -0
  54. package/internal/DropdownContainer/DropdownContainer.styles/package.json +6 -0
  55. package/internal/DropdownContainer/DropdownContainer.styles.d.ts +3 -0
  56. package/internal/Menu/Menu/Menu.js +30 -6
  57. package/internal/Menu/Menu/Menu.js.map +1 -1
  58. package/internal/Menu/Menu.d.ts +2 -0
  59. package/internal/Menu/Menu.styles/Menu.styles.js +12 -3
  60. package/internal/Menu/Menu.styles/Menu.styles.js.map +1 -1
  61. package/internal/Menu/Menu.styles.d.ts +3 -0
  62. package/internal/Popup/Popup/Popup.js +2 -1
  63. package/internal/Popup/Popup/Popup.js.map +1 -1
  64. package/package.json +4 -3
@@ -1,5 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _createClass from "@babel/runtime/helpers/esm/createClass";
3
+ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
3
4
  import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
4
5
 
5
6
  var _class, _class2, _temp;
@@ -39,20 +40,29 @@ var SidePageHeader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
39
40
  };
40
41
  _this.theme = void 0;
41
42
  _this.wrapper = null;
43
+ _this.sticky = null;
42
44
  _this.lastRegularHeight = 0;
43
45
  _this.setRootNode = void 0;
44
46
 
45
47
  _this.componentDidMount = function () {
46
48
  window.addEventListener('scroll', _this.update, true);
47
49
  _this.context.setHasHeader == null ? void 0 : _this.context.setHasHeader();
50
+
51
+ _this.context.headerRef(_assertThisInitialized(_this));
48
52
  };
49
53
 
50
54
  _this.componentWillUnmount = function () {
51
55
  window.removeEventListener('scroll', _this.update, true);
52
56
  _this.context.setHasHeader == null ? void 0 : _this.context.setHasHeader(false);
57
+
58
+ _this.context.headerRef(null);
53
59
  };
54
60
 
55
61
  _this.update = function () {
62
+ var _this$sticky;
63
+
64
+ (_this$sticky = _this.sticky) == null ? void 0 : _this$sticky.reflow();
65
+
56
66
  _this.updateReadyToFix();
57
67
  };
58
68
 
@@ -77,7 +87,11 @@ var SidePageHeader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
77
87
  }, /*#__PURE__*/React.createElement(Sticky, {
78
88
  side: "top",
79
89
  offset: stickyOffset
80
- }, /*#__PURE__*/React.createElement(SidePageContext.Consumer, null, function (_ref) {
90
+ }, _this.closeIcon));
91
+ };
92
+
93
+ _this.closeIcon = function () {
94
+ return /*#__PURE__*/React.createElement(SidePageContext.Consumer, null, function (_ref) {
81
95
  var _cx3;
82
96
 
83
97
  var requestClose = _ref.requestClose;
@@ -89,7 +103,7 @@ var SidePageHeader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
89
103
  "data-tid": "SidePage__close",
90
104
  tabIndex: 0
91
105
  }, /*#__PURE__*/React.createElement(CrossIcon, null));
92
- })));
106
+ });
93
107
  };
94
108
 
95
109
  _this.updateReadyToFix = function () {
@@ -110,6 +124,10 @@ var SidePageHeader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
110
124
  _this.wrapper = el;
111
125
  };
112
126
 
127
+ _this.stickyRef = function (el) {
128
+ _this.sticky = el;
129
+ };
130
+
113
131
  _this.handleFocus = function () {
114
132
  requestAnimationFrame(function () {
115
133
  if (keyListener.isTabPressed) {
@@ -148,6 +166,7 @@ var SidePageHeader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
148
166
  ref: this.wrapperRef,
149
167
  className: styles.headerWrapper()
150
168
  }, isReadyToFix ? /*#__PURE__*/React.createElement(Sticky, {
169
+ ref: this.stickyRef,
151
170
  side: "top"
152
171
  }, this.renderHeader) : this.renderHeader()));
153
172
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","cx","keyListener","rootNode","styles","SidePageContext","SidePageHeader","context","state","isReadyToFix","focusedByTab","theme","wrapper","lastRegularHeight","setRootNode","componentDidMount","window","addEventListener","update","setHasHeader","componentWillUnmount","removeEventListener","updateReadyToFix","renderHeader","fixed","header","headerFixed","renderClose","title","titleFixed","props","children","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperClose","requestClose","close","closeFocus","handleFocus","handleBlur","wrapperScrolledUp","getBoundingClientRect","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","requestAnimationFrame","isTabPressed","render","renderMain","headerWrapper","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { isFunction } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageHeaderProps extends CommonProps {\n children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface SidePageHeaderState {\n isReadyToFix: boolean;\n focusedByTab: boolean;\n}\n\n/**\n * Шапка сайдпейджа\n *\n * @visibleName SidePage.Header\n */\n@rootNode\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n\n public state = {\n isReadyToFix: false,\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private wrapper: HTMLElement | null = null;\n private lastRegularHeight = 0;\n private setRootNode!: TSetRootNode;\n\n public get regularHeight(): number {\n const { isReadyToFix } = this.state;\n if (!this.wrapper) {\n return 0;\n }\n if (!isReadyToFix) {\n this.lastRegularHeight = this.wrapper.getBoundingClientRect().height;\n }\n return this.lastRegularHeight;\n }\n\n public get fixedHeaderHeight(): number {\n const { theme } = this;\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) * 2;\n }\n\n public componentDidMount = () => {\n window.addEventListener('scroll', this.update, true);\n this.context.setHasHeader?.();\n };\n\n public componentWillUnmount = () => {\n window.removeEventListener('scroll', this.update, true);\n this.context.setHasHeader?.(false);\n };\n\n public update = () => {\n this.updateReadyToFix();\n };\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { isReadyToFix } = this.state;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div ref={this.wrapperRef} className={styles.headerWrapper()}>\n {isReadyToFix ? <Sticky side=\"top\">{this.renderHeader}</Sticky> : this.renderHeader()}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderHeader = (fixed = false) => {\n return (\n <div className={cx(styles.header(this.theme), { [styles.headerFixed(this.theme)]: fixed })}>\n {this.renderClose(fixed)}\n <div className={cx(styles.title(this.theme), { [styles.titleFixed()]: fixed })}>\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\n </div>\n </div>\n );\n };\n\n private renderClose = (fixed: boolean) => {\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\n\n return (\n <div className={cx(styles.wrapperClose(this.theme), fixed && styles.fixed(this.theme))}>\n <Sticky side=\"top\" offset={stickyOffset}>\n <SidePageContext.Consumer>\n {({ requestClose }) => (\n <button\n className={cx(styles.close(this.theme), {\n [styles.closeFocus(this.theme)]: this.state.focusedByTab,\n })}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={requestClose}\n data-tid=\"SidePage__close\"\n tabIndex={0}\n >\n <CrossIcon />\n </button>\n )}\n </SidePageContext.Consumer>\n </Sticky>\n </div>\n );\n };\n\n private updateReadyToFix = () => {\n if (this.wrapper) {\n const wrapperScrolledUp = this.wrapper.getBoundingClientRect().top;\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\n this.setState((state) => (state.isReadyToFix !== isReadyToFix ? { ...state, isReadyToFix } : state));\n }\n };\n\n private wrapperRef = (el: HTMLElement | null) => {\n this.wrapper = el;\n };\n\n private handleFocus = () => {\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n}\n"]}
1
+ {"version":3,"sources":["SidePageHeader.tsx"],"names":["React","Sticky","CrossIcon","isFunction","ThemeContext","CommonWrapper","cx","keyListener","rootNode","styles","SidePageContext","SidePageHeader","context","state","isReadyToFix","focusedByTab","theme","wrapper","sticky","lastRegularHeight","setRootNode","componentDidMount","window","addEventListener","update","setHasHeader","headerRef","componentWillUnmount","removeEventListener","reflow","updateReadyToFix","renderHeader","fixed","header","headerFixed","renderClose","title","titleFixed","props","children","stickyOffset","parseInt","sidePageHeaderStickyOffset","wrapperClose","closeIcon","requestClose","close","closeFocus","handleFocus","handleBlur","wrapperScrolledUp","getBoundingClientRect","top","regularHeight","fixedHeaderHeight","setState","wrapperRef","el","stickyRef","requestAnimationFrame","isTabPressed","render","renderMain","headerWrapper","height","sidePageHeaderFixedLineHeight","sidePageHeaderFixedPaddingY","Component","__KONTUR_REACT_UI__","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { isFunction } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './SidePage.styles';\nimport { SidePageContext, SidePageContextType } from './SidePageContext';\n\nexport interface SidePageHeaderProps extends CommonProps {\n children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface SidePageHeaderState {\n isReadyToFix: boolean;\n focusedByTab: boolean;\n}\n\n/**\n * Шапка сайдпейджа\n *\n * @visibleName SidePage.Header\n */\n@rootNode\nexport class SidePageHeader extends React.Component<SidePageHeaderProps, SidePageHeaderState> {\n public static __KONTUR_REACT_UI__ = 'SidePageHeader';\n\n public static contextType = SidePageContext;\n public context: SidePageContextType = this.context;\n\n public state = {\n isReadyToFix: false,\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private wrapper: HTMLElement | null = null;\n private sticky: Sticky | null = null;\n private lastRegularHeight = 0;\n private setRootNode!: TSetRootNode;\n\n public get regularHeight(): number {\n const { isReadyToFix } = this.state;\n if (!this.wrapper) {\n return 0;\n }\n if (!isReadyToFix) {\n this.lastRegularHeight = this.wrapper.getBoundingClientRect().height;\n }\n return this.lastRegularHeight;\n }\n\n public get fixedHeaderHeight(): number {\n const { theme } = this;\n return parseInt(theme.sidePageHeaderFixedLineHeight) + parseInt(theme.sidePageHeaderFixedPaddingY) * 2;\n }\n\n public componentDidMount = () => {\n window.addEventListener('scroll', this.update, true);\n this.context.setHasHeader?.();\n this.context.headerRef(this);\n };\n\n public componentWillUnmount = () => {\n window.removeEventListener('scroll', this.update, true);\n this.context.setHasHeader?.(false);\n this.context.headerRef(null);\n };\n\n public update = () => {\n this.sticky?.reflow();\n this.updateReadyToFix();\n };\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { isReadyToFix } = this.state;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div ref={this.wrapperRef} className={styles.headerWrapper()}>\n {isReadyToFix ? (\n <Sticky ref={this.stickyRef} side=\"top\">\n {this.renderHeader}\n </Sticky>\n ) : (\n this.renderHeader()\n )}\n </div>\n </CommonWrapper>\n );\n }\n\n private renderHeader = (fixed = false) => {\n return (\n <div className={cx(styles.header(this.theme), { [styles.headerFixed(this.theme)]: fixed })}>\n {this.renderClose(fixed)}\n <div className={cx(styles.title(this.theme), { [styles.titleFixed()]: fixed })}>\n {isFunction(this.props.children) ? this.props.children(fixed) : this.props.children}\n </div>\n </div>\n );\n };\n\n private renderClose = (fixed: boolean) => {\n const stickyOffset = parseInt(this.theme.sidePageHeaderStickyOffset);\n\n return (\n <div className={cx(styles.wrapperClose(this.theme), fixed && styles.fixed(this.theme))}>\n <Sticky side=\"top\" offset={stickyOffset}>\n {this.closeIcon}\n </Sticky>\n </div>\n );\n };\n\n private closeIcon = () => (\n <SidePageContext.Consumer>\n {({ requestClose }) => (\n <button\n className={cx(styles.close(this.theme), {\n [styles.closeFocus(this.theme)]: this.state.focusedByTab,\n })}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={requestClose}\n data-tid=\"SidePage__close\"\n tabIndex={0}\n >\n <CrossIcon />\n </button>\n )}\n </SidePageContext.Consumer>\n );\n\n private updateReadyToFix = () => {\n if (this.wrapper) {\n const wrapperScrolledUp = this.wrapper.getBoundingClientRect().top;\n const isReadyToFix = this.regularHeight + wrapperScrolledUp <= this.fixedHeaderHeight;\n this.setState((state) => (state.isReadyToFix !== isReadyToFix ? { ...state, isReadyToFix } : state));\n }\n };\n\n private wrapperRef = (el: HTMLElement | null) => {\n this.wrapper = el;\n };\n\n private stickyRef = (el: Sticky | null) => {\n this.sticky = el;\n };\n\n private handleFocus = () => {\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n };\n\n private handleBlur = () => {\n this.setState({ focusedByTab: false });\n };\n}\n"]}
@@ -23,6 +23,7 @@ export declare class SidePageHeader extends React.Component<SidePageHeaderProps,
23
23
  };
24
24
  private theme;
25
25
  private wrapper;
26
+ private sticky;
26
27
  private lastRegularHeight;
27
28
  private setRootNode;
28
29
  get regularHeight(): number;
@@ -34,8 +35,10 @@ export declare class SidePageHeader extends React.Component<SidePageHeaderProps,
34
35
  private renderMain;
35
36
  private renderHeader;
36
37
  private renderClose;
38
+ private closeIcon;
37
39
  private updateReadyToFix;
38
40
  private wrapperRef;
41
+ private stickyRef;
39
42
  private handleFocus;
40
43
  private handleBlur;
41
44
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","LayoutEvents","isFunction","ZIndex","CommonWrapper","cx","rootNode","styles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","wrapper","inner","layoutSubscription","remove","reflowCounter","setRootNode","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';\nimport PropTypes from 'prop-types';\nimport shallowEqual from 'shallowequal';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunction } from '../../lib/utils';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Sticky.styles';\n\nconst MAX_REFLOW_RETRIES = 5;\n\nexport interface StickyProps extends CommonProps {\n side: 'top' | 'bottom';\n /**\n * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\n * @default 0\n */\n offset: number;\n getStop?: () => Nullable<HTMLElement>;\n children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface StickyState {\n fixed: boolean;\n deltaHeight: number;\n height?: number;\n width?: number;\n left?: number;\n stopped: boolean;\n relativeTop: number;\n}\n\n@rootNode\nexport class Sticky extends React.Component<StickyProps, StickyState> {\n public static __KONTUR_REACT_UI__ = 'Sticky';\n\n public static propTypes = {\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n /**\n * Функция, которая возвращает DOM-элемент, который нельзя пересекать.\n */\n getStop: PropTypes.func,\n\n /**\n * Отступ от границы в пикселях\n */\n offset: PropTypes.number,\n\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\n };\n\n public static defaultProps = { offset: 0 };\n\n public state: StickyState = {\n fixed: false,\n deltaHeight: 0,\n stopped: false,\n relativeTop: 0,\n };\n\n private wrapper: Nullable<HTMLElement>;\n private inner: Nullable<HTMLElement>;\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\n private reflowCounter = 0;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.reflow();\n\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\n }\n\n public componentWillUnmount() {\n if (this.layoutSubscription.remove) {\n this.layoutSubscription.remove();\n }\n }\n\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\n if (!shallowEqual(prevProps, this.props) || !shallowEqual(prevState, this.state)) {\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\n LayoutEvents.emit();\n this.reflowCounter += 1;\n return;\n }\n }\n this.reflowCounter = 0;\n }\n\n public render() {\n let { children } = this.props;\n const { side, offset } = this.props;\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\n const innerStyle: React.CSSProperties = {};\n\n if (fixed) {\n if (stopped) {\n innerStyle.top = relativeTop;\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\n } else {\n innerStyle.width = width;\n innerStyle[side] = offset;\n innerStyle.left = left;\n }\n }\n\n if (isFunction(children)) {\n children = children(fixed);\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div ref={this.refWrapper} className={styles.wrapper()}>\n <ZIndex\n priority=\"Sticky\"\n applyZIndex={fixed}\n className={cx(styles.inner(), {\n [styles.fixed()]: fixed && !stopped,\n [styles.stopped()]: stopped,\n })}\n style={innerStyle}\n wrapperRef={this.refInner}\n >\n <div className={styles.container()}>{children}</div>\n </ZIndex>\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\n </div>\n </CommonWrapper>\n );\n }\n\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\n\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\n\n private reflow = () => {\n const { documentElement } = document;\n\n if (!documentElement) {\n throw Error('There is no \"documentElement\" in document');\n }\n\n const windowHeight = window.innerHeight || documentElement.clientHeight;\n if (!this.wrapper || !this.inner) {\n return;\n }\n const { top, bottom, left } = this.wrapper.getBoundingClientRect();\n const { width, height } = this.inner.getBoundingClientRect();\n const { offset, getStop, side } = this.props;\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\n const fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;\n\n this.setState({ fixed, left });\n\n if (fixed && !prevFixed) {\n this.setState({ width, height });\n }\n\n if (fixed) {\n const stop = getStop && getStop();\n if (stop) {\n const deltaHeight = prevHeight - height;\n const stopRect = stop.getBoundingClientRect();\n const outerHeight = height + offset;\n let stopped = false;\n let relativeTop = 0;\n\n if (side === 'top') {\n stopped = stopRect.top - outerHeight < 0;\n relativeTop = stopRect.top - prevHeight - top;\n } else {\n stopped = stopRect.bottom + outerHeight > windowHeight;\n relativeTop = stopRect.bottom - top;\n }\n\n this.setState({ relativeTop, deltaHeight, stopped });\n }\n }\n };\n}\n"]}
1
+ {"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","LayoutEvents","isFunction","ZIndex","CommonWrapper","cx","rootNode","styles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","wrapper","inner","layoutSubscription","remove","reflowCounter","setRootNode","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';\nimport PropTypes from 'prop-types';\nimport shallowEqual from 'shallowequal';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunction } from '../../lib/utils';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Sticky.styles';\n\nconst MAX_REFLOW_RETRIES = 5;\n\nexport interface StickyProps extends CommonProps {\n side: 'top' | 'bottom';\n /**\n * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\n * @default 0\n */\n offset: number;\n getStop?: () => Nullable<HTMLElement>;\n children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface StickyState {\n fixed: boolean;\n deltaHeight: number;\n height?: number;\n width?: number;\n left?: number;\n stopped: boolean;\n relativeTop: number;\n}\n\n@rootNode\nexport class Sticky extends React.Component<StickyProps, StickyState> {\n public static __KONTUR_REACT_UI__ = 'Sticky';\n\n public static propTypes = {\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n /**\n * Функция, которая возвращает DOM-элемент, который нельзя пересекать.\n */\n getStop: PropTypes.func,\n\n /**\n * Отступ от границы в пикселях\n */\n offset: PropTypes.number,\n\n side: PropTypes.oneOf(['top', 'bottom']).isRequired,\n };\n\n public static defaultProps = { offset: 0 };\n\n public state: StickyState = {\n fixed: false,\n deltaHeight: 0,\n stopped: false,\n relativeTop: 0,\n };\n\n private wrapper: Nullable<HTMLElement>;\n private inner: Nullable<HTMLElement>;\n private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\n private reflowCounter = 0;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.reflow();\n\n this.layoutSubscription = LayoutEvents.addListener(this.reflow);\n }\n\n public componentWillUnmount() {\n if (this.layoutSubscription.remove) {\n this.layoutSubscription.remove();\n }\n }\n\n public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\n if (!shallowEqual(prevProps, this.props) || !shallowEqual(prevState, this.state)) {\n if (this.reflowCounter < MAX_REFLOW_RETRIES) {\n LayoutEvents.emit();\n this.reflowCounter += 1;\n return;\n }\n }\n this.reflowCounter = 0;\n }\n\n public render() {\n let { children } = this.props;\n const { side, offset } = this.props;\n const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\n const innerStyle: React.CSSProperties = {};\n\n if (fixed) {\n if (stopped) {\n innerStyle.top = relativeTop;\n innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\n } else {\n innerStyle.width = width;\n innerStyle[side] = offset;\n innerStyle.left = left;\n }\n }\n\n if (isFunction(children)) {\n children = children(fixed);\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div ref={this.refWrapper} className={styles.wrapper()}>\n <ZIndex\n priority=\"Sticky\"\n applyZIndex={fixed}\n className={cx(styles.inner(), {\n [styles.fixed()]: fixed && !stopped,\n [styles.stopped()]: stopped,\n })}\n style={innerStyle}\n wrapperRef={this.refInner}\n >\n <div className={styles.container()}>{children}</div>\n </ZIndex>\n {fixed && !stopped ? <div style={{ width, height }} /> : null}\n </div>\n </CommonWrapper>\n );\n }\n\n private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\n\n private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\n\n /**\n * Пересчитать габариты и позицию залипшего элемента\n *\n * @public\n */\n public reflow = () => {\n const { documentElement } = document;\n\n if (!documentElement) {\n throw Error('There is no \"documentElement\" in document');\n }\n\n const windowHeight = window.innerHeight || documentElement.clientHeight;\n if (!this.wrapper || !this.inner) {\n return;\n }\n const { top, bottom, left } = this.wrapper.getBoundingClientRect();\n const { width, height } = this.inner.getBoundingClientRect();\n const { offset, getStop, side } = this.props;\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\n const fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;\n\n this.setState({ fixed, left });\n\n if (fixed && !prevFixed) {\n this.setState({ width, height });\n }\n\n if (fixed) {\n const stop = getStop && getStop();\n if (stop) {\n const deltaHeight = prevHeight - height;\n const stopRect = stop.getBoundingClientRect();\n const outerHeight = height + offset;\n let stopped = false;\n let relativeTop = 0;\n\n if (side === 'top') {\n stopped = stopRect.top - outerHeight < 0;\n relativeTop = stopRect.top - prevHeight - top;\n } else {\n stopped = stopRect.bottom + outerHeight > windowHeight;\n relativeTop = stopRect.bottom - top;\n }\n\n this.setState({ relativeTop, deltaHeight, stopped });\n }\n }\n };\n}\n"]}
@@ -50,5 +50,10 @@ export declare class Sticky extends React.Component<StickyProps, StickyState> {
50
50
  render(): JSX.Element;
51
51
  private refWrapper;
52
52
  private refInner;
53
- private reflow;
53
+ /**
54
+ * Пересчитать габариты и позицию залипшего элемента
55
+ *
56
+ * @public
57
+ */
58
+ reflow: () => void;
54
59
  }
@@ -5,22 +5,16 @@ import * as LayoutEvents from "../../../lib/LayoutEvents";
5
5
  import { RenderContainer } from "../../RenderContainer";
6
6
  import { ZIndex } from "../../ZIndex";
7
7
  import { createPropsGetter } from "../../../lib/createPropsGetter";
8
+ import { cx } from "../../../lib/theming/Emotion";
9
+ import { isIE11 } from "../../../lib/client";
10
+ import { styles } from "../DropdownContainer.styles";
8
11
  export var DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {
9
12
  _inheritsLoose(DropdownContainer, _React$PureComponent);
10
13
 
11
- function DropdownContainer() {
14
+ function DropdownContainer(props) {
12
15
  var _this;
13
16
 
14
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
15
- args[_key] = arguments[_key];
16
- }
17
-
18
- _this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;
19
- _this.state = {
20
- position: null,
21
- minWidth: 0,
22
- isDocumentElementRoot: true
23
- };
17
+ _this = _React$PureComponent.call(this, props) || this;
24
18
  _this.getProps = createPropsGetter(DropdownContainer.defaultProps);
25
19
  _this.dom = void 0;
26
20
  _this.layoutSub = void 0;
@@ -143,6 +137,11 @@ export var DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {
143
137
  };
144
138
  };
145
139
 
140
+ _this.state = {
141
+ position: null,
142
+ minWidth: 0,
143
+ isDocumentElementRoot: getIsDocumentElementRoot()
144
+ };
146
145
  return _this;
147
146
  }
148
147
 
@@ -151,16 +150,6 @@ export var DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {
151
150
  _proto.componentDidMount = function componentDidMount() {
152
151
  this.position();
153
152
  this.layoutSub = LayoutEvents.addListener(this.position);
154
- var _document2 = document,
155
- body = _document2.body,
156
- docEl = _document2.documentElement;
157
- var htmlPosition = getComputedStyle(docEl).position;
158
- var bodyPosition = getComputedStyle(body).position;
159
- var hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;
160
- var hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';
161
- this.setState({
162
- isDocumentElementRoot: hasLimitedHeightRoot || hasStaticRoot
163
- });
164
153
  };
165
154
 
166
155
  _proto.componentWillUnmount = function componentWillUnmount() {
@@ -170,6 +159,8 @@ export var DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {
170
159
  };
171
160
 
172
161
  _proto.render = function render() {
162
+ var _cx;
163
+
173
164
  var style = {
174
165
  position: 'absolute',
175
166
  top: '0'
@@ -186,14 +177,16 @@ export var DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {
186
177
  bottom: bottom !== null ? bottom : undefined,
187
178
  left: left !== null ? left : undefined,
188
179
  right: right !== null ? right : undefined,
189
- minWidth: this.state.minWidth
180
+ minWidth: this.state.minWidth,
181
+ maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined
190
182
  });
191
183
  }
192
184
 
193
185
  var content = /*#__PURE__*/React.createElement(ZIndex, {
194
186
  priority: 'DropdownContainer',
195
187
  wrapperRef: this.ZIndexRef,
196
- style: style
188
+ style: style,
189
+ className: cx((_cx = {}, _cx[styles.alignRight()] = this.props.align === 'right' && !isIE11, _cx))
197
190
  }, this.props.children);
198
191
  return this.props.disablePortal ? content : /*#__PURE__*/React.createElement(RenderContainer, null, content);
199
192
  };
@@ -206,4 +199,15 @@ DropdownContainer.defaultProps = {
206
199
  disablePortal: false,
207
200
  offsetX: 0,
208
201
  offsetY: -1
202
+ };
203
+
204
+ var getIsDocumentElementRoot = function getIsDocumentElementRoot() {
205
+ var _document2 = document,
206
+ body = _document2.body,
207
+ documentElement = _document2.documentElement;
208
+ var htmlPosition = getComputedStyle(documentElement).position;
209
+ var bodyPosition = getComputedStyle(body).position;
210
+ var hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;
211
+ var hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';
212
+ return hasLimitedHeightRoot || hasStaticRoot;
209
213
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["DropdownContainer.tsx"],"names":["React","LayoutEvents","RenderContainer","ZIndex","createPropsGetter","DropdownContainer","state","position","minWidth","isDocumentElementRoot","getProps","defaultProps","dom","layoutSub","ZIndexRef","element","isElement","node","Element","target","props","getParent","targetRect","getBoundingClientRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","scrollHeight","setState","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","componentDidMount","addListener","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot","componentWillUnmount","remove","render","style","undefined","content","PureComponent","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' | 'right';\n getParent: () => Nullable<HTMLElement>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n public state: DropdownContainerState = {\n position: null,\n minWidth: 0,\n isDocumentElementRoot: true,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n\n const { body, documentElement: docEl } = document;\n const htmlPosition = getComputedStyle(docEl).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n\n this.setState({ isDocumentElementRoot: hasLimitedHeightRoot || hasStaticRoot });\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n };\n }\n\n const content = (\n <ZIndex priority={'DropdownContainer'} wrapperRef={this.ZIndexRef} style={style}>\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = target.getBoundingClientRect();\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset || docEl.scrollLeft || 0;\n const scrollY = window.pageYOffset || docEl.scrollTop || 0;\n\n let left = null;\n let right = null;\n\n if (this.props.align === 'right') {\n const docWidth = docEl.offsetWidth || 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const { offsetY = 0 } = this.props;\n let bottom = null;\n let top: number | null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n\n top = null;\n bottom = clientHeight + offsetY - scrollY - targetRect.top;\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.props.disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n if (!child) {\n return 0;\n }\n return child.getBoundingClientRect().height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n if (!target || !this.isElement(target)) {\n return 0;\n }\n return target.getBoundingClientRect().width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const { offsetX = 0, offsetY = 0 } = this.props;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = target.getBoundingClientRect().height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n"]}
1
+ {"version":3,"sources":["DropdownContainer.tsx"],"names":["React","LayoutEvents","RenderContainer","ZIndex","createPropsGetter","cx","isIE11","styles","DropdownContainer","props","getProps","defaultProps","dom","layoutSub","ZIndexRef","element","isElement","node","Element","position","target","getParent","targetRect","getBoundingClientRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","state","isDocumentElementRoot","scrollHeight","setState","minWidth","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","getIsDocumentElementRoot","componentDidMount","addListener","componentWillUnmount","remove","render","style","undefined","maxWidth","hasFixedWidth","content","alignRight","PureComponent","__KONTUR_REACT_UI__","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\n\nimport { styles } from './DropdownContainer.styles';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' | 'right';\n getParent: () => Nullable<HTMLElement>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n hasFixedWidth?: boolean;\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n constructor(props: DropdownContainerProps) {\n super(props);\n\n this.state = { position: null, minWidth: 0, isDocumentElementRoot: getIsDocumentElementRoot() };\n }\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined,\n };\n }\n\n const content = (\n <ZIndex\n priority={'DropdownContainer'}\n wrapperRef={this.ZIndexRef}\n style={style}\n className={cx({\n [styles.alignRight()]: this.props.align === 'right' && !isIE11,\n })}\n >\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = target.getBoundingClientRect();\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset || docEl.scrollLeft || 0;\n const scrollY = window.pageYOffset || docEl.scrollTop || 0;\n\n let left = null;\n let right = null;\n\n if (this.props.align === 'right') {\n const docWidth = docEl.offsetWidth || 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const { offsetY = 0 } = this.props;\n let bottom = null;\n let top: number | null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n\n top = null;\n bottom = clientHeight + offsetY - scrollY - targetRect.top;\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.props.disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n if (!child) {\n return 0;\n }\n return child.getBoundingClientRect().height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n if (!target || !this.isElement(target)) {\n return 0;\n }\n return target.getBoundingClientRect().width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const { offsetX = 0, offsetY = 0 } = this.props;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = target.getBoundingClientRect().height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n\nconst getIsDocumentElementRoot = () => {\n const { body, documentElement } = document;\n const htmlPosition = getComputedStyle(documentElement).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n return hasLimitedHeightRoot || hasStaticRoot;\n};\n"]}
@@ -13,6 +13,7 @@ export interface DropdownContainerProps {
13
13
  disablePortal?: boolean;
14
14
  offsetY?: number;
15
15
  offsetX?: number;
16
+ hasFixedWidth?: boolean;
16
17
  }
17
18
  export interface DropdownContainerState {
18
19
  position: Nullable<DropdownContainerPosition>;
@@ -27,10 +28,10 @@ export declare class DropdownContainer extends React.PureComponent<DropdownConta
27
28
  offsetX: number;
28
29
  offsetY: number;
29
30
  };
30
- state: DropdownContainerState;
31
31
  private getProps;
32
32
  private dom;
33
33
  private layoutSub;
34
+ constructor(props: DropdownContainerProps);
34
35
  componentDidMount(): void;
35
36
  componentWillUnmount(): void;
36
37
  render(): JSX.Element;
@@ -0,0 +1,10 @@
1
+ import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
2
+
3
+ var _templateObject;
4
+
5
+ import { css, memoizeStyle } from "../../../lib/theming/Emotion";
6
+ export var styles = memoizeStyle({
7
+ alignRight: function alignRight() {
8
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row-reverse;\n "])));
9
+ }
10
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["DropdownContainer.styles.ts"],"names":["css","memoizeStyle","styles","alignRight"],"mappings":"oHAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,UADiC,wBACpB;AACX,WAAOH,GAAP;;;;AAID,GANgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n alignRight() {\n return css`\n display: flex;\n flex-direction: row-reverse;\n `;\n },\n});\n"]}
@@ -0,0 +1,6 @@
1
+ {
2
+ "main": "../../../cjs/internal/DropdownContainer/DropdownContainer.styles.js",
3
+ "module": "DropdownContainer.styles",
4
+ "types": "../DropdownContainer.styles.d.ts",
5
+ "sideEffects": false
6
+ }
@@ -0,0 +1,3 @@
1
+ export declare const styles: {
2
+ alignRight(): string;
3
+ };
@@ -9,6 +9,7 @@ import { isMenuHeader } from "../../../components/MenuHeader";
9
9
  import { ThemeContext } from "../../../lib/theming/ThemeContext";
10
10
  import { cx } from "../../../lib/theming/Emotion";
11
11
  import { getRootNode, rootNode } from "../../../lib/rootNode";
12
+ import { isIE11 } from "../../../lib/client";
12
13
  import { styles } from "../Menu.styles";
13
14
  import { isActiveElement } from "../isActiveElement";
14
15
  export var Menu = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
@@ -142,11 +143,8 @@ export var Menu = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_R
142
143
  }
143
144
 
144
145
  return /*#__PURE__*/React.createElement("div", {
145
- className: cx((_cx = {}, _cx[styles.root(this.theme)] = true, _cx[styles.shadow(this.theme)] = this.props.hasShadow, _cx)),
146
- style: {
147
- width: this.props.width,
148
- maxHeight: this.props.maxHeight
149
- },
146
+ className: cx(getAlignRightClass(this.props), (_cx = {}, _cx[styles.root(this.theme)] = true, _cx[styles.shadow(this.theme)] = this.props.hasShadow, _cx)),
147
+ style: getStyle(this.props),
150
148
  ref: this.setRootNode
151
149
  }, /*#__PURE__*/React.createElement(ScrollContainer, {
152
150
  ref: this.refScrollContainer,
@@ -293,6 +291,7 @@ export var Menu = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_R
293
291
 
294
292
  return Menu;
295
293
  }(React.Component), _class2.__KONTUR_REACT_UI__ = 'Menu', _class2.defaultProps = {
294
+ align: 'left',
296
295
  width: 'auto',
297
296
  maxHeight: 300,
298
297
  hasShadow: true,
@@ -310,4 +309,29 @@ function childrenToArray(children) {
310
309
  ret.push(child);
311
310
  });
312
311
  return ret;
313
- }
312
+ }
313
+
314
+ var getStyle = function getStyle(props) {
315
+ if (props.align === 'right') {
316
+ return {
317
+ maxWidth: props.width,
318
+ minWidth: props.width,
319
+ maxHeight: props.maxHeight
320
+ };
321
+ }
322
+
323
+ return {
324
+ width: props.width,
325
+ maxHeight: props.maxHeight
326
+ };
327
+ };
328
+
329
+ var getAlignRightClass = function getAlignRightClass(props) {
330
+ if (props.align === 'right') {
331
+ var _cx2;
332
+
333
+ return cx((_cx2 = {}, _cx2[styles.alignRight()] = !isIE11, _cx2[styles.alignRightIE11()] = isIE11, _cx2[styles.alignRightIE11FixAutoWidth()] = isIE11 && props.width === 'auto', _cx2));
334
+ }
335
+
336
+ return null;
337
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["Menu.tsx"],"names":["React","ScrollContainer","isMenuItem","isMenuHeader","ThemeContext","cx","getRootNode","rootNode","styles","isActiveElement","Menu","state","highlightedIndex","theme","scrollContainer","highlighted","unmounted","setRootNode","refScrollContainer","scrollToSelected","scrollTo","scrollToTop","scrollToBottom","highlight","index","setState","unhighlight","componentWillUnmount","render","renderMain","up","move","down","enter","event","select","reset","hasHighlightedItem","highlightItem","enableIconPadding","Children","toArray","props","children","some","x","isValidElement","icon","isEmpty","root","shadow","hasShadow","width","maxHeight","preventWindowScroll","map","child","cloneElement","_enableIconPadding","ref","refHighlighted","bind","onClick","onMouseEnter","onMouseLeave","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","length","indexOf","isExist","Component","__KONTUR_REACT_UI__","defaultProps","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ScrollContainer } from '../../components/ScrollContainer';\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\nimport { isMenuHeader } from '../../components/MenuHeader';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Menu.styles';\nimport { isActiveElement } from './isActiveElement';\n\nexport interface MenuProps {\n children: React.ReactNode;\n hasShadow?: boolean;\n maxHeight?: number | string;\n onItemClick?: () => void;\n width?: number | string;\n preventWindowScroll?: boolean;\n}\n\nexport interface MenuState {\n highlightedIndex: number;\n}\n\n@rootNode\nexport class Menu extends React.Component<MenuProps, MenuState> {\n public static __KONTUR_REACT_UI__ = 'Menu';\n\n public static defaultProps = {\n width: 'auto',\n maxHeight: 300,\n hasShadow: true,\n preventWindowScroll: true,\n };\n\n public state = {\n highlightedIndex: -1,\n };\n\n private theme!: Theme;\n private scrollContainer: Nullable<ScrollContainer>;\n private highlighted: Nullable<MenuItem>;\n private unmounted = false;\n private setRootNode!: TSetRootNode;\n\n public componentWillUnmount() {\n this.unmounted = true;\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public up() {\n this.move(-1);\n }\n\n /**\n * @public\n */\n public down() {\n this.move(1);\n }\n\n /**\n * @public\n */\n public enter(event: React.SyntheticEvent<HTMLElement>) {\n return this.select(this.state.highlightedIndex, true, event);\n }\n\n /**\n * @public\n */\n public reset() {\n this.setState({ highlightedIndex: -1 });\n }\n\n /**\n * @public\n */\n public hasHighlightedItem() {\n return this.state.highlightedIndex !== -1;\n }\n\n public highlightItem(index: number) {\n this.highlight(index);\n }\n\n private renderMain() {\n const enableIconPadding = React.Children.toArray(this.props.children).some(\n (x) => React.isValidElement(x) && x.props.icon,\n );\n\n if (this.isEmpty()) {\n return null;\n }\n\n return (\n <div\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.shadow(this.theme)]: this.props.hasShadow,\n })}\n style={{ width: this.props.width, maxHeight: this.props.maxHeight }}\n ref={this.setRootNode}\n >\n <ScrollContainer\n ref={this.refScrollContainer}\n maxHeight={this.props.maxHeight}\n preventWindowScroll={this.props.preventWindowScroll}\n >\n <div className={styles.scrollContainer(this.theme)}>\n {React.Children.map(this.props.children, (child, index) => {\n if (!child) {\n return child;\n }\n if (typeof child === 'string' || typeof child === 'number') {\n return child;\n }\n\n if (enableIconPadding && (isMenuItem(child) || isMenuHeader(child))) {\n child = React.cloneElement(child, {\n _enableIconPadding: true,\n });\n }\n if (isActiveElement(child)) {\n const highlight = this.state.highlightedIndex === index;\n\n let ref = child.ref;\n if (highlight && typeof child.ref !== 'string') {\n ref = this.refHighlighted.bind(this, child.ref);\n }\n\n return React.cloneElement<MenuItemProps, MenuItem>(child, {\n ref,\n state: highlight ? 'hover' : child.props.state,\n onClick: this.select.bind(this, index, false),\n onMouseEnter: this.highlight.bind(this, index),\n onMouseLeave: this.unhighlight,\n });\n }\n return child;\n })}\n </div>\n </ScrollContainer>\n </div>\n );\n }\n\n private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n this.scrollContainer = scrollContainer;\n };\n\n private refHighlighted(\n originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\n menuItem: MenuItem | null,\n ) {\n this.highlighted = menuItem;\n\n if (typeof originalRef === 'function') {\n originalRef(menuItem);\n }\n }\n\n private scrollToSelected = () => {\n if (this.scrollContainer && this.highlighted) {\n this.scrollContainer.scrollTo(getRootNode(this.highlighted));\n }\n };\n\n private scrollToTop = () => {\n if (this.scrollContainer) {\n this.scrollContainer.scrollToTop();\n }\n };\n\n private scrollToBottom = () => {\n if (this.scrollContainer) {\n this.scrollContainer.scrollToBottom();\n }\n };\n\n private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\n const item = childrenToArray(this.props.children)[index];\n if (isActiveElement(item)) {\n if (shouldHandleHref && item.props.href) {\n if (item.props.target) {\n window.open(item.props.href, item.props.target);\n } else {\n location.href = item.props.href;\n }\n }\n if (item.props.onClick) {\n item.props.onClick(event);\n }\n if (this.props.onItemClick) {\n this.props.onItemClick();\n }\n return true;\n }\n return false;\n }\n\n private highlight = (index: number) => {\n this.setState({ highlightedIndex: index });\n };\n\n private unhighlight = () => {\n this.setState({ highlightedIndex: -1 });\n };\n\n private move(step: number) {\n if (this.unmounted) {\n // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n return;\n }\n\n const children = childrenToArray(this.props.children);\n const activeElements = children.filter(isActiveElement);\n if (!activeElements.length) {\n return;\n }\n let index = this.state.highlightedIndex;\n do {\n index += step;\n if (index < 0) {\n index = children.length - 1;\n } else if (index > children.length) {\n index = 0;\n }\n\n const child = children[index];\n if (isActiveElement(child)) {\n this.setState({ highlightedIndex: index }, () => {\n switch (activeElements.indexOf(child)) {\n case 0:\n this.scrollToTop();\n break;\n case activeElements.length - 1:\n this.scrollToBottom();\n break;\n default:\n this.scrollToSelected();\n }\n });\n return;\n }\n } while (index !== this.state.highlightedIndex);\n }\n\n private isEmpty() {\n const { children } = this.props;\n return !children || !childrenToArray(children).filter(isExist).length;\n }\n}\n\nfunction isExist(value: any): value is any {\n return value !== null && value !== undefined;\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n const ret: React.ReactNode[] = [];\n // Use forEach instead of map to avoid cloning for key unifying.\n React.Children.forEach(children, (child) => {\n ret.push(child);\n });\n return ret;\n}\n"]}
1
+ {"version":3,"sources":["Menu.tsx"],"names":["React","ScrollContainer","isMenuItem","isMenuHeader","ThemeContext","cx","getRootNode","rootNode","isIE11","styles","isActiveElement","Menu","state","highlightedIndex","theme","scrollContainer","highlighted","unmounted","setRootNode","refScrollContainer","scrollToSelected","scrollTo","scrollToTop","scrollToBottom","highlight","index","setState","unhighlight","componentWillUnmount","render","renderMain","up","move","down","enter","event","select","reset","hasHighlightedItem","highlightItem","enableIconPadding","Children","toArray","props","children","some","x","isValidElement","icon","isEmpty","getAlignRightClass","root","shadow","hasShadow","getStyle","maxHeight","preventWindowScroll","map","child","cloneElement","_enableIconPadding","ref","refHighlighted","bind","onClick","onMouseEnter","onMouseLeave","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","length","indexOf","isExist","Component","__KONTUR_REACT_UI__","defaultProps","align","width","value","undefined","ret","forEach","push","maxWidth","minWidth","alignRight","alignRightIE11","alignRightIE11FixAutoWidth"],"mappings":"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","sourcesContent":["import React, { CSSProperties } from 'react';\n\nimport { ScrollContainer } from '../../components/ScrollContainer';\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\nimport { isMenuHeader } from '../../components/MenuHeader';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { isIE11 } from '../../lib/client';\n\nimport { styles } from './Menu.styles';\nimport { isActiveElement } from './isActiveElement';\n\nexport interface MenuProps {\n children: React.ReactNode;\n hasShadow?: boolean;\n maxHeight?: number | string;\n onItemClick?: () => void;\n width?: number | string;\n preventWindowScroll?: boolean;\n align?: 'left' | 'right';\n}\n\nexport interface MenuState {\n highlightedIndex: number;\n}\n\n@rootNode\nexport class Menu extends React.Component<MenuProps, MenuState> {\n public static __KONTUR_REACT_UI__ = 'Menu';\n\n public static defaultProps = {\n align: 'left',\n width: 'auto',\n maxHeight: 300,\n hasShadow: true,\n preventWindowScroll: true,\n };\n\n public state = {\n highlightedIndex: -1,\n };\n\n private theme!: Theme;\n private scrollContainer: Nullable<ScrollContainer>;\n private highlighted: Nullable<MenuItem>;\n private unmounted = false;\n private setRootNode!: TSetRootNode;\n\n public componentWillUnmount() {\n this.unmounted = true;\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public up() {\n this.move(-1);\n }\n\n /**\n * @public\n */\n public down() {\n this.move(1);\n }\n\n /**\n * @public\n */\n public enter(event: React.SyntheticEvent<HTMLElement>) {\n return this.select(this.state.highlightedIndex, true, event);\n }\n\n /**\n * @public\n */\n public reset() {\n this.setState({ highlightedIndex: -1 });\n }\n\n /**\n * @public\n */\n public hasHighlightedItem() {\n return this.state.highlightedIndex !== -1;\n }\n\n public highlightItem(index: number) {\n this.highlight(index);\n }\n\n private renderMain() {\n const enableIconPadding = React.Children.toArray(this.props.children).some(\n (x) => React.isValidElement(x) && x.props.icon,\n );\n\n if (this.isEmpty()) {\n return null;\n }\n\n return (\n <div\n className={cx(getAlignRightClass(this.props), {\n [styles.root(this.theme)]: true,\n [styles.shadow(this.theme)]: this.props.hasShadow,\n })}\n style={getStyle(this.props)}\n ref={this.setRootNode}\n >\n <ScrollContainer\n ref={this.refScrollContainer}\n maxHeight={this.props.maxHeight}\n preventWindowScroll={this.props.preventWindowScroll}\n >\n <div className={styles.scrollContainer(this.theme)}>\n {React.Children.map(this.props.children, (child, index) => {\n if (!child) {\n return child;\n }\n if (typeof child === 'string' || typeof child === 'number') {\n return child;\n }\n\n if (enableIconPadding && (isMenuItem(child) || isMenuHeader(child))) {\n child = React.cloneElement(child, {\n _enableIconPadding: true,\n });\n }\n if (isActiveElement(child)) {\n const highlight = this.state.highlightedIndex === index;\n\n let ref = child.ref;\n if (highlight && typeof child.ref !== 'string') {\n ref = this.refHighlighted.bind(this, child.ref);\n }\n\n return React.cloneElement<MenuItemProps, MenuItem>(child, {\n ref,\n state: highlight ? 'hover' : child.props.state,\n onClick: this.select.bind(this, index, false),\n onMouseEnter: this.highlight.bind(this, index),\n onMouseLeave: this.unhighlight,\n });\n }\n return child;\n })}\n </div>\n </ScrollContainer>\n </div>\n );\n }\n\n private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n this.scrollContainer = scrollContainer;\n };\n\n private refHighlighted(\n originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\n menuItem: MenuItem | null,\n ) {\n this.highlighted = menuItem;\n\n if (typeof originalRef === 'function') {\n originalRef(menuItem);\n }\n }\n\n private scrollToSelected = () => {\n if (this.scrollContainer && this.highlighted) {\n this.scrollContainer.scrollTo(getRootNode(this.highlighted));\n }\n };\n\n private scrollToTop = () => {\n if (this.scrollContainer) {\n this.scrollContainer.scrollToTop();\n }\n };\n\n private scrollToBottom = () => {\n if (this.scrollContainer) {\n this.scrollContainer.scrollToBottom();\n }\n };\n\n private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\n const item = childrenToArray(this.props.children)[index];\n if (isActiveElement(item)) {\n if (shouldHandleHref && item.props.href) {\n if (item.props.target) {\n window.open(item.props.href, item.props.target);\n } else {\n location.href = item.props.href;\n }\n }\n if (item.props.onClick) {\n item.props.onClick(event);\n }\n if (this.props.onItemClick) {\n this.props.onItemClick();\n }\n return true;\n }\n return false;\n }\n\n private highlight = (index: number) => {\n this.setState({ highlightedIndex: index });\n };\n\n private unhighlight = () => {\n this.setState({ highlightedIndex: -1 });\n };\n\n private move(step: number) {\n if (this.unmounted) {\n // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n return;\n }\n\n const children = childrenToArray(this.props.children);\n const activeElements = children.filter(isActiveElement);\n if (!activeElements.length) {\n return;\n }\n let index = this.state.highlightedIndex;\n do {\n index += step;\n if (index < 0) {\n index = children.length - 1;\n } else if (index > children.length) {\n index = 0;\n }\n\n const child = children[index];\n if (isActiveElement(child)) {\n this.setState({ highlightedIndex: index }, () => {\n switch (activeElements.indexOf(child)) {\n case 0:\n this.scrollToTop();\n break;\n case activeElements.length - 1:\n this.scrollToBottom();\n break;\n default:\n this.scrollToSelected();\n }\n });\n return;\n }\n } while (index !== this.state.highlightedIndex);\n }\n\n private isEmpty() {\n const { children } = this.props;\n return !children || !childrenToArray(children).filter(isExist).length;\n }\n}\n\nfunction isExist(value: any): value is any {\n return value !== null && value !== undefined;\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n const ret: React.ReactNode[] = [];\n // Use forEach instead of map to avoid cloning for key unifying.\n React.Children.forEach(children, (child) => {\n ret.push(child);\n });\n return ret;\n}\n\nconst getStyle = (props: MenuProps): CSSProperties => {\n if (props.align === 'right') {\n return {\n maxWidth: props.width,\n minWidth: props.width,\n maxHeight: props.maxHeight,\n };\n }\n\n return {\n width: props.width,\n maxHeight: props.maxHeight,\n };\n};\n\nconst getAlignRightClass = (props: MenuProps) => {\n if (props.align === 'right') {\n return cx({\n [styles.alignRight()]: !isIE11,\n [styles.alignRightIE11()]: isIE11,\n [styles.alignRightIE11FixAutoWidth()]: isIE11 && props.width === 'auto',\n });\n }\n\n return null;\n};\n"]}
@@ -6,6 +6,7 @@ export interface MenuProps {
6
6
  onItemClick?: () => void;
7
7
  width?: number | string;
8
8
  preventWindowScroll?: boolean;
9
+ align?: 'left' | 'right';
9
10
  }
10
11
  export interface MenuState {
11
12
  highlightedIndex: number;
@@ -13,6 +14,7 @@ export interface MenuState {
13
14
  export declare class Menu extends React.Component<MenuProps, MenuState> {
14
15
  static __KONTUR_REACT_UI__: string;
15
16
  static defaultProps: {
17
+ align: string;
16
18
  width: string;
17
19
  maxHeight: number;
18
20
  hasShadow: boolean;