@semcore/base-trigger 16.5.0-prerelease.3 → 16.5.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/lib/cjs/BaseTrigger.js +49 -35
- package/lib/cjs/BaseTrigger.js.map +1 -1
- package/lib/cjs/ButtonTrigger.js +5 -4
- package/lib/cjs/ButtonTrigger.js.map +1 -1
- package/lib/cjs/FilterTrigger.js +48 -39
- package/lib/cjs/FilterTrigger.js.map +1 -1
- package/lib/cjs/LinkTrigger.js +27 -66
- package/lib/cjs/LinkTrigger.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/style/base-trigger.shadow.css +4 -4
- package/lib/cjs/style/filter-trigger.shadow.css +1 -5
- package/lib/es6/BaseTrigger.js +45 -31
- package/lib/es6/BaseTrigger.js.map +1 -1
- package/lib/es6/ButtonTrigger.js +5 -4
- package/lib/es6/ButtonTrigger.js.map +1 -1
- package/lib/es6/FilterTrigger.js +45 -36
- package/lib/es6/FilterTrigger.js.map +1 -1
- package/lib/es6/LinkTrigger.js +29 -71
- package/lib/es6/LinkTrigger.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/style/base-trigger.shadow.css +4 -4
- package/lib/es6/style/filter-trigger.shadow.css +1 -5
- package/lib/esm/BaseTrigger.mjs +44 -33
- package/lib/esm/ButtonTrigger.mjs +7 -7
- package/lib/esm/FilterTrigger.mjs +30 -25
- package/lib/esm/LinkTrigger.mjs +25 -64
- package/lib/esm/style/base-trigger.shadow.css +4 -4
- package/lib/esm/style/filter-trigger.shadow.css +1 -5
- package/lib/types/index.d.ts +14 -24
- package/package.json +10 -10
- 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/lib/esm/BaseTrigger.mjs
CHANGED
|
@@ -4,46 +4,51 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
|
4
4
|
import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
|
-
import {
|
|
7
|
+
import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
|
|
8
|
+
import { Box, InvalidStateBox, NeighborLocation } from "@semcore/base-components";
|
|
8
9
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
9
10
|
import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
|
|
10
|
-
import logger from "@semcore/core/lib/utils/logger";
|
|
11
11
|
import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
|
|
12
|
-
import {
|
|
13
|
-
import NeighborLocation from "@semcore/neighbor-location";
|
|
12
|
+
import { Text as Text$1 } from "@semcore/typography";
|
|
14
13
|
import React from "react";
|
|
15
14
|
/*!__reshadow-styles__:"./style/base-trigger.shadow.css"*/
|
|
16
15
|
var style = (
|
|
17
16
|
/*__reshadow_css_start__*/
|
|
18
17
|
(sstyled.insert(
|
|
19
18
|
/*__inner_css_start__*/
|
|
20
|
-
".
|
|
19
|
+
".___SBaseTrigger_y9ta2_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;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));font-weight:var(--intergalactic-regular, 400);border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0%)){.___SBaseTrigger_y9ta2_gg_{border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SBaseTrigger_y9ta2_gg_{border:1px solid var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBaseTrigger_y9ta2_gg_::-moz-focus-inner{border:0;padding:0}.___SBaseTrigger_y9ta2_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___SBaseTrigger_y9ta2_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___SBaseTrigger_y9ta2_gg_:focus-visible{border:1px solid var(--intergalactic-border-info-active, rgb(135, 150, 239))}@media (hover:hover){.___SBaseTrigger_y9ta2_gg_:hover{background-color:var(--intergalactic-bg-primary-neutral-hover, rgb(248, 249, 248))}}.___SBaseTrigger_y9ta2_gg_.__active_y9ta2_gg_,.___SBaseTrigger_y9ta2_gg_:active{border-color:var(--intergalactic-border-info-active, rgb(135, 150, 239));background-color:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255))}.___SBaseTrigger_y9ta2_gg_.__disabled_y9ta2_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);cursor:default;pointer-events:none}.___SInner_y9ta2_gg_{display:inline-flex;align-items:center;justify-content:center;height:100%;width:100%}.___SText_y9ta2_gg_{display:inline;padding:1px 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:var(--intergalactic-lh-200, 142%);flex-grow:1;text-align:left}.___SAddon_y9ta2_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.___SBaseAddon_y9ta2_gg_{width:12px;height:12px}.___SBaseTrigger_y9ta2_gg_._size_m_y9ta2_gg_{min-width:26px;height:28px;border-radius:var(--intergalactic-control-rounded, 6px);padding:0 var(--intergalactic-spacing-2x, 8px);font-size:var(--intergalactic-fs-200, 14px)}.___SBaseTrigger_y9ta2_gg_._size_m_y9ta2_gg_ .___SAddon_y9ta2_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_y9ta2_gg_._size_m_y9ta2_gg_ .___SAddon_y9ta2_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_y9ta2_gg_._size_l_y9ta2_gg_ .___SAddon_y9ta2_gg_:only-child,.___SBaseTrigger_y9ta2_gg_._size_m_y9ta2_gg_ .___SAddon_y9ta2_gg_:only-child{margin-left:calc(-1*var(--intergalactic-spacing-1x, 4px));margin-right:calc(-1*var(--intergalactic-spacing-1x, 4px))}.___SBaseTrigger_y9ta2_gg_._size_l_y9ta2_gg_{min-width:32px;height:40px;border-radius:var(--intergalactic-control-rounded, 6px);padding:0 var(--intergalactic-spacing-3x, 12px);font-size:var(--intergalactic-fs-300, 16px)}.___SBaseTrigger_y9ta2_gg_._size_l_y9ta2_gg_ .___SAddon_y9ta2_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_y9ta2_gg_._size_l_y9ta2_gg_ .___SAddon_y9ta2_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_y9ta2_gg_._neighborLocation_right_y9ta2_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SBaseTrigger_y9ta2_gg_._neighborLocation_both_y9ta2_gg_{border-radius:0;margin-left:-1px}.___SBaseTrigger_y9ta2_gg_._neighborLocation_left_y9ta2_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.___SBaseTrigger_y9ta2_gg_._neighborLocation_left_y9ta2_gg_.__disabled_y9ta2_gg_{border-left:none;margin-left:0}.___SText_y9ta2_gg_.__display-placeholder_y9ta2_gg_{color:var(--intergalactic-text-placeholder, rgba(0, 5, 2, 0.457))}.___SBaseTrigger_y9ta2_gg_._state_valid_y9ta2_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 185, 145))}@supports (color:color(display-p3 0 0 0%)){.___SBaseTrigger_y9ta2_gg_._state_valid_y9ta2_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 185, 145))}@media (color-gamut:p3){.___SBaseTrigger_y9ta2_gg_._state_valid_y9ta2_gg_{border-color:var(--intergalactic-border-success-active, color(display-p3 0.21847 0.73243 0.56937))}}}.___SBaseTrigger_y9ta2_gg_._state_invalid_y9ta2_gg_{border-color:var(--intergalactic-border-critical-active, rgb(255, 99, 100))}@supports (color:color(display-p3 0 0 0%)){.___SBaseTrigger_y9ta2_gg_._state_invalid_y9ta2_gg_{border-color:var(--intergalactic-border-critical-active, rgb(255, 99, 100))}@media (color-gamut:p3){.___SBaseTrigger_y9ta2_gg_._state_invalid_y9ta2_gg_{border-color:var(--intergalactic-border-critical-active, color(display-p3 0.95478 0.398 0.38923))}}}.___SBaseTrigger_y9ta2_gg_._state_invalid_y9ta2_gg_:focus-visible{outline-color:var(--intergalactic-keyboard-focus-invalid-outline, rgba(255, 2, 7, 0.652))}.___SInvalidPattern_y9ta2_gg_._size_m_y9ta2_gg_{margin-left:calc(-1*var(--intergalactic-spacing-2x, 8px))}.___SInvalidPattern_y9ta2_gg_._size_l_y9ta2_gg_{margin-left:calc(-1*var(--intergalactic-spacing-3x, 12px))}",
|
|
21
20
|
/*__inner_css_end__*/
|
|
22
|
-
"
|
|
21
|
+
"y9ta2_gg_"
|
|
23
22
|
), /*__reshadow_css_end__*/
|
|
24
23
|
{
|
|
25
|
-
"__SBaseTrigger": "
|
|
26
|
-
"_disabled": "
|
|
27
|
-
"__SInner": "
|
|
28
|
-
"__SText": "
|
|
29
|
-
"__SAddon": "
|
|
30
|
-
"__SBaseAddon": "
|
|
31
|
-
"_neighborLocation_right": "
|
|
32
|
-
"_neighborLocation_both": "
|
|
33
|
-
"_display-placeholder": "__display-
|
|
34
|
-
"_state_valid": "
|
|
35
|
-
"__SInvalidPattern": "
|
|
36
|
-
"_size_m": "
|
|
37
|
-
"_size_l": "
|
|
38
|
-
"_active": "
|
|
39
|
-
"_neighborLocation_left": "
|
|
40
|
-
"_state_invalid": "
|
|
24
|
+
"__SBaseTrigger": "___SBaseTrigger_y9ta2_gg_",
|
|
25
|
+
"_disabled": "__disabled_y9ta2_gg_",
|
|
26
|
+
"__SInner": "___SInner_y9ta2_gg_",
|
|
27
|
+
"__SText": "___SText_y9ta2_gg_",
|
|
28
|
+
"__SAddon": "___SAddon_y9ta2_gg_",
|
|
29
|
+
"__SBaseAddon": "___SBaseAddon_y9ta2_gg_",
|
|
30
|
+
"_neighborLocation_right": "_neighborLocation_right_y9ta2_gg_",
|
|
31
|
+
"_neighborLocation_both": "_neighborLocation_both_y9ta2_gg_",
|
|
32
|
+
"_display-placeholder": "__display-placeholder_y9ta2_gg_",
|
|
33
|
+
"_state_valid": "_state_valid_y9ta2_gg_",
|
|
34
|
+
"__SInvalidPattern": "___SInvalidPattern_y9ta2_gg_",
|
|
35
|
+
"_size_m": "_size_m_y9ta2_gg_",
|
|
36
|
+
"_size_l": "_size_l_y9ta2_gg_",
|
|
37
|
+
"_active": "__active_y9ta2_gg_",
|
|
38
|
+
"_neighborLocation_left": "_neighborLocation_left_y9ta2_gg_",
|
|
39
|
+
"_state_invalid": "_state_invalid_y9ta2_gg_"
|
|
41
40
|
})
|
|
42
41
|
);
|
|
43
42
|
var RootBaseTrigger = /* @__PURE__ */ (function(_Component) {
|
|
44
43
|
function RootBaseTrigger2() {
|
|
44
|
+
var _this;
|
|
45
45
|
_classCallCheck(this, RootBaseTrigger2);
|
|
46
|
-
|
|
46
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
47
|
+
args[_key] = arguments[_key];
|
|
48
|
+
}
|
|
49
|
+
_this = _callSuper(this, RootBaseTrigger2, [].concat(args));
|
|
50
|
+
_defineProperty(_this, "triggerRef", /* @__PURE__ */ React.createRef());
|
|
51
|
+
return _this;
|
|
47
52
|
}
|
|
48
53
|
_inherits(RootBaseTrigger2, _Component);
|
|
49
54
|
return _createClass(RootBaseTrigger2, [{
|
|
@@ -52,18 +57,18 @@ var RootBaseTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
52
57
|
var _this$asProps = this.asProps, placeholder = _this$asProps.placeholder, empty = _this$asProps.empty;
|
|
53
58
|
return {
|
|
54
59
|
placeholder,
|
|
55
|
-
empty
|
|
60
|
+
empty,
|
|
61
|
+
triggerRef: this.triggerRef
|
|
56
62
|
};
|
|
57
63
|
}
|
|
58
64
|
}, {
|
|
59
65
|
key: "render",
|
|
60
66
|
value: function render() {
|
|
61
|
-
var _ref = this.asProps,
|
|
67
|
+
var _ref = this.asProps, _this2 = this;
|
|
62
68
|
var SBaseTrigger = Box;
|
|
63
69
|
var SInner = "span";
|
|
64
70
|
var SInvalidPattern = InvalidStateBox;
|
|
65
71
|
var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, styles = _this$asProps2.styles, theme = _this$asProps2.theme, neighborLocation = _this$asProps2.neighborLocation, empty = _this$asProps2.empty, state = _this$asProps2.state, size = _this$asProps2.size;
|
|
66
|
-
logger.warn(theme !== void 0, "The 'theme' property is deprecated, use 'state'", this.asProps["data-ui-name"] || BaseTrigger.displayName);
|
|
67
72
|
return /* @__PURE__ */ React.createElement(NeighborLocation.Detect, {
|
|
68
73
|
neighborLocation
|
|
69
74
|
}, function(neighborLocation2) {
|
|
@@ -73,11 +78,12 @@ var RootBaseTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
73
78
|
"type": "button",
|
|
74
79
|
"tabIndex": 0,
|
|
75
80
|
"neighborLocation": neighborLocation2,
|
|
76
|
-
"state": theme
|
|
81
|
+
"state": theme,
|
|
82
|
+
"ref": _this2.triggerRef
|
|
77
83
|
}, _ref))), state === "invalid" && /* @__PURE__ */ React.createElement(SInvalidPattern, _ref4.cn("SInvalidPattern", {
|
|
78
84
|
"size": size
|
|
79
85
|
})), /* @__PURE__ */ React.createElement(SInner, _ref4.cn("SInner", {
|
|
80
|
-
"data-ui-name": "".concat(
|
|
86
|
+
"data-ui-name": "".concat(_this2.asProps["data-ui-name"], ".InnerTriggerWrapper")
|
|
81
87
|
}), addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)));
|
|
82
88
|
});
|
|
83
89
|
}
|
|
@@ -100,12 +106,17 @@ _defineProperty(RootBaseTrigger, "defaultProps", {
|
|
|
100
106
|
});
|
|
101
107
|
function Text(props) {
|
|
102
108
|
var _ref2 = arguments[0], _ref5;
|
|
103
|
-
var SText =
|
|
104
|
-
var
|
|
105
|
-
|
|
109
|
+
var SText = Text$1;
|
|
110
|
+
var textRef = React.useRef();
|
|
111
|
+
var children = props.children, styles = props.styles, empty = props.empty, placeholder = props.placeholder, triggerRef = props.triggerRef, _props$ellipsis = props.ellipsis, ellipsis = _props$ellipsis === void 0 ? false : _props$ellipsis;
|
|
112
|
+
var content = empty ? placeholder : children;
|
|
113
|
+
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", _objectSpread({}, assignProps({
|
|
106
114
|
"display-placeholder": empty,
|
|
107
|
-
"aria-hidden": empty
|
|
108
|
-
|
|
115
|
+
"aria-hidden": empty,
|
|
116
|
+
"ref": textRef,
|
|
117
|
+
"ellipsis": ellipsis,
|
|
118
|
+
"hint:triggerRef": triggerRef
|
|
119
|
+
}, _ref2))), content));
|
|
109
120
|
}
|
|
110
121
|
function Addon(props) {
|
|
111
122
|
var _ref3 = arguments[0], _ref6;
|
|
@@ -3,7 +3,7 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
|
3
3
|
import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
4
4
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
5
5
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
6
|
-
import {
|
|
6
|
+
import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
|
|
7
7
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
8
8
|
import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
|
|
9
9
|
import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
|
|
@@ -16,13 +16,13 @@ var style = (
|
|
|
16
16
|
/*__reshadow_css_start__*/
|
|
17
17
|
(sstyled.insert(
|
|
18
18
|
/*__inner_css_start__*/
|
|
19
|
-
".
|
|
19
|
+
".___SButtonAddon_rlrw5_gg_{width:12px;height:12px}.___SButtonTriggerSpin_rlrw5_gg_{fill:var(--intergalactic-icon-primary-neutral, rgba(0, 4, 1, 0.526))}",
|
|
20
20
|
/*__inner_css_end__*/
|
|
21
|
-
"
|
|
21
|
+
"rlrw5_gg_"
|
|
22
22
|
), /*__reshadow_css_end__*/
|
|
23
23
|
{
|
|
24
|
-
"__SButtonAddon": "
|
|
25
|
-
"__SButtonTriggerSpin": "
|
|
24
|
+
"__SButtonAddon": "___SButtonAddon_rlrw5_gg_",
|
|
25
|
+
"__SButtonTriggerSpin": "___SButtonTriggerSpin_rlrw5_gg_"
|
|
26
26
|
})
|
|
27
27
|
);
|
|
28
28
|
var RootButtonTrigger = /* @__PURE__ */ (function(_Component) {
|
|
@@ -51,9 +51,9 @@ var RootButtonTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
51
51
|
var _ref = this.asProps, _ref2;
|
|
52
52
|
var SButtonAddon = ButtonTrigger.Addon;
|
|
53
53
|
var SButtonTriggerSpin = Spin;
|
|
54
|
-
var _this$asProps = this.asProps, Children = _this$asProps.Children, styles = _this$asProps.styles, loading = _this$asProps.loading, chevron = _this$asProps.chevron, empty = _this$asProps.empty;
|
|
54
|
+
var _this$asProps = this.asProps, Children = _this$asProps.Children, styles = _this$asProps.styles, loading = _this$asProps.loading, disabled = _this$asProps.disabled, chevron = _this$asProps.chevron, empty = _this$asProps.empty;
|
|
55
55
|
return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(BaseTrigger, assignProps({
|
|
56
|
-
"
|
|
56
|
+
"use:disabled": disabled || loading
|
|
57
57
|
}, _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", {
|
|
58
58
|
"size": "xs",
|
|
59
59
|
"theme": false
|
|
@@ -7,23 +7,20 @@ import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
|
7
7
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
8
8
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
9
9
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
10
|
-
import {
|
|
10
|
+
import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
|
|
11
|
+
import { Box, NeighborLocation, Hint, ScreenReaderOnly } from "@semcore/base-components";
|
|
11
12
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
12
13
|
import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
|
|
13
14
|
import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
|
|
14
15
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
15
16
|
import { isAdvanceMode } from "@semcore/core/lib/utils/findComponent";
|
|
16
17
|
import getInputProps, { inputProps } from "@semcore/core/lib/utils/inputProps";
|
|
17
|
-
import { ScreenReaderOnly } from "@semcore/core/lib/utils/ScreenReaderOnly";
|
|
18
18
|
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
19
19
|
import { setFocus } from "@semcore/core/lib/utils/use/useFocusLock";
|
|
20
20
|
import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
|
|
21
|
-
import
|
|
22
|
-
import { Box } from "@semcore/flex-box";
|
|
21
|
+
import SemcoreCounter from "@semcore/counter";
|
|
23
22
|
import ChevronDown from "@semcore/icon/ChevronDown/m";
|
|
24
23
|
import Close from "@semcore/icon/Close/m";
|
|
25
|
-
import NeighborLocation from "@semcore/neighbor-location";
|
|
26
|
-
import { Hint } from "@semcore/tooltip";
|
|
27
24
|
import React from "react";
|
|
28
25
|
import BaseTrigger from "./BaseTrigger.mjs";
|
|
29
26
|
import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
|
|
@@ -33,16 +30,15 @@ var style = (
|
|
|
33
30
|
/*__reshadow_css_start__*/
|
|
34
31
|
(sstyled.insert(
|
|
35
32
|
/*__inner_css_start__*/
|
|
36
|
-
".
|
|
33
|
+
".___SFilterTrigger_deskx_gg_.__selected_deskx_gg_{border-color:var(--intergalactic-border-info-active, rgb(135, 150, 239));background-color:var(--intergalactic-control-secondary-info, rgba(0, 81, 255, 0.039));color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0%)){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_{background-color:var(--intergalactic-control-secondary-info, rgba(0, 81, 255, 0.039))}@media (color-gamut:p3){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_{background-color:var(--intergalactic-control-secondary-info, color(display-p3 0.12567 0.31309 0.96324 / 0.039))}}}@media (hover:hover){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, rgba(0, 80, 255, 0.077))}@supports (color:color(display-p3 0 0 0%)){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, rgba(0, 80, 255, 0.077))}@media (color-gamut:p3){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, color(display-p3 0.12402 0.30857 0.96259 / 0.077))}}}}.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_.__active_deskx_gg_,.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, rgba(1, 79, 255, 0.116))}@supports (color:color(display-p3 0 0 0%)){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_.__active_deskx_gg_,.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, rgba(1, 79, 255, 0.116))}@media (color-gamut:p3){.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_.__active_deskx_gg_,.___SFilterTrigger_deskx_gg_.__selected_deskx_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, color(display-p3 0.12361 0.30547 0.96332 / 0.116))}}}.___SWrapper_deskx_gg_{display:inline-flex}.___SWrapper_deskx_gg_:focus{outline:0}",
|
|
37
34
|
/*__inner_css_end__*/
|
|
38
|
-
"
|
|
35
|
+
"deskx_gg_"
|
|
39
36
|
), /*__reshadow_css_end__*/
|
|
40
37
|
{
|
|
41
|
-
"
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"__SWrapper": "___SWrapper_168is_gg_"
|
|
38
|
+
"__SFilterTrigger": "___SFilterTrigger_deskx_gg_",
|
|
39
|
+
"_selected": "__selected_deskx_gg_",
|
|
40
|
+
"_active": "__active_deskx_gg_",
|
|
41
|
+
"__SWrapper": "___SWrapper_deskx_gg_"
|
|
46
42
|
})
|
|
47
43
|
);
|
|
48
44
|
var filterTriggerInputProps = [].concat(_toConsumableArray(inputProps), ["aria-controls", "aria-haspopup", "aria-expanded", "aria-disabled", "aria-activedescendant", "aria-label", "aria-labelledby", "role"]);
|
|
@@ -69,9 +65,7 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
69
65
|
return _createClass(RootFilterTrigger2, [{
|
|
70
66
|
key: "getTriggerButtonProps",
|
|
71
67
|
value: function getTriggerButtonProps() {
|
|
72
|
-
var _this$asProps = this.asProps, empty = _this$asProps.empty, size = _this$asProps.size, placeholder = _this$asProps.placeholder, active = _this$asProps.active, disabled = _this$asProps.disabled, includeInputProps = _this$asProps.includeInputProps, triggerRef = _this$asProps.triggerRef;
|
|
73
|
-
_this$asProps["data-ui-name"];
|
|
74
|
-
var other = _objectWithoutProperties(_this$asProps, _excluded);
|
|
68
|
+
var _this$asProps = this.asProps, empty = _this$asProps.empty, size = _this$asProps.size, placeholder = _this$asProps.placeholder, active = _this$asProps.active, disabled = _this$asProps.disabled, includeInputProps = _this$asProps.includeInputProps, triggerRef = _this$asProps.triggerRef, _dataUiName = _this$asProps["data-ui-name"], other = _objectWithoutProperties(_this$asProps, _excluded);
|
|
75
69
|
var _getInputProps = getInputProps(other, includeInputProps), _getInputProps2 = _slicedToArray(_getInputProps, 1), controlProps = _getInputProps2[0];
|
|
76
70
|
return _objectSpread({
|
|
77
71
|
size,
|
|
@@ -99,9 +93,10 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
99
93
|
}, {
|
|
100
94
|
key: "getCounterProps",
|
|
101
95
|
value: function getCounterProps() {
|
|
102
|
-
var
|
|
96
|
+
var _this$asProps3 = this.asProps, getI18nText = _this$asProps3.getI18nText, size = _this$asProps3.size;
|
|
103
97
|
return {
|
|
104
|
-
getI18nText
|
|
98
|
+
getI18nText,
|
|
99
|
+
size
|
|
105
100
|
};
|
|
106
101
|
}
|
|
107
102
|
}, {
|
|
@@ -109,7 +104,7 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
109
104
|
value: function render() {
|
|
110
105
|
var _ref = this.asProps, _ref5;
|
|
111
106
|
var SWrapper = Box;
|
|
112
|
-
var _this$
|
|
107
|
+
var _this$asProps4 = this.asProps, Children = _this$asProps4.Children, styles = _this$asProps4.styles, getI18nText = _this$asProps4.getI18nText, empty = _this$asProps4.empty, forcedAdvancedMode = _this$asProps4.forcedAdvancedMode;
|
|
113
108
|
var advancedMode = forcedAdvancedMode || isAdvanceMode(Children, [FilterTrigger.TriggerButton.displayName, FilterTrigger.ClearButton.displayName], true);
|
|
114
109
|
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SWrapper, _ref5.cn("SWrapper", _objectSpread({}, assignProps({
|
|
115
110
|
"aria-label": getI18nText("filter"),
|
|
@@ -158,7 +153,7 @@ var TriggerButton = /* @__PURE__ */ (function(_Component2) {
|
|
|
158
153
|
value: function render() {
|
|
159
154
|
var _ref2 = this.asProps, _ref6;
|
|
160
155
|
var SFilterTrigger = BaseTrigger;
|
|
161
|
-
var _this$
|
|
156
|
+
var _this$asProps5 = this.asProps, Children = _this$asProps5.Children, styles = _this$asProps5.styles, empty = _this$asProps5.empty, triggerRef = _this$asProps5.triggerRef;
|
|
162
157
|
return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SFilterTrigger, _ref6.cn("SFilterTrigger", _objectSpread({}, assignProps({
|
|
163
158
|
"use:role": "combobox",
|
|
164
159
|
"w": "100%",
|
|
@@ -176,8 +171,14 @@ _defineProperty(TriggerButton, "displayName", "TriggerButton");
|
|
|
176
171
|
_defineProperty(TriggerButton, "style", style);
|
|
177
172
|
var ClearButton = /* @__PURE__ */ (function(_Component3) {
|
|
178
173
|
function ClearButton2() {
|
|
174
|
+
var _this2;
|
|
179
175
|
_classCallCheck(this, ClearButton2);
|
|
180
|
-
|
|
176
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
177
|
+
args[_key2] = arguments[_key2];
|
|
178
|
+
}
|
|
179
|
+
_this2 = _callSuper(this, ClearButton2, [].concat(args));
|
|
180
|
+
_defineProperty(_this2, "triggerRef", /* @__PURE__ */ React.createRef());
|
|
181
|
+
return _this2;
|
|
181
182
|
}
|
|
182
183
|
_inherits(ClearButton2, _Component3);
|
|
183
184
|
return _createClass(ClearButton2, [{
|
|
@@ -185,9 +186,10 @@ var ClearButton = /* @__PURE__ */ (function(_Component3) {
|
|
|
185
186
|
value: function render() {
|
|
186
187
|
var _ref3 = this.asProps, _ref7, _ref9, _ref0;
|
|
187
188
|
var SFilterTrigger = BaseTrigger;
|
|
188
|
-
var _this$
|
|
189
|
+
var _this$asProps6 = this.asProps, styles = _this$asProps6.styles, empty = _this$asProps6.empty, size = _this$asProps6.size, disabled = _this$asProps6.disabled, getI18nText = _this$asProps6.getI18nText, ariaLabel = _this$asProps6["aria-label"], title = _this$asProps6.title;
|
|
189
190
|
if (empty) return null;
|
|
190
|
-
return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(
|
|
191
|
+
return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SFilterTrigger, _ref7.cn("SFilterTrigger", _objectSpread({}, assignProps({
|
|
192
|
+
"ref": this.triggerRef,
|
|
191
193
|
"size": size,
|
|
192
194
|
"empty": empty,
|
|
193
195
|
"selected": true,
|
|
@@ -196,7 +198,9 @@ var ClearButton = /* @__PURE__ */ (function(_Component3) {
|
|
|
196
198
|
"__excludeProps": ["title"]
|
|
197
199
|
}, _ref3))), /* @__PURE__ */ React.createElement(FilterTrigger.Addon, {
|
|
198
200
|
tag: Close
|
|
199
|
-
}))
|
|
201
|
+
})), /* @__PURE__ */ React.createElement(Hint, _ref7.cn("Hint", {
|
|
202
|
+
"triggerRef": this.triggerRef
|
|
203
|
+
}), (_ref0 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref0 !== void 0 ? _ref0 : getI18nText("clear")));
|
|
200
204
|
}
|
|
201
205
|
}]);
|
|
202
206
|
})(Component);
|
|
@@ -207,7 +211,8 @@ function Counter(_ref1) {
|
|
|
207
211
|
var styles = _ref1.styles, Children = _ref1.Children, count = _ref1.count, getI18nText = _ref1.getI18nText;
|
|
208
212
|
var SCounter = BaseTrigger.Addon;
|
|
209
213
|
return _ref8 = sstyled(styles), /* @__PURE__ */ React.createElement(SCounter, _ref8.cn("SCounter", _objectSpread({}, assignProps({
|
|
210
|
-
"tag":
|
|
214
|
+
"tag": SemcoreCounter,
|
|
215
|
+
"theme": "info"
|
|
211
216
|
}, _ref4))), count !== void 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, count, /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref8.cn("ScreenReaderOnly", {}), getI18nText("BaseTrigger.FilterTrigger.Counter.selected:aria-label"))) : /* @__PURE__ */ React.createElement(Children, _ref8.cn("Children", {})));
|
|
212
217
|
}
|
|
213
218
|
var FilterTrigger = createComponent(RootFilterTrigger, {
|
package/lib/esm/LinkTrigger.mjs
CHANGED
|
@@ -1,38 +1,16 @@
|
|
|
1
|
-
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
1
|
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
3
2
|
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
4
3
|
import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
5
4
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
5
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
|
-
import {
|
|
6
|
+
import { assignProps, Component, createComponent } from "@semcore/core";
|
|
7
|
+
import { ButtonLink } from "@semcore/button";
|
|
8
8
|
import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
|
|
9
|
-
import
|
|
10
|
-
import
|
|
9
|
+
import { findAllComponents } from "@semcore/core/lib/utils/findComponent";
|
|
10
|
+
import ChevronDownL from "@semcore/icon/ChevronDown/l";
|
|
11
11
|
import ChevronDown from "@semcore/icon/ChevronDown/m";
|
|
12
12
|
import Spin from "@semcore/spin";
|
|
13
13
|
import React from "react";
|
|
14
|
-
/*!__reshadow-styles__:"./style/link-trigger.shadow.css"*/
|
|
15
|
-
var style = (
|
|
16
|
-
/*__reshadow_css_start__*/
|
|
17
|
-
(sstyled.insert(
|
|
18
|
-
/*__inner_css_start__*/
|
|
19
|
-
".___SLinkTrigger_bz474_gg_{display:inline-flex;align-items:center;line-height:normal;position:relative;touch-action:manipulation;white-space:nowrap;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;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, rgb(35, 95, 226));background:0 0;transition:color .15s ease-in-out;border:0}.___SLinkTrigger_bz474_gg_.__active_bz474_gg_,.___SLinkTrigger_bz474_gg_:active{color:var(--intergalactic-text-link-hover-active, rgb(33, 89, 215))}@media (hover:hover){.___SLinkTrigger_bz474_gg_:hover{color:var(--intergalactic-text-link-hover-active, rgb(33, 89, 215))}}.___SLinkTrigger_bz474_gg_.__active_bz474_gg_ .___SText_bz474_gg_,.___SLinkTrigger_bz474_gg_:active .___SText_bz474_gg_{border-color:currentColor}@media (hover:hover){.___SLinkTrigger_bz474_gg_:hover .___SText_bz474_gg_{border-color:currentColor}}.___SLinkTrigger_bz474_gg_ .___SText_bz474_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_bz474_gg_.__color_bz474_gg_{color:var(--color_bz474)}@media (hover:hover){.___SLinkTrigger_bz474_gg_.__color_bz474_gg_:hover{filter:brightness(.8)}}.___SLinkTrigger_bz474_gg_.__disabled_bz474_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);cursor:default;pointer-events:none}.___SAddon_bz474_gg_,.___SLinkAddon_bz474_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:var(--intergalactic-spacing-05x, 2px)}.___SAddon_bz474_gg_:not(:only-child):first-child,.___SLinkAddon_bz474_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-1x, 4px)}.___SAddon_bz474_gg_:not(:only-child):last-child,.___SLinkAddon_bz474_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-1x, 4px)}.___SLinkAddon_bz474_gg_{width:16px;height:16px}.___SLinkTrigger_bz474_gg_._size_m_bz474_gg_{font-size:var(--intergalactic-fs-200, 14px)}.___SLinkTrigger_bz474_gg_._size_l_bz474_gg_{font-size:var(--intergalactic-fs-300, 16px)}@media (prefers-reduced-motion){.___SLinkTrigger_bz474_gg_,.___SLinkTrigger_bz474_gg_ .___SText_bz474_gg_{transition:none}}",
|
|
20
|
-
/*__inner_css_end__*/
|
|
21
|
-
"bz474_gg_"
|
|
22
|
-
), /*__reshadow_css_end__*/
|
|
23
|
-
{
|
|
24
|
-
"__SLinkTrigger": "___SLinkTrigger_bz474_gg_",
|
|
25
|
-
"_disabled": "__disabled_bz474_gg_",
|
|
26
|
-
"__SLinkAddon": "___SLinkAddon_bz474_gg_",
|
|
27
|
-
"_size_m": "_size_m_bz474_gg_",
|
|
28
|
-
"_size_l": "_size_l_bz474_gg_",
|
|
29
|
-
"_active": "__active_bz474_gg_",
|
|
30
|
-
"__SText": "___SText_bz474_gg_",
|
|
31
|
-
"_color": "__color_bz474_gg_",
|
|
32
|
-
"--color": "--color_bz474",
|
|
33
|
-
"__SAddon": "___SAddon_bz474_gg_"
|
|
34
|
-
})
|
|
35
|
-
);
|
|
36
14
|
var RootLinkTrigger = /* @__PURE__ */ (function(_Component) {
|
|
37
15
|
function RootLinkTrigger2() {
|
|
38
16
|
_classCallCheck(this, RootLinkTrigger2);
|
|
@@ -41,56 +19,39 @@ var RootLinkTrigger = /* @__PURE__ */ (function(_Component) {
|
|
|
41
19
|
_inherits(RootLinkTrigger2, _Component);
|
|
42
20
|
return _createClass(RootLinkTrigger2, [{
|
|
43
21
|
key: "getTextProps",
|
|
44
|
-
value: function getTextProps() {
|
|
45
|
-
var _this$asProps = this.asProps, placeholder = _this$asProps.placeholder, empty = _this$asProps.empty;
|
|
22
|
+
value: function getTextProps(props) {
|
|
23
|
+
var _this$asProps = this.asProps, placeholder = _this$asProps.placeholder, empty = _this$asProps.empty, Children = _this$asProps.Children, size = _this$asProps.size;
|
|
24
|
+
var content = empty ? placeholder : props.children;
|
|
25
|
+
var addons = findAllComponents(Children, [LinkTrigger.Addon.displayName]);
|
|
26
|
+
var addonWidth = size >= 600 ? 28 : 20;
|
|
46
27
|
return {
|
|
47
|
-
|
|
48
|
-
empty
|
|
28
|
+
"use:children": content,
|
|
29
|
+
empty,
|
|
30
|
+
"w": "calc(100% - ".concat(addonWidth * (addons.length + 1), "px)")
|
|
49
31
|
};
|
|
50
32
|
}
|
|
51
33
|
}, {
|
|
52
34
|
key: "render",
|
|
53
35
|
value: function render() {
|
|
54
|
-
var _ref = this.asProps
|
|
55
|
-
var SLinkTrigger =
|
|
36
|
+
var _ref = this.asProps;
|
|
37
|
+
var SLinkTrigger = ButtonLink;
|
|
56
38
|
var SLinkAddon = LinkTrigger.Addon;
|
|
57
|
-
var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, loading = _this$asProps2.loading,
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
"
|
|
62
|
-
"
|
|
63
|
-
|
|
64
|
-
}, _ref))), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /* @__PURE__ */ React.createElement(SLinkAddon, _ref4.cn("SLinkAddon", {}), loading ? /* @__PURE__ */ React.createElement(Spin, _ref4.cn("Spin", {
|
|
65
|
-
"size": "xs",
|
|
66
|
-
"theme": "currentColor"
|
|
67
|
-
})) : /* @__PURE__ */ React.createElement(ChevronDown, _ref4.cn("ChevronDown", {}))));
|
|
39
|
+
var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, loading = _this$asProps2.loading, empty = _this$asProps2.empty, disabled = _this$asProps2.disabled, size = _this$asProps2.size;
|
|
40
|
+
return /* @__PURE__ */ React.createElement(SLinkTrigger, assignProps({
|
|
41
|
+
"use:disabled": disabled || loading
|
|
42
|
+
}, _ref), addonTextChildren(Children, LinkTrigger.Text, LinkTrigger.Addon, empty), /* @__PURE__ */ React.createElement(SLinkAddon, null, loading ? /* @__PURE__ */ React.createElement(Spin, {
|
|
43
|
+
size: size >= 600 ? "s" : "xs",
|
|
44
|
+
theme: "currentColor"
|
|
45
|
+
}) : size >= 600 ? /* @__PURE__ */ React.createElement(ChevronDownL, null) : /* @__PURE__ */ React.createElement(ChevronDown, null)));
|
|
68
46
|
}
|
|
69
47
|
}]);
|
|
70
48
|
})(Component);
|
|
71
49
|
_defineProperty(RootLinkTrigger, "displayName", "LinkTrigger");
|
|
72
|
-
_defineProperty(RootLinkTrigger, "style", style);
|
|
73
|
-
_defineProperty(RootLinkTrigger, "defaultProps", {
|
|
74
|
-
size: "m"
|
|
75
|
-
});
|
|
76
|
-
_defineProperty(RootLinkTrigger, "enhance", [resolveColorEnhance()]);
|
|
77
|
-
function Text(props) {
|
|
78
|
-
var _ref2 = arguments[0], _ref5;
|
|
79
|
-
var SText = Box;
|
|
80
|
-
var children = props.children, styles = props.styles, empty = props.empty, placeholder = props.placeholder;
|
|
81
|
-
return _ref5 = sstyled(styles), /* "use:" prefix was used for backward compatibility (by lsroman) */
|
|
82
|
-
/* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", _objectSpread({}, assignProps({
|
|
83
|
-
"display-placeholder": empty
|
|
84
|
-
}, _ref2))), empty ? placeholder : children);
|
|
85
|
-
}
|
|
86
|
-
function Addon(props) {
|
|
87
|
-
var _ref3 = arguments[0], _ref6;
|
|
88
|
-
var SAddon = Box;
|
|
89
|
-
return _ref6 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SAddon, _ref6.cn("SAddon", _objectSpread({}, assignProps({}, _ref3))));
|
|
90
|
-
}
|
|
91
50
|
var LinkTrigger = createComponent(RootLinkTrigger, {
|
|
92
|
-
Text,
|
|
93
|
-
Addon
|
|
51
|
+
Text: ButtonLink.Text,
|
|
52
|
+
Addon: ButtonLink.Addon
|
|
53
|
+
}, {
|
|
54
|
+
parent: ButtonLink
|
|
94
55
|
});
|
|
95
56
|
export {
|
|
96
57
|
LinkTrigger as default
|
|
@@ -36,7 +36,7 @@ SBaseTrigger {
|
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
&:focus-visible {
|
|
39
|
-
border: 1px solid var(--intergalactic-border-info-active, oklch(0.
|
|
39
|
+
border: 1px solid var(--intergalactic-border-info-active, oklch(0.7 0.131 275.2));
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
&:hover {
|
|
@@ -45,7 +45,7 @@ SBaseTrigger {
|
|
|
45
45
|
|
|
46
46
|
&:active,
|
|
47
47
|
&[active] {
|
|
48
|
-
border-color: var(--intergalactic-border-info-active, oklch(0.
|
|
48
|
+
border-color: var(--intergalactic-border-info-active, oklch(0.7 0.131 275.2));
|
|
49
49
|
background-color: var(--intergalactic-bg-primary-neutral, oklch(1 0 0));
|
|
50
50
|
}
|
|
51
51
|
}
|
|
@@ -164,11 +164,11 @@ SText[display-placeholder] {
|
|
|
164
164
|
}
|
|
165
165
|
|
|
166
166
|
SBaseTrigger[state='valid'] {
|
|
167
|
-
border-color: var(--intergalactic-border-success-active, oklch(0.
|
|
167
|
+
border-color: var(--intergalactic-border-success-active, oklch(0.7 0.166 170));
|
|
168
168
|
}
|
|
169
169
|
|
|
170
170
|
SBaseTrigger[state='invalid'] {
|
|
171
|
-
border-color: var(--intergalactic-border-critical-active, oklch(0.
|
|
171
|
+
border-color: var(--intergalactic-border-critical-active, oklch(0.7 0.21 23));
|
|
172
172
|
|
|
173
173
|
&:focus-visible {
|
|
174
174
|
outline-color: var(--intergalactic-keyboard-focus-invalid-outline, oklch(0.628 0.257 28.9 / 0.652));
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
SFilterTrigger[selected] {
|
|
2
|
-
border-color: var(--intergalactic-border-info-active, oklch(0.
|
|
2
|
+
border-color: var(--intergalactic-border-info-active, oklch(0.7 0.131 275.2));
|
|
3
3
|
background-color: var(--intergalactic-control-secondary-info, oklch(0.527 0.264 262.9 / 0.039));
|
|
4
4
|
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
5
5
|
|
|
@@ -20,7 +20,3 @@ SWrapper {
|
|
|
20
20
|
outline: none;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
|
-
|
|
24
|
-
SCounter {
|
|
25
|
-
background-color: var(--intergalactic-bg-primary-info, oklch(0.64 0.152 276.7));
|
|
26
|
-
}
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components';
|
|
2
|
+
import type { ButtonLinkProps, ButtonLink } from '@semcore/button';
|
|
3
|
+
import type { Intergalactic } from '@semcore/core';
|
|
2
4
|
import type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance';
|
|
3
|
-
import type {
|
|
4
|
-
import type {
|
|
5
|
-
import type { NeighborItemProps } from '@semcore/neighbor-location';
|
|
5
|
+
import type { CounterProps } from '@semcore/counter';
|
|
6
|
+
import type { Text } from '@semcore/typography';
|
|
6
7
|
import type React from 'react';
|
|
7
8
|
|
|
8
|
-
/** @deprecated */
|
|
9
|
-
export interface IBaseTriggerProps extends BaseTriggerProps, UnknownProperties {}
|
|
10
9
|
export type BaseTriggerProps = BoxProps &
|
|
11
10
|
NeighborItemProps &
|
|
12
11
|
WithAnimatedSizeEnhanceProps & {
|
|
@@ -35,15 +34,8 @@ export type BaseTriggerProps = BoxProps &
|
|
|
35
34
|
* Sets disabled state to trigger
|
|
36
35
|
*/
|
|
37
36
|
disabled?: boolean;
|
|
38
|
-
/** Trigger theme
|
|
39
|
-
* @deprecated
|
|
40
|
-
* @use IBaseTriggerProps.state
|
|
41
|
-
* */
|
|
42
|
-
theme?: 'normal' | 'valid' | 'invalid' | false;
|
|
43
37
|
};
|
|
44
38
|
|
|
45
|
-
/** @deprecated */
|
|
46
|
-
export interface IButtonTriggerProps extends ButtonTriggerProps, UnknownProperties {}
|
|
47
39
|
export type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {
|
|
48
40
|
/** Sets the loading state */
|
|
49
41
|
loading?: boolean;
|
|
@@ -54,17 +46,15 @@ export type ButtonTriggerProps = Omit<BaseTriggerProps, 'theme'> & {
|
|
|
54
46
|
chevron?: boolean;
|
|
55
47
|
};
|
|
56
48
|
|
|
57
|
-
|
|
58
|
-
export interface ILinkTriggerProps extends LinkTriggerProps, UnknownProperties {}
|
|
59
|
-
export type LinkTriggerProps = Omit<BaseTriggerProps, 'theme'> & {
|
|
49
|
+
export type LinkTriggerProps = ButtonLinkProps & {
|
|
60
50
|
/** Sets the loading state */
|
|
61
51
|
loading?: boolean;
|
|
62
|
-
/**
|
|
63
|
-
|
|
52
|
+
/** Placeholder text */
|
|
53
|
+
placeholder?: React.ReactNode;
|
|
54
|
+
/** Responsible for placeholder displaying */
|
|
55
|
+
empty?: boolean;
|
|
64
56
|
};
|
|
65
57
|
|
|
66
|
-
/** @deprecated */
|
|
67
|
-
export interface IFilterTriggerProps extends FilterTriggerProps, UnknownProperties {}
|
|
68
58
|
export type FilterTriggerProps = BaseTriggerProps & {
|
|
69
59
|
/** Click on the filter cleaning cross */
|
|
70
60
|
onClear?: (event: React.SyntheticEvent) => void;
|
|
@@ -82,7 +72,7 @@ export type FilterTriggerCounterProps = {
|
|
|
82
72
|
};
|
|
83
73
|
|
|
84
74
|
declare const BaseTrigger: Intergalactic.Component<'div', BaseTriggerProps> & {
|
|
85
|
-
Text: typeof
|
|
75
|
+
Text: typeof Text;
|
|
86
76
|
Addon: typeof Box;
|
|
87
77
|
};
|
|
88
78
|
|
|
@@ -92,14 +82,14 @@ declare const ButtonTrigger: Intergalactic.Component<'div', ButtonTriggerProps>
|
|
|
92
82
|
};
|
|
93
83
|
|
|
94
84
|
declare const LinkTrigger: Intergalactic.Component<'div', LinkTriggerProps> & {
|
|
95
|
-
Text: typeof
|
|
96
|
-
Addon: typeof
|
|
85
|
+
Text: typeof ButtonLink.Text;
|
|
86
|
+
Addon: typeof ButtonLink.Addon;
|
|
97
87
|
};
|
|
98
88
|
|
|
99
89
|
declare const FilterTrigger: Intergalactic.Component<'div', FilterTriggerProps> & {
|
|
100
90
|
Text: typeof BaseTrigger.Text;
|
|
101
91
|
Addon: typeof BaseTrigger.Addon;
|
|
102
|
-
Counter: Intergalactic.Component<'div',
|
|
92
|
+
Counter: Intergalactic.Component<'div', CounterProps & FilterTriggerCounterProps>;
|
|
103
93
|
TriggerButton: typeof BaseTrigger;
|
|
104
94
|
ClearButton: typeof BaseTrigger;
|
|
105
95
|
};
|