@fairmint/ui 0.2.1 → 0.2.3

package/dist/fairmint-ui.js

@@ -24822,6 +24822,29 @@ function PhoneField({ error: error2, ...rest }) {
     }
   );
 }
+const US_ZIP_REGEX = /^\d{5}(-\d{4})?$/;
+const INTL_POSTAL_REGEX = /^[A-Z0-9]+(?:[ -][A-Z0-9]+)*$/i;
+function createZipSchema(options) {
+  if (options?.international) {
+    return stringType().trim().min(3, "Please enter a valid postal code").max(10, "Please enter a valid postal code").regex(INTL_POSTAL_REGEX, "Please enter a valid postal code");
+  }
+  return stringType().trim().regex(US_ZIP_REGEX, "Please enter a valid ZIP code (e.g. 94105 or 94105-1234)");
+}
+const zipSchema = createZipSchema();
+function ZipField({ error: error2, international = false, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      type: "text",
+      label: rest.label ?? "ZIP / Postal Code",
+      placeholder: rest.placeholder ?? (international ? "SW1A 2AA" : "94105"),
+      autoComplete: "postal-code",
+      inputMode: "text",
+      error: error2,
+      ...rest
+    }
+  );
+}
 const ANIMATION_MAP = {
   up: "fadeUp",
   down: "fadeDown",
@@ -25515,6 +25538,211 @@ function InvestorProfileCard({
     children
   ] });
 }
+function truncateAddress(address, chars = 4) {
+  if (address.length <= chars * 2 + 2) return address;
+  return `${address.slice(0, chars + 2)}...${address.slice(-chars)}`;
+}
+const ZERO_ADDRESS = "0x0000000000000000000000000000000000000000";
+const ETH_ADDRESS_RE = /^0x[a-fA-F0-9]{40}$/;
+function isEthereumAddress(value) {
+  return ETH_ADDRESS_RE.test(value) && value.toLowerCase() !== ZERO_ADDRESS;
+}
+function validateEthereumAddress(value) {
+  if (!ETH_ADDRESS_RE.test(value))
+    return "Must be a valid Ethereum address (0x + 40 hex characters)";
+  if (value.toLowerCase() === ZERO_ADDRESS) return "Cannot use the zero address";
+  return null;
+}
+const ETHEREUM_ADDRESS_REGEX = ETH_ADDRESS_RE;
+const ZERO_ETHEREUM_ADDRESS = ZERO_ADDRESS;
+const DEFAULT_TYPE_LABELS = {
+  fairmint: "Fairmint Wallet",
+  privy: "Fairmint Wallet",
+  manual: "Manual"
+};
+function getTypeLabel(type, custom2) {
+  if (custom2?.[type]) return custom2[type];
+  return DEFAULT_TYPE_LABELS[type] ?? type;
+}
+function WalletList({
+  wallets,
+  onAdd,
+  onRemove,
+  readOnly = false,
+  addLoading = false,
+  removeLoading = false,
+  emptyIcon,
+  copyIcon,
+  copiedIcon,
+  removeIcon,
+  addIcon,
+  typeLabels,
+  removableTypes = ["manual"]
+}) {
+  const [newAddress, setNewAddress] = useState("");
+  const [addressError, setAddressError] = useState(null);
+  const [showAddForm, setShowAddForm] = useState(false);
+  const [walletToRemove, setWalletToRemove] = useState(null);
+  const [copiedAddress, setCopiedAddress] = useState(null);
+  const copyTimeoutRef = useRef(void 0);
+  useEffect(() => () => clearTimeout(copyTimeoutRef.current), []);
+  const copyAddress = async (address) => {
+    try {
+      await navigator.clipboard.writeText(address);
+      clearTimeout(copyTimeoutRef.current);
+      setCopiedAddress(address);
+      copyTimeoutRef.current = setTimeout(() => setCopiedAddress(null), 2e3);
+    } catch {
+    }
+  };
+  const canAdd = !readOnly && !!onAdd;
+  const canRemove = !readOnly && !!onRemove;
+  const handleAdd = async () => {
+    const trimmed = newAddress.trim();
+    const error2 = validateEthereumAddress(trimmed);
+    if (error2) {
+      setAddressError(error2);
+      return;
+    }
+    setAddressError(null);
+    try {
+      await onAdd?.(trimmed);
+      setNewAddress("");
+      setShowAddForm(false);
+    } catch {
+      setAddressError("Failed to add wallet");
+    }
+  };
+  const [removeError, setRemoveError] = useState(null);
+  const handleRemove = async () => {
+    if (!walletToRemove) return;
+    setRemoveError(null);
+    try {
+      await onRemove?.(walletToRemove);
+      setWalletToRemove(null);
+    } catch {
+      setRemoveError("Failed to remove wallet. Please try again.");
+    }
+  };
+  if (wallets.length === 0 && !showAddForm) {
+    return /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: emptyIcon,
+        title: "No wallets connected",
+        description: "Add a wallet address to receive equity on-chain.",
+        actionLabel: canAdd ? "Add Wallet" : void 0,
+        onAction: canAdd ? () => setShowAddForm(true) : void 0
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+    wallets.map((w) => /* @__PURE__ */ jsxs(
+      Group,
+      {
+        justify: "space-between",
+        p: "xs",
+        style: {
+          borderRadius: "var(--mantine-radius-sm)",
+          border: "1px solid var(--mantine-color-default-border)"
+        },
+        children: [
+          /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+            /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", children: getTypeLabel(w.type, typeLabels) }),
+            w.label && /* @__PURE__ */ jsx(Text, { size: "xs", c: `${colors.neutral}.5`, children: w.label }),
+            /* @__PURE__ */ jsx(Text, { size: "sm", ff: "monospace", children: truncateAddress(w.address) })
+          ] }),
+          /* @__PURE__ */ jsxs(Group, { gap: 4, children: [
+            copyIcon && /* @__PURE__ */ jsx(Tooltip, { label: copiedAddress === w.address ? "Copied!" : "Copy address", children: /* @__PURE__ */ jsx(
+              ActionIcon,
+              {
+                variant: "subtle",
+                size: "sm",
+                onClick: () => copyAddress(w.address),
+                "aria-label": "Copy wallet address",
+                children: copiedAddress === w.address ? copiedIcon ?? copyIcon : copyIcon
+              }
+            ) }),
+            canRemove && removeIcon && removableTypes.includes(w.type) && /* @__PURE__ */ jsx(Tooltip, { label: "Remove wallet", children: /* @__PURE__ */ jsx(
+              ActionIcon,
+              {
+                variant: "subtle",
+                size: "sm",
+                color: colors.error,
+                onClick: () => setWalletToRemove(w.address),
+                disabled: removeLoading,
+                "aria-label": "Remove wallet",
+                children: removeIcon
+              }
+            ) })
+          ] })
+        ]
+      },
+      w.address
+    )),
+    canAdd && (showAddForm ? /* @__PURE__ */ jsxs(Group, { gap: "xs", mt: "xs", children: [
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          placeholder: "0x...",
+          "aria-label": "Wallet address",
+          value: newAddress,
+          onChange: (e) => {
+            setNewAddress(e.currentTarget.value);
+            setAddressError(null);
+          },
+          error: addressError,
+          style: { flex: 1 }
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { size: "sm", onClick: handleAdd, loading: addLoading, children: "Add" }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "sm",
+          variant: "subtle",
+          color: colors.neutral,
+          onClick: () => {
+            setShowAddForm(false);
+            setNewAddress("");
+            setAddressError(null);
+          },
+          children: "Cancel"
+        }
+      )
+    ] }) : /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "light",
+        size: "xs",
+        leftSection: addIcon,
+        onClick: () => setShowAddForm(true),
+        mt: "xs",
+        children: "Add Wallet"
+      }
+    )),
+    /* @__PURE__ */ jsx(
+      ConfirmDialog,
+      {
+        title: "Remove Wallet",
+        message: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: "Are you sure you want to remove this wallet address? This action cannot be undone." }),
+          walletToRemove && /* @__PURE__ */ jsx(Text, { size: "sm", ff: "monospace", c: `${colors.neutral}.5`, children: walletToRemove }),
+          removeError && /* @__PURE__ */ jsx(Text, { size: "sm", c: colors.error, children: removeError })
+        ] }),
+        opened: walletToRemove !== null,
+        confirmLabel: "Remove",
+        confirmColor: colors.error,
+        onConfirm: handleRemove,
+        onCancel: () => {
+          setWalletToRemove(null);
+          setRemoveError(null);
+        },
+        loading: removeLoading
+      }
+    )
+  ] });
+}
 function useDebouncedCallback(fn, delay) {
   const timer = useRef(null);
   const fnRef = useRef(fn);
@@ -25546,10 +25774,6 @@ const notify = {
   warning: ({ title, message, autoClose = 5e3 }) => notifications.show({ title, message, color: colors.warning, autoClose }),
   info: ({ title, message, autoClose = 4e3 }) => notifications.show({ title, message, color: colors.info, autoClose })
 };
-function truncateAddress(address, chars = 4) {
-  if (address.length <= chars * 2 + 2) return address;
-  return `${address.slice(0, chars + 2)}...${address.slice(-chars)}`;
-}
 export {
   AVATAR_PALETTE,
   ActionIcon,
@@ -25574,6 +25798,7 @@ export {
   Divider,
   DocumentRow,
   Drawer,
+  ETHEREUM_ADDRESS_REGEX,
   EmailField,
   EmptyState,
   EquityGrantCard,
@@ -25617,8 +25842,12 @@ export {
   Title,
   Tooltip,
   UserMenu,
+  WalletList,
+  ZERO_ETHEREUM_ADDRESS,
+  ZipField,
   brandColors,
   colors,
+  createZipSchema,
   emailSchema,
   formatCurrency,
   formatCurrencyPrecise,
@@ -25627,6 +25856,7 @@ export {
   formatPercent,
   formatPreciseWithCurrency,
   getAvatarColor,
+  isEthereumAddress,
   neutralColors,
   notify,
   passwordSchema,
@@ -25647,6 +25877,8 @@ export {
   useMediaQuery,
   useScrollIntoView,
   useViewportSize,
-  z
+  validateEthereumAddress,
+  z,
+  zipSchema
 };
 //# sourceMappingURL=fairmint-ui.js.map