@semcore/base-trigger 17.0.0-prerelease.29 → 17.0.0-prerelease.31
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 +1 -1
- package/lib/cjs/BaseTrigger.js +2 -6
- package/lib/cjs/BaseTrigger.js.map +1 -1
- package/lib/cjs/ButtonTrigger.js +2 -1
- package/lib/cjs/ButtonTrigger.js.map +1 -1
- package/lib/cjs/LinkTrigger.js +18 -87
- package/lib/cjs/LinkTrigger.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/es6/BaseTrigger.js +2 -6
- package/lib/es6/BaseTrigger.js.map +1 -1
- package/lib/es6/ButtonTrigger.js +2 -1
- package/lib/es6/ButtonTrigger.js.map +1 -1
- package/lib/es6/LinkTrigger.js +19 -91
- package/lib/es6/LinkTrigger.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/esm/BaseTrigger.mjs +3 -7
- package/lib/esm/ButtonTrigger.mjs +2 -1
- package/lib/esm/LinkTrigger.mjs +19 -92
- package/lib/types/index.d.ts +10 -5
- package/package.json +10 -9
- package/lib/cjs/style/link-trigger.shadow.css +0 -96
- package/lib/es6/style/link-trigger.shadow.css +0 -96
- package/lib/esm/style/link-trigger.shadow.css +0 -96
package/CHANGELOG.md
CHANGED
package/lib/cjs/BaseTrigger.js
CHANGED
|
@@ -113,8 +113,7 @@ function Text(props) {
|
|
|
113
113
|
empty,
|
|
114
114
|
placeholder,
|
|
115
115
|
triggerRef,
|
|
116
|
-
ellipsis = false
|
|
117
|
-
hintProps
|
|
116
|
+
ellipsis = false
|
|
118
117
|
} = props;
|
|
119
118
|
const content = empty ? placeholder : children;
|
|
120
119
|
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(SText, _ref5.cn("SText", {
|
|
@@ -123,10 +122,7 @@ function Text(props) {
|
|
|
123
122
|
"aria-hidden": empty,
|
|
124
123
|
"ref": textRef,
|
|
125
124
|
"ellipsis": ellipsis,
|
|
126
|
-
"
|
|
127
|
-
...hintProps,
|
|
128
|
-
triggerRef
|
|
129
|
-
}
|
|
125
|
+
"hint:triggerRef": triggerRef
|
|
130
126
|
}, _ref2)
|
|
131
127
|
}), content));
|
|
132
128
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseTrigger.js","names":["_core","require","_baseComponents","_addonTextChildren","_interopRequireDefault","_animatedSizeEnhance","_useCssVariable","_typography","_react","style","sstyled","insert","RootBaseTrigger","Component","constructor","args","_defineProperty2","default","React","createRef","getTextProps","placeholder","empty","asProps","triggerRef","render","_ref","SBaseTrigger","Box","SInner","SInvalidPattern","InvalidStateBox","Children","styles","theme","neighborLocation","state","size","createElement","NeighborLocation","Detect","_ref4","cn","assignProps","addonTextChildren","BaseTrigger","Text","Addon","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","animatedSizeEnhance","animateProps","onChangeOf","props","_ref2","arguments[0]","_ref5","SText","TextKit","textRef","useRef","children","ellipsis","
|
|
1
|
+
{"version":3,"file":"BaseTrigger.js","names":["_core","require","_baseComponents","_addonTextChildren","_interopRequireDefault","_animatedSizeEnhance","_useCssVariable","_typography","_react","style","sstyled","insert","RootBaseTrigger","Component","constructor","args","_defineProperty2","default","React","createRef","getTextProps","placeholder","empty","asProps","triggerRef","render","_ref","SBaseTrigger","Box","SInner","SInvalidPattern","InvalidStateBox","Children","styles","theme","neighborLocation","state","size","createElement","NeighborLocation","Detect","_ref4","cn","assignProps","addonTextChildren","BaseTrigger","Text","Addon","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","animatedSizeEnhance","animateProps","onChangeOf","props","_ref2","arguments[0]","_ref5","SText","TextKit","textRef","useRef","children","ellipsis","content","Fragment","_ref3","_ref6","SAddon","createComponent","_default","exports"],"sources":["../../src/BaseTrigger.jsx"],"sourcesContent":["import { NeighborLocation, Box, InvalidStateBox } from '@semcore/base-components';\nimport { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { Text as TextKit } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/base-trigger.shadow.css';\n\nclass RootBaseTrigger extends Component {\n static displayName = 'BaseTrigger';\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static style = style;\n static defaultProps = {\n size: 'm',\n empty: false,\n };\n\n triggerRef = React.createRef();\n\n getTextProps() {\n const { placeholder, empty } = this.asProps;\n return {\n placeholder,\n empty,\n triggerRef: this.triggerRef,\n };\n }\n\n render() {\n const SBaseTrigger = Root;\n const SInner = 'span';\n const SInvalidPattern = InvalidStateBox;\n const { Children, styles, theme, neighborLocation, empty, state, size } = this.asProps;\n\n // TODO: add aria\n return (\n <NeighborLocation.Detect neighborLocation={neighborLocation}>\n {(neighborLocation) =>\n sstyled(styles)(\n <SBaseTrigger\n render={Box}\n tag='button'\n type='button'\n tabIndex={0}\n neighborLocation={neighborLocation}\n state={theme}\n ref={this.triggerRef}\n >\n {state === 'invalid' && <SInvalidPattern size={size} />}\n <SInner data-ui-name={`${this.asProps['data-ui-name']}.InnerTriggerWrapper`}>\n {addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)}\n </SInner>\n </SBaseTrigger>,\n )}\n </NeighborLocation.Detect>\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const textRef = React.useRef();\n const { children, styles, empty, placeholder, triggerRef, ellipsis = false } = props;\n const content = empty ? placeholder : children;\n\n return sstyled(styles)(\n <>\n <SText\n render={TextKit}\n display-placeholder={empty}\n aria-hidden={empty}\n ref={textRef}\n ellipsis={ellipsis}\n hint:triggerRef={triggerRef}\n >\n {content}\n </SText>\n </>,\n );\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n const { styles } = props;\n return sstyled(styles)(<SAddon render={Box} />);\n}\n\nconst BaseTrigger = createComponent(RootBaseTrigger, {\n Text,\n Addon,\n});\n\nexport default BaseTrigger;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/cjs/ButtonTrigger.js
CHANGED
|
@@ -41,11 +41,12 @@ class RootButtonTrigger extends _core.Component {
|
|
|
41
41
|
Children,
|
|
42
42
|
styles,
|
|
43
43
|
loading,
|
|
44
|
+
disabled,
|
|
44
45
|
chevron,
|
|
45
46
|
empty
|
|
46
47
|
} = this.asProps;
|
|
47
48
|
return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(_BaseTrigger.default, (0, _core.assignProps)({
|
|
48
|
-
"
|
|
49
|
+
"use:disabled": disabled || loading
|
|
49
50
|
}, _ref), (0, _addonTextChildren.default)(Children, ButtonTrigger.Text, ButtonTrigger.Addon, empty), (chevron || loading) && /*#__PURE__*/_react.default.createElement(SButtonAddon, _ref2.cn("SButtonAddon", {}), loading ? /*#__PURE__*/_react.default.createElement(SButtonTriggerSpin, _ref2.cn("SButtonTriggerSpin", {
|
|
50
51
|
"size": 'xs',
|
|
51
52
|
"theme": false
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonTrigger.js","names":["_core","require","_addonTextChildren","_interopRequireDefault","_animatedSizeEnhance","_useCssVariable","_m","_spin","_react","_BaseTrigger","style","sstyled","insert","RootButtonTrigger","Component","getTextProps","tag","getAddonProps","render","_ref","asProps","_ref2","SButtonAddon","ButtonTrigger","Addon","SButtonTriggerSpin","Spin","Children","styles","loading","chevron","empty","default","createElement","BaseTrigger","assignProps","addonTextChildren","Text","cn","_defineProperty2","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","animatedSizeEnhance","animateProps","onChangeOf","createComponent","parent","_default","exports"],"sources":["../../src/ButtonTrigger.jsx"],"sourcesContent":["import { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nimport BaseTrigger from './BaseTrigger';\nimport style from './style/button-trigger.shadow.css';\n\nclass RootButtonTrigger extends Component {\n static displayName = 'ButtonTrigger';\n static style = style;\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static defaultProps = {\n chevron: true,\n };\n\n getTextProps() {\n return {\n tag: 'span',\n };\n }\n\n getAddonProps() {\n return {\n tag: 'span',\n };\n }\n\n render() {\n const SButtonAddon = ButtonTrigger.Addon;\n const SButtonTriggerSpin = Spin;\n const { Children, styles, loading, chevron, empty } = this.asProps;\n\n return sstyled(styles)(\n <Root render={BaseTrigger}
|
|
1
|
+
{"version":3,"file":"ButtonTrigger.js","names":["_core","require","_addonTextChildren","_interopRequireDefault","_animatedSizeEnhance","_useCssVariable","_m","_spin","_react","_BaseTrigger","style","sstyled","insert","RootButtonTrigger","Component","getTextProps","tag","getAddonProps","render","_ref","asProps","_ref2","SButtonAddon","ButtonTrigger","Addon","SButtonTriggerSpin","Spin","Children","styles","loading","disabled","chevron","empty","default","createElement","BaseTrigger","assignProps","addonTextChildren","Text","cn","_defineProperty2","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","animatedSizeEnhance","animateProps","onChangeOf","createComponent","parent","_default","exports"],"sources":["../../src/ButtonTrigger.jsx"],"sourcesContent":["import { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nimport BaseTrigger from './BaseTrigger';\nimport style from './style/button-trigger.shadow.css';\n\nclass RootButtonTrigger extends Component {\n static displayName = 'ButtonTrigger';\n static style = style;\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static defaultProps = {\n chevron: true,\n };\n\n getTextProps() {\n return {\n tag: 'span',\n };\n }\n\n getAddonProps() {\n return {\n tag: 'span',\n };\n }\n\n render() {\n const SButtonAddon = ButtonTrigger.Addon;\n const SButtonTriggerSpin = Spin;\n const { Children, styles, loading, disabled, chevron, empty } = this.asProps;\n\n return sstyled(styles)(\n <Root render={BaseTrigger} use:disabled={disabled || loading}>\n {addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon, empty)}\n {(chevron || loading) && (\n <SButtonAddon>\n {loading ? <SButtonTriggerSpin size='xs' theme={false} /> : <ChevronDown />}\n </SButtonAddon>\n )}\n </Root>,\n );\n }\n}\n\nconst ButtonTrigger = createComponent(\n RootButtonTrigger,\n {\n Text: BaseTrigger.Text,\n Addon: BaseTrigger.Addon,\n },\n {\n parent: BaseTrigger,\n },\n);\n\nexport default ButtonTrigger;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/cjs/LinkTrigger.js
CHANGED
|
@@ -7,116 +7,47 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _core = require("@semcore/core");
|
|
10
|
-
var
|
|
10
|
+
var _button = require("@semcore/button");
|
|
11
11
|
var _addonTextChildren = _interopRequireDefault(require("@semcore/core/lib/utils/addonTextChildren"));
|
|
12
|
-
var _resolveColorEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/resolveColorEnhance"));
|
|
13
12
|
var _m = _interopRequireDefault(require("@semcore/icon/ChevronDown/m"));
|
|
14
13
|
var _spin = _interopRequireDefault(require("@semcore/spin"));
|
|
15
|
-
var _typography = require("@semcore/typography");
|
|
16
14
|
var _react = _interopRequireDefault(require("react"));
|
|
17
|
-
/*!__reshadow-styles__:"./style/link-trigger.shadow.css"*/
|
|
18
|
-
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SLinkTrigger_543t3_gg_{display:inline-flex;align-items:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;vertical-align:middle;font-family:inherit;cursor:pointer;color:var(--intergalactic-text-link, #006dca);background:0 0;transition:color .15s ease-in-out;border:0}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_,.___SLinkTrigger_543t3_gg_:active{color:var(--intergalactic-text-link-hover-active, #044792)}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover{color:var(--intergalactic-text-link-hover-active, #044792)}}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_ .___SText_543t3_gg_,.___SLinkTrigger_543t3_gg_:active .___SText_543t3_gg_{border-color:currentColor}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover .___SText_543t3_gg_{border-color:currentColor}}.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{border-bottom-width:1px;border-bottom-style:solid;border-color:transparent;transition:border-bottom-color .15s ease-in-out;text-overflow:ellipsis;overflow:hidden}.___SLinkTrigger_543t3_gg_.__color_543t3_gg_{color:var(--color_543t3)}@media (hover:hover){.___SLinkTrigger_543t3_gg_.__color_543t3_gg_:hover{filter:brightness(.8)}}.___SLinkTrigger_543t3_gg_.__disabled_543t3_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_543t3_gg_,.___SLinkAddon_543t3_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:var(--intergalactic-spacing-05x, 2px)}.___SAddon_543t3_gg_:not(:only-child):first-child,.___SLinkAddon_543t3_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-1x, 4px)}.___SAddon_543t3_gg_:not(:only-child):last-child,.___SLinkAddon_543t3_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-1x, 4px)}.___SLinkAddon_543t3_gg_{width:16px;height:16px}.___SLinkTrigger_543t3_gg_._size_m_543t3_gg_{font-size:var(--intergalactic-fs-200, 14px)}.___SLinkTrigger_543t3_gg_._size_l_543t3_gg_{font-size:var(--intergalactic-fs-300, 16px)}@media (prefers-reduced-motion){.___SLinkTrigger_543t3_gg_,.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{transition:none}}", /*__inner_css_end__*/"543t3_gg_"),
|
|
19
|
-
/*__reshadow_css_end__*/
|
|
20
|
-
{
|
|
21
|
-
"__SLinkTrigger": "___SLinkTrigger_543t3_gg_",
|
|
22
|
-
"_disabled": "__disabled_543t3_gg_",
|
|
23
|
-
"__SLinkAddon": "___SLinkAddon_543t3_gg_",
|
|
24
|
-
"_size_m": "_size_m_543t3_gg_",
|
|
25
|
-
"_size_l": "_size_l_543t3_gg_",
|
|
26
|
-
"_active": "__active_543t3_gg_",
|
|
27
|
-
"__SText": "___SText_543t3_gg_",
|
|
28
|
-
"_color": "__color_543t3_gg_",
|
|
29
|
-
"--color": "--color_543t3",
|
|
30
|
-
"__SAddon": "___SAddon_543t3_gg_"
|
|
31
|
-
});
|
|
32
15
|
class RootLinkTrigger extends _core.Component {
|
|
33
|
-
|
|
34
|
-
super(...args);
|
|
35
|
-
(0, _defineProperty2.default)(this, "triggerRef", /*#__PURE__*/_react.default.createRef());
|
|
36
|
-
}
|
|
37
|
-
getTextProps() {
|
|
16
|
+
getTextProps(props) {
|
|
38
17
|
const {
|
|
39
18
|
placeholder,
|
|
40
19
|
empty
|
|
41
20
|
} = this.asProps;
|
|
21
|
+
const content = empty ? placeholder : props.children;
|
|
42
22
|
return {
|
|
43
|
-
|
|
44
|
-
empty
|
|
45
|
-
triggerRef: this.triggerRef
|
|
23
|
+
'use:children': content,
|
|
24
|
+
empty
|
|
46
25
|
};
|
|
47
26
|
}
|
|
48
27
|
render() {
|
|
49
|
-
var _ref = this.asProps
|
|
50
|
-
|
|
51
|
-
const SLinkTrigger = _baseComponents.Box;
|
|
28
|
+
var _ref = this.asProps;
|
|
29
|
+
const SLinkTrigger = _button.ButtonLink;
|
|
52
30
|
const SLinkAddon = LinkTrigger.Addon;
|
|
53
31
|
const {
|
|
54
32
|
Children,
|
|
55
33
|
loading,
|
|
56
|
-
styles,
|
|
57
34
|
empty,
|
|
58
|
-
|
|
59
|
-
resolveColor
|
|
35
|
+
disabled
|
|
60
36
|
} = this.asProps;
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
"ref": this.triggerRef,
|
|
68
|
-
"use:color": color
|
|
69
|
-
}, _ref)
|
|
70
|
-
}), (0, _addonTextChildren.default)(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /*#__PURE__*/_react.default.createElement(SLinkAddon, _ref4.cn("SLinkAddon", {}), loading ? /*#__PURE__*/_react.default.createElement(_spin.default, _ref4.cn("Spin", {
|
|
71
|
-
"size": 'xs',
|
|
72
|
-
"theme": 'currentColor'
|
|
73
|
-
})) : /*#__PURE__*/_react.default.createElement(_m.default, _ref4.cn("ChevronDown", {}))));
|
|
37
|
+
return /*#__PURE__*/_react.default.createElement(SLinkTrigger, (0, _core.assignProps)({
|
|
38
|
+
"use:disabled": disabled || loading
|
|
39
|
+
}, _ref), (0, _addonTextChildren.default)(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /*#__PURE__*/_react.default.createElement(SLinkAddon, null, loading ? /*#__PURE__*/_react.default.createElement(_spin.default, {
|
|
40
|
+
size: "xs",
|
|
41
|
+
theme: "currentColor"
|
|
42
|
+
}) : /*#__PURE__*/_react.default.createElement(_m.default, null)));
|
|
74
43
|
}
|
|
75
44
|
}
|
|
76
45
|
(0, _defineProperty2.default)(RootLinkTrigger, "displayName", 'LinkTrigger');
|
|
77
|
-
(0, _defineProperty2.default)(RootLinkTrigger, "style", style);
|
|
78
|
-
(0, _defineProperty2.default)(RootLinkTrigger, "defaultProps", {
|
|
79
|
-
size: 'm'
|
|
80
|
-
});
|
|
81
|
-
(0, _defineProperty2.default)(RootLinkTrigger, "enhance", [(0, _resolveColorEnhance.default)()]);
|
|
82
|
-
function Text(props) {
|
|
83
|
-
var _ref2 = arguments[0],
|
|
84
|
-
_ref5;
|
|
85
|
-
const SText = _typography.Text;
|
|
86
|
-
const textRef = _react.default.useRef();
|
|
87
|
-
const {
|
|
88
|
-
children,
|
|
89
|
-
styles,
|
|
90
|
-
empty,
|
|
91
|
-
placeholder,
|
|
92
|
-
triggerRef,
|
|
93
|
-
ellipsis = false,
|
|
94
|
-
hintProps
|
|
95
|
-
} = props;
|
|
96
|
-
const content = empty ? placeholder : children;
|
|
97
|
-
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(SText, _ref5.cn("SText", {
|
|
98
|
-
...(0, _core.assignProps)({
|
|
99
|
-
"display-placeholder": empty,
|
|
100
|
-
"ref": textRef,
|
|
101
|
-
"ellipsis": ellipsis,
|
|
102
|
-
"hintProps": {
|
|
103
|
-
...hintProps,
|
|
104
|
-
triggerRef
|
|
105
|
-
}
|
|
106
|
-
}, _ref2)
|
|
107
|
-
}), content));
|
|
108
|
-
}
|
|
109
|
-
function Addon(props) {
|
|
110
|
-
var _ref3 = arguments[0],
|
|
111
|
-
_ref6;
|
|
112
|
-
const SAddon = _baseComponents.Box;
|
|
113
|
-
return _ref6 = (0, _core.sstyled)(props.styles), /*#__PURE__*/_react.default.createElement(SAddon, _ref6.cn("SAddon", {
|
|
114
|
-
...(0, _core.assignProps)({}, _ref3)
|
|
115
|
-
}));
|
|
116
|
-
}
|
|
117
46
|
const LinkTrigger = (0, _core.createComponent)(RootLinkTrigger, {
|
|
118
|
-
Text,
|
|
119
|
-
Addon
|
|
47
|
+
Text: _button.ButtonLink.Text,
|
|
48
|
+
Addon: _button.ButtonLink.Addon
|
|
49
|
+
}, {
|
|
50
|
+
parent: _button.ButtonLink
|
|
120
51
|
});
|
|
121
52
|
var _default = exports.default = LinkTrigger;
|
|
122
53
|
//# sourceMappingURL=LinkTrigger.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkTrigger.js","names":["_core","require","
|
|
1
|
+
{"version":3,"file":"LinkTrigger.js","names":["_core","require","_button","_addonTextChildren","_interopRequireDefault","_m","_spin","_react","RootLinkTrigger","Component","getTextProps","props","placeholder","empty","asProps","content","children","render","_ref","SLinkTrigger","ButtonLink","SLinkAddon","LinkTrigger","Addon","Children","loading","disabled","default","createElement","assignProps","addonTextChildren","Text","size","theme","_defineProperty2","createComponent","parent","_default","exports"],"sources":["../../src/LinkTrigger.jsx"],"sourcesContent":["import { ButtonLink } from '@semcore/button';\nimport { createComponent, Component, Root } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nclass RootLinkTrigger extends Component {\n static displayName = 'LinkTrigger';\n\n getTextProps(props) {\n const { placeholder, empty } = this.asProps;\n const content = empty ? placeholder : props.children;\n\n return {\n 'use:children': content,\n empty,\n };\n }\n\n render() {\n const SLinkTrigger = Root;\n const SLinkAddon = LinkTrigger.Addon;\n const { Children, loading, empty, disabled } = this.asProps;\n\n return (\n <SLinkTrigger\n render={ButtonLink}\n use:disabled={disabled || loading}\n >\n {addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty)}\n <SLinkAddon>\n {loading ? <Spin size='xs' theme='currentColor' /> : <ChevronDown />}\n </SLinkAddon>\n </SLinkTrigger>\n );\n }\n}\n\nconst LinkTrigger = createComponent(RootLinkTrigger, {\n Text: ButtonLink.Text,\n Addon: ButtonLink.Addon,\n}, {\n parent: ButtonLink,\n});\n\nexport default LinkTrigger;\n"],"mappings":";;;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AADA,IAAAC,OAAA,GAAAD,OAAA;AAEA,IAAAE,kBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,EAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,KAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,MAAA,GAAAH,sBAAA,CAAAH,OAAA;AAEA,MAAMO,eAAe,SAASC,eAAS,CAAC;EAGtCC,YAAYA,CAACC,KAAK,EAAE;IAClB,MAAM;MAAEC,WAAW;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACC,OAAO;IAC3C,MAAMC,OAAO,GAAGF,KAAK,GAAGD,WAAW,GAAGD,KAAK,CAACK,QAAQ;IAEpD,OAAO;MACL,cAAc,EAAED,OAAO;MACvBF;IACF,CAAC;EACH;EAEAI,MAAMA,CAAA,EAAG;IAAA,IAAAC,IAAA,QAAAJ,OAAA;IACP,MAAMK,YAAY,GAMNC,kBAAU;IALtB,MAAMC,UAAU,GAAGC,WAAW,CAACC,KAAK;IACpC,MAAM;MAAEC,QAAQ;MAAEC,OAAO;MAAEZ,KAAK;MAAEa;IAAS,CAAC,GAAG,IAAI,CAACZ,OAAO;IAE3D,oBACEP,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACT,YAAY,MAAAnB,KAAA,CAAA6B,WAAA;MAAA,gBAEGH,QAAQ,IAAID;IAAO,GAAAP,IAAA,GAEhC,IAAAY,0BAAiB,EAACN,QAAQ,EAAEF,WAAW,CAACS,IAAI,EAAET,WAAW,CAACC,KAAK,EAAEV,KAAK,CAAC,eACxEN,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACP,UAAU,QACRI,OAAO,gBAAGlB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACtB,KAAA,CAAAqB,OAAI;MAACK,IAAI,EAAC,IAAI;MAACC,KAAK,EAAC;IAAc,CAAE,CAAC,gBAAG1B,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACvB,EAAA,CAAAsB,OAAW,MAAE,CACzD,CACA,CAAC;EAEnB;AACF;AAAC,IAAAO,gBAAA,CAAAP,OAAA,EA9BKnB,eAAe,iBACE,aAAa;AA+BpC,MAAMc,WAAW,GAAG,IAAAa,qBAAe,EAAC3B,eAAe,EAAE;EACnDuB,IAAI,EAAEX,kBAAU,CAACW,IAAI;EACrBR,KAAK,EAAEH,kBAAU,CAACG;AACpB,CAAC,EAAE;EACDa,MAAM,EAAEhB;AACV,CAAC,CAAC;AAAC,IAAAiB,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAEYL,WAAW","ignoreList":[]}
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport type { CounterProps } from '@semcore/counter';\nimport type { Text } from '@semcore/typography';\nimport type React from 'react';\n\nexport type BaseTriggerProps = BoxProps &\n NeighborItemProps &\n WithAnimatedSizeEnhanceProps & {\n /**\n * Trigger size\n * @default m\n */\n size?: 'm' | 'l';\n /**\n * Trigger state\n */\n state?: 'normal' | 'valid' | 'invalid';\n /**\n * Sets active state to trigger\n */\n active?: boolean;\n /**\n * Responsible for placeholder displaying\n */\n empty?: boolean;\n /**\n * Placeholder text\n */\n placeholder?: React.ReactNode;\n /**\n * Sets disabled state to trigger\n */\n disabled?: boolean;\n };\n\nexport type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {\n /** Sets the loading state */\n loading?: boolean;\n /**\n * Display the dropdowns chevron icon\n * @default true\n */\n chevron?: boolean;\n};\n\nexport type LinkTriggerProps =
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';\nimport type { ButtonLinkProps, ButtonLink } from '@semcore/button';\nimport type { Intergalactic } from '@semcore/core';\nimport type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport type { CounterProps } from '@semcore/counter';\nimport type { Text } from '@semcore/typography';\nimport type React from 'react';\n\nexport type BaseTriggerProps = BoxProps &\n NeighborItemProps &\n WithAnimatedSizeEnhanceProps & {\n /**\n * Trigger size\n * @default m\n */\n size?: 'm' | 'l';\n /**\n * Trigger state\n */\n state?: 'normal' | 'valid' | 'invalid';\n /**\n * Sets active state to trigger\n */\n active?: boolean;\n /**\n * Responsible for placeholder displaying\n */\n empty?: boolean;\n /**\n * Placeholder text\n */\n placeholder?: React.ReactNode;\n /**\n * Sets disabled state to trigger\n */\n disabled?: boolean;\n };\n\nexport type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {\n /** Sets the loading state */\n loading?: boolean;\n /**\n * Display the dropdowns chevron icon\n * @default true\n */\n chevron?: boolean;\n};\n\nexport type LinkTriggerProps = ButtonLinkProps & {\n /** Trigger state */\n state?: 'normal' | 'valid' | 'invalid';\n /** Sets the loading state */\n loading?: boolean;\n /** Placeholder text */\n placeholder?: React.ReactNode;\n /** Responsible for placeholder displaying */\n empty?: boolean;\n};\n\nexport type FilterTriggerProps = BaseTriggerProps & {\n /** Click on the filter cleaning cross */\n onClear?: (event: React.SyntheticEvent) => void;\n /** Specifies the locale for i18n support */\n locale?: string;\n /** List of props that will be added to the select inside of filter */\n includeInputProps?: string[];\n /** Normal `ref` prop refers to FilterTrigger wrapper while `triggerRef` refers explicitly to trigger button */\n triggerRef?: React.Ref<HTMLButtonElement>;\n};\n\nexport type FilterTriggerCounterProps = {\n /** Count for render */\n count?: number;\n};\n\ndeclare const BaseTrigger: Intergalactic.Component<'div', BaseTriggerProps> & {\n Text: typeof Text;\n Addon: typeof Box;\n};\n\ndeclare const ButtonTrigger: Intergalactic.Component<'div', ButtonTriggerProps> & {\n Text: typeof BaseTrigger.Text;\n Addon: typeof BaseTrigger.Addon;\n};\n\ndeclare const LinkTrigger: Intergalactic.Component<'div', LinkTriggerProps> & {\n Text: typeof ButtonLink.Text;\n Addon: typeof ButtonLink.Addon;\n};\n\ndeclare const FilterTrigger: Intergalactic.Component<'div', FilterTriggerProps> & {\n Text: typeof BaseTrigger.Text;\n Addon: typeof BaseTrigger.Addon;\n Counter: Intergalactic.Component<'div', CounterProps & FilterTriggerCounterProps>;\n TriggerButton: typeof BaseTrigger;\n ClearButton: typeof BaseTrigger;\n};\n\nexport default BaseTrigger;\nexport { ButtonTrigger, LinkTrigger, FilterTrigger };\n"],"mappings":"","ignoreList":[]}
|
package/lib/es6/BaseTrigger.js
CHANGED
|
@@ -110,8 +110,7 @@ function Text(props) {
|
|
|
110
110
|
empty,
|
|
111
111
|
placeholder,
|
|
112
112
|
triggerRef,
|
|
113
|
-
ellipsis = false
|
|
114
|
-
hintProps
|
|
113
|
+
ellipsis = false
|
|
115
114
|
} = props;
|
|
116
115
|
const content = empty ? placeholder : children;
|
|
117
116
|
return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SText, _ref5.cn("SText", {
|
|
@@ -120,10 +119,7 @@ function Text(props) {
|
|
|
120
119
|
"aria-hidden": empty,
|
|
121
120
|
"ref": textRef,
|
|
122
121
|
"ellipsis": ellipsis,
|
|
123
|
-
"
|
|
124
|
-
...hintProps,
|
|
125
|
-
triggerRef
|
|
126
|
-
}
|
|
122
|
+
"hint:triggerRef": triggerRef
|
|
127
123
|
}, _ref2)
|
|
128
124
|
}), content));
|
|
129
125
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseTrigger.js","names":["NeighborLocation","Box","InvalidStateBox","createComponent","Component","Root","sstyled","addonTextChildren","animatedSizeEnhance","cssVariableEnhance","Text","TextKit","React","style","_sstyled","insert","RootBaseTrigger","constructor","args","_defineProperty","createRef","getTextProps","placeholder","empty","asProps","triggerRef","render","_ref","SBaseTrigger","SInner","SInvalidPattern","Children","styles","theme","neighborLocation","state","size","createElement","Detect","_ref4","cn","_assignProps","BaseTrigger","Addon","variable","fallback","map","Number","parseInt","prop","animateProps","onChangeOf","props","_ref2","arguments[0]","_ref5","SText","textRef","useRef","children","ellipsis","
|
|
1
|
+
{"version":3,"file":"BaseTrigger.js","names":["NeighborLocation","Box","InvalidStateBox","createComponent","Component","Root","sstyled","addonTextChildren","animatedSizeEnhance","cssVariableEnhance","Text","TextKit","React","style","_sstyled","insert","RootBaseTrigger","constructor","args","_defineProperty","createRef","getTextProps","placeholder","empty","asProps","triggerRef","render","_ref","SBaseTrigger","SInner","SInvalidPattern","Children","styles","theme","neighborLocation","state","size","createElement","Detect","_ref4","cn","_assignProps","BaseTrigger","Addon","variable","fallback","map","Number","parseInt","prop","animateProps","onChangeOf","props","_ref2","arguments[0]","_ref5","SText","textRef","useRef","children","ellipsis","content","Fragment","_assignProps2","_ref3","_ref6","SAddon","_assignProps3"],"sources":["../../src/BaseTrigger.jsx"],"sourcesContent":["import { NeighborLocation, Box, InvalidStateBox } from '@semcore/base-components';\nimport { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { Text as TextKit } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/base-trigger.shadow.css';\n\nclass RootBaseTrigger extends Component {\n static displayName = 'BaseTrigger';\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static style = style;\n static defaultProps = {\n size: 'm',\n empty: false,\n };\n\n triggerRef = React.createRef();\n\n getTextProps() {\n const { placeholder, empty } = this.asProps;\n return {\n placeholder,\n empty,\n triggerRef: this.triggerRef,\n };\n }\n\n render() {\n const SBaseTrigger = Root;\n const SInner = 'span';\n const SInvalidPattern = InvalidStateBox;\n const { Children, styles, theme, neighborLocation, empty, state, size } = this.asProps;\n\n // TODO: add aria\n return (\n <NeighborLocation.Detect neighborLocation={neighborLocation}>\n {(neighborLocation) =>\n sstyled(styles)(\n <SBaseTrigger\n render={Box}\n tag='button'\n type='button'\n tabIndex={0}\n neighborLocation={neighborLocation}\n state={theme}\n ref={this.triggerRef}\n >\n {state === 'invalid' && <SInvalidPattern size={size} />}\n <SInner data-ui-name={`${this.asProps['data-ui-name']}.InnerTriggerWrapper`}>\n {addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)}\n </SInner>\n </SBaseTrigger>,\n )}\n </NeighborLocation.Detect>\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const textRef = React.useRef();\n const { children, styles, empty, placeholder, triggerRef, ellipsis = false } = props;\n const content = empty ? placeholder : children;\n\n return sstyled(styles)(\n <>\n <SText\n render={TextKit}\n display-placeholder={empty}\n aria-hidden={empty}\n ref={textRef}\n ellipsis={ellipsis}\n hint:triggerRef={triggerRef}\n >\n {content}\n </SText>\n </>,\n );\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n const { styles } = props;\n return sstyled(styles)(<SAddon render={Box} />);\n}\n\nconst BaseTrigger = createComponent(RootBaseTrigger, {\n Text,\n Addon,\n});\n\nexport default BaseTrigger;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/es6/ButtonTrigger.js
CHANGED
|
@@ -36,11 +36,12 @@ class RootButtonTrigger extends Component {
|
|
|
36
36
|
Children,
|
|
37
37
|
styles,
|
|
38
38
|
loading,
|
|
39
|
+
disabled,
|
|
39
40
|
chevron,
|
|
40
41
|
empty
|
|
41
42
|
} = this.asProps;
|
|
42
43
|
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(BaseTrigger, _assignProps({
|
|
43
|
-
"
|
|
44
|
+
"use:disabled": disabled || loading
|
|
44
45
|
}, _ref), addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon, empty), (chevron || loading) && /*#__PURE__*/React.createElement(SButtonAddon, _ref2.cn("SButtonAddon", {}), loading ? /*#__PURE__*/React.createElement(SButtonTriggerSpin, _ref2.cn("SButtonTriggerSpin", {
|
|
45
46
|
"size": 'xs',
|
|
46
47
|
"theme": false
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonTrigger.js","names":["createComponent","Component","Root","sstyled","addonTextChildren","animatedSizeEnhance","cssVariableEnhance","ChevronDown","Spin","React","BaseTrigger","style","_sstyled","insert","RootButtonTrigger","getTextProps","tag","getAddonProps","render","_ref","asProps","_ref2","SButtonAddon","ButtonTrigger","Addon","SButtonTriggerSpin","Children","styles","loading","chevron","empty","createElement","_assignProps","Text","cn","_defineProperty","variable","fallback","map","Number","parseInt","prop","animateProps","onChangeOf","parent"],"sources":["../../src/ButtonTrigger.jsx"],"sourcesContent":["import { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nimport BaseTrigger from './BaseTrigger';\nimport style from './style/button-trigger.shadow.css';\n\nclass RootButtonTrigger extends Component {\n static displayName = 'ButtonTrigger';\n static style = style;\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static defaultProps = {\n chevron: true,\n };\n\n getTextProps() {\n return {\n tag: 'span',\n };\n }\n\n getAddonProps() {\n return {\n tag: 'span',\n };\n }\n\n render() {\n const SButtonAddon = ButtonTrigger.Addon;\n const SButtonTriggerSpin = Spin;\n const { Children, styles, loading, chevron, empty } = this.asProps;\n\n return sstyled(styles)(\n <Root render={BaseTrigger}
|
|
1
|
+
{"version":3,"file":"ButtonTrigger.js","names":["createComponent","Component","Root","sstyled","addonTextChildren","animatedSizeEnhance","cssVariableEnhance","ChevronDown","Spin","React","BaseTrigger","style","_sstyled","insert","RootButtonTrigger","getTextProps","tag","getAddonProps","render","_ref","asProps","_ref2","SButtonAddon","ButtonTrigger","Addon","SButtonTriggerSpin","Children","styles","loading","disabled","chevron","empty","createElement","_assignProps","Text","cn","_defineProperty","variable","fallback","map","Number","parseInt","prop","animateProps","onChangeOf","parent"],"sources":["../../src/ButtonTrigger.jsx"],"sourcesContent":["import { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport animatedSizeEnhance from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nimport BaseTrigger from './BaseTrigger';\nimport style from './style/button-trigger.shadow.css';\n\nclass RootButtonTrigger extends Component {\n static displayName = 'ButtonTrigger';\n static style = style;\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-control',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n animatedSizeEnhance({\n animateProps: ['width'],\n onChangeOf: ['value'],\n }),\n ];\n\n static defaultProps = {\n chevron: true,\n };\n\n getTextProps() {\n return {\n tag: 'span',\n };\n }\n\n getAddonProps() {\n return {\n tag: 'span',\n };\n }\n\n render() {\n const SButtonAddon = ButtonTrigger.Addon;\n const SButtonTriggerSpin = Spin;\n const { Children, styles, loading, disabled, chevron, empty } = this.asProps;\n\n return sstyled(styles)(\n <Root render={BaseTrigger} use:disabled={disabled || loading}>\n {addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon, empty)}\n {(chevron || loading) && (\n <SButtonAddon>\n {loading ? <SButtonTriggerSpin size='xs' theme={false} /> : <ChevronDown />}\n </SButtonAddon>\n )}\n </Root>,\n );\n }\n}\n\nconst ButtonTrigger = createComponent(\n RootButtonTrigger,\n {\n Text: BaseTrigger.Text,\n Addon: BaseTrigger.Addon,\n },\n {\n parent: BaseTrigger,\n },\n);\n\nexport default ButtonTrigger;\n"],"mappings":";;;AAAA,SAASA,eAAe,EAAEC,SAAS,EAAEC,IAAI,EAAEC,OAAO,QAAQ,eAAe;AACzE,OAAOC,iBAAiB,MAAM,2CAA2C;AACzE,OAAOC,mBAAmB,MAAM,sDAAsD;AACtF,SAASC,kBAAkB,QAAQ,wCAAwC;AAC3E,OAAOC,WAAW,MAAM,6BAA6B;AACrD,OAAOC,IAAI,MAAM,eAAe;AAChC,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAOC,WAAW,MAAM,eAAe;AAAC;AAAA,MAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;AAAA;AAGxC,MAAMC,iBAAiB,SAASb,SAAS,CAAC;EAoBxCc,YAAYA,CAAA,EAAG;IACb,OAAO;MACLC,GAAG,EAAE;IACP,CAAC;EACH;EAEAC,aAAaA,CAAA,EAAG;IACd,OAAO;MACLD,GAAG,EAAE;IACP,CAAC;EACH;EAEAE,MAAMA,CAAA,EAAG;IAAA,IAAAC,IAAA,QAAAC,OAAA;MAAAC,KAAA;IACP,MAAMC,YAAY,GAAGC,aAAa,CAACC,KAAK;IACxC,MAAMC,kBAAkB,GAAGjB,IAAI;IAC/B,MAAM;MAAEkB,QAAQ;MAAEC,MAAM;MAAEC,OAAO;MAAEC,QAAQ;MAAEC,OAAO;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACX,OAAO;IAE5E,OAAAC,KAAA,GAAOlB,OAAO,CAACwB,MAAM,CAAC,eACpBlB,KAAA,CAAAuB,aAAA,CAActB,WAAW,EAAAuB,YAAA;MAAA,gBAAgBJ,QAAQ,IAAID;IAAO,GAAAT,IAAA,GACzDf,iBAAiB,CAACsB,QAAQ,EAAEH,aAAa,CAACW,IAAI,EAAEX,aAAa,CAACC,KAAK,EAAEO,KAAK,CAAC,EAC3E,CAACD,OAAO,IAAIF,OAAO,kBAClBnB,KAAA,CAAAuB,aAAA,CAACV,YAAY,EAAAD,KAAA,CAAAc,EAAA,sBACVP,OAAO,gBAAGnB,KAAA,CAAAuB,aAAA,CAACP,kBAAkB,EAAAJ,KAAA,CAAAc,EAAA;MAAA,QAAM,IAAI;MAAA,SAAQ;IAAK,EAAG,CAAC,gBAAG1B,KAAA,CAAAuB,aAAA,CAACzB,WAAW,EAAAc,KAAA,CAAAc,EAAA,mBAAE,CAC9D,CAEZ,CAAC;EAEX;AACF;AAACC,eAAA,CAhDKtB,iBAAiB,iBACA,eAAe;AAAAsB,eAAA,CADhCtB,iBAAiB,WAENH,KAAK;AAAAyB,eAAA,CAFhBtB,iBAAiB,aAGJ,CACfR,kBAAkB,CAAC;EACjB+B,QAAQ,EAAE,kCAAkC;EAC5CC,QAAQ,EAAE,KAAK;EACfC,GAAG,EAAEC,MAAM,CAACC,QAAQ;EACpBC,IAAI,EAAE;AACR,CAAC,CAAC,EACFrC,mBAAmB,CAAC;EAClBsC,YAAY,EAAE,CAAC,OAAO,CAAC;EACvBC,UAAU,EAAE,CAAC,OAAO;AACtB,CAAC,CAAC,CACH;AAAAR,eAAA,CAdGtB,iBAAiB,kBAgBC;EACpBgB,OAAO,EAAE;AACX,CAAC;AAgCH,MAAMP,aAAa,GAAGvB,eAAe,CACnCc,iBAAiB,EACjB;EACEoB,IAAI,EAAExB,WAAW,CAACwB,IAAI;EACtBV,KAAK,EAAEd,WAAW,CAACc;AACrB,CAAC,EACD;EACEqB,MAAM,EAAEnC;AACV,CACF,CAAC;AAED,eAAea,aAAa","ignoreList":[]}
|
package/lib/es6/LinkTrigger.js
CHANGED
|
@@ -1,119 +1,47 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { sstyled as _sstyled } from "@semcore/core";
|
|
3
|
-
import { assignProps as _assignProps3 } from "@semcore/core";
|
|
4
|
-
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
5
2
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
6
|
-
import {
|
|
7
|
-
import { createComponent, Component, Root
|
|
3
|
+
import { ButtonLink } from '@semcore/button';
|
|
4
|
+
import { createComponent, Component, Root } from '@semcore/core';
|
|
8
5
|
import addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';
|
|
9
|
-
import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
|
|
10
6
|
import ChevronDown from '@semcore/icon/ChevronDown/m';
|
|
11
7
|
import Spin from '@semcore/spin';
|
|
12
|
-
import { Text as TextKit } from '@semcore/typography';
|
|
13
8
|
import React from 'react';
|
|
14
|
-
/*!__reshadow-styles__:"./style/link-trigger.shadow.css"*/
|
|
15
|
-
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SLinkTrigger_543t3_gg_{display:inline-flex;align-items:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;vertical-align:middle;font-family:inherit;cursor:pointer;color:var(--intergalactic-text-link, #006dca);background:0 0;transition:color .15s ease-in-out;border:0}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_,.___SLinkTrigger_543t3_gg_:active{color:var(--intergalactic-text-link-hover-active, #044792)}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover{color:var(--intergalactic-text-link-hover-active, #044792)}}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_ .___SText_543t3_gg_,.___SLinkTrigger_543t3_gg_:active .___SText_543t3_gg_{border-color:currentColor}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover .___SText_543t3_gg_{border-color:currentColor}}.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{border-bottom-width:1px;border-bottom-style:solid;border-color:transparent;transition:border-bottom-color .15s ease-in-out;text-overflow:ellipsis;overflow:hidden}.___SLinkTrigger_543t3_gg_.__color_543t3_gg_{color:var(--color_543t3)}@media (hover:hover){.___SLinkTrigger_543t3_gg_.__color_543t3_gg_:hover{filter:brightness(.8)}}.___SLinkTrigger_543t3_gg_.__disabled_543t3_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_543t3_gg_,.___SLinkAddon_543t3_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:var(--intergalactic-spacing-05x, 2px)}.___SAddon_543t3_gg_:not(:only-child):first-child,.___SLinkAddon_543t3_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-1x, 4px)}.___SAddon_543t3_gg_:not(:only-child):last-child,.___SLinkAddon_543t3_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-1x, 4px)}.___SLinkAddon_543t3_gg_{width:16px;height:16px}.___SLinkTrigger_543t3_gg_._size_m_543t3_gg_{font-size:var(--intergalactic-fs-200, 14px)}.___SLinkTrigger_543t3_gg_._size_l_543t3_gg_{font-size:var(--intergalactic-fs-300, 16px)}@media (prefers-reduced-motion){.___SLinkTrigger_543t3_gg_,.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{transition:none}}", /*__inner_css_end__*/"543t3_gg_"),
|
|
16
|
-
/*__reshadow_css_end__*/
|
|
17
|
-
{
|
|
18
|
-
"__SLinkTrigger": "___SLinkTrigger_543t3_gg_",
|
|
19
|
-
"_disabled": "__disabled_543t3_gg_",
|
|
20
|
-
"__SLinkAddon": "___SLinkAddon_543t3_gg_",
|
|
21
|
-
"_size_m": "_size_m_543t3_gg_",
|
|
22
|
-
"_size_l": "_size_l_543t3_gg_",
|
|
23
|
-
"_active": "__active_543t3_gg_",
|
|
24
|
-
"__SText": "___SText_543t3_gg_",
|
|
25
|
-
"_color": "__color_543t3_gg_",
|
|
26
|
-
"--color": "--color_543t3",
|
|
27
|
-
"__SAddon": "___SAddon_543t3_gg_"
|
|
28
|
-
});
|
|
29
9
|
class RootLinkTrigger extends Component {
|
|
30
|
-
|
|
31
|
-
super(...args);
|
|
32
|
-
_defineProperty(this, "triggerRef", /*#__PURE__*/React.createRef());
|
|
33
|
-
}
|
|
34
|
-
getTextProps() {
|
|
10
|
+
getTextProps(props) {
|
|
35
11
|
const {
|
|
36
12
|
placeholder,
|
|
37
13
|
empty
|
|
38
14
|
} = this.asProps;
|
|
15
|
+
const content = empty ? placeholder : props.children;
|
|
39
16
|
return {
|
|
40
|
-
|
|
41
|
-
empty
|
|
42
|
-
triggerRef: this.triggerRef
|
|
17
|
+
'use:children': content,
|
|
18
|
+
empty
|
|
43
19
|
};
|
|
44
20
|
}
|
|
45
21
|
render() {
|
|
46
|
-
var _ref = this.asProps
|
|
47
|
-
|
|
48
|
-
const SLinkTrigger = Box;
|
|
22
|
+
var _ref = this.asProps;
|
|
23
|
+
const SLinkTrigger = ButtonLink;
|
|
49
24
|
const SLinkAddon = LinkTrigger.Addon;
|
|
50
25
|
const {
|
|
51
26
|
Children,
|
|
52
27
|
loading,
|
|
53
|
-
styles,
|
|
54
28
|
empty,
|
|
55
|
-
|
|
56
|
-
resolveColor
|
|
29
|
+
disabled
|
|
57
30
|
} = this.asProps;
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
"ref": this.triggerRef,
|
|
65
|
-
"use:color": color
|
|
66
|
-
}, _ref)
|
|
67
|
-
}), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /*#__PURE__*/React.createElement(SLinkAddon, _ref4.cn("SLinkAddon", {}), loading ? /*#__PURE__*/React.createElement(Spin, _ref4.cn("Spin", {
|
|
68
|
-
"size": 'xs',
|
|
69
|
-
"theme": 'currentColor'
|
|
70
|
-
})) : /*#__PURE__*/React.createElement(ChevronDown, _ref4.cn("ChevronDown", {}))));
|
|
31
|
+
return /*#__PURE__*/React.createElement(SLinkTrigger, _assignProps({
|
|
32
|
+
"use:disabled": disabled || loading
|
|
33
|
+
}, _ref), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /*#__PURE__*/React.createElement(SLinkAddon, null, loading ? /*#__PURE__*/React.createElement(Spin, {
|
|
34
|
+
size: "xs",
|
|
35
|
+
theme: "currentColor"
|
|
36
|
+
}) : /*#__PURE__*/React.createElement(ChevronDown, null)));
|
|
71
37
|
}
|
|
72
38
|
}
|
|
73
39
|
_defineProperty(RootLinkTrigger, "displayName", 'LinkTrigger');
|
|
74
|
-
_defineProperty(RootLinkTrigger, "style", style);
|
|
75
|
-
_defineProperty(RootLinkTrigger, "defaultProps", {
|
|
76
|
-
size: 'm'
|
|
77
|
-
});
|
|
78
|
-
_defineProperty(RootLinkTrigger, "enhance", [resolveColorEnhance()]);
|
|
79
|
-
function Text(props) {
|
|
80
|
-
var _ref2 = arguments[0],
|
|
81
|
-
_ref5;
|
|
82
|
-
const SText = TextKit;
|
|
83
|
-
const textRef = React.useRef();
|
|
84
|
-
const {
|
|
85
|
-
children,
|
|
86
|
-
styles,
|
|
87
|
-
empty,
|
|
88
|
-
placeholder,
|
|
89
|
-
triggerRef,
|
|
90
|
-
ellipsis = false,
|
|
91
|
-
hintProps
|
|
92
|
-
} = props;
|
|
93
|
-
const content = empty ? placeholder : children;
|
|
94
|
-
return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SText, _ref5.cn("SText", {
|
|
95
|
-
..._assignProps2({
|
|
96
|
-
"display-placeholder": empty,
|
|
97
|
-
"ref": textRef,
|
|
98
|
-
"ellipsis": ellipsis,
|
|
99
|
-
"hintProps": {
|
|
100
|
-
...hintProps,
|
|
101
|
-
triggerRef
|
|
102
|
-
}
|
|
103
|
-
}, _ref2)
|
|
104
|
-
}), content));
|
|
105
|
-
}
|
|
106
|
-
function Addon(props) {
|
|
107
|
-
var _ref3 = arguments[0],
|
|
108
|
-
_ref6;
|
|
109
|
-
const SAddon = Box;
|
|
110
|
-
return _ref6 = sstyled(props.styles), /*#__PURE__*/React.createElement(SAddon, _ref6.cn("SAddon", {
|
|
111
|
-
..._assignProps3({}, _ref3)
|
|
112
|
-
}));
|
|
113
|
-
}
|
|
114
40
|
const LinkTrigger = createComponent(RootLinkTrigger, {
|
|
115
|
-
Text,
|
|
116
|
-
Addon
|
|
41
|
+
Text: ButtonLink.Text,
|
|
42
|
+
Addon: ButtonLink.Addon
|
|
43
|
+
}, {
|
|
44
|
+
parent: ButtonLink
|
|
117
45
|
});
|
|
118
46
|
export default LinkTrigger;
|
|
119
47
|
//# sourceMappingURL=LinkTrigger.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkTrigger.js","names":["
|
|
1
|
+
{"version":3,"file":"LinkTrigger.js","names":["ButtonLink","createComponent","Component","Root","addonTextChildren","ChevronDown","Spin","React","RootLinkTrigger","getTextProps","props","placeholder","empty","asProps","content","children","render","_ref","SLinkTrigger","SLinkAddon","LinkTrigger","Addon","Children","loading","disabled","createElement","_assignProps","Text","size","theme","_defineProperty","parent"],"sources":["../../src/LinkTrigger.jsx"],"sourcesContent":["import { ButtonLink } from '@semcore/button';\nimport { createComponent, Component, Root } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport React from 'react';\n\nclass RootLinkTrigger extends Component {\n static displayName = 'LinkTrigger';\n\n getTextProps(props) {\n const { placeholder, empty } = this.asProps;\n const content = empty ? placeholder : props.children;\n\n return {\n 'use:children': content,\n empty,\n };\n }\n\n render() {\n const SLinkTrigger = Root;\n const SLinkAddon = LinkTrigger.Addon;\n const { Children, loading, empty, disabled } = this.asProps;\n\n return (\n <SLinkTrigger\n render={ButtonLink}\n use:disabled={disabled || loading}\n >\n {addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty)}\n <SLinkAddon>\n {loading ? <Spin size='xs' theme='currentColor' /> : <ChevronDown />}\n </SLinkAddon>\n </SLinkTrigger>\n );\n }\n}\n\nconst LinkTrigger = createComponent(RootLinkTrigger, {\n Text: ButtonLink.Text,\n Addon: ButtonLink.Addon,\n}, {\n parent: ButtonLink,\n});\n\nexport default LinkTrigger;\n"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,eAAe,EAAEC,SAAS,EAAEC,IAAI,QAAQ,eAAe;AAChE,OAAOC,iBAAiB,MAAM,2CAA2C;AACzE,OAAOC,WAAW,MAAM,6BAA6B;AACrD,OAAOC,IAAI,MAAM,eAAe;AAChC,OAAOC,KAAK,MAAM,OAAO;AAEzB,MAAMC,eAAe,SAASN,SAAS,CAAC;EAGtCO,YAAYA,CAACC,KAAK,EAAE;IAClB,MAAM;MAAEC,WAAW;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACC,OAAO;IAC3C,MAAMC,OAAO,GAAGF,KAAK,GAAGD,WAAW,GAAGD,KAAK,CAACK,QAAQ;IAEpD,OAAO;MACL,cAAc,EAAED,OAAO;MACvBF;IACF,CAAC;EACH;EAEAI,MAAMA,CAAA,EAAG;IAAA,IAAAC,IAAA,QAAAJ,OAAA;IACP,MAAMK,YAAY,GAMNlB,UAAU;IALtB,MAAMmB,UAAU,GAAGC,WAAW,CAACC,KAAK;IACpC,MAAM;MAAEC,QAAQ;MAAEC,OAAO;MAAEX,KAAK;MAAEY;IAAS,CAAC,GAAG,IAAI,CAACX,OAAO;IAE3D,oBACEN,KAAA,CAAAkB,aAAA,CAACP,YAAY,EAAAQ,YAAA;MAAA,gBAEGF,QAAQ,IAAID;IAAO,GAAAN,IAAA,GAEhCb,iBAAiB,CAACkB,QAAQ,EAAEF,WAAW,CAACO,IAAI,EAAEP,WAAW,CAACC,KAAK,EAAET,KAAK,CAAC,eACxEL,KAAA,CAAAkB,aAAA,CAACN,UAAU,QACRI,OAAO,gBAAGhB,KAAA,CAAAkB,aAAA,CAACnB,IAAI;MAACsB,IAAI,EAAC,IAAI;MAACC,KAAK,EAAC;IAAc,CAAE,CAAC,gBAAGtB,KAAA,CAAAkB,aAAA,CAACpB,WAAW,MAAE,CACzD,CACA,CAAC;EAEnB;AACF;AAACyB,eAAA,CA9BKtB,eAAe,iBACE,aAAa;AA+BpC,MAAMY,WAAW,GAAGnB,eAAe,CAACO,eAAe,EAAE;EACnDmB,IAAI,EAAE3B,UAAU,CAAC2B,IAAI;EACrBN,KAAK,EAAErB,UAAU,CAACqB;AACpB,CAAC,EAAE;EACDU,MAAM,EAAE/B;AACV,CAAC,CAAC;AAEF,eAAeoB,WAAW","ignoreList":[]}
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport type { CounterProps } from '@semcore/counter';\nimport type { Text } from '@semcore/typography';\nimport type React from 'react';\n\nexport type BaseTriggerProps = BoxProps &\n NeighborItemProps &\n WithAnimatedSizeEnhanceProps & {\n /**\n * Trigger size\n * @default m\n */\n size?: 'm' | 'l';\n /**\n * Trigger state\n */\n state?: 'normal' | 'valid' | 'invalid';\n /**\n * Sets active state to trigger\n */\n active?: boolean;\n /**\n * Responsible for placeholder displaying\n */\n empty?: boolean;\n /**\n * Placeholder text\n */\n placeholder?: React.ReactNode;\n /**\n * Sets disabled state to trigger\n */\n disabled?: boolean;\n };\n\nexport type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {\n /** Sets the loading state */\n loading?: boolean;\n /**\n * Display the dropdowns chevron icon\n * @default true\n */\n chevron?: boolean;\n};\n\nexport type LinkTriggerProps =
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';\nimport type { ButtonLinkProps, ButtonLink } from '@semcore/button';\nimport type { Intergalactic } from '@semcore/core';\nimport type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';\nimport type { CounterProps } from '@semcore/counter';\nimport type { Text } from '@semcore/typography';\nimport type React from 'react';\n\nexport type BaseTriggerProps = BoxProps &\n NeighborItemProps &\n WithAnimatedSizeEnhanceProps & {\n /**\n * Trigger size\n * @default m\n */\n size?: 'm' | 'l';\n /**\n * Trigger state\n */\n state?: 'normal' | 'valid' | 'invalid';\n /**\n * Sets active state to trigger\n */\n active?: boolean;\n /**\n * Responsible for placeholder displaying\n */\n empty?: boolean;\n /**\n * Placeholder text\n */\n placeholder?: React.ReactNode;\n /**\n * Sets disabled state to trigger\n */\n disabled?: boolean;\n };\n\nexport type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {\n /** Sets the loading state */\n loading?: boolean;\n /**\n * Display the dropdowns chevron icon\n * @default true\n */\n chevron?: boolean;\n};\n\nexport type LinkTriggerProps = ButtonLinkProps & {\n /** Trigger state */\n state?: 'normal' | 'valid' | 'invalid';\n /** Sets the loading state */\n loading?: boolean;\n /** Placeholder text */\n placeholder?: React.ReactNode;\n /** Responsible for placeholder displaying */\n empty?: boolean;\n};\n\nexport type FilterTriggerProps = BaseTriggerProps & {\n /** Click on the filter cleaning cross */\n onClear?: (event: React.SyntheticEvent) => void;\n /** Specifies the locale for i18n support */\n locale?: string;\n /** List of props that will be added to the select inside of filter */\n includeInputProps?: string[];\n /** Normal `ref` prop refers to FilterTrigger wrapper while `triggerRef` refers explicitly to trigger button */\n triggerRef?: React.Ref<HTMLButtonElement>;\n};\n\nexport type FilterTriggerCounterProps = {\n /** Count for render */\n count?: number;\n};\n\ndeclare const BaseTrigger: Intergalactic.Component<'div', BaseTriggerProps> & {\n Text: typeof Text;\n Addon: typeof Box;\n};\n\ndeclare const ButtonTrigger: Intergalactic.Component<'div', ButtonTriggerProps> & {\n Text: typeof BaseTrigger.Text;\n Addon: typeof BaseTrigger.Addon;\n};\n\ndeclare const LinkTrigger: Intergalactic.Component<'div', LinkTriggerProps> & {\n Text: typeof ButtonLink.Text;\n Addon: typeof ButtonLink.Addon;\n};\n\ndeclare const FilterTrigger: Intergalactic.Component<'div', FilterTriggerProps> & {\n Text: typeof BaseTrigger.Text;\n Addon: typeof BaseTrigger.Addon;\n Counter: Intergalactic.Component<'div', CounterProps & FilterTriggerCounterProps>;\n TriggerButton: typeof BaseTrigger;\n ClearButton: typeof BaseTrigger;\n};\n\nexport default BaseTrigger;\nexport { ButtonTrigger, LinkTrigger, FilterTrigger };\n"],"mappings":"","ignoreList":[]}
|
package/lib/esm/BaseTrigger.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
2
|
+
import { sstyled, createComponent, Component, assignProps } from "@semcore/core";
|
|
3
3
|
import { NeighborLocation, Box, InvalidStateBox } from "@semcore/base-components";
|
|
4
4
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
5
5
|
import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
|
|
@@ -110,8 +110,7 @@ function Text(props) {
|
|
|
110
110
|
empty,
|
|
111
111
|
placeholder,
|
|
112
112
|
triggerRef,
|
|
113
|
-
ellipsis = false
|
|
114
|
-
hintProps
|
|
113
|
+
ellipsis = false
|
|
115
114
|
} = props;
|
|
116
115
|
const content = empty ? placeholder : children;
|
|
117
116
|
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", {
|
|
@@ -120,10 +119,7 @@ function Text(props) {
|
|
|
120
119
|
"aria-hidden": empty,
|
|
121
120
|
"ref": textRef,
|
|
122
121
|
"ellipsis": ellipsis,
|
|
123
|
-
"
|
|
124
|
-
...hintProps,
|
|
125
|
-
triggerRef
|
|
126
|
-
}
|
|
122
|
+
"hint:triggerRef": triggerRef
|
|
127
123
|
}, _ref2)
|
|
128
124
|
}), content));
|
|
129
125
|
}
|
|
@@ -40,11 +40,12 @@ class RootButtonTrigger extends Component {
|
|
|
40
40
|
Children,
|
|
41
41
|
styles,
|
|
42
42
|
loading,
|
|
43
|
+
disabled,
|
|
43
44
|
chevron,
|
|
44
45
|
empty
|
|
45
46
|
} = this.asProps;
|
|
46
47
|
return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(BaseTrigger, assignProps({
|
|
47
|
-
"
|
|
48
|
+
"use:disabled": disabled || loading
|
|
48
49
|
}, _ref), addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon, empty), (chevron || loading) && /* @__PURE__ */ React.createElement(SButtonAddon, _ref2.cn("SButtonAddon", {}), loading ? /* @__PURE__ */ React.createElement(SButtonTriggerSpin, _ref2.cn("SButtonTriggerSpin", {
|
|
49
50
|
"size": "xs",
|
|
50
51
|
"theme": false
|
package/lib/esm/LinkTrigger.mjs
CHANGED
|
@@ -1,119 +1,46 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import { createComponent, Component,
|
|
3
|
-
import {
|
|
2
|
+
import { createComponent, Component, assignProps } from "@semcore/core";
|
|
3
|
+
import { ButtonLink } from "@semcore/button";
|
|
4
4
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
5
|
-
import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
|
|
6
5
|
import ChevronDown from "@semcore/icon/ChevronDown/m";
|
|
7
6
|
import Spin from "@semcore/spin";
|
|
8
|
-
import { Text as Text$1 } from "@semcore/typography";
|
|
9
7
|
import React from "react";
|
|
10
|
-
/*!__reshadow-styles__:"./style/link-trigger.shadow.css"*/
|
|
11
|
-
const style = (
|
|
12
|
-
/*__reshadow_css_start__*/
|
|
13
|
-
(sstyled.insert(
|
|
14
|
-
/*__inner_css_start__*/
|
|
15
|
-
".___SLinkTrigger_543t3_gg_{display:inline-flex;align-items:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;vertical-align:middle;font-family:inherit;cursor:pointer;color:var(--intergalactic-text-link, #006dca);background:0 0;transition:color .15s ease-in-out;border:0}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_,.___SLinkTrigger_543t3_gg_:active{color:var(--intergalactic-text-link-hover-active, #044792)}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover{color:var(--intergalactic-text-link-hover-active, #044792)}}.___SLinkTrigger_543t3_gg_.__active_543t3_gg_ .___SText_543t3_gg_,.___SLinkTrigger_543t3_gg_:active .___SText_543t3_gg_{border-color:currentColor}@media (hover:hover){.___SLinkTrigger_543t3_gg_:hover .___SText_543t3_gg_{border-color:currentColor}}.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{border-bottom-width:1px;border-bottom-style:solid;border-color:transparent;transition:border-bottom-color .15s ease-in-out;text-overflow:ellipsis;overflow:hidden}.___SLinkTrigger_543t3_gg_.__color_543t3_gg_{color:var(--color_543t3)}@media (hover:hover){.___SLinkTrigger_543t3_gg_.__color_543t3_gg_:hover{filter:brightness(.8)}}.___SLinkTrigger_543t3_gg_.__disabled_543t3_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_543t3_gg_,.___SLinkAddon_543t3_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:var(--intergalactic-spacing-05x, 2px)}.___SAddon_543t3_gg_:not(:only-child):first-child,.___SLinkAddon_543t3_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-1x, 4px)}.___SAddon_543t3_gg_:not(:only-child):last-child,.___SLinkAddon_543t3_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-1x, 4px)}.___SLinkAddon_543t3_gg_{width:16px;height:16px}.___SLinkTrigger_543t3_gg_._size_m_543t3_gg_{font-size:var(--intergalactic-fs-200, 14px)}.___SLinkTrigger_543t3_gg_._size_l_543t3_gg_{font-size:var(--intergalactic-fs-300, 16px)}@media (prefers-reduced-motion){.___SLinkTrigger_543t3_gg_,.___SLinkTrigger_543t3_gg_ .___SText_543t3_gg_{transition:none}}",
|
|
16
|
-
/*__inner_css_end__*/
|
|
17
|
-
"543t3_gg_"
|
|
18
|
-
), /*__reshadow_css_end__*/
|
|
19
|
-
{
|
|
20
|
-
"__SLinkTrigger": "___SLinkTrigger_543t3_gg_",
|
|
21
|
-
"_disabled": "__disabled_543t3_gg_",
|
|
22
|
-
"__SLinkAddon": "___SLinkAddon_543t3_gg_",
|
|
23
|
-
"_size_m": "_size_m_543t3_gg_",
|
|
24
|
-
"_size_l": "_size_l_543t3_gg_",
|
|
25
|
-
"_active": "__active_543t3_gg_",
|
|
26
|
-
"__SText": "___SText_543t3_gg_",
|
|
27
|
-
"_color": "__color_543t3_gg_",
|
|
28
|
-
"--color": "--color_543t3",
|
|
29
|
-
"__SAddon": "___SAddon_543t3_gg_"
|
|
30
|
-
})
|
|
31
|
-
);
|
|
32
8
|
class RootLinkTrigger extends Component {
|
|
33
|
-
|
|
34
|
-
super(...args);
|
|
35
|
-
_defineProperty(this, "triggerRef", /* @__PURE__ */ React.createRef());
|
|
36
|
-
}
|
|
37
|
-
getTextProps() {
|
|
9
|
+
getTextProps(props) {
|
|
38
10
|
const {
|
|
39
11
|
placeholder,
|
|
40
12
|
empty
|
|
41
13
|
} = this.asProps;
|
|
14
|
+
const content = empty ? placeholder : props.children;
|
|
42
15
|
return {
|
|
43
|
-
|
|
44
|
-
empty
|
|
45
|
-
triggerRef: this.triggerRef
|
|
16
|
+
"use:children": content,
|
|
17
|
+
empty
|
|
46
18
|
};
|
|
47
19
|
}
|
|
48
20
|
render() {
|
|
49
|
-
var _ref = this.asProps
|
|
50
|
-
const SLinkTrigger =
|
|
21
|
+
var _ref = this.asProps;
|
|
22
|
+
const SLinkTrigger = ButtonLink;
|
|
51
23
|
const SLinkAddon = LinkTrigger.Addon;
|
|
52
24
|
const {
|
|
53
25
|
Children,
|
|
54
26
|
loading,
|
|
55
|
-
styles,
|
|
56
27
|
empty,
|
|
57
|
-
|
|
58
|
-
resolveColor
|
|
28
|
+
disabled
|
|
59
29
|
} = this.asProps;
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
"ref": this.triggerRef,
|
|
67
|
-
"use:color": color
|
|
68
|
-
}, _ref)
|
|
69
|
-
}), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /* @__PURE__ */ React.createElement(SLinkAddon, _ref4.cn("SLinkAddon", {}), loading ? /* @__PURE__ */ React.createElement(Spin, _ref4.cn("Spin", {
|
|
70
|
-
"size": "xs",
|
|
71
|
-
"theme": "currentColor"
|
|
72
|
-
})) : /* @__PURE__ */ React.createElement(ChevronDown, _ref4.cn("ChevronDown", {}))));
|
|
30
|
+
return /* @__PURE__ */ React.createElement(SLinkTrigger, assignProps({
|
|
31
|
+
"use:disabled": disabled || loading
|
|
32
|
+
}, _ref), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /* @__PURE__ */ React.createElement(SLinkAddon, null, loading ? /* @__PURE__ */ React.createElement(Spin, {
|
|
33
|
+
size: "xs",
|
|
34
|
+
theme: "currentColor"
|
|
35
|
+
}) : /* @__PURE__ */ React.createElement(ChevronDown, null)));
|
|
73
36
|
}
|
|
74
37
|
}
|
|
75
38
|
_defineProperty(RootLinkTrigger, "displayName", "LinkTrigger");
|
|
76
|
-
_defineProperty(RootLinkTrigger, "style", style);
|
|
77
|
-
_defineProperty(RootLinkTrigger, "defaultProps", {
|
|
78
|
-
size: "m"
|
|
79
|
-
});
|
|
80
|
-
_defineProperty(RootLinkTrigger, "enhance", [resolveColorEnhance()]);
|
|
81
|
-
function Text(props) {
|
|
82
|
-
var _ref2 = arguments[0], _ref5;
|
|
83
|
-
const SText = Text$1;
|
|
84
|
-
const textRef = React.useRef();
|
|
85
|
-
const {
|
|
86
|
-
children,
|
|
87
|
-
styles,
|
|
88
|
-
empty,
|
|
89
|
-
placeholder,
|
|
90
|
-
triggerRef,
|
|
91
|
-
ellipsis = false,
|
|
92
|
-
hintProps
|
|
93
|
-
} = props;
|
|
94
|
-
const content = empty ? placeholder : children;
|
|
95
|
-
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", {
|
|
96
|
-
...assignProps({
|
|
97
|
-
"display-placeholder": empty,
|
|
98
|
-
"ref": textRef,
|
|
99
|
-
"ellipsis": ellipsis,
|
|
100
|
-
"hintProps": {
|
|
101
|
-
...hintProps,
|
|
102
|
-
triggerRef
|
|
103
|
-
}
|
|
104
|
-
}, _ref2)
|
|
105
|
-
}), content));
|
|
106
|
-
}
|
|
107
|
-
function Addon(props) {
|
|
108
|
-
var _ref3 = arguments[0], _ref6;
|
|
109
|
-
const SAddon = Box;
|
|
110
|
-
return _ref6 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SAddon, _ref6.cn("SAddon", {
|
|
111
|
-
...assignProps({}, _ref3)
|
|
112
|
-
}));
|
|
113
|
-
}
|
|
114
39
|
const LinkTrigger = createComponent(RootLinkTrigger, {
|
|
115
|
-
Text,
|
|
116
|
-
Addon
|
|
40
|
+
Text: ButtonLink.Text,
|
|
41
|
+
Addon: ButtonLink.Addon
|
|
42
|
+
}, {
|
|
43
|
+
parent: ButtonLink
|
|
117
44
|
});
|
|
118
45
|
export {
|
|
119
46
|
LinkTrigger as default
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';
|
|
2
|
+
import type { ButtonLinkProps, ButtonLink } from '@semcore/button';
|
|
2
3
|
import type { Intergalactic } from '@semcore/core';
|
|
3
4
|
import type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';
|
|
4
5
|
import type { CounterProps } from '@semcore/counter';
|
|
@@ -45,11 +46,15 @@ export type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {
|
|
|
45
46
|
chevron?: boolean;
|
|
46
47
|
};
|
|
47
48
|
|
|
48
|
-
export type LinkTriggerProps =
|
|
49
|
+
export type LinkTriggerProps = ButtonLinkProps & {
|
|
50
|
+
/** Trigger state */
|
|
51
|
+
state?: 'normal' | 'valid' | 'invalid';
|
|
49
52
|
/** Sets the loading state */
|
|
50
53
|
loading?: boolean;
|
|
51
|
-
/**
|
|
52
|
-
|
|
54
|
+
/** Placeholder text */
|
|
55
|
+
placeholder?: React.ReactNode;
|
|
56
|
+
/** Responsible for placeholder displaying */
|
|
57
|
+
empty?: boolean;
|
|
53
58
|
};
|
|
54
59
|
|
|
55
60
|
export type FilterTriggerProps = BaseTriggerProps & {
|
|
@@ -79,8 +84,8 @@ declare const ButtonTrigger: Intergalactic.Component<'div', ButtonTriggerProps>
|
|
|
79
84
|
};
|
|
80
85
|
|
|
81
86
|
declare const LinkTrigger: Intergalactic.Component<'div', LinkTriggerProps> & {
|
|
82
|
-
Text: typeof
|
|
83
|
-
Addon: typeof
|
|
87
|
+
Text: typeof ButtonLink.Text;
|
|
88
|
+
Addon: typeof ButtonLink.Addon;
|
|
84
89
|
};
|
|
85
90
|
|
|
86
91
|
declare const FilterTrigger: Intergalactic.Component<'div', FilterTriggerProps> & {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/base-trigger",
|
|
3
3
|
"description": "Semrush BaseTrigger Component",
|
|
4
|
-
"version": "17.0.0-prerelease.
|
|
4
|
+
"version": "17.0.0-prerelease.31",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,10 +14,11 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/counter": "^17.0.0-prerelease.
|
|
18
|
-
"@semcore/spin": "^17.0.0-prerelease.
|
|
19
|
-
"@semcore/tooltip": "^17.0.0-prerelease.
|
|
20
|
-
"@semcore/typography": "^17.0.0-prerelease.
|
|
17
|
+
"@semcore/counter": "^17.0.0-prerelease.31",
|
|
18
|
+
"@semcore/spin": "^17.0.0-prerelease.31",
|
|
19
|
+
"@semcore/tooltip": "^17.0.0-prerelease.31",
|
|
20
|
+
"@semcore/typography": "^17.0.0-prerelease.31",
|
|
21
|
+
"@semcore/button": "^17.0.0-prerelease.31"
|
|
21
22
|
},
|
|
22
23
|
"peerDependencies": {
|
|
23
24
|
"@semcore/base-components": "^17.0.0 || ^17.0.0-0",
|
|
@@ -29,11 +30,11 @@
|
|
|
29
30
|
"directory": "semcore/base-trigger"
|
|
30
31
|
},
|
|
31
32
|
"devDependencies": {
|
|
32
|
-
"@semcore/core": "17.0.0-prerelease.
|
|
33
|
+
"@semcore/core": "17.0.0-prerelease.31",
|
|
34
|
+
"@semcore/base-components": "17.0.0-prerelease.31",
|
|
33
35
|
"@semcore/testing-utils": "1.0.0",
|
|
34
|
-
"@semcore/
|
|
35
|
-
"@semcore/
|
|
36
|
-
"@semcore/icon": "16.7.2-prerelease.29"
|
|
36
|
+
"@semcore/tooltip": "17.0.0-prerelease.31",
|
|
37
|
+
"@semcore/icon": "16.7.2-prerelease.31"
|
|
37
38
|
},
|
|
38
39
|
"scripts": {
|
|
39
40
|
"build": "pnpm semcore-builder --source=js && pnpm vite build"
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
SLinkTrigger {
|
|
2
|
-
display: inline-flex;
|
|
3
|
-
align-items: center;
|
|
4
|
-
line-height: normal;
|
|
5
|
-
position: relative;
|
|
6
|
-
touch-action: manipulation;
|
|
7
|
-
white-space: nowrap;
|
|
8
|
-
user-select: none;
|
|
9
|
-
box-sizing: border-box;
|
|
10
|
-
padding: 0;
|
|
11
|
-
margin: 0;
|
|
12
|
-
text-decoration: none;
|
|
13
|
-
-webkit-tap-highlight-color: transparent;
|
|
14
|
-
overflow: visible;
|
|
15
|
-
outline: 0;
|
|
16
|
-
vertical-align: middle;
|
|
17
|
-
font-family: inherit;
|
|
18
|
-
cursor: pointer;
|
|
19
|
-
color: var(--intergalactic-text-link, #006dca);
|
|
20
|
-
background: none;
|
|
21
|
-
transition: color 0.15s ease-in-out;
|
|
22
|
-
border: 0;
|
|
23
|
-
|
|
24
|
-
&[active],
|
|
25
|
-
&:hover,
|
|
26
|
-
&:active {
|
|
27
|
-
color: var(--intergalactic-text-link-hover-active, #044792);
|
|
28
|
-
|
|
29
|
-
& SText {
|
|
30
|
-
border-color: currentColor;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
& SText {
|
|
35
|
-
border-bottom-width: 1px;
|
|
36
|
-
border-bottom-style: solid;
|
|
37
|
-
border-color: transparent;
|
|
38
|
-
transition: border-bottom-color 0.15s ease-in-out;
|
|
39
|
-
text-overflow: ellipsis;
|
|
40
|
-
overflow: hidden;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
SLinkTrigger[color] {
|
|
45
|
-
color: var(--color);
|
|
46
|
-
|
|
47
|
-
&:hover {
|
|
48
|
-
filter: brightness(0.8);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
SLinkTrigger[disabled] {
|
|
53
|
-
opacity: var(--intergalactic-disabled-opacity, 0.3);
|
|
54
|
-
cursor: default;
|
|
55
|
-
pointer-events: none;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
SAddon,
|
|
59
|
-
SLinkAddon {
|
|
60
|
-
display: inline-flex;
|
|
61
|
-
align-items: center;
|
|
62
|
-
justify-content: center;
|
|
63
|
-
flex-shrink: 0;
|
|
64
|
-
margin-bottom: var(--intergalactic-spacing-05x, 2px);
|
|
65
|
-
|
|
66
|
-
&:not(:only-child):first-child {
|
|
67
|
-
margin-right: var(--intergalactic-spacing-1x, 4px);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
&:not(:only-child):last-child {
|
|
71
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
SLinkAddon {
|
|
76
|
-
width: 16px;
|
|
77
|
-
height: 16px;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
SLinkTrigger[size='m'] {
|
|
81
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
SLinkTrigger[size='l'] {
|
|
85
|
-
font-size: var(--intergalactic-fs-300, 16px);
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
@media (prefers-reduced-motion) {
|
|
89
|
-
SLinkTrigger {
|
|
90
|
-
transition: none;
|
|
91
|
-
|
|
92
|
-
& SText {
|
|
93
|
-
transition: none;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
}
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
SLinkTrigger {
|
|
2
|
-
display: inline-flex;
|
|
3
|
-
align-items: center;
|
|
4
|
-
line-height: normal;
|
|
5
|
-
position: relative;
|
|
6
|
-
touch-action: manipulation;
|
|
7
|
-
white-space: nowrap;
|
|
8
|
-
user-select: none;
|
|
9
|
-
box-sizing: border-box;
|
|
10
|
-
padding: 0;
|
|
11
|
-
margin: 0;
|
|
12
|
-
text-decoration: none;
|
|
13
|
-
-webkit-tap-highlight-color: transparent;
|
|
14
|
-
overflow: visible;
|
|
15
|
-
outline: 0;
|
|
16
|
-
vertical-align: middle;
|
|
17
|
-
font-family: inherit;
|
|
18
|
-
cursor: pointer;
|
|
19
|
-
color: var(--intergalactic-text-link, #006dca);
|
|
20
|
-
background: none;
|
|
21
|
-
transition: color 0.15s ease-in-out;
|
|
22
|
-
border: 0;
|
|
23
|
-
|
|
24
|
-
&[active],
|
|
25
|
-
&:hover,
|
|
26
|
-
&:active {
|
|
27
|
-
color: var(--intergalactic-text-link-hover-active, #044792);
|
|
28
|
-
|
|
29
|
-
& SText {
|
|
30
|
-
border-color: currentColor;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
& SText {
|
|
35
|
-
border-bottom-width: 1px;
|
|
36
|
-
border-bottom-style: solid;
|
|
37
|
-
border-color: transparent;
|
|
38
|
-
transition: border-bottom-color 0.15s ease-in-out;
|
|
39
|
-
text-overflow: ellipsis;
|
|
40
|
-
overflow: hidden;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
SLinkTrigger[color] {
|
|
45
|
-
color: var(--color);
|
|
46
|
-
|
|
47
|
-
&:hover {
|
|
48
|
-
filter: brightness(0.8);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
SLinkTrigger[disabled] {
|
|
53
|
-
opacity: var(--intergalactic-disabled-opacity, 0.3);
|
|
54
|
-
cursor: default;
|
|
55
|
-
pointer-events: none;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
SAddon,
|
|
59
|
-
SLinkAddon {
|
|
60
|
-
display: inline-flex;
|
|
61
|
-
align-items: center;
|
|
62
|
-
justify-content: center;
|
|
63
|
-
flex-shrink: 0;
|
|
64
|
-
margin-bottom: var(--intergalactic-spacing-05x, 2px);
|
|
65
|
-
|
|
66
|
-
&:not(:only-child):first-child {
|
|
67
|
-
margin-right: var(--intergalactic-spacing-1x, 4px);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
&:not(:only-child):last-child {
|
|
71
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
SLinkAddon {
|
|
76
|
-
width: 16px;
|
|
77
|
-
height: 16px;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
SLinkTrigger[size='m'] {
|
|
81
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
SLinkTrigger[size='l'] {
|
|
85
|
-
font-size: var(--intergalactic-fs-300, 16px);
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
@media (prefers-reduced-motion) {
|
|
89
|
-
SLinkTrigger {
|
|
90
|
-
transition: none;
|
|
91
|
-
|
|
92
|
-
& SText {
|
|
93
|
-
transition: none;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
}
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
SLinkTrigger {
|
|
2
|
-
display: inline-flex;
|
|
3
|
-
align-items: center;
|
|
4
|
-
line-height: normal;
|
|
5
|
-
position: relative;
|
|
6
|
-
touch-action: manipulation;
|
|
7
|
-
white-space: nowrap;
|
|
8
|
-
user-select: none;
|
|
9
|
-
box-sizing: border-box;
|
|
10
|
-
padding: 0;
|
|
11
|
-
margin: 0;
|
|
12
|
-
text-decoration: none;
|
|
13
|
-
-webkit-tap-highlight-color: transparent;
|
|
14
|
-
overflow: visible;
|
|
15
|
-
outline: 0;
|
|
16
|
-
vertical-align: middle;
|
|
17
|
-
font-family: inherit;
|
|
18
|
-
cursor: pointer;
|
|
19
|
-
color: var(--intergalactic-text-link, #006dca);
|
|
20
|
-
background: none;
|
|
21
|
-
transition: color 0.15s ease-in-out;
|
|
22
|
-
border: 0;
|
|
23
|
-
|
|
24
|
-
&[active],
|
|
25
|
-
&:hover,
|
|
26
|
-
&:active {
|
|
27
|
-
color: var(--intergalactic-text-link-hover-active, #044792);
|
|
28
|
-
|
|
29
|
-
& SText {
|
|
30
|
-
border-color: currentColor;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
& SText {
|
|
35
|
-
border-bottom-width: 1px;
|
|
36
|
-
border-bottom-style: solid;
|
|
37
|
-
border-color: transparent;
|
|
38
|
-
transition: border-bottom-color 0.15s ease-in-out;
|
|
39
|
-
text-overflow: ellipsis;
|
|
40
|
-
overflow: hidden;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
SLinkTrigger[color] {
|
|
45
|
-
color: var(--color);
|
|
46
|
-
|
|
47
|
-
&:hover {
|
|
48
|
-
filter: brightness(0.8);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
SLinkTrigger[disabled] {
|
|
53
|
-
opacity: var(--intergalactic-disabled-opacity, 0.3);
|
|
54
|
-
cursor: default;
|
|
55
|
-
pointer-events: none;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
SAddon,
|
|
59
|
-
SLinkAddon {
|
|
60
|
-
display: inline-flex;
|
|
61
|
-
align-items: center;
|
|
62
|
-
justify-content: center;
|
|
63
|
-
flex-shrink: 0;
|
|
64
|
-
margin-bottom: var(--intergalactic-spacing-05x, 2px);
|
|
65
|
-
|
|
66
|
-
&:not(:only-child):first-child {
|
|
67
|
-
margin-right: var(--intergalactic-spacing-1x, 4px);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
&:not(:only-child):last-child {
|
|
71
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
SLinkAddon {
|
|
76
|
-
width: 16px;
|
|
77
|
-
height: 16px;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
SLinkTrigger[size='m'] {
|
|
81
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
SLinkTrigger[size='l'] {
|
|
85
|
-
font-size: var(--intergalactic-fs-300, 16px);
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
@media (prefers-reduced-motion) {
|
|
89
|
-
SLinkTrigger {
|
|
90
|
-
transition: none;
|
|
91
|
-
|
|
92
|
-
& SText {
|
|
93
|
-
transition: none;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
}
|