@particle-network/connectkit 2.1.3 → 3.0.0-alpha.0

package/dist/chunk-L6FO3RHF.js

@@ -0,0 +1,294 @@
+"use client";
+import {
+  SocialItem,
+  SocialLoginContainer,
+  ToggleContainer
+} from "./chunk-BD4WVCBW.js";
+import {
+  useWalletConnector
+} from "./chunk-XCXHOPWL.js";
+import {
+  ForwardContainer,
+  WalletIconContainer,
+  WalletItem,
+  WalletLable,
+  WalletsContainer
+} from "./chunk-DEXEZZLU.js";
+import {
+  useConnectWithWallet
+} from "./chunk-64CCJ5RO.js";
+import {
+  button_default
+} from "./chunk-ATZ4LTSA.js";
+import {
+  Forward_default
+} from "./chunk-4LG4G5FM.js";
+import {
+  Icons_default
+} from "./chunk-T5GA77TN.js";
+import {
+  useLastConnectorId
+} from "./chunk-N3I53AXB.js";
+import {
+  useWalletProps,
+  useWalletsProps_default
+} from "./chunk-CJX7E6AL.js";
+import {
+  useAppearance,
+  useContext,
+  useLocales,
+  useRouter
+} from "./chunk-RCHD3MLP.js";
+
+// src/utils/social.ts
+var socialAuthTypes = [
+  "facebook",
+  "google",
+  "apple",
+  "twitter",
+  "discord",
+  "github",
+  "twitch",
+  "microsoft",
+  "linkedin"
+];
+var isSocialAuthType = (authType) => {
+  return socialAuthTypes.includes(authType);
+};
+
+// src/components/socialLogin/index.tsx
+import { isEVMChain } from "@particle-network/connector-core";
+import { Fragment, useMemo } from "react";
+
+// src/assets/toggle.tsx
+import { motion } from "framer-motion";
+import { jsx } from "react/jsx-runtime";
+var ToggleIcon = () => {
+  return /* @__PURE__ */ jsx(motion.svg, { xmlns: "http://www.w3.org/2000/svg", width: "25", height: "25", viewBox: "0 0 25 25", fill: "none", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M5.20833 10.4167C4.0625 10.4167 3.125 11.3542 3.125 12.5C3.125 13.6459 4.0625 14.5834 5.20833 14.5834C6.35417 14.5834 7.29167 13.6459 7.29167 12.5C7.29167 11.3542 6.35417 10.4167 5.20833 10.4167ZM19.7917 10.4167C18.6458 10.4167 17.7083 11.3542 17.7083 12.5C17.7083 13.6459 18.6458 14.5834 19.7917 14.5834C20.9375 14.5834 21.875 13.6459 21.875 12.5C21.875 11.3542 20.9375 10.4167 19.7917 10.4167ZM12.5 10.4167C11.3542 10.4167 10.4167 11.3542 10.4167 12.5C10.4167 13.6459 11.3542 14.5834 12.5 14.5834C13.6458 14.5834 14.5833 13.6459 14.5833 12.5C14.5833 11.3542 13.6458 10.4167 12.5 10.4167Z",
+      fill: "var(--pcm-body-action-color)"
+    }
+  ) });
+};
+var toggle_default = ToggleIcon;
+
+// src/components/socialLogin/index.tsx
+import { Fragment as Fragment2, jsx as jsx2, jsxs } from "react/jsx-runtime";
+var SocialLogin = ({ expandList }) => {
+  const { config } = useContext();
+  const { navigate } = useRouter();
+  const locales = useLocales();
+  const { appearance } = useAppearance();
+  const wallet = useWalletProps(isEVMChain(config.chains[0]) ? "particleEVM" : "particleSolana");
+  const walletConnector = useWalletConnector("particleAuth");
+  const evmWalletConnector = useWalletConnector("evmWallet");
+  const { lastConnectorId } = useLastConnectorId();
+  const connectWallet = useConnectWithWallet();
+  const recentConnectSocialAuthType = useMemo(() => {
+    if (lastConnectorId !== "particleSolana" && lastConnectorId !== "particleEVM") {
+      return lastConnectorId;
+    }
+    const lastAuthType = walletConnector.auth.getLatestAuthType();
+    return lastAuthType;
+  }, [lastConnectorId, walletConnector.auth]);
+  const authTypes = useMemo(() => {
+    if (!walletConnector) {
+      return [];
+    }
+    const hasPasskeyConnector = evmWalletConnector?.connectors.some(
+      (connector) => connector.id === "passkeySmartWallet"
+    );
+    const enablePasskey = Boolean(config.plugins.some((plugin) => plugin.id === "aa") && hasPasskeyConnector) && appearance.collapsePasskeyButton === "as-social";
+    if (enablePasskey) {
+      return walletConnector.supportAuthTypes.concat("passkeySmartWallet");
+    }
+    return walletConnector.supportAuthTypes;
+  }, [walletConnector, evmWalletConnector, appearance.collapsePasskeyButton, config.plugins]);
+  const socialAuthTypes2 = useMemo(() => {
+    return authTypes.filter((item) => isSocialAuthType(item) || item === "passkeySmartWallet");
+  }, [authTypes]);
+  const _expandList = useMemo(() => {
+    const evmConnector = config.getWalletConnector("evmWallet");
+    const solanaConnector = config.getWalletConnector("solanaWallet");
+    return expandList || !authTypes.includes("email") && !authTypes.includes("phone") && !evmConnector && !solanaConnector;
+  }, [expandList, authTypes, config]);
+  const renderAuthTypes = useMemo(() => {
+    if (_expandList) {
+      return socialAuthTypes2;
+    }
+    if (socialAuthTypes2.length > 5) {
+      return socialAuthTypes2.slice(0, 4);
+    }
+    return socialAuthTypes2;
+  }, [_expandList, socialAuthTypes2]);
+  const onSocialLogin = (authType) => {
+    if (wallet && isSocialAuthType(authType)) {
+      const name = authType.charAt(0).toUpperCase() + authType.slice(1);
+      connectWallet(
+        {
+          ...wallet,
+          name,
+          shortName: name,
+          iconShape: authType === "microsoft" || authType === "twitch" ? "squircle" : "circle",
+          icon: /* @__PURE__ */ jsx2(Icons_default, { authType, "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:89:17:SocialIcon" })
+        },
+        {
+          authParams: {
+            socialType: authType,
+            prompt: "select_account"
+          }
+        }
+      );
+    } else if (authType === "passkeySmartWallet") {
+      navigate("login-passkey" /* LoginPasskey */);
+    }
+  };
+  const felxRow = useMemo(() => {
+    if (_expandList) {
+      return false;
+    }
+    return socialAuthTypes2.length > 3;
+  }, [_expandList, socialAuthTypes2]);
+  return /* @__PURE__ */ jsx2(SocialLoginContainer, { $felxRow: felxRow, "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:111:5:SocialLoginContainer", children: renderAuthTypes.map((authType, index) => {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(SocialItem, { $felxRow: felxRow, onClick: () => onSocialLogin(authType), "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:115:13:SocialItem", children: [
+        /* @__PURE__ */ jsx2(Icons_default, { authType, "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:116:15:SocialIcon" }),
+        /* @__PURE__ */ jsx2("span", { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:117:15:span", children: authType === "passkeySmartWallet" ? "Passkey" : authType }),
+        !felxRow && /* @__PURE__ */ jsxs(Fragment2, { children: [
+          recentConnectSocialAuthType === authType && /* @__PURE__ */ jsx2(WalletLable, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:120:64:WalletLable", children: locales.lastUsed }),
+          /* @__PURE__ */ jsx2(ForwardContainer, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:121:19:ForwardContainer", children: /* @__PURE__ */ jsx2(Forward_default, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:122:21:Forward" }) })
+        ] })
+      ] }),
+      !_expandList && index == 3 && socialAuthTypes2.length > 5 && /* @__PURE__ */ jsx2(ToggleContainer, { onClick: () => navigate("connectors" /* Connectors */, { type: "social" }), "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:128:15:ToggleContainer", children: /* @__PURE__ */ jsx2(toggle_default, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:129:17:ToggleIcon" }) })
+    ] }, authType);
+  }) });
+};
+var socialLogin_default = SocialLogin;
+
+// src/components/wallets/index.tsx
+import { useMemo as useMemo2 } from "react";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var Wallets = ({ expandList }) => {
+  const { navigate } = useRouter();
+  const wallets = useWalletsProps_default();
+  const locales = useLocales();
+  const { lastConnectorId } = useLastConnectorId();
+  const connectWallet = useConnectWithWallet();
+  const { appearance } = useAppearance();
+  const walletData = useMemo2(() => {
+    const _wallets = wallets.filter(
+      (wallet) => wallet.connector.type !== "particleAuth" && wallet.connector.id !== "passkeySmartWallet"
+    );
+    const datas = [];
+    for (const wallet of _wallets) {
+      const key = wallet.groupId || wallet.connector.id;
+      const itemData = datas.find((w) => w.key === key);
+      if (itemData) {
+        itemData.props.push(wallet);
+      } else {
+        datas.push({
+          key,
+          props: [wallet],
+          rankingWeight: 0
+        });
+      }
+    }
+    const recommendedWallets = appearance?.recommendedWallets || [];
+    datas.forEach((data) => {
+      const ids = data.key.split(",").map((id) => id.trim());
+      if (data.props.length > 1) {
+        data.lable = locales.multichain;
+      }
+      if (data.props.some((item) => item.isInstalled)) {
+        data.lable = locales.installed;
+        data.rankingWeight = 100;
+      }
+      const recommended = recommendedWallets.find((item) => ids.includes(item.walletId));
+      if (recommended) {
+        if (recommended.label !== "none") {
+          if (recommended.label?.toLowerCase() === "recommended") {
+            data.lable = locales.recommended;
+          } else if (recommended.label?.toLowerCase() === "popular") {
+            data.lable = locales.popular;
+          } else {
+            data.lable = recommended.label || locales.recommended;
+          }
+          data.customLable = true;
+        } else {
+          data.customLable = void 0;
+        }
+        const recommendedIndex = recommendedWallets.indexOf(recommended);
+        data.rankingWeight = 200 + (99 - recommendedIndex);
+      }
+      if (lastConnectorId && ids.includes(lastConnectorId)) {
+        data.lable = locales.lastUsed;
+        data.rankingWeight = 500;
+        data.customLable = void 0;
+      }
+    });
+    datas.sort((a, b) => {
+      if (a.rankingWeight > b.rankingWeight) {
+        return -1;
+      }
+      if (a.rankingWeight < b.rankingWeight) {
+        return 1;
+      }
+      return 0;
+    });
+    return datas;
+  }, [locales, wallets, appearance?.recommendedWallets, lastConnectorId]);
+  const renderWallets = useMemo2(() => {
+    if (expandList) {
+      return walletData;
+    }
+    if (appearance?.collapseWalletList) {
+      return [];
+    }
+    if (walletData.length > 3) {
+      return walletData.slice(0, 3);
+    }
+    return walletData;
+  }, [walletData, expandList, appearance?.collapseWalletList]);
+  const displayActionBtn = useMemo2(() => {
+    return !expandList && (appearance?.collapseWalletList || walletData.length > 3);
+  }, [expandList, appearance?.collapseWalletList, walletData]);
+  const onWalletClick = (data) => {
+    if (data.props.length > 1) {
+      navigate("select-chain" /* SelectChain */, { walletData: data });
+    } else {
+      const walletProps = data.props[0];
+      connectWallet(walletProps);
+    }
+  };
+  return /* @__PURE__ */ jsxs2(WalletsContainer, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:131:5:WalletsContainer", children: [
+    renderWallets.map((walletData2) => {
+      return /* @__PURE__ */ jsxs2(WalletItem, { onClick: () => onWalletClick(walletData2), "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:134:11:WalletItem", children: [
+        /* @__PURE__ */ jsx3(WalletIconContainer, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:135:13:WalletIconContainer", children: walletData2.props[0].icon }),
+        walletData2.props[0].name,
+        walletData2.lable && /* @__PURE__ */ jsx3(WalletLable, { $customLable: walletData2.customLable, "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:137:34:WalletLable", children: walletData2.lable }),
+        /* @__PURE__ */ jsx3(ForwardContainer, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:138:13:ForwardContainer", children: /* @__PURE__ */ jsx3(Forward_default, { "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:139:15:Forward" }) })
+      ] }, walletData2.key);
+    }),
+    displayActionBtn && /* @__PURE__ */ jsx3(
+      button_default,
+      {
+        onClick: () => {
+          navigate("connectors" /* Connectors */);
+        },
+        color: "secondary",
+        "data-insp-path": "/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:146:9:Button",
+        children: appearance?.collapseWalletList ? locales.continueWithWallet : locales.viewAllWallets
+      }
+    )
+  ] });
+};
+var wallets_default = Wallets;
+
+export {
+  isSocialAuthType,
+  socialLogin_default,
+  wallets_default
+};
+//# sourceMappingURL=chunk-L6FO3RHF.js.map

package/dist/chunk-L6FO3RHF.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/utils/social.ts", "../src/components/socialLogin/index.tsx", "../src/assets/toggle.tsx", "../src/components/wallets/index.tsx"],
+  "sourcesContent": ["const socialAuthTypes = [\n  'facebook',\n  'google',\n  'apple',\n  'twitter',\n  'discord',\n  'github',\n  'twitch',\n  'microsoft',\n  'linkedin',\n] as const;\n\nexport type SocialAuthType = (typeof socialAuthTypes)[number];\n\nexport const isSocialAuthType = (authType: string): authType is SocialAuthType => {\n  return (socialAuthTypes as readonly string[]).includes(authType);\n};\n", "import { isEVMChain } from '@particle-network/connector-core';\nimport { Fragment, useMemo } from 'react';\nimport Forward from '../../assets/icons/Forward';\nimport ToggleIcon from '../../assets/toggle';\nimport { useContext } from '../../context';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { useConnectWithWallet } from '../../hooks/useConnectWithWallet';\nimport { useLastConnectorId } from '../../hooks/useLastConnectorId';\nimport useLocales from '../../hooks/useLocales';\nimport { useRouter } from '../../hooks/useRouter';\nimport { useWalletConnector } from '../../hooks/useWalletConnectors';\nimport { useWalletProps } from '../../hooks/useWalletsProps';\nimport { RoutePath } from '../../pages';\nimport { isSocialAuthType } from '../../utils/social';\nimport { ForwardContainer, WalletLable } from '../wallets/styles';\nimport SocialIcon from './Icons';\nimport { SocialItem, SocialLoginContainer, ToggleContainer } from './styles';\n\nconst SocialLogin = ({ expandList }: { expandList?: boolean }) => {\n  const { config } = useContext();\n  const { navigate } = useRouter();\n  const locales = useLocales();\n  const { appearance } = useAppearance();\n  const wallet = useWalletProps(isEVMChain(config.chains[0]) ? 'particleEVM' : 'particleSolana');\n  const walletConnector = useWalletConnector('particleAuth');\n  const evmWalletConnector = useWalletConnector('evmWallet');\n\n  const { lastConnectorId } = useLastConnectorId();\n\n  const connectWallet = useConnectWithWallet();\n\n  const recentConnectSocialAuthType = useMemo(() => {\n    if (lastConnectorId !== 'particleSolana' && lastConnectorId !== 'particleEVM') {\n      return lastConnectorId;\n    }\n\n    const lastAuthType = walletConnector.auth.getLatestAuthType();\n    return lastAuthType;\n  }, [lastConnectorId, walletConnector.auth]);\n\n  const authTypes = useMemo(() => {\n    if (!walletConnector) {\n      return [];\n    }\n    const hasPasskeyConnector = evmWalletConnector?.connectors.some(\n      (connector) => connector.id === 'passkeySmartWallet'\n    );\n    const enablePasskey =\n      Boolean(config.plugins.some((plugin) => plugin.id === 'aa') && hasPasskeyConnector) &&\n      appearance.collapsePasskeyButton === 'as-social';\n    if (enablePasskey) {\n      return walletConnector.supportAuthTypes.concat('passkeySmartWallet');\n    }\n    return walletConnector.supportAuthTypes;\n  }, [walletConnector, evmWalletConnector, appearance.collapsePasskeyButton, config.plugins]);\n\n  const socialAuthTypes = useMemo(() => {\n    return authTypes.filter((item) => isSocialAuthType(item) || item === 'passkeySmartWallet');\n  }, [authTypes]);\n\n  const _expandList = useMemo(() => {\n    const evmConnector = config.getWalletConnector('evmWallet');\n    const solanaConnector = config.getWalletConnector('solanaWallet');\n    return (\n      expandList || (!authTypes.includes('email') && !authTypes.includes('phone') && !evmConnector && !solanaConnector)\n    );\n  }, [expandList, authTypes, config]);\n\n  const renderAuthTypes = useMemo(() => {\n    if (_expandList) {\n      return socialAuthTypes;\n    }\n\n    if (socialAuthTypes.length > 5) {\n      return socialAuthTypes.slice(0, 4);\n    }\n    return socialAuthTypes;\n  }, [_expandList, socialAuthTypes]);\n\n  const onSocialLogin = (authType: string) => {\n    if (wallet && isSocialAuthType(authType)) {\n      const name = authType.charAt(0).toUpperCase() + authType.slice(1);\n      connectWallet(\n        {\n          ...wallet,\n          name,\n          shortName: name,\n          iconShape: authType === 'microsoft' || authType === 'twitch' ? 'squircle' : 'circle',\n          icon: <SocialIcon authType={authType}  data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:89:17:SocialIcon\" />,\n        },\n        {\n          authParams: {\n            socialType: authType,\n            prompt: 'select_account',\n          },\n        }\n      );\n    } else if (authType === 'passkeySmartWallet') {\n      navigate(RoutePath.LoginPasskey);\n    }\n  };\n\n  const felxRow = useMemo(() => {\n    if (_expandList) {\n      return false;\n    }\n    return socialAuthTypes.length > 3;\n  }, [_expandList, socialAuthTypes]);\n\n  return (\n    <SocialLoginContainer $felxRow={felxRow} data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:111:5:SocialLoginContainer\" >\n      {renderAuthTypes.map((authType, index) => {\n        return (\n          <Fragment key={authType}>\n            <SocialItem $felxRow={felxRow} onClick={() => onSocialLogin(authType)} data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:115:13:SocialItem\" >\n              <SocialIcon authType={authType}  data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:116:15:SocialIcon\" />\n              <span data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:117:15:span\">{authType === 'passkeySmartWallet' ? 'Passkey' : authType}</span>\n              {!felxRow && (\n                <>\n                  {recentConnectSocialAuthType === authType && <WalletLable data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:120:64:WalletLable\">{locales.lastUsed}</WalletLable>}\n                  <ForwardContainer data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:121:19:ForwardContainer\">\n                    <Forward  data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:122:21:Forward\"/>\n                  </ForwardContainer>\n                </>\n              )}\n            </SocialItem>\n            {!_expandList && index == 3 && socialAuthTypes.length > 5 && (\n              <ToggleContainer onClick={() => navigate(RoutePath.Connectors, { type: 'social' })} data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:128:15:ToggleContainer\" >\n                <ToggleIcon  data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/socialLogin/index.tsx:129:17:ToggleIcon\"/>\n              </ToggleContainer>\n            )}\n          </Fragment>\n        );\n      })}\n    </SocialLoginContainer>\n  );\n};\n\nexport default SocialLogin;\n", "import { motion } from 'framer-motion';\n\nconst ToggleIcon = () => {\n  return (\n    <motion.svg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25' fill='none'>\n      <path\n        d='M5.20833 10.4167C4.0625 10.4167 3.125 11.3542 3.125 12.5C3.125 13.6459 4.0625 14.5834 5.20833 14.5834C6.35417 14.5834 7.29167 13.6459 7.29167 12.5C7.29167 11.3542 6.35417 10.4167 5.20833 10.4167ZM19.7917 10.4167C18.6458 10.4167 17.7083 11.3542 17.7083 12.5C17.7083 13.6459 18.6458 14.5834 19.7917 14.5834C20.9375 14.5834 21.875 13.6459 21.875 12.5C21.875 11.3542 20.9375 10.4167 19.7917 10.4167ZM12.5 10.4167C11.3542 10.4167 10.4167 11.3542 10.4167 12.5C10.4167 13.6459 11.3542 14.5834 12.5 14.5834C13.6458 14.5834 14.5833 13.6459 14.5833 12.5C14.5833 11.3542 13.6458 10.4167 12.5 10.4167Z'\n        fill='var(--pcm-body-action-color)'\n      />\n    </motion.svg>\n  );\n};\n\nexport default ToggleIcon;\n", "import { useMemo } from 'react';\nimport Forward from '../../assets/icons/Forward';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { useConnectWithWallet } from '../../hooks/useConnectWithWallet';\nimport { useLastConnectorId } from '../../hooks/useLastConnectorId';\nimport useLocales from '../../hooks/useLocales';\nimport { useRouter } from '../../hooks/useRouter';\nimport useWalletsProps from '../../hooks/useWalletsProps';\nimport { RoutePath } from '../../pages';\nimport Button from '../button';\nimport { ForwardContainer, WalletIconContainer, WalletItem, WalletLable, WalletsContainer } from './styles';\nimport type { WalletData } from './types';\n\nconst Wallets = ({ expandList }: { expandList?: boolean }) => {\n  const { navigate } = useRouter();\n  const wallets = useWalletsProps();\n  const locales = useLocales();\n  const { lastConnectorId } = useLastConnectorId();\n  const connectWallet = useConnectWithWallet();\n  const { appearance } = useAppearance();\n\n  const walletData = useMemo(() => {\n    const _wallets = wallets.filter(\n      (wallet) => wallet.connector.type !== 'particleAuth' && wallet.connector.id !== 'passkeySmartWallet'\n    );\n    // merge wallet\n    const datas: WalletData[] = [];\n    for (const wallet of _wallets) {\n      const key = wallet.groupId || wallet.connector.id;\n      const itemData = datas.find((w) => w.key === key);\n      if (itemData) {\n        itemData.props.push(wallet);\n      } else {\n        datas.push({\n          key,\n          props: [wallet],\n          rankingWeight: 0,\n        });\n      }\n    }\n\n    // set lable\n    const recommendedWallets = appearance?.recommendedWallets || [];\n    datas.forEach((data) => {\n      const ids = data.key.split(',').map((id) => id.trim());\n      // multichain lable\n      if (data.props.length > 1) {\n        data.lable = locales.multichain;\n      }\n\n      // installed lable\n      if (data.props.some((item) => item.isInstalled)) {\n        data.lable = locales.installed;\n        data.rankingWeight = 100;\n      }\n\n      // custom lable\n      const recommended = recommendedWallets.find((item) => ids.includes(item.walletId));\n      if (recommended) {\n        if (recommended.label !== 'none') {\n          if (recommended.label?.toLowerCase() === 'recommended') {\n            data.lable = locales.recommended;\n          } else if (recommended.label?.toLowerCase() === 'popular') {\n            data.lable = locales.popular;\n          } else {\n            data.lable = recommended.label || locales.recommended;\n          }\n          data.customLable = true;\n        } else {\n          data.customLable = undefined;\n        }\n        const recommendedIndex = recommendedWallets.indexOf(recommended);\n        data.rankingWeight = 200 + (99 - recommendedIndex);\n      }\n\n      // last used lable\n      if (lastConnectorId && ids.includes(lastConnectorId)) {\n        data.lable = locales.lastUsed;\n        data.rankingWeight = 500;\n        data.customLable = undefined;\n      }\n    });\n\n    // sort items\n    datas.sort((a, b) => {\n      if (a.rankingWeight > b.rankingWeight) {\n        return -1;\n      }\n\n      if (a.rankingWeight < b.rankingWeight) {\n        return 1;\n      }\n\n      return 0;\n    });\n\n    return datas;\n  }, [locales, wallets, appearance?.recommendedWallets, lastConnectorId]);\n\n  const renderWallets = useMemo(() => {\n    if (expandList) {\n      return walletData;\n    }\n\n    if (appearance?.collapseWalletList) {\n      return [];\n    }\n\n    if (walletData.length > 3) {\n      return walletData.slice(0, 3);\n    }\n\n    return walletData;\n  }, [walletData, expandList, appearance?.collapseWalletList]);\n\n  const displayActionBtn = useMemo(() => {\n    return !expandList && (appearance?.collapseWalletList || walletData.length > 3);\n  }, [expandList, appearance?.collapseWalletList, walletData]);\n\n  const onWalletClick = (data: WalletData) => {\n    if (data.props.length > 1) {\n      // route to select chain\n      navigate(RoutePath.SelectChain, { walletData: data });\n    } else {\n      const walletProps = data.props[0];\n      connectWallet(walletProps);\n    }\n  };\n\n  return (\n    <WalletsContainer data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:131:5:WalletsContainer\">\n      {renderWallets.map((walletData) => {\n        return (\n          <WalletItem key={walletData.key} onClick={() => onWalletClick(walletData)} data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:134:11:WalletItem\" >\n            <WalletIconContainer data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:135:13:WalletIconContainer\">{walletData.props[0].icon}</WalletIconContainer>\n            {walletData.props[0].name}\n            {walletData.lable && <WalletLable $customLable={walletData.customLable} data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:137:34:WalletLable\" >{walletData.lable}</WalletLable>}\n            <ForwardContainer data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:138:13:ForwardContainer\">\n              <Forward  data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:139:15:Forward\"/>\n            </ForwardContainer>\n          </WalletItem>\n        );\n      })}\n\n      {displayActionBtn && (\n        <Button\n          onClick={() => {\n            navigate(RoutePath.Connectors);\n          }}\n          color='secondary'\n         data-insp-path=\"/Users/chaichuanfa/work/WebProjects/particle-connect-modal/packages/connectkit/src/components/wallets/index.tsx:146:9:Button\" >\n          {appearance?.collapseWalletList ? locales.continueWithWallet : locales.viewAllWallets}\n        </Button>\n      )}\n    </WalletsContainer>\n  );\n};\n\nexport default Wallets;\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "socialAuthTypes", "useMemo", "jsx", "jsxs", "useMemo", "walletData"]
+}

package/dist/chunk-LAGMNSQN.js

@@ -0,0 +1,9 @@
+"use client";
+
+// src/types/index.ts
+var EmailRegExp = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+
+export {
+  EmailRegExp
+};
+//# sourceMappingURL=chunk-LAGMNSQN.js.map

package/dist/chunk-LAGMNSQN.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/types/index.ts"],
+  "sourcesContent": ["export type HttpUrl = `http${string}`;\n\nexport type Mode = 'light' | 'dark' | 'auto';\n\ntype HexColor = `#${string}`;\n\ntype Unit = `${number}px` | `${number}rem`;\n\nexport type CustomTheme = {\n  // font\n  '--pcm-font-family'?: string;\n\n  // focus color, input etc.\n  '--pcm-focus-color'?: string;\n\n  // modal\n  '--pcm-overlay-background'?: string;\n  '--pcm-overlay-backdrop-filter'?: string; // default: blur(6px)\n  '--pcm-modal-box-shadow'?: string;\n  '--pcm-modal-max-height'?: string;\n\n  // border radius\n  '--pcm-rounded-sm'?: Unit; // 6px\n  '--pcm-rounded-md'?: Unit; // 12px\n  '--pcm-rounded-lg'?: Unit; // 18px\n  '--pcm-rounded-xl'?: Unit; // 24px\n  '--pcm-rounded-full'?: Unit; // 9999px\n\n  // background\n  '--pcm-body-background'?: string;\n  '--pcm-body-background-secondary'?: string;\n  '--pcm-body-background-tertiary'?: string;\n\n  // foreground: font color\n  '--pcm-body-color'?: string;\n  '--pcm-body-color-secondary'?: string;\n  '--pcm-body-color-tertiary'?: string;\n\n  // button\n  '--pcm-button-border-color'?: string;\n  '--pcm-button-font-weight'?: string;\n  '--pcm-button-hover-shadow'?: string;\n\n  // primary button\n  '--pcm-primary-button-color'?: string;\n  '--pcm-primary-button-bankground'?: string;\n  '--pcm-primary-button-hover-background'?: string; // TODO: \u53EF\u6839\u636Ebankground\u8BA1\u7B97\u51FA\u6765\uFF0C\u4E0D\u7528\u81EA\u5B9A\u4E49\uFF1F\n\n  // secondary button\n  '--pcm-secondary-button-color'?: string;\n  '--pcm-secondary-button-bankground'?: string;\n  '--pcm-secondary-button-hover-background'?: string; // TODO: \u53EF\u6839\u636Ebankground\u8BA1\u7B97\u51FA\u6765\uFF0C\u4E0D\u7528\u81EA\u5B9A\u4E49\uFF1F\n\n  // action button color\n  '--pcm-body-action-color'?: string;\n\n  // accent color\n  '--pcm-accent-color'?: string;\n\n  // error\n  '--pcm-error-color'?: HexColor;\n\n  // success\n  '--pcm-success-color'?: HexColor;\n\n  // warning\n  '--pcm-warning-color'?: HexColor;\n\n  // custom wallet lable color\n  '--pcm-wallet-lable-color'?: HexColor;\n};\n\nexport type Theme = CustomTheme;\n\nexport enum ConnectorType {\n  Email = 'email',\n  Phone = 'phone',\n  Social = 'social',\n  Wallet = 'wallet',\n  Passkey = 'passkey',\n}\n\nexport type ConnectorTypeValue = `${ConnectorType}`;\n\nexport const EmailRegExp = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;\n\nexport interface CloudflareOptions {\n  getContainer?: HTMLElement | (() => HTMLElement) | false;\n  theme?: 'light' | 'dark';\n  language?: string;\n}\n"],
+  "mappings": ";;;AAoFO,IAAM,cAAc;",
+  "names": []
+}

package/dist/chunk-LD7ULFQB.js

@@ -0,0 +1,301 @@
+"use client";
+
+// src/components/modal/styles.ts
+import { motion } from "framer-motion";
+import { keyframes, styled } from "styled-components";
+var FadeIn = keyframes`
+from { opacity: 0; }
+  to { opacity: 1; }
+`;
+var FadeOut = keyframes`
+from { opacity: 1; }
+  to { opacity: 0; }
+`;
+var BoxIn = keyframes`
+  from{ opacity: 0; transform: scale(0.97); }
+  to{ opacity: 1; transform: scale(1); }
+`;
+var BoxOut = keyframes`
+  from{ opacity: 1; transform: scale(1); }
+  to{ opacity: 0; transform: scale(0.97); }
+`;
+var MobileBoxIn = keyframes`
+  from { transform: translate3d(0, 100%, 0); }
+  to { transform: translate3d(0, 0%, 0); }
+`;
+var MobileBoxOut = keyframes`
+  from { opacity: 1; }
+  to { opacity: 0; }
+`;
+var ModalRoot = styled.div`
+  z-index: 2147483646;
+  position: fixed;
+  inset: 0;
+`;
+var ModalOverlay = styled(motion.div)`
+  z-index: 1;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--pcm-overlay-background, rgba(71, 88, 107, 0.24));
+  backdrop-filter: var(--pcm-overlay-backdrop-filter, blur(6px));
+  opacity: 0;
+  animation: ${(props) => props.$active ? FadeIn : FadeOut} 150ms ease-out both;
+`;
+var ModalContainer = styled(motion.div)`
+  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
+  --duration: 200ms;
+  --transition: height var(--duration) var(--ease), width var(--duration) var(--ease);
+  z-index: 3;
+  display: block;
+  pointer-events: none;
+  position: ${(props) => props.$positionInside ? "unset" : "absolute"};
+  left: 50%;
+  top: 50%;
+  width: 100%;
+  height: auto;
+  transform: ${(props) => {
+  return props.$positionInside ? "none" : "translate(-50%, -50%)";
+}};
+  backface-visibility: hidden;
+  @media only screen and (max-width: 560px) {
+    pointer-events: auto;
+    left: 0;
+    top: auto;
+    bottom: -5px;
+    transform: none;
+  }
+`;
+var BoxContainer = styled(motion.div)`
+  z-index: 2;
+  position: relative;
+  color: var(--pcm-body-color, black);
+  animation: 150ms ease both;
+  animation-name: ${(props) => props.$positionInside ? null : BoxOut};
+  margin: auto;
+  height: var(--height);
+  width: 400px;
+  border-radius: var(--pcm-rounded-xl);
+  background: var(--pcm-body-background);
+  box-shadow: var(--pcm-modal-box-shadow);
+  transition: all 300ms ease;
+  overflow: hidden;
+  &.active {
+    animation-name: ${(props) => props.$positionInside ? null : BoxIn};
+  }
+
+  @media only screen and (max-width: 560px) {
+    animation-name: ${(props) => props.$positionInside ? null : MobileBoxOut};
+    animation-duration: 130ms;
+    animation-timing-function: ease;
+    width: 100%;
+    transition: 200ms height cubic-bezier(0.15, 1.15, 0.6, 1);
+    will-change: height;
+    border-bottom-left-radius: ${(props) => props.$positionInside ? null : 0};
+    border-bottom-right-radius: ${(props) => props.$positionInside ? null : 0};
+
+    &.active {
+      animation-name: ${(props) => props.$positionInside ? null : MobileBoxIn};
+      animation-duration: 300ms;
+      animation-delay: 32ms;
+      animation-timing-function: cubic-bezier(0.15, 1.15, 0.6, 1);
+    }
+  }
+`;
+var PageContainer = styled(motion.div)`
+  z-index: 2;
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  pointer-events: auto;
+`;
+var PageContents = styled(motion.div)`
+  width: 100%;
+  padding: 64px 0 24px 0;
+  backface-visibility: hidden;
+  box-sizing: border-box;
+`;
+var PageContent = styled(motion.div)`
+  max-width: 100%;
+  margin: 0 4px 22px;
+  padding: 12px 20px 8px;
+  overflow-x: visible;
+  max-height: var(--pcm-modal-max-height, 65vh);
+  overflow-y: auto;
+  opacity: 0;
+  animation: ${FadeIn} 300ms ease-out both;
+`;
+var ControllerContainer = styled(motion.div)`
+  z-index: 3;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  height: 64px;
+  transform: translateX(-50%);
+  backface-visibility: hidden;
+  width: 100%;
+  pointer-events: auto;
+`;
+var BackButton = styled(motion.button)`
+  z-index: 3;
+  cursor: pointer;
+  position: absolute;
+  top: 21px;
+  left: 17px;
+  width: 30px;
+  height: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform-origin: center center;
+  border-radius: 16px;
+  padding: 0;
+  margin: 0;
+  color: var(--pcm-body-action-color);
+  background: var(--pcm-body-background);
+  transition: background-color 200ms ease;
+  background: var(--pcm-body-background-secondary);
+  border: none;
+  svg {
+    display: block;
+    position: relative;
+    left: -1px;
+  }
+
+  &:active {
+    transform: scale(0.9);
+    svg {
+      left: 0px;
+    }
+  }
+`;
+var CloseButton = styled(motion.button)`
+  z-index: 3;
+  cursor: pointer;
+  position: absolute;
+  top: 21px;
+  right: 17px;
+  width: 30px;
+  height: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 16px;
+  padding: 0;
+  margin: 0;
+  color: var(--pcm-body-action-color);
+  background: var(--pcm-body-background);
+  transition: background-color 200ms ease;
+  background: var(--pcm-body-background-secondary);
+  border: none;
+  svg {
+    display: block;
+  }
+  &:active {
+    transform: scale(0.9);
+  }
+`;
+var ModalHeading = styled(motion.div)`
+  z-index: 3;
+  pointer-events: none;
+  user-select: none;
+  position: absolute;
+  top: 12px;
+  left: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  transform: translateX(-50%);
+  width: 100%;
+  text-align: center;
+  font-size: 17px;
+  line-height: 20px;
+  padding: 0 24px;
+  font-weight: var(--pcm-modal-heading-font-weight, 600);
+  color: var(--pcm-body-color);
+  span {
+    display: inline-block;
+  }
+`;
+var ErrorContent = styled(motion.div)`
+  background: var(--pcm-error-background);
+  color: var(--pcm-error-color);
+  text-align: center;
+  height: 28px;
+  margin: 0 24px;
+  line-height: 28px;
+  border-radius: 30px;
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 400;
+  padding: 0 16px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  svg {
+    display: inline-block;
+    margin-right: 8px;
+  }
+`;
+var ErrorMessage = styled(motion.div)`
+  display: ${(props) => props.$display ? "flex" : "none"};
+  width: 100%;
+  margin: 16px auto;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  animation: ${(props) => props.$display ? FadeIn : FadeOut} 200ms ease-out both;
+`;
+var ModalContentContainer = styled(motion.div)`
+  position: relative;
+  padding: 0;
+`;
+var FlexCenter = styled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: ${(props) => props.gap || 0}px;
+`;
+var FlexLeft = styled.div`
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  gap: ${(props) => props.gap || 0}px;
+`;
+var FlexRight = styled.div`
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: ${(props) => props.gap || 0}px;
+`;
+var FlexBetween = styled.div`
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: ${(props) => props.gap || 0}px;
+`;
+
+export {
+  ModalRoot,
+  ModalOverlay,
+  ModalContainer,
+  BoxContainer,
+  PageContainer,
+  PageContents,
+  PageContent,
+  ControllerContainer,
+  BackButton,
+  CloseButton,
+  ModalHeading,
+  ErrorContent,
+  ErrorMessage,
+  FlexCenter,
+  FlexLeft,
+  FlexBetween
+};
+//# sourceMappingURL=chunk-LD7ULFQB.js.map