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

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.js

@@ -1,14 +1,14 @@
-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";
 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,
+  default3 as ETH,
+  default5 as USDC,
+  default6 as USDT,
+  default7 as WLD
 };

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/index.d.ts

@@ -1 +1 @@
-export * from './Token';
+export { Token, type TokenProps } from './Token';

package/dist/components/TopBar/TopBar.d.ts

@@ -9,5 +9,9 @@ interface TopBarProps {
     /** Additional class name for the top bar */
     className?: string;
 }
-export declare function TopBar({ title, startAdornment, endAdornment, className }: TopBarProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare function TopBar({ title, startAdornment, endAdornment, className }: TopBarProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TopBar {
+    var displayName: string;
+}
+export { TopBar };
+export type { TopBarProps };

package/dist/components/TopBar/TopBar.js

@@ -1,33 +1,37 @@
-import { jsxs as o, jsx as s } from "react/jsx-runtime";
-import { cn as a } from "../../lib/utils.js";
-import { Typography as h } from "../Typography/Typography.js";
-function x({ title: l, startAdornment: t, endAdornment: i, className: n }) {
-  const e = !!t, r = !!i, c = e ? "text-center" : "text-left";
-  return /* @__PURE__ */ o(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import { Typography } from "../Typography/Typography.js";
+function TopBar({ title, startAdornment, endAdornment, className }) {
+  const hasStartAdornment = Boolean(startAdornment);
+  const hasEndAdornment = Boolean(endAdornment);
+  const textAlignment = hasStartAdornment ? "text-center" : "text-left";
+  const justifyContent = hasStartAdornment || hasEndAdornment ? "justify-between" : "justify-start";
+  return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: a(
+      className: cn(
         "flex items-center px-6 pt-6 pb-2 w-full h-[4.5rem] gap-10",
-        e || r ? "justify-between" : "justify-start",
-        n
+        justifyContent,
+        className
       ),
       children: [
-        t && /* @__PURE__ */ s("div", { className: "shrink-0", children: t }),
-        /* @__PURE__ */ s(
-          h,
+        startAdornment && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: startAdornment }),
+        /* @__PURE__ */ jsx(
+          Typography,
           {
-            variant: e ? "subtitle" : "heading",
-            level: e ? 1 : 3,
-            className: a("flex-1 grow truncate", c),
-            children: l
+            variant: hasStartAdornment ? "subtitle" : "heading",
+            level: hasStartAdornment ? 1 : 3,
+            className: cn("flex-1 grow truncate", textAlignment),
+            children: title
           }
         ),
-        i && /* @__PURE__ */ s("div", { className: "shrink-0", children: i }),
-        !i && e && /* @__PURE__ */ s("div", { className: "shrink-0 invisible", "aria-hidden": "true", children: t })
+        endAdornment && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: endAdornment }),
+        !endAdornment && hasStartAdornment && /* @__PURE__ */ jsx("div", { className: "shrink-0 invisible", "aria-hidden": "true", children: startAdornment })
       ]
     }
   );
 }
+TopBar.displayName = "TopBar";
 export {
-  x as TopBar
+  TopBar
 };

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

@@ -1 +1 @@
-export * from './TopBar';
+export { TopBar, type TopBarProps } from './TopBar';

package/dist/components/Typography/Typography.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren } from 'react';
-export interface TypographyProps extends React.HTMLAttributes<HTMLElement> {
+interface TypographyProps extends React.HTMLAttributes<HTMLElement> {
     /**
      * The HTML element to render the typography as
      * @default "p"
@@ -27,5 +27,6 @@ export declare const typographyVariants: (props?: ({
     variant?: "number" | "heading" | "subtitle" | "body" | "label" | "display" | null | undefined;
     level?: 1 | 2 | 3 | 4 | 5 | 6 | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export declare const Typography: import('react').ForwardRefExoticComponent<PropsWithChildren<TypographyComponentProps> & import('react').RefAttributes<HTMLElement>>;
-export default Typography;
+declare const Typography: import('react').ForwardRefExoticComponent<PropsWithChildren<TypographyComponentProps> & import('react').RefAttributes<HTMLElement>>;
+export { Typography };
+export type { TypographyProps };

package/dist/components/Typography/Typography.js

@@ -1,8 +1,8 @@
-import { jsx as r } from "react/jsx-runtime";
-import { cva as m } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { forwardRef as v } from "react";
-import { cn as o } from "../../lib/utils.js";
-const c = m("", {
+import { jsx } from "react/jsx-runtime";
+import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { forwardRef } from "react";
+import { cn } from "../../lib/utils.js";
+const typographyVariants = cva("", {
   variants: {
     variant: {
       display: "font-sans font-semibold leading-narrow tracking-[-0.02em] antialiased",
@@ -143,20 +143,22 @@ const c = m("", {
     variant: "body",
     level: 2
   }
-}), x = v(
-  ({ variant: a = "body", level: e = 2, children: t, as: l = "p", className: s, ...n }, i) => /* @__PURE__ */ r(
-    l,
-    {
-      className: o(c({ variant: a, level: e, className: s })),
-      ref: i,
-      ...n,
-      children: t
-    }
-  )
+});
+const Typography = forwardRef(
+  ({ variant = "body", level = 2, children, as: Component = "p", className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        className: cn(typographyVariants({ variant, level, className })),
+        ref,
+        ...props,
+        children
+      }
+    );
+  }
 );
-x.displayName = "Typography";
+Typography.displayName = "Typography";
 export {
-  x as Typography,
-  x as default,
-  c as typographyVariants
+  Typography,
+  typographyVariants
 };

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

@@ -1 +1 @@
-export * from './Typography';
+export { Typography, type TypographyProps } from './Typography';

package/dist/components/WalletAddressField/WalletAddressField.d.ts

@@ -1,5 +1,5 @@
 import { InputProps } from '../Input';
-export interface WalletAddressFieldProps extends Omit<InputProps, "startAdornment" | "endAdornment"> {
+interface WalletAddressFieldProps extends Omit<InputProps, "startAdornment" | "endAdornment"> {
     /**
      * If true, the input will display in an error state with error styling
      */
@@ -19,5 +19,6 @@ export interface WalletAddressFieldProps extends Omit<InputProps, "startAdornmen
      */
     pasteButtonLabel?: string;
 }
-export declare const WalletAddressField: import('react').ForwardRefExoticComponent<WalletAddressFieldProps & import('react').RefAttributes<HTMLInputElement>>;
-export default WalletAddressField;
+declare const WalletAddressField: import('react').ForwardRefExoticComponent<WalletAddressFieldProps & import('react').RefAttributes<HTMLInputElement>>;
+export { WalletAddressField };
+export type { WalletAddressFieldProps };

package/dist/components/WalletAddressField/WalletAddressField.js

@@ -1,79 +1,91 @@
 "use client";
-import { jsx as f } from "react/jsx-runtime";
-import { createChangeEvent as m } from "../../lib/utils.js";
-import { forwardRef as x, useRef as A, useState as c, useImperativeHandle as R } from "react";
-import W from "../ClearButton/ClearButton.js";
-import { Input as j } from "../Input/Input.js";
-import w from "../PasteButton/PasteButton.js";
-const y = x(
+import { jsx } from "react/jsx-runtime";
+import { createChangeEvent } from "../../lib/utils.js";
+import { forwardRef, useRef, useState, useImperativeHandle } from "react";
+import { PasteButton } from "../PasteButton/PasteButton.js";
+import { Input } from "../Input/Input.js";
+import { ClearButton } from "../ClearButton/ClearButton.js";
+const WalletAddressField = forwardRef(
   ({
-    isValid: d,
-    disabled: l,
-    type: o = "text",
-    autoComplete: s = "off",
-    spellCheck: C = "false",
-    label: g = "Wallet address",
-    pasteButtonLabel: v = "Paste",
-    ...e
-  }, F) => {
-    const a = A(null), [h, P] = c(!1), [B, i] = c(""), [I, r] = c(!1);
-    R(F, () => a.current);
-    let u;
-    return !l && !h && !B ? u = /* @__PURE__ */ f(
-      w,
-      {
-        inputRef: a,
-        label: v,
-        onPaste: () => {
-          var t;
-          if (a.current) {
-            const n = m(a.current);
-            (t = e.onChange) == null || t.call(e, n), P(!0);
+    isValid,
+    disabled,
+    type = "text",
+    autoComplete = "off",
+    spellCheck = "false",
+    label = "Wallet address",
+    pasteButtonLabel = "Paste",
+    ...props
+  }, forwardedRef) => {
+    const inputRef = useRef(null);
+    const [isPasted, setIsPasted] = useState(false);
+    const [value, setValue] = useState("");
+    const [isFocused, setIsFocused] = useState(false);
+    useImperativeHandle(forwardedRef, () => inputRef.current);
+    let endAdornment;
+    if (!disabled && !isPasted && !value) {
+      endAdornment = /* @__PURE__ */ jsx(
+        PasteButton,
+        {
+          inputRef,
+          label: pasteButtonLabel,
+          onPaste: () => {
+            var _a;
+            if (inputRef.current) {
+              const event = createChangeEvent(inputRef.current);
+              (_a = props.onChange) == null ? void 0 : _a.call(props, event);
+              setIsPasted(true);
+            }
           }
         }
-      }
-    ) : I && !l && (u = /* @__PURE__ */ f(
-      W,
-      {
-        inputRef: a,
-        onClear: () => {
-          var t;
-          if (a.current) {
-            const n = m(a.current);
-            (t = e.onChange) == null || t.call(e, n), i("");
+      );
+    } else if (isFocused && !disabled) {
+      endAdornment = /* @__PURE__ */ jsx(
+        ClearButton,
+        {
+          inputRef,
+          onClear: () => {
+            var _a;
+            if (inputRef.current) {
+              const event = createChangeEvent(inputRef.current);
+              (_a = props.onChange) == null ? void 0 : _a.call(props, event);
+              setValue("");
+            }
           }
         }
-      }
-    )), /* @__PURE__ */ f(
-      j,
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Input,
       {
-        ...e,
-        ref: a,
-        isValid: d,
-        disabled: l,
-        endAdornment: u,
-        type: o,
-        autoComplete: s,
-        spellCheck: C,
-        label: g,
-        onFocus: (t) => {
-          var n;
-          r(!0), (n = e.onFocus) == null || n.call(e, t);
+        ...props,
+        ref: inputRef,
+        isValid,
+        disabled,
+        endAdornment,
+        type,
+        autoComplete,
+        spellCheck,
+        label,
+        onFocus: (e) => {
+          var _a;
+          setIsFocused(true);
+          (_a = props.onFocus) == null ? void 0 : _a.call(props, e);
         },
-        onBlur: (t) => {
-          var n;
-          r(!1), (n = e.onBlur) == null || n.call(e, t);
+        onBlur: (e) => {
+          var _a;
+          setIsFocused(false);
+          (_a = props.onBlur) == null ? void 0 : _a.call(props, e);
         },
-        onChange: (t) => {
-          var n;
-          (n = e.onChange) == null || n.call(e, t), i(t.target.value);
+        onChange: (e) => {
+          var _a;
+          (_a = props.onChange) == null ? void 0 : _a.call(props, e);
+          setValue(e.target.value);
         }
       }
     );
   }
 );
-y.displayName = "WalletAddressField";
+WalletAddressField.displayName = "WalletAddressField";
 export {
-  y as WalletAddressField,
-  y as default
+  WalletAddressField
 };

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

@@ -1 +1 @@
-export * from './WalletAddressField';
+export { WalletAddressField, type WalletAddressFieldProps } from './WalletAddressField';

package/dist/index.d.ts

@@ -1,37 +1,34 @@
-export * from './components/Button';
-export * from './components/Checkbox';
-export * from './components/Chip';
-export * from './components/ColorPicker';
-export * from './components/Flag';
-export * from './components/Form';
-export * from './components/Input';
-export * from './components/ListItem';
-export * from './components/NumberPad';
-export * from './components/OTPField';
-export * from './components/Pill';
-export * from './components/RadioGroup';
-export * from './components/Select';
-export * from './components/SearchField';
-export * from './components/PhoneField';
-export * from './components/Spinner';
-export * from './components/Switch';
-export * from './components/Token';
-export * from './components/Toast';
-export * from './components/Typography';
-export * from './components/Drawer';
-export * from './components/Progress';
-export * from './components/TextArea';
-export * from './components/WalletAddressField';
-export * from './components/TextArea';
-export * from './components/AlertDialog';
-export * from './components/BottomBar';
-export * from './components/BulletList';
-export * from './components/BulletListItem';
-export * from './components/BulletPoint';
-export * from './components/Marble';
-export * from './components/TopBar';
-export * from './components/CountryDrawer';
-export * from './components/ToggleGroup';
-export * from './components/Tabs';
-export * from './components/LiveFeedback';
+export { Button } from './components/Button';
+export { Checkbox } from './components/Checkbox';
+export { Chip } from './components/Chip';
+export { ColorPickerItem, ColorPickerGroup } from './components/ColorPicker';
+export { Flag } from './components/Flag';
+export { Form } from './components/Form';
+export { Input } from './components/Input';
+export { ListItem } from './components/ListItem';
+export { NumberPad } from './components/NumberPad';
+export { OTPField } from './components/OTPField';
+export { Pill } from './components/Pill';
+export { RadioGroup, RadioGroupItem } from './components/RadioGroup';
+export { Select } from './components/Select';
+export { SearchField } from './components/SearchField';
+export { PhoneField } from './components/PhoneField';
+export { Spinner } from './components/Spinner';
+export { Switch } from './components/Switch';
+export { Token } from './components/Token';
+export { Toast, Toaster, useToast } from './components/Toast';
+export { Typography } from './components/Typography';
+export { Drawer, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerTitle, } from './components/Drawer';
+export { Progress } from './components/Progress';
+export { TextArea } from './components/TextArea';
+export { WalletAddressField } from './components/WalletAddressField';
+export { AlertDialog, AlertDialogPortal, AlertDialogTrigger, AlertDialogClose, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, } from './components/AlertDialog';
+export { BottomBar } from './components/BottomBar';
+export { BulletList, BulletListItem } from './components/BulletList';
+export { Marble } from './components/Marble';
+export { TopBar } from './components/TopBar';
+export { CountryDrawer } from './components/CountryDrawer';
+export { ToggleGroupRoot, ToggleGroupItem } from './components/ToggleGroup';
+export { Tabs, TabItem } from './components/Tabs';
+export { LiveFeedback } from './components/LiveFeedback';
 export { default as uiKitTailwindPlugin } from './tailwind';