@openzeppelin/ui-components 2.2.0 → 2.3.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 = "2.2.0";
+const VERSION = "2.3.0";
 
 //#endregion
 //#region src/components/ui/accordion.tsx
@@ -190,15 +190,19 @@ function usePrefersHover() {
 *
 * // Inline variant (no chip background) — useful inside wallet bars
 * <AddressDisplay address="0x742d35Cc..." variant="inline" showTooltip showCopyButton />
+*
+* // Truncate only when an alias/label is present (full address when unlabeled)
+* <AddressDisplay address="G..." truncateWhenLabeled />
 * ```
 */
-function AddressDisplay({ address, truncate = true, untruncateOnHover = false, startChars = 6, endChars = 4, showCopyButton = false, showCopyButtonOnHover = false, explorerUrl, label: labelProp, onLabelEdit: onLabelEditProp, networkId, disableLabel = false, showTooltip = false, variant = "chip", className, onPointerEnter, onPointerLeave, onMouseEnter, onMouseLeave, onClick, ...props }) {
+function AddressDisplay({ address, truncate: truncateProp, truncateWhenLabeled = false, untruncateOnHover = false, startChars = 6, endChars = 4, showCopyButton = false, showCopyButtonOnHover = false, explorerUrl, label: labelProp, onLabelEdit: onLabelEditProp, networkId, disableLabel = false, showTooltip = false, variant = "chip", className, onPointerEnter, onPointerLeave, onMouseEnter, onMouseLeave, onClick, ...props }) {
 	const [copied, setCopied] = react.useState(false);
 	const [isHovered, setIsHovered] = react.useState(false);
 	const copyTimeoutRef = react.useRef(null);
 	const prefersHover = usePrefersHover();
 	const resolver = react.useContext(AddressLabelContext);
 	const resolvedLabel = disableLabel ? void 0 : labelProp ?? resolver?.resolveLabel(address, networkId);
+	const effectiveTruncate = truncateProp !== void 0 ? truncateProp : truncateWhenLabeled ? Boolean(resolvedLabel) : true;
 	const contextEditHandler = react.useCallback(() => {
 		resolver?.onEditLabel?.(address, networkId);
 	}, [
@@ -207,10 +211,10 @@ function AddressDisplay({ address, truncate = true, untruncateOnHover = false, s
 		networkId
 	]);
 	const editHandler = disableLabel ? void 0 : onLabelEditProp ?? (resolver?.onEditLabel ? contextEditHandler : void 0);
-	const canUntruncate = untruncateOnHover && truncate && !showTooltip;
-	const showFullAddress = !truncate || canUntruncate && isHovered;
+	const canUntruncate = untruncateOnHover && effectiveTruncate && !showTooltip;
+	const showFullAddress = !effectiveTruncate || canUntruncate && isHovered;
 	const displayAddress = showFullAddress ? address : (0, _openzeppelin_ui_utils.truncateMiddle)(address, startChars, endChars);
-	const addressTextClassName = (0, _openzeppelin_ui_utils.cn)(!showFullAddress && "truncate", (showFullAddress || !truncate) && "break-all");
+	const addressTextClassName = (0, _openzeppelin_ui_utils.cn)(!showFullAddress && "truncate", (showFullAddress || !effectiveTruncate) && "break-all");
 	const expandInteractionClassName = canUntruncate && !prefersHover ? "cursor-pointer" : void 0;
 	const handlePointerEnter = (e) => {
 		if (canUntruncate && prefersHover) setIsHovered(true);
@@ -272,7 +276,7 @@ function AddressDisplay({ address, truncate = true, untruncateOnHover = false, s
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Pencil, { className: "h-3.5 w-3.5" })
 		})
 	] });
-	const shouldShowTooltip = showTooltip && truncate;
+	const shouldShowTooltip = showTooltip && effectiveTruncate;
 	const wrapWithTooltip = (content) => {
 		if (!shouldShowTooltip) return content;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipProvider, {