test-ahaan-v2-4 1.0.15 → 1.0.16

package/dist/index.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,6 +17,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
@@ -49,7 +59,7 @@ __export(src_exports, {
   useTriaTransaction: () => useTriaTransaction
 });
 module.exports = __toCommonJS(src_exports);
-var import_react7 = require("react");
+var import_react6 = require("react");
 
 // src/NavContext.tsx
 var import_react = require("react");
@@ -164,26 +174,10 @@ var WalletCloseButton_default = WalletCloseButton;
 
 // src/index.tsx
 var import_connect = require("@tria-sdk/connect");
-
-// src/hooks/usePageVisibilty.tsx
-var import_react2 = require("react");
-var usePageVisibility = () => {
-  const [isVisible, setIsVisible] = (0, import_react2.useState)(!document.hidden);
-  (0, import_react2.useEffect)(() => {
-    const handleVisibilityChange = () => {
-      setIsVisible(!document.hidden);
-    };
-    document.addEventListener("visibilitychange", handleVisibilityChange);
-    return () => {
-      document.removeEventListener("visibilitychange", handleVisibilityChange);
-    };
-  }, []);
-  return isVisible;
-};
-var usePageVisibilty_default = usePageVisibility;
+var import_react_draggable = __toESM(require("react-draggable"));
 
 // src/hooks/useContractWrite.tsx
-var import_react3 = require("react");
+var import_react2 = require("react");
 
 // src/utils/shared.ts
 var createEncodedData = (data) => {
@@ -218,9 +212,9 @@ var createIframe = (iframeUrl, hookName) => {
 // src/hooks/useContractWrite.tsx
 var authUrl = "https://auth.tria.so";
 var useContractWrite = (calldata) => {
-  const [data, setData] = (0, import_react3.useState)("");
-  const [isLoading, setIsLoading] = (0, import_react3.useState)(false);
-  const [isError, setIsError] = (0, import_react3.useState)(false);
+  const [data, setData] = (0, import_react2.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react2.useState)(false);
+  const [isError, setIsError] = (0, import_react2.useState)(false);
   const write = () => {
     setIsLoading(true);
     const iframeEncodedData = createEncodedData(calldata);
@@ -229,7 +223,7 @@ var useContractWrite = (calldata) => {
     setIsLoading(false);
     return signIframeUrl;
   };
-  (0, import_react3.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     const detect = (event) => {
       var _a;
       console.log("event---------------->", event);
@@ -256,12 +250,12 @@ var useContractWrite = (calldata) => {
 };
 
 // src/hooks/useSendTransaction.tsx
-var import_react4 = require("react");
+var import_react3 = require("react");
 var authUrl2 = "https://auth.tria.so";
 var useSendTransaction = (calldata) => {
-  const [data, setData] = (0, import_react4.useState)("");
-  const [isLoading, setIsLoading] = (0, import_react4.useState)(false);
-  const [isError, setIsError] = (0, import_react4.useState)(false);
+  const [data, setData] = (0, import_react3.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react3.useState)(false);
+  const [isError, setIsError] = (0, import_react3.useState)(false);
   const sendTransaction = () => {
     setIsLoading(true);
     const iframeEncodedData = createEncodedData(calldata);
@@ -270,7 +264,7 @@ var useSendTransaction = (calldata) => {
     setIsLoading(false);
     return signIframeUrl;
   };
-  (0, import_react4.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     const detect = (event) => {
       var _a;
       if (event.origin !== authUrl2)
@@ -296,12 +290,12 @@ var useSendTransaction = (calldata) => {
 };
 
 // src/hooks/useSignMessage.tsx
-var import_react5 = require("react");
+var import_react4 = require("react");
 var authUrl3 = "https://auth.tria.so";
 var useSignMessage = (calldata) => {
-  const [data, setData] = (0, import_react5.useState)("");
-  const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
-  const [isError, setIsError] = (0, import_react5.useState)(false);
+  const [data, setData] = (0, import_react4.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react4.useState)(false);
+  const [isError, setIsError] = (0, import_react4.useState)(false);
   const signMessage = () => {
     setIsLoading(true);
     const iframeEncodedData = createEncodedData(calldata);
@@ -310,7 +304,7 @@ var useSignMessage = (calldata) => {
     setIsLoading(false);
     return signIframeUrl;
   };
-  (0, import_react5.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     const detect = (event) => {
       var _a;
       if (event.origin !== authUrl3)
@@ -337,13 +331,13 @@ var useSignMessage = (calldata) => {
 };
 
 // src/hooks/useContractRead.tsx
-var import_react6 = require("react");
+var import_react5 = require("react");
 var import_ethers = require("ethers");
 var import_web = require("@tria-sdk/web");
 var useContractRead = (params) => {
-  const [data, setData] = (0, import_react6.useState)("");
-  const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
-  const [isError, setIsError] = (0, import_react6.useState)(false);
+  const [data, setData] = (0, import_react5.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
+  const [isError, setIsError] = (0, import_react5.useState)(false);
   const read = () => __async(void 0, null, function* () {
     try {
       setIsLoading(true);
@@ -423,60 +417,105 @@ var useTriaTransaction = () => {
     callContract
   };
 };
-var TriaConnectProvider = () => {
-  const [renderAuthIframe, setRenderAuthIframe] = (0, import_react7.useState)(false);
-  (0, import_react7.useEffect)(() => {
+var TriaConnectProvider = ({ triaStaging = false }) => {
+  const [renderAuthIframe, setRenderAuthIframe] = (0, import_react6.useState)(false);
+  const [authIframeSrc, setAuthIframeSrc] = (0, import_react6.useState)("");
+  (0, import_react6.useEffect)(() => {
     const getQueryParam = (param) => {
       return new URLSearchParams(window.location.search).get(param);
     };
     const isVerified = getQueryParam("verified") === "true";
     setRenderAuthIframe(isVerified);
+    {
+      triaStaging ? setAuthIframeSrc("https://auth-tria.vercel.app/verified") : setAuthIframeSrc("https://auth.tria.so/verified");
+    }
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: renderAuthIframe && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     "iframe",
     {
-      src: "https://auth.tria.so/verified",
+      src: authIframeSrc,
       title: "Auth Verification",
       style: { display: "none" }
     }
   ) });
 };
 var initialChains = ["POLYGON", "ARBITRUM", "FUSE", "AVALANCHE", "BINANCE", "ETH", "FANTOM", "OPTIMISM"];
-var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7", supportedChains = initialChains, defaultChain = "POLYGON" }) => {
-  const [view, setView] = (0, import_react7.useState)("Home");
-  const [triaName, setTriaName] = (0, import_react7.useState)();
-  const [userAddress, setUserAddress] = (0, import_react7.useState)(null);
-  const [email, setEmail] = (0, import_react7.useState)("");
-  const [showWallet, setShowWallet] = (0, import_react7.useState)(false);
-  const [isDarkMode, setIsDarkMode] = (0, import_react7.useState)(true);
-  const [showOnboarding, setShowOnboarding] = (0, import_react7.useState)(false);
-  const [appDomain, setAppDomain] = (0, import_react7.useState)();
-  const [iframeURL, setIframeURL] = (0, import_react7.useState)();
-  const WALLET_BASE_URL = "https://jade-gingersnap-930e55.netlify.app/";
-  const [accessToken, setAccessToken] = (0, import_react7.useState)();
-  const darkMode = true;
-  const [authIFrameUrl, setAuthIFrameUrl] = (0, import_react7.useState)("");
+var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7", supportedChains = initialChains, defaultChain = "POLYGON", darkMode = true, triaStaging = false, buttonPosition = { x: 100, y: 100 } }) => {
+  const [view, setView] = (0, import_react6.useState)("Home");
+  const [triaName, setTriaName] = (0, import_react6.useState)();
+  const [userAddress, setUserAddress] = (0, import_react6.useState)(null);
+  const [email, setEmail] = (0, import_react6.useState)("");
+  const [showWallet, setShowWallet] = (0, import_react6.useState)(false);
+  const [isDarkMode, setIsDarkMode] = (0, import_react6.useState)(true);
+  const [showOnboarding, setShowOnboarding] = (0, import_react6.useState)(false);
+  const [appDomain, setAppDomain] = (0, import_react6.useState)();
+  const [iframeURL, setIframeURL] = (0, import_react6.useState)();
+  const [accessToken, setAccessToken] = (0, import_react6.useState)();
+  const [authIFrameUrl, setAuthIFrameUrl] = (0, import_react6.useState)("");
   const { account } = (0, import_connect.useAccount)();
-  const [stackui, setStackUi] = (0, import_react7.useState)(false);
-  const [wasOpen, setWasOpen] = (0, import_react7.useState)(false);
-  const [walletVisible, setWalletVisible] = (0, import_react7.useState)(false);
-  const isTabVisible = usePageVisibilty_default();
-  (0, import_react7.useEffect)(() => {
-    if (!isTabVisible && showWallet) {
-      setShowWallet(false);
-      setWasOpen(true);
-    } else if (wasOpen) {
-      setShowWallet(true);
+  const [stackui, setStackUi] = (0, import_react6.useState)(false);
+  const [wasOpen, setWasOpen] = (0, import_react6.useState)(false);
+  const [coords, setCoords] = (0, import_react6.useState)({ x: 0, y: 0 });
+  const [walletVisible, setWalletVisible] = (0, import_react6.useState)(false);
+  const [posX, setPosX] = (0, import_react6.useState)();
+  const [posY, setPosY] = (0, import_react6.useState)();
+  const [buttonPosX, setButtonPosX] = (0, import_react6.useState)(window.innerWidth - ((buttonPosition == null ? void 0 : buttonPosition.x) || 100));
+  const [buttonPosY, setButtonPosY] = (0, import_react6.useState)(window.innerHeight - ((buttonPosition == null ? void 0 : buttonPosition.y) || 100));
+  const [currentTime, setCurrentTime] = (0, import_react6.useState)();
+  (0, import_react6.useEffect)(() => {
+    const handleWindowMouseMove = (e) => {
+      setCoords({
+        x: e.clientX,
+        y: e.clientY
+      });
+    };
+    window.addEventListener("mousemove", handleWindowMouseMove);
+    return () => {
+      window.removeEventListener(
+        "mousemove",
+        handleWindowMouseMove
+      );
+    };
+  }, []);
+  (0, import_react6.useEffect)(() => {
+    console.log(buttonPosX, buttonPosY);
+  }, [buttonPosX, buttonPosY]);
+  const handleStartDragging = () => {
+    var now = /* @__PURE__ */ new Date();
+    setCurrentTime(now.getTime());
+  };
+  const handleStopDragging = () => {
+    var now = /* @__PURE__ */ new Date();
+    console.log(coords);
+    console.log(window.innerWidth);
+    console.log(window.innerHeight);
+    setButtonPosX(coords.x);
+    setButtonPosY(coords.y);
+    if (window.innerWidth - coords.x < 312 && window.innerHeight - coords.y < 586) {
+      setPosX(window.innerWidth - 312);
+      setPosY(window.innerHeight - 586);
+    } else if (window.innerWidth - coords.x < 312) {
+      setPosX(window.innerWidth - 312);
+      setPosY(coords.y);
+    } else if (window.innerHeight - coords.y < 586) {
+      setPosX(coords.x);
+      setPosY(window.innerHeight - 586);
+    } else {
+      setPosX(coords.x);
+      setPosY(coords.y);
     }
-  }, [isTabVisible]);
-  (0, import_react7.useEffect)(() => {
+    if (currentTime && now.getTime() - currentTime < 200) {
+      handleWalletButtonClick();
+    }
+  };
+  (0, import_react6.useEffect)(() => {
     if (!account && triaName) {
       console.log("Account is null, reloading the page");
       localStorage.setItem("hasReloaded", "true");
       window.location.reload();
     }
   }, [account, triaName]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     setInterval(() => {
       var _a, _b, _c;
       if (localStorage.getItem("tria.wallet.store") !== null) {
@@ -492,23 +531,26 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
       }
     }, 500);
   }, []);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     setInterval(() => {
       setShowOnboarding(true);
     }, 1e3);
   }, []);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const item = localStorage.getItem("access_token");
     setAccessToken(item || "");
     setAppDomain(window.parent.origin);
   }, [triaName]);
   const fromDapp = true;
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const encodedParams = btoa(JSON.stringify({ triaName, userAddress, appDomain, darkMode, logo, accessToken, primaryColor, fromDapp, dappName, defaultChain, supportedChains }));
     console.log(encodedParams, userAddress, triaName, accessToken, logo, appDomain, darkMode, primaryColor, fromDapp, dappName, defaultChain, supportedChains);
-    setIframeURL(`https://tria-wallet-git-walllet-responsive-lego-triahq.vercel.app/${encodedParams}`);
+    {
+      triaStaging ? setIframeURL(`https://staging-tria-wallet.vercel.app/${encodedParams}`) : setIframeURL(`https://wallet.tria.so/${encodedParams}`);
+    }
+    ;
   }, [triaName, userAddress]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     console.log("WALLET URL ---->", iframeURL);
   }, [iframeURL]);
   const nav_context_object = {
@@ -525,18 +567,21 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
     email,
     setEmail
   };
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     console.log("log from sdk ----->", dappName, logo);
     if (dappName && (dappName == null ? void 0 : dappName.length) > 0 && logo && (logo == null ? void 0 : logo.length) > 0) {
-      setAuthIFrameUrl(`https://auth.tria.so/?dappName=${dappName}&dappLogo=${logo}&stackui=${uiType}&dappDomain=${dappDomain}`);
+      {
+        triaStaging ? setAuthIFrameUrl(`https://auth-tria.vercel.app/?dappName=${dappName}&dappLogo=${logo}&stackui=${uiType}&dappDomain=${dappDomain}`) : setAuthIFrameUrl(`https://auth.tria.so/?dappName=${dappName}&dappLogo=${logo}&stackui=${uiType}&dappDomain=${dappDomain}`);
+      }
+      ;
     }
   }, [dappName, logo]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (uiType === "yes") {
       setStackUi(true);
     }
   }, [uiType]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const handleClickOutside = (event) => {
       const iframeElement = document.getElementById("triaWallet");
       if (iframeElement && !iframeElement.contains(event.target)) {
@@ -548,7 +593,7 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
       document.removeEventListener("mousedown", handleClickOutside);
     };
   }, []);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (primaryColor) {
       document.documentElement.style.setProperty("--primary-color", primaryColor);
     }
@@ -561,7 +606,7 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
       setWalletVisible(true);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(NavContext_default.Provider, { value: nav_context_object, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(NavContext_default.Provider, { value: nav_context_object, children: [
     !triaName && showOnboarding && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: {
       borderRadius: "20px",
       overflow: "hidden",
@@ -574,7 +619,15 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
       "div",
       {
         id: "triaWallet",
-        style: { display: walletVisible ? "block" : "none", justifyItems: "space-between", backgroundColor: "transparent", position: "fixed", bottom: "4px", right: "2px", zIndex: 9999 },
+        style: {
+          display: walletVisible ? "block" : "none",
+          justifyItems: "space-between",
+          backgroundColor: "transparent",
+          position: "fixed",
+          top: posY,
+          left: posX,
+          zIndex: 9999
+        },
         children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
           "div",
           {
@@ -607,10 +660,8 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
                 "div",
                 {
                   style: {
-                    height: "60vh",
-                    width: "32vh",
-                    minHeight: "586px",
-                    minWidth: "312px",
+                    height: "586px",
+                    width: "312px",
                     borderRadius: "20px",
                     overflow: "hidden",
                     backgroundColor: "#101010"
@@ -635,21 +686,34 @@ var Application = ({ dappName, dappDomain, uiType, logo, primaryColor = "#A855F7
       }
     ),
     triaName && !walletVisible && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      "div",
+      import_react_draggable.default,
       {
-        style: {
-          position: "fixed",
-          maxWidth: "80px",
-          width: "auto",
-          bottom: "4px",
-          right: "60px",
-          cursor: "pointer",
-          marginTop: "25px",
-          height: "150px",
-          zIndex: 9999
-        },
-        onClick: handleWalletButtonClick,
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TriaWalletButton, { bgColor: primaryColor || "#A855F7", stackui })
+        defaultPosition: { x: buttonPosX, y: buttonPosY },
+        onStart: handleStartDragging,
+        onStop: handleStopDragging,
+        bounds: { top: 0, left: 0 },
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              // cursor:'move',
+              flexDirection: "row",
+              justifyContent: "center",
+              alignItems: "center",
+              height: "60px",
+              width: "60px",
+              borderRadius: "100%",
+              background: "#FFFFFF",
+              //  boxShadow: isPressed ? '0 0 10px 0 rgba(0,0,0,0.2)' : '0 0 20px 0 rgba(0,0,0,0.25)',
+              // transform: isPressed ? 'scale(0.80)' : 'scale(1)',
+              transition: "all 0.1s ease",
+              cursor: "pointer",
+              zIndex: "9999"
+            },
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TriaWalletButton, { bgColor: primaryColor || "#A855F7", stackui })
+          }
+        )
       }
     )
   ] }) });