@multiplatform.one/web3 5.0.27

package/dist/esm/connectkit/components/Common/Portal/index.native.js

@@ -0,0 +1,32 @@
+import { useEffect, useState, useRef } from "react";
+import { createPortal } from "react-dom";
+import { CONNECTKIT_VERSION } from "../../../index.native.js";
+var Portal = function Portal2(props) {
+  props = {
+    selector: "__CONNECTKIT__",
+    ...props
+  };
+  var {
+    selector,
+    children
+  } = props;
+  var ref = useRef(null);
+  var [mounted, setMounted] = useState(false);
+  useEffect(function () {
+    var selectorPrefixed = "#" + selector.replace(/^#/, "");
+    ref.current = document.querySelector(selectorPrefixed);
+    if (!ref.current) {
+      var div = document.createElement("div");
+      div.setAttribute("id", selector);
+      div.setAttribute("data-connectkit", `${CONNECTKIT_VERSION}`);
+      document.body.appendChild(div);
+      ref.current = div;
+    }
+    setMounted(true);
+  }, [selector]);
+  if (!ref.current) return null;
+  return mounted ? /* @__PURE__ */createPortal(children, ref.current) : null;
+};
+var Portal_default = Portal;
+export { Portal_default as default };
+//# sourceMappingURL=index.native.js.map

package/dist/esm/connectkit/components/Common/Portal/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","useRef","createPortal","CONNECTKIT_VERSION","Portal","Portal2","props","selector","children","ref","mounted","setMounted","selectorPrefixed","replace","current","document","querySelector","div","createElement","setAttribute","body","appendChild"],"sources":["../../../../../../src/connectkit/components/Common/Portal/index.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,SAAA,EAAWC,QAAA,EAAUC,MAAA,QAAc;AAC5C,SAASC,YAAA,QAAoB;AAC7B,SAASC,kBAAA,QAA0B;AAEnC,IAAAC,MAAM,YAAUC,OAAeA,CAAAC,KAAA;EAC7BA,KAAA,GAAQ;IACNC,QAAA,EAAU;IACV,GAAGD;EACL;EAEA;IAAMC,QAAE;IAAAC;EAAU,IAASF,KAAI;EAE/B,IAAAG,GAAM,GAAAR,MAAM,KAAuB;EACnC,KAAAS,OAAO,EAAAC,UAAS,IAAUX,QAAI,MAAkB;EAEhDD,SAAA,CAAU,YAAM;IACd,IAAAa,gBAAM,MAAmB,GAAAL,QAAM,CAAAM,OAAS,KAAQ,IAAM;IACtDJ,GAAA,CAAIK,OAAA,GAAUC,QAAA,CAASC,aAAA,CAAcJ,gBAAgB;IAErD,IAAI,CAACH,GAAA,CAAIK,OAAA,EAAS;MAChB,IAAAG,GAAM,GAAAF,QAAM,CAAAG,aAAS,MAAc;MACnCD,GAAA,CAAIE,YAAA,CAAa,MAAMZ,QAAQ;MAC/BU,GAAA,CAAIE,YAAA,CAAa,mBAAmB,GAAGhB,kBAAkB,EAAE;MAC3DY,QAAA,CAASK,IAAA,CAAKC,WAAA,CAAYJ,GAAG;MAC7BR,GAAA,CAAIK,OAAA,GAAUG,GAAA;IAChB;IAEAN,UAAA,CAAW,IAAI;EACjB,GAAG,CAEHJ,QAAS,CACT;EACF,KAAAE,GAAA,CAAAK,OAAA;EAEA,OAAOJ,OAAA,kBAAQR,YAAA,CAAAM,QAAA,EAAAC,GAAA,CAAAK,OAAA","ignoreList":[]}

package/dist/esm/connectkit/components/Common/ScrollArea/index.mjs

@@ -0,0 +1,95 @@
+import { useEffect, useRef } from "react";
+import { MoreIndicator, ScrollAreaContainer, ScrollContainer } from "./styles.mjs";
+import useIsMobile from "../../../hooks/useIsMobile.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+const ArrowDown = () => /* @__PURE__ */jsx("svg", {
+  width: "11",
+  height: "12",
+  viewBox: "0 0 11 12",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg",
+  children: /* @__PURE__ */jsx("path", {
+    d: "M5.49438 1L5.49438 11M5.49438 11L9.5 7M5.49438 11L1.5 7",
+    stroke: "currentColor",
+    strokeWidth: "1.75",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })
+});
+const ScrollArea = ({
+  children,
+  height,
+  backgroundColor,
+  mobileDirection
+}) => {
+  const ref = useRef(null);
+  const moreRef = useRef(null);
+  const isMobile = useIsMobile();
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (el.scrollHeight > el.clientHeight) {
+      if (moreRef.current) {
+        moreRef.current.classList.remove("hide");
+      }
+    }
+    const handleScroll = e => {
+      const {
+        scrollTop,
+        scrollHeight,
+        clientHeight,
+        scrollLeft,
+        scrollWidth,
+        clientWidth
+      } = e.target;
+      if (moreRef.current) {
+        if (scrollTop > 0) {
+          moreRef.current.classList.add("hide");
+        }
+      }
+      if (scrollTop === 0 && scrollLeft === 0) {
+        el.classList.add("scroll-start");
+      } else {
+        el.classList.remove("scroll-start");
+      }
+      if (scrollHeight - scrollTop === clientHeight && scrollWidth - scrollLeft === clientWidth) {
+        el.classList.add("scroll-end");
+      } else {
+        el.classList.remove("scroll-end");
+      }
+    };
+    el.addEventListener("scroll", handleScroll);
+    handleScroll({
+      target: el
+    });
+    return () => {
+      el.removeEventListener("scroll", handleScroll);
+    };
+  }, [ref.current]);
+  return /* @__PURE__ */jsxs(ScrollContainer, {
+    children: [/* @__PURE__ */jsx(ScrollAreaContainer, {
+      ref,
+      $mobile: isMobile,
+      $height: height,
+      $backgroundColor: backgroundColor,
+      $mobileDirection: mobileDirection,
+      children
+    }), /* @__PURE__ */jsx(MoreIndicator, {
+      ref: moreRef,
+      className: "hide",
+      onClick: () => {
+        if (ref.current) {
+          ref.current.scrollTo({
+            top: ref.current.scrollHeight,
+            behavior: "smooth"
+          });
+        }
+      },
+      children: /* @__PURE__ */jsxs("span", {
+        children: [/* @__PURE__ */jsx(ArrowDown, {}), " More Available"]
+      })
+    })]
+  });
+};
+export { ScrollArea };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/connectkit/components/Common/ScrollArea/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useRef","MoreIndicator","ScrollAreaContainer","ScrollContainer","useIsMobile","jsx","jsxs","ArrowDown","width","height","viewBox","fill","xmlns","children","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","ScrollArea","backgroundColor","mobileDirection","ref","moreRef","isMobile","el","current","scrollHeight","clientHeight","classList","remove","handleScroll","e","scrollTop","scrollLeft","scrollWidth","clientWidth","target","add","addEventListener","removeEventListener","$mobile","$height","$backgroundColor","$mobileDirection","className","onClick","scrollTo","top","behavior"],"sources":["../../../../../../src/connectkit/components/Common/ScrollArea/index.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/connectkit/components/Common/ScrollArea/index.native.js

@@ -0,0 +1,98 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useRef } from "react";
+import { MoreIndicator, ScrollAreaContainer, ScrollContainer } from "./styles.native.js";
+import useIsMobile from "../../../hooks/useIsMobile.native.js";
+var ArrowDown = function ArrowDown2() {
+  return /* @__PURE__ */_jsx("svg", {
+    width: "11",
+    height: "12",
+    viewBox: "0 0 11 12",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /* @__PURE__ */_jsx("path", {
+      d: "M5.49438 1L5.49438 11M5.49438 11L9.5 7M5.49438 11L1.5 7",
+      stroke: "currentColor",
+      strokeWidth: "1.75",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    })
+  });
+};
+var ScrollArea = function ScrollArea2(param) {
+  var {
+    children,
+    height,
+    backgroundColor,
+    mobileDirection
+  } = param;
+  var ref = useRef(null);
+  var moreRef = useRef(null);
+  var isMobile = useIsMobile();
+  useEffect(function () {
+    var el = ref.current;
+    if (!el) return;
+    if (el.scrollHeight > el.clientHeight) {
+      if (moreRef.current) {
+        moreRef.current.classList.remove("hide");
+      }
+    }
+    var handleScroll = function handleScroll2(e) {
+      var {
+        scrollTop,
+        scrollHeight,
+        clientHeight,
+        scrollLeft,
+        scrollWidth,
+        clientWidth
+      } = e.target;
+      if (moreRef.current) {
+        if (scrollTop > 0) {
+          moreRef.current.classList.add("hide");
+        }
+      }
+      if (scrollTop === 0 && scrollLeft === 0) {
+        el.classList.add("scroll-start");
+      } else {
+        el.classList.remove("scroll-start");
+      }
+      if (scrollHeight - scrollTop === clientHeight && scrollWidth - scrollLeft === clientWidth) {
+        el.classList.add("scroll-end");
+      } else {
+        el.classList.remove("scroll-end");
+      }
+    };
+    el.addEventListener("scroll", handleScroll);
+    handleScroll({
+      target: el
+    });
+    return function () {
+      el.removeEventListener("scroll", handleScroll);
+    };
+  }, [ref.current]);
+  return /* @__PURE__ */_jsxs(ScrollContainer, {
+    children: [/* @__PURE__ */_jsx(ScrollAreaContainer, {
+      ref,
+      $mobile: isMobile,
+      $height: height,
+      $backgroundColor: backgroundColor,
+      $mobileDirection: mobileDirection,
+      children
+    }), /* @__PURE__ */_jsx(MoreIndicator, {
+      ref: moreRef,
+      className: "hide",
+      onClick: function onClick() {
+        if (ref.current) {
+          ref.current.scrollTo({
+            top: ref.current.scrollHeight,
+            behavior: "smooth"
+          });
+        }
+      },
+      children: /* @__PURE__ */_jsxs("span", {
+        children: [/* @__PURE__ */_jsx(ArrowDown, {}), " More Available"]
+      })
+    })]
+  });
+};
+export { ScrollArea };
+//# sourceMappingURL=index.native.js.map

package/dist/esm/connectkit/components/Common/ScrollArea/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","React","useEffect","useRef","MoreIndicator","ScrollAreaContainer","ScrollContainer","useIsMobile","ArrowDown","ArrowDown2","width","height","viewBox","fill","xmlns","children","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","ScrollArea","ScrollArea2","param","backgroundColor","mobileDirection","ref","moreRef","isMobile","el","current","scrollHeight","clientHeight","classList","remove","handleScroll","handleScroll2","e","scrollTop","scrollLeft","scrollWidth","clientWidth","target","add","addEventListener","removeEventListener","$mobile","$height","$backgroundColor","$mobileDirection","className","onClick","scrollTo","top","behavior"],"sources":["../../../../../../src/connectkit/components/Common/ScrollArea/index.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAAgBA,GAAA,IAAAC,IAAW,EAAAC,IAAA,IAAAC,KAAc;AACzC,OAAAC,KAAS,IAAAC,SAAe,EAAAC,MAAA,eAAqB;AAC7C,SAAOC,aAAA,EAAiBC,mBAAA,EAAAC,eAAA;AAUpB,OAAAC,WAmGI,4CAnGJ;AARJ,IAAAC,SAAM,YACJC,WAAA;EAAC,sBAAAX,IAAA;IAAAY,KAAA;IACCC,MAAA,EAAM;IACNC,OAAA,EAAO;IACPC,IAAA,QAAQ;IACRC,KAAA,EAAK;IACLC,QAAM,iBAAAjB,IAAA;MAENkB,CAAA;MAACC,MAAA;MAAAC,WAAA;MAAAC,aACG;MAAAC,cACK;IAAA;EACK;AACE;AACC,IAAAC,UAAA,YAAAC,YAAAC,KAAA;EAAA,IACjB;IAAAR,QAAA;IAAAJ,MAAA;IAAAa,eAAA;IAAAC;EAAA,IAAAF,KAAA;EAAA,IAAAG,GAAA,GAAAvB,MAAA;EACF,IAAAwB,OAAA,GAAAxB,MAAA;EAEK,IAAMyB,QAAA,GAAArB,WAAc;EACzBL,SAAA;IACA,IAAA2B,EAAA,GAAAH,GAAA,CAAAI,OAAA;IACA,KAAAD,EAAA;IACA,IAAAA,EAAA,CAAAE,YAAA,GAAAF,EAAA,CAAAG,YAAA;MAMI,IAAAL,OAAA,CAAAG,OAAA;QACEH,OAAM,CAAAG,OAAuB,CAAAG,SAAI,CAAAC,MAAA;MACvC;IAEA;IAEA,IAAAC,YAAgB,YAAAC,cAAAC,CAAA;MACd,IAAM;QAAAC,SAAS;QAAAP,YAAA;QAAAC,YAAA;QAAAO,UAAA;QAAAC,WAAA;QAAAC;MAAA,IAAAJ,CAAA,CAAAK,MAAA;MACf,IAAKf,OAAI,CAAAG,OAAA;QAGL,IAAGQ,SAAA,MAAe;UAChBX,OAAA,CAAQG,OAAA,CAAAG,SAAS,CAAAU,GAAA;QACnB;MACF;MACF,IAAAL,SAAA,UAAAC,UAAA;QAEAV,EAAM,CAAAI,SAAA,CAAAU,GAAA,CAAe,cAAY;MAC/B,OAAM;QACJd,EAAA,CAAAI,SAAA,CAAAC,MAAA;MAAA;MACA,IACAH,YAAA,GAAAO,SAAA,KAAAN,YAAA,IAAAQ,WAAA,GAAAD,UAAA,KAAAE,WAAA;QACAZ,EAAA,CAAAI,SAAA,CAAAU,GAAA;MAAA,OACA;QACAd,EAAA,CAAAI,SAAA,CAAAC,MAAA;MACF;IAEA;IACEL,EAAA,CAAAe,gBAAI,CAAY,QAAG,EAAAT,YAAA;IACjBA,YAAA;MAAoCO,MACtC,EAAAb;IAAA,EACF;IAEA,OAAI;MACFA,EAAA,CAAAgB,mBAAiB,WAAcV,YAAA;IAAA;EAE/B,IAAkCT,GACpC,CAAAI,OAAA,CAEA;EAIE,sBAAiB9B,KAAA,CAAAM,eAAY;IAAAS,QAC/B,EAAO,CACL,eAAajB,IAAA,CAAAO,mBAAmB;MAClCqB,GAAA;MACFoB,OAAA,EAAAlB,QAAA;MAEGmB,OAAA,EAAApC,MAAA;MACHqC,gBAAe,EAAAxB,eAAY;MAE3ByB,gBAAa,EAAAxB,eAAA;MACXV;IACF,IACE,eAAYjB,IAAA,CAAAM,aAAA;MAEhBsB,GACE,EAAAC,OAAA;MACEuB,SAAA;MAACC,OAAA,WAAAA,QAAA;QAAA,IAAAzB,GAAA,CAAAI,OAAA;UACCJ,GAAA,CAAAI,OAAA,CAAAsB,QAAA;YACAC,GAAS,EAAA3B,GAAA,CAAAI,OAAA,CAAAC,YAAA;YACTuB,QAAS;UACT;QACA;MAEC;MAAAvC,QAAA,iBAAAf,KAAA;QACHe,QAAA,GACA,eAAAjB,IAAA,CAAAU,SAAA,OAAC;MACC;IAAK,EACL;EAEE;AACE;AAAqB,SACFa,UAAA","ignoreList":[]}

package/dist/esm/connectkit/components/Common/ScrollArea/styles.mjs

@@ -0,0 +1,170 @@
+import { css, keyframes } from "styled-components";
+import styled from "../../../styles/styled/index.mjs";
+const ScrollContainer = styled.div`
+  position: relative;
+`;
+const fadeIn = keyframes`
+0%{ opacity:0; }
+100%{ opacity:1; }
+`;
+const MoreIndicator = styled.div`
+  z-index: 9;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0.75rem;
+  display: flex;
+  justify-content: center;
+
+  transition: opacity 300ms ease;
+
+  span {
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.25rem;
+    padding: 0.3075rem 0.9375rem 0.375rem;
+    border-radius: 6rem;
+    background: var(--ck-tooltip-background);
+    color: var(--ck-tooltip-color);
+    font-weight: 500;
+    font-size: 0.8125rem;
+    letter-spacing: -0.01rem;
+    box-shadow: var(--ck-tooltip-shadow);
+    animation: ${fadeIn} 300ms ease 1000ms both;
+
+    transition: transform 100ms ease;
+
+    &:hover {
+      transform: scale(1.02);
+    }
+    &:active {
+      transform: scale(0.98);
+    }
+    svg {
+      display: block;
+      transform: translateX(-0.1875rem);
+    }
+  }
+
+  &.hide {
+    opacity: 0;
+    pointer-events: none;
+  }
+`;
+const ScrollAreaContainer = styled.div`
+  --bg: ${({
+  $backgroundColor
+}) => $backgroundColor || "var(--ck-body-background)"};
+  --fade-height: 1px;
+  position: relative;
+  z-index: 1;
+
+  ${({
+  $mobile,
+  $height,
+  $mobileDirection
+}) => $mobile && $mobileDirection === "horizontal" ? css`
+          overflow-x: scroll;
+          margin: 0 -24px;
+          padding: 0 24px;
+
+          &:before,
+          &:after {
+            pointer-events: none;
+            z-index: 10;
+            content: '';
+            display: block;
+            position: sticky;
+            top: 0;
+            bottom: 0;
+            width: var(--fade-height);
+            background: var(
+              --ck-body-divider-secondary,
+              var(--ck-body-divider)
+            );
+            box-shadow: var(--ck-body-divider-box-shadow);
+            transition: opacity 300ms ease;
+          }
+          &:before {
+            left: 0;
+          }
+          &:after {
+            right: 0;
+          }
+
+          &.scroll-start {
+            &:before {
+              opacity: 0;
+            }
+          }
+
+          &.scroll-end {
+            &:after {
+              opacity: 0;
+            }
+          }
+        ` : css`
+          max-height: ${$height ? `${$height}px` : "310px"};
+          overflow-y: scroll;
+          padding: 0 10px;
+          margin: calc(var(--fade-height) * -1) -16px 0 -10px;
+
+          &:before,
+          &:after {
+            pointer-events: none;
+            z-index: 10;
+            content: '';
+            display: block;
+            position: sticky;
+            left: 0;
+            right: 0;
+            height: var(--fade-height);
+            background: var(
+              --ck-body-divider-secondary,
+              var(--ck-body-divider)
+            );
+            box-shadow: var(--ck-body-divider-box-shadow);
+            transition: opacity 300ms ease;
+          }
+          &:before {
+            top: 0;
+          }
+          &:after {
+            bottom: 0;
+          }
+
+          &.scroll-start {
+            &:before {
+              opacity: 0;
+            }
+          }
+
+          &.scroll-end {
+            &:after {
+              opacity: 0;
+            }
+          }
+        `}
+
+  &::-webkit-scrollbar {
+    width: 6px;
+    height: 6px;
+  }
+  &::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  &::-webkit-scrollbar-thumb {
+    background: rgba(0, 0, 0, 0);
+    border-radius: 100px;
+  }
+  &:hover::-webkit-scrollbar-thumb {
+    background: var(--ck-body-color-muted);
+  }
+  &::-webkit-scrollbar-thumb:hover {
+    background: var(--ck-body-color-muted-hover);
+  }
+`;
+export { MoreIndicator, ScrollAreaContainer, ScrollContainer };
+//# sourceMappingURL=styles.mjs.map

package/dist/esm/connectkit/components/Common/ScrollArea/styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["css","keyframes","styled","ScrollContainer","div","fadeIn","MoreIndicator","ScrollAreaContainer","$backgroundColor","$mobile","$height","$mobileDirection"],"sources":["../../../../../../src/connectkit/components/Common/ScrollArea/styles.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,EAAKC,SAAA,QAAiB;AAC/B,OAAOC,MAAA,MAAY;AAEZ,MAAMC,eAAA,GAAkBD,MAAA,CAAOE,GAAA;AAAA;AAAA;AAGtC,MAAMC,MAAA,GAASJ,SAAA;AAAA;AAAA;AAAA;AAKR,MAAMK,aAAA,GAAgBJ,MAAA,CAAOE,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAyBnBC,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBhB,MAAME,mBAAA,GAAsBL,MAAA,CAAOE,GAAA;AAAA,UAKhC,CAAC;EAAEI;AAAiB,MAC1BA,gBAAA,IAAoB,2BAA2B;AAAA;AAAA;AAAA;AAAA;AAAA,IAK/C,CAAC;EAAEC,OAAA;EAASC,OAAA;EAASC;AAAiB,MACtCF,OAAA,IAAWE,gBAAA,KAAqB,eAC5BX,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAyCAA,GAAA;AAAA,wBACgBU,OAAA,GAAU,GAAGA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAwCjD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","ignoreList":[]}

package/dist/esm/connectkit/components/Common/ScrollArea/styles.native.js

@@ -0,0 +1,176 @@
+import { css, keyframes } from "styled-components";
+import styled from "../../../styles/styled/index.native.js";
+var ScrollContainer = styled.div`
+  position: relative;
+`;
+var fadeIn = keyframes`
+0%{ opacity:0; }
+100%{ opacity:1; }
+`;
+var MoreIndicator = styled.div`
+  z-index: 9;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0.75rem;
+  display: flex;
+  justify-content: center;
+
+  transition: opacity 300ms ease;
+
+  span {
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.25rem;
+    padding: 0.3075rem 0.9375rem 0.375rem;
+    border-radius: 6rem;
+    background: var(--ck-tooltip-background);
+    color: var(--ck-tooltip-color);
+    font-weight: 500;
+    font-size: 0.8125rem;
+    letter-spacing: -0.01rem;
+    box-shadow: var(--ck-tooltip-shadow);
+    animation: ${fadeIn} 300ms ease 1000ms both;
+
+    transition: transform 100ms ease;
+
+    &:hover {
+      transform: scale(1.02);
+    }
+    &:active {
+      transform: scale(0.98);
+    }
+    svg {
+      display: block;
+      transform: translateX(-0.1875rem);
+    }
+  }
+
+  &.hide {
+    opacity: 0;
+    pointer-events: none;
+  }
+`;
+var ScrollAreaContainer = styled.div`
+  --bg: ${function (param) {
+  var {
+    $backgroundColor
+  } = param;
+  return $backgroundColor || "var(--ck-body-background)";
+}};
+  --fade-height: 1px;
+  position: relative;
+  z-index: 1;
+
+  ${function (param) {
+  var {
+    $mobile,
+    $height,
+    $mobileDirection
+  } = param;
+  return $mobile && $mobileDirection === "horizontal" ? css`
+          overflow-x: scroll;
+          margin: 0 -24px;
+          padding: 0 24px;
+
+          &:before,
+          &:after {
+            pointer-events: none;
+            z-index: 10;
+            content: '';
+            display: block;
+            position: sticky;
+            top: 0;
+            bottom: 0;
+            width: var(--fade-height);
+            background: var(
+              --ck-body-divider-secondary,
+              var(--ck-body-divider)
+            );
+            box-shadow: var(--ck-body-divider-box-shadow);
+            transition: opacity 300ms ease;
+          }
+          &:before {
+            left: 0;
+          }
+          &:after {
+            right: 0;
+          }
+
+          &.scroll-start {
+            &:before {
+              opacity: 0;
+            }
+          }
+
+          &.scroll-end {
+            &:after {
+              opacity: 0;
+            }
+          }
+        ` : css`
+          max-height: ${$height ? `${$height}px` : "310px"};
+          overflow-y: scroll;
+          padding: 0 10px;
+          margin: calc(var(--fade-height) * -1) -16px 0 -10px;
+
+          &:before,
+          &:after {
+            pointer-events: none;
+            z-index: 10;
+            content: '';
+            display: block;
+            position: sticky;
+            left: 0;
+            right: 0;
+            height: var(--fade-height);
+            background: var(
+              --ck-body-divider-secondary,
+              var(--ck-body-divider)
+            );
+            box-shadow: var(--ck-body-divider-box-shadow);
+            transition: opacity 300ms ease;
+          }
+          &:before {
+            top: 0;
+          }
+          &:after {
+            bottom: 0;
+          }
+
+          &.scroll-start {
+            &:before {
+              opacity: 0;
+            }
+          }
+
+          &.scroll-end {
+            &:after {
+              opacity: 0;
+            }
+          }
+        `;
+}}
+
+  &::-webkit-scrollbar {
+    width: 6px;
+    height: 6px;
+  }
+  &::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  &::-webkit-scrollbar-thumb {
+    background: rgba(0, 0, 0, 0);
+    border-radius: 100px;
+  }
+  &:hover::-webkit-scrollbar-thumb {
+    background: var(--ck-body-color-muted);
+  }
+  &::-webkit-scrollbar-thumb:hover {
+    background: var(--ck-body-color-muted-hover);
+  }
+`;
+export { MoreIndicator, ScrollAreaContainer, ScrollContainer };
+//# sourceMappingURL=styles.native.js.map

package/dist/esm/connectkit/components/Common/ScrollArea/styles.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["css","keyframes","styled","ScrollContainer","div","fadeIn","MoreIndicator","ScrollAreaContainer","param","$backgroundColor","$mobile","$height","$mobileDirection"],"sources":["../../../../../../src/connectkit/components/Common/ScrollArea/styles.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,EAAKC,SAAA,QAAiB;AAC/B,OAAOC,MAAA,MAAY;AAEZ,IAAAC,eAAM,GAAAD,MAAkB,CAAAE,GAAO;AAAA;AAAA;AAGtC,IAAAC,MAAM,GAAAJ,SAAS;AAAA;AAAA;AAAA;AAKR,IAAAK,aAAM,GAAAJ,MAAgB,CAAAE,GAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAyBnBC,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBhB,IAAAE,mBAAM,GAAAL,MAAsB,CAAAE,GAAO;AAAA,UAKhC,UAAGI,KAAA;EACsC;IAAAC;EAAA,IAAAD,KAAA;EAAA,OAAAC,gBAAA;AAAA;AAAA;AAAA;AAO3C;AAAA;AAAA,cAAAD,KAAA;EAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC;EAAA,IAAAJ,KAAA;EAAA,OAAAE,OAAA,IAAAE,gBAAA,oBAAAZ,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyCA;AACkD;AAAA;AAAA;AAAA,YAAAA,GAAA;AAAA,wBAAAW,OAAA,MAAAA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwCjD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","ignoreList":[]}

package/dist/esm/connectkit/components/Common/Spinner/index.mjs

@@ -0,0 +1,50 @@
+import { SpinnerContainer } from "./styles.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+const transition = {
+  duration: 0.4,
+  ease: [0.175, 0.885, 0.32, 0.98]
+};
+const Spinner = () => /* @__PURE__ */jsx(SpinnerContainer, {
+  initial: {
+    opacity: 0,
+    rotate: 180
+  },
+  animate: {
+    opacity: 1,
+    rotate: 0
+  },
+  exit: {
+    position: "absolute",
+    opacity: 0,
+    rotate: -180,
+    transition: {
+      ...transition
+    }
+  },
+  transition: {
+    ...transition,
+    delay: 0.2
+  },
+  children: /* @__PURE__ */jsxs("svg", {
+    width: "18",
+    height: "18",
+    viewBox: "0 0 18 18",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [/* @__PURE__ */jsx("circle", {
+      cx: "9",
+      cy: "9",
+      r: "7",
+      stroke: "currentColor",
+      strokeOpacity: "0.1",
+      strokeWidth: "2.5"
+    }), /* @__PURE__ */jsx("path", {
+      d: "M16 9C16 5.13401 12.866 2 9 2",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeLinecap: "round"
+    })]
+  })
+});
+export { Spinner };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/connectkit/components/Common/Spinner/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["SpinnerContainer","jsx","jsxs","transition","duration","ease","Spinner","initial","opacity","rotate","animate","exit","position","delay","children","width","height","viewBox","fill","xmlns","cx","cy","r","stroke","strokeOpacity","strokeWidth","d","strokeLinecap"],"sources":["../../../../../../src/connectkit/components/Common/Spinner/index.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,gBAAA,QAAwB;AA2B7B,SAOEC,GAAA,EAPFC,IAAA;AAzBJ,MAAMC,UAAA,GAAa;EACjBC,QAAA,EAAU;EACVC,IAAA,EAAM,CAAC,OAAO,OAAO,MAAM,IAAI;AACjC;AAEO,MAAMC,OAAA,GAAUA,CAAA,KACrB,eAAAL,GAAA,CAACD,gBAAA;EACCO,OAAA,EAAS;IAAEC,OAAA,EAAS;IAAGC,MAAA,EAAQ;EAAI;EACnCC,OAAA,EAAS;IACPF,OAAA,EAAS;IACTC,MAAA,EAAQ;EACV;EACAE,IAAA,EAAM;IACJC,QAAA,EAAU;IACVJ,OAAA,EAAS;IACTC,MAAA,EAAQ;IACRN,UAAA,EAAY;MACV,GAAGA;IACL;EACF;EACAA,UAAA,EAAY;IACV,GAAGA,UAAA;IACHU,KAAA,EAAO;EACT;EAEAC,QAAA,iBAAAZ,IAAA,CAAC;IACCa,KAAA,EAAM;IACNC,MAAA,EAAO;IACPC,OAAA,EAAQ;IACRC,IAAA,EAAK;IACLC,KAAA,EAAM;IAENL,QAAA,kBAAAb,GAAA,CAAC;MACCmB,EAAA,EAAG;MACHC,EAAA,EAAG;MACHC,CAAA,EAAE;MACFC,MAAA,EAAO;MACPC,aAAA,EAAc;MACdC,WAAA,EAAY;IAAA,CACd,GACA,eAAAxB,GAAA,CAAC;MACCyB,CAAA,EAAE;MACFH,MAAA,EAAO;MACPE,WAAA,EAAY;MACZE,aAAA,EAAc;IAAA,CAChB;EAAA,CACF;AAAA,CACF","ignoreList":[]}