@openzeppelin/ui-components 3.6.0 → 3.8.0

package/dist/index.cjs

@@ -38,7 +38,7 @@ let sonner = require("sonner");
 let next_themes = require("next-themes");
 
 //#region src/version.ts
-const VERSION = "3.6.0";
+const VERSION = "3.8.0";
 
 //#endregion
 //#region src/components/ui/accordion.tsx
@@ -3739,6 +3739,61 @@ function AddressField({ id, label, placeholder, helperText, control, name, width
 }
 AddressField.displayName = "AddressField";
 
+//#endregion
+//#region src/components/fields/ResolvedAddressFieldPreview.tsx
+/**
+* Rich ENS preview shown below an `AddressField` once the value is a valid address.
+* Complements the field's mechanism-neutral "Resolved to 0x…" announcer with
+* reverse-resolved name + avatar via `AddressDisplay`.
+*
+* For async reverse resolution, wrap in `AddressNameProvider` (or
+* `AddressNameResolutionProvider` from `@openzeppelin/ui-renderer`) and omit
+* `resolvedName`. For sync / app-owned resolution, pass `resolvedName` directly.
+*/
+function ResolvedAddressFieldPreview({ address, networkId, addressing, resolvedName, label = "Resolved account", displayProps }) {
+	const trimmed = address?.trim() ?? "";
+	if (!(trimmed !== "" && addressing?.isValidAddress(trimmed) === true)) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "rounded-md border border-border/60 bg-muted/30 px-3 py-2",
+		"aria-label": "Resolved address preview",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "mb-1 text-xs text-muted-foreground",
+			children: label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddressDisplay, {
+			address: trimmed,
+			networkId,
+			variant: "chip",
+			showCopyButton: true,
+			resolvedName,
+			...displayProps
+		})]
+	});
+}
+
+//#endregion
+//#region src/components/fields/AddressFieldWithResolvedPreview.tsx
+/**
+* `AddressField` plus a rich ENS preview card. Suppresses the redundant forward
+* "Resolved to 0x…" announcer — the preview card below replaces it.
+*
+* Parent must `watch` the field and pass the value as `previewAddress`.
+*/
+function AddressFieldWithResolvedPreview({ previewAddress, previewNetworkId, addressing, className, preview, showCrossNetworkFallbackDisclaimer, showForwardResolutionSuccessAnnouncer, ...addressFieldProps }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _openzeppelin_ui_utils.cn)("space-y-1", "[&_[id$=\"-resolution\"]:empty]:min-h-0", className),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddressField, {
+			...addressFieldProps,
+			addressing,
+			showCrossNetworkFallbackDisclaimer: showCrossNetworkFallbackDisclaimer ?? false,
+			showForwardResolutionSuccessAnnouncer: showForwardResolutionSuccessAnnouncer ?? false
+		}), preview ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ResolvedAddressFieldPreview, {
+			address: previewAddress,
+			networkId: previewNetworkId,
+			addressing
+		})]
+	});
+}
+
 //#endregion
 //#region src/components/fields/TextAreaField.tsx
 /**
@@ -7661,6 +7716,7 @@ exports.AccordionItem = AccordionItem;
 exports.AccordionTrigger = AccordionTrigger;
 exports.AddressDisplay = AddressDisplay;
 exports.AddressField = AddressField;
+exports.AddressFieldWithResolvedPreview = AddressFieldWithResolvedPreview;
 exports.AddressLabelProvider = AddressLabelProvider;
 exports.AddressListField = AddressListField;
 exports.AddressNameProvider = AddressNameProvider;
@@ -7761,6 +7817,7 @@ exports.RadioField = RadioField;
 exports.RadioGroup = RadioGroup;
 exports.RadioGroupItem = RadioGroupItem;
 exports.RelayerDetailsCard = RelayerDetailsCard;
+exports.ResolvedAddressFieldPreview = ResolvedAddressFieldPreview;
 exports.Select = Select;
 exports.SelectContent = SelectContent;
 exports.SelectField = SelectField;