@semcore/button 5.43.3 → 5.44.0-prerelease.0
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 +6 -0
- package/lib/cjs/component/Button/Button.js +166 -64
- package/lib/cjs/component/Button/Button.js.map +1 -1
- package/lib/cjs/component/Button/Button.type.js.map +1 -1
- package/lib/cjs/component/{AbstractButton → Button}/SpinButton.js +3 -4
- package/lib/cjs/component/Button/SpinButton.js.map +1 -0
- package/lib/cjs/component/Button/button.shadow.css +80 -88
- package/lib/cjs/component/ButtonLink/ButtonLink.js +35 -68
- package/lib/cjs/component/ButtonLink/ButtonLink.js.map +1 -1
- package/lib/cjs/component/ButtonLink/ButtonLink.type.js.map +1 -1
- package/lib/cjs/component/ButtonLink/buttonLink.shadow.css +13 -152
- package/lib/cjs/index.js +3 -4
- package/lib/cjs/index.js.map +1 -1
- package/lib/es6/component/Button/Button.js +163 -57
- package/lib/es6/component/Button/Button.js.map +1 -1
- package/lib/es6/component/Button/Button.type.js.map +1 -1
- package/lib/es6/component/{AbstractButton → Button}/SpinButton.js +1 -1
- package/lib/es6/component/Button/SpinButton.js.map +1 -0
- package/lib/es6/component/Button/button.shadow.css +80 -88
- package/lib/es6/component/ButtonLink/ButtonLink.js +34 -65
- package/lib/es6/component/ButtonLink/ButtonLink.js.map +1 -1
- package/lib/es6/component/ButtonLink/ButtonLink.type.js.map +1 -1
- package/lib/es6/component/ButtonLink/buttonLink.shadow.css +13 -152
- package/lib/es6/index.js +1 -2
- package/lib/es6/index.js.map +1 -1
- package/lib/esm/component/Button/Button.mjs +142 -56
- package/lib/esm/component/Button/Button.type.mjs +1 -0
- package/lib/esm/component/{AbstractButton → Button}/SpinButton.mjs +2 -3
- package/lib/esm/component/Button/button.shadow.css +80 -88
- package/lib/esm/component/ButtonLink/ButtonLink.mjs +33 -61
- package/lib/esm/component/ButtonLink/ButtonLink.type.mjs +1 -0
- package/lib/esm/component/ButtonLink/buttonLink.shadow.css +13 -152
- package/lib/esm/index.mjs +3 -2
- package/lib/types/component/Button/Button.d.ts +28 -1
- package/lib/types/component/Button/Button.type.d.ts +40 -39
- package/lib/types/component/{AbstractButton → Button}/SpinButton.d.ts +2 -2
- package/lib/types/component/ButtonLink/ButtonLink.d.ts +1 -1
- package/lib/types/component/ButtonLink/ButtonLink.type.d.ts +15 -21
- package/lib/types/index.d.ts +1 -2
- package/package.json +7 -7
- package/lib/cjs/component/AbstractButton/AbstractButton.js +0 -182
- package/lib/cjs/component/AbstractButton/AbstractButton.js.map +0 -1
- package/lib/cjs/component/AbstractButton/AbstractButton.type.js +0 -2
- package/lib/cjs/component/AbstractButton/AbstractButton.type.js.map +0 -1
- package/lib/cjs/component/AbstractButton/SpinButton.js.map +0 -1
- package/lib/es6/component/AbstractButton/AbstractButton.js +0 -175
- package/lib/es6/component/AbstractButton/AbstractButton.js.map +0 -1
- package/lib/es6/component/AbstractButton/AbstractButton.type.js +0 -2
- package/lib/es6/component/AbstractButton/AbstractButton.type.js.map +0 -1
- package/lib/es6/component/AbstractButton/SpinButton.js.map +0 -1
- package/lib/esm/component/AbstractButton/AbstractButton.mjs +0 -152
- package/lib/types/component/AbstractButton/AbstractButton.d.ts +0 -24
- package/lib/types/component/AbstractButton/AbstractButton.type.d.ts +0 -39
package/lib/esm/index.mjs
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { default as default2 } from "./component/Button/Button.mjs";
|
|
1
|
+
import { MAP_USE_DEFAULT_THEME, default as default2 } from "./component/Button/Button.mjs";
|
|
2
|
+
import "./component/Button/Button.type.mjs";
|
|
2
3
|
import { ButtonLink } from "./component/ButtonLink/ButtonLink.mjs";
|
|
3
|
-
import
|
|
4
|
+
import "./component/ButtonLink/ButtonLink.type.mjs";
|
|
4
5
|
export {
|
|
5
6
|
ButtonLink,
|
|
6
7
|
MAP_USE_DEFAULT_THEME,
|
|
@@ -1,3 +1,30 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Component } from '@semcore/core';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { ButtonProps, ButtonComponent } from './Button.type';
|
|
4
|
+
export declare const MAP_USE_DEFAULT_THEME: Record<string, string>;
|
|
5
|
+
type State = {
|
|
6
|
+
ariaLabelledByContent: null | string;
|
|
7
|
+
};
|
|
8
|
+
export declare class RootButton extends Component<ButtonProps, [], never, {}, State> {
|
|
9
|
+
static displayName: string;
|
|
10
|
+
static style: {
|
|
11
|
+
[key: string]: string;
|
|
12
|
+
};
|
|
13
|
+
static defaultProps: {
|
|
14
|
+
use: string;
|
|
15
|
+
size: string;
|
|
16
|
+
};
|
|
17
|
+
containerRef: React.RefObject<HTMLButtonElement>;
|
|
18
|
+
state: State;
|
|
19
|
+
getTextProps(): {
|
|
20
|
+
size: "l" | "m" | undefined;
|
|
21
|
+
'hint:triggerRef': React.RefObject<HTMLButtonElement>;
|
|
22
|
+
};
|
|
23
|
+
getAddonProps(): {
|
|
24
|
+
size: "l" | "m" | undefined;
|
|
25
|
+
};
|
|
26
|
+
componentDidMount(): void;
|
|
27
|
+
render(): React.JSX.Element;
|
|
28
|
+
}
|
|
2
29
|
declare const Button: ButtonComponent;
|
|
3
30
|
export default Button;
|
|
@@ -1,43 +1,44 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
export type ButtonContext = AbstractButtonContext;
|
|
35
|
-
export type ButtonChildren = {
|
|
36
|
-
Text: Intergalactic.Component<'span', ButtonTextProps>;
|
|
37
|
-
Addon: Intergalactic.Component<'span', ButtonAddonProps>;
|
|
1
|
+
import type { BoxProps, NeighborItemProps, SimpleHintPopperProps } from '@semcore/base-components';
|
|
2
|
+
import type { Intergalactic, PropGetterFn } from '@semcore/core';
|
|
3
|
+
import type { NSText } from '@semcore/typography';
|
|
4
|
+
import type React from 'react';
|
|
5
|
+
export type ButtonProps = BoxProps & NeighborItemProps & {
|
|
6
|
+
/** Button activity state */
|
|
7
|
+
active?: boolean;
|
|
8
|
+
/** Disabled button state */
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
/** Loading button state */
|
|
11
|
+
loading?: boolean;
|
|
12
|
+
/** Tag for the left Addon */
|
|
13
|
+
addonLeft?: React.ElementType;
|
|
14
|
+
/** Tag for the right Addon */
|
|
15
|
+
addonRight?: React.ElementType;
|
|
16
|
+
/**
|
|
17
|
+
* Placement for hint
|
|
18
|
+
* @default top
|
|
19
|
+
*/
|
|
20
|
+
hintPlacement?: SimpleHintPopperProps['placement'];
|
|
21
|
+
/** Button size.
|
|
22
|
+
* @default `m`
|
|
23
|
+
*/
|
|
24
|
+
size?: 'l' | 'm';
|
|
25
|
+
/** Button usage.
|
|
26
|
+
* @default `primary`
|
|
27
|
+
*/
|
|
28
|
+
use?: 'primary' | 'secondary' | 'tertiary';
|
|
29
|
+
/** Button theme.
|
|
30
|
+
* @default undefined
|
|
31
|
+
*/
|
|
32
|
+
theme?: 'info' | 'success' | 'brand' | 'danger' | 'muted' | 'invert';
|
|
38
33
|
};
|
|
39
|
-
export type
|
|
34
|
+
export type ButtonTextProps = NSText.Props;
|
|
35
|
+
export type ButtonAddonProps = BoxProps;
|
|
36
|
+
export type ButtonContext = {
|
|
37
|
+
getTextProps: PropGetterFn;
|
|
38
|
+
getAddonProps: PropGetterFn;
|
|
39
|
+
};
|
|
40
|
+
export type ButtonChildren = {
|
|
40
41
|
Text: Intergalactic.Component<'span', ButtonTextProps>;
|
|
41
42
|
Addon: Intergalactic.Component<'span', ButtonAddonProps>;
|
|
42
43
|
};
|
|
43
|
-
export
|
|
44
|
+
export type ButtonComponent = Intergalactic.Component<'button', ButtonProps, ButtonContext> & ButtonChildren;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
export declare const SPIN_SIZE_MAP: Record<string, string>;
|
|
3
|
-
export default function SpinButton({ theme, size, ...others }: any): JSX.Element;
|
|
3
|
+
export default function SpinButton({ theme, size, ...others }: any): React.JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ButtonLinkComponent } from './ButtonLink.type';
|
|
1
|
+
import type { ButtonLinkComponent } from './ButtonLink.type';
|
|
2
2
|
export declare const ButtonLink: ButtonLinkComponent;
|
|
@@ -1,25 +1,19 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
type Use = 'primary' | 'secondary';
|
|
13
|
-
export type ButtonLinkProps = AbstractButtonProps<ButtonLinkSize, Use, never>;
|
|
14
|
-
export type ButtonLinkTextProps = AbstractButtonTextProps<ButtonLinkSize>;
|
|
15
|
-
export type ButtonLinkAddonProps = AbstractButtonAddonProps<ButtonLinkSize>;
|
|
16
|
-
export type ButtonLinkContext = AbstractButtonContext;
|
|
17
|
-
export type ButtonLinkChildren = {
|
|
18
|
-
Text: Intergalactic.Component<'span', ButtonLinkTextProps>;
|
|
19
|
-
Addon: Intergalactic.Component<'span', ButtonLinkAddonProps>;
|
|
1
|
+
import type { BoxProps } from '@semcore/base-components';
|
|
2
|
+
import type { Intergalactic } from '@semcore/core';
|
|
3
|
+
import type { LinkProps } from '@semcore/link';
|
|
4
|
+
import type { NSText } from '@semcore/typography';
|
|
5
|
+
import type { ButtonContext } from '../Button/Button.type';
|
|
6
|
+
export type ButtonLinkProps = Intergalactic.InternalTypings.EfficientOmit<LinkProps, 'enableVisited'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Button link type
|
|
9
|
+
* @default primary
|
|
10
|
+
*/
|
|
11
|
+
use?: 'primary' | 'secondary';
|
|
20
12
|
};
|
|
21
|
-
export type
|
|
13
|
+
export type ButtonLinkTextProps = NSText.Props;
|
|
14
|
+
export type ButtonLinkAddonProps = BoxProps;
|
|
15
|
+
export type ButtonLinkChildren = {
|
|
22
16
|
Text: Intergalactic.Component<'span', ButtonLinkTextProps>;
|
|
23
17
|
Addon: Intergalactic.Component<'span', ButtonLinkAddonProps>;
|
|
24
18
|
};
|
|
25
|
-
export
|
|
19
|
+
export type ButtonLinkComponent = Intergalactic.Component<'button', ButtonLinkProps, ButtonContext> & ButtonLinkChildren;
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
export { default } from './component/Button/Button';
|
|
1
|
+
export { default, MAP_USE_DEFAULT_THEME } from './component/Button/Button';
|
|
2
2
|
export * from './component/Button/Button.type';
|
|
3
3
|
export * from './component/ButtonLink/ButtonLink';
|
|
4
4
|
export * from './component/ButtonLink/ButtonLink.type';
|
|
5
|
-
export { MAP_USE_DEFAULT_THEME } from './component/AbstractButton/AbstractButton';
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/button",
|
|
3
3
|
"description": "Semrush Button Component",
|
|
4
|
-
"version": "5.
|
|
4
|
+
"version": "5.44.0-prerelease.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,14 +14,14 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/flex-box": "5.
|
|
18
|
-
"@semcore/neighbor-location": "4.
|
|
19
|
-
"@semcore/spin": "5.
|
|
20
|
-
"@semcore/tooltip": "6.
|
|
21
|
-
"@semcore/utils": "4.
|
|
17
|
+
"@semcore/flex-box": "5.42.0-prerelease.0",
|
|
18
|
+
"@semcore/neighbor-location": "4.41.0-prerelease.0",
|
|
19
|
+
"@semcore/spin": "5.42.0-prerelease.0",
|
|
20
|
+
"@semcore/tooltip": "6.50.0-prerelease.0",
|
|
21
|
+
"@semcore/utils": "4.49.0-prerelease.0"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
|
-
"@semcore/core": "^2.
|
|
24
|
+
"@semcore/core": "^2.40.0-prerelease.0",
|
|
25
25
|
"react": "16.8 - 18",
|
|
26
26
|
"react-dom": "16.8 - 18"
|
|
27
27
|
},
|
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.MAP_USE_DEFAULT_THEME = exports.AbstractButton = void 0;
|
|
8
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
9
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
12
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
13
|
-
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
14
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
-
var _core = require("@semcore/core");
|
|
16
|
-
var _react = _interopRequireDefault(require("react"));
|
|
17
|
-
var _flexBox = require("@semcore/flex-box");
|
|
18
|
-
var _tooltip = require("@semcore/tooltip");
|
|
19
|
-
var _neighborLocation = _interopRequireDefault(require("@semcore/neighbor-location"));
|
|
20
|
-
var _addonTextChildren = _interopRequireDefault(require("@semcore/utils/lib/addonTextChildren"));
|
|
21
|
-
var _logger = _interopRequireDefault(require("@semcore/utils/lib/logger"));
|
|
22
|
-
var _SpinButton = _interopRequireDefault(require("./SpinButton"));
|
|
23
|
-
var _hasLabels = _interopRequireDefault(require("@semcore/utils/lib/hasLabels"));
|
|
24
|
-
var MAP_USE_DEFAULT_THEME = {
|
|
25
|
-
primary: 'info',
|
|
26
|
-
secondary: 'muted',
|
|
27
|
-
tertiary: 'info'
|
|
28
|
-
};
|
|
29
|
-
exports.MAP_USE_DEFAULT_THEME = MAP_USE_DEFAULT_THEME;
|
|
30
|
-
var AbstractButton = /*#__PURE__*/function (_Component) {
|
|
31
|
-
(0, _inherits2["default"])(AbstractButton, _Component);
|
|
32
|
-
var _super = (0, _createSuper2["default"])(AbstractButton);
|
|
33
|
-
function AbstractButton() {
|
|
34
|
-
var _this;
|
|
35
|
-
(0, _classCallCheck2["default"])(this, AbstractButton);
|
|
36
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
37
|
-
args[_key] = arguments[_key];
|
|
38
|
-
}
|
|
39
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
40
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "containerRef", /*#__PURE__*/_react["default"].createRef());
|
|
41
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
|
|
42
|
-
ariaLabelledByContent: null
|
|
43
|
-
});
|
|
44
|
-
return _this;
|
|
45
|
-
}
|
|
46
|
-
(0, _createClass2["default"])(AbstractButton, [{
|
|
47
|
-
key: "getTextProps",
|
|
48
|
-
value: function getTextProps() {
|
|
49
|
-
var size = this.asProps.size;
|
|
50
|
-
return {
|
|
51
|
-
size: size
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
}, {
|
|
55
|
-
key: "getAddonProps",
|
|
56
|
-
value: function getAddonProps() {
|
|
57
|
-
var size = this.asProps.size;
|
|
58
|
-
return {
|
|
59
|
-
size: size
|
|
60
|
-
};
|
|
61
|
-
}
|
|
62
|
-
}, {
|
|
63
|
-
key: "componentDidMount",
|
|
64
|
-
value: function componentDidMount() {
|
|
65
|
-
var _this2 = this;
|
|
66
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
67
|
-
_logger["default"].warn(this.containerRef.current && !(0, _hasLabels["default"])(this.containerRef.current) && !this.asProps.title, "'title' or 'aria-label' or 'aria-labelledby' are required props for buttons without text content", this.asProps['data-ui-name'] || AbstractButton.displayName);
|
|
68
|
-
_logger["default"].warn(this.asProps.theme === 'warning', 'Warning theme is deprecated and will be removed in the next major release.', this.asProps['data-ui-name'] || AbstractButton.displayName);
|
|
69
|
-
}
|
|
70
|
-
var ariaLabelledby = this.asProps['aria-labelledby'];
|
|
71
|
-
if (ariaLabelledby) {
|
|
72
|
-
setTimeout(function () {
|
|
73
|
-
var _document$getElementB, _document$getElementB2;
|
|
74
|
-
_this2.setState({
|
|
75
|
-
ariaLabelledByContent: (_document$getElementB = (_document$getElementB2 = document.getElementById(ariaLabelledby)) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.textContent) !== null && _document$getElementB !== void 0 ? _document$getElementB : ''
|
|
76
|
-
});
|
|
77
|
-
}, 0);
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
}, {
|
|
81
|
-
key: "renderButton",
|
|
82
|
-
value: function renderButton(_ref6) {
|
|
83
|
-
var _ref = this.asProps,
|
|
84
|
-
_ref3;
|
|
85
|
-
var buttonProps = _ref6.buttonProps,
|
|
86
|
-
children = _ref6.children;
|
|
87
|
-
var styles = this.asProps.styles;
|
|
88
|
-
var SButton = _flexBox.Box;
|
|
89
|
-
return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SButton, _ref3.cn("SButton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)((0, _objectSpread2["default"])({}, buttonProps), _ref))), children);
|
|
90
|
-
}
|
|
91
|
-
}, {
|
|
92
|
-
key: "renderButtonWithHint",
|
|
93
|
-
value: function renderButtonWithHint(_ref7) {
|
|
94
|
-
var _ref2 = this.asProps,
|
|
95
|
-
_ref4;
|
|
96
|
-
var buttonProps = _ref7.buttonProps,
|
|
97
|
-
children = _ref7.children,
|
|
98
|
-
hintProps = _ref7.hintProps;
|
|
99
|
-
var styles = this.asProps.styles;
|
|
100
|
-
var SButton = _tooltip.Hint;
|
|
101
|
-
return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SButton, _ref4.cn("SButton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, buttonProps), hintProps), _ref2))), children);
|
|
102
|
-
}
|
|
103
|
-
}, {
|
|
104
|
-
key: "render",
|
|
105
|
-
value: function render() {
|
|
106
|
-
var _ref8,
|
|
107
|
-
_ref9,
|
|
108
|
-
_this3 = this;
|
|
109
|
-
var _this$asProps = this.asProps,
|
|
110
|
-
styles = _this$asProps.styles,
|
|
111
|
-
use = _this$asProps.use,
|
|
112
|
-
_this$asProps$theme = _this$asProps.theme,
|
|
113
|
-
theme = _this$asProps$theme === void 0 ? typeof use === 'string' && MAP_USE_DEFAULT_THEME[use] : _this$asProps$theme,
|
|
114
|
-
loading = _this$asProps.loading,
|
|
115
|
-
_this$asProps$disable = _this$asProps.disabled,
|
|
116
|
-
disabled = _this$asProps$disable === void 0 ? loading : _this$asProps$disable,
|
|
117
|
-
size = _this$asProps.size,
|
|
118
|
-
neighborLocation = _this$asProps.neighborLocation,
|
|
119
|
-
hasChildren = _this$asProps.children,
|
|
120
|
-
title = _this$asProps.title,
|
|
121
|
-
ariaLabel = _this$asProps['aria-label'],
|
|
122
|
-
Children = _this$asProps.Children,
|
|
123
|
-
AddonLeft = _this$asProps.addonLeft,
|
|
124
|
-
AddonRight = _this$asProps.addonRight,
|
|
125
|
-
hintPlacement = _this$asProps.hintPlacement;
|
|
126
|
-
// @ts-ignore
|
|
127
|
-
var Button = this[_core.CORE_INSTANCE];
|
|
128
|
-
var useTheme = use && theme ? "".concat(use, "-").concat(theme) : false;
|
|
129
|
-
var SInner = _flexBox.Box;
|
|
130
|
-
var SSpin = _flexBox.Box;
|
|
131
|
-
var buttonAriaLabel = (_ref8 = (_ref9 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref9 !== void 0 ? _ref9 : this.state.ariaLabelledByContent) !== null && _ref8 !== void 0 ? _ref8 : '';
|
|
132
|
-
var buttonProps = {
|
|
133
|
-
type: 'button',
|
|
134
|
-
tag: 'button',
|
|
135
|
-
disabled: disabled,
|
|
136
|
-
'use:theme': useTheme,
|
|
137
|
-
ref: this.containerRef,
|
|
138
|
-
'text-color': this.getTextColor(),
|
|
139
|
-
'aria-busy': loading,
|
|
140
|
-
__excludeProps: ['title']
|
|
141
|
-
};
|
|
142
|
-
var hintProps = {
|
|
143
|
-
title: buttonAriaLabel,
|
|
144
|
-
timeout: [250, 50],
|
|
145
|
-
placement: hintPlacement,
|
|
146
|
-
theme: theme === 'invert' ? 'invert' : undefined,
|
|
147
|
-
__excludeProps: []
|
|
148
|
-
};
|
|
149
|
-
return /*#__PURE__*/_react["default"].createElement(_neighborLocation["default"].Detect, {
|
|
150
|
-
neighborLocation: neighborLocation
|
|
151
|
-
}, function (neighborLocation) {
|
|
152
|
-
var _ref5;
|
|
153
|
-
var children = (_ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(SInner, _ref5.cn("SInner", {
|
|
154
|
-
"tag": 'span',
|
|
155
|
-
"loading": loading
|
|
156
|
-
}), AddonLeft ? /*#__PURE__*/_react["default"].createElement(Button.Addon, null, /*#__PURE__*/_react["default"].createElement(AddonLeft, _ref5.cn("AddonLeft", {}))) : null, (0, _addonTextChildren["default"])(Children, Button.Text, Button.Addon), AddonRight ? /*#__PURE__*/_react["default"].createElement(Button.Addon, null, /*#__PURE__*/_react["default"].createElement(AddonRight, _ref5.cn("AddonRight", {}))) : null), loading && /*#__PURE__*/_react["default"].createElement(SSpin, _ref5.cn("SSpin", {
|
|
157
|
-
"tag": 'span'
|
|
158
|
-
}), /*#__PURE__*/_react["default"].createElement(_SpinButton["default"], _ref5.cn("SpinButton", {
|
|
159
|
-
"centered": true,
|
|
160
|
-
"size": size,
|
|
161
|
-
"theme": useTheme
|
|
162
|
-
})))));
|
|
163
|
-
buttonProps.neighborLocation = neighborLocation;
|
|
164
|
-
if (hasChildren === undefined || title) {
|
|
165
|
-
return _this3.renderButtonWithHint({
|
|
166
|
-
buttonProps: buttonProps,
|
|
167
|
-
hintProps: hintProps,
|
|
168
|
-
children: children
|
|
169
|
-
});
|
|
170
|
-
}
|
|
171
|
-
return _this3.renderButton({
|
|
172
|
-
buttonProps: buttonProps,
|
|
173
|
-
children: children
|
|
174
|
-
});
|
|
175
|
-
});
|
|
176
|
-
}
|
|
177
|
-
}]);
|
|
178
|
-
return AbstractButton;
|
|
179
|
-
}(_core.Component);
|
|
180
|
-
exports.AbstractButton = AbstractButton;
|
|
181
|
-
(0, _defineProperty2["default"])(AbstractButton, "displayName", 'AbstractButton');
|
|
182
|
-
//# sourceMappingURL=AbstractButton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AbstractButton.js","names":["_core","require","_react","_interopRequireDefault","_flexBox","_tooltip","_neighborLocation","_addonTextChildren","_logger","_SpinButton","_hasLabels","MAP_USE_DEFAULT_THEME","primary","secondary","tertiary","exports","AbstractButton","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","React","createRef","ariaLabelledByContent","_createClass2","key","value","getTextProps","size","asProps","getAddonProps","componentDidMount","_this2","process","env","NODE_ENV","logger","warn","containerRef","current","hasLabels","title","displayName","theme","ariaLabelledby","setTimeout","_document$getElementB","_document$getElementB2","setState","document","getElementById","textContent","renderButton","_ref6","_ref","_ref3","buttonProps","children","styles","SButton","Box","sstyled","createElement","cn","_objectSpread2","assignProps","renderButtonWithHint","_ref7","_ref2","_ref4","hintProps","Hint","render","_ref8","_ref9","_this3","_this$asProps","use","_this$asProps$theme","loading","_this$asProps$disable","disabled","neighborLocation","hasChildren","ariaLabel","Children","AddonLeft","addonLeft","AddonRight","addonRight","hintPlacement","Button","CORE_INSTANCE","useTheme","SInner","SSpin","buttonAriaLabel","state","type","tag","ref","getTextColor","__excludeProps","timeout","placement","undefined","Detect","_ref5","Fragment","Addon","addonTextChildren","Text","Component"],"sources":["../../../../src/component/AbstractButton/AbstractButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@semcore/flex-box';\nimport { Hint } from '@semcore/tooltip';\nimport NeighborLocation from '@semcore/neighbor-location';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport logger from '@semcore/utils/lib/logger';\nimport SpinButton from './SpinButton';\nimport hasLabels from '@semcore/utils/lib/hasLabels';\nimport { AbstractButtonProps } from './AbstractButton.type';\nimport { Component, CORE_INSTANCE, Root, sstyled } from '@semcore/core';\n\nexport const MAP_USE_DEFAULT_THEME: Record<string, string> = {\n primary: 'info',\n secondary: 'muted',\n tertiary: 'info',\n};\n\ntype Props = AbstractButtonProps<any, any, any>;\n\nexport abstract class AbstractButton extends Component<Props, {}, {}> {\n static displayName = 'AbstractButton';\n\n containerRef = React.createRef<HTMLButtonElement>();\n\n state = {\n ariaLabelledByContent: null,\n };\n\n protected abstract getTextColor(): string | undefined;\n\n getTextProps() {\n const { size } = this.asProps;\n\n return {\n size,\n };\n }\n\n getAddonProps() {\n const { size } = this.asProps;\n return {\n size,\n };\n }\n\n componentDidMount() {\n if (process.env.NODE_ENV !== 'production') {\n logger.warn(\n this.containerRef.current && !hasLabels(this.containerRef.current) && !this.asProps.title,\n `'title' or 'aria-label' or 'aria-labelledby' are required props for buttons without text content`,\n this.asProps['data-ui-name'] || AbstractButton.displayName,\n );\n\n logger.warn(\n this.asProps.theme === 'warning',\n 'Warning theme is deprecated and will be removed in the next major release.',\n this.asProps['data-ui-name'] || AbstractButton.displayName,\n );\n }\n\n const ariaLabelledby = this.asProps['aria-labelledby'];\n\n if (ariaLabelledby) {\n setTimeout(() => {\n this.setState({\n ariaLabelledByContent: document.getElementById(ariaLabelledby)?.textContent ?? '',\n });\n }, 0);\n }\n }\n\n renderButton({ buttonProps, children }: any) {\n const { styles } = this.asProps;\n const SButton = Root;\n\n return sstyled(styles)(\n <SButton render={Box} {...buttonProps}>\n {children}\n </SButton>,\n );\n }\n\n renderButtonWithHint({ buttonProps, children, hintProps }: any) {\n const { styles } = this.asProps;\n const SButton = Root;\n\n return sstyled(styles)(\n <SButton render={Hint} {...buttonProps} {...hintProps}>\n {children}\n </SButton>,\n );\n }\n\n render() {\n const {\n styles,\n use,\n theme = typeof use === 'string' && MAP_USE_DEFAULT_THEME[use],\n loading,\n disabled = loading,\n size,\n neighborLocation,\n children: hasChildren,\n title,\n ['aria-label']: ariaLabel,\n Children,\n addonLeft: AddonLeft,\n addonRight: AddonRight,\n hintPlacement,\n } = this.asProps;\n // @ts-ignore\n const Button = this[CORE_INSTANCE];\n const useTheme = use && theme ? `${use}-${theme}` : false;\n const SInner = Box;\n const SSpin = Box;\n const buttonAriaLabel = title ?? ariaLabel ?? this.state.ariaLabelledByContent ?? '';\n\n const buttonProps: Record<string, any> = {\n type: 'button',\n tag: 'button',\n disabled,\n 'use:theme': useTheme,\n ref: this.containerRef,\n 'text-color': this.getTextColor(),\n 'aria-busy': loading,\n __excludeProps: ['title'],\n };\n\n const hintProps = {\n title: buttonAriaLabel,\n timeout: [250, 50],\n placement: hintPlacement,\n theme: theme === 'invert' ? 'invert' : undefined,\n __excludeProps: [],\n };\n\n return (\n <NeighborLocation.Detect neighborLocation={neighborLocation}>\n {(neighborLocation) => {\n const children = sstyled(styles)(\n <>\n {/* @ts-ignore */}\n <SInner tag='span' loading={loading}>\n {AddonLeft ? (\n <Button.Addon>\n <AddonLeft />\n </Button.Addon>\n ) : null}\n {addonTextChildren(Children, Button.Text, Button.Addon)}\n {AddonRight ? (\n <Button.Addon>\n <AddonRight />\n </Button.Addon>\n ) : null}\n </SInner>\n {loading && (\n <SSpin tag='span'>\n <SpinButton centered size={size} theme={useTheme} />\n </SSpin>\n )}\n </>,\n );\n buttonProps.neighborLocation = neighborLocation;\n\n if (hasChildren === undefined || title) {\n return this.renderButtonWithHint({ buttonProps, hintProps, children });\n }\n\n return this.renderButton({ buttonProps, children });\n }}\n </NeighborLocation.Detect>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AbstractButton.type.js","names":[],"sources":["../../../../src/component/AbstractButton/AbstractButton.type.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn } from '@semcore/core';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport { BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps } from '@semcore/neighbor-location';\nimport { TooltipHintProps } from '@semcore/tooltip';\n\nexport type AbstractButtonProps<S, U, T> = BoxProps &\n NeighborItemProps &\n KeyboardFocusProps & {\n /** Button activity state */\n active?: boolean;\n /** Disabled button state */\n disabled?: boolean;\n /** Loading button state */\n loading?: boolean;\n /** Tag for the left Addon */\n addonLeft?: React.ElementType;\n /** Tag for the right Addon */\n addonRight?: React.ElementType;\n /**\n * Placement for hint\n * @default top\n */\n hintPlacement?: TooltipHintProps['placement'];\n\n /** Button type. Defined in Button.type or ButtonLink.type */\n size?: S;\n /** Button usage. Defined in Button.type or ButtonLink.type */\n use?: U;\n /** Button theme. Defined in Button.type or ButtonLink.type */\n theme?: T;\n };\n\nexport type AbstractButtonAddonProps<S> = BoxProps & {\n size?: S;\n};\n\nexport type AbstractButtonTextProps<S> = BoxProps & {\n size?: S;\n};\n\nexport type AbstractButtonContext = {\n getTextProps: PropGetterFn;\n getAddonProps: PropGetterFn;\n};\n"],"mappings":""}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SpinButton.js","names":["_react","_interopRequireDefault","require","_spin","_excluded","SPIN_SIZE_MAP","xl","l","m","s","exports","SpinButton","_ref","theme","size","others","_objectWithoutProperties2","createElement","_extends2"],"sources":["../../../../src/component/AbstractButton/SpinButton.tsx"],"sourcesContent":["import React from 'react';\nimport Spin from '@semcore/spin';\n\nexport const SPIN_SIZE_MAP: Record<string, string> = {\n xl: 'm',\n l: 's',\n m: 'xs',\n s: 'xxs',\n};\n\nexport default function SpinButton({ theme, size, ...others }: any) {\n return (\n <Spin\n size={typeof size === 'string' ? SPIN_SIZE_MAP[size] : size}\n theme='currentColor'\n {...others}\n />\n );\n}\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAiC,IAAAE,SAAA;AAE1B,IAAMC,aAAqC,GAAG;EACnDC,EAAE,EAAE,GAAG;EACPC,CAAC,EAAE,GAAG;EACNC,CAAC,EAAE,IAAI;EACPC,CAAC,EAAE;AACL,CAAC;AAACC,OAAA,CAAAL,aAAA,GAAAA,aAAA;AAEa,SAASM,UAAUA,CAAAC,IAAA,EAAkC;EAAA,IAA/BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IAAKC,MAAM,OAAAC,yBAAA,aAAAJ,IAAA,EAAAR,SAAA;EACzD,oBACEJ,MAAA,YAAAiB,aAAA,CAACd,KAAA,WAAI,MAAAe,SAAA;IACHJ,IAAI,EAAE,OAAOA,IAAI,KAAK,QAAQ,GAAGT,aAAa,CAACS,IAAI,CAAC,GAAGA,IAAK;IAC5DD,KAAK,EAAC;EAAc,GAChBE,MAAM,EACV;AAEN"}
|
|
@@ -1,175 +0,0 @@
|
|
|
1
|
-
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
|
2
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
3
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
4
|
-
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
5
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
6
|
-
import _createSuper from "@babel/runtime/helpers/createSuper";
|
|
7
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
8
|
-
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
9
|
-
import { assignProps as _assignProps } from "@semcore/core";
|
|
10
|
-
import React from 'react';
|
|
11
|
-
import { Box } from '@semcore/flex-box';
|
|
12
|
-
import { Hint } from '@semcore/tooltip';
|
|
13
|
-
import NeighborLocation from '@semcore/neighbor-location';
|
|
14
|
-
import addonTextChildren from '@semcore/utils/lib/addonTextChildren';
|
|
15
|
-
import logger from '@semcore/utils/lib/logger';
|
|
16
|
-
import SpinButton from './SpinButton';
|
|
17
|
-
import hasLabels from '@semcore/utils/lib/hasLabels';
|
|
18
|
-
import { Component, CORE_INSTANCE, Root, sstyled } from '@semcore/core';
|
|
19
|
-
export var MAP_USE_DEFAULT_THEME = {
|
|
20
|
-
primary: 'info',
|
|
21
|
-
secondary: 'muted',
|
|
22
|
-
tertiary: 'info'
|
|
23
|
-
};
|
|
24
|
-
export var AbstractButton = /*#__PURE__*/function (_Component) {
|
|
25
|
-
_inherits(AbstractButton, _Component);
|
|
26
|
-
var _super = _createSuper(AbstractButton);
|
|
27
|
-
function AbstractButton() {
|
|
28
|
-
var _this;
|
|
29
|
-
_classCallCheck(this, AbstractButton);
|
|
30
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
31
|
-
args[_key] = arguments[_key];
|
|
32
|
-
}
|
|
33
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
34
|
-
_defineProperty(_assertThisInitialized(_this), "containerRef", /*#__PURE__*/React.createRef());
|
|
35
|
-
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
36
|
-
ariaLabelledByContent: null
|
|
37
|
-
});
|
|
38
|
-
return _this;
|
|
39
|
-
}
|
|
40
|
-
_createClass(AbstractButton, [{
|
|
41
|
-
key: "getTextProps",
|
|
42
|
-
value: function getTextProps() {
|
|
43
|
-
var size = this.asProps.size;
|
|
44
|
-
return {
|
|
45
|
-
size: size
|
|
46
|
-
};
|
|
47
|
-
}
|
|
48
|
-
}, {
|
|
49
|
-
key: "getAddonProps",
|
|
50
|
-
value: function getAddonProps() {
|
|
51
|
-
var size = this.asProps.size;
|
|
52
|
-
return {
|
|
53
|
-
size: size
|
|
54
|
-
};
|
|
55
|
-
}
|
|
56
|
-
}, {
|
|
57
|
-
key: "componentDidMount",
|
|
58
|
-
value: function componentDidMount() {
|
|
59
|
-
var _this2 = this;
|
|
60
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
61
|
-
logger.warn(this.containerRef.current && !hasLabels(this.containerRef.current) && !this.asProps.title, "'title' or 'aria-label' or 'aria-labelledby' are required props for buttons without text content", this.asProps['data-ui-name'] || AbstractButton.displayName);
|
|
62
|
-
logger.warn(this.asProps.theme === 'warning', 'Warning theme is deprecated and will be removed in the next major release.', this.asProps['data-ui-name'] || AbstractButton.displayName);
|
|
63
|
-
}
|
|
64
|
-
var ariaLabelledby = this.asProps['aria-labelledby'];
|
|
65
|
-
if (ariaLabelledby) {
|
|
66
|
-
setTimeout(function () {
|
|
67
|
-
var _document$getElementB, _document$getElementB2;
|
|
68
|
-
_this2.setState({
|
|
69
|
-
ariaLabelledByContent: (_document$getElementB = (_document$getElementB2 = document.getElementById(ariaLabelledby)) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.textContent) !== null && _document$getElementB !== void 0 ? _document$getElementB : ''
|
|
70
|
-
});
|
|
71
|
-
}, 0);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
}, {
|
|
75
|
-
key: "renderButton",
|
|
76
|
-
value: function renderButton(_ref6) {
|
|
77
|
-
var _ref = this.asProps,
|
|
78
|
-
_ref3;
|
|
79
|
-
var buttonProps = _ref6.buttonProps,
|
|
80
|
-
children = _ref6.children;
|
|
81
|
-
var styles = this.asProps.styles;
|
|
82
|
-
var SButton = Box;
|
|
83
|
-
return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SButton, _ref3.cn("SButton", _objectSpread({}, _assignProps(_objectSpread({}, buttonProps), _ref))), children);
|
|
84
|
-
}
|
|
85
|
-
}, {
|
|
86
|
-
key: "renderButtonWithHint",
|
|
87
|
-
value: function renderButtonWithHint(_ref7) {
|
|
88
|
-
var _ref2 = this.asProps,
|
|
89
|
-
_ref4;
|
|
90
|
-
var buttonProps = _ref7.buttonProps,
|
|
91
|
-
children = _ref7.children,
|
|
92
|
-
hintProps = _ref7.hintProps;
|
|
93
|
-
var styles = this.asProps.styles;
|
|
94
|
-
var SButton = Hint;
|
|
95
|
-
return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SButton, _ref4.cn("SButton", _objectSpread({}, _assignProps2(_objectSpread(_objectSpread({}, buttonProps), hintProps), _ref2))), children);
|
|
96
|
-
}
|
|
97
|
-
}, {
|
|
98
|
-
key: "render",
|
|
99
|
-
value: function render() {
|
|
100
|
-
var _ref8,
|
|
101
|
-
_ref9,
|
|
102
|
-
_this3 = this;
|
|
103
|
-
var _this$asProps = this.asProps,
|
|
104
|
-
styles = _this$asProps.styles,
|
|
105
|
-
use = _this$asProps.use,
|
|
106
|
-
_this$asProps$theme = _this$asProps.theme,
|
|
107
|
-
theme = _this$asProps$theme === void 0 ? typeof use === 'string' && MAP_USE_DEFAULT_THEME[use] : _this$asProps$theme,
|
|
108
|
-
loading = _this$asProps.loading,
|
|
109
|
-
_this$asProps$disable = _this$asProps.disabled,
|
|
110
|
-
disabled = _this$asProps$disable === void 0 ? loading : _this$asProps$disable,
|
|
111
|
-
size = _this$asProps.size,
|
|
112
|
-
neighborLocation = _this$asProps.neighborLocation,
|
|
113
|
-
hasChildren = _this$asProps.children,
|
|
114
|
-
title = _this$asProps.title,
|
|
115
|
-
ariaLabel = _this$asProps['aria-label'],
|
|
116
|
-
Children = _this$asProps.Children,
|
|
117
|
-
AddonLeft = _this$asProps.addonLeft,
|
|
118
|
-
AddonRight = _this$asProps.addonRight,
|
|
119
|
-
hintPlacement = _this$asProps.hintPlacement;
|
|
120
|
-
// @ts-ignore
|
|
121
|
-
var Button = this[CORE_INSTANCE];
|
|
122
|
-
var useTheme = use && theme ? "".concat(use, "-").concat(theme) : false;
|
|
123
|
-
var SInner = Box;
|
|
124
|
-
var SSpin = Box;
|
|
125
|
-
var buttonAriaLabel = (_ref8 = (_ref9 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref9 !== void 0 ? _ref9 : this.state.ariaLabelledByContent) !== null && _ref8 !== void 0 ? _ref8 : '';
|
|
126
|
-
var buttonProps = {
|
|
127
|
-
type: 'button',
|
|
128
|
-
tag: 'button',
|
|
129
|
-
disabled: disabled,
|
|
130
|
-
'use:theme': useTheme,
|
|
131
|
-
ref: this.containerRef,
|
|
132
|
-
'text-color': this.getTextColor(),
|
|
133
|
-
'aria-busy': loading,
|
|
134
|
-
__excludeProps: ['title']
|
|
135
|
-
};
|
|
136
|
-
var hintProps = {
|
|
137
|
-
title: buttonAriaLabel,
|
|
138
|
-
timeout: [250, 50],
|
|
139
|
-
placement: hintPlacement,
|
|
140
|
-
theme: theme === 'invert' ? 'invert' : undefined,
|
|
141
|
-
__excludeProps: []
|
|
142
|
-
};
|
|
143
|
-
return /*#__PURE__*/React.createElement(NeighborLocation.Detect, {
|
|
144
|
-
neighborLocation: neighborLocation
|
|
145
|
-
}, function (neighborLocation) {
|
|
146
|
-
var _ref5;
|
|
147
|
-
var children = (_ref5 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SInner, _ref5.cn("SInner", {
|
|
148
|
-
"tag": 'span',
|
|
149
|
-
"loading": loading
|
|
150
|
-
}), AddonLeft ? /*#__PURE__*/React.createElement(Button.Addon, null, /*#__PURE__*/React.createElement(AddonLeft, _ref5.cn("AddonLeft", {}))) : null, addonTextChildren(Children, Button.Text, Button.Addon), AddonRight ? /*#__PURE__*/React.createElement(Button.Addon, null, /*#__PURE__*/React.createElement(AddonRight, _ref5.cn("AddonRight", {}))) : null), loading && /*#__PURE__*/React.createElement(SSpin, _ref5.cn("SSpin", {
|
|
151
|
-
"tag": 'span'
|
|
152
|
-
}), /*#__PURE__*/React.createElement(SpinButton, _ref5.cn("SpinButton", {
|
|
153
|
-
"centered": true,
|
|
154
|
-
"size": size,
|
|
155
|
-
"theme": useTheme
|
|
156
|
-
})))));
|
|
157
|
-
buttonProps.neighborLocation = neighborLocation;
|
|
158
|
-
if (hasChildren === undefined || title) {
|
|
159
|
-
return _this3.renderButtonWithHint({
|
|
160
|
-
buttonProps: buttonProps,
|
|
161
|
-
hintProps: hintProps,
|
|
162
|
-
children: children
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
|
-
return _this3.renderButton({
|
|
166
|
-
buttonProps: buttonProps,
|
|
167
|
-
children: children
|
|
168
|
-
});
|
|
169
|
-
});
|
|
170
|
-
}
|
|
171
|
-
}]);
|
|
172
|
-
return AbstractButton;
|
|
173
|
-
}(Component);
|
|
174
|
-
_defineProperty(AbstractButton, "displayName", 'AbstractButton');
|
|
175
|
-
//# sourceMappingURL=AbstractButton.js.map
|