@fairmint/ui 0.2.3 → 0.2.4

package/dist/fairmint-ui.js

@@ -23733,6 +23733,46 @@ function EmailField({ error: error2, ...rest }) {
     }
   );
 }
+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 ethereumAddressSchema = stringType().trim().regex(
+  ETHEREUM_ADDRESS_REGEX,
+  "Must be a valid Ethereum address (0x followed by 40 hex characters)"
+).refine(
+  (v) => v.toLowerCase() !== ZERO_ETHEREUM_ADDRESS.toLowerCase(),
+  "Cannot use the zero address"
+);
+function EthereumAddressField({ error: error2, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      type: "text",
+      label: rest.label ?? "Wallet Address",
+      placeholder: rest.placeholder ?? "0x...",
+      autoComplete: "off",
+      inputMode: "text",
+      spellCheck: false,
+      styles: { input: { fontFamily: "monospace" } },
+      error: error2,
+      ...rest
+    }
+  );
+}
 function validateFormName(name) {
   if (!/^[0-9a-zA-Z-]+$/.test(name)) {
     throw new Error(
@@ -25077,6 +25117,75 @@ function DetailDrawer({
     }
   );
 }
+function EditableSection({
+  title,
+  readView,
+  onSave,
+  onCancel,
+  disabled = false,
+  onSaveError,
+  editIcon,
+  saveLabel = "Save",
+  cancelLabel = "Cancel",
+  children
+}) {
+  const [isEditing, setIsEditing] = useState(false);
+  const [isSaving, setIsSaving] = useState(false);
+  useEffect(() => {
+    if (disabled && isEditing) {
+      onCancel?.();
+      setIsEditing(false);
+    }
+  }, [disabled, isEditing, onCancel]);
+  const handleEdit = () => setIsEditing(true);
+  const handleSave = async () => {
+    setIsSaving(true);
+    try {
+      await onSave();
+      setIsEditing(false);
+    } catch (err) {
+      onSaveError?.(err);
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  const handleCancel = () => {
+    onCancel?.();
+    setIsEditing(false);
+  };
+  return /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+    (title || !disabled && !isEditing) && /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", children: [
+      title && /* @__PURE__ */ jsx(Text, { fw: 500, size: "sm", children: title }),
+      !disabled && !isEditing && (editIcon ? /* @__PURE__ */ jsx(
+        ActionIcon,
+        {
+          variant: "subtle",
+          size: "sm",
+          onClick: handleEdit,
+          "aria-label": `Edit ${typeof title === "string" ? title : "section"}`,
+          children: editIcon
+        }
+      ) : /* @__PURE__ */ jsx(Button, { variant: "subtle", size: "xs", onClick: handleEdit, children: "Edit" }))
+    ] }),
+    isEditing ? /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+      children,
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", justify: "flex-end", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "subtle",
+            size: "xs",
+            color: colors.neutral,
+            onClick: handleCancel,
+            disabled: isSaving,
+            children: cancelLabel
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { size: "xs", onClick: handleSave, loading: isSaving, children: saveLabel })
+      ] })
+    ] }) : readView
+  ] });
+}
 const DefaultChevronIcon = () => /* @__PURE__ */ jsx(
   "svg",
   {
@@ -25538,23 +25647,6 @@ 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",
@@ -25799,10 +25891,12 @@ export {
   DocumentRow,
   Drawer,
   ETHEREUM_ADDRESS_REGEX,
+  EditableSection,
   EmailField,
   EmptyState,
   EquityGrantCard,
   ErrorFallback,
+  EthereumAddressField,
   FairmintLogo,
   FairmintProvider,
   Flex,
@@ -25849,6 +25943,7 @@ export {
   colors,
   createZipSchema,
   emailSchema,
+  ethereumAddressSchema,
   formatCurrency,
   formatCurrencyPrecise,
   formatDate,