@skbkontur/react-ui 4.0.3 → 4.0.6
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.
- package/CHANGELOG.md +42 -0
- package/cjs/components/Autocomplete/Autocomplete.d.ts +0 -1
- package/cjs/components/Autocomplete/Autocomplete.js +2 -9
- package/cjs/components/Autocomplete/Autocomplete.js.map +1 -1
- package/cjs/components/Button/Button.d.ts +2 -2
- package/cjs/components/Button/Button.js.map +1 -1
- package/cjs/components/Button/Button.styles.js +1 -1
- package/cjs/components/Button/Button.styles.js.map +1 -1
- package/cjs/components/Checkbox/Checkbox.d.ts +2 -2
- package/cjs/components/Checkbox/Checkbox.js.map +1 -1
- package/cjs/components/ComboBox/ComboBox.d.ts +3 -3
- package/cjs/components/ComboBox/ComboBox.js.map +1 -1
- package/cjs/components/CurrencyInput/CurrencyInput.d.ts +1 -1
- package/cjs/components/CurrencyInput/CurrencyInput.js +3 -3
- package/cjs/components/CurrencyInput/CurrencyInput.js.map +1 -1
- package/cjs/components/DateInput/DateInput.d.ts +2 -2
- package/cjs/components/DateInput/DateInput.js.map +1 -1
- package/cjs/components/DateInput/DateInput.styles.js +2 -2
- package/cjs/components/DateInput/DateInput.styles.js.map +1 -1
- package/cjs/components/DatePicker/DatePicker.d.ts +3 -3
- package/cjs/components/DatePicker/DatePicker.js.map +1 -1
- package/cjs/components/Dropdown/Dropdown.d.ts +2 -2
- package/cjs/components/Dropdown/Dropdown.js.map +1 -1
- package/cjs/components/Hint/Hint.d.ts +6 -2
- package/cjs/components/Hint/Hint.js +9 -1
- package/cjs/components/Hint/Hint.js.map +1 -1
- package/cjs/components/Input/Input.d.ts +3 -3
- package/cjs/components/Input/Input.js +1 -1
- package/cjs/components/Input/Input.js.map +1 -1
- package/cjs/components/Loader/Loader.js +7 -7
- package/cjs/components/Loader/Loader.js.map +1 -1
- package/cjs/components/Modal/Modal.d.ts +1 -1
- package/cjs/components/Modal/Modal.js +1 -1
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.js +0 -1
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/Modal/ModalHeader.js +0 -1
- package/cjs/components/Modal/ModalHeader.js.map +1 -1
- package/cjs/components/Radio/Radio.d.ts +2 -2
- package/cjs/components/Radio/Radio.js.map +1 -1
- package/cjs/components/RadioGroup/RadioGroup.d.ts +2 -2
- package/cjs/components/RadioGroup/RadioGroup.js.map +1 -1
- package/cjs/components/ResponsiveLayout/ResponsiveLayoutEvents.d.ts +1 -1
- package/cjs/components/ResponsiveLayout/ResponsiveLayoutEvents.js.map +1 -1
- package/cjs/components/ScrollContainer/ScrollContainer.js +3 -2
- package/cjs/components/ScrollContainer/ScrollContainer.js.map +1 -1
- package/cjs/components/Select/Select.d.ts +10 -8
- package/cjs/components/Select/Select.js +12 -2
- package/cjs/components/Select/Select.js.map +1 -1
- package/cjs/components/SidePage/SidePage.d.ts +0 -1
- package/cjs/components/SidePage/SidePage.js +1 -15
- package/cjs/components/SidePage/SidePage.js.map +1 -1
- package/cjs/components/SidePage/SidePageFooter.js +4 -3
- package/cjs/components/SidePage/SidePageFooter.js.map +1 -1
- package/cjs/components/SidePage/SidePageHeader.js +3 -2
- package/cjs/components/SidePage/SidePageHeader.js.map +1 -1
- package/cjs/components/Sticky/Sticky.js +4 -3
- package/cjs/components/Sticky/Sticky.js.map +1 -1
- package/cjs/components/Switcher/Switcher.d.ts +2 -1
- package/cjs/components/Switcher/Switcher.js +1 -0
- package/cjs/components/Switcher/Switcher.js.map +1 -1
- package/cjs/components/Tabs/Indicator.js +2 -1
- package/cjs/components/Tabs/Indicator.js.map +1 -1
- package/cjs/components/Tabs/Tab.d.ts +2 -2
- package/cjs/components/Tabs/Tab.js.map +1 -1
- package/cjs/components/Tabs/Tabs.d.ts +3 -1
- package/cjs/components/Tabs/Tabs.js +8 -4
- package/cjs/components/Tabs/Tabs.js.map +1 -1
- package/cjs/components/Textarea/Textarea.d.ts +4 -4
- package/cjs/components/Textarea/Textarea.js.map +1 -1
- package/cjs/components/Toggle/Toggle.d.ts +2 -2
- package/cjs/components/Toggle/Toggle.js.map +1 -1
- package/cjs/components/Token/Token.d.ts +2 -2
- package/cjs/components/Token/Token.js.map +1 -1
- package/cjs/components/TokenInput/TextWidthHelper.js +2 -1
- package/cjs/components/TokenInput/TextWidthHelper.js.map +1 -1
- package/cjs/components/TokenInput/TokenInput.d.ts +2 -2
- package/cjs/components/TokenInput/TokenInput.js +1 -1
- package/cjs/components/TokenInput/TokenInput.js.map +1 -1
- package/cjs/components/Tooltip/Tooltip.d.ts +4 -2
- package/cjs/components/Tooltip/Tooltip.js +10 -7
- package/cjs/components/Tooltip/Tooltip.js.map +1 -1
- package/cjs/internal/BGRuler.js +3 -1
- package/cjs/internal/BGRuler.js.map +1 -1
- package/cjs/internal/CommonWrapper/CommonWrapper.d.ts +1 -0
- package/cjs/internal/CommonWrapper/CommonWrapper.js +15 -1
- package/cjs/internal/CommonWrapper/CommonWrapper.js.map +1 -1
- package/cjs/internal/ComponentTable.d.ts +4 -2
- package/cjs/internal/ComponentTable.js +1 -0
- package/cjs/internal/ComponentTable.js.map +1 -1
- package/cjs/internal/DateSelect/DateSelect.js +2 -1
- package/cjs/internal/DateSelect/DateSelect.js.map +1 -1
- package/cjs/internal/DropdownContainer/DropdownContainer.js +5 -10
- package/cjs/internal/DropdownContainer/DropdownContainer.js.map +1 -1
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js +3 -2
- package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js.map +1 -1
- package/cjs/internal/InternalMenu/InternalMenu.js +3 -2
- package/cjs/internal/InternalMenu/InternalMenu.js.map +1 -1
- package/cjs/internal/Popup/Popup.d.ts +1 -2
- package/cjs/internal/Popup/Popup.js +16 -13
- package/cjs/internal/Popup/Popup.js.map +1 -1
- package/cjs/internal/Popup/PopupHelper.js +4 -2
- package/cjs/internal/Popup/PopupHelper.js.map +1 -1
- package/cjs/internal/RenderContainer/RenderContainer.js +9 -0
- package/cjs/internal/RenderContainer/RenderContainer.js.map +1 -1
- package/cjs/internal/RenderContainer/RenderContainerTypes.d.ts +1 -0
- package/cjs/internal/TextWidthHelper/TextWidthHelper.js +3 -1
- package/cjs/internal/TextWidthHelper/TextWidthHelper.js.map +1 -1
- package/cjs/internal/ThemePlayground/CheckboxPlayground.js +1 -0
- package/cjs/internal/ThemePlayground/CheckboxPlayground.js.map +1 -1
- package/cjs/internal/ThemePlayground/RadioPlayground.js.map +1 -1
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js +3 -12
- package/cjs/internal/ThemePlayground/ThemeContextPlayground.js.map +1 -1
- package/cjs/internal/ThemePlayground/ThemeEditor.js +2 -0
- package/cjs/internal/ThemePlayground/ThemeEditor.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/cjs/internal/themes/DefaultTheme.d.ts +1 -0
- package/cjs/internal/themes/DefaultTheme.js +3 -0
- package/cjs/internal/themes/DefaultTheme.js.map +1 -1
- package/cjs/lib/ConditionalHandler.d.ts +3 -2
- package/cjs/lib/ConditionalHandler.js +5 -3
- package/cjs/lib/ConditionalHandler.js.map +1 -1
- package/cjs/lib/InstanceWithAnchorElement.d.ts +5 -0
- package/cjs/lib/InstanceWithAnchorElement.js +9 -0
- package/cjs/lib/InstanceWithAnchorElement.js.map +1 -0
- package/cjs/lib/ModalStack.d.ts +1 -1
- package/cjs/lib/ModalStack.js.map +1 -1
- package/cjs/lib/SSRSafe.d.ts +1 -0
- package/cjs/lib/SSRSafe.js +9 -1
- package/cjs/lib/SSRSafe.js.map +1 -1
- package/cjs/lib/dom/getDOMRect.d.ts +5 -2
- package/cjs/lib/dom/getDOMRect.js +30 -18
- package/cjs/lib/dom/getDOMRect.js.map +1 -1
- package/cjs/lib/events/keyboard/KeyboardMapKeys.d.ts +2 -1
- package/cjs/lib/events/keyboard/KeyboardMapKeys.js +1 -0
- package/cjs/lib/events/keyboard/KeyboardMapKeys.js.map +1 -1
- package/cjs/lib/events/keyboard/extractCode.js.map +1 -1
- package/cjs/lib/rootNode/getRootNode.js +12 -9
- package/cjs/lib/rootNode/getRootNode.js.map +1 -1
- package/cjs/lib/rootNode/rootNodeDecorator.d.ts +11 -0
- package/cjs/lib/rootNode/rootNodeDecorator.js +32 -4
- package/cjs/lib/rootNode/rootNodeDecorator.js.map +1 -1
- package/cjs/lib/theming/ThemeFactory.d.ts +1 -1
- package/cjs/lib/theming/ThemeFactory.js +4 -3
- package/cjs/lib/theming/ThemeFactory.js.map +1 -1
- package/cjs/lib/theming/ThemeHelpers.d.ts +1 -0
- package/cjs/lib/theming/ThemeHelpers.js +11 -2
- package/cjs/lib/theming/ThemeHelpers.js.map +1 -1
- package/components/Autocomplete/Autocomplete/Autocomplete.js +2 -9
- package/components/Autocomplete/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Autocomplete/Autocomplete.d.ts +0 -1
- package/components/Button/Button/Button.js.map +1 -1
- package/components/Button/Button.d.ts +2 -2
- package/components/Button/Button.styles/Button.styles.js +1 -1
- package/components/Button/Button.styles/Button.styles.js.map +1 -1
- package/components/Checkbox/Checkbox/Checkbox.js.map +1 -1
- package/components/Checkbox/Checkbox.d.ts +2 -2
- package/components/ComboBox/ComboBox/ComboBox.js.map +1 -1
- package/components/ComboBox/ComboBox.d.ts +3 -3
- package/components/CurrencyInput/CurrencyInput/CurrencyInput.js +3 -3
- package/components/CurrencyInput/CurrencyInput/CurrencyInput.js.map +1 -1
- package/components/CurrencyInput/CurrencyInput.d.ts +1 -1
- package/components/DateInput/DateInput/DateInput.js.map +1 -1
- package/components/DateInput/DateInput.d.ts +2 -2
- package/components/DateInput/DateInput.styles/DateInput.styles.js +2 -2
- package/components/DateInput/DateInput.styles/DateInput.styles.js.map +1 -1
- package/components/DatePicker/DatePicker/DatePicker.js.map +1 -1
- package/components/DatePicker/DatePicker.d.ts +3 -3
- package/components/Dropdown/Dropdown/Dropdown.js.map +1 -1
- package/components/Dropdown/Dropdown.d.ts +2 -2
- package/components/Hint/Hint/Hint.js +9 -1
- package/components/Hint/Hint/Hint.js.map +1 -1
- package/components/Hint/Hint.d.ts +6 -2
- package/components/Input/Input/Input.js +1 -1
- package/components/Input/Input/Input.js.map +1 -1
- package/components/Input/Input.d.ts +3 -3
- package/components/Loader/Loader/Loader.js +11 -12
- package/components/Loader/Loader/Loader.js.map +1 -1
- package/components/Modal/Modal/Modal.js +1 -1
- package/components/Modal/Modal/Modal.js.map +1 -1
- package/components/Modal/Modal.d.ts +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
- package/components/Radio/Radio/Radio.js.map +1 -1
- package/components/Radio/Radio.d.ts +2 -2
- package/components/RadioGroup/RadioGroup/RadioGroup.js.map +1 -1
- package/components/RadioGroup/RadioGroup.d.ts +2 -2
- package/components/ResponsiveLayout/ResponsiveLayoutEvents/ResponsiveLayoutEvents.js.map +1 -1
- package/components/ResponsiveLayout/ResponsiveLayoutEvents.d.ts +1 -1
- package/components/ScrollContainer/ScrollContainer/ScrollContainer.js +3 -2
- package/components/ScrollContainer/ScrollContainer/ScrollContainer.js.map +1 -1
- package/components/Select/Select/Select.js +12 -6
- package/components/Select/Select/Select.js.map +1 -1
- package/components/Select/Select.d.ts +10 -8
- package/components/SidePage/SidePage/SidePage.js +0 -19
- package/components/SidePage/SidePage/SidePage.js.map +1 -1
- package/components/SidePage/SidePage.d.ts +0 -1
- package/components/SidePage/SidePageFooter/SidePageFooter.js +4 -4
- package/components/SidePage/SidePageFooter/SidePageFooter.js.map +1 -1
- package/components/SidePage/SidePageHeader/SidePageHeader.js +3 -3
- package/components/SidePage/SidePageHeader/SidePageHeader.js.map +1 -1
- package/components/Sticky/Sticky/Sticky.js +9 -8
- package/components/Sticky/Sticky/Sticky.js.map +1 -1
- package/components/Switcher/Switcher/Switcher.js.map +1 -1
- package/components/Switcher/Switcher.d.ts +2 -1
- package/components/Tabs/Indicator/Indicator.js +2 -1
- package/components/Tabs/Indicator/Indicator.js.map +1 -1
- package/components/Tabs/Tab/Tab.js.map +1 -1
- package/components/Tabs/Tab.d.ts +2 -2
- package/components/Tabs/Tabs/Tabs.js.map +1 -1
- package/components/Tabs/Tabs.d.ts +3 -1
- package/components/Textarea/Textarea/Textarea.js.map +1 -1
- package/components/Textarea/Textarea.d.ts +4 -4
- package/components/Toggle/Toggle/Toggle.js.map +1 -1
- package/components/Toggle/Toggle.d.ts +2 -2
- package/components/Token/Token/Token.js.map +1 -1
- package/components/Token/Token.d.ts +2 -2
- package/components/TokenInput/TextWidthHelper/TextWidthHelper.js +3 -2
- package/components/TokenInput/TextWidthHelper/TextWidthHelper.js.map +1 -1
- package/components/TokenInput/TokenInput/TokenInput.js +1 -1
- package/components/TokenInput/TokenInput/TokenInput.js.map +1 -1
- package/components/TokenInput/TokenInput.d.ts +2 -2
- package/components/Tooltip/Tooltip/Tooltip.js +11 -8
- package/components/Tooltip/Tooltip/Tooltip.js.map +1 -1
- package/components/Tooltip/Tooltip.d.ts +4 -2
- package/internal/BGRuler/BGRuler.js +2 -1
- package/internal/BGRuler/BGRuler.js.map +1 -1
- package/internal/CommonWrapper/CommonWrapper/CommonWrapper.js +17 -3
- package/internal/CommonWrapper/CommonWrapper/CommonWrapper.js.map +1 -1
- package/internal/CommonWrapper/CommonWrapper.d.ts +1 -0
- package/internal/ComponentTable/ComponentTable.js.map +1 -1
- package/internal/ComponentTable.d.ts +4 -2
- package/internal/DateSelect/DateSelect/DateSelect.js +2 -1
- package/internal/DateSelect/DateSelect/DateSelect.js.map +1 -1
- package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js +5 -12
- package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js.map +1 -1
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile/FileUploaderFile.js +3 -2
- package/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile/FileUploaderFile.js.map +1 -1
- package/internal/InternalMenu/InternalMenu/InternalMenu.js +2 -1
- package/internal/InternalMenu/InternalMenu/InternalMenu.js.map +1 -1
- package/internal/Popup/Popup/Popup.js +22 -21
- package/internal/Popup/Popup/Popup.js.map +1 -1
- package/internal/Popup/Popup.d.ts +1 -2
- package/internal/Popup/PopupHelper/PopupHelper.js +3 -1
- package/internal/Popup/PopupHelper/PopupHelper.js.map +1 -1
- package/internal/RenderContainer/RenderContainer/RenderContainer.js +9 -0
- package/internal/RenderContainer/RenderContainer/RenderContainer.js.map +1 -1
- package/internal/RenderContainer/RenderContainerTypes.d.ts +1 -0
- package/internal/TextWidthHelper/TextWidthHelper/TextWidthHelper.js +3 -4
- package/internal/TextWidthHelper/TextWidthHelper/TextWidthHelper.js.map +1 -1
- package/internal/ThemePlayground/CheckboxPlayground/CheckboxPlayground.js.map +1 -1
- package/internal/ThemePlayground/RadioPlayground/RadioPlayground.js.map +1 -1
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js +2 -11
- package/internal/ThemePlayground/ThemeContextPlayground/ThemeContextPlayground.js.map +1 -1
- package/internal/ThemePlayground/ThemeEditor/ThemeEditor.js.map +1 -1
- package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/internal/themes/DefaultTheme/DefaultTheme.js +5 -0
- package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
- package/internal/themes/DefaultTheme.d.ts +1 -0
- package/lib/ConditionalHandler/ConditionalHandler.js.map +1 -1
- package/lib/ConditionalHandler.d.ts +3 -2
- package/lib/InstanceWithAnchorElement/InstanceWithAnchorElement.js +3 -0
- package/lib/InstanceWithAnchorElement/InstanceWithAnchorElement.js.map +1 -0
- package/lib/InstanceWithAnchorElement/package.json +6 -0
- package/lib/InstanceWithAnchorElement.d.ts +5 -0
- package/lib/ModalStack/ModalStack.js.map +1 -1
- package/lib/ModalStack.d.ts +1 -1
- package/lib/SSRSafe/SSRSafe.js +7 -0
- package/lib/SSRSafe/SSRSafe.js.map +1 -1
- package/lib/SSRSafe.d.ts +1 -0
- package/lib/dom/getDOMRect/getDOMRect.js +32 -15
- package/lib/dom/getDOMRect/getDOMRect.js.map +1 -1
- package/lib/dom/getDOMRect.d.ts +5 -2
- package/lib/events/keyboard/KeyboardMapKeys/KeyboardMapKeys.js.map +1 -1
- package/lib/events/keyboard/KeyboardMapKeys.d.ts +2 -1
- package/lib/events/keyboard/extractCode/extractCode.js.map +1 -1
- package/lib/rootNode/getRootNode/getRootNode.js +10 -10
- package/lib/rootNode/getRootNode/getRootNode.js.map +1 -1
- package/lib/rootNode/rootNodeDecorator/rootNodeDecorator.js +24 -2
- package/lib/rootNode/rootNodeDecorator/rootNodeDecorator.js.map +1 -1
- package/lib/rootNode/rootNodeDecorator.d.ts +11 -0
- package/lib/theming/ThemeFactory/ThemeFactory.js +3 -2
- package/lib/theming/ThemeFactory/ThemeFactory.js.map +1 -1
- package/lib/theming/ThemeFactory.d.ts +1 -1
- package/lib/theming/ThemeHelpers/ThemeHelpers.js +10 -1
- package/lib/theming/ThemeHelpers/ThemeHelpers.js.map +1 -1
- package/lib/theming/ThemeHelpers.d.ts +1 -0
- package/package.json +4 -2
|
@@ -12,6 +12,7 @@ import { ZIndex } from "../../../internal/ZIndex";
|
|
|
12
12
|
import { CommonWrapper } from "../../../internal/CommonWrapper";
|
|
13
13
|
import { cx } from "../../../lib/theming/Emotion";
|
|
14
14
|
import { rootNode } from "../../../lib/rootNode";
|
|
15
|
+
import { getDOMRect } from "../../../lib/dom/getDOMRect";
|
|
15
16
|
import { styles } from "../Sticky.styles";
|
|
16
17
|
var MAX_REFLOW_RETRIES = 5;
|
|
17
18
|
export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
|
|
@@ -58,14 +59,14 @@ export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
|
|
|
58
59
|
return;
|
|
59
60
|
}
|
|
60
61
|
|
|
61
|
-
var
|
|
62
|
-
top =
|
|
63
|
-
bottom =
|
|
64
|
-
left =
|
|
62
|
+
var _getDOMRect = getDOMRect(_this.wrapper),
|
|
63
|
+
top = _getDOMRect.top,
|
|
64
|
+
bottom = _getDOMRect.bottom,
|
|
65
|
+
left = _getDOMRect.left;
|
|
65
66
|
|
|
66
|
-
var
|
|
67
|
-
width =
|
|
68
|
-
height =
|
|
67
|
+
var _getDOMRect2 = getDOMRect(_this.inner),
|
|
68
|
+
width = _getDOMRect2.width,
|
|
69
|
+
height = _getDOMRect2.height;
|
|
69
70
|
|
|
70
71
|
var _this$props = _this.props,
|
|
71
72
|
offset = _this$props.offset,
|
|
@@ -94,7 +95,7 @@ export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
|
|
|
94
95
|
|
|
95
96
|
if (stop) {
|
|
96
97
|
var deltaHeight = prevHeight - height;
|
|
97
|
-
var stopRect = stop
|
|
98
|
+
var stopRect = getDOMRect(stop);
|
|
98
99
|
var outerHeight = height + offset;
|
|
99
100
|
var stopped = false;
|
|
100
101
|
var relativeTop = 0;
|
|
@@ -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","layoutSubscription","remove","reflowCounter","refWrapper","ref","wrapper","refInner","inner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","getBoundingClientRect","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","Math","floor","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","setRootNode","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 : Math.floor(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","getDOMRect","styles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","layoutSubscription","remove","reflowCounter","refWrapper","ref","wrapper","refInner","inner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","Math","floor","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","setRootNode","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';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\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 } = getDOMRect(this.wrapper);\n const { width, height } = getDOMRect(this.inner);\n const { offset, getStop, side } = this.props;\n const { fixed: prevFixed, height: prevHeight = height } = this.state;\n const fixed = side === 'top' ? top < offset : Math.floor(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 = getDOMRect(stop);\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 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Switcher.tsx"],"names":["React","PropTypes","isKeyArrowHorizontal","isKeyArrowLeft","isKeyEnter","Group","Button","ThemeContext","CommonWrapper","cx","rootNode","styles","getSwitcherTheme","Switcher","state","focusedIndex","selectItem","value","props","onValueChange","_extractPropsFromItem","item","label","_extractValuesFromItems","items","map","move","step","selectedIndex","length","_focus","index","setState","handleKey","e","preventDefault","_handleFocus","currentIndex","indexOf","_handleBlur","_renderItems","i","buttonProps","checked","visuallyFocused","onClick","disableFocus","size","disabled","getLabelSizeClassName","captionLarge","theme","captionMedium","captionSmall","render","renderMain","listClassName","error","inputProps","type","onKeyDown","onFocus","onBlur","className","input","captionClassName","caption","setRootNode","root","wrap","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","arrayOf","string","shape","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isKeyArrowHorizontal, isKeyArrowLeft, isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { Group } from '../Group';\nimport { Button, ButtonSize } from '../Button';\nimport { Nullable } from '../../typings/utility-types';\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 { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Switcher.styles';\nimport { getSwitcherTheme } from './switcherTheme';\n\nexport type SwitcherSize = ButtonSize;\n\nexport interface SwitcherProps extends CommonProps {\n /**\n * Список строк или список элементов типа `{ label: string, value: string }`\n */\n items: Array<string | SwitcherItem>;\n\n value?: string;\n\n onValueChange?: (value: string) => void;\n\n caption?: string;\n\n error?: boolean;\n\n /** Размер */\n size?: SwitcherSize;\n\n disabled?: boolean;\n}\n\nexport interface SwitcherState {\n focusedIndex: Nullable<number>;\n}\n\ninterface SwitcherItem {\n label: string;\n value: string;\n}\n\n@rootNode\nexport class Switcher extends React.Component<SwitcherProps, SwitcherState> {\n public static __KONTUR_REACT_UI__ = 'Switcher';\n\n public static propTypes = {\n error: PropTypes.bool,\n disabled: PropTypes.bool,\n items: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n }),\n ),\n ]).isRequired,\n caption: PropTypes.string,\n value: PropTypes.string,\n onValueChange: PropTypes.func,\n };\n\n public state: SwitcherState = {\n focusedIndex: null,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = getSwitcherTheme(theme);\n return <ThemeContext.Provider value={this.theme}>{this.renderMain()}</ThemeContext.Provider>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const listClassName = cx({\n [styles.error(this.theme)]: !!this.props.error,\n });\n\n const inputProps = {\n type: 'checkbox',\n onKeyDown: this.handleKey,\n onFocus: this._handleFocus,\n onBlur: this._handleBlur,\n className: styles.input(),\n };\n\n const captionClassName = cx(styles.caption(this.theme), this.getLabelSizeClassName());\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={styles.root()}>\n {this.props.caption ? <div className={captionClassName}>{this.props.caption}</div> : null}\n <div className={styles.wrap()}>\n <input {...inputProps} />\n <div className={listClassName}>\n <Group>{this._renderItems()}</Group>\n </div>\n </div>\n </div>\n </CommonWrapper>\n );\n }\n\n private selectItem = (value: string) => {\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n };\n\n private _extractPropsFromItem = (item: string | SwitcherItem): SwitcherItem => {\n return typeof item === 'object' ? item : { label: item, value: item };\n };\n\n private _extractValuesFromItems = (): string[] => {\n return this.props.items.map((item) => {\n const { value } = this._extractPropsFromItem(item);\n return value;\n });\n };\n\n private move = (step: number) => {\n let selectedIndex = this.state.focusedIndex;\n\n if (typeof selectedIndex !== 'number') {\n return;\n }\n\n const items = this._extractValuesFromItems();\n\n selectedIndex += step;\n\n if (selectedIndex < 0) {\n selectedIndex = items.length - 1;\n } else if (selectedIndex >= items.length) {\n selectedIndex = 0;\n }\n\n this._focus(selectedIndex);\n };\n\n private _focus = (index: number) => {\n this.setState({ focusedIndex: index });\n };\n\n private handleKey = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const focusedIndex = this.state.focusedIndex;\n if (typeof focusedIndex !== 'number') {\n return;\n }\n\n if (isKeyEnter(e)) {\n if (this.props.onValueChange) {\n const { value } = this._extractPropsFromItem(this.props.items[focusedIndex]);\n this.selectItem(value);\n }\n return;\n }\n\n if (isKeyArrowHorizontal(e)) {\n e.preventDefault();\n this.move(isKeyArrowLeft(e) ? -1 : 1);\n }\n };\n\n private _handleFocus = () => {\n const { value } = this.props;\n\n const items = this._extractValuesFromItems();\n const currentIndex = [...items].indexOf(value as string);\n const index = currentIndex > -1 ? currentIndex : 0;\n\n this.setState({ focusedIndex: index });\n };\n\n private _handleBlur = () => {\n this.setState({ focusedIndex: null });\n };\n\n private _renderItems = () => {\n return this.props.items.map((item, i) => {\n const { label, value } = this._extractPropsFromItem(item);\n const buttonProps = {\n checked: this.props.value === value,\n visuallyFocused: this.state.focusedIndex === i,\n onClick: () => {\n this.selectItem(value);\n },\n disableFocus: true,\n size: this.props.size,\n disabled: this.props.disabled,\n };\n return (\n <Button key={value} {...buttonProps}>\n {label}\n </Button>\n );\n });\n };\n\n private getLabelSizeClassName = (): string => {\n switch (this.props.size) {\n case 'large':\n return styles.captionLarge(this.theme);\n case 'medium':\n return styles.captionMedium(this.theme);\n case 'small':\n default:\n return styles.captionSmall(this.theme);\n }\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Switcher.tsx"],"names":["React","PropTypes","isKeyArrowHorizontal","isKeyArrowLeft","isKeyEnter","Group","Button","ThemeContext","CommonWrapper","cx","rootNode","styles","getSwitcherTheme","Switcher","state","focusedIndex","selectItem","value","props","onValueChange","_extractPropsFromItem","item","label","_extractValuesFromItems","items","map","move","step","selectedIndex","length","_focus","index","setState","handleKey","e","preventDefault","_handleFocus","currentIndex","indexOf","_handleBlur","_renderItems","i","buttonProps","checked","visuallyFocused","onClick","disableFocus","size","disabled","getLabelSizeClassName","captionLarge","theme","captionMedium","captionSmall","render","renderMain","listClassName","error","inputProps","type","onKeyDown","onFocus","onBlur","className","input","captionClassName","caption","setRootNode","root","wrap","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","arrayOf","string","shape","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isKeyArrowHorizontal, isKeyArrowLeft, isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { Group } from '../Group';\nimport { Button, ButtonSize } from '../Button';\nimport { Nullable } from '../../typings/utility-types';\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 { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Switcher.styles';\nimport { getSwitcherTheme } from './switcherTheme';\n\nexport type SwitcherSize = ButtonSize;\ntype SwitcherItems = string | SwitcherItem;\n\nexport interface SwitcherProps extends CommonProps {\n /**\n * Список строк или список элементов типа `{ label: string, value: string }`\n */\n items: SwitcherItems[];\n\n value?: string;\n\n onValueChange?: (value: string) => void;\n\n caption?: string;\n\n error?: boolean;\n\n /** Размер */\n size?: SwitcherSize;\n\n disabled?: boolean;\n}\n\nexport interface SwitcherState {\n focusedIndex: Nullable<number>;\n}\n\ninterface SwitcherItem {\n label: string;\n value: string;\n}\n\n@rootNode\nexport class Switcher extends React.Component<SwitcherProps, SwitcherState> {\n public static __KONTUR_REACT_UI__ = 'Switcher';\n\n public static propTypes = {\n error: PropTypes.bool,\n disabled: PropTypes.bool,\n items: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n }),\n ),\n ]).isRequired,\n caption: PropTypes.string,\n value: PropTypes.string,\n onValueChange: PropTypes.func,\n };\n\n public state: SwitcherState = {\n focusedIndex: null,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = getSwitcherTheme(theme);\n return <ThemeContext.Provider value={this.theme}>{this.renderMain()}</ThemeContext.Provider>;\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const listClassName = cx({\n [styles.error(this.theme)]: !!this.props.error,\n });\n\n const inputProps = {\n type: 'checkbox',\n onKeyDown: this.handleKey,\n onFocus: this._handleFocus,\n onBlur: this._handleBlur,\n className: styles.input(),\n };\n\n const captionClassName = cx(styles.caption(this.theme), this.getLabelSizeClassName());\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={styles.root()}>\n {this.props.caption ? <div className={captionClassName}>{this.props.caption}</div> : null}\n <div className={styles.wrap()}>\n <input {...inputProps} />\n <div className={listClassName}>\n <Group>{this._renderItems()}</Group>\n </div>\n </div>\n </div>\n </CommonWrapper>\n );\n }\n\n private selectItem = (value: string) => {\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n };\n\n private _extractPropsFromItem = (item: string | SwitcherItem): SwitcherItem => {\n return typeof item === 'object' ? item : { label: item, value: item };\n };\n\n private _extractValuesFromItems = (): string[] => {\n return this.props.items.map((item) => {\n const { value } = this._extractPropsFromItem(item);\n return value;\n });\n };\n\n private move = (step: number) => {\n let selectedIndex = this.state.focusedIndex;\n\n if (typeof selectedIndex !== 'number') {\n return;\n }\n\n const items = this._extractValuesFromItems();\n\n selectedIndex += step;\n\n if (selectedIndex < 0) {\n selectedIndex = items.length - 1;\n } else if (selectedIndex >= items.length) {\n selectedIndex = 0;\n }\n\n this._focus(selectedIndex);\n };\n\n private _focus = (index: number) => {\n this.setState({ focusedIndex: index });\n };\n\n private handleKey = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const focusedIndex = this.state.focusedIndex;\n if (typeof focusedIndex !== 'number') {\n return;\n }\n\n if (isKeyEnter(e)) {\n if (this.props.onValueChange) {\n const { value } = this._extractPropsFromItem(this.props.items[focusedIndex]);\n this.selectItem(value);\n }\n return;\n }\n\n if (isKeyArrowHorizontal(e)) {\n e.preventDefault();\n this.move(isKeyArrowLeft(e) ? -1 : 1);\n }\n };\n\n private _handleFocus = () => {\n const { value } = this.props;\n\n const items = this._extractValuesFromItems();\n const currentIndex = [...items].indexOf(value as string);\n const index = currentIndex > -1 ? currentIndex : 0;\n\n this.setState({ focusedIndex: index });\n };\n\n private _handleBlur = () => {\n this.setState({ focusedIndex: null });\n };\n\n private _renderItems = () => {\n return this.props.items.map((item, i) => {\n const { label, value } = this._extractPropsFromItem(item);\n const buttonProps = {\n checked: this.props.value === value,\n visuallyFocused: this.state.focusedIndex === i,\n onClick: () => {\n this.selectItem(value);\n },\n disableFocus: true,\n size: this.props.size,\n disabled: this.props.disabled,\n };\n return (\n <Button key={value} {...buttonProps}>\n {label}\n </Button>\n );\n });\n };\n\n private getLabelSizeClassName = (): string => {\n switch (this.props.size) {\n case 'large':\n return styles.captionLarge(this.theme);\n case 'medium':\n return styles.captionMedium(this.theme);\n case 'small':\n default:\n return styles.captionSmall(this.theme);\n }\n };\n}\n"]}
|
|
@@ -4,11 +4,12 @@ import { ButtonSize } from '../Button';
|
|
|
4
4
|
import { Nullable } from '../../typings/utility-types';
|
|
5
5
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
6
6
|
export declare type SwitcherSize = ButtonSize;
|
|
7
|
+
declare type SwitcherItems = string | SwitcherItem;
|
|
7
8
|
export interface SwitcherProps extends CommonProps {
|
|
8
9
|
/**
|
|
9
10
|
* Список строк или список элементов типа `{ label: string, value: string }`
|
|
10
11
|
*/
|
|
11
|
-
items:
|
|
12
|
+
items: SwitcherItems[];
|
|
12
13
|
value?: string;
|
|
13
14
|
onValueChange?: (value: string) => void;
|
|
14
15
|
caption?: string;
|
|
@@ -8,6 +8,7 @@ import * as LayoutEvents from "../../../lib/LayoutEvents";
|
|
|
8
8
|
import { ThemeContext } from "../../../lib/theming/ThemeContext";
|
|
9
9
|
import { cx } from "../../../lib/theming/Emotion";
|
|
10
10
|
import { getRootNode, rootNode } from "../../../lib/rootNode";
|
|
11
|
+
import { getDOMRect } from "../../../lib/dom/getDOMRect";
|
|
11
12
|
import { styles } from "../Indicator.styles";
|
|
12
13
|
import { TabsContext } from "../TabsContext";
|
|
13
14
|
export var Indicator = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
|
|
@@ -104,7 +105,7 @@ export var Indicator = rootNode(_class = (_temp = _class2 = /*#__PURE__*/functio
|
|
|
104
105
|
var htmlNode = getRootNode(node);
|
|
105
106
|
|
|
106
107
|
if (htmlNode && htmlNode instanceof HTMLElement) {
|
|
107
|
-
var rect = htmlNode
|
|
108
|
+
var rect = getDOMRect(htmlNode);
|
|
108
109
|
|
|
109
110
|
if (this.props.vertical) {
|
|
110
111
|
return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Indicator.tsx"],"names":["React","throttle","LayoutEvents","ThemeContext","cx","getRootNode","rootNode","styles","TabsContext","Indicator","context","state","eventListener","removeTabUpdatesListener","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","_","prevState","render","theme","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","root","className","setRootNode","htmlNode","HTMLElement","rect","
|
|
1
|
+
{"version":3,"sources":["Indicator.tsx"],"names":["React","throttle","LayoutEvents","ThemeContext","cx","getRootNode","rootNode","getDOMRect","styles","TabsContext","Indicator","context","state","eventListener","removeTabUpdatesListener","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","_","prevState","render","theme","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","root","className","setRootNode","htmlNode","HTMLElement","rect","vertical","width","tabBorderWidth","left","offsetLeft","top","offsetTop","height","bottom","parseInt","offsetHeight","right","Component","contextType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport throttle from 'lodash.throttle';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\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 { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Indicator.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { TabIndicators } from './Tab';\n\nexport interface IndicatorProps {\n className?: string;\n tabUpdates: {\n on: (x0: () => void) => () => void;\n };\n vertical: boolean;\n}\n\nexport interface IndicatorState {\n styles: React.CSSProperties;\n}\n\n@rootNode\nexport class Indicator extends React.Component<IndicatorProps, IndicatorState> {\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public state: IndicatorState = {\n styles: {},\n };\n\n private theme!: Theme;\n\n private eventListener: Nullable<{\n remove: () => void;\n }> = null;\n\n private removeTabUpdatesListener: Nullable<() => void> = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.eventListener = LayoutEvents.addListener(this.reflow);\n this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);\n this.reflow();\n }\n\n public componentWillUnmount() {\n this.reflow.cancel();\n\n if (this.eventListener) {\n this.eventListener.remove();\n }\n if (this.removeTabUpdatesListener) {\n this.removeTabUpdatesListener();\n }\n }\n\n public componentDidUpdate(_: IndicatorProps, prevState: IndicatorState) {\n this.reflow();\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 private renderMain() {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const indicators: TabIndicators = (node && node.getIndicators && node.getIndicators()) || {\n error: false,\n warning: false,\n success: false,\n primary: false,\n disabled: false,\n };\n return (\n <div\n className={cx(\n styles.root(this.theme),\n indicators.primary && styles.primary(this.theme),\n indicators.success && styles.success(this.theme),\n indicators.warning && styles.warning(this.theme),\n indicators.error && styles.error(this.theme),\n this.props.className,\n )}\n style={this.state.styles}\n ref={this.setRootNode}\n />\n );\n }\n\n private reflow = throttle(() => {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const nodeStyles = this.getStyles(node);\n const stylesUpdated = ['left', 'top', 'width', 'height'].some(\n (prop) => nodeStyles[prop as keyof React.CSSProperties] !== this.state.styles[prop as keyof React.CSSProperties],\n );\n if (stylesUpdated) {\n this.setState({ styles: nodeStyles });\n }\n }, 100);\n\n private getStyles(node: any): React.CSSProperties {\n const htmlNode = getRootNode(node);\n\n if (htmlNode && htmlNode instanceof HTMLElement) {\n const rect = getDOMRect(htmlNode);\n if (this.props.vertical) {\n return {\n width: this.theme.tabBorderWidth,\n left: htmlNode.offsetLeft,\n top: htmlNode.offsetTop,\n height: rect.bottom - rect.top,\n };\n }\n\n const tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;\n return {\n left: htmlNode.offsetLeft,\n top: htmlNode.offsetHeight + htmlNode.offsetTop - tabBorderWidth,\n width: rect.right - rect.left,\n };\n }\n\n return {};\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Tab.tsx"],"names":["React","PropTypes","invariant","ResizeDetector","isKeyArrow","isKeyArrowLeft","isKeyArrowUp","keyListener","isFunctionalComponent","ThemeContext","CommonWrapper","cx","rootNode","TabsContext","TabsContextDefaultValue","styles","horizontalStyles","verticalStyles","globalClasses","Tab","props","context","state","focusedByKeyboard","tabComponent","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","onClick","defaultPrevented","component","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","isTabPressed","isArrowPressed","setState","handleBlur","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","theme","renderMain","getIndicators","error","Boolean","warning","success","primary","children","Component","defaultProps","isActive","isVertical","vertical","orientationStyles","setRootNode","root","active","focus","__KONTUR_REACT_UI__","contextType","propTypes","node","bool","string","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } 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 { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport interface TabProps<T extends string = string> extends CommonProps {\n /**\n * Tab content\n */\n children?: React.ReactNode;\n\n /**\n * Component to use as a tab\n */\n component?: React.ComponentType<any> | string;\n\n /**\n * Link href\n */\n href?: string;\n\n /**\n * Tab identifier\n */\n id?: T;\n\n /**\n * Click event\n */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * Click event\n */\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /**\n * Disabled indicator\n */\n disabled?: boolean;\n\n /**\n * Cостояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Cостояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * Success indicator\n */\n success?: boolean;\n\n /**\n * Primary indicator\n */\n primary?: boolean;\n\n /**\n * Style property\n */\n style?: React.CSSProperties;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\n/**\n * Tab element of Tabs component\n *\n * Can be used for creating custom tabs\n * ```js\n *\n * const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n *\n * const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n *\n * Works only inside Tabs component, otherwise throws\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n href: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n onKeyDown: PropTypes.func,\n };\n\n public static defaultProps = {\n component: 'a',\n href: '',\n };\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n private setRootNode!: TSetRootNode;\n\n constructor(props: TabProps<T>) {\n super(props);\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getIndicators() {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode = () => this.tabComponent;\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n component: Component = Tab.defaultProps.component,\n href,\n } = this.props;\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Component\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\n [orientationStyles.primary(this.theme)]: !!primary,\n [orientationStyles.success(this.theme)]: !!success,\n [orientationStyles.warning(this.theme)]: !!warning,\n [orientationStyles.error(this.theme)]: !!error,\n [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [styles.disabled(this.theme)]: !!disabled,\n [orientationStyles.disabled()]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id || this.props.href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n\n const id = this.props.id || this.props.href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (this.props.component === 'a' && !this.props.href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) || isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed || keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Tab.tsx"],"names":["React","PropTypes","invariant","ResizeDetector","isKeyArrow","isKeyArrowLeft","isKeyArrowUp","keyListener","isFunctionalComponent","ThemeContext","CommonWrapper","cx","rootNode","TabsContext","TabsContextDefaultValue","styles","horizontalStyles","verticalStyles","globalClasses","Tab","props","context","state","focusedByKeyboard","tabComponent","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","onClick","defaultPrevented","component","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","isTabPressed","isArrowPressed","setState","handleBlur","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","theme","renderMain","getIndicators","error","Boolean","warning","success","primary","children","Component","defaultProps","isActive","isVertical","vertical","orientationStyles","setRootNode","root","active","focus","__KONTUR_REACT_UI__","contextType","propTypes","node","bool","string","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } 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 { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport interface TabProps<T extends string = string> extends CommonProps {\n /**\n * Tab content\n */\n children?: React.ReactNode;\n\n /**\n * Component to use as a tab\n */\n component?: React.ComponentType<any> | string;\n\n /**\n * Link href\n */\n href?: string;\n\n /**\n * Tab identifier\n */\n id?: T;\n\n /**\n * Click event\n */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * Click event\n */\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /**\n * Disabled indicator\n */\n disabled?: boolean;\n\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * Success indicator\n */\n success?: boolean;\n\n /**\n * Primary indicator\n */\n primary?: boolean;\n\n /**\n * Style property\n */\n style?: React.CSSProperties;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\n/**\n * Tab element of Tabs component\n *\n * Can be used for creating custom tabs\n * ```js\n *\n * const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n *\n * const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n *\n * Works only inside Tabs component, otherwise throws\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n href: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n onKeyDown: PropTypes.func,\n };\n\n public static defaultProps = {\n component: 'a',\n href: '',\n };\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n private setRootNode!: TSetRootNode;\n\n constructor(props: TabProps<T>) {\n super(props);\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getIndicators() {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode = () => this.tabComponent;\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n component: Component = Tab.defaultProps.component,\n href,\n } = this.props;\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Component\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\n [orientationStyles.primary(this.theme)]: !!primary,\n [orientationStyles.success(this.theme)]: !!success,\n [orientationStyles.warning(this.theme)]: !!warning,\n [orientationStyles.error(this.theme)]: !!error,\n [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [styles.disabled(this.theme)]: !!disabled,\n [orientationStyles.disabled()]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id || this.props.href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n\n const id = this.props.id || this.props.href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (this.props.component === 'a' && !this.props.href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) || isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed || keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}
|
package/components/Tabs/Tab.d.ts
CHANGED
|
@@ -40,11 +40,11 @@ export interface TabProps<T extends string = string> extends CommonProps {
|
|
|
40
40
|
*/
|
|
41
41
|
disabled?: boolean;
|
|
42
42
|
/**
|
|
43
|
-
*
|
|
43
|
+
* Состояние валидации при ошибке.
|
|
44
44
|
*/
|
|
45
45
|
error?: boolean;
|
|
46
46
|
/**
|
|
47
|
-
*
|
|
47
|
+
* Состояние валидации при предупреждении.
|
|
48
48
|
*/
|
|
49
49
|
warning?: boolean;
|
|
50
50
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Tabs.tsx"],"names":["React","PropTypes","ThemeContext","CommonWrapper","cx","getRootNode","rootNode","Indicator","styles","TabsContext","Tab","Tabs","tabs","tabUpdates","on","cb","index","listeners","push","splice","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","vertical","width","children","indicatorClassName","theme","setRootNode","root","activeTab","Component","__KONTUR_REACT_UI__","propTypes","node","string","isRequired","bool","oneOfType","number","defaultProps"],"mappings":"iPAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB
|
|
1
|
+
{"version":3,"sources":["Tabs.tsx"],"names":["React","PropTypes","ThemeContext","CommonWrapper","cx","getRootNode","rootNode","Indicator","styles","TabsContext","Tab","Tabs","tabs","tabUpdates","on","cb","index","listeners","push","splice","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","vertical","width","children","indicatorClassName","theme","setRootNode","root","activeTab","Component","__KONTUR_REACT_UI__","propTypes","node","string","isRequired","bool","oneOfType","number","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { emptyHandler } 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 { getRootNode } from '../../lib/rootNode/getRootNode';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { Indicator } from './Indicator';\nimport { styles } from './Tabs.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { Tab } from './Tab';\n\ntype ValueBaseType = string;\ntype TabType<T extends ValueBaseType> = {\n getNode: () => Tab<T> | null;\n id: T;\n};\n\nexport interface TabsProps<T extends ValueBaseType = string> extends CommonProps {\n /**\n * Tab component should be child of Tabs component\n */\n children?: React.ReactNode;\n\n /**\n * Classname of indicator\n */\n indicatorClassName?: string;\n\n /**\n * Tabs change event\n */\n onValueChange?: (value: T) => void;\n\n /**\n * Active tab identifier\n */\n value: T;\n\n /**\n * Vertical indicator\n * @default false\n */\n vertical: boolean;\n\n /**\n * Width of tabs container\n */\n width?: number | string;\n}\n\n/**\n * Tabs wrapper\n *\n * contains static property `Tab`\n */\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n\n public static propTypes = {\n children: PropTypes.node,\n indicatorClassName: PropTypes.string,\n value: PropTypes.string.isRequired,\n vertical: PropTypes.bool,\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n };\n public static defaultProps = {\n vertical: false,\n };\n\n public static Tab = Tab;\n\n private theme!: Theme;\n\n private tabs: Array<TabType<T>> = [];\n\n private tabUpdates = {\n on: (cb: () => void) => {\n const index = this.listeners.push(cb);\n return () => {\n this.listeners.splice(index, 1);\n };\n },\n };\n\n private listeners: Array<typeof emptyHandler> = [];\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { vertical, value, width, children, indicatorClassName } = this.props;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={cx(styles.root(this.theme), vertical && styles.vertical())} style={{ width }}>\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\n getTab: this.getTab,\n addTab: this.addTab,\n removeTab: this.removeTab,\n notifyUpdate: this.notifyUpdate,\n shiftFocus: this.shiftFocus,\n switchTab: this.switchTab,\n }}\n >\n {children}\n <Indicator className={indicatorClassName} tabUpdates={this.tabUpdates} vertical={vertical} />\n </TabsContext.Provider>\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private shiftFocus: TabsContextType<T>['shiftFocus'] = (fromTab, delta) => {\n const { tabs } = this;\n const index = tabs.findIndex((x) => x.id === fromTab);\n const newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));\n const tab = tabs[newIndex];\n\n const tabNode = tab.getNode();\n const htmlNode = getRootNode(tabNode);\n\n if (htmlNode && htmlNode instanceof HTMLElement && typeof htmlNode.focus === 'function') {\n htmlNode.focus();\n }\n };\n\n private notifyUpdate: TabsContextType<T>['notifyUpdate'] = () => {\n this.listeners.forEach((cb) => cb());\n };\n\n private switchTab: TabsContextType<T>['switchTab'] = (id) => {\n const { onValueChange, value } = this.props;\n if (id !== value && onValueChange) {\n onValueChange(id);\n }\n };\n\n private getTab: TabsContextType<T>['getTab'] = (id) => {\n const { getNode = null } = this.tabs.find((x) => x.id === id) || {};\n return getNode && getNode();\n };\n\n private addTab: TabsContextType<T>['addTab'] = (id, getNode) => {\n this.tabs = this.tabs.concat({ id, getNode });\n };\n\n private removeTab: TabsContextType<T>['removeTab'] = (id) => {\n this.tabs = this.tabs.filter((tab) => tab.id !== id);\n };\n}\n"]}
|
|
@@ -2,7 +2,8 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
4
4
|
import { Tab } from './Tab';
|
|
5
|
-
|
|
5
|
+
declare type ValueBaseType = string;
|
|
6
|
+
export interface TabsProps<T extends ValueBaseType = string> extends CommonProps {
|
|
6
7
|
/**
|
|
7
8
|
* Tab component should be child of Tabs component
|
|
8
9
|
*/
|
|
@@ -60,3 +61,4 @@ export declare class Tabs<T extends string = string> extends React.Component<Tab
|
|
|
60
61
|
private addTab;
|
|
61
62
|
private removeTab;
|
|
62
63
|
}
|
|
64
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Textarea.tsx"],"names":["React","PropTypes","throttle","raf","isKeyEnter","polyfillPlaceholder","LayoutEvents","ThemeContext","RenderLayer","ResizeDetector","isBrowser","isIE11","CommonWrapper","isTestEnv","cx","rootNode","getTextAreaHeight","styles","TextareaCounter","DEFAULT_WIDTH","AUTORESIZE_THROTTLE_DEFAULT_WAIT","Textarea","state","isCounterVisible","reflowCounter","counter","reflow","selectAllId","textareaObserver","MutationObserver","setSelectionRange","start","end","node","Error","document","activeElement","focus","selectAll","value","length","delaySelectAll","cancelDelayedSelectAll","cancel","renderMain","props","width","error","warning","autoResize","resize","onCut","onPaste","maxRows","onFocus","selectAllOnFocus","placeholder","onValueChange","showLengthCounter","lengthCounter","counterHelp","extraRow","disableAnimations","disabled","textareaProps","rootProps","style","textareaClassNames","textarea","theme","isAnimationsDisabled","textareaStyle","placeholderPolyfill","fakeTextarea","fakeProps","defaultValue","className","fake","readOnly","refFake","maxLength","handleCloseCounterHelp","refCounter","root","undefined","ref","handleChange","handleCut","handlePaste","handleFocus","handleKeyDown","children","setState","e","toString","isBlockEnter","preventDefault","onKeyDown","fieldIsEmpty","target","onChange","element","fakeNode","autoResizeHandler","rows","minRows","parseInt","height","exceededMaxHeight","overflowY","getAutoResizeThrottleWait","event","componentDidMount","layoutEvents","addListener","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","setRootNode","blur","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","defaultProps"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\nimport PropTypes from 'prop-types';\nimport throttle from 'lodash.throttle';\nimport raf from 'raf';\n\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isBrowser, isIE11 } from '../../lib/client';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { getTextAreaHeight } from './TextareaHelpers';\nimport { styles } from './Textarea.styles';\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\n\nconst DEFAULT_WIDTH = 250;\nconst AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;\n\nexport interface TextareaProps\n extends CommonProps,\n Override<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n {\n /**\n * Cостояние валидации при ошибке.\n */\n error?: boolean;\n /**\n * Cостояние валидации при предупреждении.\n */\n warning?: boolean;\n /** Не активное состояние */\n disabled?: boolean;\n\n /**\n * Атоматический ресайз\n * в зависимости от содержимого\n */\n autoResize?: boolean;\n /**\n * Число строк\n */\n rows: number;\n /**\n * Максимальное число строк при\n * автоматическом ресайзе\n */\n maxRows: string | number;\n\n /**\n * Стандартный ресайз\n * Попадает в `style`\n */\n resize?: React.CSSProperties['resize'];\n\n /**\n * Ширина\n */\n width?: React.CSSProperties['width'];\n\n /**\n * Вызывается при изменении `value`\n */\n onValueChange?: (value: string) => void;\n\n /** Выделение значения при фокусе */\n selectAllOnFocus?: boolean;\n\n /** Показывать счетчик символов */\n showLengthCounter?: boolean;\n\n /** Допустимое количество символов в поле. Отображается в счетчике.\n * Если не указано, равно `maxLength`\n */\n lengthCounter?: number;\n\n /** Подсказка к счетчику символов.\n *\n * По умолчанию - тултип с содежимым из пропа, если передан`ReactNode`.\n *\n * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\n *\n * ```\n * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\n * ```\n * */\n counterHelp?: ReactNode | (() => ReactNode);\n\n /** Добавлять дополнительную свободную строку при авто-ресайзе.\n * @see https://guides.kontur.ru/components/textarea/#04\n * */\n extraRow: boolean;\n\n /** Отключать анимацию при авто-ресайзе.\n * Автоматически отключается когда в `extraRow` передан `false`.\n */\n disableAnimations: boolean;\n }\n > {}\n\nexport interface TextareaState {\n polyfillPlaceholder: boolean;\n isCounterVisible: boolean;\n}\n\n/**\n * Компонент для ввода многострочного текста.\n *\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\n *\n * ** `className` и `style` игнорируются**\n */\n@rootNode\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\n public static __KONTUR_REACT_UI__ = 'Textarea';\n\n public static propTypes = {\n error: PropTypes.bool,\n warning: PropTypes.bool,\n disabled: PropTypes.bool,\n\n autoResize: PropTypes.bool,\n extraRow: PropTypes.bool,\n disableAnimations: PropTypes.bool,\n maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n id: PropTypes.string,\n name: PropTypes.string,\n title: PropTypes.string,\n spellCheck: PropTypes.bool,\n role: PropTypes.string,\n maxLength: PropTypes.number,\n tabIndex: PropTypes.number,\n rows: PropTypes.number,\n placeholder: PropTypes.string,\n\n value: PropTypes.string,\n defaultValue: PropTypes.string,\n onValueChange: PropTypes.func,\n\n onMouseEnter: PropTypes.func,\n onMouseLeave: PropTypes.func,\n onMouseOver: PropTypes.func,\n onMouseMove: PropTypes.func,\n onMouseOut: PropTypes.func,\n\n onMouseUp: PropTypes.func,\n onMouseDown: PropTypes.func,\n onClick: PropTypes.func,\n onDoubleClick: PropTypes.func,\n\n onKeyDown: PropTypes.func,\n onKeyPress: PropTypes.func,\n onKeyUp: PropTypes.func,\n onInput: PropTypes.func,\n\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n\n onScroll: PropTypes.func,\n onWheel: PropTypes.func,\n\n onCut: PropTypes.func,\n onPaste: PropTypes.func,\n onCopy: PropTypes.func,\n };\n\n public static defaultProps = {\n rows: 3,\n maxRows: 15,\n extraRow: true,\n disableAnimations: isTestEnv,\n };\n\n public state = {\n polyfillPlaceholder,\n isCounterVisible: false,\n };\n private reflowCounter = () => {\n if (this.counter) {\n this.counter.reflow();\n }\n };\n\n private theme!: Theme;\n private selectAllId: number | null = null;\n private node: Nullable<HTMLTextAreaElement>;\n private fakeNode: Nullable<HTMLTextAreaElement>;\n private counter: Nullable<TextareaCounterRef>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private textareaObserver = isBrowser ? new MutationObserver(this.reflowCounter) : null;\n private setRootNode!: TSetRootNode;\n private getAutoResizeThrottleWait(props: TextareaProps = this.props): number {\n // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты\n // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120\n return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;\n }\n private isAnimationsDisabled({ disableAnimations, extraRow }: TextareaProps = this.props): boolean {\n return disableAnimations || !extraRow;\n }\n\n public componentDidMount() {\n if (this.props.autoResize) {\n this.autoResize();\n this.layoutEvents = LayoutEvents.addListener(this.autoResize);\n }\n\n if (this.node && this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.observe(this.node, { attributes: true });\n }\n }\n\n public componentWillUnmount() {\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n if (this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.disconnect();\n }\n this.cancelDelayedSelectAll();\n }\n\n public componentDidUpdate(prevProps: TextareaProps) {\n if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {\n this.autoResize.cancel();\n this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n }\n if (\n this.props.autoResize &&\n (this.props.rows !== prevProps.rows ||\n this.props.maxRows !== prevProps.maxRows ||\n this.props.value !== prevProps.value)\n ) {\n this.autoResize();\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public focus() {\n if (this.node) {\n this.node.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n if (this.node) {\n this.node.blur();\n }\n }\n\n /**\n * @public\n * @param {number} start\n * @param {number} end\n */\n public setSelectionRange = (start: number, end: number) => {\n if (!this.node) {\n throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n }\n\n if (document.activeElement !== this.node) {\n this.focus();\n }\n\n this.node.setSelectionRange(start, end);\n };\n\n /**\n * @public\n */\n public selectAll = () => {\n if (this.node) {\n this.setSelectionRange(0, this.node.value.length);\n }\n };\n\n private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n private cancelDelayedSelectAll = (): void => {\n if (this.selectAllId) {\n raf.cancel(this.selectAllId);\n this.selectAllId = null;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<TextareaProps>) => {\n const {\n width = DEFAULT_WIDTH,\n error,\n warning,\n autoResize,\n resize,\n onCut,\n onPaste,\n maxRows,\n onFocus,\n selectAllOnFocus,\n placeholder,\n onValueChange,\n showLengthCounter,\n lengthCounter,\n counterHelp,\n extraRow,\n disableAnimations,\n disabled,\n ...textareaProps\n } = props;\n\n const { isCounterVisible } = this.state;\n\n const rootProps = {\n style: {\n width,\n },\n };\n\n const textareaClassNames = cx({\n [styles.textarea(this.theme)]: true,\n [styles.disabled(this.theme)]: disabled,\n [styles.error(this.theme)]: !!error,\n [styles.warning(this.theme)]: !!warning,\n [styles.disableAnimations()]: this.isAnimationsDisabled(),\n });\n\n const textareaStyle = {\n resize: autoResize ? 'none' : resize,\n };\n\n let placeholderPolyfill = null;\n\n if (this.state.polyfillPlaceholder && !textareaProps.value) {\n placeholderPolyfill = <span className={styles.placeholder()}>{placeholder}</span>;\n }\n\n let fakeTextarea = null;\n if (autoResize) {\n const fakeProps = {\n value: this.props.value,\n defaultValue: this.props.defaultValue,\n className: cx(textareaClassNames, styles.fake()),\n readOnly: true,\n };\n fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\n }\n\n const counter = showLengthCounter && isCounterVisible && this.node && (\n <TextareaCounter\n textarea={this.node}\n help={counterHelp}\n value={textareaProps.value}\n length={textareaProps.maxLength ?? lengthCounter ?? 0}\n onCloseHelp={this.handleCloseCounterHelp}\n ref={this.refCounter}\n />\n );\n\n return (\n <RenderLayer\n onFocusOutside={this.handleCloseCounterHelp}\n onClickOutside={this.handleCloseCounterHelp}\n active={this.state.isCounterVisible}\n >\n <label {...rootProps} className={styles.root(this.theme)}>\n {placeholderPolyfill}\n <ResizeDetector onResize={this.reflowCounter}>\n <textarea\n {...textareaProps}\n className={textareaClassNames}\n style={textareaStyle}\n placeholder={!placeholderPolyfill ? placeholder : undefined}\n ref={this.ref}\n onChange={this.handleChange}\n onCut={this.handleCut}\n onPaste={this.handlePaste}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n disabled={disabled}\n >\n {this.props.children}\n </textarea>\n </ResizeDetector>\n {fakeTextarea}\n {counter}\n </label>\n </RenderLayer>\n );\n };\n\n private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // Edge bug: textarea maxlength doesn't work after new line\n // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\n const value = this.props.value !== undefined ? this.props.value.toString() : null;\n const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\n\n if (isBlockEnter) {\n e.preventDefault();\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n };\n\n private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (polyfillPlaceholder) {\n const fieldIsEmpty = e.target.value === '';\n\n if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\n this.setState({ polyfillPlaceholder: fieldIsEmpty });\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange(e.target.value);\n }\n\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onChange) {\n this.props.onChange(e);\n }\n\n this.reflowCounter();\n };\n\n private ref = (element: HTMLTextAreaElement) => {\n this.node = element;\n };\n\n private refFake = (element: HTMLTextAreaElement) => {\n this.fakeNode = element;\n };\n\n private refCounter = (ref: TextareaCounterRef | null) => {\n this.counter = ref;\n };\n\n private autoResizeHandler = () => {\n const fakeNode = this.fakeNode;\n if (!fakeNode) {\n return;\n }\n const node = this.node;\n if (!node) {\n return;\n }\n if (this.props.value === undefined) {\n fakeNode.value = node.value;\n }\n\n const { rows, maxRows, extraRow } = this.props;\n if (rows === undefined || maxRows === undefined) {\n return;\n }\n const { height, exceededMaxHeight } = getTextAreaHeight({\n node: fakeNode,\n minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),\n maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\n extraRow,\n });\n node.style.height = height + 'px';\n node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n };\n\n private autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n\n private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onCut) {\n this.props.onCut(event);\n }\n\n this.reflowCounter();\n };\n\n private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onPaste) {\n this.props.onPaste(event);\n }\n\n this.reflowCounter();\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({ isCounterVisible: true });\n\n if (this.props.selectAllOnFocus) {\n // https://github.com/facebook/react/issues/7769\n this.node && !isIE11 ? this.selectAll() : this.delaySelectAll();\n }\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["Textarea.tsx"],"names":["React","PropTypes","throttle","raf","isKeyEnter","polyfillPlaceholder","LayoutEvents","ThemeContext","RenderLayer","ResizeDetector","isBrowser","isIE11","CommonWrapper","isTestEnv","cx","rootNode","getTextAreaHeight","styles","TextareaCounter","DEFAULT_WIDTH","AUTORESIZE_THROTTLE_DEFAULT_WAIT","Textarea","state","isCounterVisible","reflowCounter","counter","reflow","selectAllId","textareaObserver","MutationObserver","setSelectionRange","start","end","node","Error","document","activeElement","focus","selectAll","value","length","delaySelectAll","cancelDelayedSelectAll","cancel","renderMain","props","width","error","warning","autoResize","resize","onCut","onPaste","maxRows","onFocus","selectAllOnFocus","placeholder","onValueChange","showLengthCounter","lengthCounter","counterHelp","extraRow","disableAnimations","disabled","textareaProps","rootProps","style","textareaClassNames","textarea","theme","isAnimationsDisabled","textareaStyle","placeholderPolyfill","fakeTextarea","fakeProps","defaultValue","className","fake","readOnly","refFake","maxLength","handleCloseCounterHelp","refCounter","root","undefined","ref","handleChange","handleCut","handlePaste","handleFocus","handleKeyDown","children","setState","e","toString","isBlockEnter","preventDefault","onKeyDown","fieldIsEmpty","target","onChange","element","fakeNode","autoResizeHandler","rows","minRows","parseInt","height","exceededMaxHeight","overflowY","getAutoResizeThrottleWait","event","componentDidMount","layoutEvents","addListener","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","setRootNode","blur","Component","__KONTUR_REACT_UI__","propTypes","bool","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","defaultProps"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\nimport PropTypes from 'prop-types';\nimport throttle from 'lodash.throttle';\nimport raf from 'raf';\n\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isBrowser, isIE11 } from '../../lib/client';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { getTextAreaHeight } from './TextareaHelpers';\nimport { styles } from './Textarea.styles';\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\n\nconst DEFAULT_WIDTH = 250;\nconst AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;\n\nexport interface TextareaProps\n extends CommonProps,\n Override<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n {\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n /** Не активное состояние */\n disabled?: boolean;\n\n /**\n * Автоматический ресайз\n * в зависимости от содержимого\n */\n autoResize?: boolean;\n /**\n * Число строк\n */\n rows: number;\n /**\n * Максимальное число строк при\n * автоматическом ресайзе\n */\n maxRows: string | number;\n\n /**\n * Стандартный ресайз\n * Попадает в `style`\n */\n resize?: React.CSSProperties['resize'];\n\n /**\n * Ширина\n */\n width?: React.CSSProperties['width'];\n\n /**\n * Вызывается при изменении `value`\n */\n onValueChange?: (value: string) => void;\n\n /** Выделение значения при фокусе */\n selectAllOnFocus?: boolean;\n\n /** Показывать счетчик символов */\n showLengthCounter?: boolean;\n\n /** Допустимое количество символов в поле. Отображается в счетчике.\n * Если не указано, равно `maxLength`\n */\n lengthCounter?: number;\n\n /** Подсказка к счетчику символов.\n *\n * По умолчанию - тултип с содержимым из пропа, если передан`ReactNode`.\n *\n * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\n *\n * ```\n * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\n * ```\n * */\n counterHelp?: ReactNode | (() => ReactNode);\n\n /** Добавлять дополнительную свободную строку при авто-ресайзе.\n * @see https://guides.kontur.ru/components/textarea/#04\n * */\n extraRow: boolean;\n\n /** Отключать анимацию при авто-ресайзе.\n * Автоматически отключается когда в `extraRow` передан `false`.\n */\n disableAnimations: boolean;\n }\n > {}\n\nexport interface TextareaState {\n polyfillPlaceholder: boolean;\n isCounterVisible: boolean;\n}\n\n/**\n * Компонент для ввода многострочного текста.\n *\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\n *\n * ** `className` и `style` игнорируются**\n */\n@rootNode\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\n public static __KONTUR_REACT_UI__ = 'Textarea';\n\n public static propTypes = {\n error: PropTypes.bool,\n warning: PropTypes.bool,\n disabled: PropTypes.bool,\n\n autoResize: PropTypes.bool,\n extraRow: PropTypes.bool,\n disableAnimations: PropTypes.bool,\n maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n id: PropTypes.string,\n name: PropTypes.string,\n title: PropTypes.string,\n spellCheck: PropTypes.bool,\n role: PropTypes.string,\n maxLength: PropTypes.number,\n tabIndex: PropTypes.number,\n rows: PropTypes.number,\n placeholder: PropTypes.string,\n\n value: PropTypes.string,\n defaultValue: PropTypes.string,\n onValueChange: PropTypes.func,\n\n onMouseEnter: PropTypes.func,\n onMouseLeave: PropTypes.func,\n onMouseOver: PropTypes.func,\n onMouseMove: PropTypes.func,\n onMouseOut: PropTypes.func,\n\n onMouseUp: PropTypes.func,\n onMouseDown: PropTypes.func,\n onClick: PropTypes.func,\n onDoubleClick: PropTypes.func,\n\n onKeyDown: PropTypes.func,\n onKeyPress: PropTypes.func,\n onKeyUp: PropTypes.func,\n onInput: PropTypes.func,\n\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n\n onScroll: PropTypes.func,\n onWheel: PropTypes.func,\n\n onCut: PropTypes.func,\n onPaste: PropTypes.func,\n onCopy: PropTypes.func,\n };\n\n public static defaultProps = {\n rows: 3,\n maxRows: 15,\n extraRow: true,\n disableAnimations: isTestEnv,\n };\n\n public state = {\n polyfillPlaceholder,\n isCounterVisible: false,\n };\n private reflowCounter = () => {\n if (this.counter) {\n this.counter.reflow();\n }\n };\n\n private theme!: Theme;\n private selectAllId: number | null = null;\n private node: Nullable<HTMLTextAreaElement>;\n private fakeNode: Nullable<HTMLTextAreaElement>;\n private counter: Nullable<TextareaCounterRef>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private textareaObserver = isBrowser ? new MutationObserver(this.reflowCounter) : null;\n private setRootNode!: TSetRootNode;\n private getAutoResizeThrottleWait(props: TextareaProps = this.props): number {\n // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты\n // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120\n return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;\n }\n private isAnimationsDisabled({ disableAnimations, extraRow }: TextareaProps = this.props): boolean {\n return disableAnimations || !extraRow;\n }\n\n public componentDidMount() {\n if (this.props.autoResize) {\n this.autoResize();\n this.layoutEvents = LayoutEvents.addListener(this.autoResize);\n }\n\n if (this.node && this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.observe(this.node, { attributes: true });\n }\n }\n\n public componentWillUnmount() {\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n if (this.props.showLengthCounter && this.textareaObserver) {\n this.textareaObserver.disconnect();\n }\n this.cancelDelayedSelectAll();\n }\n\n public componentDidUpdate(prevProps: TextareaProps) {\n if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {\n this.autoResize.cancel();\n this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n }\n if (\n this.props.autoResize &&\n (this.props.rows !== prevProps.rows ||\n this.props.maxRows !== prevProps.maxRows ||\n this.props.value !== prevProps.value)\n ) {\n this.autoResize();\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /**\n * @public\n */\n public focus() {\n if (this.node) {\n this.node.focus();\n }\n }\n\n /**\n * @public\n */\n public blur() {\n if (this.node) {\n this.node.blur();\n }\n }\n\n /**\n * @public\n * @param {number} start\n * @param {number} end\n */\n public setSelectionRange = (start: number, end: number) => {\n if (!this.node) {\n throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n }\n\n if (document.activeElement !== this.node) {\n this.focus();\n }\n\n this.node.setSelectionRange(start, end);\n };\n\n /**\n * @public\n */\n public selectAll = () => {\n if (this.node) {\n this.setSelectionRange(0, this.node.value.length);\n }\n };\n\n private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n private cancelDelayedSelectAll = (): void => {\n if (this.selectAllId) {\n raf.cancel(this.selectAllId);\n this.selectAllId = null;\n }\n };\n\n private renderMain = (props: CommonWrapperRestProps<TextareaProps>) => {\n const {\n width = DEFAULT_WIDTH,\n error,\n warning,\n autoResize,\n resize,\n onCut,\n onPaste,\n maxRows,\n onFocus,\n selectAllOnFocus,\n placeholder,\n onValueChange,\n showLengthCounter,\n lengthCounter,\n counterHelp,\n extraRow,\n disableAnimations,\n disabled,\n ...textareaProps\n } = props;\n\n const { isCounterVisible } = this.state;\n\n const rootProps = {\n style: {\n width,\n },\n };\n\n const textareaClassNames = cx({\n [styles.textarea(this.theme)]: true,\n [styles.disabled(this.theme)]: disabled,\n [styles.error(this.theme)]: !!error,\n [styles.warning(this.theme)]: !!warning,\n [styles.disableAnimations()]: this.isAnimationsDisabled(),\n });\n\n const textareaStyle = {\n resize: autoResize ? 'none' : resize,\n };\n\n let placeholderPolyfill = null;\n\n if (this.state.polyfillPlaceholder && !textareaProps.value) {\n placeholderPolyfill = <span className={styles.placeholder()}>{placeholder}</span>;\n }\n\n let fakeTextarea = null;\n if (autoResize) {\n const fakeProps = {\n value: this.props.value,\n defaultValue: this.props.defaultValue,\n className: cx(textareaClassNames, styles.fake()),\n readOnly: true,\n };\n fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\n }\n\n const counter = showLengthCounter && isCounterVisible && this.node && (\n <TextareaCounter\n textarea={this.node}\n help={counterHelp}\n value={textareaProps.value}\n length={textareaProps.maxLength ?? lengthCounter ?? 0}\n onCloseHelp={this.handleCloseCounterHelp}\n ref={this.refCounter}\n />\n );\n\n return (\n <RenderLayer\n onFocusOutside={this.handleCloseCounterHelp}\n onClickOutside={this.handleCloseCounterHelp}\n active={this.state.isCounterVisible}\n >\n <label {...rootProps} className={styles.root(this.theme)}>\n {placeholderPolyfill}\n <ResizeDetector onResize={this.reflowCounter}>\n <textarea\n {...textareaProps}\n className={textareaClassNames}\n style={textareaStyle}\n placeholder={!placeholderPolyfill ? placeholder : undefined}\n ref={this.ref}\n onChange={this.handleChange}\n onCut={this.handleCut}\n onPaste={this.handlePaste}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n disabled={disabled}\n >\n {this.props.children}\n </textarea>\n </ResizeDetector>\n {fakeTextarea}\n {counter}\n </label>\n </RenderLayer>\n );\n };\n\n private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // Edge bug: textarea maxlength doesn't work after new line\n // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\n const value = this.props.value !== undefined ? this.props.value.toString() : null;\n const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\n\n if (isBlockEnter) {\n e.preventDefault();\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n }\n };\n\n private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (polyfillPlaceholder) {\n const fieldIsEmpty = e.target.value === '';\n\n if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\n this.setState({ polyfillPlaceholder: fieldIsEmpty });\n }\n }\n\n if (this.props.onValueChange) {\n this.props.onValueChange(e.target.value);\n }\n\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onChange) {\n this.props.onChange(e);\n }\n\n this.reflowCounter();\n };\n\n private ref = (element: HTMLTextAreaElement) => {\n this.node = element;\n };\n\n private refFake = (element: HTMLTextAreaElement) => {\n this.fakeNode = element;\n };\n\n private refCounter = (ref: TextareaCounterRef | null) => {\n this.counter = ref;\n };\n\n private autoResizeHandler = () => {\n const fakeNode = this.fakeNode;\n if (!fakeNode) {\n return;\n }\n const node = this.node;\n if (!node) {\n return;\n }\n if (this.props.value === undefined) {\n fakeNode.value = node.value;\n }\n\n const { rows, maxRows, extraRow } = this.props;\n if (rows === undefined || maxRows === undefined) {\n return;\n }\n const { height, exceededMaxHeight } = getTextAreaHeight({\n node: fakeNode,\n minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),\n maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\n extraRow,\n });\n node.style.height = height + 'px';\n node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n };\n\n private autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n\n private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onCut) {\n this.props.onCut(event);\n }\n\n this.reflowCounter();\n };\n\n private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n if (this.props.autoResize) {\n this.autoResize();\n }\n\n if (this.props.onPaste) {\n this.props.onPaste(event);\n }\n\n this.reflowCounter();\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n this.setState({ isCounterVisible: true });\n\n if (this.props.selectAllOnFocus) {\n // https://github.com/facebook/react/issues/7769\n this.node && !isIE11 ? this.selectAll() : this.delaySelectAll();\n }\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n}\n"]}
|
|
@@ -4,17 +4,17 @@ import { Override } from '../../typings/utility-types';
|
|
|
4
4
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
5
5
|
export interface TextareaProps extends CommonProps, Override<React.TextareaHTMLAttributes<HTMLTextAreaElement>, {
|
|
6
6
|
/**
|
|
7
|
-
*
|
|
7
|
+
* Состояние валидации при ошибке.
|
|
8
8
|
*/
|
|
9
9
|
error?: boolean;
|
|
10
10
|
/**
|
|
11
|
-
*
|
|
11
|
+
* Состояние валидации при предупреждении.
|
|
12
12
|
*/
|
|
13
13
|
warning?: boolean;
|
|
14
14
|
/** Не активное состояние */
|
|
15
15
|
disabled?: boolean;
|
|
16
16
|
/**
|
|
17
|
-
*
|
|
17
|
+
* Автоматический ресайз
|
|
18
18
|
* в зависимости от содержимого
|
|
19
19
|
*/
|
|
20
20
|
autoResize?: boolean;
|
|
@@ -50,7 +50,7 @@ export interface TextareaProps extends CommonProps, Override<React.TextareaHTMLA
|
|
|
50
50
|
lengthCounter?: number;
|
|
51
51
|
/** Подсказка к счетчику символов.
|
|
52
52
|
*
|
|
53
|
-
* По умолчанию - тултип с
|
|
53
|
+
* По умолчанию - тултип с содержимым из пропа, если передан`ReactNode`.
|
|
54
54
|
*
|
|
55
55
|
* Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,
|
|
56
56
|
*
|