@semcore/tag 5.53.0-prerelease.4 → 5.53.0

package/CHANGELOG.md

@@ -2,11 +2,11 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
-## [5.53.0] - 2025-02-27
+## [5.53.0] - 2025-03-14
 
-### Changed
+### Added
 
-- Version minor update due to children dependencies update (`@semcore/utils` [4.45.1 ~> 4.47.1], `@semcore/icon` [4.57.1 ~> 4.58.0], `@semcore/flex-box` [5.40.1 ~> 5.41.0], `@semcore/core` [2.38.1 ~> 2.39.0]).
+- Build for ESM.
 
 ## [5.52.1] - 2025-02-05
 

package/lib/esm/Tag.mjs

@@ -0,0 +1,339 @@
+import f from "@babel/runtime/helpers/esm/objectSpread2";
+import A from "@babel/runtime/helpers/esm/classCallCheck";
+import k from "@babel/runtime/helpers/esm/createClass";
+import y from "@babel/runtime/helpers/esm/assertThisInitialized";
+import E from "@babel/runtime/helpers/esm/inherits";
+import V from "@babel/runtime/helpers/esm/createSuper";
+import n from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled as X } from "@semcore/utils/lib/core/index";
+import D, { sstyled as v, assignProps as p, Component as I } from "@semcore/core";
+import i from "react";
+import { Box as h } from "@semcore/flex-box";
+import Y from "@semcore/utils/lib/addonTextChildren";
+import R from "@semcore/utils/lib/logger";
+import F from "@semcore/icon/Close/m";
+import { localizedMessages as P } from "./translations/__intergalactic-dynamic-locales.mjs";
+import j from "@semcore/utils/lib/enhances/i18nEnhance";
+import M from "@semcore/utils/lib/enhances/resolveColorEnhance";
+import U from "@semcore/utils/lib/uniqueID";
+import K from "@semcore/utils/lib/enhances/keyboardFocusEnhance";
+import { isAdvanceMode as Z } from "@semcore/utils/lib/findComponent";
+var $ = (
+  /*__reshadow_css_start__*/
+  (X.insert(
+    /*__inner_css_start__*/
+    `.___SCircle_maeu3_gg_{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border-radius:50%;margin:0 var(--intergalactic-spacing-1x, 4px)}.___SCircle_maeu3_gg_:first-child{margin-left:0}.___SCircle_maeu3_gg_:last-child{margin-right:0}.___SCircle_maeu3_gg_._size_m_maeu3_gg_{width:16px;height:16px}.___SCircle_maeu3_gg_._size_l_maeu3_gg_,.___SCircle_maeu3_gg_._size_xl_maeu3_gg_{width:20px;height:20px}.___SAddon_maeu3_gg_,.___STagContainerClose_maeu3_gg_,.___STag_maeu3_gg_{position:relative;display:inline-flex;align-items:center;justify-content:center;padding-left:var(--intergalactic-spacing-1x, 4px);padding-right:var(--intergalactic-spacing-1x, 4px)}.___SAddon_maeu3_gg_{flex-shrink:0}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_{padding-left:0;padding-right:0}.___STagContainerClose_maeu3_gg_,.___STag_maeu3_gg_{vertical-align:middle;border:1px solid var(--intergalactic-bg-primary-neutral, #ffffff);box-sizing:border-box;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-radius:var(--intergalactic-tag-rounded, 24px);font-weight:var(--intergalactic-medium, 500);color:var(--tag-color_maeu3)}.___STagContainerClose_maeu3_gg_.__interactive_maeu3_gg_.__keyboardFocused_maeu3_gg_,.___STag_maeu3_gg_.__interactive_maeu3_gg_.__keyboardFocused_maeu3_gg_{box-shadow:var(--intergalactic-keyboard-focus,
+      0px 0px 0px 3px rgba(0, 143, 248, 0.5)
+    );z-index:1}.___STagContainerClose_maeu3_gg_::before,.___STag_maeu3_gg_::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--intergalactic-tag-rounded, 24px);background-color:var(--tag-color_maeu3);opacity:.2;filter:brightness(150%)}.___STagContainerClose_maeu3_gg_::after,.___STag_maeu3_gg_::after{content:"";position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:var(--intergalactic-tag-rounded, 24px);pointer-events:none;border:1px solid var(--tag-color_maeu3);opacity:.1;filter:brightness(150%)}.___STagContainerClose_maeu3_gg_:active,.___STagContainerClose_maeu3_gg_:focus,.___STag_maeu3_gg_:active,.___STag_maeu3_gg_:focus{outline:0;-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STagContainerClose_maeu3_gg_:hover,.___STag_maeu3_gg_:hover{outline:0;-webkit-text-decoration:none;text-decoration:none}}.___STagContainerClose_maeu3_gg_.__disabled_maeu3_gg_,.___STag_maeu3_gg_.__disabled_maeu3_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___STag_maeu3_gg_.__interactiveView_maeu3_gg_{cursor:pointer}.___STagContainerClose_maeu3_gg_._size_m_maeu3_gg_,.___STagContainer_maeu3_gg_._size_m_maeu3_gg_ .___SAddon_maeu3_gg_,.___STag_maeu3_gg_._size_m_maeu3_gg_{height:20px;min-width:20px}.___STagContainerClose_maeu3_gg_._size_m_maeu3_gg_ .___SCircle_maeu3_gg_:first-child,.___STagContainer_maeu3_gg_._size_m_maeu3_gg_ .___SAddon_maeu3_gg_ .___SCircle_maeu3_gg_:first-child,.___STag_maeu3_gg_._size_m_maeu3_gg_ .___SCircle_maeu3_gg_:first-child{margin-left:calc(-1*var(--intergalactic-spacing-05x, 2px))}.___STagContainerClose_maeu3_gg_._size_m_maeu3_gg_ .___SCircle_maeu3_gg_:last-child,.___STagContainer_maeu3_gg_._size_m_maeu3_gg_ .___SAddon_maeu3_gg_ .___SCircle_maeu3_gg_:last-child,.___STag_maeu3_gg_._size_m_maeu3_gg_ .___SCircle_maeu3_gg_:last-child{margin-right:calc(-1*var(--intergalactic-spacing-05x, 2px))}.___STagContainerClose_maeu3_gg_._size_m_maeu3_gg_ .___SText_maeu3_gg_,.___STagContainer_maeu3_gg_._size_m_maeu3_gg_ .___SAddon_maeu3_gg_ .___SText_maeu3_gg_,.___STag_maeu3_gg_._size_m_maeu3_gg_ .___SText_maeu3_gg_{font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%)}.___STagContainerClose_maeu3_gg_._size_l_maeu3_gg_,.___STagContainer_maeu3_gg_._size_l_maeu3_gg_ .___SAddon_maeu3_gg_,.___STag_maeu3_gg_._size_l_maeu3_gg_{height:28px;min-width:28px}.___STagContainerClose_maeu3_gg_._size_l_maeu3_gg_ .___SText_maeu3_gg_,.___STagContainer_maeu3_gg_._size_l_maeu3_gg_ .___SAddon_maeu3_gg_ .___SText_maeu3_gg_,.___STag_maeu3_gg_._size_l_maeu3_gg_ .___SText_maeu3_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___STagContainerClose_maeu3_gg_._size_xl_maeu3_gg_,.___STag_maeu3_gg_._size_xl_maeu3_gg_{height:40px;min-width:40px;padding:0 var(--intergalactic-spacing-2x, 8px)}.___STagContainerClose_maeu3_gg_._size_xl_maeu3_gg_ .___SText_maeu3_gg_,.___STag_maeu3_gg_._size_xl_maeu3_gg_ .___SText_maeu3_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___STagContainerClose_maeu3_gg_._theme_primary_maeu3_gg_::before,.___STagContainer_maeu3_gg_._theme_primary_maeu3_gg_ .___SAddon_maeu3_gg_::before,.___STag_maeu3_gg_._theme_primary_maeu3_gg_::before{top:-1px;left:-1px;right:-1px;bottom:-1px}.___STagContainerClose_maeu3_gg_._theme_primary_maeu3_gg_:after,.___STagContainer_maeu3_gg_._theme_primary_maeu3_gg_ .___SAddon_maeu3_gg_:after,.___STag_maeu3_gg_._theme_primary_maeu3_gg_:after{display:none}.___STagContainerClose_maeu3_gg_._theme_primary_maeu3_gg_.__active_maeu3_gg_:before,.___STagContainerClose_maeu3_gg_._theme_primary_maeu3_gg_.__interactiveView_maeu3_gg_:active:before,.___STagContainer_maeu3_gg_._theme_primary_maeu3_gg_ .___SAddon_maeu3_gg_.__active_maeu3_gg_:before,.___STagContainer_maeu3_gg_._theme_primary_maeu3_gg_ .___SAddon_maeu3_gg_.__interactiveView_maeu3_gg_:active:before,.___STag_maeu3_gg_._theme_primary_maeu3_gg_.__active_maeu3_gg_:before,.___STag_maeu3_gg_._theme_primary_maeu3_gg_.__interactiveView_maeu3_gg_:active:before{opacity:.3}@media (hover:hover){.___STagContainerClose_maeu3_gg_._theme_primary_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before,.___STagContainer_maeu3_gg_._theme_primary_maeu3_gg_ .___SAddon_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before,.___STag_maeu3_gg_._theme_primary_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before{opacity:.3}}.___STagContainerClose_maeu3_gg_._theme_additional_maeu3_gg_::before,.___STagContainerClose_maeu3_gg_._theme_secondary_maeu3_gg_::before,.___STag_maeu3_gg_._theme_additional_maeu3_gg_::before,.___STag_maeu3_gg_._theme_secondary_maeu3_gg_::before{opacity:.01}.___STagContainerClose_maeu3_gg_._theme_additional_maeu3_gg_.__active_maeu3_gg_:before,.___STagContainerClose_maeu3_gg_._theme_additional_maeu3_gg_.__interactiveView_maeu3_gg_:active:before,.___STagContainerClose_maeu3_gg_._theme_secondary_maeu3_gg_.__active_maeu3_gg_:before,.___STagContainerClose_maeu3_gg_._theme_secondary_maeu3_gg_.__interactiveView_maeu3_gg_:active:before,.___STag_maeu3_gg_._theme_additional_maeu3_gg_.__active_maeu3_gg_:before,.___STag_maeu3_gg_._theme_additional_maeu3_gg_.__interactiveView_maeu3_gg_:active:before,.___STag_maeu3_gg_._theme_secondary_maeu3_gg_.__active_maeu3_gg_:before,.___STag_maeu3_gg_._theme_secondary_maeu3_gg_.__interactiveView_maeu3_gg_:active:before{opacity:.1}@media (hover:hover){.___STagContainerClose_maeu3_gg_._theme_additional_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before,.___STagContainerClose_maeu3_gg_._theme_secondary_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before,.___STag_maeu3_gg_._theme_additional_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before,.___STag_maeu3_gg_._theme_secondary_maeu3_gg_.__interactiveView_maeu3_gg_:hover:before{opacity:.1}}.___SClose_maeu3_gg_ path,.___STagContainerClose_maeu3_gg_._theme_additional-invert_maeu3_gg_::after,.___STagContainerClose_maeu3_gg_._theme_additional_maeu3_gg_::after,.___STagContainerClose_maeu3_gg_._theme_secondary-invert_maeu3_gg_::after,.___STagContainerClose_maeu3_gg_._theme_secondary_maeu3_gg_::after,.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_ svg path,.___STag_maeu3_gg_._theme_additional-invert_maeu3_gg_::after,.___STag_maeu3_gg_._theme_additional_maeu3_gg_::after,.___STag_maeu3_gg_._theme_secondary-invert_maeu3_gg_::after,.___STag_maeu3_gg_._theme_secondary_maeu3_gg_::after{opacity:.5}.___STagContainerClose_maeu3_gg_._theme_primary-invert_maeu3_gg_,.___STag_maeu3_gg_._theme_primary-invert_maeu3_gg_{background-color:var(--intergalactic-tag-primary-white-normal,
+    rgba(255, 255, 255, 0.15)
+  );color:var(--intergalactic-text-primary-invert, #ffffff)}.___STagContainerClose_maeu3_gg_._theme_additional-invert_maeu3_gg_,.___STagContainerClose_maeu3_gg_._theme_secondary-invert_maeu3_gg_,.___STag_maeu3_gg_._theme_additional-invert_maeu3_gg_,.___STag_maeu3_gg_._theme_secondary-invert_maeu3_gg_{color:var(--intergalactic-text-primary-invert, #ffffff)}.___STag_maeu3_gg_._theme_additional_maeu3_gg_::after{border-style:dashed}.___SText_maeu3_gg_{display:inline-block;padding-left:var(--intergalactic-spacing-1x, 4px);padding-right:var(--intergalactic-spacing-1x, 4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:0;position:relative}.___SText_maeu3_gg_.__keyboardFocused_maeu3_gg_{box-shadow:var(--intergalactic-keyboard-focus,
+    0px 0px 0px 3px rgba(0, 143, 248, 0.5)
+  );z-index:1}.___SText_maeu3_gg_:not(:only-child):first-child{padding-right:0}.___SText_maeu3_gg_:not(:first-child):not(:last-child){padding-left:0;padding-right:0}.___SText_maeu3_gg_:not(:only-child):last-child{padding-left:0}.___SClose_maeu3_gg_{cursor:pointer;flex-shrink:0;padding:var(--intergalactic-spacing-1x, 4px)}@media (hover:hover){.___SClose_maeu3_gg_:hover path{opacity:1}}.___SClose_maeu3_gg_,.___STagContainer_maeu3_gg_{display:inline-flex;position:relative;align-items:center;justify-content:center}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:last-child),.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0;padding-right:var(--intergalactic-spacing-05x, 2px)}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:last-child)::after,.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:last-child)::before,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:last-child)::after,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:last-child)::before{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-1px}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:last-child) .___SText_maeu3_gg_,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:last-child) .___SText_maeu3_gg_{padding-right:0}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:first-child),.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;padding-left:var(--intergalactic-spacing-05x, 2px)}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:first-child)::after,.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:first-child)::before,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:first-child)::after,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:first-child)::before{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.___STagContainer_maeu3_gg_ .___SAddon_maeu3_gg_:not(:first-child) .___SText_maeu3_gg_,.___STagContainer_maeu3_gg_ .___STag_maeu3_gg_:not(:first-child) .___SText_maeu3_gg_{padding-left:0}.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_{cursor:pointer;border-top-left-radius:0;border-bottom-left-radius:0;padding-left:0;padding-right:0;min-width:20px}.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_::after,.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_::before{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_::before{left:-1px}.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_ svg{padding-left:0;padding-right:var(--intergalactic-spacing-1x, 4px)}@media (hover:hover){.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_:hover svg path{opacity:1}}.___STagContainer_maeu3_gg_ .___STagContainerClose_maeu3_gg_._size_xl_maeu3_gg_ svg{padding-left:var(--intergalactic-spacing-1x, 4px);padding-right:var(--intergalactic-spacing-2x, 8px)}`,
+    "maeu3_gg_"
+  ), {
+    __SCircle: "___SCircle_maeu3_gg_",
+    _size_m: "_size_m_maeu3_gg_",
+    _size_l: "_size_l_maeu3_gg_",
+    _size_xl: "_size_xl_maeu3_gg_",
+    __SAddon: "___SAddon_maeu3_gg_",
+    __STagContainer: "___STagContainer_maeu3_gg_",
+    __STag: "___STag_maeu3_gg_",
+    _disabled: "__disabled_maeu3_gg_",
+    __STagContainerClose: "___STagContainerClose_maeu3_gg_",
+    _interactiveView: "__interactiveView_maeu3_gg_",
+    "_theme_primary-invert": "_theme_primary-invert_maeu3_gg_",
+    "_theme_secondary-invert": "_theme_secondary-invert_maeu3_gg_",
+    "_theme_additional-invert": "_theme_additional-invert_maeu3_gg_",
+    __SText: "___SText_maeu3_gg_",
+    _keyboardFocused: "__keyboardFocused_maeu3_gg_",
+    "--tag-color": "--tag-color_maeu3",
+    _interactive: "__interactive_maeu3_gg_",
+    _theme_primary: "_theme_primary_maeu3_gg_",
+    _active: "__active_maeu3_gg_",
+    _theme_secondary: "_theme_secondary_maeu3_gg_",
+    _theme_additional: "_theme_additional_maeu3_gg_",
+    __SClose: "___SClose_maeu3_gg_"
+  })
+), __ = {
+  primary: {
+    muted: "gray-500",
+    info: "blue-500",
+    success: "green-500",
+    warning: "orange-500",
+    danger: "red-500"
+  },
+  secondary: {
+    muted: "gray-50"
+  }
+}, x = /* @__PURE__ */ function(r) {
+  E(g, r);
+  var l = V(g);
+  function g(o) {
+    var _, e;
+    return A(this, g), e = l.call(this, o), n(y(e), "state", {
+      focusable: "container"
+    }), n(y(e), "handleCloseMount", function() {
+      e.setState({
+        focusable: "text"
+      });
+    }), n(y(e), "handleCloseUnmount", function() {
+      e.setState({
+        focusable: "container"
+      });
+    }), n(y(e), "handleKeyDown", function(a) {
+      switch (a.key) {
+        case " ":
+        case "Enter":
+          e.asProps.onClick && (a.preventDefault(), e.asProps.onClick(a));
+          break;
+      }
+    }), R.warn(o.use, `Property 'use' is deprecated, replace property to "theme='`.concat(o.use, "' color='").concat((_ = __[o.use]) === null || _ === void 0 ? void 0 : _[o.theme], `'"`), o["data-ui-name"] || d.displayName), e;
+  }
+  return k(g, [{
+    key: "getCircleProps",
+    value: function() {
+      var _ = this.asProps, e = _.size, a = _.color, t = _.resolveColor;
+      return {
+        size: e,
+        color: a,
+        resolveColor: t
+      };
+    }
+  }, {
+    key: "getTextProps",
+    value: function() {
+      var _ = this.asProps.interactive, e = this.asProps.id || "igc-".concat(this.asProps.uid, "-tag"), a = this.state.focusable;
+      return {
+        tabIndex: a === "text" && _ ? 0 : -1,
+        id: "".concat(e, "-text"),
+        role: a === "text" && _ ? "button" : void 0
+      };
+    }
+  }, {
+    key: "getCloseProps",
+    value: function() {
+      var _ = this.asProps, e = _.getI18nText, a = _.color, t = _.resolveColor, m = this.asProps.id || "igc-".concat(this.asProps.uid, "-tag");
+      return {
+        getI18nText: e,
+        id: "".concat(m, "-clear"),
+        "aria-labelledby": "".concat(m, "-clear ").concat(m, "-text"),
+        "aria-label": e("remove"),
+        onMount: this.handleCloseMount,
+        onUnmount: this.handleCloseUnmount,
+        color: a,
+        resolveColor: t
+      };
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var _ = this.asProps, e, a = h, t = this.asProps, m = t.Children, u = t.styles, s = t.color, c = t.interactive, S = t.disabled, C = t.addonLeft, N = t.addonRight, G = t.resolveColor, H = t.id, J = t.uid, O = this.state.focusable, Q = H || "igc-".concat(J, "-tag"), W = !S && c, z = !S && c && O === "container";
+      return e = v(u), /* @__PURE__ */ i.createElement(a, e.cn("STag", f({}, p({
+        id: Q,
+        "use:interactive": z,
+        "use:interactiveView": W,
+        "tag-color": G(s),
+        onKeyDown: this.handleKeyDown,
+        "use:tabIndex": z ? 0 : -1,
+        role: z ? "button" : void 0
+      }, _))), C ? /* @__PURE__ */ i.createElement(d.Addon, {
+        tag: C
+      }) : null, Y(m, d.Text, [d.Addon, T.Circle]), N ? /* @__PURE__ */ i.createElement(d.Addon, {
+        tag: N
+      }) : null);
+    }
+  }]), g;
+}(I);
+n(x, "displayName", "Tag");
+n(x, "style", $);
+n(x, "enhance", [j(P), U(), M(), K()]);
+n(x, "defaultProps", {
+  theme: "primary",
+  color: "gray-500",
+  size: "m",
+  i18n: P,
+  locale: "en"
+});
+var b = /* @__PURE__ */ function(r) {
+  E(g, r);
+  var l = V(g);
+  function g() {
+    return A(this, g), l.apply(this, arguments);
+  }
+  return k(g, [{
+    key: "getTagProps",
+    value: function() {
+      var _ = this.asProps, e = _.size, a = _.theme, t = _.color, m = _.disabled, u = _.uid, s = _.id, c = _.interactive, S = _.resolveColor, C = s || "igc-".concat(u, "-tag");
+      return {
+        id: "".concat(C, "-text"),
+        disabled: m,
+        size: e,
+        theme: a,
+        color: t,
+        tag: c ? "button" : void 0,
+        interactive: c,
+        resolveColor: S
+      };
+    }
+  }, {
+    key: "getCircleProps",
+    value: function() {
+      var _ = this.asProps, e = _.color, a = _.resolveColor, t = _.size;
+      return {
+        color: e,
+        resolveColor: a,
+        size: t
+      };
+    }
+  }, {
+    key: "getAddonProps",
+    value: function() {
+      var _ = this.asProps, e = _.color, a = _.resolveColor;
+      return {
+        color: e,
+        resolveColor: a
+      };
+    }
+  }, {
+    key: "getCloseProps",
+    value: function() {
+      var _ = this.asProps, e = _.size, a = _.theme, t = _.color, m = _.disabled, u = _.uid, s = _.id, c = _.getI18nText, S = _.resolveColor, C = s || "igc-".concat(u, "-tag");
+      return {
+        disabled: m,
+        size: e,
+        theme: a,
+        color: t,
+        id: "".concat(C, "-clear"),
+        "aria-labelledby": "".concat(C, "-clear ").concat(C, "-text"),
+        "aria-label": c("remove"),
+        resolveColor: S
+      };
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var _ = this.asProps, e, a = h, t = this.asProps, m = t.styles, u = t.Children, s = t.forcedAdvancedMode, c = s || Z(u, ["InputTags." + d.Text.displayName, "InputTags." + d.Addon.displayName, "InputTags." + d.Close.displayName, "InputTags." + d.Circle.displayName, T.Tag.displayName, T.Addon.displayName, T.Close.displayName, T.Circle.displayName], !0);
+      return e = v(m), /* @__PURE__ */ i.createElement(a, e.cn("STagContainer", f({}, p({}, _))), c ? /* @__PURE__ */ i.createElement(u, e.cn("Children", {})) : /* @__PURE__ */ i.createElement(T.Tag, null, /* @__PURE__ */ i.createElement(u, e.cn("Children", {}))));
+    }
+  }]), g;
+}(I);
+n(b, "displayName", "TagContainer");
+n(b, "style", $);
+n(b, "enhance", [j(P), U(), M()]);
+n(b, "defaultProps", {
+  color: "gray-500",
+  theme: "primary"
+});
+var w = /* @__PURE__ */ function(r) {
+  E(g, r);
+  var l = V(g);
+  function g() {
+    var o;
+    A(this, g);
+    for (var _ = arguments.length, e = new Array(_), a = 0; a < _; a++)
+      e[a] = arguments[a];
+    return o = l.call.apply(l, [this].concat(e)), n(y(o), "handleKeyDown", function(t) {
+      var m = o.asProps, u = m.onKeyDown, s = m.onClick;
+      if (u)
+        return u(t);
+      s && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), s(t));
+    }), o;
+  }
+  return k(g, [{
+    key: "render",
+    value: function() {
+      var _ = this.asProps, e, a = h, t = this.asProps, m = t.Children, u = t.styles, s = t.color, c = t.resolveColor;
+      return e = v(u), /* @__PURE__ */ i.createElement(a, e.cn("STagContainerClose", f({}, p({
+        tag: "button",
+        type: "button",
+        interactive: !0,
+        interactiveView: !0,
+        "tag-color": c(s),
+        onKeyDown: this.handleKeyDown
+      }, _))), /* @__PURE__ */ i.createElement(m, e.cn("Children", {})));
+    }
+  }]), g;
+}(I);
+n(w, "displayName", "CloseTagContainer");
+n(w, "style", $);
+n(w, "defaultProps", function() {
+  return {
+    theme: "primary",
+    color: "gray-500",
+    size: "m",
+    i18n: P,
+    locale: "en",
+    children: /* @__PURE__ */ i.createElement(B.Close, null)
+  };
+});
+n(w, "enhance", [M(), K()]);
+function e_(r) {
+  var l = arguments[0], g, o = h, _ = h, e = r.styles, a = r.color, t = r.resolveColor;
+  return g = v(e), /* @__PURE__ */ i.createElement(o, g.cn("SAddon", {
+    "tag-color": t(a)
+  }), /* @__PURE__ */ i.createElement(_, g.cn("SCircle", f({}, p({}, l)))));
+}
+function L(r) {
+  var l = arguments[0], g, o = h, _ = r.styles;
+  return g = v(_), /* @__PURE__ */ i.createElement(o, g.cn("SText", f({}, p({
+    tag: "span"
+  }, l))));
+}
+L.enhance = [K()];
+function a_(r) {
+  var l = arguments[0], g, o = h, _ = r.styles;
+  i.useEffect(function() {
+    var a;
+    return (a = r.onMount) === null || a === void 0 || a.call(r), R.warn(!0, "Tag.Close is deprecated and will be removed in the next major release. Please, use TagContainer and TagContainer.Close", "Tag.Close"), function() {
+      var t;
+      return (t = r.onUnmount) === null || t === void 0 ? void 0 : t.call(r);
+    };
+  }, []);
+  var e = i.useCallback(function(a) {
+    if (r.onKeyDown)
+      return r.onKeyDown(a);
+    r.onClick && (a.key === "Enter" || a.key === " ") && (a.preventDefault(), r.onClick(a));
+  }, [r.onKeyDown, r.onClick]);
+  return g = v(_), /* @__PURE__ */ i.createElement(o, g.cn("SClose", f({}, p({
+    tag: F,
+    interactive: !0,
+    onKeyDown: e
+  }, l))));
+}
+function q(r) {
+  var l = arguments[0], g, o = h, _ = r.styles, e = r.color, a = r.resolveColor, t = i.useMemo(function() {
+    if (typeof a == "function")
+      return a(e);
+  }, [e, a]);
+  return g = v(_), /* @__PURE__ */ i.createElement(o, g.cn("SAddon", f({}, p({
+    tag: "div",
+    "tag-color": t
+  }, l))));
+}
+function t_(r) {
+  var l = arguments[0], g, o = h, _ = r.styles, e = r.color, a = r.resolveColor, t = i.useMemo(function() {
+    if (typeof a == "function")
+      return a(e);
+  }, [e, a]);
+  return g = v(_), /* @__PURE__ */ i.createElement(o, g.cn("SCircle", f({}, p({
+    tag: "span",
+    "tag-color": t
+  }, l))));
+}
+var d = D(x, {
+  Text: L,
+  Addon: q,
+  Close: a_,
+  Circle: t_
+}), B = D(w, {
+  Close: F
+}), T = D(b, {
+  Tag: d,
+  Addon: q,
+  Close: B,
+  Circle: e_
+});
+export {
+  T as TagContainer,
+  d as default
+};

package/lib/esm/index.mjs

@@ -0,0 +1,5 @@
+import { TagContainer as o, default as r } from "./Tag.mjs";
+export {
+  o as TagContainer,
+  r as default
+};

package/lib/esm/translations/__intergalactic-dynamic-locales.mjs

@@ -0,0 +1,33 @@
+import r from "./de.json.mjs";
+import o from "./en.json.mjs";
+import m from "./es.json.mjs";
+import t from "./fr.json.mjs";
+import i from "./it.json.mjs";
+import p from "./ja.json.mjs";
+import f from "./ko.json.mjs";
+import e from "./nl.json.mjs";
+import s from "./pt.json.mjs";
+import a from "./tr.json.mjs";
+import l from "./vi.json.mjs";
+import v from "./zh.json.mjs";
+import d from "./pl.json.mjs";
+import n from "./sv.json.mjs";
+var B = {
+  de: r,
+  en: o,
+  es: m,
+  fr: t,
+  it: i,
+  ja: p,
+  ko: f,
+  nl: e,
+  pt: s,
+  tr: a,
+  vi: l,
+  zh: v,
+  pl: d,
+  sv: n
+};
+export {
+  B as localizedMessages
+};

package/lib/esm/translations/de.json.mjs

@@ -0,0 +1,7 @@
+const e = "Entfernen", n = {
+  remove: e
+};
+export {
+  n as default,
+  e as remove
+};

package/lib/esm/translations/en.json.mjs

@@ -0,0 +1,7 @@
+const e = "Delete", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/es.json.mjs

@@ -0,0 +1,7 @@
+const e = "Eliminar", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/fr.json.mjs

@@ -0,0 +1,7 @@
+const e = "Supprimer", r = {
+  remove: e
+};
+export {
+  r as default,
+  e as remove
+};

package/lib/esm/translations/it.json.mjs

@@ -0,0 +1,7 @@
+const e = "Rimuovi", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/ja.json.mjs

@@ -0,0 +1,7 @@
+const e = "削除", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/ko.json.mjs

@@ -0,0 +1,7 @@
+const e = "제거", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/nl.json.mjs

@@ -0,0 +1,7 @@
+const e = "Verwijderen", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/pl.json.mjs

@@ -0,0 +1,7 @@
+const e = "Usuń", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/pt.json.mjs

@@ -0,0 +1,7 @@
+const e = "Remover", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/sv.json.mjs

@@ -0,0 +1,7 @@
+const e = "Ta bort", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/tr.json.mjs

@@ -0,0 +1,7 @@
+const e = "Kaldır", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/vi.json.mjs

@@ -0,0 +1,7 @@
+const e = "Loại bỏ", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/lib/esm/translations/zh.json.mjs

@@ -0,0 +1,7 @@
+const e = "移除", o = {
+  remove: e
+};
+export {
+  o as default,
+  e as remove
+};

package/package.json

@@ -1,20 +1,25 @@
 {
   "name": "@semcore/tag",
   "description": "Semrush Tag Component",
-  "version": "5.53.0-prerelease.4",
+  "version": "5.53.0",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
   "sideEffects": false,
   "author": "UI-kit team <ui-kit-team@semrush.com>",
   "license": "MIT",
+  "exports": {
+    "require": "./lib/cjs/index.js",
+    "import": "./lib/esm/index.mjs",
+    "types": "./lib/types/index.d.ts"
+  },
   "dependencies": {
-    "@semcore/utils": "4.47.1-prerelease.4",
-    "@semcore/icon": "4.58.0-prerelease.4",
-    "@semcore/flex-box": "5.41.0-prerelease.4"
+    "@semcore/utils": "4.48.0",
+    "@semcore/icon": "4.60.0",
+    "@semcore/flex-box": "5.41.0"
   },
   "peerDependencies": {
-    "@semcore/core": "^2.39.0-prerelease.4",
+    "@semcore/core": "^2.17.5",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },
@@ -28,6 +33,6 @@
     "@semcore/testing-utils": "1.0.0"
   },
   "scripts": {
-    "build": "pnpm semcore-builder --source=js"
+    "build": "pnpm semcore-builder --source=js && pnpm vite build"
   }
 }

package/vite.config.ts

@@ -0,0 +1,17 @@
+import { defineConfig, mergeConfig } from 'vite';
+
+import viteConfig from '../../commonVite.config';
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    build: {
+      lib: {
+        entry: './src/index.js',
+      },
+      rollupOptions: {
+        external: ['react', 'react-dom', 'react/jsx-runtime', /@babel\/runtime\/*/, /@semcore\/*/],
+      },
+    },
+  }),
+);