@semcore/link 16.0.0-prerelease.4 → 16.0.0-prerelease.7

package/lib/esm/Link.mjs

@@ -1,134 +1,156 @@
-import b from "@babel/runtime/helpers/esm/objectSpread2";
-import L from "@babel/runtime/helpers/esm/classCallCheck";
-import A from "@babel/runtime/helpers/esm/createClass";
-import u from "@babel/runtime/helpers/esm/assertThisInitialized";
-import C from "@babel/runtime/helpers/esm/inherits";
-import T from "@babel/runtime/helpers/esm/createSuper";
-import a from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as d, createComponent as E, assignProps as x, Component as P } from "@semcore/core";
-import i from "react";
-import { Text as R } from "@semcore/typography";
-import { Box as k } from "@semcore/flex-box";
-import { Hint as w } from "@semcore/tooltip";
-import M from "@semcore/core/lib/utils/enhances/keyboardFocusEnhance";
-import O from "@semcore/core/lib/utils/addonTextChildren";
-import W from "@semcore/core/lib/utils/logger";
-import B from "@semcore/core/lib/utils/hasLabels";
-import H from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
-var V = (
+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 _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 { sstyled, createComponent, assignProps, Component } from "@semcore/core";
+import React from "react";
+import { Text } from "@semcore/typography";
+import { Box } from "@semcore/flex-box";
+import { Hint } from "@semcore/tooltip";
+import keyboardFocusEnhance from "@semcore/core/lib/utils/enhances/keyboardFocusEnhance";
+import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
+import logger from "@semcore/core/lib/utils/logger";
+import hasLabels from "@semcore/core/lib/utils/hasLabels";
+import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
+var style = (
   /*__reshadow_css_start__*/
-  (d.insert(
+  (sstyled.insert(
     /*__inner_css_start__*/
     ".___SLink_ypsez_gg_{display:inline-block;font-family:inherit;color:var(--intergalactic-text-link, #006dca);line-height:normal;position:relative;cursor:pointer;border:0;padding:0;margin:0;box-shadow:none;-webkit-tap-highlight-color:transparent;background:0 0;transition:color .15s ease-in-out}.___SLink_ypsez_gg_,.___SLink_ypsez_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___SLink_ypsez_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___SLink_ypsez_gg_::-moz-focus-inner{border:0;padding:0}.___SLink_ypsez_gg_.__active_ypsez_gg_,.___SLink_ypsez_gg_:active{color:var(--intergalactic-text-link-hover-active, #044792)}@media (hover:hover){.___SLink_ypsez_gg_:hover{color:var(--intergalactic-text-link-hover-active, #044792)}}.___SLink_ypsez_gg_.__active_ypsez_gg_ .___SText_ypsez_gg_,.___SLink_ypsez_gg_:active .___SText_ypsez_gg_{border-color:currentColor}@media (hover:hover){.___SLink_ypsez_gg_:hover .___SText_ypsez_gg_{border-color:currentColor}}.___SLink_ypsez_gg_.__enableVisited_ypsez_gg_:visited{color:var(--intergalactic-text-link-visited, #8649e1)}@media (hover:hover){.___SLink_ypsez_gg_.__enableVisited_ypsez_gg_:visited:hover{color:var(--intergalactic-text-link-visited, #8649e1)}}.___SLink_ypsez_gg_.__visually-disabled_ypsez_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SLink_ypsez_gg_.__noWrapText_ypsez_gg_{white-space:nowrap}.___SLink_ypsez_gg_.__inline_ypsez_gg_{display:inline}.___SAddon_ypsez_gg_{display:inline-flex;justify-content:center;align-items:center;margin-bottom:var(--intergalactic-spacing-05x, 2px);vertical-align:middle;pointer-events:none}.___SLink_ypsez_gg_ .___SAddon_ypsez_gg_:not(:only-child):first-child{margin-right:var(--intergalactic-spacing-1x, 4px)}.___SLink_ypsez_gg_ .___SAddon_ypsez_gg_:not(:only-child):last-child{margin-left:var(--intergalactic-spacing-1x, 4px)}.___SText_ypsez_gg_{border-bottom-width:1px;border-bottom-style:solid;border-color:transparent;transition:border-bottom-color .15s ease-in-out}.___SLink_ypsez_gg_.__text-color_ypsez_gg_{color:var(--text-color_ypsez)}.___SLink_ypsez_gg_.__text-color_ypsez_gg_.__active_ypsez_gg_,.___SLink_ypsez_gg_.__text-color_ypsez_gg_:active{color:var(--text-color_ypsez);filter:brightness(.8)}@media (hover:hover){.___SLink_ypsez_gg_.__text-color_ypsez_gg_:hover{color:var(--text-color_ypsez);filter:brightness(.8)}}@media (prefers-reduced-motion){.___SLink_ypsez_gg_,.___SText_ypsez_gg_{transition:none}}",
     "ypsez_gg_"
   ), {
-    __SLink: "___SLink_ypsez_gg_",
+    "__SLink": "___SLink_ypsez_gg_",
     "_visually-disabled": "__visually-disabled_ypsez_gg_",
-    _noWrapText: "__noWrapText_ypsez_gg_",
-    _inline: "__inline_ypsez_gg_",
-    __SAddon: "___SAddon_ypsez_gg_",
-    __SText: "___SText_ypsez_gg_",
-    _active: "__active_ypsez_gg_",
-    _enableVisited: "__enableVisited_ypsez_gg_",
+    "_noWrapText": "__noWrapText_ypsez_gg_",
+    "_inline": "__inline_ypsez_gg_",
+    "__SAddon": "___SAddon_ypsez_gg_",
+    "__SText": "___SText_ypsez_gg_",
+    "_active": "__active_ypsez_gg_",
+    "_enableVisited": "__enableVisited_ypsez_gg_",
     "_text-color": "__text-color_ypsez_gg_",
     "--text-color": "--text-color_ypsez"
   })
-), v = /* @__PURE__ */ function(g) {
-  C(o, g);
-  var s = T(o);
-  function o() {
-    var _;
-    L(this, o);
-    for (var e = arguments.length, n = new Array(e), r = 0; r < e; r++)
-      n[r] = arguments[r];
-    return _ = s.call.apply(s, [this].concat(n)), a(u(_), "containerRef", /* @__PURE__ */ i.createRef()), a(u(_), "state", {
+);
+var RootLink = /* @__PURE__ */ function(_Component) {
+  _inherits(RootLink2, _Component);
+  var _super = _createSuper(RootLink2);
+  function RootLink2() {
+    var _this;
+    _classCallCheck(this, RootLink2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "containerRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "state", {
       ariaLabelledByContent: "",
-      visibleHint: !1
-    }), a(u(_), "handleMouseEnterOnlyAddon", function() {
-      _.setState({
-        visibleHint: !0
+      visibleHint: false
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleMouseEnterOnlyAddon", function() {
+      _this.setState({
+        visibleHint: true
       });
-    }), a(u(_), "handleMouseLeaveOnlyAddon", function() {
-      _.setState({
-        visibleHint: !1
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleMouseLeaveOnlyAddon", function() {
+      _this.setState({
+        visibleHint: false
       });
-    }), _;
+    });
+    return _this;
   }
-  return A(o, [{
+  _createClass(RootLink2, [{
     key: "componentDidMount",
-    value: function() {
-      var e = this;
-      process.env.NODE_ENV !== "production" && W.warn(this.containerRef.current && !B(this.containerRef.current), "'title' or 'aria-label' or 'aria-labelledby' are required props for links without text content", this.asProps["data-ui-name"] || o.displayName), this.asProps["aria-labelledby"] && setTimeout(function() {
-        var n, r;
-        e.setState({
-          ariaLabelledByContent: (n = (r = document.getElementById(e.asProps["aria-labelledby"])) === null || r === void 0 ? void 0 : r.textContent) !== null && n !== void 0 ? n : ""
-        });
-      }, 0);
+    value: function componentDidMount() {
+      var _this2 = this;
+      if (process.env.NODE_ENV !== "production") {
+        logger.warn(this.containerRef.current && !hasLabels(this.containerRef.current), "'title' or 'aria-label' or 'aria-labelledby' are required props for links without text content", this.asProps["data-ui-name"] || RootLink2.displayName);
+      }
+      if (this.asProps["aria-labelledby"]) {
+        setTimeout(function() {
+          var _document$getElementB, _document$getElementB2;
+          _this2.setState({
+            ariaLabelledByContent: (_document$getElementB = (_document$getElementB2 = document.getElementById(_this2.asProps["aria-labelledby"])) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.textContent) !== null && _document$getElementB !== void 0 ? _document$getElementB : ""
+          });
+        }, 0);
+      }
     }
   }, {
     key: "renderChildren",
-    value: function() {
-      var e = this.asProps, n = e.Children, r = e.styles, t = e.addonLeft, l = e.addonRight;
-      return d(r), /* @__PURE__ */ i.createElement(i.Fragment, null, t ? /* @__PURE__ */ i.createElement(y.Addon, {
-        tag: t
-      }) : null, O(n, y.Text, y.Addon), l ? /* @__PURE__ */ i.createElement(y.Addon, {
-        tag: l
+    value: function renderChildren() {
+      var _this$asProps = this.asProps, Children = _this$asProps.Children, styles = _this$asProps.styles, AddonLeft = _this$asProps.addonLeft, AddonRight = _this$asProps.addonRight;
+      return sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, AddonLeft ? /* @__PURE__ */ React.createElement(Link.Addon, {
+        tag: AddonLeft
+      }) : null, addonTextChildren(Children, Link.Text, Link.Addon), AddonRight ? /* @__PURE__ */ React.createElement(Link.Addon, {
+        tag: AddonRight
       }) : null);
     }
   }, {
     key: "renderOnlyAddons",
-    value: function() {
-      var e, n, r, t = this.asProps, l = t.styles, h = t.addonLeft, m = t.addonRight, c = t.title, p = t["aria-label"], f = t.keyboardFocused, z = this.state.visibleHint, S = (n = (r = c ?? p) !== null && r !== void 0 ? r : this.state.ariaLabelledByContent) !== null && n !== void 0 ? n : "";
-      return e = d(l), /* @__PURE__ */ i.createElement(y.Addon, {
-        tag: w,
-        title: S,
+    value: function renderOnlyAddons() {
+      var _ref5, _ref9, _ref10;
+      var _this$asProps2 = this.asProps, styles = _this$asProps2.styles, AddonLeft = _this$asProps2.addonLeft, AddonRight = _this$asProps2.addonRight, title = _this$asProps2.title, ariaLabel = _this$asProps2["aria-label"], keyboardFocused = _this$asProps2.keyboardFocused;
+      var visibleHint = this.state.visibleHint;
+      var hintContent = (_ref9 = (_ref10 = title !== null && title !== void 0 ? title : ariaLabel) !== null && _ref10 !== void 0 ? _ref10 : this.state.ariaLabelledByContent) !== null && _ref9 !== void 0 ? _ref9 : "";
+      return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(Link.Addon, {
+        tag: Hint,
+        title: hintContent,
         timeout: [250, 50],
-        visible: f || z
-      }, h && /* @__PURE__ */ i.createElement(h, e.cn("AddonLeft", {})), m && /* @__PURE__ */ i.createElement(m, e.cn("AddonRight", {})));
+        visible: keyboardFocused || visibleHint
+      }, AddonLeft && /* @__PURE__ */ React.createElement(AddonLeft, _ref5.cn("AddonLeft", {})), AddonRight && /* @__PURE__ */ React.createElement(AddonRight, _ref5.cn("AddonRight", {})));
     }
   }, {
     key: "render",
-    value: function() {
-      var e = this.asProps, n, r = R, t = this.asProps, l = t.styles, h = t.noWrap, m = t.color, c = t.resolveColor, p = t.disabled, f = t.href, z = t.children;
-      return n = d(l), /* @__PURE__ */ i.createElement(r, n.cn("SLink", b({}, x({
-        role: "link",
-        tabIndex: p ? -1 : 0,
-        "use:href": p ? void 0 : f,
-        "visually-disabled": p,
-        "text-color": c(m),
-        tag: "a",
-        noWrapText: h,
-        "use:noWrap": !1,
-        ref: this.containerRef,
-        __excludeProps: ["disabled", "aria-disabled"],
-        onMouseEnter: this.handleMouseEnterOnlyAddon,
-        onMouseLeave: this.handleMouseLeaveOnlyAddon
-      }, e))), z !== void 0 ? this.renderChildren() : this.renderOnlyAddons());
+    value: function render() {
+      var _ref = this.asProps, _ref6;
+      var SLink = Text;
+      var _this$asProps3 = this.asProps, styles = _this$asProps3.styles, noWrap = _this$asProps3.noWrap, color = _this$asProps3.color, resolveColor = _this$asProps3.resolveColor, disabled = _this$asProps3.disabled, href = _this$asProps3.href, hasChildren = _this$asProps3.children;
+      return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SLink, _ref6.cn("SLink", _objectSpread({}, assignProps({
+        "role": "link",
+        "tabIndex": disabled ? -1 : 0,
+        "use:href": disabled ? void 0 : href,
+        "visually-disabled": disabled,
+        "text-color": resolveColor(color),
+        "tag": "a",
+        "noWrapText": noWrap,
+        "use:noWrap": false,
+        "ref": this.containerRef,
+        "__excludeProps": ["disabled", "aria-disabled"],
+        "onMouseEnter": this.handleMouseEnterOnlyAddon,
+        "onMouseLeave": this.handleMouseLeaveOnlyAddon
+      }, _ref))), hasChildren !== void 0 ? this.renderChildren() : this.renderOnlyAddons());
     }
-  }]), o;
-}(P);
-a(v, "displayName", "Link");
-a(v, "defaultProps", {
-  noWrap: !0
+  }]);
+  return RootLink2;
+}(Component);
+_defineProperty(RootLink, "displayName", "Link");
+_defineProperty(RootLink, "defaultProps", {
+  noWrap: true
 });
-a(v, "style", V);
-a(v, "enhance", [M(), H()]);
-function $(g) {
-  var s = arguments[0], o, _ = k, e = g.styles;
-  return o = d(e), /* @__PURE__ */ i.createElement(_, o.cn("SText", b({}, x({
-    tag: "span"
-  }, s))));
+_defineProperty(RootLink, "style", style);
+_defineProperty(RootLink, "enhance", [keyboardFocusEnhance(), resolveColorEnhance()]);
+function LinkText(props) {
+  var _ref2 = arguments[0], _ref7;
+  var SText = Box;
+  var styles = props.styles;
+  return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SText, _ref7.cn("SText", _objectSpread({}, assignProps({
+    "tag": "span"
+  }, _ref2))));
 }
-function F(g) {
-  var s = arguments[0], o, _ = k, e = g.styles;
-  return o = d(e), /* @__PURE__ */ i.createElement(_, o.cn("SAddon", b({}, x({
-    tag: "span"
-  }, s))));
+function Addon(props) {
+  var _ref3 = arguments[0], _ref8;
+  var SAddon = Box;
+  var styles = props.styles;
+  return _ref8 = sstyled(styles), /* @__PURE__ */ React.createElement(SAddon, _ref8.cn("SAddon", _objectSpread({}, assignProps({
+    "tag": "span"
+  }, _ref3))));
 }
-var y = E(v, {
-  Text: $,
-  Addon: F
+var Link = createComponent(RootLink, {
+  Text: LinkText,
+  Addon
 });
 export {
-  y as default
+  Link as default
 };

package/lib/esm/index.mjs

@@ -1,4 +1,4 @@
-import { default as o } from "./Link.mjs";
+import { default as default2 } from "./Link.mjs";
 export {
-  o as default
+  default2 as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/link",
   "description": "Semrush Link Component",
-  "version": "16.0.0-prerelease.4",
+  "version": "16.0.0-prerelease.7",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -14,12 +14,12 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/typography": "16.0.0-prerelease.4",
-    "@semcore/tooltip": "16.0.0-prerelease.4",
-    "@semcore/flex-box": "16.0.0-prerelease.4"
+    "@semcore/typography": "16.0.0-prerelease.7",
+    "@semcore/tooltip": "16.0.0-prerelease.7",
+    "@semcore/flex-box": "16.0.0-prerelease.7"
   },
   "peerDependencies": {
-    "@semcore/base-components": "^16.0.0-prerelease.4"
+    "@semcore/base-components": "^16.0.0-prerelease.7"
   },
   "repository": {
     "type": "git",