@skbkontur/react-ui 4.13.4 → 4.14.0-next.1
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 +31 -0
- package/cjs/components/Button/Button.d.ts +2 -6
- package/cjs/components/Button/Button.js +14 -5
- package/cjs/components/Button/Button.js.map +1 -1
- package/cjs/components/Button/Button.styles.js +2 -1
- package/cjs/components/Button/Button.styles.js.map +1 -1
- package/cjs/components/DropdownMenu/DropdownMenu.d.ts +1 -1
- package/cjs/components/DropdownMenu/DropdownMenu.js +2 -1
- package/cjs/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/cjs/components/Input/Input.d.ts +8 -4
- package/cjs/components/Input/Input.js +32 -6
- package/cjs/components/Input/Input.js.map +1 -1
- package/cjs/components/Input/Input.md +49 -0
- package/cjs/components/Input/Input.styles.js +2 -1
- package/cjs/components/Input/Input.styles.js.map +1 -1
- package/cjs/components/Kebab/Kebab.d.ts +4 -1
- package/cjs/components/Kebab/Kebab.js +9 -3
- package/cjs/components/Kebab/Kebab.js.map +1 -1
- package/cjs/components/Loader/Loader.js +1 -3
- package/cjs/components/Loader/Loader.js.map +1 -1
- package/cjs/components/Modal/Modal.d.ts +3 -3
- package/cjs/components/Modal/Modal.js +19 -2
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Modal/Modal.styles.d.ts +0 -2
- package/cjs/components/Modal/Modal.styles.js +22 -33
- package/cjs/components/Modal/Modal.styles.js.map +1 -1
- package/cjs/components/Modal/ModalBody.js +0 -2
- package/cjs/components/Modal/ModalBody.js.map +1 -1
- package/cjs/components/Modal/ModalFooter.js +2 -5
- package/cjs/components/Modal/ModalFooter.js.map +1 -1
- package/cjs/components/Modal/ModalHeader.js +1 -6
- package/cjs/components/Modal/ModalHeader.js.map +1 -1
- package/cjs/components/PasswordInput/PasswordInput.js +5 -5
- package/cjs/components/PasswordInput/PasswordInput.js.map +1 -1
- package/cjs/components/ScrollContainer/ScrollContainer.d.ts +1 -0
- package/cjs/components/ScrollContainer/ScrollContainer.js +9 -1
- package/cjs/components/ScrollContainer/ScrollContainer.js.map +1 -1
- package/cjs/components/SidePage/SidePage.d.ts +3 -3
- package/cjs/components/SidePage/SidePage.js +8 -1
- package/cjs/components/SidePage/SidePage.js.map +1 -1
- package/cjs/components/Spinner/Spinner.md +1 -1
- package/cjs/components/Switcher/Switcher.d.ts +4 -2
- package/cjs/components/Switcher/Switcher.js +13 -3
- package/cjs/components/Switcher/Switcher.js.map +1 -1
- package/cjs/components/Toast/Toast.md +2 -2
- package/cjs/components/TokenInput/TokenInput.d.ts +44 -1
- package/cjs/components/TokenInput/TokenInput.js +42 -0
- package/cjs/components/TokenInput/TokenInput.js.map +1 -1
- package/cjs/components/TokenInput/TokenInput.md +100 -0
- package/cjs/internal/CustomComboBox/CustomComboBox.js +12 -9
- package/cjs/internal/CustomComboBox/CustomComboBox.js.map +1 -1
- package/cjs/internal/InputLikeText/InputLikeText.js +4 -1
- package/cjs/internal/InputLikeText/InputLikeText.js.map +1 -1
- package/cjs/internal/PopupMenu/PopupMenu.d.ts +8 -0
- package/cjs/internal/PopupMenu/PopupMenu.js +23 -3
- package/cjs/internal/PopupMenu/PopupMenu.js.map +1 -1
- package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/cjs/internal/ZIndex/ZIndexStorage.d.ts +0 -5
- package/cjs/internal/ZIndex/ZIndexStorage.js +1 -6
- package/cjs/internal/ZIndex/ZIndexStorage.js.map +1 -1
- package/cjs/internal/icons/SpinnerIcon.styles.js +2 -1
- package/cjs/internal/icons/SpinnerIcon.styles.js.map +1 -1
- package/cjs/internal/themes/DarkTheme.d.ts +1 -0
- package/cjs/internal/themes/DarkTheme.js +6 -5
- package/cjs/internal/themes/DarkTheme.js.map +1 -1
- package/cjs/internal/themes/DefaultTheme.d.ts +1 -0
- package/cjs/internal/themes/DefaultTheme.js +4 -3
- package/cjs/internal/themes/DefaultTheme.js.map +1 -1
- package/cjs/typings/html.d.ts +1 -0
- package/components/Button/Button/Button.js +13 -4
- package/components/Button/Button/Button.js.map +1 -1
- package/components/Button/Button.d.ts +2 -6
- package/components/Button/Button.styles/Button.styles.js +1 -1
- package/components/Button/Button.styles/Button.styles.js.map +1 -1
- package/components/DropdownMenu/DropdownMenu/DropdownMenu.js +2 -1
- package/components/DropdownMenu/DropdownMenu/DropdownMenu.js.map +1 -1
- package/components/DropdownMenu/DropdownMenu.d.ts +1 -1
- package/components/Input/Input/Input.js +18 -5
- package/components/Input/Input/Input.js.map +1 -1
- package/components/Input/Input.d.ts +8 -4
- package/components/Input/Input.md +49 -0
- package/components/Input/Input.styles/Input.styles.js +1 -1
- package/components/Input/Input.styles/Input.styles.js.map +1 -1
- package/components/Kebab/Kebab/Kebab.js +6 -1
- package/components/Kebab/Kebab/Kebab.js.map +1 -1
- package/components/Kebab/Kebab.d.ts +4 -1
- package/components/Loader/Loader/Loader.js +0 -2
- package/components/Loader/Loader/Loader.js.map +1 -1
- package/components/Modal/Modal/Modal.js +28 -11
- package/components/Modal/Modal/Modal.js.map +1 -1
- package/components/Modal/Modal.d.ts +3 -3
- package/components/Modal/Modal.styles/Modal.styles.js +21 -27
- package/components/Modal/Modal.styles/Modal.styles.js.map +1 -1
- package/components/Modal/Modal.styles.d.ts +0 -2
- package/components/Modal/ModalBody/ModalBody.js +0 -2
- package/components/Modal/ModalBody/ModalBody.js.map +1 -1
- package/components/Modal/ModalFooter/ModalFooter.js +2 -6
- package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
- package/components/Modal/ModalHeader/ModalHeader.js +2 -6
- package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
- package/components/PasswordInput/PasswordInput/PasswordInput.js +6 -5
- package/components/PasswordInput/PasswordInput/PasswordInput.js.map +1 -1
- package/components/ScrollContainer/ScrollContainer/ScrollContainer.js +12 -4
- package/components/ScrollContainer/ScrollContainer/ScrollContainer.js.map +1 -1
- package/components/ScrollContainer/ScrollContainer.d.ts +1 -0
- package/components/SidePage/SidePage/SidePage.js +9 -3
- package/components/SidePage/SidePage/SidePage.js.map +1 -1
- package/components/SidePage/SidePage.d.ts +3 -3
- package/components/Spinner/Spinner.md +1 -1
- package/components/Switcher/Switcher/Switcher.js +8 -2
- package/components/Switcher/Switcher/Switcher.js.map +1 -1
- package/components/Switcher/Switcher.d.ts +4 -2
- package/components/Toast/Toast.md +2 -2
- package/components/TokenInput/TokenInput/TokenInput.js.map +1 -1
- package/components/TokenInput/TokenInput.d.ts +44 -1
- package/components/TokenInput/TokenInput.md +100 -0
- package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js +11 -9
- package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js.map +1 -1
- package/internal/InputLikeText/InputLikeText/InputLikeText.js +5 -2
- package/internal/InputLikeText/InputLikeText/InputLikeText.js.map +1 -1
- package/internal/PopupMenu/PopupMenu/PopupMenu.js +13 -2
- package/internal/PopupMenu/PopupMenu/PopupMenu.js.map +1 -1
- package/internal/PopupMenu/PopupMenu.d.ts +8 -0
- package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
- package/internal/ZIndex/ZIndexStorage/ZIndexStorage.js +1 -6
- package/internal/ZIndex/ZIndexStorage/ZIndexStorage.js.map +1 -1
- package/internal/ZIndex/ZIndexStorage.d.ts +0 -5
- package/internal/icons/SpinnerIcon.styles/SpinnerIcon.styles.js +1 -1
- package/internal/icons/SpinnerIcon.styles/SpinnerIcon.styles.js.map +1 -1
- package/internal/themes/DarkTheme/DarkTheme.js +2 -3
- package/internal/themes/DarkTheme/DarkTheme.js.map +1 -1
- package/internal/themes/DarkTheme.d.ts +1 -0
- package/internal/themes/DefaultTheme/DefaultTheme.js +5 -4
- package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
- package/internal/themes/DefaultTheme.d.ts +1 -0
- package/package.json +2 -5
- package/typings/html.d.ts +1 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,37 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [4.14.0-next.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.14.0-next.0...@skbkontur/react-ui@4.14.0-next.1) (2023-06-01)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* **Button, Modal, SidePage, Switcher:** pass props for a11y ([#3163](https://github.com/skbkontur/retail-ui/issues/3163)) ([694e8d9](https://github.com/skbkontur/retail-ui/commit/694e8d97fb07842cc925cfdacc35b167fb1ff9b3))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
# [4.14.0-next.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.13.4...@skbkontur/react-ui@4.14.0-next.0) (2023-05-15)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Bug Fixes
|
|
21
|
+
|
|
22
|
+
* **Button:** correct link outline position (#IF-867) ([#3132](https://github.com/skbkontur/retail-ui/issues/3132)) ([49c7842](https://github.com/skbkontur/retail-ui/commit/49c7842d5e5a6e04788d0da084346461d424a2e2)), closes [#IF-867](https://github.com/skbkontur/retail-ui/issues/IF-867)
|
|
23
|
+
* **ComboBox:** use flushSync due to auto-batching in React18 ([#3144](https://github.com/skbkontur/retail-ui/issues/3144)) ([16bac3c](https://github.com/skbkontur/retail-ui/commit/16bac3c6f41c15409c23f2e3adbade630fa247ea))
|
|
24
|
+
* **Modal:** configure z-index to correctly work with other components ([#3104](https://github.com/skbkontur/retail-ui/issues/3104)) ([0532871](https://github.com/skbkontur/retail-ui/commit/05328718368c146100665f6b3aa5a03a2810b9c3))
|
|
25
|
+
* **ScrollContainer:** scroll disappears after toggling disabled ([#3152](https://github.com/skbkontur/retail-ui/issues/3152)) ([f1c3444](https://github.com/skbkontur/retail-ui/commit/f1c34444d595b14dcd2d397e6a25c45d2c2bc62c))
|
|
26
|
+
* **Spinner:** avoid circle clipping ([#3153](https://github.com/skbkontur/retail-ui/issues/3153)) ([80c2b59](https://github.com/skbkontur/retail-ui/commit/80c2b593da303f8e56feabc5d6d922c72a9175d7))
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
### Features
|
|
30
|
+
|
|
31
|
+
* **Input:** support new types (#IF-290) ([#3129](https://github.com/skbkontur/retail-ui/issues/3129)) ([c478aab](https://github.com/skbkontur/retail-ui/commit/c478aab0f2198bdadc22f8a6c726534f87270454)), closes [#IF-290](https://github.com/skbkontur/retail-ui/issues/IF-290)
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
6
37
|
## [4.13.4](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@4.13.3...@skbkontur/react-ui@4.13.4) (2023-04-14)
|
|
7
38
|
|
|
8
39
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import React, { AriaAttributes } from 'react';
|
|
1
|
+
import React, { AriaAttributes, HTMLAttributes } from 'react';
|
|
2
2
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
3
3
|
export declare type ButtonSize = 'small' | 'medium' | 'large';
|
|
4
4
|
export declare type ButtonType = 'button' | 'submit' | 'reset';
|
|
5
5
|
export declare type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';
|
|
6
|
-
export interface ButtonProps extends CommonProps {
|
|
6
|
+
export interface ButtonProps extends CommonProps, Pick<AriaAttributes, 'aria-haspopup' | 'aria-describedby' | 'aria-controls' | 'aria-label' | 'aria-checked'>, Pick<HTMLAttributes<unknown>, 'role'> {
|
|
7
7
|
/** @ignore */
|
|
8
8
|
_noPadding?: boolean;
|
|
9
9
|
/** @ignore */
|
|
@@ -115,10 +115,6 @@ export interface ButtonProps extends CommonProps {
|
|
|
115
115
|
* CSS-свойство `width`.
|
|
116
116
|
*/
|
|
117
117
|
width?: number | string;
|
|
118
|
-
/**
|
|
119
|
-
* Атрибут для указания id элемента(-ов), описывающих его
|
|
120
|
-
*/
|
|
121
|
-
'aria-describedby'?: AriaAttributes['aria-describedby'];
|
|
122
118
|
}
|
|
123
119
|
export interface ButtonState {
|
|
124
120
|
focusedByTab: boolean;
|
|
@@ -164,8 +164,6 @@ var _Button = require("./Button.styles");var _class, _class2, _temp;
|
|
|
164
164
|
|
|
165
165
|
|
|
166
166
|
|
|
167
|
-
|
|
168
|
-
|
|
169
167
|
|
|
170
168
|
|
|
171
169
|
|
|
@@ -438,6 +436,17 @@ Button = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functi
|
|
|
438
436
|
|
|
439
437
|
|
|
440
438
|
|
|
439
|
+
|
|
440
|
+
|
|
441
|
+
|
|
442
|
+
|
|
443
|
+
|
|
444
|
+
|
|
445
|
+
|
|
446
|
+
|
|
447
|
+
|
|
448
|
+
|
|
449
|
+
|
|
441
450
|
|
|
442
451
|
|
|
443
452
|
|
|
@@ -476,8 +485,8 @@ Button = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functi
|
|
|
476
485
|
* @public
|
|
477
486
|
*/;_proto.focus = function focus() {var _this$node;(_this$node = this.node) == null ? void 0 : _this$node.focus();} /**
|
|
478
487
|
* @public
|
|
479
|
-
*/;_proto.blur = function blur() {var _this$node2;(_this$node2 = this.node) == null ? void 0 : _this$node2.blur();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx, _cx2, _cx7, _cx8;var _this$props = this.props,corners = _this$props.corners,active = _this$props.active,disabled = _this$props.disabled,borderless = _this$props.borderless,checked = _this$props.checked,error = _this$props.error,warning = _this$props.warning,loading = _this$props.loading,arrow = _this$props.arrow,narrow = _this$props.narrow,icon = _this$props.icon,_noPadding = _this$props._noPadding,_noRightPadding = _this$props._noRightPadding,visuallyFocused = _this$props.visuallyFocused,align = _this$props.align,disableFocus = _this$props.disableFocus,onMouseEnter = _this$props.onMouseEnter,onMouseLeave = _this$props.onMouseLeave,onMouseOver = _this$props.onMouseOver,onKeyDown = _this$props.onKeyDown,onClick = _this$props.onClick,width = _this$props.width,children = _this$props.children,ariaDescribedby = _this$props['aria-describedby'];var _this$getProps = this.getProps(),use = _this$getProps.use,type = _this$getProps.type;var sizeClass = this.getSizeClassName();var isFocused = this.state.focusedByTab || visuallyFocused;var isLink = use === 'link';var rootProps = { // By default the type attribute is 'submit'. IE8 will fire a click event
|
|
488
|
+
*/;_proto.blur = function blur() {var _this$node2;(_this$node2 = this.node) == null ? void 0 : _this$node2.blur();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx, _cx2, _cx7, _cx8;var _this$props = this.props,corners = _this$props.corners,active = _this$props.active,disabled = _this$props.disabled,borderless = _this$props.borderless,checked = _this$props.checked,error = _this$props.error,warning = _this$props.warning,loading = _this$props.loading,arrow = _this$props.arrow,narrow = _this$props.narrow,icon = _this$props.icon,_noPadding = _this$props._noPadding,_noRightPadding = _this$props._noRightPadding,visuallyFocused = _this$props.visuallyFocused,align = _this$props.align,disableFocus = _this$props.disableFocus,onMouseEnter = _this$props.onMouseEnter,onMouseLeave = _this$props.onMouseLeave,onMouseOver = _this$props.onMouseOver,onKeyDown = _this$props.onKeyDown,onClick = _this$props.onClick,width = _this$props.width,children = _this$props.children,ariaDescribedby = _this$props['aria-describedby'],ariaHasPopup = _this$props['aria-haspopup'],ariaControls = _this$props['aria-controls'],ariaLabel = _this$props['aria-label'],ariaChecked = _this$props['aria-checked'],role = _this$props.role;var _this$getProps = this.getProps(),use = _this$getProps.use,type = _this$getProps.type;var sizeClass = this.getSizeClassName();var isFocused = this.state.focusedByTab || visuallyFocused;var isLink = use === 'link';var rootProps = { // By default the type attribute is 'submit'. IE8 will fire a click event
|
|
480
489
|
// on this button if somewhere on the page user presses Enter while some
|
|
481
490
|
// input is focused. So we set type to 'button' by default.
|
|
482
|
-
type: type, className: (0, _Emotion.cx)((_cx = {}, _cx[_Button.styles.root(this.theme)] = true, _cx[_Button.styles[use](this.theme)] = true, _cx[_Button.activeStyles[use](this.theme)] = active, _cx[sizeClass] = true, _cx[_Button.styles.focus(this.theme)] = isFocused, _cx[_Button.styles.checked(this.theme)] = checked, _cx[_Button.styles.checkedFocused(this.theme)] = checked && isFocused, _cx[_Button.styles.disabled(this.theme)] = disabled || loading, _cx[_Button.styles.checkedDisabled(this.theme)] = checked && disabled, _cx[_Button.styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _cx[_Button.styles.narrow()] = narrow, _cx[_Button.styles.noPadding()] = _noPadding, _cx[_Button.styles.noRightPadding()] = _noRightPadding, _cx)), style: (0, _extends2.default)({ textAlign: align }, corners), disabled: disabled || loading, onClick: onClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: onKeyDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, tabIndex: disableFocus ? -1 : 0, title: this.props.title };var wrapProps = { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Button.styles.wrap(this.theme)] = true, _cx2[_Button.styles.wrapArrow()] = arrow === true, _cx2[_Button.styles.wrapArrowLeft()] = arrow === 'left', _cx2[this.getSizeWrapClassName()] = true, _cx2)), style: { width: width } };var innerShadowNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.globalClasses.innerShadow });var outlineNode = null;if (!isFocused || isLink) {var _cx3;outlineNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.styles.outline(), (_cx3 = {}, _cx3[_Button.styles.outlineWarning(this.theme)] = warning, _cx3[_Button.styles.outlineError(this.theme)] = error, _cx3[_Button.styles.outlineLink()] = isLink, _cx3[_Button.styles.outlineLinkWarning(this.theme)] = isLink && warning, _cx3[_Button.styles.outlineLinkError(this.theme)] = isLink && error, _cx3)) });}var loadingNode = null;if (loading && !icon) {loadingNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.styles.loading() }, this.getLoadingSpinner());}var iconNode = null;if (icon) {var _cx4;iconNode = /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Button.styles.icon(), this.getSizeIconClassName(), (_cx4 = {}, _cx4[_Button.styles.iconNoRightMargin()] = !children, _cx4[_Button.styles.iconLink(this.theme)] = isLink, _cx4)) }, loading ? this.getLoadingSpinner() : icon);}var arrowNode = null;if (arrow) {var _cx5;arrowNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Button.styles.arrow()] = true, _cx5[_Button.styles.arrowWarning(this.theme)] = !checked && warning, _cx5[_Button.styles.arrowError(this.theme)] = !checked && error, _cx5[_Button.styles.arrowFocus(this.theme)] = !checked && isFocused, _cx5[_Button.styles.arrowLeft()] = arrow === 'left', _cx5)) }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperTop) }), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperBottom) }));} // Force disable all props and features, that cannot be use with Link
|
|
483
|
-
if (isLink) {var _cx6;rootProps.className = (0, _Emotion.cx)((_cx6 = {}, _cx6[_Button.styles.root(this.theme)] = true, _cx6[sizeClass] = true, _cx6[_Button.styles.link(this.theme)] = true, _cx6[_Button.styles.linkFocus(this.theme)] = isFocused, _cx6[_Button.styles.linkDisabled(this.theme)] = disabled || loading, _cx6));Object.assign(wrapProps, { className: (0, _Emotion.cx)(_Button.styles.wrap(this.theme), _Button.styles.wrapLink()), style: { width: wrapProps.style.width } });rootProps.style.textAlign = undefined;arrowNode = null;}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", wrapProps, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({ "data-tid": ButtonDataTids.root, ref: this._ref }, rootProps
|
|
491
|
+
type: type, role: role, 'aria-describedby': ariaDescribedby, 'aria-haspopup': ariaHasPopup, 'aria-controls': ariaControls, 'aria-label': ariaLabel, 'aria-checked': ariaChecked, className: (0, _Emotion.cx)((_cx = {}, _cx[_Button.styles.root(this.theme)] = true, _cx[_Button.styles[use](this.theme)] = true, _cx[_Button.activeStyles[use](this.theme)] = active, _cx[sizeClass] = true, _cx[_Button.styles.focus(this.theme)] = isFocused, _cx[_Button.styles.checked(this.theme)] = checked, _cx[_Button.styles.checkedFocused(this.theme)] = checked && isFocused, _cx[_Button.styles.disabled(this.theme)] = disabled || loading, _cx[_Button.styles.checkedDisabled(this.theme)] = checked && disabled, _cx[_Button.styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _cx[_Button.styles.narrow()] = narrow, _cx[_Button.styles.noPadding()] = _noPadding, _cx[_Button.styles.noRightPadding()] = _noRightPadding, _cx)), style: (0, _extends2.default)({ textAlign: align }, corners), disabled: disabled || loading, onClick: onClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: onKeyDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, tabIndex: disableFocus ? -1 : 0, title: this.props.title };var wrapProps = { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Button.styles.wrap(this.theme)] = true, _cx2[_Button.styles.wrapArrow()] = arrow === true, _cx2[_Button.styles.wrapArrowLeft()] = arrow === 'left', _cx2[this.getSizeWrapClassName()] = true, _cx2)), style: { width: width } };var innerShadowNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.globalClasses.innerShadow });var outlineNode = null;if (!isFocused || isLink) {var _cx3;outlineNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.styles.outline(), (_cx3 = {}, _cx3[_Button.styles.outlineWarning(this.theme)] = warning, _cx3[_Button.styles.outlineError(this.theme)] = error, _cx3[_Button.styles.outlineLink()] = isLink, _cx3[_Button.styles.outlineLinkWarning(this.theme)] = isLink && warning, _cx3[_Button.styles.outlineLinkError(this.theme)] = isLink && error, _cx3)) });}var loadingNode = null;if (loading && !icon) {loadingNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.styles.loading() }, this.getLoadingSpinner());}var iconNode = null;if (icon) {var _cx4;iconNode = /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Button.styles.icon(), this.getSizeIconClassName(), (_cx4 = {}, _cx4[_Button.styles.iconNoRightMargin()] = !children, _cx4[_Button.styles.iconLink(this.theme)] = isLink, _cx4)) }, loading ? this.getLoadingSpinner() : icon);}var arrowNode = null;if (arrow) {var _cx5;arrowNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Button.styles.arrow()] = true, _cx5[_Button.styles.arrowWarning(this.theme)] = !checked && warning, _cx5[_Button.styles.arrowError(this.theme)] = !checked && error, _cx5[_Button.styles.arrowFocus(this.theme)] = !checked && isFocused, _cx5[_Button.styles.arrowLeft()] = arrow === 'left', _cx5)) }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperTop) }), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperBottom) }));} // Force disable all props and features, that cannot be use with Link
|
|
492
|
+
if (isLink) {var _cx6;rootProps.className = (0, _Emotion.cx)((_cx6 = {}, _cx6[_Button.styles.root(this.theme)] = true, _cx6[sizeClass] = true, _cx6[_Button.styles.link(this.theme)] = true, _cx6[_Button.styles.linkFocus(this.theme)] = isFocused, _cx6[_Button.styles.linkDisabled(this.theme)] = disabled || loading, _cx6));Object.assign(wrapProps, { className: (0, _Emotion.cx)(_Button.styles.wrap(this.theme), _Button.styles.wrapLink()), style: { width: wrapProps.style.width } });rootProps.style.textAlign = undefined;arrowNode = null;}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", wrapProps, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({ "data-tid": ButtonDataTids.root, ref: this._ref }, rootProps), innerShadowNode, outlineNode, loadingNode, arrowNode, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.styles.caption(), _Button.globalClasses.caption, (_cx7 = {}, _cx7[_Button.styles.captionTranslated()] = active || checked, _cx7[_Button.styles.captionLink()] = isLink, _cx7[_Button.styles.captionDisabled()] = !checked && disabled, _cx7)) }, iconNode, /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)((_cx8 = {}, _cx8[_Button.styles.visibilityHidden()] = !!loadingNode, _cx8)) }, children)))));};_proto.getLoadingSpinner = function getLoadingSpinner() {return /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { caption: null, dimmed: true, type: "mini" });};_proto.getSizeClassName = function getSizeClassName() {var _cx9, _cx10, _cx11;switch (this.getProps().size) {case 'large':return (0, _Emotion.cx)(_Button.styles.sizeLarge(this.theme), (_cx9 = {}, _cx9[_Button.styles.sizeLargeIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx9));case 'medium':return (0, _Emotion.cx)(_Button.styles.sizeMedium(this.theme), (_cx10 = {}, _cx10[_Button.styles.sizeMediumIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx10));case 'small':default:return (0, _Emotion.cx)(_Button.styles.sizeSmall(this.theme), (_cx11 = {}, _cx11[_Button.styles.sizeSmallIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx11));}};_proto.getSizeIconClassName = function getSizeIconClassName() {switch (this.getProps().size) {case 'large':return _Button.styles.iconLarge(this.theme);case 'medium':return _Button.styles.iconMedium(this.theme);case 'small':default:return _Button.styles.iconSmall(this.theme);}};_proto.getSizeWrapClassName = function getSizeWrapClassName() {switch (this.getProps().size) {case 'large':return _Button.styles.wrapLarge(this.theme);case 'medium':return _Button.styles.wrapMedium(this.theme);case 'small':default:return _Button.styles.wrapSmall(this.theme);}};return Button;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Button', _class2.__BUTTON__ = true, _class2.defaultProps = { use: 'default', size: 'small', type: 'button' }, _temp)) || _class;exports.Button = Button;var isButton = (0, _utils.isReactUIComponent)('Button');exports.isButton = isButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Button.tsx"],"names":["ButtonDataTids","root","Button","rootNode","getProps","defaultProps","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","keyListener","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","theme","renderMain","corners","active","borderless","checked","error","warning","arrow","narrow","icon","_noPadding","_noRightPadding","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onClick","width","children","ariaDescribedby","use","type","sizeClass","getSizeClassName","isFocused","isLink","rootProps","className","styles","activeStyles","checkedFocused","checkedDisabled","noPadding","noRightPadding","style","textAlign","tabIndex","title","wrapProps","wrap","wrapArrow","wrapArrowLeft","getSizeWrapClassName","innerShadowNode","globalClasses","innerShadow","outlineNode","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","loadingNode","getLoadingSpinner","iconNode","getSizeIconClassName","iconNoRightMargin","iconLink","arrowNode","arrowWarning","arrowError","arrowFocus","arrowLeft","arrowHelper","arrowHelperTop","arrowHelperBottom","link","linkFocus","linkDisabled","Object","assign","wrapLink","undefined","setRootNode","caption","captionTranslated","captionLink","captionDisabled","visibilityHidden","size","sizeLarge","sizeLargeIE11","isIE11","isEdge","sizeMedium","sizeMediumIE11","sizeSmall","sizeSmallIE11","iconLarge","iconMedium","iconSmall","wrapLarge","wrapMedium","wrapSmall","React","Component","__KONTUR_REACT_UI__","__BUTTON__","isButton"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\n\nimport { isReactUIComponent } from '../../lib/utils';\nimport { isIE11, isEdge } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles, activeStyles, globalClasses } from './Button.styles';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';\n\nexport interface ButtonProps extends CommonProps {\n /** @ignore */\n _noPadding?: boolean;\n\n /** @ignore */\n _noRightPadding?: boolean;\n\n /**\n * Применяет к кнопке стили псевдокласса `:active`.\n */\n active?: boolean;\n\n /**\n * CSS-свойство `text-align`.\n */\n align?: React.CSSProperties['textAlign'];\n\n /**\n * Превращает обычную кнопку в кнопку со стрелкой.\n */\n arrow?: boolean | 'left';\n\n /**\n * Даёт кнопке фокус после окончания загрузки страницы.\n */\n autoFocus?: boolean;\n\n /**\n * Убирает обводку у кнопки.\n */\n borderless?: boolean;\n\n /**\n * @ignore\n */\n checked?: boolean;\n\n children?: React.ReactNode;\n\n /** @ignore */\n corners?: React.CSSProperties;\n\n /**\n * Отключенное состояние кнопки.\n */\n disabled?: boolean;\n\n /** @ignore */\n disableFocus?: boolean;\n\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Иконка слева от текста кнопки.\n */\n icon?: React.ReactElement<any>;\n\n /**\n * Переводит кнопку в состояние загрузки.\n */\n loading?: boolean;\n\n /**\n * Сужает кнопку.\n */\n narrow?: boolean;\n\n /**\n * HTML-событие `onblur`.\n */\n onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onclick`.\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onfocus`.\n */\n onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `keydown`.\n */\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseenter`.\n */\n onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseover`.\n */\n onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * Задаёт размер кнопки.\n *\n * **Допустимые значения**: `\"small\"`, `\"medium\"`, `\"large\"`.\n */\n size?: ButtonSize;\n\n /**\n * HTML-атрибут `type`.\n */\n type?: ButtonType;\n\n /**\n * HTML-атрибут `title`.\n */\n title?: string;\n\n /**\n * Стиль кнопки.\n *\n * **Допустимые значения**: `\"default\"`, `\"primary\"`, `\"success\"`, `\"danger\"`, `\"pay\"`, `\"link\"`.\n */\n use?: ButtonUse;\n\n /** @ignore */\n visuallyFocused?: boolean;\n\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * CSS-свойство `width`.\n */\n width?: number | string;\n\n /**\n * Атрибут для указания id элемента(-ов), описывающих его\n */\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport interface ButtonState {\n focusedByTab: boolean;\n}\n\nexport const ButtonDataTids = {\n root: 'Button__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ButtonProps, 'use' | 'size' | 'type'>>;\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n public static __KONTUR_REACT_UI__ = 'Button';\n public static __BUTTON__ = true;\n\n public static defaultProps: DefaultProps = {\n use: 'default',\n size: 'small',\n type: 'button',\n };\n\n private getProps = createPropsGetter(Button.defaultProps);\n\n public state = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private node: HTMLButtonElement | null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n public static getDerivedStateFromProps(props: ButtonProps) {\n if (props.loading || props.disabled) {\n return { focusedByTab: false };\n }\n return null;\n }\n\n /**\n * @public\n */\n public focus() {\n this.node?.focus();\n }\n\n /**\n * @public\n */\n public blur() {\n this.node?.blur();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const {\n corners,\n active,\n disabled,\n borderless,\n checked,\n error,\n warning,\n loading,\n arrow,\n narrow,\n icon,\n _noPadding,\n _noRightPadding,\n visuallyFocused,\n align,\n disableFocus,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onKeyDown,\n onClick,\n width,\n children,\n 'aria-describedby': ariaDescribedby,\n } = this.props;\n const { use, type } = this.getProps();\n const sizeClass = this.getSizeClassName();\n\n const isFocused = this.state.focusedByTab || visuallyFocused;\n const isLink = use === 'link';\n const rootProps = {\n // By default the type attribute is 'submit'. IE8 will fire a click event\n // on this button if somewhere on the page user presses Enter while some\n // input is focused. So we set type to 'button' by default.\n type,\n className: cx({\n [styles.root(this.theme)]: true,\n [styles[use](this.theme)]: true,\n [activeStyles[use](this.theme)]: active,\n [sizeClass]: true,\n [styles.focus(this.theme)]: isFocused,\n [styles.checked(this.theme)]: checked,\n [styles.checkedFocused(this.theme)]: checked && isFocused,\n [styles.disabled(this.theme)]: disabled || loading,\n [styles.checkedDisabled(this.theme)]: checked && disabled,\n [styles.borderless()]: borderless && !disabled && !loading && !checked && !isFocused && !active,\n [styles.narrow()]: narrow,\n [styles.noPadding()]: _noPadding,\n [styles.noRightPadding()]: _noRightPadding,\n }),\n style: {\n textAlign: align,\n ...corners,\n },\n disabled: disabled || loading,\n onClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onKeyDown,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n tabIndex: disableFocus ? -1 : 0,\n title: this.props.title,\n };\n\n const wrapProps = {\n className: cx({\n [styles.wrap(this.theme)]: true,\n [styles.wrapArrow()]: arrow === true,\n [styles.wrapArrowLeft()]: arrow === 'left',\n [this.getSizeWrapClassName()]: true,\n }),\n style: {\n width,\n },\n };\n\n const innerShadowNode = <div className={globalClasses.innerShadow} />;\n\n let outlineNode = null;\n if (!isFocused || isLink) {\n outlineNode = (\n <div\n className={cx(styles.outline(), {\n [styles.outlineWarning(this.theme)]: warning,\n [styles.outlineError(this.theme)]: error,\n [styles.outlineLink()]: isLink,\n [styles.outlineLinkWarning(this.theme)]: isLink && warning,\n [styles.outlineLinkError(this.theme)]: isLink && error,\n })}\n />\n );\n }\n\n let loadingNode = null;\n if (loading && !icon) {\n loadingNode = <div className={styles.loading()}>{this.getLoadingSpinner()}</div>;\n }\n\n let iconNode = null;\n if (icon) {\n iconNode = (\n <span\n className={cx(styles.icon(), this.getSizeIconClassName(), {\n [styles.iconNoRightMargin()]: !children,\n [styles.iconLink(this.theme)]: isLink,\n })}\n >\n {loading ? this.getLoadingSpinner() : icon}\n </span>\n );\n }\n\n let arrowNode = null;\n if (arrow) {\n arrowNode = (\n <div\n className={cx({\n [styles.arrow()]: true,\n [styles.arrowWarning(this.theme)]: !checked && warning,\n [styles.arrowError(this.theme)]: !checked && error,\n [styles.arrowFocus(this.theme)]: !checked && isFocused,\n [styles.arrowLeft()]: arrow === 'left',\n })}\n >\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)} />\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)} />\n </div>\n );\n }\n\n // Force disable all props and features, that cannot be use with Link\n if (isLink) {\n rootProps.className = cx({\n [styles.root(this.theme)]: true,\n [sizeClass]: true,\n [styles.link(this.theme)]: true,\n [styles.linkFocus(this.theme)]: isFocused,\n [styles.linkDisabled(this.theme)]: disabled || loading,\n });\n Object.assign(wrapProps, {\n className: cx(styles.wrap(this.theme), styles.wrapLink()),\n style: { width: wrapProps.style.width },\n });\n rootProps.style.textAlign = undefined;\n arrowNode = null;\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <span {...wrapProps}>\n <button data-tid={ButtonDataTids.root} ref={this._ref} {...rootProps} aria-describedby={ariaDescribedby}>\n {innerShadowNode}\n {outlineNode}\n {loadingNode}\n {arrowNode}\n <div\n className={cx(styles.caption(), globalClasses.caption, {\n [styles.captionTranslated()]: active || checked,\n [styles.captionLink()]: isLink,\n [styles.captionDisabled()]: !checked && disabled,\n })}\n >\n {iconNode}\n <span className={cx({ [styles.visibilityHidden()]: !!loadingNode })}>{children}</span>\n </div>\n </button>\n </span>\n </CommonWrapper>\n );\n }\n\n private getLoadingSpinner() {\n return <Spinner caption={null} dimmed type=\"mini\" />;\n }\n\n private getSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return cx(styles.sizeLarge(this.theme), { [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge });\n case 'medium':\n return cx(styles.sizeMedium(this.theme), { [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge });\n case 'small':\n default:\n return cx(styles.sizeSmall(this.theme), { [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge });\n }\n }\n\n private getSizeIconClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.iconLarge(this.theme);\n case 'medium':\n return styles.iconMedium(this.theme);\n case 'small':\n default:\n return styles.iconSmall(this.theme);\n }\n }\n\n private getSizeWrapClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.wrapLarge(this.theme);\n case 'medium':\n return styles.wrapMedium(this.theme);\n case 'small':\n default:\n return styles.wrapSmall(this.theme);\n }\n }\n\n private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!this.props.disabled && !this.props.disableFocus) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n this.props.onFocus?.(e);\n }\n };\n\n private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\n this.setState({ focusedByTab: false });\n if (!this.props.disabled && !this.props.disableFocus) {\n this.props.onBlur?.(e);\n }\n };\n\n private _ref = (node: HTMLButtonElement | null) => {\n this.node = node;\n };\n}\n\nexport const isButton = isReactUIComponent<ButtonProps>('Button');\n"]}
|
|
1
|
+
{"version":3,"sources":["Button.tsx"],"names":["ButtonDataTids","root","Button","rootNode","getProps","defaultProps","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","keyListener","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","theme","renderMain","corners","active","borderless","checked","error","warning","arrow","narrow","icon","_noPadding","_noRightPadding","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onClick","width","children","ariaDescribedby","ariaHasPopup","ariaControls","ariaLabel","ariaChecked","role","use","type","sizeClass","getSizeClassName","isFocused","isLink","rootProps","className","styles","activeStyles","checkedFocused","checkedDisabled","noPadding","noRightPadding","style","textAlign","tabIndex","title","wrapProps","wrap","wrapArrow","wrapArrowLeft","getSizeWrapClassName","innerShadowNode","globalClasses","innerShadow","outlineNode","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","loadingNode","getLoadingSpinner","iconNode","getSizeIconClassName","iconNoRightMargin","iconLink","arrowNode","arrowWarning","arrowError","arrowFocus","arrowLeft","arrowHelper","arrowHelperTop","arrowHelperBottom","link","linkFocus","linkDisabled","Object","assign","wrapLink","undefined","setRootNode","caption","captionTranslated","captionLink","captionDisabled","visibilityHidden","size","sizeLarge","sizeLargeIE11","isIE11","isEdge","sizeMedium","sizeMediumIE11","sizeSmall","sizeSmallIE11","iconLarge","iconMedium","iconSmall","wrapLarge","wrapMedium","wrapSmall","React","Component","__KONTUR_REACT_UI__","__BUTTON__","isButton"],"mappings":"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","sourcesContent":["import React, { AriaAttributes, HTMLAttributes } from 'react';\n\nimport { isReactUIComponent } from '../../lib/utils';\nimport { isIE11, isEdge } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles, activeStyles, globalClasses } from './Button.styles';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';\n\nexport interface ButtonProps\n extends CommonProps,\n Pick<AriaAttributes, 'aria-haspopup' | 'aria-describedby' | 'aria-controls' | 'aria-label' | 'aria-checked'>,\n Pick<HTMLAttributes<unknown>, 'role'> {\n /** @ignore */\n _noPadding?: boolean;\n\n /** @ignore */\n _noRightPadding?: boolean;\n\n /**\n * Применяет к кнопке стили псевдокласса `:active`.\n */\n active?: boolean;\n\n /**\n * CSS-свойство `text-align`.\n */\n align?: React.CSSProperties['textAlign'];\n\n /**\n * Превращает обычную кнопку в кнопку со стрелкой.\n */\n arrow?: boolean | 'left';\n\n /**\n * Даёт кнопке фокус после окончания загрузки страницы.\n */\n autoFocus?: boolean;\n\n /**\n * Убирает обводку у кнопки.\n */\n borderless?: boolean;\n\n /**\n * @ignore\n */\n checked?: boolean;\n\n children?: React.ReactNode;\n\n /** @ignore */\n corners?: React.CSSProperties;\n\n /**\n * Отключенное состояние кнопки.\n */\n disabled?: boolean;\n\n /** @ignore */\n disableFocus?: boolean;\n\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Иконка слева от текста кнопки.\n */\n icon?: React.ReactElement<any>;\n\n /**\n * Переводит кнопку в состояние загрузки.\n */\n loading?: boolean;\n\n /**\n * Сужает кнопку.\n */\n narrow?: boolean;\n\n /**\n * HTML-событие `onblur`.\n */\n onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onclick`.\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onfocus`.\n */\n onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `keydown`.\n */\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseenter`.\n */\n onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseover`.\n */\n onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * Задаёт размер кнопки.\n *\n * **Допустимые значения**: `\"small\"`, `\"medium\"`, `\"large\"`.\n */\n size?: ButtonSize;\n\n /**\n * HTML-атрибут `type`.\n */\n type?: ButtonType;\n\n /**\n * HTML-атрибут `title`.\n */\n title?: string;\n\n /**\n * Стиль кнопки.\n *\n * **Допустимые значения**: `\"default\"`, `\"primary\"`, `\"success\"`, `\"danger\"`, `\"pay\"`, `\"link\"`.\n */\n use?: ButtonUse;\n\n /** @ignore */\n visuallyFocused?: boolean;\n\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * CSS-свойство `width`.\n */\n width?: number | string;\n}\n\nexport interface ButtonState {\n focusedByTab: boolean;\n}\n\nexport const ButtonDataTids = {\n root: 'Button__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ButtonProps, 'use' | 'size' | 'type'>>;\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n public static __KONTUR_REACT_UI__ = 'Button';\n public static __BUTTON__ = true;\n\n public static defaultProps: DefaultProps = {\n use: 'default',\n size: 'small',\n type: 'button',\n };\n\n private getProps = createPropsGetter(Button.defaultProps);\n\n public state = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private node: HTMLButtonElement | null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n public static getDerivedStateFromProps(props: ButtonProps) {\n if (props.loading || props.disabled) {\n return { focusedByTab: false };\n }\n return null;\n }\n\n /**\n * @public\n */\n public focus() {\n this.node?.focus();\n }\n\n /**\n * @public\n */\n public blur() {\n this.node?.blur();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const {\n corners,\n active,\n disabled,\n borderless,\n checked,\n error,\n warning,\n loading,\n arrow,\n narrow,\n icon,\n _noPadding,\n _noRightPadding,\n visuallyFocused,\n align,\n disableFocus,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onKeyDown,\n onClick,\n width,\n children,\n 'aria-describedby': ariaDescribedby,\n 'aria-haspopup': ariaHasPopup,\n 'aria-controls': ariaControls,\n 'aria-label': ariaLabel,\n 'aria-checked': ariaChecked,\n role,\n } = this.props;\n const { use, type } = this.getProps();\n const sizeClass = this.getSizeClassName();\n\n const isFocused = this.state.focusedByTab || visuallyFocused;\n const isLink = use === 'link';\n const rootProps = {\n // By default the type attribute is 'submit'. IE8 will fire a click event\n // on this button if somewhere on the page user presses Enter while some\n // input is focused. So we set type to 'button' by default.\n type,\n role,\n 'aria-describedby': ariaDescribedby,\n 'aria-haspopup': ariaHasPopup,\n 'aria-controls': ariaControls,\n 'aria-label': ariaLabel,\n 'aria-checked': ariaChecked,\n className: cx({\n [styles.root(this.theme)]: true,\n [styles[use](this.theme)]: true,\n [activeStyles[use](this.theme)]: active,\n [sizeClass]: true,\n [styles.focus(this.theme)]: isFocused,\n [styles.checked(this.theme)]: checked,\n [styles.checkedFocused(this.theme)]: checked && isFocused,\n [styles.disabled(this.theme)]: disabled || loading,\n [styles.checkedDisabled(this.theme)]: checked && disabled,\n [styles.borderless()]: borderless && !disabled && !loading && !checked && !isFocused && !active,\n [styles.narrow()]: narrow,\n [styles.noPadding()]: _noPadding,\n [styles.noRightPadding()]: _noRightPadding,\n }),\n style: {\n textAlign: align,\n ...corners,\n },\n disabled: disabled || loading,\n onClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onKeyDown,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n tabIndex: disableFocus ? -1 : 0,\n title: this.props.title,\n };\n\n const wrapProps = {\n className: cx({\n [styles.wrap(this.theme)]: true,\n [styles.wrapArrow()]: arrow === true,\n [styles.wrapArrowLeft()]: arrow === 'left',\n [this.getSizeWrapClassName()]: true,\n }),\n style: {\n width,\n },\n };\n\n const innerShadowNode = <div className={globalClasses.innerShadow} />;\n\n let outlineNode = null;\n if (!isFocused || isLink) {\n outlineNode = (\n <div\n className={cx(styles.outline(), {\n [styles.outlineWarning(this.theme)]: warning,\n [styles.outlineError(this.theme)]: error,\n [styles.outlineLink()]: isLink,\n [styles.outlineLinkWarning(this.theme)]: isLink && warning,\n [styles.outlineLinkError(this.theme)]: isLink && error,\n })}\n />\n );\n }\n\n let loadingNode = null;\n if (loading && !icon) {\n loadingNode = <div className={styles.loading()}>{this.getLoadingSpinner()}</div>;\n }\n\n let iconNode = null;\n if (icon) {\n iconNode = (\n <span\n className={cx(styles.icon(), this.getSizeIconClassName(), {\n [styles.iconNoRightMargin()]: !children,\n [styles.iconLink(this.theme)]: isLink,\n })}\n >\n {loading ? this.getLoadingSpinner() : icon}\n </span>\n );\n }\n\n let arrowNode = null;\n if (arrow) {\n arrowNode = (\n <div\n className={cx({\n [styles.arrow()]: true,\n [styles.arrowWarning(this.theme)]: !checked && warning,\n [styles.arrowError(this.theme)]: !checked && error,\n [styles.arrowFocus(this.theme)]: !checked && isFocused,\n [styles.arrowLeft()]: arrow === 'left',\n })}\n >\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)} />\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)} />\n </div>\n );\n }\n\n // Force disable all props and features, that cannot be use with Link\n if (isLink) {\n rootProps.className = cx({\n [styles.root(this.theme)]: true,\n [sizeClass]: true,\n [styles.link(this.theme)]: true,\n [styles.linkFocus(this.theme)]: isFocused,\n [styles.linkDisabled(this.theme)]: disabled || loading,\n });\n Object.assign(wrapProps, {\n className: cx(styles.wrap(this.theme), styles.wrapLink()),\n style: { width: wrapProps.style.width },\n });\n rootProps.style.textAlign = undefined;\n arrowNode = null;\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <span {...wrapProps}>\n <button data-tid={ButtonDataTids.root} ref={this._ref} {...rootProps}>\n {innerShadowNode}\n {outlineNode}\n {loadingNode}\n {arrowNode}\n <div\n className={cx(styles.caption(), globalClasses.caption, {\n [styles.captionTranslated()]: active || checked,\n [styles.captionLink()]: isLink,\n [styles.captionDisabled()]: !checked && disabled,\n })}\n >\n {iconNode}\n <span className={cx({ [styles.visibilityHidden()]: !!loadingNode })}>{children}</span>\n </div>\n </button>\n </span>\n </CommonWrapper>\n );\n }\n\n private getLoadingSpinner() {\n return <Spinner caption={null} dimmed type=\"mini\" />;\n }\n\n private getSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return cx(styles.sizeLarge(this.theme), { [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge });\n case 'medium':\n return cx(styles.sizeMedium(this.theme), { [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge });\n case 'small':\n default:\n return cx(styles.sizeSmall(this.theme), { [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge });\n }\n }\n\n private getSizeIconClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.iconLarge(this.theme);\n case 'medium':\n return styles.iconMedium(this.theme);\n case 'small':\n default:\n return styles.iconSmall(this.theme);\n }\n }\n\n private getSizeWrapClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.wrapLarge(this.theme);\n case 'medium':\n return styles.wrapMedium(this.theme);\n case 'small':\n default:\n return styles.wrapSmall(this.theme);\n }\n }\n\n private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!this.props.disabled && !this.props.disableFocus) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n this.props.onFocus?.(e);\n }\n };\n\n private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\n this.setState({ focusedByTab: false });\n if (!this.props.disabled && !this.props.disableFocus) {\n this.props.onBlur?.(e);\n }\n };\n\n private _ref = (node: HTMLButtonElement | null) => {\n this.node = node;\n };\n}\n\nexport const isButton = isReactUIComponent<ButtonProps>('Button');\n"]}
|
|
@@ -89,7 +89,8 @@ var styles = (0, _Emotion.memoizeStyle)({
|
|
|
89
89
|
},
|
|
90
90
|
|
|
91
91
|
outlineLink: function outlineLink() {
|
|
92
|
-
return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n box-shadow: none;\n left: -2px;\n right: -2px;\n bottom: -2px;\n "])));
|
|
92
|
+
return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n box-shadow: none;\n left: -2px;\n right: -2px;\n bottom: -2px;\n top: -2px;\n "])));
|
|
93
|
+
|
|
93
94
|
|
|
94
95
|
|
|
95
96
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Button.styles.ts"],"names":["globalClasses","arrowHelper","arrowHelperTop","arrowHelperBottom","caption","innerShadow","styles","root","t","css","btnBackgroundClip","outline","outlineWarning","btnOutlineWidth","btnBorderColorWarning","btnInsetWidth","btnInsetColor","outlineError","btnBorderColorError","outlineLink","outlineLinkWarning","btnWarningSecondary","outlineLinkError","btnErrorSecondary","sizeSmall","btnBorderRadiusSmall","btnFontSizeSmall","btnLineHeightSmall","btnPaddingXSmall","btnPaddingYSmall","fontFamilyCompensationBaseline","sizeSmallIE11","sizeMedium","btnBorderRadiusMedium","btnFontSizeMedium","btnLineHeightMedium","btnPaddingXMedium","btnPaddingYMedium","sizeMediumIE11","sizeLarge","btnBorderRadiusLarge","btnFontSizeLarge","btnLineHeightLarge","btnPaddingXLarge","btnPaddingYLarge","sizeLargeIE11","link","btnLinkBorderRadius","btnLinkColor","btnLinkHoverColor","btnLinkHoverTextDecoration","activeStyles","linkFocus","linkDisabled","btnLinkDisabledColor","focus","btnOutlineColorFocus","btnFocusShadowWidth","btnBorderColorFocus","disabled","btnBorderWidth","btnDisabledBorderColor","btnDisabledBg","btnDisabledTextColor","arrowWarning","arrowError","arrowFocus","arrow","isFirefox","arrowLeft","default","btnDefaultBg","btnDefaultBgStart","btnDefaultBgEnd","btnDefaultTextColor","btnDefaultBorderColor","btnDefaultBorderBottomColor","btnDefaultHoverBg","btnDefaultHoverBgStart","btnDefaultHoverBgEnd","btnDefaultHoverBorderColor","btnDefaultHoverBorderBottomColor","primary","btnPrimaryBg","btnPrimaryBgStart","btnPrimaryBgEnd","btnPrimaryTextColor","btnPrimaryBorderColor","btnPrimaryBorderBottomColor","btnPrimaryHoverBg","btnPrimaryHoverBgStart","btnPrimaryHoverBgEnd","btnPrimaryHoverBorderColor","btnPrimaryHoverBorderBottomColor","success","btnSuccessBg","btnSuccessBgStart","btnSuccessBgEnd","btnSuccessTextColor","btnSuccessBorderColor","btnSuccessBorderBottomColor","btnSuccessHoverBg","btnSuccessHoverBgStart","btnSuccessHoverBgEnd","btnSuccessHoverBorderColor","btnSuccessHoverBorderBottomColor","danger","btnDangerBg","btnDangerBgStart","btnDangerBgEnd","btnDangerTextColor","btnDangerBorderColor","btnDangerBorderBottomColor","btnDangerHoverBg","btnDangerHoverBgStart","btnDangerHoverBgEnd","btnDangerHoverBorderColor","btnDangerHoverBorderBottomColor","pay","btnPayBg","btnPayBgStart","btnPayBgEnd","btnPayTextColor","btnPayBorderColor","btnPayBorderBottomColor","btnPayHoverBg","btnPayHoverBgStart","btnPayHoverBgEnd","btnPayHoverBorderColor","btnPayHoverBorderBottomColor","checked","checkedStyles","btnDefaultCheckedBorderColor","btnCheckedBg","btnCheckedTextColor","btnCheckedShadow","btnArrowBgImageChecked","checkedFocused","checkedDisabled","btnCheckedDisabledBorderColor","btnCheckedDisabledBg","btnCheckedDisabledColor","btnCheckedDisabledShadow","captionLink","captionTranslated","captionDisabled","wrap","wrapSmall","btnHeightSmall","wrapMedium","btnHeightMedium","wrapLarge","btnHeightLarge","narrow","noPadding","noRightPadding","iconNoRightMargin","iconLink","btnLinkIconMarginRight","wrapLink","wrapArrow","wrapArrowLeft","icon","iconSmall","btnIconSizeSmall","btnIconGapSmall","iconMedium","btnIconSizeMedium","btnIconGapMedium","iconLarge","btnIconSizeLarge","btnIconGapLarge","borderless","loading","visibilityHidden","btnDefaultActiveBg","btnDefaultActiveShadow","btnDefaultActiveBorderColor","btnDefaultActiveBorderTopColor","btnArrowBgImageActive","btnPrimaryActiveBg","btnPrimaryActiveShadow","btnPrimaryActiveBorderColor","btnPrimaryActiveBorderTopColor","btnSuccessActiveBg","btnSuccessActiveShadow","btnSuccessActiveBorderColor","btnSuccessActiveBorderTopColor","btnDangerActiveBg","btnDangerActiveShadow","btnDangerActiveBorderColor","btnDangerActiveBorderTopColor","btnPayActiveBg","btnPayActiveShadow","btnPayActiveBorderColor","btnPayActiveBorderTopColor","btnLinkActiveColor"],"mappings":"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","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton, resetText } from '../../lib/styles/Mixins';\nimport { isFirefox } from '../../lib/client';\n\nimport {\n buttonUseMixin,\n buttonHoverMixin,\n buttonActiveMixin,\n buttonSizeMixin,\n arrowOutlineMixin,\n buttonSizeMixinIE11,\n} from './Button.mixins';\n\nexport const globalClasses = prefix('button')({\n arrowHelper: 'arrow-helper',\n arrowHelperTop: 'arrow-helper-top',\n arrowHelperBottom: 'arrow-helper-bottom',\n caption: 'caption',\n innerShadow: 'inner-shadow',\n});\n\nexport const styles = memoizeStyle({\n root(t: Theme) {\n return css`\n ${resetButton()};\n ${resetText()};\n\n background-clip: ${t.btnBackgroundClip};\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n cursor: pointer;\n display: inline-block;\n position: relative;\n text-align: center;\n width: 100%;\n height: 100%; // fix height in ie11\n\n .${globalClasses.innerShadow} {\n content: '';\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n }\n\n &::-moz-focus-inner {\n border: 0;\n padding: 0;\n }\n &::after {\n content: '';\n display: inline-block;\n vertical-align: baseline;\n width: 0;\n }\n\n &:active:enabled .${globalClasses.caption} {\n transform: translateY(1px);\n }\n `;\n },\n\n outline() {\n return css`\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n `;\n },\n\n outlineWarning(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnOutlineWidth} ${t.btnBorderColorWarning},\n inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n `;\n },\n\n outlineError(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnOutlineWidth} ${t.btnBorderColorError}, inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n `;\n },\n\n outlineLink() {\n return css`\n box-shadow: none;\n left: -2px;\n right: -2px;\n bottom: -2px;\n `;\n },\n\n outlineLinkWarning(t: Theme) {\n return css`\n background-color: ${t.btnWarningSecondary};\n `;\n },\n\n outlineLinkError(t: Theme) {\n return css`\n background-color: ${t.btnErrorSecondary};\n `;\n },\n\n sizeSmall(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusSmall};\n\n ${buttonSizeMixin(\n t.btnFontSizeSmall,\n t.btnLineHeightSmall,\n t.btnPaddingXSmall,\n t.btnPaddingYSmall,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeSmallIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeSmall,\n t.btnPaddingXSmall,\n t.btnPaddingYSmall,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeMedium(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusMedium};\n\n ${buttonSizeMixin(\n t.btnFontSizeMedium,\n t.btnLineHeightMedium,\n t.btnPaddingXMedium,\n t.btnPaddingYMedium,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeMediumIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeMedium,\n t.btnPaddingXMedium,\n t.btnPaddingYMedium,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeLarge(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusLarge};\n\n ${buttonSizeMixin(\n t.btnFontSizeLarge,\n t.btnLineHeightLarge,\n t.btnPaddingXLarge,\n t.btnPaddingYLarge,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeLargeIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeLarge,\n t.btnPaddingXLarge,\n t.btnPaddingYLarge,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n link(t: Theme) {\n return css`\n background: none;\n border-radius: ${t.btnLinkBorderRadius};\n border: none;\n box-shadow: none;\n white-space: nowrap;\n color: ${t.btnLinkColor};\n display: inline;\n line-height: inherit !important; // override size mixin\n margin: 0;\n padding: 0 !important; // override size mixin\n height: auto !important; // override size mixin\n\n &:hover:enabled {\n color: ${t.btnLinkHoverColor};\n text-decoration: ${t.btnLinkHoverTextDecoration};\n }\n &:active:enabled {\n ${activeStyles.link(t)}\n }\n `;\n },\n\n linkFocus(t: Theme) {\n return css`\n color: ${t.btnLinkColor};\n text-decoration: ${t.btnLinkHoverTextDecoration};\n `;\n },\n\n linkDisabled(t: Theme) {\n return css`\n cursor: default;\n pointer-events: none;\n\n &,\n &:hover:enabled,\n &:active:enabled {\n color: ${t.btnLinkDisabledColor};\n }\n `;\n },\n\n focus(t: Theme) {\n return css`\n position: relative;\n z-index: 2;\n\n &,\n &:hover:enabled,\n &:active:enabled,\n &:active:hover:enabled {\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus},\n 0 0 0 ${t.btnFocusShadowWidth} ${t.btnBorderColorFocus};\n }\n `;\n },\n\n disabled(t: Theme) {\n return css`\n cursor: default;\n pointer-events: none;\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDisabledBorderColor};\n\n background-image: none;\n background-color: ${t.btnDisabledBg};\n color: ${t.btnDisabledTextColor};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 0 ${t.btnDisabledBorderColor};\n }\n `;\n },\n\n arrowWarning(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorWarning, t.btnOutlineWidth, t.btnInsetColor)}\n `;\n },\n\n arrowError(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorError, t.btnOutlineWidth, t.btnInsetColor)}\n `;\n },\n\n arrowFocus(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorFocus, t.btnOutlineWidth, t.btnOutlineColorFocus)}\n `;\n },\n\n arrow() {\n return css`\n background: inherit;\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n\n .${globalClasses.arrowHelper} {\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n background: inherit;\n background-size: 200% 200%;\n border-radius: inherit;\n background-clip: padding-box;\n\n // fix ugly arrow edge\n &:before {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n background: inherit;\n border-radius: inherit;\n transform: translateX(${isFirefox ? `0.2px` : `0.3px`});\n }\n }\n\n .${globalClasses.arrowHelperTop} {\n top: 0;\n transform: skewX(30deg);\n transform-origin: top;\n background-position-y: top;\n border-bottom-right-radius: 1px;\n\n // fix ugly line in the\n // middle of the button\n &:before {\n bottom: -1px;\n }\n }\n\n .${globalClasses.arrowHelperBottom} {\n bottom: 0;\n transform: skewX(-30deg);\n transform-origin: bottom;\n background-position-y: bottom;\n border-top-right-radius: 1px;\n\n // fix ugly line in the\n // middle of the button\n &:before {\n top: -1px;\n }\n }\n `;\n },\n\n arrowLeft() {\n return css`\n transform: scaleX(-1);\n `;\n },\n\n default(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnDefaultBg,\n t.btnDefaultBgStart,\n t.btnDefaultBgEnd,\n t.btnDefaultTextColor,\n t.btnDefaultBorderColor,\n t.btnDefaultBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnDefaultHoverBg,\n t.btnDefaultHoverBgStart,\n t.btnDefaultHoverBgEnd,\n t.btnDefaultHoverBorderColor,\n t.btnDefaultHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.default(t)}\n }\n `;\n },\n\n primary(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnPrimaryBg,\n t.btnPrimaryBgStart,\n t.btnPrimaryBgEnd,\n t.btnPrimaryTextColor,\n t.btnPrimaryBorderColor,\n t.btnPrimaryBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnPrimaryHoverBg,\n t.btnPrimaryHoverBgStart,\n t.btnPrimaryHoverBgEnd,\n t.btnPrimaryHoverBorderColor,\n t.btnPrimaryHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.primary(t)}\n }\n `;\n },\n\n success(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnSuccessBg,\n t.btnSuccessBgStart,\n t.btnSuccessBgEnd,\n t.btnSuccessTextColor,\n t.btnSuccessBorderColor,\n t.btnSuccessBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnSuccessHoverBg,\n t.btnSuccessHoverBgStart,\n t.btnSuccessHoverBgEnd,\n t.btnSuccessHoverBorderColor,\n t.btnSuccessHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.success(t)}\n }\n `;\n },\n\n danger(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnDangerBg,\n t.btnDangerBgStart,\n t.btnDangerBgEnd,\n t.btnDangerTextColor,\n t.btnDangerBorderColor,\n t.btnDangerBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnDangerHoverBg,\n t.btnDangerHoverBgStart,\n t.btnDangerHoverBgEnd,\n t.btnDangerHoverBorderColor,\n t.btnDangerHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.danger(t)}\n }\n `;\n },\n\n pay(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnPayBg,\n t.btnPayBgStart,\n t.btnPayBgEnd,\n t.btnPayTextColor,\n t.btnPayBorderColor,\n t.btnPayBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnPayHoverBg,\n t.btnPayHoverBgStart,\n t.btnPayHoverBgEnd,\n t.btnPayHoverBorderColor,\n t.btnPayHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.pay(t)}\n }\n `;\n },\n\n checked(t: Theme) {\n const checkedStyles = `\n background-image: none;\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDefaultCheckedBorderColor};\n background-color: ${t.btnCheckedBg};\n color: ${t.btnCheckedTextColor};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${t.btnCheckedShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 ${t.btnDefaultCheckedBorderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: ${t.btnArrowBgImageChecked};\n }\n }\n `;\n\n return css`\n ${checkedStyles}\n\n &:hover:enabled,\n &:active:enabled,\n &:hover:active:enabled {\n ${checkedStyles}\n }\n `;\n },\n\n checkedFocused(t: Theme) {\n return css`\n &:hover:enabled {\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus},\n 0 0 0 ${t.btnFocusShadowWidth} ${t.btnBorderColorFocus};\n border-color: ${t.btnBorderColorFocus};\n }\n `;\n },\n\n checkedDisabled(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnCheckedDisabledBorderColor};\n background-color: ${t.btnCheckedDisabledBg};\n color: ${t.btnCheckedDisabledColor};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${t.btnCheckedDisabledShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 ${t.btnCheckedDisabledBorderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: none;\n }\n }\n `;\n },\n\n caption() {\n return css`\n position: relative;\n white-space: nowrap;\n display: inline-block;\n width: 100%;\n vertical-align: top;\n `;\n },\n\n captionLink() {\n return css`\n display: inline;\n transform: none !important; // override root:active style\n `;\n },\n\n captionTranslated() {\n return css`\n transform: translateY(1px);\n `;\n },\n\n captionDisabled() {\n return css`\n transform: none !important; // override root:active style\n `;\n },\n\n wrap(t: Theme) {\n return css`\n box-sizing: border-box;\n display: inline-block;\n line-height: normal;\n padding: ${t.btnBorderWidth};\n `;\n },\n\n wrapSmall(t: Theme) {\n return css`\n height: ${t.btnHeightSmall};\n `;\n },\n\n wrapMedium(t: Theme) {\n return css`\n height: ${t.btnHeightMedium};\n `;\n },\n\n wrapLarge(t: Theme) {\n return css`\n height: ${t.btnHeightLarge};\n `;\n },\n\n narrow() {\n return css`\n padding-left: 5px;\n padding-right: 5px;\n `;\n },\n\n noPadding() {\n return css`\n padding-left: 0;\n padding-right: 0;\n `;\n },\n\n noRightPadding() {\n return css`\n padding-right: 0;\n `;\n },\n\n iconNoRightMargin() {\n return css`\n margin-right: 0;\n `;\n },\n\n iconLink(t: Theme) {\n return css`\n margin-right: ${t.btnLinkIconMarginRight};\n `;\n },\n\n wrapLink() {\n return css`\n padding: 0;\n `;\n },\n\n wrapArrow() {\n return css`\n margin-right: 10px;\n `;\n },\n\n wrapArrowLeft() {\n return css`\n margin-right: 0;\n margin-left: 10px;\n `;\n },\n\n icon() {\n return css`\n display: inline-block;\n `;\n },\n iconSmall(t: Theme) {\n return css`\n width: ${t.btnIconSizeSmall};\n margin-right: ${t.btnIconGapSmall};\n `;\n },\n iconMedium(t: Theme) {\n return css`\n width: ${t.btnIconSizeMedium};\n margin-right: ${t.btnIconGapMedium};\n `;\n },\n iconLarge(t: Theme) {\n return css`\n width: ${t.btnIconSizeLarge};\n margin-right: ${t.btnIconGapLarge};\n `;\n },\n\n borderless() {\n return css`\n &,\n &:hover:enabled,\n &:active:enabled {\n box-shadow: none;\n .${globalClasses.arrowHelperTop}, .${globalClasses.arrowHelperBottom} {\n box-shadow: none;\n }\n }\n `;\n },\n\n loading() {\n return css`\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10;\n `;\n },\n\n visibilityHidden() {\n return css`\n visibility: hidden;\n `;\n },\n});\n\nexport const activeStyles = memoizeStyle({\n default(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnDefaultActiveBg,\n t.btnDefaultActiveShadow,\n t.btnDefaultActiveBorderColor,\n t.btnDefaultActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n primary(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnPrimaryActiveBg,\n t.btnPrimaryActiveShadow,\n t.btnPrimaryActiveBorderColor,\n t.btnPrimaryActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n success(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnSuccessActiveBg,\n t.btnSuccessActiveShadow,\n t.btnSuccessActiveBorderColor,\n t.btnSuccessActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n danger(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnDangerActiveBg,\n t.btnDangerActiveShadow,\n t.btnDangerActiveBorderColor,\n t.btnDangerActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n pay(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnPayActiveBg,\n t.btnPayActiveShadow,\n t.btnPayActiveBorderColor,\n t.btnPayActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n link(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n color: ${t.btnLinkActiveColor};\n }\n `;\n },\n});\n"]}
|
|
1
|
+
{"version":3,"sources":["Button.styles.ts"],"names":["globalClasses","arrowHelper","arrowHelperTop","arrowHelperBottom","caption","innerShadow","styles","root","t","css","btnBackgroundClip","outline","outlineWarning","btnOutlineWidth","btnBorderColorWarning","btnInsetWidth","btnInsetColor","outlineError","btnBorderColorError","outlineLink","outlineLinkWarning","btnWarningSecondary","outlineLinkError","btnErrorSecondary","sizeSmall","btnBorderRadiusSmall","btnFontSizeSmall","btnLineHeightSmall","btnPaddingXSmall","btnPaddingYSmall","fontFamilyCompensationBaseline","sizeSmallIE11","sizeMedium","btnBorderRadiusMedium","btnFontSizeMedium","btnLineHeightMedium","btnPaddingXMedium","btnPaddingYMedium","sizeMediumIE11","sizeLarge","btnBorderRadiusLarge","btnFontSizeLarge","btnLineHeightLarge","btnPaddingXLarge","btnPaddingYLarge","sizeLargeIE11","link","btnLinkBorderRadius","btnLinkColor","btnLinkHoverColor","btnLinkHoverTextDecoration","activeStyles","linkFocus","linkDisabled","btnLinkDisabledColor","focus","btnOutlineColorFocus","btnFocusShadowWidth","btnBorderColorFocus","disabled","btnBorderWidth","btnDisabledBorderColor","btnDisabledBg","btnDisabledTextColor","arrowWarning","arrowError","arrowFocus","arrow","isFirefox","arrowLeft","default","btnDefaultBg","btnDefaultBgStart","btnDefaultBgEnd","btnDefaultTextColor","btnDefaultBorderColor","btnDefaultBorderBottomColor","btnDefaultHoverBg","btnDefaultHoverBgStart","btnDefaultHoverBgEnd","btnDefaultHoverBorderColor","btnDefaultHoverBorderBottomColor","primary","btnPrimaryBg","btnPrimaryBgStart","btnPrimaryBgEnd","btnPrimaryTextColor","btnPrimaryBorderColor","btnPrimaryBorderBottomColor","btnPrimaryHoverBg","btnPrimaryHoverBgStart","btnPrimaryHoverBgEnd","btnPrimaryHoverBorderColor","btnPrimaryHoverBorderBottomColor","success","btnSuccessBg","btnSuccessBgStart","btnSuccessBgEnd","btnSuccessTextColor","btnSuccessBorderColor","btnSuccessBorderBottomColor","btnSuccessHoverBg","btnSuccessHoverBgStart","btnSuccessHoverBgEnd","btnSuccessHoverBorderColor","btnSuccessHoverBorderBottomColor","danger","btnDangerBg","btnDangerBgStart","btnDangerBgEnd","btnDangerTextColor","btnDangerBorderColor","btnDangerBorderBottomColor","btnDangerHoverBg","btnDangerHoverBgStart","btnDangerHoverBgEnd","btnDangerHoverBorderColor","btnDangerHoverBorderBottomColor","pay","btnPayBg","btnPayBgStart","btnPayBgEnd","btnPayTextColor","btnPayBorderColor","btnPayBorderBottomColor","btnPayHoverBg","btnPayHoverBgStart","btnPayHoverBgEnd","btnPayHoverBorderColor","btnPayHoverBorderBottomColor","checked","checkedStyles","btnDefaultCheckedBorderColor","btnCheckedBg","btnCheckedTextColor","btnCheckedShadow","btnArrowBgImageChecked","checkedFocused","checkedDisabled","btnCheckedDisabledBorderColor","btnCheckedDisabledBg","btnCheckedDisabledColor","btnCheckedDisabledShadow","captionLink","captionTranslated","captionDisabled","wrap","wrapSmall","btnHeightSmall","wrapMedium","btnHeightMedium","wrapLarge","btnHeightLarge","narrow","noPadding","noRightPadding","iconNoRightMargin","iconLink","btnLinkIconMarginRight","wrapLink","wrapArrow","wrapArrowLeft","icon","iconSmall","btnIconSizeSmall","btnIconGapSmall","iconMedium","btnIconSizeMedium","btnIconGapMedium","iconLarge","btnIconSizeLarge","btnIconGapLarge","borderless","loading","visibilityHidden","btnDefaultActiveBg","btnDefaultActiveShadow","btnDefaultActiveBorderColor","btnDefaultActiveBorderTopColor","btnArrowBgImageActive","btnPrimaryActiveBg","btnPrimaryActiveShadow","btnPrimaryActiveBorderColor","btnPrimaryActiveBorderTopColor","btnSuccessActiveBg","btnSuccessActiveShadow","btnSuccessActiveBorderColor","btnSuccessActiveBorderTopColor","btnDangerActiveBg","btnDangerActiveShadow","btnDangerActiveBorderColor","btnDangerActiveBorderTopColor","btnPayActiveBg","btnPayActiveShadow","btnPayActiveBorderColor","btnPayActiveBorderTopColor","btnLinkActiveColor"],"mappings":"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","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton, resetText } from '../../lib/styles/Mixins';\nimport { isFirefox } from '../../lib/client';\n\nimport {\n buttonUseMixin,\n buttonHoverMixin,\n buttonActiveMixin,\n buttonSizeMixin,\n arrowOutlineMixin,\n buttonSizeMixinIE11,\n} from './Button.mixins';\n\nexport const globalClasses = prefix('button')({\n arrowHelper: 'arrow-helper',\n arrowHelperTop: 'arrow-helper-top',\n arrowHelperBottom: 'arrow-helper-bottom',\n caption: 'caption',\n innerShadow: 'inner-shadow',\n});\n\nexport const styles = memoizeStyle({\n root(t: Theme) {\n return css`\n ${resetButton()};\n ${resetText()};\n\n background-clip: ${t.btnBackgroundClip};\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n cursor: pointer;\n display: inline-block;\n position: relative;\n text-align: center;\n width: 100%;\n height: 100%; // fix height in ie11\n\n .${globalClasses.innerShadow} {\n content: '';\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n }\n\n &::-moz-focus-inner {\n border: 0;\n padding: 0;\n }\n &::after {\n content: '';\n display: inline-block;\n vertical-align: baseline;\n width: 0;\n }\n\n &:active:enabled .${globalClasses.caption} {\n transform: translateY(1px);\n }\n `;\n },\n\n outline() {\n return css`\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n `;\n },\n\n outlineWarning(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnOutlineWidth} ${t.btnBorderColorWarning},\n inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n `;\n },\n\n outlineError(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnOutlineWidth} ${t.btnBorderColorError}, inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n `;\n },\n\n outlineLink() {\n return css`\n box-shadow: none;\n left: -2px;\n right: -2px;\n bottom: -2px;\n top: -2px;\n `;\n },\n\n outlineLinkWarning(t: Theme) {\n return css`\n background-color: ${t.btnWarningSecondary};\n `;\n },\n\n outlineLinkError(t: Theme) {\n return css`\n background-color: ${t.btnErrorSecondary};\n `;\n },\n\n sizeSmall(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusSmall};\n\n ${buttonSizeMixin(\n t.btnFontSizeSmall,\n t.btnLineHeightSmall,\n t.btnPaddingXSmall,\n t.btnPaddingYSmall,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeSmallIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeSmall,\n t.btnPaddingXSmall,\n t.btnPaddingYSmall,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeMedium(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusMedium};\n\n ${buttonSizeMixin(\n t.btnFontSizeMedium,\n t.btnLineHeightMedium,\n t.btnPaddingXMedium,\n t.btnPaddingYMedium,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeMediumIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeMedium,\n t.btnPaddingXMedium,\n t.btnPaddingYMedium,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeLarge(t: Theme) {\n return css`\n border-radius: ${t.btnBorderRadiusLarge};\n\n ${buttonSizeMixin(\n t.btnFontSizeLarge,\n t.btnLineHeightLarge,\n t.btnPaddingXLarge,\n t.btnPaddingYLarge,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n sizeLargeIE11(t: Theme) {\n return css`\n ${buttonSizeMixinIE11(\n t.btnFontSizeLarge,\n t.btnPaddingXLarge,\n t.btnPaddingYLarge,\n t.fontFamilyCompensationBaseline,\n )};\n `;\n },\n\n link(t: Theme) {\n return css`\n background: none;\n border-radius: ${t.btnLinkBorderRadius};\n border: none;\n box-shadow: none;\n white-space: nowrap;\n color: ${t.btnLinkColor};\n display: inline;\n line-height: inherit !important; // override size mixin\n margin: 0;\n padding: 0 !important; // override size mixin\n height: auto !important; // override size mixin\n\n &:hover:enabled {\n color: ${t.btnLinkHoverColor};\n text-decoration: ${t.btnLinkHoverTextDecoration};\n }\n &:active:enabled {\n ${activeStyles.link(t)}\n }\n `;\n },\n\n linkFocus(t: Theme) {\n return css`\n color: ${t.btnLinkColor};\n text-decoration: ${t.btnLinkHoverTextDecoration};\n `;\n },\n\n linkDisabled(t: Theme) {\n return css`\n cursor: default;\n pointer-events: none;\n\n &,\n &:hover:enabled,\n &:active:enabled {\n color: ${t.btnLinkDisabledColor};\n }\n `;\n },\n\n focus(t: Theme) {\n return css`\n position: relative;\n z-index: 2;\n\n &,\n &:hover:enabled,\n &:active:enabled,\n &:active:hover:enabled {\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus},\n 0 0 0 ${t.btnFocusShadowWidth} ${t.btnBorderColorFocus};\n }\n `;\n },\n\n disabled(t: Theme) {\n return css`\n cursor: default;\n pointer-events: none;\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDisabledBorderColor};\n\n background-image: none;\n background-color: ${t.btnDisabledBg};\n color: ${t.btnDisabledTextColor};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 0 ${t.btnDisabledBorderColor};\n }\n `;\n },\n\n arrowWarning(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorWarning, t.btnOutlineWidth, t.btnInsetColor)}\n `;\n },\n\n arrowError(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnInsetColor};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorError, t.btnOutlineWidth, t.btnInsetColor)}\n `;\n },\n\n arrowFocus(t: Theme) {\n return css`\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus};\n\n ${arrowOutlineMixin(t.btnInsetWidth, t.btnBorderColorFocus, t.btnOutlineWidth, t.btnOutlineColorFocus)}\n `;\n },\n\n arrow() {\n return css`\n background: inherit;\n border-radius: inherit;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n\n .${globalClasses.arrowHelper} {\n width: 100%;\n height: 50%;\n position: absolute;\n left: 0;\n background: inherit;\n background-size: 200% 200%;\n border-radius: inherit;\n background-clip: padding-box;\n\n // fix ugly arrow edge\n &:before {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n background: inherit;\n border-radius: inherit;\n transform: translateX(${isFirefox ? `0.2px` : `0.3px`});\n }\n }\n\n .${globalClasses.arrowHelperTop} {\n top: 0;\n transform: skewX(30deg);\n transform-origin: top;\n background-position-y: top;\n border-bottom-right-radius: 1px;\n\n // fix ugly line in the\n // middle of the button\n &:before {\n bottom: -1px;\n }\n }\n\n .${globalClasses.arrowHelperBottom} {\n bottom: 0;\n transform: skewX(-30deg);\n transform-origin: bottom;\n background-position-y: bottom;\n border-top-right-radius: 1px;\n\n // fix ugly line in the\n // middle of the button\n &:before {\n top: -1px;\n }\n }\n `;\n },\n\n arrowLeft() {\n return css`\n transform: scaleX(-1);\n `;\n },\n\n default(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnDefaultBg,\n t.btnDefaultBgStart,\n t.btnDefaultBgEnd,\n t.btnDefaultTextColor,\n t.btnDefaultBorderColor,\n t.btnDefaultBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnDefaultHoverBg,\n t.btnDefaultHoverBgStart,\n t.btnDefaultHoverBgEnd,\n t.btnDefaultHoverBorderColor,\n t.btnDefaultHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.default(t)}\n }\n `;\n },\n\n primary(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnPrimaryBg,\n t.btnPrimaryBgStart,\n t.btnPrimaryBgEnd,\n t.btnPrimaryTextColor,\n t.btnPrimaryBorderColor,\n t.btnPrimaryBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnPrimaryHoverBg,\n t.btnPrimaryHoverBgStart,\n t.btnPrimaryHoverBgEnd,\n t.btnPrimaryHoverBorderColor,\n t.btnPrimaryHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.primary(t)}\n }\n `;\n },\n\n success(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnSuccessBg,\n t.btnSuccessBgStart,\n t.btnSuccessBgEnd,\n t.btnSuccessTextColor,\n t.btnSuccessBorderColor,\n t.btnSuccessBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnSuccessHoverBg,\n t.btnSuccessHoverBgStart,\n t.btnSuccessHoverBgEnd,\n t.btnSuccessHoverBorderColor,\n t.btnSuccessHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.success(t)}\n }\n `;\n },\n\n danger(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnDangerBg,\n t.btnDangerBgStart,\n t.btnDangerBgEnd,\n t.btnDangerTextColor,\n t.btnDangerBorderColor,\n t.btnDangerBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnDangerHoverBg,\n t.btnDangerHoverBgStart,\n t.btnDangerHoverBgEnd,\n t.btnDangerHoverBorderColor,\n t.btnDangerHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.danger(t)}\n }\n `;\n },\n\n pay(t: Theme) {\n return css`\n ${buttonUseMixin(\n t.btnPayBg,\n t.btnPayBgStart,\n t.btnPayBgEnd,\n t.btnPayTextColor,\n t.btnPayBorderColor,\n t.btnPayBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n ${buttonHoverMixin(\n t.btnPayHoverBg,\n t.btnPayHoverBgStart,\n t.btnPayHoverBgEnd,\n t.btnPayHoverBorderColor,\n t.btnPayHoverBorderBottomColor,\n t.btnBorderWidth,\n )};\n\n &:active:enabled {\n ${activeStyles.pay(t)}\n }\n `;\n },\n\n checked(t: Theme) {\n const checkedStyles = `\n background-image: none;\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDefaultCheckedBorderColor};\n background-color: ${t.btnCheckedBg};\n color: ${t.btnCheckedTextColor};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${t.btnCheckedShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 ${t.btnDefaultCheckedBorderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: ${t.btnArrowBgImageChecked};\n }\n }\n `;\n\n return css`\n ${checkedStyles}\n\n &:hover:enabled,\n &:active:enabled,\n &:hover:active:enabled {\n ${checkedStyles}\n }\n `;\n },\n\n checkedFocused(t: Theme) {\n return css`\n &:hover:enabled {\n box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus},\n 0 0 0 ${t.btnFocusShadowWidth} ${t.btnBorderColorFocus};\n border-color: ${t.btnBorderColorFocus};\n }\n `;\n },\n\n checkedDisabled(t: Theme) {\n return css`\n box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnCheckedDisabledBorderColor};\n background-color: ${t.btnCheckedDisabledBg};\n color: ${t.btnCheckedDisabledColor};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${t.btnCheckedDisabledShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${t.btnBorderWidth} 0 0 ${t.btnCheckedDisabledBorderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: none;\n }\n }\n `;\n },\n\n caption() {\n return css`\n position: relative;\n white-space: nowrap;\n display: inline-block;\n width: 100%;\n vertical-align: top;\n `;\n },\n\n captionLink() {\n return css`\n display: inline;\n transform: none !important; // override root:active style\n `;\n },\n\n captionTranslated() {\n return css`\n transform: translateY(1px);\n `;\n },\n\n captionDisabled() {\n return css`\n transform: none !important; // override root:active style\n `;\n },\n\n wrap(t: Theme) {\n return css`\n box-sizing: border-box;\n display: inline-block;\n line-height: normal;\n padding: ${t.btnBorderWidth};\n `;\n },\n\n wrapSmall(t: Theme) {\n return css`\n height: ${t.btnHeightSmall};\n `;\n },\n\n wrapMedium(t: Theme) {\n return css`\n height: ${t.btnHeightMedium};\n `;\n },\n\n wrapLarge(t: Theme) {\n return css`\n height: ${t.btnHeightLarge};\n `;\n },\n\n narrow() {\n return css`\n padding-left: 5px;\n padding-right: 5px;\n `;\n },\n\n noPadding() {\n return css`\n padding-left: 0;\n padding-right: 0;\n `;\n },\n\n noRightPadding() {\n return css`\n padding-right: 0;\n `;\n },\n\n iconNoRightMargin() {\n return css`\n margin-right: 0;\n `;\n },\n\n iconLink(t: Theme) {\n return css`\n margin-right: ${t.btnLinkIconMarginRight};\n `;\n },\n\n wrapLink() {\n return css`\n padding: 0;\n `;\n },\n\n wrapArrow() {\n return css`\n margin-right: 10px;\n `;\n },\n\n wrapArrowLeft() {\n return css`\n margin-right: 0;\n margin-left: 10px;\n `;\n },\n\n icon() {\n return css`\n display: inline-block;\n `;\n },\n iconSmall(t: Theme) {\n return css`\n width: ${t.btnIconSizeSmall};\n margin-right: ${t.btnIconGapSmall};\n `;\n },\n iconMedium(t: Theme) {\n return css`\n width: ${t.btnIconSizeMedium};\n margin-right: ${t.btnIconGapMedium};\n `;\n },\n iconLarge(t: Theme) {\n return css`\n width: ${t.btnIconSizeLarge};\n margin-right: ${t.btnIconGapLarge};\n `;\n },\n\n borderless() {\n return css`\n &,\n &:hover:enabled,\n &:active:enabled {\n box-shadow: none;\n .${globalClasses.arrowHelperTop}, .${globalClasses.arrowHelperBottom} {\n box-shadow: none;\n }\n }\n `;\n },\n\n loading() {\n return css`\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10;\n `;\n },\n\n visibilityHidden() {\n return css`\n visibility: hidden;\n `;\n },\n});\n\nexport const activeStyles = memoizeStyle({\n default(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnDefaultActiveBg,\n t.btnDefaultActiveShadow,\n t.btnDefaultActiveBorderColor,\n t.btnDefaultActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n primary(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnPrimaryActiveBg,\n t.btnPrimaryActiveShadow,\n t.btnPrimaryActiveBorderColor,\n t.btnPrimaryActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n success(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnSuccessActiveBg,\n t.btnSuccessActiveShadow,\n t.btnSuccessActiveBorderColor,\n t.btnSuccessActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n danger(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnDangerActiveBg,\n t.btnDangerActiveShadow,\n t.btnDangerActiveBorderColor,\n t.btnDangerActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n pay(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n ${buttonActiveMixin(\n t.btnPayActiveBg,\n t.btnPayActiveShadow,\n t.btnPayActiveBorderColor,\n t.btnPayActiveBorderTopColor,\n t.btnBorderWidth,\n t.btnArrowBgImageActive,\n )};\n }\n `;\n },\n\n link(t: Theme) {\n return css`\n &,\n &:hover:enabled {\n color: ${t.btnLinkActiveColor};\n }\n `;\n },\n});\n"]}
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { PopupMenuProps } from '../../internal/PopupMenu';
|
|
3
3
|
import { PopupPositionsType } from '../../internal/Popup';
|
|
4
4
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
5
|
-
export interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {
|
|
5
|
+
export interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {
|
|
6
6
|
/** Максимальная высота меню */
|
|
7
7
|
menuMaxHeight?: React.CSSProperties['maxWidth'];
|
|
8
8
|
/** Ширина меню */
|
|
@@ -127,6 +127,7 @@ DropdownMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/
|
|
|
127
127
|
|
|
128
128
|
|
|
129
129
|
|
|
130
|
+
|
|
130
131
|
|
|
131
132
|
|
|
132
133
|
open = function () {
|
|
@@ -141,4 +142,4 @@ DropdownMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/
|
|
|
141
142
|
}
|
|
142
143
|
};_this.
|
|
143
144
|
|
|
144
|
-
refPopupMenu = function (ref) {return _this.popupMenu = ref;};if (!props.caption && !_currentEnvironment.isProductionEnv) {throw new Error('Prop "caption" is required!!!');}return _this;}var _proto = DropdownMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupMargin: '0px' }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {if (!this.props.caption) {return null;}var _this$getProps = this.getProps(),positions = _this$getProps.positions,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, onClose: this.props.onClose, onOpen: this.props.onOpen }, this.props.children));};return DropdownMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'DropdownMenu', _class2.defaultProps = { disableAnimations: _currentEnvironment.isTestEnv, positions: ['bottom left', 'bottom right', 'top left', 'top right'] }, _temp)) || _class;exports.DropdownMenu = DropdownMenu;
|
|
145
|
+
refPopupMenu = function (ref) {return _this.popupMenu = ref;};if (!props.caption && !_currentEnvironment.isProductionEnv) {throw new Error('Prop "caption" is required!!!');}return _this;}var _proto = DropdownMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupMargin: '0px' }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {if (!this.props.caption) {return null;}var _this$getProps = this.getProps(),positions = _this$getProps.positions,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { ref: this.refPopupMenu, caption: this.props.caption, menuMaxHeight: this.props.menuMaxHeight, menuWidth: this.props.menuWidth, popupHasPin: false, positions: positions, disableAnimations: disableAnimations, header: this.props.header, footer: this.props.footer, width: this.props.width, onClose: this.props.onClose, onOpen: this.props.onOpen, popupMenuId: this.props.popupMenuId }, this.props.children));};return DropdownMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'DropdownMenu', _class2.defaultProps = { disableAnimations: _currentEnvironment.isTestEnv, positions: ['bottom left', 'bottom right', 'top left', 'top right'] }, _temp)) || _class;exports.DropdownMenu = DropdownMenu;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["DropdownMenu.tsx"],"names":["DropdownMenu","rootNode","props","getProps","defaultProps","popupMenu","open","close","refPopupMenu","ref","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupMargin","renderMain","positions","disableAnimations","setRootNode","menuMaxHeight","menuWidth","header","footer","width","onClose","onOpen","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"0UAAA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA;AACA;AACA,G;;AAEaA,Y,OADZC,kB;;;;;;;;;;;;;AAcC,wBAAYC,KAAZ,EAAsC;AACpC,wCAAMA,KAAN,UADoC,MAL9BC,QAK8B,GALnB,0CAAkBH,YAAY,CAACI,YAA/B,CAKmB,OAH9BC,SAG8B,GAHG,IAGH
|
|
1
|
+
{"version":3,"sources":["DropdownMenu.tsx"],"names":["DropdownMenu","rootNode","props","getProps","defaultProps","popupMenu","open","close","refPopupMenu","ref","caption","isProductionEnv","Error","render","theme","ThemeFactory","create","popupMargin","renderMain","positions","disableAnimations","setRootNode","menuMaxHeight","menuWidth","header","footer","width","onClose","onOpen","popupMenuId","children","React","Component","__KONTUR_REACT_UI__","isTestEnv"],"mappings":"0UAAA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA,gE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA;AACA;AACA,G;;AAEaA,Y,OADZC,kB;;;;;;;;;;;;;AAcC,wBAAYC,KAAZ,EAAsC;AACpC,wCAAMA,KAAN,UADoC,MAL9BC,QAK8B,GALnB,0CAAkBH,YAAY,CAACI,YAA/B,CAKmB,OAH9BC,SAG8B,GAHG,IAGH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyD/BC,IAAAA,IAzD+B,GAyDxB,YAAY;AACxB,UAAI,MAAKD,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeC,IAAf;AACD;AACF,KA7DqC;;AA+D/BC,IAAAA,KA/D+B,GA+DvB,YAAY;AACzB,UAAI,MAAKF,SAAT,EAAoB;AAClB,cAAKA,SAAL,CAAeE,KAAf;AACD;AACF,KAnEqC;;AAqE9BC,IAAAA,YArE8B,GAqEf,UAACC,GAAD,UAA+B,MAAKJ,SAAL,GAAiBI,GAAhD,EArEe,CAGpC,IAAI,CAACP,KAAK,CAACQ,OAAP,IAAkB,CAACC,mCAAvB,EAAwC,CACtC,MAAM,IAAIC,KAAJ,CAAU,+BAAV,CAAN,CACD,CALmC,aAMrC,C,2CAEMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,oBACE,6BAAC,0BAAD,CAAc,QAAd,IACE,KAAK,EAAEC,2BAAaC,MAAb,CACL,EACEC,WAAW,EAAE,KADf,EADK,EAILH,KAJK,CADT,IAQG,MAAI,CAACI,UAAL,EARH,CADF,CAYD,CAdH,CADF,CAkBD,C,QAEMA,U,GAAP,sBAAoB,CAClB,IAAI,CAAC,KAAKhB,KAAL,CAAWQ,OAAhB,EAAyB,CACvB,OAAO,IAAP,CACD,CACD,qBAAyC,KAAKP,QAAL,EAAzC,CAAQgB,SAAR,kBAAQA,SAAR,CAAmBC,iBAAnB,kBAAmBA,iBAAnB,CACA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKnB,KAAvD,gBACE,6BAAC,oBAAD,IACE,GAAG,EAAE,KAAKM,YADZ,EAEE,OAAO,EAAE,KAAKN,KAAL,CAAWQ,OAFtB,EAGE,aAAa,EAAE,KAAKR,KAAL,CAAWoB,aAH5B,EAIE,SAAS,EAAE,KAAKpB,KAAL,CAAWqB,SAJxB,EAKE,WAAW,EAAE,KALf,EAME,SAAS,EAAEJ,SANb,EAOE,iBAAiB,EAAEC,iBAPrB,EAQE,MAAM,EAAE,KAAKlB,KAAL,CAAWsB,MARrB,EASE,MAAM,EAAE,KAAKtB,KAAL,CAAWuB,MATrB,EAUE,KAAK,EAAE,KAAKvB,KAAL,CAAWwB,KAVpB,EAWE,OAAO,EAAE,KAAKxB,KAAL,CAAWyB,OAXtB,EAYE,MAAM,EAAE,KAAKzB,KAAL,CAAW0B,MAZrB,EAaE,WAAW,EAAE,KAAK1B,KAAL,CAAW2B,WAb1B,IAeG,KAAK3B,KAAL,CAAW4B,QAfd,CADF,CADF,CAqBD,C,uBApE+BC,eAAMC,S,WACxBC,mB,GAAsB,c,UAEtB7B,Y,GAA6B,EACzCgB,iBAAiB,EAAEc,6BADsB,EAEzCf,SAAS,EAAE,CAAC,aAAD,EAAgB,cAAhB,EAAgC,UAAhC,EAA4C,WAA5C,CAF8B,E","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupMenu, PopupMenuProps } from '../../internal/PopupMenu';\nimport { isProductionEnv, isTestEnv } from '../../lib/currentEnvironment';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport interface DropdownMenuProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {\n /** Максимальная высота меню */\n menuMaxHeight?: React.CSSProperties['maxWidth'];\n /** Ширина меню */\n menuWidth?: React.CSSProperties['width'];\n /** Ширина caption */\n width?: React.CSSProperties['width'];\n\n /**\n * Элемент или функция возвращающая элемент,\n * если передана, используется вместо `caption`,\n * в таком случае управлять открытием и закрытием меню\n * придется в этой функции\n */\n caption: PopupMenuProps['caption'];\n\n /**\n * Произвольный элемент, который будет отрендерен в шапке меню.\n *\n * _Примечание_: контрол [MenuHeader](#/Components/MenuHeader) передаётся только в `children` меню-контролов. Не стоит передавать `MenuHeader` в `header`.\n */\n header?: React.ReactNode;\n /**\n * Произвольный элемент, который будет отрендерен в подвале меню.\n *\n * Перед элементом переданным в `footer` будет отрендерен [MenuSeparator](#/Components/MenuSeparator).\n */\n footer?: React.ReactNode;\n /**\n * Список позиций доступных для расположения выпадашки относительно `caption`.\n *\n * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n *\n * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n * @default ['bottom left', 'bottom right', 'top left', 'top right']\n */\n positions?: PopupPositionsType[];\n\n /**\n * Не показывать анимацию\n */\n disableAnimations?: boolean;\n}\n\ntype DefaultProps = Required<Pick<DropdownMenuProps, 'disableAnimations' | 'positions'>>;\n\n/**\n * Меню, раскрывающееся по клику на переданный в `caption` элемент\n */\n@rootNode\nexport class DropdownMenu extends React.Component<DropdownMenuProps> {\n public static __KONTUR_REACT_UI__ = 'DropdownMenu';\n\n public static defaultProps: DefaultProps = {\n disableAnimations: isTestEnv,\n positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n };\n\n private getProps = createPropsGetter(DropdownMenu.defaultProps);\n\n private popupMenu: Nullable<PopupMenu> = null;\n private setRootNode!: TSetRootNode;\n\n constructor(props: DropdownMenuProps) {\n super(props);\n\n if (!props.caption && !isProductionEnv) {\n throw new Error('Prop \"caption\" is required!!!');\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n popupMargin: '0px',\n },\n theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public renderMain() {\n if (!this.props.caption) {\n return null;\n }\n const { positions, disableAnimations } = this.getProps();\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <PopupMenu\n ref={this.refPopupMenu}\n caption={this.props.caption}\n menuMaxHeight={this.props.menuMaxHeight}\n menuWidth={this.props.menuWidth}\n popupHasPin={false}\n positions={positions}\n disableAnimations={disableAnimations}\n header={this.props.header}\n footer={this.props.footer}\n width={this.props.width}\n onClose={this.props.onClose}\n onOpen={this.props.onOpen}\n popupMenuId={this.props.popupMenuId}\n >\n {this.props.children}\n </PopupMenu>\n </CommonWrapper>\n );\n }\n\n public open = (): void => {\n if (this.popupMenu) {\n this.popupMenu.open();\n }\n };\n\n public close = (): void => {\n if (this.popupMenu) {\n this.popupMenu.close();\n }\n };\n\n private refPopupMenu = (ref: Nullable<PopupMenu>) => (this.popupMenu = ref);\n}\n"]}
|
|
@@ -3,7 +3,7 @@ import { Nullable, Override } from '../../typings/utility-types';
|
|
|
3
3
|
import { CommonProps } from '../../internal/CommonWrapper';
|
|
4
4
|
export declare type InputSize = 'small' | 'medium' | 'large';
|
|
5
5
|
export declare type InputAlign = 'left' | 'center' | 'right';
|
|
6
|
-
export declare type InputType = 'password' | 'text';
|
|
6
|
+
export declare type InputType = 'password' | 'text' | 'number' | 'tel' | 'search' | 'time' | 'date' | 'url' | 'email' | 'hidden';
|
|
7
7
|
export declare type InputIconType = React.ReactNode | (() => React.ReactNode);
|
|
8
8
|
export interface InputProps extends CommonProps, Override<React.InputHTMLAttributes<HTMLInputElement>, {
|
|
9
9
|
/**
|
|
@@ -30,7 +30,7 @@ export interface InputProps extends CommonProps, Override<React.InputHTMLAttribu
|
|
|
30
30
|
borderless?: boolean;
|
|
31
31
|
/** Выравнивание текста */
|
|
32
32
|
align?: InputAlign;
|
|
33
|
-
/** Паттерн
|
|
33
|
+
/** Паттерн маски. Доступен для типов `text`, `password`, `email`, `tel`, `search`, `url` */
|
|
34
34
|
mask?: Nullable<string>;
|
|
35
35
|
/** Символ маски */
|
|
36
36
|
maskChar?: Nullable<string>;
|
|
@@ -51,7 +51,9 @@ export interface InputProps extends CommonProps, Override<React.InputHTMLAttribu
|
|
|
51
51
|
onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;
|
|
52
52
|
/** Вызывается на label */
|
|
53
53
|
onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;
|
|
54
|
-
/**
|
|
54
|
+
/**
|
|
55
|
+
* Тип. Возможные значения: 'password' | 'text' | 'number' | 'tel' | 'search' | 'time' | 'date' | 'url' | 'email' | 'hidden'
|
|
56
|
+
* */
|
|
55
57
|
type?: InputType;
|
|
56
58
|
/** Значение */
|
|
57
59
|
value?: string;
|
|
@@ -66,7 +68,7 @@ export interface InputProps extends CommonProps, Override<React.InputHTMLAttribu
|
|
|
66
68
|
* `ReactNode` после значения, но перед правой иконкой
|
|
67
69
|
*/
|
|
68
70
|
suffix?: React.ReactNode;
|
|
69
|
-
/** Выделять введенное значение при
|
|
71
|
+
/** Выделять введенное значение при фокусе. Работает с типами `text`, `password`, `tel`, `search`, `url`. [Документация](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange) */
|
|
70
72
|
selectAllOnFocus?: boolean;
|
|
71
73
|
/**
|
|
72
74
|
* Обработчик неправильного ввода.
|
|
@@ -133,6 +135,8 @@ export declare class Input extends React.Component<InputProps, InputState> {
|
|
|
133
135
|
get isMaskVisible(): boolean;
|
|
134
136
|
render(): JSX.Element;
|
|
135
137
|
/**
|
|
138
|
+
* Работает с типами `text`, `password`, `tel`, `search`, `url`
|
|
139
|
+
* [Документация](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange)
|
|
136
140
|
* @public
|
|
137
141
|
*/
|
|
138
142
|
selectAll: () => void;
|