@semcore/base-trigger 2.6.5 → 3.0.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 +7 -0
- package/lib/cjs/BaseTrigger.js +19 -21
- package/lib/cjs/BaseTrigger.js.map +1 -1
- package/lib/cjs/ButtonTrigger.js +7 -5
- package/lib/cjs/ButtonTrigger.js.map +1 -1
- package/lib/cjs/FilterTrigger.js +16 -18
- package/lib/cjs/FilterTrigger.js.map +1 -1
- package/lib/cjs/LinkTrigger.js +14 -16
- package/lib/cjs/LinkTrigger.js.map +1 -1
- package/lib/cjs/index.d.ts +1 -1
- package/lib/cjs/style/base-trigger.shadow.css +31 -88
- package/lib/cjs/style/button-trigger.shadow.css +4 -0
- package/lib/cjs/style/filter-trigger.shadow.css +19 -32
- package/lib/cjs/style/link-trigger.shadow.css +9 -19
- package/lib/es6/BaseTrigger.js +19 -21
- package/lib/es6/BaseTrigger.js.map +1 -1
- package/lib/es6/ButtonTrigger.js +7 -5
- package/lib/es6/ButtonTrigger.js.map +1 -1
- package/lib/es6/FilterTrigger.js +16 -18
- package/lib/es6/FilterTrigger.js.map +1 -1
- package/lib/es6/LinkTrigger.js +14 -16
- package/lib/es6/LinkTrigger.js.map +1 -1
- package/lib/es6/index.d.ts +1 -1
- package/lib/es6/style/base-trigger.shadow.css +31 -88
- package/lib/es6/style/button-trigger.shadow.css +4 -0
- package/lib/es6/style/filter-trigger.shadow.css +19 -32
- package/lib/es6/style/link-trigger.shadow.css +9 -19
- package/lib/types/index.d.ts +1 -1
- package/package.json +2 -2
- package/src/ButtonTrigger.jsx +2 -1
- package/src/index.d.ts +1 -1
- package/src/style/base-trigger.shadow.css +31 -88
- package/src/style/button-trigger.shadow.css +4 -0
- package/src/style/filter-trigger.shadow.css +19 -32
- package/src/style/link-trigger.shadow.css +9 -19
|
@@ -17,19 +17,16 @@ SLinkTrigger {
|
|
|
17
17
|
overflow: visible;
|
|
18
18
|
outline: 0;
|
|
19
19
|
vertical-align: middle;
|
|
20
|
-
font-family:
|
|
20
|
+
font-family: Inter, sans-serif;
|
|
21
21
|
cursor: pointer;
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
SLinkTrigger {
|
|
25
|
-
color: var(--denim-blue);
|
|
22
|
+
color: var(--blue-500);
|
|
26
23
|
background: none;
|
|
27
24
|
transition: color 0.15s ease-in-out;
|
|
28
25
|
|
|
29
26
|
&[active],
|
|
30
27
|
&:hover,
|
|
31
28
|
&:active {
|
|
32
|
-
color:
|
|
29
|
+
color: var(--blue-600);
|
|
33
30
|
|
|
34
31
|
& SText {
|
|
35
32
|
border-color: currentColor;
|
|
@@ -41,6 +38,7 @@ SLinkTrigger {
|
|
|
41
38
|
border-bottom-style: solid;
|
|
42
39
|
border-color: transparent;
|
|
43
40
|
transition: border-bottom-color 0.15s ease-in-out;
|
|
41
|
+
line-height: var(--lh-200);
|
|
44
42
|
}
|
|
45
43
|
}
|
|
46
44
|
|
|
@@ -59,7 +57,7 @@ SLinkTrigger[disabled] {
|
|
|
59
57
|
}
|
|
60
58
|
|
|
61
59
|
SLinkTrigger[keyboardFocused] {
|
|
62
|
-
box-shadow: var(--
|
|
60
|
+
box-shadow: var(--keyboard-focus);
|
|
63
61
|
z-index: 1;
|
|
64
62
|
}
|
|
65
63
|
|
|
@@ -80,24 +78,16 @@ SLinkAddon {
|
|
|
80
78
|
}
|
|
81
79
|
|
|
82
80
|
SLinkAddon {
|
|
83
|
-
width:
|
|
84
|
-
height:
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
SLinkTrigger[size='s'] {
|
|
88
|
-
font-size: 10px;
|
|
81
|
+
width: 16px;
|
|
82
|
+
height: 16px;
|
|
89
83
|
}
|
|
90
84
|
|
|
91
85
|
SLinkTrigger[size='m'] {
|
|
92
|
-
font-size:
|
|
86
|
+
font-size: var(--fs-200);
|
|
93
87
|
}
|
|
94
88
|
|
|
95
89
|
SLinkTrigger[size='l'] {
|
|
96
|
-
font-size:
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
SLinkTrigger[size='xl'] {
|
|
100
|
-
font-size: 16px;
|
|
90
|
+
font-size: var(--fs-300);
|
|
101
91
|
}
|
|
102
92
|
|
|
103
93
|
@media (prefers-reduced-motion) {
|
package/lib/es6/BaseTrigger.js
CHANGED
|
@@ -30,30 +30,28 @@ var style = (
|
|
|
30
30
|
/*__reshadow_css_start__*/
|
|
31
31
|
_sstyled.insert(
|
|
32
32
|
/*__inner_css_start__*/
|
|
33
|
-
".
|
|
33
|
+
".___SBaseTrigger_5ixsq_gg_{display:inline-block;align-items:center;justify-content:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;outline:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;text-align:center;vertical-align:middle;font-family:Inter,sans-serif;cursor:pointer;background:#fff;font-weight:400;border:1px solid #c4c7cf;color:#191b23}.___SBaseTrigger_5ixsq_gg_::-moz-focus-inner{border:none;padding:0}.___SBaseTrigger_5ixsq_gg_:active,.___SBaseTrigger_5ixsq_gg_:focus,.___SBaseTrigger_5ixsq_gg_:hover{outline:0;text-decoration:none}.___SBaseTrigger_5ixsq_gg_.__keyboardFocused_5ixsq_gg_{border:1px solid #008ff8;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SBaseTrigger_5ixsq_gg_:hover{background-color:rgba(138,142,155,.2)}.___SBaseTrigger_5ixsq_gg_:active,.___SBaseTrigger_5ixsq_gg_.__active_5ixsq_gg_{background-color:rgba(138,142,155,.3)}.___SBaseTrigger_5ixsq_gg_.__disabled_5ixsq_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SBaseTrigger_5ixsq_gg_.__keyboardFocused_5ixsq_gg_{z-index:1}.___SInner_5ixsq_gg_{display:inline-flex;align-items:center;justify-content:center;height:100%;width:100%}.___SText_5ixsq_gg_{display:inline;padding:1px 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.42;flex-grow:1;text-align:left}.___SAddon_5ixsq_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.___SBaseAddon_5ixsq_gg_{width:12px;height:12px}.___SBaseTrigger_5ixsq_gg_._size_m_5ixsq_gg_{min-width:26px;height:28px;border-radius:6px;padding:0 8px;font-size:14px}.___SBaseTrigger_5ixsq_gg_._size_m_5ixsq_gg_ .___SAddon_5ixsq_gg_:not(:only-child):first-child{margin-right:8px}.___SBaseTrigger_5ixsq_gg_._size_m_5ixsq_gg_ .___SAddon_5ixsq_gg_:not(:only-child):last-child{margin-left:8px}.___SBaseTrigger_5ixsq_gg_._size_m_5ixsq_gg_ .___SAddon_5ixsq_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SBaseTrigger_5ixsq_gg_._size_l_5ixsq_gg_{min-width:32px;height:40px;border-radius:6px;padding:0 12px;font-size:16px}.___SBaseTrigger_5ixsq_gg_._size_l_5ixsq_gg_ .___SAddon_5ixsq_gg_:not(:only-child):first-child{margin-right:8px}.___SBaseTrigger_5ixsq_gg_._size_l_5ixsq_gg_ .___SAddon_5ixsq_gg_:not(:only-child):last-child{margin-left:8px}.___SBaseTrigger_5ixsq_gg_._size_l_5ixsq_gg_ .___SAddon_5ixsq_gg_:only-child{margin-left:-4px;margin-right:-4px}.___SBaseTrigger_5ixsq_gg_._neighborLocation_right_5ixsq_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SBaseTrigger_5ixsq_gg_._neighborLocation_both_5ixsq_gg_{border-radius:0;margin-left:-1px}.___SBaseTrigger_5ixsq_gg_._neighborLocation_left_5ixsq_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.___SText_5ixsq_gg_.__placeholder_5ixsq_gg_{color:#a9abb6}.___SBaseTrigger_5ixsq_gg_._state_normal_5ixsq_gg_{border-color:#c4c7cf}.___SBaseTrigger_5ixsq_gg_._state_valid_5ixsq_gg_{border-color:#59ddaa}.___SBaseTrigger_5ixsq_gg_._state_invalid_5ixsq_gg_{border-color:#ffaeb5}.___SBaseTrigger_5ixsq_gg_._state_invalid_5ixsq_gg_.__keyboardFocused_5ixsq_gg_{border-color:#ff622d;box-shadow:0 0 0 3px rgba(255,98,45,.3)}"
|
|
34
34
|
/*__inner_css_end__*/
|
|
35
|
-
, "
|
|
35
|
+
, "1ntsokv_gg_")
|
|
36
36
|
/*__reshadow_css_end__*/
|
|
37
37
|
, {
|
|
38
|
-
"__SBaseTrigger": "
|
|
39
|
-
"_keyboardFocused": "
|
|
40
|
-
"_active": "
|
|
41
|
-
"_disabled": "
|
|
42
|
-
"__SInner": "
|
|
43
|
-
"__SText": "
|
|
44
|
-
"__SAddon": "
|
|
45
|
-
"__SBaseAddon": "
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"_state_valid": "_state_valid_qaw1b_gg_",
|
|
56
|
-
"_state_invalid": "_state_invalid_qaw1b_gg_"
|
|
38
|
+
"__SBaseTrigger": "___SBaseTrigger_5ixsq_gg_",
|
|
39
|
+
"_keyboardFocused": "__keyboardFocused_5ixsq_gg_",
|
|
40
|
+
"_active": "__active_5ixsq_gg_",
|
|
41
|
+
"_disabled": "__disabled_5ixsq_gg_",
|
|
42
|
+
"__SInner": "___SInner_5ixsq_gg_",
|
|
43
|
+
"__SText": "___SText_5ixsq_gg_",
|
|
44
|
+
"__SAddon": "___SAddon_5ixsq_gg_",
|
|
45
|
+
"__SBaseAddon": "___SBaseAddon_5ixsq_gg_",
|
|
46
|
+
"_size_m": "_size_m_5ixsq_gg_",
|
|
47
|
+
"_size_l": "_size_l_5ixsq_gg_",
|
|
48
|
+
"_neighborLocation_right": "_neighborLocation_right_5ixsq_gg_",
|
|
49
|
+
"_neighborLocation_both": "_neighborLocation_both_5ixsq_gg_",
|
|
50
|
+
"_neighborLocation_left": "_neighborLocation_left_5ixsq_gg_",
|
|
51
|
+
"_placeholder": "__placeholder_5ixsq_gg_",
|
|
52
|
+
"_state_normal": "_state_normal_5ixsq_gg_",
|
|
53
|
+
"_state_valid": "_state_valid_5ixsq_gg_",
|
|
54
|
+
"_state_invalid": "_state_invalid_5ixsq_gg_"
|
|
57
55
|
});
|
|
58
56
|
|
|
59
57
|
var RootBaseTrigger = /*#__PURE__*/function (_Component) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/BaseTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","Box","neighborLocationEnhance","keyboardFocusEnhance","addonTextChildren","logger","RootBaseTrigger","asProps","placeholder","empty","SBaseTrigger","SInner","Children","styles","theme","warn","undefined","BaseTrigger","displayName","Text","Addon","style","size","props","SText","children","SAddon"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,SAASC,uBAAT,QAAwC,4BAAxC;AACA,OAAOC,oBAAP,MAAiC,kDAAjC;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,MAAP,MAAmB,2BAAnB
|
|
1
|
+
{"version":3,"sources":["../../src/BaseTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","Box","neighborLocationEnhance","keyboardFocusEnhance","addonTextChildren","logger","RootBaseTrigger","asProps","placeholder","empty","SBaseTrigger","SInner","Children","styles","theme","warn","undefined","BaseTrigger","displayName","Text","Addon","style","size","props","SText","children","SAddon"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,SAASC,uBAAT,QAAwC,4BAAxC;AACA,OAAOC,oBAAP,MAAiC,kDAAjC;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,MAAP,MAAmB,2BAAnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIMC,e;;;;;;;;;;;;;WAQJ,wBAAe;AACb,0BAA+B,KAAKC,OAApC;AAAA,UAAQC,WAAR,iBAAQA,WAAR;AAAA,UAAqBC,KAArB,iBAAqBA,KAArB;AACA,aAAO;AACLD,QAAAA,WAAW,EAAXA,WADK;AAELC,QAAAA,KAAK,EAALA;AAFK,OAAP;AAID;;;WAED,kBAAS;AAAA;AAAA;;AACP,UAAMC,YAAY,GAYMT,GAZxB;AACA,UAAMU,MAAM,GAAG,KAAf;AACA,2BAAoC,KAAKJ,OAAzC;AAAA,UAAQK,QAAR,kBAAQA,QAAR;AAAA,UAAkBC,MAAlB,kBAAkBA,MAAlB;AAAA,UAA0BC,KAA1B,kBAA0BA,KAA1B;AAEAT,MAAAA,MAAM,CAACU,IAAP,CACED,KAAK,KAAKE,SADZ,EAEE,iDAFF,EAGE,KAAKT,OAAL,CAAa,cAAb,KAAgCU,WAAW,CAACC,WAH9C,EALO,CAWP;;AACA,qBAAOlB,OAAO,CAACa,MAAD,CAAd,eACE,oBAAC,YAAD;AAAA,iBAAkCC;AAAlC,+BACE,oBAAC,MAAD,0BAASV,iBAAiB,CAACQ,QAAD,EAAWK,WAAW,CAACE,IAAvB,EAA6BF,WAAW,CAACG,KAAzC,CAA1B,CADF,CADF;AAKD;;;;EAjC2BtB,S;;gBAAxBQ,e,iBACiB,a;;gBADjBA,e,WAEWe,K;;gBAFXf,e,kBAGkB;AACpBgB,EAAAA,IAAI,EAAE;AADc,C;;gBAHlBhB,e,aAMa,CAACH,oBAAoB,EAArB,EAAyBD,uBAAuB,EAAhD,C;;AA8BnB,SAASiB,IAAT,CAAcI,KAAd,EAAqB;AAAA;AAAA;;AACnB,MAAMC,KAAK,GAKMvB,GALjB;AACA,MAAQwB,QAAR,GAAiDF,KAAjD,CAAQE,QAAR;AAAA,MAAkBZ,MAAlB,GAAiDU,KAAjD,CAAkBV,MAAlB;AAAA,MAA0BJ,KAA1B,GAAiDc,KAAjD,CAA0Bd,KAA1B;AAAA,MAAiCD,WAAjC,GAAiDe,KAAjD,CAAiCf,WAAjC;AAEA,iBAAOR,OAAO,CAACa,MAAD,CAAd;AAAA;;AACE;AACA,sBAAC,KAAD;AAAA,uBAAqCJ;AAArC,eACGA,KAAK,GAAGD,WAAH,GAAiBiB,QADzB,CAFF;AAMD;;AAED,SAASL,KAAT,CAAeG,KAAf,EAAsB;AAAA;AAAA;;AACpB,MAAMG,MAAM,GACiCzB,GAD7C;AACA,iBAAOD,OAAO,CAACuB,KAAK,CAACV,MAAP,CAAd,eAA6B,oBAAC,MAAD,kEAA7B;AACD;;AAED,IAAMI,WAAW,GAAGpB,eAAe,CAACS,eAAD,EAAkB;AACnDa,EAAAA,IAAI,EAAJA,IADmD;AAEnDC,EAAAA,KAAK,EAALA;AAFmD,CAAlB,CAAnC;AAKA,eAAeH,WAAf","sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport logger from '@semcore/utils/lib/logger';\n\nimport style from './style/base-trigger.shadow.css';\n\nclass RootBaseTrigger extends Component {\n static displayName = 'BaseTrigger';\n static style = style;\n static defaultProps = {\n size: 'm',\n };\n static enhance = [keyboardFocusEnhance(), neighborLocationEnhance()];\n\n getTextProps() {\n const { placeholder, empty } = this.asProps;\n return {\n placeholder,\n empty,\n };\n }\n\n render() {\n const SBaseTrigger = Root;\n const SInner = 'div';\n const { Children, styles, theme } = this.asProps;\n\n logger.warn(\n theme !== undefined,\n \"The 'theme' property is deprecated, use 'state'\",\n this.asProps['data-ui-name'] || BaseTrigger.displayName,\n );\n\n // TODO: add aria\n return sstyled(styles)(\n <SBaseTrigger render={Box} state={theme}>\n <SInner>{addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon)}</SInner>\n </SBaseTrigger>,\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const { children, styles, empty, placeholder } = props;\n\n return sstyled(styles)(\n /* что бы не ломать обратную совместимость пришлось юзать use */\n <SText render={Box} use:placeholder={empty}>\n {empty ? placeholder : children}\n </SText>,\n );\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nconst BaseTrigger = createComponent(RootBaseTrigger, {\n Text,\n Addon,\n});\n\nexport default BaseTrigger;\n"],"file":"BaseTrigger.js"}
|
package/lib/es6/ButtonTrigger.js
CHANGED
|
@@ -23,12 +23,13 @@ var style = (
|
|
|
23
23
|
/*__reshadow_css_start__*/
|
|
24
24
|
_sstyled.insert(
|
|
25
25
|
/*__inner_css_start__*/
|
|
26
|
-
".
|
|
26
|
+
".___SButtonAddon_1m1cj_gg_{width:12px;height:12px}.___SButtonTriggerSpin_1m1cj_gg_{fill:#6c6e79}"
|
|
27
27
|
/*__inner_css_end__*/
|
|
28
|
-
, "
|
|
28
|
+
, "1x17vum_gg_")
|
|
29
29
|
/*__reshadow_css_end__*/
|
|
30
30
|
, {
|
|
31
|
-
"__SButtonAddon": "
|
|
31
|
+
"__SButtonAddon": "___SButtonAddon_1m1cj_gg_",
|
|
32
|
+
"__SButtonTriggerSpin": "___SButtonTriggerSpin_1m1cj_gg_"
|
|
32
33
|
});
|
|
33
34
|
|
|
34
35
|
var RootButtonTrigger = /*#__PURE__*/function (_Component) {
|
|
@@ -49,13 +50,14 @@ var RootButtonTrigger = /*#__PURE__*/function (_Component) {
|
|
|
49
50
|
_ref2;
|
|
50
51
|
|
|
51
52
|
var SButtonAddon = ButtonTrigger.Addon;
|
|
53
|
+
var SButtonTriggerSpin = Spin;
|
|
52
54
|
var _this$asProps = this.asProps,
|
|
53
55
|
Children = _this$asProps.Children,
|
|
54
56
|
styles = _this$asProps.styles,
|
|
55
57
|
loading = _this$asProps.loading;
|
|
56
|
-
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(BaseTrigger, _assignProps({}, _ref), addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon), /*#__PURE__*/React.createElement(SButtonAddon, _ref2.cn("SButtonAddon", {}), loading ? /*#__PURE__*/React.createElement(
|
|
58
|
+
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(BaseTrigger, _assignProps({}, _ref), addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon), /*#__PURE__*/React.createElement(SButtonAddon, _ref2.cn("SButtonAddon", {}), loading ? /*#__PURE__*/React.createElement(SButtonTriggerSpin, _ref2.cn("SButtonTriggerSpin", {
|
|
57
59
|
"size": "xs",
|
|
58
|
-
"theme":
|
|
60
|
+
"theme": false
|
|
59
61
|
})) : /*#__PURE__*/React.createElement(ChevronDown, _ref2.cn("ChevronDown", {}))));
|
|
60
62
|
}
|
|
61
63
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ButtonTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","addonTextChildren","ChevronDown","BaseTrigger","Spin","RootButtonTrigger","SButtonAddon","ButtonTrigger","Addon","asProps","Children","styles","loading","Text","style","parent"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,IAAP,MAAiB,eAAjB
|
|
1
|
+
{"version":3,"sources":["../../src/ButtonTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","addonTextChildren","ChevronDown","BaseTrigger","Spin","RootButtonTrigger","SButtonAddon","ButtonTrigger","Addon","SButtonTriggerSpin","asProps","Children","styles","loading","Text","style","parent"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,IAAP,MAAiB,eAAjB;;;;;;;;;;;;;;;;IAIMC,iB;;;;;;;;;;;;;WAIJ,kBAAS;AAAA;AAAA;;AACP,UAAMC,YAAY,GAAGC,aAAa,CAACC,KAAnC;AACA,UAAMC,kBAAkB,GAAGL,IAA3B;AACA,0BAAsC,KAAKM,OAA3C;AAAA,UAAQC,QAAR,iBAAQA,QAAR;AAAA,UAAkBC,MAAlB,iBAAkBA,MAAlB;AAAA,UAA0BC,OAA1B,iBAA0BA,OAA1B;AAEA,qBAAOb,OAAO,CAACY,MAAD,CAAd,eACE,oBAAcT,WAAd,0BACGF,iBAAiB,CAACU,QAAD,EAAWJ,aAAa,CAACO,IAAzB,EAA+BP,aAAa,CAACC,KAA7C,CADpB,eAEE,oBAAC,YAAD,gCACGK,OAAO,gBAAG,oBAAC,kBAAD;AAAA,gBAAyB,IAAzB;AAAA,iBAAqC;AAArC,SAAH,gBAAoD,oBAAC,WAAD,8BAD9D,CAFF,CADF;AAQD;;;;EAjB6Bf,S;;gBAA1BO,iB,iBACiB,e;;gBADjBA,iB,WAEWU,K;;AAkBjB,IAAMR,aAAa,GAAGV,eAAe,CACnCQ,iBADmC,EAEnC;AACES,EAAAA,IAAI,EAAEX,WAAW,CAACW,IADpB;AAEEN,EAAAA,KAAK,EAAEL,WAAW,CAACK;AAFrB,CAFmC,EAMnC;AACEQ,EAAAA,MAAM,EAAEb;AADV,CANmC,CAArC;AAWA,eAAeI,aAAf","sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport BaseTrigger from './BaseTrigger';\nimport Spin from '@semcore/spin';\n\nimport style from './style/button-trigger.shadow.css';\n\nclass RootButtonTrigger extends Component {\n static displayName = 'ButtonTrigger';\n static style = style;\n\n render() {\n const SButtonAddon = ButtonTrigger.Addon;\n const SButtonTriggerSpin = Spin;\n const { Children, styles, loading } = this.asProps;\n\n return sstyled(styles)(\n <Root render={BaseTrigger}>\n {addonTextChildren(Children, ButtonTrigger.Text, ButtonTrigger.Addon)}\n <SButtonAddon>\n {loading ? <SButtonTriggerSpin size=\"xs\" theme={false} /> : <ChevronDown />}\n </SButtonAddon>\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"],"file":"ButtonTrigger.js"}
|
package/lib/es6/FilterTrigger.js
CHANGED
|
@@ -33,27 +33,25 @@ var style = (
|
|
|
33
33
|
/*__reshadow_css_start__*/
|
|
34
34
|
_sstyled.insert(
|
|
35
35
|
/*__inner_css_start__*/
|
|
36
|
-
".
|
|
36
|
+
".___SButtonTrigger_1smud_gg_{border:1px solid #c4c7cf;background:#fff;color:#191b23}.___SButtonTrigger_1smud_gg_::-moz-focus-inner{border:none;padding:0}.___SButtonTrigger_1smud_gg_:active,.___SButtonTrigger_1smud_gg_:focus,.___SButtonTrigger_1smud_gg_:hover{outline:0;text-decoration:none}.___SButtonTrigger_1smud_gg_:active,.___SButtonTrigger_1smud_gg_:hover,.___SButtonTrigger_1smud_gg_.__active_1smud_gg_{background-color:rgba(138,142,155,.2)}.___SButtonTrigger_1smud_gg_._size_m_1smud_gg_{min-width:26px;height:28px;border-radius:6px;font-size:14px}.___SButtonTrigger_1smud_gg_._size_l_1smud_gg_{min-width:32px;height:40px;border-radius:6px;font-size:16px}.___SText_1smud_gg_.__placeholder_1smud_gg_{color:#a9abb6}.___SButtonTrigger_1smud_gg_._state_normal_1smud_gg_{border-color:#c4c7cf}.___SButtonTrigger_1smud_gg_._state_valid_1smud_gg_{border-color:#59ddaa}.___SButtonTrigger_1smud_gg_._state_invalid_1smud_gg_{border-color:#ffaeb5}.___SFilterTrigger_1smud_gg_.__selected_1smud_gg_{border-color:#008ff8;background-color:rgba(0,143,248,.2);color:#191b23}.___SFilterTrigger_1smud_gg_.__selected_1smud_gg_:hover,.___SFilterTrigger_1smud_gg_.__selected_1smud_gg_.__active_1smud_gg_{background:rgba(0,143,248,.3)}.___SWrapper_1smud_gg_{display:inline-flex}.___SWrapper_1smud_gg_:focus{outline:none}.___SWrapper_1smud_gg_.__keyboardFocused_1smud_gg_{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SCounter_1smud_gg_{background-color:#008ff8}"
|
|
37
37
|
/*__inner_css_end__*/
|
|
38
|
-
, "
|
|
38
|
+
, "eo2z42_gg_")
|
|
39
39
|
/*__reshadow_css_end__*/
|
|
40
40
|
, {
|
|
41
|
-
"__SButtonTrigger": "
|
|
42
|
-
"_active": "
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"_keyboardFocused": "__keyboardFocused_1le1w_gg_",
|
|
56
|
-
"__SCounter": "___SCounter_1le1w_gg_"
|
|
41
|
+
"__SButtonTrigger": "___SButtonTrigger_1smud_gg_",
|
|
42
|
+
"_active": "__active_1smud_gg_",
|
|
43
|
+
"_size_m": "_size_m_1smud_gg_",
|
|
44
|
+
"_size_l": "_size_l_1smud_gg_",
|
|
45
|
+
"__SText": "___SText_1smud_gg_",
|
|
46
|
+
"_placeholder": "__placeholder_1smud_gg_",
|
|
47
|
+
"_state_normal": "_state_normal_1smud_gg_",
|
|
48
|
+
"_state_valid": "_state_valid_1smud_gg_",
|
|
49
|
+
"_state_invalid": "_state_invalid_1smud_gg_",
|
|
50
|
+
"__SFilterTrigger": "___SFilterTrigger_1smud_gg_",
|
|
51
|
+
"_selected": "__selected_1smud_gg_",
|
|
52
|
+
"__SWrapper": "___SWrapper_1smud_gg_",
|
|
53
|
+
"_keyboardFocused": "__keyboardFocused_1smud_gg_",
|
|
54
|
+
"__SCounter": "___SCounter_1smud_gg_"
|
|
57
55
|
});
|
|
58
56
|
|
|
59
57
|
var RootFilterTrigger = /*#__PURE__*/function (_Component) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/FilterTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","BaseTrigger","Box","NeighborLocation","Dot","Close","ChevronDown","callAllEventHandlers","addonTextChildren","RootFilterTrigger","e","stopPropagation","SWrapper","SFilterTrigger","asProps","Children","styles","empty","onClear","size","placeholder","active","disabled","FilterTrigger","Text","Addon","Counter","handleStopPropagation","style","props","SCounter","parent"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,gBAAP,MAA6B,4BAA7B;AACA,OAAOC,GAAP,MAAgB,cAAhB;AACA,OAAOC,KAAP,MAAkB,uBAAlB;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,SAASC,oBAAT,QAAqC,gCAArC;AACA,OAAOC,iBAAP,MAA8B,sCAA9B
|
|
1
|
+
{"version":3,"sources":["../../src/FilterTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","BaseTrigger","Box","NeighborLocation","Dot","Close","ChevronDown","callAllEventHandlers","addonTextChildren","RootFilterTrigger","e","stopPropagation","SWrapper","SFilterTrigger","asProps","Children","styles","empty","onClear","size","placeholder","active","disabled","FilterTrigger","Text","Addon","Counter","handleStopPropagation","style","props","SCounter","parent"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,gBAAP,MAA6B,4BAA7B;AACA,OAAOC,GAAP,MAAgB,cAAhB;AACA,OAAOC,KAAP,MAAkB,uBAAlB;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,SAASC,oBAAT,QAAqC,gCAArC;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIMC,iB;;;;;;;;;;;;;;;;4EAIoB,UAACC,CAAD;AAAA,aAAOA,CAAC,CAACC,eAAF,EAAP;AAAA,K;;;;;;;WAExB,kBAAS;AAAA;AAAA;;AACP,UAAMC,QAAQ,GAKMV,GALpB;AACA,UAAMW,cAAc,GAAGZ,WAAvB;AACA,0BAAkF,KAAKa,OAAvF;AAAA,UAAQC,QAAR,iBAAQA,QAAR;AAAA,UAAkBC,MAAlB,iBAAkBA,MAAlB;AAAA,UAA0BC,KAA1B,iBAA0BA,KAA1B;AAAA,UAAiCC,OAAjC,iBAAiCA,OAAjC;AAAA,UAA0CC,IAA1C,iBAA0CA,IAA1C;AAAA,UAAgDC,WAAhD,iBAAgDA,WAAhD;AAAA,UAA6DC,MAA7D,iBAA6DA,MAA7D;AAAA,UAAqEC,QAArE,iBAAqEA,QAArE;AAEA,qBAAOtB,OAAO,CAACgB,MAAD,CAAd,eACE,oBAAC,QAAD,gFACE,oBAAC,gBAAD,iDACE,oBAAC,cAAD;AAAA,aACI,MADJ;AAAA,gBAEQG,IAFR;AAAA,uBAGeC,WAHf;AAAA,iBAISH,KAJT;AAAA,oBAKY,CAACA,KALb;AAAA,kBAMUI,MANV;AAAA,oBAOYC;AAPZ,UASGd,iBAAiB,CAACO,QAAD,EAAWQ,aAAa,CAACC,IAAzB,EAA+B,CAC/CD,aAAa,CAACE,KADiC,EAE/CF,aAAa,CAACG,OAFiC,CAA/B,CATpB,EAaGT,KAAK,iBAAI,oBAAC,aAAD,CAAe,KAAf;AAAqB,QAAA,GAAG,EAAEX;AAA1B,QAbZ,CADF,EAgBG,CAACW,KAAD,iBACC,oBAAC,cAAD;AAAA,eACM,QADN;AAAA,gBAEQE,IAFR;AAAA,iBAGSF,KAHT;AAAA;AAAA,mBAKWV,oBAAoB,CAACW,OAAD,EAAU,KAAKS,qBAAf,CAL/B;AAAA,qBAMa,KAAKA,qBANlB;AAAA,oBAOYL;AAPZ,uBASE,oBAAC,aAAD,CAAe,KAAf;AAAqB,QAAA,GAAG,EAAEjB;AAA1B,QATF,CAjBJ,CADF,CADF;AAkCD;;;;EA7C6BP,S;;gBAA1BW,iB,iBACiB,e;;gBADjBA,iB,WAEWmB,K;;AA8CjB,SAASF,OAAT,CAAiBG,KAAjB,EAAwB;AAAA;AAAA;;AACtB,MAAMC,QAAQ,GACiC7B,WAAW,CAACwB,KAD3D;AACA,iBAAOzB,OAAO,CAAC6B,KAAK,CAACb,MAAP,CAAd,eAA6B,oBAAC,QAAD;AAAA,WAA0CZ;AAA1C,cAA7B;AACD;;AAED,IAAMmB,aAAa,GAAG1B,eAAe,CACnCY,iBADmC,EAEnC;AACEe,EAAAA,IAAI,EAAEvB,WAAW,CAACuB,IADpB;AAEEC,EAAAA,KAAK,EAAExB,WAAW,CAACwB,KAFrB;AAGEC,EAAAA,OAAO,EAAPA;AAHF,CAFmC,EAOnC;AACEK,EAAAA,MAAM,EAAE9B;AADV,CAPmC,CAArC;AAYA,eAAesB,aAAf","sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport BaseTrigger from './BaseTrigger';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation from '@semcore/neighbor-location';\nimport Dot from '@semcore/dot';\nimport Close from '@semcore/icon/Close/m';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\n\nimport style from './style/filter-trigger.shadow.css';\n\nclass RootFilterTrigger extends Component {\n static displayName = 'FilterTrigger';\n static style = style;\n\n handleStopPropagation = (e) => e.stopPropagation();\n\n render() {\n const SWrapper = Root;\n const SFilterTrigger = BaseTrigger;\n const { Children, styles, empty, onClear, size, placeholder, active, disabled } = this.asProps;\n\n return sstyled(styles)(\n <SWrapper render={Box}>\n <NeighborLocation>\n <SFilterTrigger\n w=\"100%\"\n size={size}\n placeholder={placeholder}\n empty={empty}\n selected={!empty}\n active={active}\n disabled={disabled}\n >\n {addonTextChildren(Children, FilterTrigger.Text, [\n FilterTrigger.Addon,\n FilterTrigger.Counter,\n ])}\n {empty && <FilterTrigger.Addon tag={ChevronDown} />}\n </SFilterTrigger>\n {!empty && (\n <SFilterTrigger\n tag=\"button\"\n size={size}\n empty={empty}\n selected\n onClick={callAllEventHandlers(onClear, this.handleStopPropagation)}\n onKeyDown={this.handleStopPropagation}\n disabled={disabled}\n >\n <FilterTrigger.Addon tag={Close} />\n </SFilterTrigger>\n )}\n </NeighborLocation>\n </SWrapper>,\n );\n }\n}\n\nfunction Counter(props) {\n const SCounter = Root;\n return sstyled(props.styles)(<SCounter render={BaseTrigger.Addon} tag={Dot} />);\n}\n\nconst FilterTrigger = createComponent(\n RootFilterTrigger,\n {\n Text: BaseTrigger.Text,\n Addon: BaseTrigger.Addon,\n Counter,\n },\n {\n parent: BaseTrigger,\n },\n);\n\nexport default FilterTrigger;\n"],"file":"FilterTrigger.js"}
|
package/lib/es6/LinkTrigger.js
CHANGED
|
@@ -31,25 +31,23 @@ var style = (
|
|
|
31
31
|
/*__reshadow_css_start__*/
|
|
32
32
|
_sstyled.insert(
|
|
33
33
|
/*__inner_css_start__*/
|
|
34
|
-
".
|
|
34
|
+
".___SLinkTrigger_1lk11_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;-ms-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;outline:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;outline:0;vertical-align:middle;font-family:Inter,sans-serif;cursor:pointer;color:#006dca;background:none;transition:color .15s ease-in-out}.___SLinkTrigger_1lk11_gg_:active,.___SLinkTrigger_1lk11_gg_:hover,.___SLinkTrigger_1lk11_gg_.__active_1lk11_gg_{color:#044792}.___SLinkTrigger_1lk11_gg_:active .___SText_1lk11_gg_,.___SLinkTrigger_1lk11_gg_:hover .___SText_1lk11_gg_,.___SLinkTrigger_1lk11_gg_.__active_1lk11_gg_ .___SText_1lk11_gg_{border-color:currentColor}.___SLinkTrigger_1lk11_gg_ .___SText_1lk11_gg_{border-bottom-width:1px;border-bottom-style:solid;border-color:transparent;transition:border-bottom-color .15s ease-in-out;line-height:1.42}.___SLinkTrigger_1lk11_gg_.__color_1lk11_gg_{color:var(--color_klk89u)}.___SLinkTrigger_1lk11_gg_.__color_1lk11_gg_:hover{color:var(--color-hover_klk89u)}.___SLinkTrigger_1lk11_gg_.__disabled_1lk11_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SLinkTrigger_1lk11_gg_.__keyboardFocused_1lk11_gg_{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2);z-index:1}.___SAddon_1lk11_gg_,.___SLinkAddon_1lk11_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.___SAddon_1lk11_gg_:not(:only-child):first-child,.___SLinkAddon_1lk11_gg_:not(:only-child):first-child{margin-right:4px}.___SAddon_1lk11_gg_:not(:only-child):last-child,.___SLinkAddon_1lk11_gg_:not(:only-child):last-child{margin-left:4px}.___SLinkAddon_1lk11_gg_{width:16px;height:16px}.___SLinkTrigger_1lk11_gg_._size_m_1lk11_gg_{font-size:14px}.___SLinkTrigger_1lk11_gg_._size_l_1lk11_gg_{font-size:16px}@media (prefers-reduced-motion){.___SLinkTrigger_1lk11_gg_{transition:none}.___SLinkTrigger_1lk11_gg_ .___SText_1lk11_gg_{transition:none}}"
|
|
35
35
|
/*__inner_css_end__*/
|
|
36
|
-
, "
|
|
36
|
+
, "klk89u_gg_")
|
|
37
37
|
/*__reshadow_css_end__*/
|
|
38
38
|
, {
|
|
39
|
-
"__SLinkTrigger": "
|
|
40
|
-
"_active": "
|
|
41
|
-
"__SText": "
|
|
42
|
-
"_color": "
|
|
43
|
-
"--color": "--
|
|
44
|
-
"--color-hover": "--color-
|
|
45
|
-
"_disabled": "
|
|
46
|
-
"_keyboardFocused": "
|
|
47
|
-
"__SAddon": "
|
|
48
|
-
"__SLinkAddon": "
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"_size_l": "_size_l_qt3iv_gg_",
|
|
52
|
-
"_size_xl": "_size_xl_qt3iv_gg_"
|
|
39
|
+
"__SLinkTrigger": "___SLinkTrigger_1lk11_gg_",
|
|
40
|
+
"_active": "__active_1lk11_gg_",
|
|
41
|
+
"__SText": "___SText_1lk11_gg_",
|
|
42
|
+
"_color": "__color_1lk11_gg_",
|
|
43
|
+
"--color": "--color_klk89u",
|
|
44
|
+
"--color-hover": "--color-hover_klk89u",
|
|
45
|
+
"_disabled": "__disabled_1lk11_gg_",
|
|
46
|
+
"_keyboardFocused": "__keyboardFocused_1lk11_gg_",
|
|
47
|
+
"__SAddon": "___SAddon_1lk11_gg_",
|
|
48
|
+
"__SLinkAddon": "___SLinkAddon_1lk11_gg_",
|
|
49
|
+
"_size_m": "_size_m_1lk11_gg_",
|
|
50
|
+
"_size_l": "_size_l_1lk11_gg_"
|
|
53
51
|
});
|
|
54
52
|
|
|
55
53
|
var RootLinkTrigger = /*#__PURE__*/function (_Component) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/LinkTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","addonTextChildren","ChevronDown","Spin","Box","resolveColor","shade","keyboardFocusEnhance","RootLinkTrigger","asProps","placeholder","empty","SLinkTrigger","SLinkAddon","LinkTrigger","Addon","Children","loading","styles","providedColor","color","colorHover","Text","style","size","props","SText","children","SAddon"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,OAAOC,IAAP,MAAiB,eAAjB;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,YAAP,IAAuBC,KAAvB,QAAoC,0BAApC;AACA,OAAOC,oBAAP,MAAiC,kDAAjC
|
|
1
|
+
{"version":3,"sources":["../../src/LinkTrigger.jsx"],"names":["React","createComponent","Component","Root","sstyled","addonTextChildren","ChevronDown","Spin","Box","resolveColor","shade","keyboardFocusEnhance","RootLinkTrigger","asProps","placeholder","empty","SLinkTrigger","SLinkAddon","LinkTrigger","Addon","Children","loading","styles","providedColor","color","colorHover","Text","style","size","props","SText","children","SAddon"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,IAArC,EAA2CC,OAA3C,QAA0D,eAA1D;AACA,OAAOC,iBAAP,MAA8B,sCAA9B;AACA,OAAOC,WAAP,MAAwB,6BAAxB;AACA,OAAOC,IAAP,MAAiB,eAAjB;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,YAAP,IAAuBC,KAAvB,QAAoC,0BAApC;AACA,OAAOC,oBAAP,MAAiC,kDAAjC;;;;;;;;;;;;;;;;;;;;;;;;;;IAIMC,e;;;;;;;;;;;;;WAQJ,wBAAe;AACb,0BAA+B,KAAKC,OAApC;AAAA,UAAQC,WAAR,iBAAQA,WAAR;AAAA,UAAqBC,KAArB,iBAAqBA,KAArB;AACA,aAAO;AACLD,QAAAA,WAAW,EAAXA,WADK;AAELC,QAAAA,KAAK,EAALA;AAFK,OAAP;AAID;;;WAED,kBAAS;AAAA;AAAA;;AACP,UAAMC,YAAY,GAQMR,GARxB;AACA,UAAMS,UAAU,GAAGC,WAAW,CAACC,KAA/B;AACA,2BAA4D,KAAKN,OAAjE;AAAA,UAAQO,QAAR,kBAAQA,QAAR;AAAA,UAAkBC,OAAlB,kBAAkBA,OAAlB;AAAA,UAA2BC,MAA3B,kBAA2BA,MAA3B;AAAA,UAA0CC,aAA1C,kBAAmCC,KAAnC;AAEA,UAAMA,KAAK,GAAGf,YAAY,CAACc,aAAD,CAA1B;AACA,UAAME,UAAU,GAAGf,KAAK,CAACc,KAAD,EAAQ,CAAC,IAAT,CAAxB;AAEA,qBAAOpB,OAAO,CAACkB,MAAD,CAAd,eACE,oBAAC,YAAD;AAAA,qBAAsCE,KAAtC;AAAA,2BAA8DC;AAA9D,kBACGpB,iBAAiB,CAACe,QAAD,EAAWF,WAAW,CAACQ,IAAvB,EAA6BR,WAAW,CAACC,KAAzC,CADpB,eAEE,oBAAC,UAAD,8BACGE,OAAO,gBAAG,oBAAC,IAAD;AAAA,gBAAW,IAAX;AAAA,iBAAsB;AAAtB,SAAH,gBAA6C,oBAAC,WAAD,8BADvD,CAFF,CADF;AAQD;;;;EAhC2BnB,S;;gBAAxBU,e,iBACiB,a;;gBADjBA,e,WAEWe,K;;gBAFXf,e,kBAGkB;AACpBgB,EAAAA,IAAI,EAAE;AADc,C;;gBAHlBhB,e,aAMa,CAACD,oBAAoB,EAArB,C;;AA6BnB,SAASe,IAAT,CAAcG,KAAd,EAAqB;AAAA;AAAA;;AACnB,MAAMC,KAAK,GAKMtB,GALjB;AACA,MAAQuB,QAAR,GAAiDF,KAAjD,CAAQE,QAAR;AAAA,MAAkBT,MAAlB,GAAiDO,KAAjD,CAAkBP,MAAlB;AAAA,MAA0BP,KAA1B,GAAiDc,KAAjD,CAA0Bd,KAA1B;AAAA,MAAiCD,WAAjC,GAAiDe,KAAjD,CAAiCf,WAAjC;AAEA,iBAAOV,OAAO,CAACkB,MAAD,CAAd;AAAA;;AACE;AACA,sBAAC,KAAD;AAAA,uBAAqCP;AAArC,eACGA,KAAK,GAAGD,WAAH,GAAiBiB,QADzB,CAFF;AAMD;;AAED,SAASZ,KAAT,CAAeU,KAAf,EAAsB;AAAA;AAAA;;AACpB,MAAMG,MAAM,GACiCxB,GAD7C;AACA,iBAAOJ,OAAO,CAACyB,KAAK,CAACP,MAAP,CAAd,eAA6B,oBAAC,MAAD,kEAA7B;AACD;;AAED,IAAMJ,WAAW,GAAGjB,eAAe,CAACW,eAAD,EAAkB;AACnDc,EAAAA,IAAI,EAAJA,IADmD;AAEnDP,EAAAA,KAAK,EAALA;AAFmD,CAAlB,CAAnC;AAKA,eAAeD,WAAf","sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport ChevronDown from '@semcore/icon/ChevronDown/m';\nimport Spin from '@semcore/spin';\nimport { Box } from '@semcore/flex-box';\nimport resolveColor, { shade } from '@semcore/utils/lib/color';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nimport style from './style/link-trigger.shadow.css';\n\nclass RootLinkTrigger extends Component {\n static displayName = 'LinkTrigger';\n static style = style;\n static defaultProps = {\n size: 'm',\n };\n static enhance = [keyboardFocusEnhance()];\n\n getTextProps() {\n const { placeholder, empty } = this.asProps;\n return {\n placeholder,\n empty,\n };\n }\n\n render() {\n const SLinkTrigger = Root;\n const SLinkAddon = LinkTrigger.Addon;\n const { Children, loading, styles, color: providedColor } = this.asProps;\n\n const color = resolveColor(providedColor);\n const colorHover = shade(color, -0.12);\n\n return sstyled(styles)(\n <SLinkTrigger render={Box} use:color={color} use:color-hover={colorHover}>\n {addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon)}\n <SLinkAddon>\n {loading ? <Spin size=\"xs\" theme=\"currentColor\" /> : <ChevronDown />}\n </SLinkAddon>\n </SLinkTrigger>,\n );\n }\n}\n\nfunction Text(props) {\n const SText = Root;\n const { children, styles, empty, placeholder } = props;\n\n return sstyled(styles)(\n /* что бы не ломать обратную совместимость пришлось юзать use */\n <SText render={Box} use:placeholder={empty}>\n {empty ? placeholder : children}\n </SText>,\n );\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nconst LinkTrigger = createComponent(RootLinkTrigger, {\n Text,\n Addon,\n});\n\nexport default LinkTrigger;\n"],"file":"LinkTrigger.js"}
|
package/lib/es6/index.d.ts
CHANGED
|
@@ -20,12 +20,14 @@ SBaseTrigger {
|
|
|
20
20
|
outline: 0;
|
|
21
21
|
text-align: center;
|
|
22
22
|
vertical-align: middle;
|
|
23
|
-
font-family:
|
|
23
|
+
font-family: Inter, sans-serif;
|
|
24
24
|
cursor: pointer;
|
|
25
25
|
|
|
26
|
-
border: 1px solid var(--stone);
|
|
27
26
|
background: #ffffff;
|
|
28
|
-
|
|
27
|
+
|
|
28
|
+
font-weight: 400;
|
|
29
|
+
border: 1px solid var(--gray-200);
|
|
30
|
+
color: var(--gray-800);
|
|
29
31
|
|
|
30
32
|
&::-moz-focus-inner {
|
|
31
33
|
border: none;
|
|
@@ -40,14 +42,17 @@ SBaseTrigger {
|
|
|
40
42
|
}
|
|
41
43
|
|
|
42
44
|
&[keyboardFocused] {
|
|
43
|
-
border: 1px solid var(--
|
|
44
|
-
box-shadow: var(--
|
|
45
|
+
border: 1px solid var(--blue-400);
|
|
46
|
+
box-shadow: var(--keyboard-focus);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
&:hover {
|
|
50
|
+
background-color: color-mod(var(--gray-400) a(20%));
|
|
45
51
|
}
|
|
46
52
|
|
|
47
53
|
&:active,
|
|
48
|
-
&:hover,
|
|
49
54
|
&[active] {
|
|
50
|
-
background-color: color-mod(var(--
|
|
55
|
+
background-color: color-mod(var(--gray-400) a(30%));
|
|
51
56
|
}
|
|
52
57
|
}
|
|
53
58
|
|
|
@@ -75,7 +80,7 @@ SText {
|
|
|
75
80
|
overflow: hidden;
|
|
76
81
|
white-space: nowrap;
|
|
77
82
|
text-overflow: ellipsis;
|
|
78
|
-
line-height:
|
|
83
|
+
line-height: var(--lh-200);
|
|
79
84
|
flex-grow: 1;
|
|
80
85
|
text-align: left;
|
|
81
86
|
}
|
|
@@ -92,51 +97,20 @@ SBaseAddon {
|
|
|
92
97
|
height: 12px;
|
|
93
98
|
}
|
|
94
99
|
|
|
95
|
-
SBaseTrigger[size='s'] {
|
|
96
|
-
height: 18px;
|
|
97
|
-
min-width: 18px;
|
|
98
|
-
border-radius: 2px;
|
|
99
|
-
font-size: 10px;
|
|
100
|
-
|
|
101
|
-
& SText {
|
|
102
|
-
margin-left: 4px;
|
|
103
|
-
margin-right: 4px;
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
& SAddon {
|
|
107
|
-
&:not(:only-child):first-child {
|
|
108
|
-
margin-left: 4px;
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
&:not(:only-child):last-child {
|
|
112
|
-
margin-right: 4px;
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
&:only-child {
|
|
116
|
-
margin-left: -2px;
|
|
117
|
-
margin-right: -2px;
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
|
|
122
100
|
SBaseTrigger[size='m'] {
|
|
123
|
-
height: 26px;
|
|
124
101
|
min-width: 26px;
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
margin-left: 8px;
|
|
130
|
-
margin-right: 8px;
|
|
131
|
-
}
|
|
102
|
+
height: 28px;
|
|
103
|
+
border-radius: var(--rounded-m);
|
|
104
|
+
padding: 0 8px;
|
|
105
|
+
font-size: var(--fs-200);
|
|
132
106
|
|
|
133
107
|
& SAddon {
|
|
134
108
|
&:not(:only-child):first-child {
|
|
135
|
-
margin-
|
|
109
|
+
margin-right: 8px;
|
|
136
110
|
}
|
|
137
111
|
|
|
138
112
|
&:not(:only-child):last-child {
|
|
139
|
-
margin-
|
|
113
|
+
margin-left: 8px;
|
|
140
114
|
}
|
|
141
115
|
|
|
142
116
|
&:only-child {
|
|
@@ -147,23 +121,19 @@ SBaseTrigger[size='m'] {
|
|
|
147
121
|
}
|
|
148
122
|
|
|
149
123
|
SBaseTrigger[size='l'] {
|
|
150
|
-
height: 32px;
|
|
151
124
|
min-width: 32px;
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
margin-left: 8px;
|
|
157
|
-
margin-right: 8px;
|
|
158
|
-
}
|
|
125
|
+
height: 40px;
|
|
126
|
+
border-radius: var(--rounded-m);
|
|
127
|
+
padding: 0 12px;
|
|
128
|
+
font-size: var(--fs-300);
|
|
159
129
|
|
|
160
130
|
& SAddon {
|
|
161
131
|
&:not(:only-child):first-child {
|
|
162
|
-
margin-
|
|
132
|
+
margin-right: 8px;
|
|
163
133
|
}
|
|
164
134
|
|
|
165
135
|
&:not(:only-child):last-child {
|
|
166
|
-
margin-
|
|
136
|
+
margin-left: 8px;
|
|
167
137
|
}
|
|
168
138
|
|
|
169
139
|
&:only-child {
|
|
@@ -173,33 +143,6 @@ SBaseTrigger[size='l'] {
|
|
|
173
143
|
}
|
|
174
144
|
}
|
|
175
145
|
|
|
176
|
-
SBaseTrigger[size='xl'] {
|
|
177
|
-
height: 42px;
|
|
178
|
-
min-width: 42px;
|
|
179
|
-
border-radius: 5px;
|
|
180
|
-
font-size: 16px;
|
|
181
|
-
|
|
182
|
-
& SText {
|
|
183
|
-
margin-left: 12px;
|
|
184
|
-
margin-right: 12px;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
& SAddon {
|
|
188
|
-
&:not(:only-child):first-child {
|
|
189
|
-
margin-left: 12px;
|
|
190
|
-
}
|
|
191
|
-
|
|
192
|
-
&:not(:only-child):last-child {
|
|
193
|
-
margin-right: 12px;
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
&:only-child {
|
|
197
|
-
margin-left: -6px;
|
|
198
|
-
margin-right: -6px;
|
|
199
|
-
}
|
|
200
|
-
}
|
|
201
|
-
}
|
|
202
|
-
|
|
203
146
|
SBaseTrigger[neighborLocation='right'] {
|
|
204
147
|
border-top-right-radius: 0;
|
|
205
148
|
border-bottom-right-radius: 0;
|
|
@@ -217,22 +160,22 @@ SBaseTrigger[neighborLocation='left'] {
|
|
|
217
160
|
}
|
|
218
161
|
|
|
219
162
|
SText[placeholder] {
|
|
220
|
-
color: var(--
|
|
163
|
+
color: var(--gray-300);
|
|
221
164
|
}
|
|
222
165
|
|
|
223
166
|
SBaseTrigger[state='normal'] {
|
|
224
|
-
border-color: var(--
|
|
167
|
+
border-color: var(--gray-200);
|
|
225
168
|
}
|
|
226
169
|
|
|
227
170
|
SBaseTrigger[state='valid'] {
|
|
228
|
-
border-color: var(--green);
|
|
171
|
+
border-color: var(--green-200);
|
|
229
172
|
}
|
|
230
173
|
|
|
231
174
|
SBaseTrigger[state='invalid'] {
|
|
232
|
-
border-color: var(--
|
|
175
|
+
border-color: var(--red-200);
|
|
233
176
|
|
|
234
177
|
&[keyboardFocused] {
|
|
235
|
-
border-color: var(--orange);
|
|
236
|
-
box-shadow: 0 0 0 3px color-mod(var(--orange) a(30%));
|
|
178
|
+
border-color: var(--orange-400);
|
|
179
|
+
box-shadow: 0 0 0 3px color-mod(var(--orange-400) a(30%));
|
|
237
180
|
}
|
|
238
181
|
}
|