@bigbinary/neeto-molecules 1.0.83 → 1.0.84

package/dist/ShareViaLink.cjs.js

@@ -1220,7 +1220,7 @@ function QRCodeSVG(props) {
     shapeRendering: "crispEdges"
   }), image);
 }
-var QRCode = (props) => {
+var QRCode$1 = (props) => {
   const _a = props, { renderAs } = _a, otherProps = __objRest(_a, ["renderAs"]);
   if (renderAs === "svg") {
     return /* @__PURE__ */ React__default["default"].createElement(QRCodeSVG, __spreadValues({}, otherProps));
@@ -1228,14 +1228,9 @@ var QRCode = (props) => {
   return /* @__PURE__ */ React__default["default"].createElement(QRCodeCanvas, __spreadValues({}, otherProps));
 };
 
-var QRCodeModal = function QRCodeModal(_ref) {
+var QRCode = function QRCode(_ref) {
   var entity = _ref.entity,
-    entityName = _ref.entityName,
-    isOpen = _ref.isOpen,
-    onClose = _ref.onClose,
     url = _ref.url;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
   if (!entity) return null;
   var id = entity.id,
     name = entity.name;
@@ -1246,58 +1241,50 @@ var QRCodeModal = function QRCodeModal(_ref) {
       name: pure.slugify(name)
     });
   };
-  return /*#__PURE__*/React__default["default"].createElement(neetoui.Modal, {
-    "data-testid": "qr-code-modal",
-    isOpen: isOpen,
-    onClose: onClose
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Header, {
-    description: t("neetoMolecules.shareViaLink.socialMediaShare.qrCodeInfo", {
-      entity: entityName
-    })
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "flex flex-col space-y-4"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    className: "mb-0.5",
     lineHeight: "normal",
-    style: "h3",
-    weight: "semibold"
-  }, t("neetoMolecules.shareViaLink.socialMediaShare.qrCodeDownload"))), /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Body, null, /*#__PURE__*/React__default["default"].createElement(QRCode, {
+    style: "body2",
+    weight: "medium"
+  }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+    i18nKey: "neetoMolecules.shareViaLink.socialMediaShare.qrCodeInfo",
+    components: {
+      button: /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
+        "data-testid": "qr-code-download-button",
+        style: "link",
+        onClick: handleDownload
+      })
+    }
+  })), /*#__PURE__*/React__default["default"].createElement(QRCode$1, {
     "data-testid": canvasId,
     id: canvasId,
     value: url
-  })), /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Footer, {
-    className: "space-x-2"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
-    "data-testid": "qr-code-download-button",
-    label: t("neetoMolecules.shareViaLink.socialMediaShare.qrCodeDownload"),
-    onClick: handleDownload
-  }), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
-    label: t("neetoMolecules.common.actions.cancel"),
-    style: "text",
-    onClick: onClose
-  })));
+  }));
 };
 
 var SocialMedia = function SocialMedia(_ref) {
   var entity = _ref.entity,
-    entityName = _ref.entityName,
     postTitle = _ref.postTitle,
     url = _ref.url;
-  var _useState = React.useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isQRCodeModalOpen = _useState2[0],
-    setIsQRCodeModalOpen = _useState2[1];
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var socialMediaButtonClasses = "neeto-ui-bg-gray-200 hover:neeto-ui-bg-gray-300 flex h-12 w-12 cursor-pointer items-center justify-center neeto-ui-rounded-md transition-colors duration-300 ease-in-out";
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "space-y-4",
+    className: "flex space-x-4 divide-x"
+  }, /*#__PURE__*/React__default["default"].createElement(QRCode, {
+    entity: entity,
+    url: url
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "space-y-4 pl-4",
     "data-testid": "social-media-block"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     className: "neeto-ui-text-gray-800",
-    lineHeight: "snug",
+    lineHeight: "normal",
     style: "body2",
     weight: "medium"
   }, t("neetoMolecules.shareViaLink.socialMediaShare.title")), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "flex items-center gap-4"
+    className: "flex gap-4"
   }, Object.entries(SOCIAL_MEDIA_OPTIONS).map(function (_ref2) {
     var _ref3 = _slicedToArray(_ref2, 2),
       key = _ref3[0],
@@ -1319,23 +1306,7 @@ var SocialMedia = function SocialMedia(_ref) {
     }, /*#__PURE__*/React__default["default"].createElement(Icon, {
       size: 24
     }));
-  }), /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, {
-    content: t("neetoMolecules.shareViaLink.socialMediaShare.qrCode")
-  }, /*#__PURE__*/React__default["default"].createElement("button", {
-    className: socialMediaButtonClasses,
-    "data-testid": "qr-code-button",
-    onClick: function onClick() {
-      return setIsQRCodeModalOpen(true);
-    }
-  }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.QrCode, null)))), /*#__PURE__*/React__default["default"].createElement(QRCodeModal, {
-    entity: entity,
-    entityName: entityName,
-    isOpen: isQRCodeModalOpen,
-    url: url,
-    onClose: function onClose() {
-      return setIsQRCodeModalOpen(false);
-    }
-  }));
+  }))));
 };
 
 var ShareViaLink = function ShareViaLink(_ref) {
@@ -1375,9 +1346,8 @@ var ShareViaLink = function ShareViaLink(_ref) {
     url: url
   }), /*#__PURE__*/React__default["default"].createElement(SocialMedia, {
     entity: entity,
-    entityName: entityName,
-    postTitle: socialMediaPostTitle,
-    url: url
+    url: url,
+    postTitle: socialMediaPostTitle
   }));
 };