From 70a5b46b4b8b9311a6f58b7ab3e3925bd68a6d10 Mon Sep 17 00:00:00 2001 From: Zhihao Cui <5257855+origami-z@users.noreply.github.com> Date: Mon, 30 Sep 2024 17:52:31 +0100 Subject: [PATCH] Use Link for emails in contact details pattern (#4197) Co-authored-by: Yun <46348617+yunjungyeh@users.noreply.github.com> --- .../contact-details.stories.tsx | 42 +++++++++--------- site/docs/patterns/contact-details.mdx | 12 ++++- .../contact-details-actions.png | Bin 31213 -> 31389 bytes .../contact-details-anatomy.png | Bin 49569 -> 50036 bytes .../contact-details/contact-details-card.png | Bin 42888 -> 42917 bytes .../contact-details-collapsible-layout.png | Bin 47287 -> 47519 bytes .../contact-details-collapsible-spacing.png | Bin 69441 -> 69678 bytes .../contact-details/contact-details-icons.png | Bin 41308 -> 41510 bytes .../contact-details-layout-1.png | Bin 90674 -> 90727 bytes .../contact-details-layout-2.png | Bin 65355 -> 65704 bytes .../contact-details-layout-3.png | Bin 79537 -> 79553 bytes .../contact-details-using-links.png | Bin 44149 -> 44336 bytes .../contact-details/contact-details.png | Bin 44112 -> 44318 bytes 13 files changed, 31 insertions(+), 23 deletions(-) diff --git a/packages/core/stories/patterns/contact-details/contact-details.stories.tsx b/packages/core/stories/patterns/contact-details/contact-details.stories.tsx index 8910da0343f..fc1943b7780 100644 --- a/packages/core/stories/patterns/contact-details/contact-details.stories.tsx +++ b/packages/core/stories/patterns/contact-details/contact-details.stories.tsx @@ -6,6 +6,7 @@ import { type DropdownProps, FlexLayout, FlowLayout, + Link, Option, SplitLayout, StackLayout, @@ -53,7 +54,9 @@ const basicContact = { }, { label: "Email", - value: "jane.doe@example.com", + value: ( + jane.doe@example.com + ), icon: , }, ], @@ -86,7 +89,7 @@ export const ContactDetails = ({ avatarSrc = persona }) => { {basicContact.metadata.map((metadata) => { return ( - + {metadata.label} ); @@ -182,7 +185,7 @@ export const QuickAction = () => { hideIcon >