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

package/dist/chunk-YJLDJTPO.js

@@ -0,0 +1,23 @@
+"use client";
+import {
+  useIconColor_default
+} from "./chunk-GI5CBVZH.js";
+
+// src/assets/social/phone.tsx
+import { jsx } from "react/jsx-runtime";
+var Phone = () => {
+  const { background } = useIconColor_default();
+  return /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M19.2575 19.772C19.2575 20.158 19.1785 20.5171 19.0206 20.8492C18.8628 21.1812 18.6458 21.4746 18.3696 21.7294C18.0933 21.9843 17.7697 22.185 17.3987 22.3317C17.0277 22.4785 16.6292 22.5518 16.2029 22.5518H7.79705C7.37086 22.5518 6.97228 22.4785 6.6013 22.3317C6.23035 22.185 5.90674 21.9843 5.6305 21.7294C5.35423 21.4746 5.1372 21.1812 4.97935 20.8492C4.82147 20.5171 4.74255 20.158 4.74255 19.772V4.25124C4.74255 3.86515 4.82147 3.50223 4.97935 3.16248C5.1372 2.82271 5.35423 2.52543 5.6305 2.27061C5.90674 2.01579 6.23035 1.81503 6.6013 1.66831C6.97228 1.5216 7.37086 1.44824 7.79705 1.44824H16.2029C16.6292 1.44824 17.0277 1.5216 17.3987 1.66831C17.7697 1.81503 18.0933 2.01579 18.3696 2.27061C18.6458 2.52543 18.8628 2.82271 19.0206 3.16248C19.1785 3.50223 19.2575 3.86515 19.2575 4.25124V19.772ZM17.3395 5.36317H6.63683V18.6368H17.3395V5.36317ZM11.9882 19.2855C11.6567 19.2855 11.3686 19.4013 11.1239 19.633C10.8792 19.8646 10.7569 20.1504 10.7569 20.4901C10.7569 20.8144 10.8792 21.0963 11.1239 21.3356C11.3686 21.575 11.6567 21.6947 11.9882 21.6947C12.3354 21.6947 12.6275 21.575 12.8643 21.3356C13.101 21.0963 13.2195 20.8144 13.2195 20.4901C13.2195 20.1504 13.101 19.8646 12.8643 19.633C12.6275 19.4013 12.3354 19.2855 11.9882 19.2855ZM13.8824 3.39413C13.8824 3.27058 13.843 3.17406 13.764 3.10455C13.6851 3.03506 13.5983 3.00032 13.5036 3.00032H10.4964C10.4175 3.00032 10.3346 3.03506 10.2478 3.10455C10.161 3.17406 10.1176 3.27058 10.1176 3.39413C10.1176 3.51768 10.157 3.61419 10.236 3.68369C10.3149 3.75318 10.4017 3.78794 10.4964 3.78794H13.5036C13.5983 3.78794 13.6851 3.75318 13.764 3.68369C13.843 3.61419 13.8824 3.51768 13.8824 3.39413Z",
+      fill: background
+    }
+  ) });
+};
+var phone_default = Phone;
+
+export {
+  phone_default
+};
+//# sourceMappingURL=chunk-YJLDJTPO.js.map

package/dist/chunk-YJLDJTPO.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/assets/social/phone.tsx"],
+  "sourcesContent": ["import useIconColor from '../../hooks/useIconColor';\n\nconst Phone = () => {\n  const { background } = useIconColor();\n\n  return (\n    <svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'>\n      <path\n        d='M19.2575 19.772C19.2575 20.158 19.1785 20.5171 19.0206 20.8492C18.8628 21.1812 18.6458 21.4746 18.3696 21.7294C18.0933 21.9843 17.7697 22.185 17.3987 22.3317C17.0277 22.4785 16.6292 22.5518 16.2029 22.5518H7.79705C7.37086 22.5518 6.97228 22.4785 6.6013 22.3317C6.23035 22.185 5.90674 21.9843 5.6305 21.7294C5.35423 21.4746 5.1372 21.1812 4.97935 20.8492C4.82147 20.5171 4.74255 20.158 4.74255 19.772V4.25124C4.74255 3.86515 4.82147 3.50223 4.97935 3.16248C5.1372 2.82271 5.35423 2.52543 5.6305 2.27061C5.90674 2.01579 6.23035 1.81503 6.6013 1.66831C6.97228 1.5216 7.37086 1.44824 7.79705 1.44824H16.2029C16.6292 1.44824 17.0277 1.5216 17.3987 1.66831C17.7697 1.81503 18.0933 2.01579 18.3696 2.27061C18.6458 2.52543 18.8628 2.82271 19.0206 3.16248C19.1785 3.50223 19.2575 3.86515 19.2575 4.25124V19.772ZM17.3395 5.36317H6.63683V18.6368H17.3395V5.36317ZM11.9882 19.2855C11.6567 19.2855 11.3686 19.4013 11.1239 19.633C10.8792 19.8646 10.7569 20.1504 10.7569 20.4901C10.7569 20.8144 10.8792 21.0963 11.1239 21.3356C11.3686 21.575 11.6567 21.6947 11.9882 21.6947C12.3354 21.6947 12.6275 21.575 12.8643 21.3356C13.101 21.0963 13.2195 20.8144 13.2195 20.4901C13.2195 20.1504 13.101 19.8646 12.8643 19.633C12.6275 19.4013 12.3354 19.2855 11.9882 19.2855ZM13.8824 3.39413C13.8824 3.27058 13.843 3.17406 13.764 3.10455C13.6851 3.03506 13.5983 3.00032 13.5036 3.00032H10.4964C10.4175 3.00032 10.3346 3.03506 10.2478 3.10455C10.161 3.17406 10.1176 3.27058 10.1176 3.39413C10.1176 3.51768 10.157 3.61419 10.236 3.68369C10.3149 3.75318 10.4017 3.78794 10.4964 3.78794H13.5036C13.5983 3.78794 13.6851 3.75318 13.764 3.68369C13.843 3.61419 13.8824 3.51768 13.8824 3.39413Z'\n        fill={background}\n      />\n    </svg>\n  );\n};\n\nexport default Phone;\n"],
+  "mappings": ";;;;;;AAOM;AALN,IAAM,QAAQ,MAAM;AAClB,QAAM,EAAE,WAAW,IAAI,qBAAa;AAEpC,SACE,oBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,OAAM,8BAChE;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAM;AAAA;AAAA,EACR,GACF;AAEJ;AAEA,IAAO,gBAAQ;",
+  "names": []
+}

package/dist/chunk-YNLKWKSL.js

@@ -0,0 +1,40 @@
+"use client";
+import {
+  getSystemMode,
+  useAppearance
+} from "./chunk-RCHD3MLP.js";
+
+// src/hooks/useIconColor.ts
+import { useEffect, useMemo, useState } from "react";
+var useIconColor = () => {
+  const [currentMode, setCurrentMode] = useState();
+  const { appearance } = useAppearance();
+  useEffect(() => {
+    if (appearance?.mode && appearance?.mode !== "auto") {
+      setCurrentMode(appearance?.mode);
+    } else {
+      setCurrentMode(getSystemMode());
+    }
+  }, [appearance?.mode]);
+  const foreground = useMemo(() => {
+    if (currentMode === "dark") {
+      return "#000000";
+    } else {
+      return "#ffffff";
+    }
+  }, [currentMode]);
+  const background = useMemo(() => {
+    if (currentMode === "dark") {
+      return "#ffffff";
+    } else {
+      return "#000000";
+    }
+  }, [currentMode]);
+  return { foreground, background, currentMode };
+};
+var useIconColor_default = useIconColor;
+
+export {
+  useIconColor_default
+};
+//# sourceMappingURL=chunk-YNLKWKSL.js.map

package/dist/chunk-YNLKWKSL.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/hooks/useIconColor.ts"],
+  "sourcesContent": ["import { useEffect, useMemo, useState } from 'react';\nimport { getSystemMode } from '../utils/theme';\nimport { useAppearance } from './useAppearance';\n\nconst useIconColor = () => {\n  const [currentMode, setCurrentMode] = useState<'light' | 'dark'>();\n  const { appearance } = useAppearance();\n\n  useEffect(() => {\n    if (appearance?.mode && appearance?.mode !== 'auto') {\n      setCurrentMode(appearance?.mode);\n    } else {\n      setCurrentMode(getSystemMode());\n    }\n  }, [appearance?.mode]);\n\n  const foreground = useMemo(() => {\n    if (currentMode === 'dark') {\n      return '#000000';\n    } else {\n      return '#ffffff';\n    }\n  }, [currentMode]);\n\n  const background = useMemo(() => {\n    if (currentMode === 'dark') {\n      return '#ffffff';\n    } else {\n      return '#000000';\n    }\n  }, [currentMode]);\n\n  return { foreground, background, currentMode };\n};\n\nexport default useIconColor;\n"],
+  "mappings": ";;;;;;;AAAA,SAAS,WAAW,SAAS,gBAAgB;AAI7C,IAAM,eAAe,MAAM;AACzB,QAAM,CAAC,aAAa,cAAc,IAAI,SAA2B;AACjE,QAAM,EAAE,WAAW,IAAI,cAAc;AAErC,YAAU,MAAM;AACd,QAAI,YAAY,QAAQ,YAAY,SAAS,QAAQ;AACnD,qBAAe,YAAY,IAAI;AAAA,IACjC,OAAO;AACL,qBAAe,cAAc,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,YAAY,IAAI,CAAC;AAErB,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,gBAAgB,QAAQ;AAC1B,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,gBAAgB,QAAQ;AAC1B,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,GAAG,CAAC,WAAW,CAAC;AAEhB,SAAO,EAAE,YAAY,YAAY,YAAY;AAC/C;AAEA,IAAO,uBAAQ;",
+  "names": []
+}

package/dist/chunk-YYOKJPK2.js

@@ -0,0 +1,30 @@
+"use client";
+
+// src/assets/social/linkedIn.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var LinkedIn = () => {
+  return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 31 31", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "15.4998", cy: "15.5", r: "14.2083", fill: "#0A66C2" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M9.44931 11.34C10.5014 11.34 11.3542 10.4872 11.3542 9.43515C11.3542 8.38312 10.5014 7.53027 9.44931 7.53027C8.39728 7.53027 7.54443 8.38312 7.54443 9.43515C7.54443 10.4872 8.39728 11.34 9.44931 11.34Z",
+        fill: "white"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M13.0987 12.7478H16.2557V14.194C16.2557 14.194 17.1124 12.4806 19.4434 12.4806C21.5227 12.4806 23.2452 13.505 23.2452 16.6271V23.211H19.9736V17.4249C19.9736 15.5831 18.9903 15.3806 18.241 15.3806C16.686 15.3806 16.4198 16.7219 16.4198 17.6652V23.211H13.0987V12.7478Z",
+        fill: "white"
+      }
+    ),
+    /* @__PURE__ */ jsx("path", { d: "M7.78878 12.7478H11.1099V23.211H7.78878V12.7478Z", fill: "white" })
+  ] });
+};
+var linkedIn_default = LinkedIn;
+
+export {
+  linkedIn_default
+};
+//# sourceMappingURL=chunk-YYOKJPK2.js.map

package/dist/chunk-YYOKJPK2.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/assets/social/linkedIn.tsx"],
+  "sourcesContent": ["const LinkedIn = () => {\n  return (\n    <svg width='24' height='24' viewBox='0 0 31 31' fill='none' xmlns='http://www.w3.org/2000/svg'>\n      <circle cx='15.4998' cy='15.5' r='14.2083' fill='#0A66C2' />\n      <path\n        d='M9.44931 11.34C10.5014 11.34 11.3542 10.4872 11.3542 9.43515C11.3542 8.38312 10.5014 7.53027 9.44931 7.53027C8.39728 7.53027 7.54443 8.38312 7.54443 9.43515C7.54443 10.4872 8.39728 11.34 9.44931 11.34Z'\n        fill='white'\n      />\n      <path\n        d='M13.0987 12.7478H16.2557V14.194C16.2557 14.194 17.1124 12.4806 19.4434 12.4806C21.5227 12.4806 23.2452 13.505 23.2452 16.6271V23.211H19.9736V17.4249C19.9736 15.5831 18.9903 15.3806 18.241 15.3806C16.686 15.3806 16.4198 16.7219 16.4198 17.6652V23.211H13.0987V12.7478Z'\n        fill='white'\n      />\n      <path d='M7.78878 12.7478H11.1099V23.211H7.78878V12.7478Z' fill='white' />\n    </svg>\n  );\n};\n\nexport default LinkedIn;\n"],
+  "mappings": ";;;AAEI,SACE,KADF;AAFJ,IAAM,WAAW,MAAM;AACrB,SACE,qBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,OAAM,8BAChE;AAAA,wBAAC,YAAO,IAAG,WAAU,IAAG,QAAO,GAAE,WAAU,MAAK,WAAU;AAAA,IAC1D;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IACA,oBAAC,UAAK,GAAE,oDAAmD,MAAK,SAAQ;AAAA,KAC1E;AAEJ;AAEA,IAAO,mBAAQ;",
+  "names": []
+}

package/dist/chunk-ZLJSXTUZ.js

@@ -0,0 +1,220 @@
+"use client";
+
+// src/components/circleSpinner/index.tsx
+import { AnimatePresence } from "framer-motion";
+
+// src/components/circleSpinner/styles.ts
+import { motion } from "framer-motion";
+import { css, styled } from "styled-components";
+var LogoContainer = styled(motion.div)`
+  z-index: 4;
+  position: relative;
+  width: ${(props) => props.width ?? 60}px;
+  height: ${(props) => props.height ?? 60}px;
+  svg {
+    z-index: 3;
+    position: relative;
+    display: block;
+  }
+`;
+var Logo = styled(motion.div)`
+  z-index: 2;
+  position: absolute;
+  overflow: hidden;
+  inset: ${(props) => props.inset ?? 6}px;
+  border-radius: 50px;
+  background: var(--pcm-body-background);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  svg,
+  img {
+    pointer-events: none;
+    display: block;
+    margin: 0 auto;
+    width: 100%;
+    height: 100%;
+    ${(props) => props.$small && css`
+        width: 85%;
+        height: 85%;
+      `}
+  }
+`;
+var SpinnerContainer = styled(motion.div)`
+  position: absolute;
+  inset: -5px;
+`;
+var ExpiringSpinner = styled(motion.div)`
+  pointer-events: none;
+  user-select: none;
+  z-index: 1;
+  position: absolute;
+  inset: -25%;
+  background: var(--pcm-body-background);
+  div:first-child {
+    position: absolute;
+    left: 50%;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+    &:before {
+      position: absolute;
+      content: '';
+      inset: 0;
+      background: var(--pcm-accent-color);
+      transform-origin: 0% 50%;
+      animation: rotateExpiringSpinner 5000ms ease-in both;
+    }
+  }
+  div:last-child {
+    position: absolute;
+    left: 0;
+    right: 50%;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+    &:before {
+      position: absolute;
+      content: '';
+      inset: 0;
+      background: var(--pcm-accent-color);
+      transform-origin: 100% 50%;
+      animation: rotateExpiringSpinner 5000ms ease-out 5000ms both;
+    }
+  }
+  @keyframes rotateExpiringSpinner {
+    0% {
+      transform: rotate(-180deg);
+    }
+    100% {
+      transform: rotate(0deg);
+    }
+  }
+`;
+var Spinner = styled(motion.div)`
+  pointer-events: none;
+  user-select: none;
+  z-index: 1;
+  position: absolute;
+  inset: 0;
+  svg {
+    display: block;
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    animation: rotateSpinner 1200ms linear infinite;
+  }
+  @keyframes rotateSpinner {
+    0% {
+      transform: rotate(0deg);
+    }
+    100% {
+      transform: rotate(360deg);
+    }
+  }
+`;
+
+// src/components/circleSpinner/index.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var CircleSpinner = ({
+  logo,
+  smallLogo,
+  connecting = true,
+  unavailable = false,
+  countdown = false,
+  width = 60,
+  height = 60,
+  inset = 4
+}) => {
+  return /* @__PURE__ */ jsxs(LogoContainer, { transition: { duration: 0.5, ease: [0.175, 0.885, 0.32, 0.98] }, width, height, children: [
+    /* @__PURE__ */ jsx(
+      Logo,
+      {
+        $small: !unavailable && smallLogo,
+        style: {
+          background: "none",
+          ...unavailable ? { borderRadius: 0 } : {}
+        },
+        inset,
+        children: logo
+      }
+    ),
+    /* @__PURE__ */ jsx(SpinnerContainer, { children: /* @__PURE__ */ jsxs(AnimatePresence, { children: [
+      connecting && /* @__PURE__ */ jsx(
+        Spinner,
+        {
+          initial: { opacity: 0 },
+          animate: { opacity: 1 },
+          exit: {
+            opacity: 0,
+            transition: {
+              duration: countdown ? 1 : 0
+            }
+          },
+          children: /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              "aria-hidden": "true",
+              width: width + 2,
+              height: height + 2,
+              viewBox: "0 0 102 102",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: [
+                /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    d: "M52 100C24.3858 100 2 77.6142 2 50",
+                    stroke: "url(#paint0_linear_1943_4139)",
+                    strokeWidth: "3.5",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                ),
+                /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
+                  "linearGradient",
+                  {
+                    id: "paint0_linear_1943_4139",
+                    x1: "2",
+                    y1: "48.5",
+                    x2: "53",
+                    y2: "100",
+                    gradientUnits: "userSpaceOnUse",
+                    children: [
+                      /* @__PURE__ */ jsx("stop", { stopColor: "var(--pcm-accent-color)" }),
+                      /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "var(--pcm-accent-color)", stopOpacity: "0" })
+                    ]
+                  }
+                ) })
+              ]
+            }
+          )
+        },
+        "Spinner"
+      ),
+      countdown && /* @__PURE__ */ jsxs(
+        ExpiringSpinner,
+        {
+          initial: { opacity: 0 },
+          animate: { opacity: 1 },
+          exit: { opacity: 0 },
+          transition: { duration: 0.25 },
+          children: [
+            /* @__PURE__ */ jsx("div", {}),
+            /* @__PURE__ */ jsx("div", {})
+          ]
+        },
+        "ExpiringSpinner"
+      )
+    ] }) })
+  ] });
+};
+var circleSpinner_default = CircleSpinner;
+
+export {
+  circleSpinner_default
+};
+//# sourceMappingURL=chunk-ZLJSXTUZ.js.map

package/dist/chunk-ZLJSXTUZ.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/circleSpinner/index.tsx", "../src/components/circleSpinner/styles.ts"],
+  "sourcesContent": ["import { AnimatePresence } from 'framer-motion';\nimport React from 'react';\nimport { ExpiringSpinner, Logo, LogoContainer, Spinner, SpinnerContainer } from './styles';\n\nconst CircleSpinner = ({\n  logo,\n  smallLogo,\n  connecting = true,\n  unavailable = false,\n  countdown = false,\n  width = 60,\n  height = 60,\n  inset = 4,\n}: {\n  logo?: React.ReactNode;\n  smallLogo?: boolean;\n  connecting?: boolean;\n  unavailable?: boolean;\n  countdown?: boolean;\n  width?: number;\n  height?: number;\n  inset?: number;\n}) => {\n  return (\n    <LogoContainer transition={{ duration: 0.5, ease: [0.175, 0.885, 0.32, 0.98] }} width={width} height={height}>\n      <Logo\n        $small={!unavailable && smallLogo}\n        style={{\n          background: 'none',\n          ...(unavailable ? { borderRadius: 0 } : {}),\n        }}\n        inset={inset}\n      >\n        {logo}\n      </Logo>\n      <SpinnerContainer>\n        <AnimatePresence>\n          {connecting && (\n            <Spinner\n              key='Spinner'\n              initial={{ opacity: 0 }}\n              animate={{ opacity: 1 }}\n              exit={{\n                opacity: 0,\n                transition: {\n                  duration: countdown ? 1 : 0,\n                },\n              }}\n            >\n              <svg\n                aria-hidden='true'\n                width={width + 2}\n                height={height + 2}\n                viewBox='0 0 102 102'\n                fill='none'\n                xmlns='http://www.w3.org/2000/svg'\n              >\n                <path\n                  d='M52 100C24.3858 100 2 77.6142 2 50'\n                  stroke='url(#paint0_linear_1943_4139)'\n                  strokeWidth='3.5'\n                  strokeLinecap='round'\n                  strokeLinejoin='round'\n                />\n                <defs>\n                  <linearGradient\n                    id='paint0_linear_1943_4139'\n                    x1='2'\n                    y1='48.5'\n                    x2='53'\n                    y2='100'\n                    gradientUnits='userSpaceOnUse'\n                  >\n                    <stop stopColor='var(--pcm-accent-color)' />\n                    <stop offset='1' stopColor='var(--pcm-accent-color)' stopOpacity='0' />\n                  </linearGradient>\n                </defs>\n              </svg>\n            </Spinner>\n          )}\n          {countdown && (\n            <ExpiringSpinner\n              key='ExpiringSpinner'\n              initial={{ opacity: 0 }}\n              animate={{ opacity: 1 }}\n              exit={{ opacity: 0 }}\n              transition={{ duration: 0.25 }}\n            >\n              <div />\n              <div />\n            </ExpiringSpinner>\n          )}\n        </AnimatePresence>\n      </SpinnerContainer>\n    </LogoContainer>\n  );\n};\n\nexport default CircleSpinner;\n", "import { motion } from 'framer-motion';\nimport { css, styled } from 'styled-components';\n\ninterface LogoContainerProps {\n  width?: number;\n  height?: number;\n}\nexport const LogoContainer = styled(motion.div)<LogoContainerProps>`\n  z-index: 4;\n  position: relative;\n  width: ${(props) => props.width ?? 60}px;\n  height: ${(props) => props.height ?? 60}px;\n  svg {\n    z-index: 3;\n    position: relative;\n    display: block;\n  }\n`;\n\nexport const Logo = styled(motion.div)<{ $small?: boolean; inset?: number }>`\n  z-index: 2;\n  position: absolute;\n  overflow: hidden;\n  inset: ${(props) => props.inset ?? 6}px;\n  border-radius: 50px;\n  background: var(--pcm-body-background);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  svg,\n  img {\n    pointer-events: none;\n    display: block;\n    margin: 0 auto;\n    width: 100%;\n    height: 100%;\n    ${(props) =>\n      props.$small &&\n      css`\n        width: 85%;\n        height: 85%;\n      `}\n  }\n`;\n\nexport const SpinnerContainer = styled(motion.div)`\n  position: absolute;\n  inset: -5px;\n`;\nexport const ExpiringSpinner = styled(motion.div)`\n  pointer-events: none;\n  user-select: none;\n  z-index: 1;\n  position: absolute;\n  inset: -25%;\n  background: var(--pcm-body-background);\n  div:first-child {\n    position: absolute;\n    left: 50%;\n    right: 0;\n    top: 0;\n    bottom: 0;\n    overflow: hidden;\n    &:before {\n      position: absolute;\n      content: '';\n      inset: 0;\n      background: var(--pcm-accent-color);\n      transform-origin: 0% 50%;\n      animation: rotateExpiringSpinner 5000ms ease-in both;\n    }\n  }\n  div:last-child {\n    position: absolute;\n    left: 0;\n    right: 50%;\n    top: 0;\n    bottom: 0;\n    overflow: hidden;\n    &:before {\n      position: absolute;\n      content: '';\n      inset: 0;\n      background: var(--pcm-accent-color);\n      transform-origin: 100% 50%;\n      animation: rotateExpiringSpinner 5000ms ease-out 5000ms both;\n    }\n  }\n  @keyframes rotateExpiringSpinner {\n    0% {\n      transform: rotate(-180deg);\n    }\n    100% {\n      transform: rotate(0deg);\n    }\n  }\n`;\nexport const Spinner = styled(motion.div)`\n  pointer-events: none;\n  user-select: none;\n  z-index: 1;\n  position: absolute;\n  inset: 0;\n  svg {\n    display: block;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    animation: rotateSpinner 1200ms linear infinite;\n  }\n  @keyframes rotateSpinner {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n`;\n"],
+  "mappings": "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",
+  "names": []
+}