@worldcoin/mini-apps-ui-kit-react 1.0.0-canary.8 → 1.0.0

package/dist/components/ToggleGroup/ToggleGroup.js

@@ -1,28 +1,37 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Root as l, Item as n } from "../../node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js";
-import * as e from "react";
-import { cn as r } from "../../lib/utils.js";
-import { typographyVariants as g } from "../Typography/Typography.js";
-const m = e.forwardRef(({ ...o }, t) => /* @__PURE__ */ a(l, { ref: t, className: r("inline-flex gap-5"), ...o }));
-m.displayName = "ToggleGroup";
-const p = e.forwardRef(({ className: o, children: t, ...s }, i) => /* @__PURE__ */ a(
-  n,
+import { jsx } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
+import { Root as Root2, Item as Item2 } from "../../node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js";
+import * as React from "react";
+import { cn } from "../../lib/utils.js";
+import { typographyVariants } from "../Typography/Typography.js";
+const ToggleGroupRoot = React.forwardRef(({ onValueChange, ...props }, ref) => /* @__PURE__ */ jsx(
+  Root2,
   {
-    ref: i,
-    className: r(
-      g({ variant: "subtitle", level: 4 }),
+    ref,
+    className: cn("inline-flex gap-5"),
+    onValueChange: withHaptics(onValueChange),
+    ...props
+  }
+));
+ToggleGroupRoot.displayName = "ToggleGroup";
+const ToggleGroupItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+  Item2,
+  {
+    ref,
+    className: cn(
+      typographyVariants({ variant: "subtitle", level: 4 }),
       "size-8 rounded-full transition-all text-gray-400 bg-gray-0 outline-none",
       "hover:bg-gray-50",
       "data-[state=on]:bg-gray-100 data-[state=on]:text-gray-900",
       "disabled:pointer-events-none disabled:opacity-50",
-      o
+      className
     ),
-    ...s,
-    children: t
+    ...props,
+    children
   }
 ));
-p.displayName = "ToggleGroupItem";
+ToggleGroupItem.displayName = "ToggleGroupItem";
 export {
-  p as ToggleGroupItem,
-  m as ToggleGroupRoot
+  ToggleGroupItem,
+  ToggleGroupRoot
 };

package/dist/components/ToggleGroup/index.d.ts

@@ -1 +1,2 @@
 export { ToggleGroupRoot, ToggleGroupItem } from './ToggleGroup';
+export type { ToggleGroupRootProps, ToggleGroupItemProps } from './types';

package/dist/components/Token/Token.d.ts

@@ -13,5 +13,6 @@ interface TokenProps {
     /** Whether the token is disabled */
     disabled?: boolean;
 }
-export declare const Token: React.FC<TokenProps>;
-export default Token;
+declare const Token: React.FC<TokenProps>;
+export { Token };
+export type { TokenProps };

package/dist/components/Token/Token.js

@@ -1,15 +1,15 @@
-import { jsx as s } from "react/jsx-runtime";
-import * as c from "./icons/index.js";
-const m = ({
-  value: n,
-  size: o = 40,
-  variant: t = "color",
-  disabled: e = !1
+import { jsx } from "react/jsx-runtime";
+import * as index from "./icons/index.js";
+const Token = ({
+  value,
+  size = 40,
+  variant = "color",
+  disabled = false
 }) => {
-  const r = c[n];
-  return /* @__PURE__ */ s(r, { width: o, height: o, disabled: e, variant: t });
+  const Icon = index[value];
+  return /* @__PURE__ */ jsx(Icon, { width: size, height: size, disabled, variant });
 };
+Token.displayName = "Token";
 export {
-  m as Token,
-  m as default
+  Token
 };

package/dist/components/Token/icons/btc.js

@@ -1,6 +1,6 @@
-import { jsxs as t, jsx as l } from "react/jsx-runtime";
-import { getBackgroundClass as s, getIconFillClass as o } from "./utils.js";
-const a = (e) => /* @__PURE__ */ t(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const BTC = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,22 +8,22 @@ const a = (e) => /* @__PURE__ */ t(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...e,
+    ...props,
     style: { color: "#FF5A00" },
     children: [
-      /* @__PURE__ */ l("rect", { width: "88", height: "88", rx: "44", className: s(e) }),
-      /* @__PURE__ */ l(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           fillRule: "evenodd",
           clipRule: "evenodd",
           d: "M41.9115 24.889H46.707V30.1736C51.5254 30.6529 54.6619 33.1054 54.6619 37.7023C54.6619 40.9261 53.0097 42.941 49.8664 44.1097V44.1903C52.9694 44.7947 55.6693 46.6484 55.6693 50.6782C55.6693 56.012 52.2208 58.3483 46.7071 58.7826L46.7071 64.162H41.9117L41.9117 58.8587H34.6741V30.086H41.9115V24.889ZM44.3456 54.4259H40.074V46.4469H45.0307C48.1336 46.4469 50.3097 47.4947 50.3097 50.3558C50.3097 53.4588 47.9724 54.4259 44.3456 54.4259ZM43.9829 42.1351H40.074V34.4784H44.265C47.4082 34.4784 49.3022 35.2038 49.3022 38.1456C49.3022 41.047 47.4485 42.1351 43.9829 42.1351Z",
-          className: o(e)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  a as default
+  BTC as default
 };

package/dist/components/Token/icons/dai.js

@@ -1,6 +1,6 @@
-import { jsxs as t, jsx as H } from "react/jsx-runtime";
-import { getBackgroundClass as s, getIconFillClass as V } from "./utils.js";
-const o = (C) => /* @__PURE__ */ t(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const DAI = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,20 +8,20 @@ const o = (C) => /* @__PURE__ */ t(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...C,
+    ...props,
     style: { color: "#FFB833" },
     children: [
-      /* @__PURE__ */ H("rect", { width: "88", height: "88", rx: "44", className: s(C) }),
-      /* @__PURE__ */ H(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           d: "M44.562 46.547H58.2374C58.529 46.547 58.6666 46.547 58.6877 46.1648C58.7994 44.7736 58.7994 43.3743 58.6877 41.9815C58.6877 41.7111 58.5532 41.5993 58.2601 41.5993H31.0437C30.7068 41.5993 30.6161 41.7111 30.6161 42.0269V46.0304C30.6161 46.547 30.6161 46.547 31.1554 46.547H44.562ZM57.1604 36.9205C57.1993 36.8184 57.1993 36.7067 57.1604 36.6063C56.9321 36.1091 56.6616 35.6345 56.3474 35.1892C55.8745 34.428 55.3174 33.7267 54.6825 33.0967C54.3829 32.7161 54.0363 32.3744 53.6477 32.0845C51.701 30.4277 49.3866 29.2552 46.899 28.6656C45.6439 28.3838 44.3612 28.2494 43.0753 28.2608H30.9967C30.6598 28.2608 30.6145 28.3952 30.6145 28.6883V36.6727C30.6145 37.0095 30.6145 37.1002 31.042 37.1002H56.9985C56.9985 37.1002 57.2236 37.0549 57.269 36.9205H57.1588H57.1604ZM57.1604 51.2259C56.7782 51.1838 56.3928 51.1838 56.0106 51.2259H31.0663C30.7295 51.2259 30.6161 51.2259 30.6161 51.6761V59.4823C30.6161 59.8419 30.6161 59.9326 31.0663 59.9326H42.5829C43.1336 59.9747 43.6842 59.9358 44.2235 59.8208C45.8949 59.701 47.5387 59.3382 49.1064 58.7406C49.6765 58.543 50.2272 58.2855 50.747 57.9762H50.9041C53.6039 56.572 55.7968 54.3662 57.1799 51.6583C57.1799 51.6583 57.337 51.3182 57.1604 51.2291V51.2259ZM26.096 63.9798V63.8454V58.6045V56.8279V51.5417C26.096 51.2486 26.096 51.2048 25.7364 51.2048H20.8551C20.5846 51.2048 20.4729 51.2048 20.4729 50.8453V46.5713H25.6911C25.9826 46.5713 26.096 46.5713 26.096 46.1891V41.9605C26.096 41.69 26.096 41.6236 25.7364 41.6236H20.8551C20.5846 41.6236 20.4729 41.6236 20.4729 41.2641V37.3059C20.4729 37.0581 20.4729 36.9917 20.8324 36.9917H25.6684C26.0053 36.9917 26.096 36.9917 26.096 36.5642V24.4403C26.096 24.0807 26.096 23.99 26.5462 23.99H43.4154C44.6397 24.0386 45.856 24.173 47.0593 24.3949C49.5389 24.8532 51.9212 25.7391 54.0995 27.004C55.5441 27.8543 56.8738 28.881 58.0577 30.0633C58.9484 30.9881 59.7517 31.989 60.4643 33.0546C61.1721 34.1348 61.76 35.2896 62.2215 36.4961C62.2782 36.8103 62.5794 37.0225 62.8936 36.9691H66.9198C67.4364 36.9691 67.4365 36.969 67.4591 37.4646V41.154C67.4591 41.5135 67.3247 41.6042 66.9635 41.6042H63.8589C63.5447 41.6042 63.454 41.6042 63.4767 42.0091C63.5998 43.3792 63.5998 44.7542 63.4767 46.1243C63.4767 46.5065 63.4767 46.5519 63.9058 46.5519H67.4575C67.6146 46.7543 67.4575 46.9568 67.4575 47.1608C67.4802 47.4216 67.4802 47.6856 67.4575 47.9463V50.6688C67.4575 51.051 67.3458 51.1644 67.0073 51.1644H62.756C62.4596 51.1077 62.1713 51.2972 62.1033 51.5919C61.0911 54.2237 59.4715 56.5833 57.3791 58.475C56.6147 59.1633 55.8114 59.8111 54.9724 60.4087C54.072 60.927 53.1958 61.4663 52.2727 61.8938C50.5738 62.6583 48.7923 63.2219 46.9638 63.5798C45.2276 63.8907 43.4672 64.0316 41.7003 64.0073H26.0895V63.9847L26.096 63.9798Z",
-          className: V(C)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  o as default
+  DAI as default
 };

package/dist/components/Token/icons/doge.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const DOGE: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default DOGE;

package/dist/components/Token/icons/doge.js

@@ -0,0 +1,29 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const DOGE = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#988430" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M63.871 34.1006C59.9176 23.8914 50.1446 22 50.1446 22H22.2619L22.3695 32.3989H27.9223V55.6198H22.2615V66H49.3728C55.9067 66 61.1444 59.4339 61.1444 59.4339C69.5318 47.5297 63.8705 34.1006 63.8705 34.1006H63.871ZM49.5183 52.4379C49.5183 52.4379 47.3917 55.506 45.0779 55.506H40.4495L40.3398 32.4244H46.2796C46.2796 32.4244 49.0317 32.9998 50.9543 38.4459C50.9543 38.4459 53.5033 46.2433 49.5183 52.4379Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  DOGE as default
+};

package/dist/components/Token/icons/eth.js

@@ -1,6 +1,6 @@
-import { jsxs as t, jsx as l } from "react/jsx-runtime";
-import { getBackgroundClass as s, getIconFillClass as o } from "./utils.js";
-const d = (e) => /* @__PURE__ */ t(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const ETH = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,22 +8,22 @@ const d = (e) => /* @__PURE__ */ t(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...e,
+    ...props,
     style: { color: "#3385FF" },
     children: [
-      /* @__PURE__ */ l("rect", { width: "88", height: "88", rx: "44", className: s(e) }),
-      /* @__PURE__ */ l(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           fillRule: "evenodd",
           clipRule: "evenodd",
           d: "M44 51.5001L31 44.0001L44 24.0001L57 44.0001L44 51.5001ZM44 54.5001L31 47.0001L44 65.0001L57 47.0001L44 54.5001Z",
-          className: o(e)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  d as default
+  ETH as default
 };

package/dist/components/Token/icons/index.d.ts

@@ -4,3 +4,8 @@ export { default as DAI } from './dai';
 export { default as USDC } from './usdc';
 export { default as USDT } from './usdt';
 export { default as WLD } from './wld';
+export { default as SOL } from './sol';
+export { default as SUI } from './sui';
+export { default as DOGE } from './doge';
+export { default as XRP } from './xrp';
+export { default as LINK } from './link';

package/dist/components/Token/icons/index.js

@@ -1,14 +1,24 @@
-import { default as f } from "./btc.js";
-import { default as r } from "./eth.js";
-import { default as d } from "./dai.js";
-import { default as m } from "./usdc.js";
-import { default as s } from "./usdt.js";
-import { default as x } from "./wld.js";
+import { default as default2 } from "./btc.js";
+import { default as default3 } from "./eth.js";
+import { default as default4 } from "./dai.js";
+import { default as default5 } from "./usdc.js";
+import { default as default6 } from "./usdt.js";
+import { default as default7 } from "./wld.js";
+import { default as default8 } from "./sol.js";
+import { default as default9 } from "./sui.js";
+import { default as default10 } from "./doge.js";
+import { default as default11 } from "./xrp.js";
+import { default as default12 } from "./link.js";
 export {
-  f as BTC,
-  d as DAI,
-  r as ETH,
-  m as USDC,
-  s as USDT,
-  x as WLD
+  default2 as BTC,
+  default4 as DAI,
+  default10 as DOGE,
+  default3 as ETH,
+  default12 as LINK,
+  default8 as SOL,
+  default9 as SUI,
+  default5 as USDC,
+  default6 as USDT,
+  default7 as WLD,
+  default11 as XRP
 };

package/dist/components/Token/icons/link.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const LINK: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default LINK;

package/dist/components/Token/icons/link.js

@@ -0,0 +1,27 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const LINK = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#2A5ADA" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M44 20L39.5963 22.5321L27.5963 29.4679L23.1926 32V56L27.5963 58.5321L39.7064 65.4679L44.1101 68L48.5137 65.4679L60.4036 58.5321L64.8073 56V32L60.4036 29.4679L48.4036 22.5321L44 20ZM32 50.9358V37.0642L44 30.1284L56 37.0642V50.9358L44 57.8716L32 50.9358Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  LINK as default
+};

package/dist/components/Token/icons/sol.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const SOL: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default SOL;

package/dist/components/Token/icons/sol.js

@@ -0,0 +1,93 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const SOL = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsxs("g", { "clip-path": "url(#clip0_2277_732)", children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M27.6616 54.1925C27.9537 53.8944 28.3553 53.7205 28.7813 53.7205H67.4088C68.1146 53.7205 68.4676 54.59 67.9686 55.0993L60.338 62.888C60.0459 63.1862 59.6443 63.3601 59.2184 63.3601H20.5909C19.885 63.3601 19.5321 62.4905 20.031 61.9812L27.6616 54.1925Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint0_linear_2277_732)" : void 0
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M27.6616 25.1121C27.9659 24.8139 28.3675 24.64 28.7813 24.64H67.4088C68.1146 24.64 68.4676 25.5096 67.9686 26.0189L60.338 33.8076C60.0459 34.1057 59.6443 34.2796 59.2184 34.2796H20.5909C19.885 34.2796 19.5321 33.4101 20.031 32.9008L27.6616 25.1121Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint1_linear_2277_732)" : void 0
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M60.338 39.5591C60.0459 39.261 59.6443 39.0871 59.2184 39.0871H20.5909C19.885 39.0871 19.5321 39.9566 20.031 40.4659L27.6616 48.2547C27.9537 48.5528 28.3553 48.7267 28.7813 48.7267H67.4088C68.1146 48.7267 68.4676 47.8571 67.9686 47.3478L60.338 39.5591Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint2_linear_2277_732)" : void 0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("defs", { children: [
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint0_linear_2277_732",
+            x1: "63.7187",
+            y1: "19.9873",
+            x2: "36.1134",
+            y2: "71.7889",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint1_linear_2277_732",
+            x1: "52.0295",
+            y1: "13.758",
+            x2: "24.4242",
+            y2: "65.5596",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint2_linear_2277_732",
+            x1: "57.8369",
+            y1: "16.8528",
+            x2: "30.2316",
+            y2: "68.6544",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("clipPath", { id: "clip0_2277_732", children: /* @__PURE__ */ jsx("rect", { width: "48.4", height: "38.72", fill: "white", transform: "translate(19.8 24.64)" }) })
+      ] })
+    ]
+  }
+);
+export {
+  SOL as default
+};

package/dist/components/Token/icons/sui.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const SUI: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default SUI;

package/dist/components/Token/icons/sui.js

@@ -0,0 +1,29 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const SUI = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#61BFFF" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M55.6288 39.886C57.6422 42.4157 58.8555 45.6295 58.8555 49.1143C58.8555 52.5991 57.6164 55.9032 55.5385 58.4587L55.3578 58.6781L55.3061 58.3942C55.2674 58.1618 55.2158 57.9166 55.1642 57.6714C54.1316 53.1153 50.7501 49.2046 45.1744 46.0296C41.4186 43.9 39.2631 41.3316 38.6953 38.4146C38.3339 36.5303 38.6049 34.633 39.1212 33.0068C39.6503 31.3805 40.4247 30.0253 41.083 29.2122L43.2513 26.5663C43.6256 26.1017 44.3484 26.1017 44.7227 26.5663L55.6288 39.886ZM59.0491 37.2401L44.542 19.5064C44.2709 19.1708 43.7418 19.1708 43.4707 19.5064L28.9507 37.2401L28.8991 37.3047C26.2403 40.6217 24.6399 44.8293 24.6399 49.4111C24.6399 60.0849 33.3132 68.7453 43.9999 68.7453C54.6866 68.7453 63.3599 60.0849 63.3599 49.4111C63.3599 44.8293 61.7595 40.6217 59.0878 37.3047L59.0491 37.2401ZM32.4226 39.8344L33.7133 38.2469L33.752 38.5437C33.7778 38.776 33.8165 39.0084 33.8682 39.2407C34.7071 43.6418 37.7143 47.3202 42.7221 50.1597C47.0846 52.6378 49.6143 55.4902 50.35 58.6265C50.6597 59.9301 50.7114 61.2207 50.5823 62.3436L50.5694 62.4081L50.5049 62.434C48.543 63.3891 46.3231 63.9311 43.987 63.9311C35.7913 63.9311 29.1443 57.2971 29.1443 49.1143C29.1443 45.6037 30.3705 42.3641 32.4226 39.8344Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  SUI as default
+};

package/dist/components/Token/icons/usdc.js

@@ -1,6 +1,6 @@
-import { jsxs as e, jsx as t } from "react/jsx-runtime";
-import { getBackgroundClass as l, getIconFillClass as s } from "./utils.js";
-const i = (C) => /* @__PURE__ */ e(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const USDC = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,27 +8,27 @@ const i = (C) => /* @__PURE__ */ e(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...C,
+    ...props,
     style: { color: "#005CFF" },
     children: [
-      /* @__PURE__ */ t("rect", { width: "88", height: "88", rx: "44", className: l(C) }),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           d: "M52.7781 48.6526C52.7781 43.9987 49.9857 42.403 44.4008 41.7383C40.4117 41.2063 39.6138 40.1426 39.6138 38.2808C39.6138 36.419 40.9437 35.2225 43.603 35.2225C45.9965 35.2225 47.3263 36.0204 47.9911 38.0149C48.1242 38.4139 48.5231 38.6797 48.922 38.6797H51.0494C51.5814 38.6797 51.9803 38.2808 51.9803 37.7491V37.616C51.4483 34.6905 49.0548 32.4301 45.9965 32.1643V28.9729C45.9965 28.4409 45.5976 28.042 44.9328 27.9089H42.9382C42.4062 27.9089 42.0073 28.3078 41.8743 28.9729V32.0312C37.8851 32.5632 35.3588 35.2225 35.3588 38.5469C35.3588 42.935 38.0182 44.6635 43.603 45.3285C47.3263 45.9933 48.5231 46.7911 48.5231 48.9188C48.5231 51.0465 46.6613 52.5091 44.135 52.5091C40.6775 52.5091 39.4807 51.0462 39.0818 49.0516C38.9491 48.5199 38.5501 48.2537 38.1512 48.2537H35.8905C35.3588 48.2537 34.9599 48.6526 34.9599 49.1846V49.3177C35.4916 52.6418 37.6192 55.0353 42.0073 55.7004V58.8918C42.0073 59.4234 42.4062 59.8224 43.071 59.9554H45.0656C45.5976 59.9554 45.9965 59.5565 46.1296 58.8918V55.7004C50.1188 55.0353 52.7781 52.2429 52.7781 48.6526Z",
-          className: s(C)
+          className: getIconFillClass(props)
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ jsx(
         "path",
         {
           d: "M37.2184 62.6161C26.8465 58.8931 21.5275 47.3244 25.3839 37.0853C27.3785 31.5005 31.7666 27.2455 37.2184 25.2509C37.7504 24.985 38.0162 24.5861 38.0162 23.921V22.0595C38.0162 21.5275 37.7504 21.1286 37.2184 20.9958C37.0853 20.9958 36.8195 20.9958 36.6864 21.1286C24.0541 25.1178 17.1394 38.5482 21.1286 51.1805C23.5221 58.6269 29.24 64.3448 36.6864 66.7383C37.2184 67.0042 37.7504 66.7383 37.8832 66.2063C38.0162 66.0736 38.0162 65.9405 38.0162 65.6747V63.8128C38.0162 63.4139 37.6173 62.8822 37.2184 62.6161ZM51.3136 21.1286C50.7816 20.8628 50.2496 21.1286 50.1168 21.6606C49.9838 21.7937 49.9838 21.9264 49.9838 22.1926V24.0541C49.9838 24.5861 50.3827 25.1178 50.7816 25.3839C61.1535 29.107 66.4725 40.6756 62.6161 50.9147C60.6215 56.4995 56.2334 60.7546 50.7816 62.7491C50.2496 63.015 49.9838 63.4139 49.9838 64.079V65.9405C49.9838 66.4725 50.2496 66.8714 50.7816 67.0042C50.9147 67.0042 51.1805 67.0042 51.3136 66.8714C63.9459 62.8822 70.8606 49.4518 66.8714 36.8195C64.4779 29.24 58.6269 23.5221 51.3136 21.1286Z",
-          className: s(C)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  i as default
+  USDC as default
 };

package/dist/components/Token/icons/usdt.js

@@ -1,6 +1,6 @@
-import { jsxs as C, jsx as s } from "react/jsx-runtime";
-import { getBackgroundClass as e, getIconFillClass as l } from "./utils.js";
-const i = (t) => /* @__PURE__ */ C(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const USDT = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,20 +8,20 @@ const i = (t) => /* @__PURE__ */ C(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...t,
+    ...props,
     style: { color: "#28D9A6" },
     children: [
-      /* @__PURE__ */ s("rect", { width: "88", height: "88", rx: "44", className: e(t) }),
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           d: "M48.4722 37.3457V31.9535H60.8028V23.7377H27.2262V31.9535H39.5582V37.3414C29.5358 37.8017 22 39.7866 22 42.1644C22 44.5423 29.5395 46.5272 39.5582 46.9904V64.2623H48.4751V46.989C58.4794 46.5272 66 44.5437 66 42.1681C66 39.7924 58.4794 37.8089 48.4751 37.3472M48.4751 45.526V45.5217C48.2235 45.5376 46.931 45.6152 44.0529 45.6152C41.7519 45.6152 40.1331 45.5499 39.5626 45.5202V45.5275C30.7081 45.1353 24.0987 43.5933 24.0987 41.7483C24.0987 39.9033 30.7088 38.3635 39.5626 37.9706V43.9913C40.1426 44.0312 41.8012 44.129 44.0906 44.129C46.8403 44.129 48.2228 44.0145 48.4766 43.9913V37.9706C57.3137 38.3643 63.9078 39.9077 63.9078 41.7461C63.9078 43.5846 57.3108 45.1287 48.4766 45.5224",
-          className: l(t)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  i as default
+  USDT as default
 };

package/dist/components/Token/icons/utils.js

@@ -1,11 +1,12 @@
-const o = ({
-  disabled: l,
-  variant: r
-}) => l ? "fill-gray-350" : r === "color" ? "fill-current" : "fill-gray-100", a = ({
-  disabled: l,
-  variant: r
-}) => l || r === "color" ? "fill-gray-0" : "fill-gray-900";
+const getBackgroundClass = ({
+  disabled,
+  variant
+}) => disabled ? "fill-gray-350" : variant === "color" ? "fill-current" : "fill-gray-100";
+const getIconFillClass = ({
+  disabled,
+  variant
+}) => disabled || variant === "color" ? "fill-gray-0" : "fill-gray-900";
 export {
-  o as getBackgroundClass,
-  a as getIconFillClass
+  getBackgroundClass,
+  getIconFillClass
 };

package/dist/components/Token/icons/wld.js

@@ -1,6 +1,6 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import { getBackgroundClass as e, getIconFillClass as l } from "./utils.js";
-const i = (C) => /* @__PURE__ */ s(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const WLD = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "88",
@@ -8,20 +8,20 @@ const i = (C) => /* @__PURE__ */ s(
     viewBox: "0 0 88 88",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    ...C,
+    ...props,
     style: { color: "#181818" },
     children: [
-      /* @__PURE__ */ t("rect", { width: "88", height: "88", rx: "44", className: e(C) }),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
         "path",
         {
           d: "M44 63.9998C40.3849 63.9998 37.0423 63.1044 33.9778 61.308C30.9132 59.5171 28.4828 57.0866 26.6919 54.0221C24.8954 50.952 24 47.615 24 43.9998C24 40.3847 24.8954 37.0421 26.6919 33.9776C28.4828 30.9131 30.9132 28.4826 33.9778 26.6917C37.0423 24.8953 40.3849 23.9998 44 23.9998C47.6151 23.9998 50.9577 24.8953 54.0222 26.6917C57.0868 28.4882 59.5172 30.9131 61.3081 33.9776C63.099 37.0421 64 40.3847 64 43.9998C64 47.615 63.1046 50.9576 61.3081 54.0221C59.5172 57.0866 57.0868 59.5171 54.0222 61.308C50.9577 63.0989 47.6151 63.9998 44 63.9998ZM25.6908 46.0799V42.0032H62.3482V46.0799H25.6908ZM44 59.8341C46.8643 59.8341 49.4894 59.1278 51.8754 57.7095C54.2614 56.2913 56.1468 54.378 57.5373 51.9643C58.9277 49.5505 59.6174 46.8975 59.6174 44.0054C59.6174 41.1133 58.9221 38.4604 57.5373 36.0466C56.1468 33.6328 54.2614 31.714 51.8754 30.3013C49.4894 28.8831 46.8643 28.1767 44 28.1767C41.1357 28.1767 38.5106 28.8831 36.1246 30.3013C33.7386 31.7195 31.8532 33.6328 30.4627 36.0466C29.0723 38.4604 28.3826 41.1133 28.3826 44.0054C28.3826 46.8975 29.0779 49.5505 30.4627 51.9643C31.8532 54.378 33.7386 56.2968 36.1246 57.7095C38.5106 59.1278 41.1357 59.8341 44 59.8341ZM33.327 44.3002V43.7774C33.327 41.7251 33.8165 39.8675 34.8009 38.2045C35.7853 36.5416 37.1646 35.2346 38.9444 34.2779C40.7241 33.3213 42.7542 32.8486 45.04 32.8486H58.4438L60.3515 36.8419H45.2125C42.9544 36.8419 41.1413 37.4926 39.7675 38.7941C38.3938 40.0955 37.7041 41.7585 37.7041 43.7829V44.3057C37.7041 46.358 38.3938 48.0321 39.7675 49.3169C41.1413 50.6016 42.9544 51.2468 45.2125 51.2468H60.3515L58.4438 55.2401H45.04C42.7542 55.2401 40.7241 54.7618 38.9444 53.8107C37.1646 52.8541 35.7853 51.5471 34.8009 49.8842C33.8165 48.2212 33.327 46.3636 33.327 44.3113V44.3002Z",
-          className: l(C)
+          className: getIconFillClass(props)
         }
       )
     ]
   }
 );
 export {
-  i as default
+  WLD as default
 };

package/dist/components/Token/icons/xrp.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const XRP: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default XRP;