@semcore/base-trigger 4.54.0-prerelease.5 → 4.54.0-prerelease.6

package/lib/esm/BaseTrigger.mjs

@@ -1,96 +1,92 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
-import { Box, InvalidStateBox, NeighborLocation } from "@semcore/base-components";
-import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
-import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
-import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
-import { Text as Text$1 } from "@semcore/typography";
+import { sstyled } from "@semcore/utils/lib/core/index";
+import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
 import React from "react";
+import { Box, InvalidStateBox } from "@semcore/flex-box";
+import NeighborLocation from "@semcore/neighbor-location";
+import keyboardFocusEnhance from "@semcore/utils/lib/enhances/keyboardFocusEnhance";
+import addonTextChildren from "@semcore/utils/lib/addonTextChildren";
+import logger from "@semcore/utils/lib/logger";
+import animatedSizeEnhance from "@semcore/utils/lib/enhances/animatedSizeEnhance";
+import { cssVariableEnhance } from "@semcore/utils/lib/useCssVariable";
 /*!__reshadow-styles__:"./style/base-trigger.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SBaseTrigger_10iri_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_10iri_gg_{border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SBaseTrigger_10iri_gg_{border:1px solid var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBaseTrigger_10iri_gg_::-moz-focus-inner{border:0;padding:0}.___SBaseTrigger_10iri_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___SBaseTrigger_10iri_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___SBaseTrigger_10iri_gg_:focus-visible{border:1px solid var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419))}@media (hover:hover){.___SBaseTrigger_10iri_gg_:hover{background-color:var(--intergalactic-bg-primary-neutral-hover, rgb(248, 249, 248))}}.___SBaseTrigger_10iri_gg_.__active_10iri_gg_,.___SBaseTrigger_10iri_gg_:active{border-color:var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419));background-color:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255))}.___SBaseTrigger_10iri_gg_.__disabled_10iri_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);cursor:default;pointer-events:none}.___SInner_10iri_gg_{display:inline-flex;align-items:center;justify-content:center;height:100%;width:100%}.___SText_10iri_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_10iri_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.___SBaseAddon_10iri_gg_{width:12px;height:12px}.___SBaseTrigger_10iri_gg_._size_m_10iri_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_10iri_gg_._size_m_10iri_gg_ .___SAddon_10iri_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_10iri_gg_._size_m_10iri_gg_ .___SAddon_10iri_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_10iri_gg_._size_l_10iri_gg_ .___SAddon_10iri_gg_:only-child,.___SBaseTrigger_10iri_gg_._size_m_10iri_gg_ .___SAddon_10iri_gg_:only-child{margin-left:calc(-1*var(--intergalactic-spacing-1x, 4px));margin-right:calc(-1*var(--intergalactic-spacing-1x, 4px))}.___SBaseTrigger_10iri_gg_._size_l_10iri_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_10iri_gg_._size_l_10iri_gg_ .___SAddon_10iri_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_10iri_gg_._size_l_10iri_gg_ .___SAddon_10iri_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_10iri_gg_._neighborLocation_right_10iri_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SBaseTrigger_10iri_gg_._neighborLocation_both_10iri_gg_{border-radius:0;margin-left:-1px}.___SBaseTrigger_10iri_gg_._neighborLocation_left_10iri_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.___SBaseTrigger_10iri_gg_._neighborLocation_left_10iri_gg_.__disabled_10iri_gg_{border-left:none;margin-left:0}.___SText_10iri_gg_.__display-placeholder_10iri_gg_{color:var(--intergalactic-text-placeholder, rgba(0, 5, 2, 0.457))}.___SBaseTrigger_10iri_gg_._state_valid_10iri_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 204, 154))}@supports (color:color(display-p3 0 0 0%)){.___SBaseTrigger_10iri_gg_._state_valid_10iri_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 204, 154))}@media (color-gamut:p3){.___SBaseTrigger_10iri_gg_._state_valid_10iri_gg_{border-color:var(--intergalactic-border-success-active, color(display-p3 0.36013 0.78771 0.61714))}}}.___SBaseTrigger_10iri_gg_._state_invalid_10iri_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56))}@supports (color:color(display-p3 0 0 0%)){.___SBaseTrigger_10iri_gg_._state_invalid_10iri_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56))}@media (color-gamut:p3){.___SBaseTrigger_10iri_gg_._state_invalid_10iri_gg_{border-color:var(--intergalactic-border-critical-active, color(display-p3 0.918 0.19866 0.14259 / 0.56))}}}.___SBaseTrigger_10iri_gg_._state_invalid_10iri_gg_:focus-visible{outline-color:var(--intergalactic-keyboard-focus-invalid-outline, rgba(255, 2, 7, 0.652))}.___SInvalidPattern_10iri_gg_._size_m_10iri_gg_{margin-left:calc(-1*var(--intergalactic-spacing-2x, 8px))}.___SInvalidPattern_10iri_gg_._size_l_10iri_gg_{margin-left:calc(-1*var(--intergalactic-spacing-3x, 12px))}",
+    ".___SBaseTrigger_xji3i_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;outline:0;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_xji3i_gg_{border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SBaseTrigger_xji3i_gg_{border:1px solid var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBaseTrigger_xji3i_gg_::-moz-focus-inner{border:0;padding:0}.___SBaseTrigger_xji3i_gg_:active,.___SBaseTrigger_xji3i_gg_:focus{outline:0;-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___SBaseTrigger_xji3i_gg_:hover{outline:0;-webkit-text-decoration:none;text-decoration:none}}.___SBaseTrigger_xji3i_gg_.__keyboardFocused_xji3i_gg_{border:1px solid var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419));box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 33, 220, 0.469));z-index:1}@supports (color:color(display-p3 0 0 0)){.___SBaseTrigger_xji3i_gg_.__keyboardFocused_xji3i_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 33, 220, 0.469))}@media (color-gamut:p3){.___SBaseTrigger_xji3i_gg_.__keyboardFocused_xji3i_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px color(display-p3 0.03256 0.12227 0.83249 / 0.469))}}}@media (hover:hover){.___SBaseTrigger_xji3i_gg_:hover{background-color:var(--intergalactic-bg-primary-neutral-hover, rgb(248, 249, 248))}}.___SBaseTrigger_xji3i_gg_.__active_xji3i_gg_,.___SBaseTrigger_xji3i_gg_:active{border-color:var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419));background-color:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255))}.___SBaseTrigger_xji3i_gg_.__disabled_xji3i_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);cursor:default;pointer-events:none}.___SInner_xji3i_gg_{display:inline-flex;align-items:center;justify-content:center;height:100%;width:100%}.___SText_xji3i_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_xji3i_gg_{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.___SBaseAddon_xji3i_gg_{width:12px;height:12px}.___SBaseTrigger_xji3i_gg_._size_m_xji3i_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_xji3i_gg_._size_m_xji3i_gg_ .___SAddon_xji3i_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_xji3i_gg_._size_m_xji3i_gg_ .___SAddon_xji3i_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_xji3i_gg_._size_l_xji3i_gg_ .___SAddon_xji3i_gg_:only-child,.___SBaseTrigger_xji3i_gg_._size_m_xji3i_gg_ .___SAddon_xji3i_gg_:only-child{margin-left:calc(-1*var(--intergalactic-spacing-1x, 4px));margin-right:calc(-1*var(--intergalactic-spacing-1x, 4px))}.___SBaseTrigger_xji3i_gg_._size_l_xji3i_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_xji3i_gg_._size_l_xji3i_gg_ .___SAddon_xji3i_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_xji3i_gg_._size_l_xji3i_gg_ .___SAddon_xji3i_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SBaseTrigger_xji3i_gg_._neighborLocation_right_xji3i_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SBaseTrigger_xji3i_gg_._neighborLocation_both_xji3i_gg_{border-radius:0;margin-left:-1px}.___SBaseTrigger_xji3i_gg_._neighborLocation_left_xji3i_gg_{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.___SText_xji3i_gg_.__display-placeholder_xji3i_gg_{color:var(--intergalactic-text-placeholder, rgba(0, 5, 2, 0.457))}.___SBaseTrigger_xji3i_gg_._state_valid_xji3i_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 204, 154))}@supports (color:color(display-p3 0 0 0)){.___SBaseTrigger_xji3i_gg_._state_valid_xji3i_gg_{border-color:var(--intergalactic-border-success-active, rgb(0, 204, 154))}@media (color-gamut:p3){.___SBaseTrigger_xji3i_gg_._state_valid_xji3i_gg_{border-color:var(--intergalactic-border-success-active, color(display-p3 0.36013 0.78771 0.61714))}}}.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56))}@supports (color:color(display-p3 0 0 0)){.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56))}@media (color-gamut:p3){.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, color(display-p3 0.918 0.19866 0.14259 / 0.56))}}}.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_.__keyboardFocused_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56));box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 2, 7, 0.652))}@supports (color:color(display-p3 0 0 0)){.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_.__keyboardFocused_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, rgba(255, 0, 4, 0.56))}@media (color-gamut:p3){.___SBaseTrigger_xji3i_gg_._state_invalid_xji3i_gg_.__keyboardFocused_xji3i_gg_{border-color:var(--intergalactic-border-critical-active, color(display-p3 0.918 0.19866 0.14259 / 0.56))}}}.___SInvalidPattern_xji3i_gg_._size_m_xji3i_gg_{margin-left:calc(-1*var(--intergalactic-spacing-2x, 8px))}.___SInvalidPattern_xji3i_gg_._size_l_xji3i_gg_{margin-left:calc(-1*var(--intergalactic-spacing-3x, 12px))}",
     /*__inner_css_end__*/
-    "10iri_gg_"
+    "xji3i_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SBaseTrigger": "___SBaseTrigger_10iri_gg_",
-    "_disabled": "__disabled_10iri_gg_",
-    "__SInner": "___SInner_10iri_gg_",
-    "__SText": "___SText_10iri_gg_",
-    "__SAddon": "___SAddon_10iri_gg_",
-    "__SBaseAddon": "___SBaseAddon_10iri_gg_",
-    "_neighborLocation_right": "_neighborLocation_right_10iri_gg_",
-    "_neighborLocation_both": "_neighborLocation_both_10iri_gg_",
-    "_display-placeholder": "__display-placeholder_10iri_gg_",
-    "_state_valid": "_state_valid_10iri_gg_",
-    "__SInvalidPattern": "___SInvalidPattern_10iri_gg_",
-    "_size_m": "_size_m_10iri_gg_",
-    "_size_l": "_size_l_10iri_gg_",
-    "_active": "__active_10iri_gg_",
-    "_neighborLocation_left": "_neighborLocation_left_10iri_gg_",
-    "_state_invalid": "_state_invalid_10iri_gg_"
+    "__SBaseTrigger": "___SBaseTrigger_xji3i_gg_",
+    "_disabled": "__disabled_xji3i_gg_",
+    "__SInner": "___SInner_xji3i_gg_",
+    "__SText": "___SText_xji3i_gg_",
+    "__SAddon": "___SAddon_xji3i_gg_",
+    "__SBaseAddon": "___SBaseAddon_xji3i_gg_",
+    "_neighborLocation_right": "_neighborLocation_right_xji3i_gg_",
+    "_neighborLocation_both": "_neighborLocation_both_xji3i_gg_",
+    "_neighborLocation_left": "_neighborLocation_left_xji3i_gg_",
+    "_display-placeholder": "__display-placeholder_xji3i_gg_",
+    "_state_valid": "_state_valid_xji3i_gg_",
+    "__SInvalidPattern": "___SInvalidPattern_xji3i_gg_",
+    "_size_m": "_size_m_xji3i_gg_",
+    "_size_l": "_size_l_xji3i_gg_",
+    "_keyboardFocused": "__keyboardFocused_xji3i_gg_",
+    "_active": "__active_xji3i_gg_",
+    "_state_invalid": "_state_invalid_xji3i_gg_"
   })
 );
-var RootBaseTrigger = /* @__PURE__ */ (function(_Component) {
+var RootBaseTrigger = /* @__PURE__ */ function(_Component) {
+  _inherits(RootBaseTrigger2, _Component);
+  var _super = _createSuper(RootBaseTrigger2);
   function RootBaseTrigger2() {
-    var _this;
     _classCallCheck(this, RootBaseTrigger2);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, RootBaseTrigger2, [].concat(args));
-    _defineProperty(_this, "triggerRef", /* @__PURE__ */ React.createRef());
-    return _this;
+    return _super.apply(this, arguments);
   }
-  _inherits(RootBaseTrigger2, _Component);
-  return _createClass(RootBaseTrigger2, [{
+  _createClass(RootBaseTrigger2, [{
     key: "getTextProps",
     value: function getTextProps() {
       var _this$asProps = this.asProps, placeholder = _this$asProps.placeholder, empty = _this$asProps.empty;
       return {
         placeholder,
-        empty,
-        triggerRef: this.triggerRef
+        empty
       };
     }
   }, {
     key: "render",
     value: function render() {
-      var _ref = this.asProps, _this2 = this;
+      var _ref = this.asProps;
       var SBaseTrigger = Box;
       var SInner = "span";
       var SInvalidPattern = InvalidStateBox;
       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;
+      logger.warn(theme !== void 0, "The 'theme' property is deprecated, use 'state'", this.asProps["data-ui-name"] || BaseTrigger.displayName);
       return /* @__PURE__ */ React.createElement(NeighborLocation.Detect, {
         neighborLocation
       }, function(neighborLocation2) {
         var _ref4;
-        return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(SBaseTrigger, _ref4.cn("SBaseTrigger", _objectSpread({}, assignProps({
+        return _ref4 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SBaseTrigger, _ref4.cn("SBaseTrigger", _objectSpread({}, assignProps({
           "tag": "button",
           "type": "button",
-          "tabIndex": 0,
           "neighborLocation": neighborLocation2,
-          "state": theme,
-          "ref": _this2.triggerRef
+          "state": theme
         }, _ref))), state === "invalid" && /* @__PURE__ */ React.createElement(SInvalidPattern, _ref4.cn("SInvalidPattern", {
           "size": size
-        })), /* @__PURE__ */ React.createElement(SInner, _ref4.cn("SInner", {
-          "data-ui-name": "".concat(_this2.asProps["data-ui-name"], ".InnerTriggerWrapper")
-        }), addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)));
+        })), /* @__PURE__ */ React.createElement(SInner, _ref4.cn("SInner", {}), addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)));
       });
     }
   }]);
-})(Component);
+  return RootBaseTrigger2;
+}(Component);
 _defineProperty(RootBaseTrigger, "displayName", "BaseTrigger");
-_defineProperty(RootBaseTrigger, "enhance", [cssVariableEnhance({
+_defineProperty(RootBaseTrigger, "enhance", [keyboardFocusEnhance(), cssVariableEnhance({
   variable: "--intergalactic-duration-control",
   fallback: "200",
   map: Number.parseInt,
@@ -106,23 +102,18 @@ _defineProperty(RootBaseTrigger, "defaultProps", {
 });
 function Text(props) {
   var _ref2 = arguments[0], _ref5;
-  var SText = Text$1;
-  var textRef = React.useRef();
-  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;
-  var content = empty ? placeholder : children;
-  return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", _objectSpread({}, assignProps({
+  var SText = Box;
+  var children = props.children, styles = props.styles, empty = props.empty, placeholder = props.placeholder;
+  return _ref5 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SText, _ref5.cn("SText", _objectSpread({}, assignProps({
     "display-placeholder": empty,
-    "aria-hidden": empty,
-    "ref": textRef,
-    "ellipsis": ellipsis,
-    "hint:triggerRef": triggerRef
-  }, _ref2))), content));
+    "aria-hidden": empty
+  }, _ref2))), empty ? placeholder : children);
 }
 function Addon(props) {
   var _ref3 = arguments[0], _ref6;
   var SAddon = Box;
   var styles = props.styles;
-  return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SAddon, _ref6.cn("SAddon", _objectSpread({}, assignProps({}, _ref3))));
+  return _ref6 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SAddon, _ref6.cn("SAddon", _objectSpread({}, assignProps({}, _ref3))));
 }
 var BaseTrigger = createComponent(RootBaseTrigger, {
   Text,

package/lib/esm/ButtonTrigger.mjs

@@ -1,37 +1,39 @@
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
-import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
-import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
-import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
-import ChevronDown from "@semcore/icon/ChevronDown/m";
-import Spin from "@semcore/spin";
+import { sstyled } from "@semcore/utils/lib/core/index";
+import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
 import React from "react";
+import addonTextChildren from "@semcore/utils/lib/addonTextChildren";
+import ChevronDown from "@semcore/icon/ChevronDown/m";
 import BaseTrigger from "./BaseTrigger.mjs";
+import Spin from "@semcore/spin";
+import animatedSizeEnhance from "@semcore/utils/lib/enhances/animatedSizeEnhance";
+import { cssVariableEnhance } from "@semcore/utils/lib/useCssVariable";
 /*!__reshadow-styles__:"./style/button-trigger.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SButtonAddon_rlrw5_gg_{width:12px;height:12px}.___SButtonTriggerSpin_rlrw5_gg_{fill:var(--intergalactic-icon-primary-neutral, rgba(0, 4, 1, 0.526))}",
+    ".___SButtonAddon_148aq_gg_{width:12px;height:12px}.___SButtonTriggerSpin_148aq_gg_{fill:var(--intergalactic-icon-primary-neutral, rgba(0, 4, 1, 0.526))}",
     /*__inner_css_end__*/
-    "rlrw5_gg_"
+    "148aq_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SButtonAddon": "___SButtonAddon_rlrw5_gg_",
-    "__SButtonTriggerSpin": "___SButtonTriggerSpin_rlrw5_gg_"
+    "__SButtonAddon": "___SButtonAddon_148aq_gg_",
+    "__SButtonTriggerSpin": "___SButtonTriggerSpin_148aq_gg_"
   })
 );
-var RootButtonTrigger = /* @__PURE__ */ (function(_Component) {
+var RootButtonTrigger = /* @__PURE__ */ function(_Component) {
+  _inherits(RootButtonTrigger2, _Component);
+  var _super = _createSuper(RootButtonTrigger2);
   function RootButtonTrigger2() {
     _classCallCheck(this, RootButtonTrigger2);
-    return _callSuper(this, RootButtonTrigger2, arguments);
+    return _super.apply(this, arguments);
   }
-  _inherits(RootButtonTrigger2, _Component);
-  return _createClass(RootButtonTrigger2, [{
+  _createClass(RootButtonTrigger2, [{
     key: "getTextProps",
     value: function getTextProps() {
       return {
@@ -51,16 +53,15 @@ var RootButtonTrigger = /* @__PURE__ */ (function(_Component) {
       var _ref = this.asProps, _ref2;
       var SButtonAddon = ButtonTrigger.Addon;
       var SButtonTriggerSpin = Spin;
-      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;
-      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(BaseTrigger, assignProps({
-        "use:disabled": disabled || loading
-      }, _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", {
+      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;
+      return _ref2 = sstyled$1(styles), /* @__PURE__ */ React.createElement(BaseTrigger, assignProps({}, _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", {
         "size": "xs",
         "theme": false
       })) : /* @__PURE__ */ React.createElement(ChevronDown, _ref2.cn("ChevronDown", {}))));
     }
   }]);
-})(Component);
+  return RootButtonTrigger2;
+}(Component);
 _defineProperty(RootButtonTrigger, "displayName", "ButtonTrigger");
 _defineProperty(RootButtonTrigger, "style", style);
 _defineProperty(RootButtonTrigger, "enhance", [cssVariableEnhance({

package/lib/esm/FilterTrigger.mjs

@@ -3,69 +3,78 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _callSuper from "@babel/runtime/helpers/esm/callSuper";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
-import { Box, NeighborLocation, Hint, ScreenReaderOnly } from "@semcore/base-components";
-import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
-import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
-import animatedSizeEnhance from "@semcore/core/lib/utils/enhances/animatedSizeEnhance";
-import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
-import { isAdvanceMode } from "@semcore/core/lib/utils/findComponent";
-import getInputProps, { inputProps } from "@semcore/core/lib/utils/inputProps";
-import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
-import { setFocus } from "@semcore/core/lib/utils/use/useFocusLock";
-import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
-import SemcoreCounter from "@semcore/counter";
-import ChevronDown from "@semcore/icon/ChevronDown/m";
-import Close from "@semcore/icon/Close/m";
+import { sstyled } from "@semcore/utils/lib/core/index";
+import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
 import React from "react";
 import BaseTrigger from "./BaseTrigger.mjs";
+import { Box } from "@semcore/flex-box";
+import NeighborLocation from "@semcore/neighbor-location";
+import Dot from "@semcore/dot";
+import Close from "@semcore/icon/Close/m";
+import ChevronDown from "@semcore/icon/ChevronDown/m";
+import { callAllEventHandlers } from "@semcore/utils/lib/assignProps";
+import addonTextChildren from "@semcore/utils/lib/addonTextChildren";
 import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
+import i18nEnhance from "@semcore/utils/lib/enhances/i18nEnhance";
+import animatedSizeEnhance from "@semcore/utils/lib/enhances/animatedSizeEnhance";
+import { cssVariableEnhance } from "@semcore/utils/lib/useCssVariable";
+import getInputProps, { inputProps } from "@semcore/utils/lib/inputProps";
+import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
+import { setFocus } from "@semcore/utils/lib/use/useFocusLock";
+import { isAdvanceMode } from "@semcore/utils/lib/findComponent";
+import { Hint } from "@semcore/tooltip";
+import { ScreenReaderOnly } from "@semcore/utils/lib/ScreenReaderOnly";
 var _excluded = ["empty", "size", "placeholder", "active", "disabled", "includeInputProps", "triggerRef", "data-ui-name"];
 /*!__reshadow-styles__:"./style/filter-trigger.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_{border-color:var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419));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_ylf6h_gg_.__selected_ylf6h_gg_{background-color:var(--intergalactic-control-secondary-info, rgba(0, 81, 255, 0.039))}@media (color-gamut:p3){.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_{background-color:var(--intergalactic-control-secondary-info, color(display-p3 0.12567 0.31309 0.96324 / 0.039))}}}@media (hover:hover){.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_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_ylf6h_gg_.__selected_ylf6h_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, rgba(0, 80, 255, 0.077))}@media (color-gamut:p3){.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, color(display-p3 0.12402 0.30857 0.96259 / 0.077))}}}}.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_.__active_ylf6h_gg_,.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_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_ylf6h_gg_.__selected_ylf6h_gg_.__active_ylf6h_gg_,.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, rgba(1, 79, 255, 0.116))}@media (color-gamut:p3){.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_.__active_ylf6h_gg_,.___SFilterTrigger_ylf6h_gg_.__selected_ylf6h_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, color(display-p3 0.12361 0.30547 0.96332 / 0.116))}}}.___SWrapper_ylf6h_gg_{display:inline-flex}.___SWrapper_ylf6h_gg_:focus{outline:0}",
+    ".___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_{border-color:var(--intergalactic-border-info-active, rgba(0, 40, 230, 0.419));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_1p5nz_gg_.__selected_1p5nz_gg_{background-color:var(--intergalactic-control-secondary-info, rgba(0, 81, 255, 0.039))}@media (color-gamut:p3){.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_{background-color:var(--intergalactic-control-secondary-info, color(display-p3 0.12567 0.31308 0.96324 / 0.039))}}}@media (hover:hover){.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_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_1p5nz_gg_.__selected_1p5nz_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, rgba(0, 80, 255, 0.077))}@media (color-gamut:p3){.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_:hover{background-color:var(--intergalactic-control-secondary-info-hover, color(display-p3 0.12403 0.30857 0.96259 / 0.077))}}}}.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_.__active_1p5nz_gg_,.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_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_1p5nz_gg_.__selected_1p5nz_gg_.__active_1p5nz_gg_,.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, rgba(1, 79, 255, 0.116))}@media (color-gamut:p3){.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_.__active_1p5nz_gg_,.___SFilterTrigger_1p5nz_gg_.__selected_1p5nz_gg_:active{background-color:var(--intergalactic-control-secondary-info-active, color(display-p3 0.12361 0.30547 0.96332 / 0.116))}}}.___SWrapper_1p5nz_gg_{display:inline-flex}.___SWrapper_1p5nz_gg_:focus{outline:0}.___SWrapper_1p5nz_gg_.__keyboardFocused_1p5nz_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 33, 220, 0.469))}@supports (color:color(display-p3 0 0 0)){.___SWrapper_1p5nz_gg_.__keyboardFocused_1p5nz_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 33, 220, 0.469))}@media (color-gamut:p3){.___SWrapper_1p5nz_gg_.__keyboardFocused_1p5nz_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px color(display-p3 0.03256 0.12227 0.83249 / 0.469))}}}.___SCounter_1p5nz_gg_{background-color:var(--intergalactic-bg-primary-info, rgb(118, 128, 231))}",
     /*__inner_css_end__*/
-    "ylf6h_gg_"
+    "1p5nz_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SFilterTrigger": "___SFilterTrigger_ylf6h_gg_",
-    "_selected": "__selected_ylf6h_gg_",
-    "_active": "__active_ylf6h_gg_",
-    "__SWrapper": "___SWrapper_ylf6h_gg_"
+    "__SWrapper": "___SWrapper_1p5nz_gg_",
+    "_keyboardFocused": "__keyboardFocused_1p5nz_gg_",
+    "__SCounter": "___SCounter_1p5nz_gg_",
+    "__SFilterTrigger": "___SFilterTrigger_1p5nz_gg_",
+    "_selected": "__selected_1p5nz_gg_",
+    "_active": "__active_1p5nz_gg_"
   })
 );
 var filterTriggerInputProps = [].concat(_toConsumableArray(inputProps), ["aria-controls", "aria-haspopup", "aria-expanded", "aria-disabled", "aria-activedescendant", "aria-label", "aria-labelledby", "role"]);
-var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
+var RootFilterTrigger = /* @__PURE__ */ function(_Component) {
+  _inherits(RootFilterTrigger2, _Component);
+  var _super = _createSuper(RootFilterTrigger2);
   function RootFilterTrigger2() {
     var _this;
     _classCallCheck(this, RootFilterTrigger2);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _callSuper(this, RootFilterTrigger2, [].concat(args));
-    _defineProperty(_this, "handleStopPropagation", function(e) {
-      if (e.key === "Escape") return;
-      e.stopPropagation();
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "handleStopPropagation", function(e) {
+      return e.stopPropagation();
     });
-    _defineProperty(_this, "handleClear", function() {
+    _defineProperty(_assertThisInitialized(_this), "handleClear", function() {
       requestAnimationFrame(function() {
         setFocus(_this.asProps.triggerRef.current);
       });
     });
     return _this;
   }
-  _inherits(RootFilterTrigger2, _Component);
-  return _createClass(RootFilterTrigger2, [{
+  _createClass(RootFilterTrigger2, [{
     key: "getTriggerButtonProps",
     value: function getTriggerButtonProps() {
-      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);
+      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;
+      _this$asProps["data-ui-name"];
+      var other = _objectWithoutProperties(_this$asProps, _excluded);
       var _getInputProps = getInputProps(other, includeInputProps), _getInputProps2 = _slicedToArray(_getInputProps, 1), controlProps = _getInputProps2[0];
       return _objectSpread({
         size,
@@ -93,10 +102,9 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
   }, {
     key: "getCounterProps",
     value: function getCounterProps() {
-      var _this$asProps3 = this.asProps, getI18nText = _this$asProps3.getI18nText, size = _this$asProps3.size;
+      var getI18nText = this.asProps.getI18nText;
       return {
-        getI18nText,
-        size
+        getI18nText
       };
     }
   }, {
@@ -104,9 +112,9 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
     value: function render() {
       var _ref = this.asProps, _ref5;
       var SWrapper = Box;
-      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;
+      var _this$asProps3 = this.asProps, Children = _this$asProps3.Children, styles = _this$asProps3.styles, getI18nText = _this$asProps3.getI18nText, empty = _this$asProps3.empty, forcedAdvancedMode = _this$asProps3.forcedAdvancedMode;
       var advancedMode = forcedAdvancedMode || isAdvanceMode(Children, [FilterTrigger.TriggerButton.displayName, FilterTrigger.ClearButton.displayName], true);
-      return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SWrapper, _ref5.cn("SWrapper", _objectSpread({}, assignProps({
+      return _ref5 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SWrapper, _ref5.cn("SWrapper", _objectSpread({}, assignProps({
         "aria-label": getI18nText("filter"),
         "__excludeProps": ["id"],
         "use:role": void 0,
@@ -121,7 +129,8 @@ var RootFilterTrigger = /* @__PURE__ */ (function(_Component) {
       }, _ref))), /* @__PURE__ */ React.createElement(NeighborLocation, _ref5.cn("NeighborLocation", {}), advancedMode ? /* @__PURE__ */ React.createElement(Children, _ref5.cn("Children", {})) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FilterTrigger.TriggerButton, null, /* @__PURE__ */ React.createElement(Children, _ref5.cn("Children", {}))), !empty && /* @__PURE__ */ React.createElement(FilterTrigger.ClearButton, null))));
     }
   }]);
-})(Component);
+  return RootFilterTrigger2;
+}(Component);
 _defineProperty(RootFilterTrigger, "displayName", "FilterTrigger");
 _defineProperty(RootFilterTrigger, "style", style);
 _defineProperty(RootFilterTrigger, "enhance", [i18nEnhance(localizedMessages), cssVariableEnhance({
@@ -142,19 +151,20 @@ _defineProperty(RootFilterTrigger, "defaultProps", function() {
     role: "group"
   };
 });
-var TriggerButton = /* @__PURE__ */ (function(_Component2) {
+var TriggerButton = /* @__PURE__ */ function(_Component2) {
+  _inherits(TriggerButton2, _Component2);
+  var _super2 = _createSuper(TriggerButton2);
   function TriggerButton2() {
     _classCallCheck(this, TriggerButton2);
-    return _callSuper(this, TriggerButton2, arguments);
+    return _super2.apply(this, arguments);
   }
-  _inherits(TriggerButton2, _Component2);
-  return _createClass(TriggerButton2, [{
+  _createClass(TriggerButton2, [{
     key: "render",
     value: function render() {
       var _ref2 = this.asProps, _ref6;
       var SFilterTrigger = BaseTrigger;
-      var _this$asProps5 = this.asProps, Children = _this$asProps5.Children, styles = _this$asProps5.styles, empty = _this$asProps5.empty, triggerRef = _this$asProps5.triggerRef;
-      return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SFilterTrigger, _ref6.cn("SFilterTrigger", _objectSpread({}, assignProps({
+      var _this$asProps4 = this.asProps, Children = _this$asProps4.Children, styles = _this$asProps4.styles, empty = _this$asProps4.empty, triggerRef = _this$asProps4.triggerRef;
+      return _ref6 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SFilterTrigger, _ref6.cn("SFilterTrigger", _objectSpread({}, assignProps({
         "use:role": "combobox",
         "w": "100%",
         "empty": empty,
@@ -166,53 +176,45 @@ var TriggerButton = /* @__PURE__ */ (function(_Component2) {
       }));
     }
   }]);
-})(Component);
+  return TriggerButton2;
+}(Component);
 _defineProperty(TriggerButton, "displayName", "TriggerButton");
 _defineProperty(TriggerButton, "style", style);
-var ClearButton = /* @__PURE__ */ (function(_Component3) {
+var ClearButton = /* @__PURE__ */ function(_Component3) {
+  _inherits(ClearButton2, _Component3);
+  var _super3 = _createSuper(ClearButton2);
   function ClearButton2() {
-    var _this2;
     _classCallCheck(this, ClearButton2);
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
-    }
-    _this2 = _callSuper(this, ClearButton2, [].concat(args));
-    _defineProperty(_this2, "triggerRef", /* @__PURE__ */ React.createRef());
-    return _this2;
+    return _super3.apply(this, arguments);
   }
-  _inherits(ClearButton2, _Component3);
-  return _createClass(ClearButton2, [{
+  _createClass(ClearButton2, [{
     key: "render",
     value: function render() {
-      var _ref3 = this.asProps, _ref7, _ref9, _ref0;
+      var _ref3 = this.asProps, _ref7;
       var SFilterTrigger = BaseTrigger;
-      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;
+      var _this$asProps5 = this.asProps, styles = _this$asProps5.styles, empty = _this$asProps5.empty, size = _this$asProps5.size, disabled = _this$asProps5.disabled, getI18nText = _this$asProps5.getI18nText;
       if (empty) return null;
-      return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SFilterTrigger, _ref7.cn("SFilterTrigger", _objectSpread({}, assignProps({
-        "ref": this.triggerRef,
+      return _ref7 = sstyled$1(styles), /* @__PURE__ */ React.createElement(Hint, _ref7.cn("Hint", {}), /* @__PURE__ */ React.createElement(Hint.Trigger, null, /* @__PURE__ */ React.createElement(SFilterTrigger, _ref7.cn("SFilterTrigger", _objectSpread({}, assignProps({
         "size": size,
         "empty": empty,
         "selected": true,
         "disabled": disabled,
-        "aria-label": (_ref9 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref9 !== void 0 ? _ref9 : getI18nText("clear"),
-        "__excludeProps": ["title"]
+        "aria-label": getI18nText("clear")
       }, _ref3))), /* @__PURE__ */ React.createElement(FilterTrigger.Addon, {
         tag: Close
-      })), /* @__PURE__ */ React.createElement(Hint, _ref7.cn("Hint", {
-        "triggerRef": this.triggerRef
-      }), (_ref0 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref0 !== void 0 ? _ref0 : getI18nText("clear")));
+      }))), /* @__PURE__ */ React.createElement(Hint.Popper, null, getI18nText("clear")));
     }
   }]);
-})(Component);
+  return ClearButton2;
+}(Component);
 _defineProperty(ClearButton, "displayName", "ClearButton");
 _defineProperty(ClearButton, "style", style);
-function Counter(_ref1) {
+function Counter(_ref9) {
   var _ref4 = arguments[0], _ref8;
-  var styles = _ref1.styles, Children = _ref1.Children, count = _ref1.count, getI18nText = _ref1.getI18nText;
+  var styles = _ref9.styles, Children = _ref9.Children, count = _ref9.count, getI18nText = _ref9.getI18nText;
   var SCounter = BaseTrigger.Addon;
-  return _ref8 = sstyled(styles), /* @__PURE__ */ React.createElement(SCounter, _ref8.cn("SCounter", _objectSpread({}, assignProps({
-    "tag": SemcoreCounter,
-    "theme": "info"
+  return _ref8 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SCounter, _ref8.cn("SCounter", _objectSpread({}, assignProps({
+    "tag": Dot
   }, _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", {})));
 }
 var FilterTrigger = createComponent(RootFilterTrigger, {