4a:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4b:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4c:Tc5a4,import { Fragment } from "react"; import { Body, Head as EmailHead, Html, Preview, Tailwind, Section, Row, Column, Link, Heading, Text, Img, } from "react-email"; import { DefaultFonts } from "@/components/email/font-default"; import { createEmailTailwindConfig } from "@/components/email/email-theme"; import type { EmailTheme } from "@/components/email/email-theme"; import { emailAsset } from "@/components/email/email-assets"; import { defaultTheme } from "@/components/email/theme-default"; type TeamCardsDetails_TwoColumnTeamCardsWithDetailsVariant = | "default" | "boxed" | "accent"; interface TeamCardsDetails_TwoColumnTeamCardsWithDetailsProps { theme?: EmailTheme; avatarSrc1?: string; avatarAlt1?: string; name1?: string; role1?: string; bio1?: string; email1?: string; avatarSrc2?: string; avatarAlt2?: string; name2?: string; role2?: string; bio2?: string; email2?: string; variant?: TeamCardsDetails_TwoColumnTeamCardsWithDetailsVariant; } const TeamCardsDetails_fontFamily = 'Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'; const TeamCardsDetails_responsiveStyles = ` @media only screen and (max-width: 599px) { .team-details-stack { display: block !important; width: 100% !important; } .team-details-gap { line-height: 24px !important; } } `; const TeamCardsDetails_SocialLinks = ({ accent, lastIcon, }: { accent: boolean; lastIcon: "instagram" | "linkedin"; }) => { const suffix = accent ? "light" : "dark"; const icons = ["facebook", "x", lastIcon] as const; return (

{icons.map((icon, index) => ( {index > 0 ? ( ‍ ) : null}

))}

); }; interface TeamCardsDetails_DetailsCardProps { accent: boolean; avatarAlt: string; avatarSrc: string; bio: string; email: string; lastIcon: "instagram" | "linkedin"; name: string; role: string; variant: TeamCardsDetails_TwoColumnTeamCardsWithDetailsVariant; } const TeamCardsDetails_DetailsCard = ({ accent, avatarAlt, avatarSrc, bio, email, lastIcon, name, role, variant, }: TeamCardsDetails_DetailsCardProps) => { const boxed = variant !== "default"; const backgroundColor = accent ? "#030712" : "#f9fafb"; const content = ( <> {name} {role}

‍

{bio}

‍

{email}

‍

); if (!boxed) { return ( <> {avatarAlt}

‍

{content} ); } return ( <>

{content}

); }; const TeamCardsDetails_TwoColumnTeamCardsWithDetailsSection = ({ avatarAlt1 = "", avatarAlt2 = "", avatarSrc1 = emailAsset("teams/member-1-lg.jpg"), avatarSrc2 = emailAsset("teams/member-2-lg.jpg"), bio1 = "Imagination is more important than knowledge. For knowledge is limited, whereas imagination embraces.", bio2 = "Imagination is more important than knowledge. For knowledge is limited, whereas imagination embraces.", email1 = "jadam@example.com", email2 = "hpetersson@example.com", name1 = "Jason Adam", name2 = "Henrik Petersson", role1 = "Senior Developer", role2 = "Senior UX/UI designer", variant = "default", }: Omit) => { const accent = variant === "accent"; return ( <>

‍

); }; const TeamCardsDetails_TwoColumnTeamCardsWithDetails = ({ theme = defaultTheme, ...props }: TeamCardsDetails_TwoColumnTeamCardsWithDetailsProps) => ( Meet the team ); TeamCardsDetails_TwoColumnTeamCardsWithDetails.PreviewProps = { theme: defaultTheme, variant: "default", } satisfies TeamCardsDetails_TwoColumnTeamCardsWithDetailsProps; const __TeamCardsDetails = TeamCardsDetails_TwoColumnTeamCardsWithDetails; type TeamCards_TwoColumnTeamCardsVariant = | "default" | "boxed" | "accent" | "boxed-alt" | "accent-alt" | "rounded" | "rounded-accent"; interface TeamCards_TwoColumnTeamCardsProps { theme?: EmailTheme; avatarSrc1?: string; avatarAlt1?: string; name1?: string; role1?: string; avatarSrc2?: string; avatarAlt2?: string; name2?: string; role2?: string; variant?: TeamCards_TwoColumnTeamCardsVariant; } const TeamCards_fontFamily = 'Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'; const TeamCards_responsiveStyles = ` @media only screen and (max-width: 599px) { .team-stack { display: block !important; width: 100% !important; } .team-gap { line-height: 24px !important; } .team-round-image { max-width: 144px !important; } } `; const TeamCards_socialIcons = { dark: { facebook: emailAsset("icon-facebook-dark.png"), instagram: emailAsset("icon-instagram-dark.png"), linkedin: emailAsset("icon-linkedin-dark.png"), x: emailAsset("icon-x-dark.png"), }, light: { facebook: emailAsset("icon-facebook-light.png"), instagram: emailAsset("icon-instagram-light.png"), linkedin: emailAsset("icon-linkedin-light.png"), x: emailAsset("icon-x-light.png"), }, }; const TeamCards_SocialLinks = ({ accent, center, lastIcon, }: { accent: boolean; center: boolean; lastIcon: "instagram" | "linkedin"; }) => { const icons = accent ? TeamCards_socialIcons.light : TeamCards_socialIcons.dark; const links = ["facebook", "x", lastIcon] as const; return (

{links.map((icon, index) => ( {index > 0 ? ( ‍ ) : null}

))}

); }; interface TeamCards_TeamCardProps { accent: boolean; avatarAlt: string; avatarSrc: string; lastIcon: "instagram" | "linkedin"; name: string; role: string; variant: TeamCards_TwoColumnTeamCardsVariant; } const TeamCards_TeamCard = ({ accent, avatarAlt, avatarSrc, lastIcon, name, role, variant, }: TeamCards_TeamCardProps) => { const rounded = variant === "rounded" || variant === "rounded-accent"; const boxed = variant !== "default"; const alt = variant === "boxed-alt" || variant === "accent-alt"; const cardBackground = accent ? "#030712" : "#f9fafb"; const content = ( <> {name} {role}

‍

); if (rounded) { return (

‍

{content}

); } if (boxed) { return ( <>

{content}

); } return ( <> {avatarAlt}

‍

{content} ); }; const TeamCards_TwoColumnTeamCardsSection = ({ avatarAlt1 = "", avatarAlt2 = "", avatarSrc1, avatarSrc2, name1 = "Jason Adam", name2 = "Henrik Petersson", role1 = "Senior Developer", role2 = "Senior UX/UI designer", variant = "default", }: Omit) => { const rounded = variant === "rounded" || variant === "rounded-accent"; const accent = variant === "accent" || variant === "accent-alt" || variant === "rounded-accent"; return ( <>

‍

); }; const TeamCards_TwoColumnTeamCards = ({ theme = defaultTheme, ...props }: TeamCards_TwoColumnTeamCardsProps) => ( Meet the team ); TeamCards_TwoColumnTeamCards.PreviewProps = { theme: defaultTheme, variant: "default", } satisfies TeamCards_TwoColumnTeamCardsProps; const __TeamCards = TeamCards_TwoColumnTeamCards; type TeamCompact_TwoColumnsCompactVariant = | "default" | "border-top" | "bordered" | "accent"; interface TeamCompact_TwoColumnsCompactProps { theme?: EmailTheme; avatarSrc1?: string; avatarAlt1?: string; name1?: string; role1?: string; avatarSrc2?: string; avatarAlt2?: string; name2?: string; role2?: string; variant?: TeamCompact_TwoColumnsCompactVariant; } const TeamCompact_fontFamily = 'Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'; const TeamCompact_responsiveStyles = ` @media only screen and (max-width: 599px) { .compact-team-stack { display: block !important; width: 100% !important; } .compact-team-gap { line-height: 24px !important; } } `; const TeamCompact_SocialLinks = ({ lastIcon, }: { lastIcon: "instagram" | "linkedin"; }) => { const icons = ["facebook", "x", lastIcon] as const; return (

{icons.map((icon, index) => ( {index > 0 ? ( ‍ ) : null}

))}

); }; interface TeamCompact_CompactCardProps { avatarAlt: string; avatarSrc: string; lastIcon: "instagram" | "linkedin"; name: string; role: string; variant: TeamCompact_TwoColumnsCompactVariant; } const TeamCompact_CompactCard = ({ avatarAlt, avatarSrc, lastIcon, name, role, variant, }: TeamCompact_CompactCardProps) => { const boxed = variant === "bordered" || variant === "accent"; const accent = variant === "accent"; const member = (

‍ {name} {role} {boxed ? null : ( <>

‍

)}

); if (boxed) { return (

{member}

); } return ( <> {variant === "border-top" ? ( <>

‍

) : null} {member} ); }; const TeamCompact_TwoColumnsCompactSection = ({ avatarAlt1 = "", avatarAlt2 = "", avatarSrc1 = emailAsset("teams/member-1-md.jpg"), avatarSrc2 = emailAsset("teams/member-2-md.jpg"), name1 = "Jason Adam", name2 = "Henrik Petersson", role1 = "Senior Developer", role2 = "Senior UX/UI designer", variant = "default", }: Omit) => ( <>

‍

); const TeamCompact_TwoColumnsCompact = ({ theme = defaultTheme, ...props }: TeamCompact_TwoColumnsCompactProps) => ( Meet the team ); TeamCompact_TwoColumnsCompact.PreviewProps = { theme: defaultTheme, variant: "default", } satisfies TeamCompact_TwoColumnsCompactProps; const __TeamCompact = TeamCompact_TwoColumnsCompact; type TeamGrid_ThreeColumnsTeamGridVariant = | "default" | "with-accent" | "bordered" | "with-hero"; interface TeamGrid_ThreeColumnsTeamGridProps { theme?: EmailTheme; avatarSrc1?: string; avatarAlt1?: string; name1?: string; role1?: string; avatarSrc2?: string; avatarAlt2?: string; name2?: string; role2?: string; avatarSrc3?: string; avatarAlt3?: string; name3?: string; role3?: string; avatarSrc4?: string; avatarAlt4?: string; name4?: string; role4?: string; avatarSrc5?: string; avatarAlt5?: string; name5?: string; role5?: string; avatarSrc6?: string; avatarAlt6?: string; name6?: string; role6?: string; heroImageSrc?: string; variant?: TeamGrid_ThreeColumnsTeamGridVariant; } const TeamGrid_fontFamily = 'Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'; const TeamGrid_responsiveStyles = ` @media only screen and (max-width: 599px) { .team-grid-cell { display: inline-block !important; width: 50% !important; margin-bottom: 24px !important; } .team-grid-gap { display: none !important; } .team-grid-card-pad { padding-left: 12px !important; padding-right: 12px !important; } } `; type TeamGrid_SocialIcon = | "facebook" | "github" | "instagram" | "linkedin" | "x"; interface TeamGrid_Member { alt: string; image: string; name: string; role: string; social: TeamGrid_SocialIcon[]; } const TeamGrid_SocialLinks = ({ accent, icons, }: { accent: boolean; icons: TeamGrid_SocialIcon[]; }) => { const suffix = accent ? "light" : "dark"; return (

{icons.map((icon, index) => ( {index > 0 ? ( ‍ ) : null}

))}

); }; const TeamGrid_MemberCard = ({ featured, member, variant, }: { featured: boolean; member: TeamGrid_Member; variant: TeamGrid_ThreeColumnsTeamGridVariant; }) => { const treated = variant === "with-accent" || variant === "bordered"; const accent = featured && variant === "with-accent"; return (

{member.name} {member.role}

‍

); }; const TeamGrid_GridRows = ({ members, variant, }: { members: TeamGrid_Member[]; variant: TeamGrid_ThreeColumnsTeamGridVariant; }) => { const rows = [members.slice(0, 3), members.slice(3, 6)]; const gap = variant === "with-accent" || variant === "bordered" ? 20 : 44; return (

{rows.map((row, rowIndex) => ( {rowIndex > 0 ? ( ‍ ) : null} {row.map((member, memberIndex) => { const absoluteIndex = rowIndex * 3 + memberIndex; return ( {memberIndex > 0 ? ( ‍ ) : null} ); })} ))}

); }; const TeamGrid_ThreeColumnsTeamGridSection = ( props: Omit ) => { const { avatarAlt1, avatarAlt2, avatarAlt3, avatarAlt4, avatarAlt5, avatarAlt6, avatarSrc1, avatarSrc2, avatarSrc3, avatarSrc4, avatarSrc5, avatarSrc6, heroImageSrc, name1, name2, name3, name4, name5, name6, role1, role2, role3, role4, role5, role6, variant, } = { avatarAlt1: "", avatarAlt2: "", avatarAlt3: "", avatarAlt4: "", avatarAlt5: "", avatarAlt6: "", avatarSrc1: emailAsset("teams/member-1.jpg"), avatarSrc2: emailAsset("teams/member-2.jpg"), avatarSrc3: emailAsset("teams/member-3.jpg"), avatarSrc4: emailAsset("teams/member-4.jpg"), avatarSrc5: emailAsset("teams/member-5.jpg"), avatarSrc6: emailAsset("teams/member-6.jpg"), heroImageSrc: emailAsset("teams/hero.jpg"), name1: "Jason Adam", name2: "Henrik Petersson", name3: "Ella Roustek", name4: "Hannah Andersson", name5: "Terrence Hold", name6: "Sandra Ver", role1: "Senior Developer", role2: "Senior UX/UI designer", role3: "Frontend Developer", role4: "Product Manager", role5: "Head of Engineering", role6: "UX Research Lead", variant: "default" as TeamGrid_ThreeColumnsTeamGridVariant, ...props, }; const members: TeamGrid_Member[] = [ { alt: avatarAlt1, image: avatarSrc1, name: name1, role: role1, social: ["github", "x", "linkedin"], }, { alt: avatarAlt2, image: avatarSrc2, name: name2, role: role2, social: ["facebook", "x", "instagram"], }, { alt: avatarAlt3, image: avatarSrc3, name: name3, role: role3, social: ["x", "github"], }, { alt: avatarAlt4, image: avatarSrc4, name: name4, role: role4, social: ["facebook", "x", "linkedin"], }, { alt: avatarAlt5, image: avatarSrc5, name: name5, role: role5, social: ["x", "github"], }, { alt: avatarAlt6, image: avatarSrc6, name: name6, role: role6, social: ["x", "instagram"], }, ]; return ( <>

‍ {variant === "with-hero" ? ( <>

Meet the Founder/Organiser {name1} {role1}

‍

Additional speakers ) : null} ‍

); }; const TeamGrid_ThreeColumnsTeamGrid = ({ theme = defaultTheme, ...props }: TeamGrid_ThreeColumnsTeamGridProps) => ( Meet the team ); TeamGrid_ThreeColumnsTeamGrid.PreviewProps = { theme: defaultTheme, variant: "default", } satisfies TeamGrid_ThreeColumnsTeamGridProps; const __TeamGrid = TeamGrid_ThreeColumnsTeamGrid; type TeamBios_HorizontalTeamMemberBiosVariant = | "image-left" | "image-right" | "image-left-accent" | "image-right-accent"; interface TeamBios_HorizontalTeamMemberBiosProps { theme?: EmailTheme; avatarSrc1?: string; avatarAlt1?: string; name1?: string; role1?: string; bio1?: string; avatarSrc2?: string; avatarAlt2?: string; name2?: string; role2?: string; bio2?: string; variant?: TeamBios_HorizontalTeamMemberBiosVariant; } const TeamBios_fontFamily = 'Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'; const TeamBios_responsiveStyles = ` @media only screen and (max-width: 599px) { .horizontal-team-stack { display: block !important; width: 100% !important; } .horizontal-team-gap { line-height: 24px !important; } .horizontal-team-image { max-width: 144px !important; } .horizontal-team-center { text-align: center !important; } .horizontal-team-social { margin-left: auto !important; margin-right: auto !important; } } `; const TeamBios_SocialLinks = ({ accent, lastIcon, }: { accent: boolean; lastIcon: "instagram" | "linkedin"; }) => { const suffix = accent ? "light" : "dark"; const icons = ["facebook", "x", lastIcon] as const; return (

{icons.map((icon, index) => ( {index > 0 ? ( ‍ ) : null}

))}

); }; const TeamBios_GapCell = () => ( ‍ ); interface TeamBios_HorizontalCardProps { accent: boolean; avatarAlt: string; avatarSrc: string; bio: string; imageLeft: boolean; lastIcon: "instagram" | "linkedin"; name: string; role: string; } const TeamBios_HorizontalCard = ({ accent, avatarAlt, avatarSrc, bio, imageLeft, lastIcon, name, role, }: TeamBios_HorizontalCardProps) => { const ImageCell = () => ( {avatarAlt}

); const ContentCell = () => ( {name} {role}

‍

{bio}

‍

); return (

{imageLeft ? ( <> ) : ( <> )}

); }; const TeamBios_HorizontalTeamMemberBiosSection = ({ avatarAlt1 = "", avatarAlt2 = "", avatarSrc1 = emailAsset("teams/member-1-md.jpg"), avatarSrc2 = emailAsset("teams/member-2-md.jpg"), bio1 = "Imagination is more important than knowledge. For knowledge is limited.", bio2 = "Imagination is more important than knowledge. For knowledge is limited.", name1 = "Jason Adam", name2 = "Henrik Petersson", role1 = "Senior Developer", role2 = "Senior UX/UI designer", variant = "image-left", }: Omit) => { const imageLeft = variant === "image-left" || variant === "image-left-accent"; const accent = variant.endsWith("-accent"); return ( <>

‍

); }; const TeamBios_HorizontalTeamMemberBios = ({ theme = defaultTheme, ...props }: TeamBios_HorizontalTeamMemberBiosProps) => ( Meet the team ); TeamBios_HorizontalTeamMemberBios.PreviewProps = { theme: defaultTheme, variant: "image-left", } satisfies TeamBios_HorizontalTeamMemberBiosProps; const __TeamBios = TeamBios_HorizontalTeamMemberBios; export interface TeamMember { name: string; role: string; avatar: { alt?: string; src: string; }; bio?: string; email?: string; } export interface TeamProps { theme?: Parameters[0]["theme"]; members?: TeamMember[]; layout?: "cards" | "compact" | "grid" | "bios"; columns?: 2 | 3; appearance?: "plain" | "boxed" | "bordered" | "accent" | "rounded"; imagePosition?: "left" | "right"; heroImage?: { src: string; alt?: string; }; details?: boolean; variant?: | Parameters[0]["variant"] | Parameters[0]["variant"] | Parameters[0]["variant"] | Parameters[0]["variant"] | Parameters[0]["variant"]; } const toTeamProps = (members: TeamMember[] | undefined) => Object.fromEntries( (members ?? []).flatMap((member, index) => { const suffix = index + 1; return [ [`avatarSrc${suffix}`, member.avatar.src], [`avatarAlt${suffix}`, member.avatar.alt], [`name${suffix}`, member.name], [`role${suffix}`, member.role], [`bio${suffix}`, member.bio], [`email${suffix}`, member.email], ]; }) ); export const Team = ({ theme, members, layout = "cards", columns = 2, appearance = "plain", imagePosition = "left", heroImage, details, variant: variantOverride, }: TeamProps) => { const props = { ...toTeamProps(members), theme }; if (layout === "compact") { const variant = { accent: "accent", bordered: "bordered", boxed: "border-top", plain: "default", rounded: "default", }[appearance]; return ( <__TeamCompact {...props} variant={ (variantOverride ?? variant) as Parameters< typeof __TeamCompact >[0]["variant"] } /> ); } if (layout === "grid" || columns === 3) { const variant = (() => { if (heroImage) { return "with-hero"; } if (appearance === "accent") { return "with-accent"; } if (appearance === "bordered") { return "bordered"; } return "default"; })(); return ( <__TeamGrid {...props} heroImageSrc={heroImage?.src} variant={ (variantOverride ?? variant) as Parameters< typeof __TeamGrid >[0]["variant"] } /> ); } if (layout === "bios") { const variant = `image-${imagePosition}${appearance === "accent" ? "-accent" : ""}`; return ( <__TeamBios {...props} variant={ (variantOverride ?? variant) as Parameters< typeof __TeamBios >[0]["variant"] } /> ); } const withDetails = details ?? members?.some(({ bio, email }) => bio || email) ?? false; const variant = (() => { if (appearance === "plain") { return "default"; } if (appearance === "bordered") { return "boxed"; } return appearance; })(); return (() => { if (withDetails) { return ( <__TeamCardsDetails {...props} variant={ (variantOverride ?? variant) === "rounded" ? "default" : ((variantOverride ?? variant) as Parameters< typeof __TeamCardsDetails >[0]["variant"]) } /> ); } return ( <__TeamCards {...props} variant={ (variantOverride ?? variant) as Parameters< typeof __TeamCards >[0]["variant"] } /> ); })(); }; Team.PreviewProps = { appearance: "plain", columns: 2, details: false, imagePosition: "left", layout: "cards", } satisfies TeamProps; 4d:T32a6,const ASSET_ORIGIN = "https://www.emailcn.run"; const ICONS8_ORIGIN = "https://img.icons8.com"; const UNSPLASH_ORIGIN = "https://images.unsplash.com"; const portraitIds = [ "photo-1500648767791-00dcc994a43e", "photo-1507003211169-0a1dd7228f2d", "photo-1494790108377-be9c29b29330", "photo-1438761681033-6461ffad8d80", "photo-1534528741775-53994a69daeb", "photo-1506794778202-cad84cf45f1c", ] as const; const productIds = [ "photo-1521572163474-6864f9cf17ab", "photo-1503341504253-dff4815485f1", "photo-1576566588028-4147f3842f27", "photo-1562157873-818bc0726f68", ] as const; type Dimensions = readonly [width: number, height: number]; const dimensionRules = [ [/^bento-grids\/1-bento-(?:1|4)\./i, [336, 272]], [/^bento-grids\/1-bento-(?:2|3)\./i, [720, 272]], [/^bento-grids\/2-bento-1\./i, [336, 232]], [/^bento-grids\/2-bento-(?:2|7)\./i, [720, 352]], [/^bento-grids\/2-bento-3\./i, [720, 344]], [/^bento-grids\/2-bento-4\./i, [336, 224]], [/^bento-grids\/2-bento-(?:5|6)\./i, [336, 408]], [/^bento-grids\/3-bento-lg-\d-pad\./i, [304, 576]], [/^bento-grids\/3-bento-lg-\d\./i, [336, 576]], [/^bento-grids\/3-bento-sm-\d\./i, [336, 336]], [/^bento-grids\/4-bento-lg-(?:1|2)\./i, [496, 440]], [/^bento-grids\/4-bento-lg-3\./i, [688, 242]], [/^bento-grids\/4-bento-lg-4\./i, [656, 242]], [/^bento-grids\/4-bento-sm-[1-4]\./i, [456, 363]], [/^bento-grids\/4-bento-sm-5\./i, [408, 363]], [/^bento-grids\/bento-1\./i, [720, 376]], [/^bento-grids\/bento-[2-5]\./i, [528, 376]], [/^category-previews\/landscape-/i, [508, 376]], [/^category-previews\/portrait-/i, [376, 377]], [/^coupons\/(?:bg-image-[1-3]|pattern)\./i, [800, 500]], [/^coupons\/bg-image-[4-6]\./i, [1200, 1200]], [/^cta\/cta-bg-1\./i, [1200, 772]], [/^cta\/cta-bg-2\./i, [1200, 760]], [/^cta\/cta-bg-3\./i, [1104, 696]], [/^cta\/cta-bg-glow\./i, [1200, 840]], [/^cta\/cta-collage-(?:1|4)\./i, [248, 456]], [/^cta\/(?:cta-collage-(?:2|3)|cta-outwear-\d)\./i, [280, 456]], [/^cta\/cta-split-avatars-\d\./i, [280, 338]], [/^cta\/cta-with-image-\d\./i, [944, 606]], [/^cta\/strip-cut-\d\./i, [232, 163]], [/^cta\/strip-\d\./i, [232, 232]], [/^feature\/feature-1\./i, [564, 564]], [/^feature\/feature-2-/i, [432, 432]], [/^feature\/feature-3-lg-/i, [646, 818]], [/^feature\/feature-3-sm-/i, [615, 615]], [/^feature\/stripes-bg-(?:1|2)\./i, [1035, 1227]], [/^feature\/stripes-bg-3\./i, [449, 1227]], [/^feature\/stripes-bg-(?:4|5)\./i, [449, 840]], [/^footers\/bg-image-(?:1|2)\./i, [1200, 881]], [/^footers\/bg-image-3\./i, [1104, 881]], [/^hero\/aligned-overlay-bg-\d\./i, [702, 1200]], [/^hero\/block-overlay-bg\./i, [2000, 3000]], [/^hero\/block-with-bleed-bg\./i, [2000, 2922]], [/^hero\/mosaic-\d\./i, [240, 240]], [/^hero\/overlapped-content-bg-(?:1|3)\./i, [1200, 1258]], [/^hero\/overlapped-content-bg-2\./i, [1200, 1374]], [/^hero\/overlapped-content-bg-4\./i, [1200, 1410]], [/^hero\/overlapped-image-\d-bg\./i, [2000, 3000]], [/^hero\/overlapped-image-bg\./i, [2000, 2995]], [/^hero\/overlapped-image-2\./i, [911, 610]], [/^hero\/overlapped-image-3\./i, [911, 606]], [/^hero\/overlapped-image\./i, [911, 657]], [/^hero\/(?:overlay-gradient-bg|overlayed-split-bg)\./i, [2000, 3000]], [/^hero\/overlayed\/hero-overlayed-bg\./i, [1200, 1490]], [/^hero\/split-contained-bg\./i, [488, 1104]], [/^hero\/split-contained-landscape-/i, [488, 376]], [/^hero\/split-contained-portrait-/i, [488, 680]], [/^hero\/split-contained-square-/i, [488, 550]], [/^hero\/split-full-bleed-bg\./i, [2000, 2666]], [/^hero\/split-slanted-bg\./i, [2002, 2534]], [/^image-grids\/2-col-landscape/i, [528, 372]], [/^image-grids\/2-col-portrait/i, [528, 792]], [/^image-grids\/2-col-square/i, [528, 528]], [/^image-grids\/3-col-masonry-stack/i, [503, 558]], [/^image-grids\/3-col-masonry/i, [720, 792]], [/^image-grids\/3-col-portrait/i, [504, 753]], [/^image-grids\/3-col-square/i, [504, 504]], [/^image-grids\/full-width\./i, [1104, 720]], [/^image-grids\/full-width-\d\./i, [1104, 792]], [/^product-detail\/stacked-\d\./i, [508, 358]], [/^product-detail\/rating-below\./i, [508, 508]], [/^product-detail\/single-landscape\./i, [1104, 776]], [/^product-detail\/single-portrait\./i, [508, 764]], [/^product-detail\/single-portrait-bleed\./i, [532, 764]], [/^product-detail\/two-images-\d\./i, [528, 776]], [/^product-detail\/three-images-1\./i, [528, 776]], [/^product-detail\/three-images-(?:2|3)\./i, [528, 364]], [/^product-detail\/four-images-(?:1|4)\./i, [528, 488]], [/^product-detail\/four-images-(?:2|3)\./i, [528, 240]], [/^stats\/overlay-1\./i, [1572, 2268]], [/^stats\/overlay-2\./i, [1572, 2716]], [/^stats\/overlay-(?:3|4)\./i, [1572, 3256]], [/^stats\/single-stat\./i, [1035, 1032]], [/^teams\/hero\./i, [1104, 776]], [/^teams\/member-\d+-lg\./i, [528, 376]], [/^teams\/member-\d+-md\./i, [328, 328]], [/^teams\/member-\d+\./i, [256, 256]], [/^timelines\/cards\./i, [1072, 600]], [/^testimonials\/quote\./i, [72, 62]], [/^testimonials\/user-\d+\./i, [256, 256]], [/^feature\/logo-north-face\./i, [278, 128]], [/^feature\/logo-stripes-1\./i, [390, 84]], [/^feature\/logo-stripes-2\./i, [423, 72]], [/^(?:reviews|testimonials)\/logo-accentic(?:-light)?\./i, [423, 72]], [/^reviews\/logo-amada\./i, [411, 84]], [/^(?:reviews|testimonials)\/logo-monarch\./i, [290, 64]], [/^logos\/logo-apple-pay\./i, [180, 72]], [/^logos\/logo-google-pay\./i, [177, 72]], [/^logos\/logo-klarna\./i, [210, 48]], [/^logos\/logo-mastercard\./i, [120, 72]], [/^logos\/logo-mock-1\./i, [334, 72]], [/^logos\/logo-mock-2\./i, [213, 36]], [/^logos\/logo-mock-3\./i, [234, 48]], [/^logos\/logo-stripe\./i, [171, 72]], [/^logos\/logo-visa\./i, [150, 48]], [/^order-summary\/logo-fedex\./i, [156, 48]], [/^emailcn-logo(?:-light)?\./i, [331, 48]], [/^emailcn-insignia-mono(?:-light)?\./i, [131, 96]], [/^maizzle-insignia(?:-light)?-lg\./i, [395, 289]], [/^maizzle-insignia(?:-light)?\./i, [176, 129]], ] satisfies readonly (readonly [RegExp, Dimensions])[]; const socialIconSlugs = { discord: "discord-logo", facebook: "facebook-new", github: "github", instagram: "instagram-new", linkedin: "linkedin", slack: "slack-new", x: "twitterx--v1", youtube: "youtube-play", } as const; const brandIconSlugs = [ [/(?:btc|bitcoin)/i, "bitcoin--v1"], [/(?:eth|ethereum)/i, "ethereum"], ] as const; const hashString = (value: string) => { let hash = 7; for (const character of value) { hash = (hash * 31 + (character.codePointAt(0) ?? 0)) % 2_147_483_647; } return hash; }; const getDimensions = (path: string) => { const matchedRule = dimensionRules.find(([pattern]) => pattern.test(path)); if (matchedRule) { return matchedRule[1]; } if (/(?:avatar|user|headshot)/i.test(path)) { return [160, 160] as const; } if (/(?:logo|insignia)/i.test(path)) { return [320, 96] as const; } if (/(?:badge-app|badge-google)/i.test(path)) { return [260, 80] as const; } if (/(?:icon|btc|eth)/i.test(path)) { return [64, 64] as const; } if (/(?:portrait|member|team)/i.test(path)) { return [600, 800] as const; } if (/(?:square|product|shopping-cart)/i.test(path)) { return [700, 700] as const; } if (/(?:hero|footer|background|bg-|overlay|full-width)/i.test(path)) { return [1200, 700] as const; } if (/(?:strip|landscape|bento|category-preview)/i.test(path)) { return [800, 520] as const; } return [800, 600] as const; }; const getLabel = (path: string) => { if (/insignia/i.test(path)) { return "EC"; } if (/(?:emailcn|maizzle)/i.test(path)) { return "emailcn"; } const fileName = path.split("/").at(-1) ?? "emailcn"; return fileName .replace(/\.[^.]+$/, "") .replace(/^(?:logo|badge|icon)-/, "") .replaceAll("-", " ") .replaceAll(/\b\w/g, (character) => character.toUpperCase()); }; const getSeed = (path: string) => `emailcn-${path .replace(/\.[^.]+$/, "") .replaceAll(/[^a-z0-9]+/gi, "-") .replaceAll(/^-|-$/g, "") .toLowerCase()}`; const getIndexedAsset = (path: string, assets: readonly string[]) => { const explicitIndex = path.match( /(?:member|avatar|product-list|shopping-cart)-(\d+)/i )?.[1]; const index = explicitIndex ? Number.parseInt(explicitIndex, 10) - 1 : hashString(path); return assets[((index % assets.length) + assets.length) % assets.length]; }; const getUnsplashAsset = (id: string, width: number, height: number) => `${UNSPLASH_ORIGIN}/${id}?auto=format&fit=crop&w=${width}&h=${height}&q=80`; const getIcons8Asset = ( slug: string, { color, style = "ios-filled", }: { color?: string; style?: "color" | "ios" | "ios-filled"; } = {} ) => color ? `${ICONS8_ORIGIN}/${style}/50/${color}/${slug}.png` : `${ICONS8_ORIGIN}/${style}/50/${slug}.png`; const getStoreBadgeAsset = (path: string) => { if (/badge-app-store/i.test(path)) { return "https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"; } if (/badge-google-play/i.test(path)) { return "https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"; } }; const getSocialIconAsset = (path: string) => { const isLight = /(?:-light|check-white)/i.test(path); const foreground = isLight ? "FFFFFF" : "111827"; for (const [name, slug] of Object.entries(socialIconSlugs)) { if (new RegExp(`(?:^|[-/])${name}(?:[-.]|$)`, "i").test(path)) { return getIcons8Asset(slug, { color: foreground }); } } }; const getUtilityIconAsset = (path: string) => { const isLight = /(?:-light|check-white)/i.test(path); const foreground = isLight ? "FFFFFF" : "111827"; if (/star-half/i.test(path)) { return getIcons8Asset("star-half-empty", { color: "374151" }); } if (/star-solid/i.test(path)) { return getIcons8Asset("star--v1", { color: "374151" }); } if (/edit/i.test(path)) { return getIcons8Asset("edit--v1", { color: "4F46E5", style: "ios", }); } if (/arrow-right/i.test(path)) { const color = /(?:brand|indigo)/i.test(path) ? "4F46E5" : "FFFFFF"; return getIcons8Asset("long-arrow-right--v1", { color, style: "ios", }); } if (/chevron-right/i.test(path)) { return getIcons8Asset("chevron-right", { color: "4F46E5", style: "ios", }); } if (/check/i.test(path)) { return getIcons8Asset("checkmark--v1", { color: foreground }); } }; const getBrandIconAsset = (path: string) => { const match = brandIconSlugs.find(([pattern]) => pattern.test(path)); return match ? getIcons8Asset(match[1], { style: "color", }) : undefined; }; const getWordmarkAsset = (path: string, [width, height]: Dimensions) => { const isLight = /light/i.test(path); const background = isLight ? "030712" : "FFFFFF"; const foreground = isLight ? "FFFFFF" : "111827"; return `https://placehold.co/${width}x${height}/${background}/${foreground}.png?text=${encodeURIComponent( getLabel(path) )}`; }; const getIconAsset = (path: string) => getStoreBadgeAsset(path) ?? getSocialIconAsset(path) ?? getUtilityIconAsset(path) ?? getBrandIconAsset(path); export const emailAsset = (path: string) => { const normalizedPath = path.replace(/^\/+/, ""); if ( normalizedPath === "bento-grids/trend.png" || normalizedPath === "bento-grids/trend-sm.png" ) { return `${ASSET_ORIGIN}/email-assets/${normalizedPath}`; } const iconAsset = getIconAsset(normalizedPath); if (iconAsset) { return iconAsset; } const seed = getSeed(normalizedPath); const [width, height] = getDimensions(normalizedPath); if (/teams\/hero/i.test(normalizedPath)) { return getUnsplashAsset("photo-1521737711867-e3b97375f902", width, height); } if (/(?:avatar|user|headshot|member|team)/i.test(normalizedPath)) { return getUnsplashAsset( getIndexedAsset(normalizedPath, portraitIds), width, height ); } if (/products\/shoe/i.test(normalizedPath)) { return getUnsplashAsset("photo-1542291026-7eec264c27ff", width, height); } if (/products\/phone/i.test(normalizedPath)) { return getUnsplashAsset("photo-1511707171634-5f897ff02aa9", width, height); } if ( /(?:category-previews|product-detail|product-lists|products\/product|shopping-cart)/i.test( normalizedPath ) ) { return getUnsplashAsset( getIndexedAsset(normalizedPath, productIds), width, height ); } if (/(?:trend|chart)/i.test(normalizedPath)) { return `${ASSET_ORIGIN}/email-assets/bento-grids/trend.png`; } if (/(?:emailcn|maizzle|logo|insignia)/i.test(normalizedPath)) { return getWordmarkAsset(normalizedPath, [width, height]); } return `https://picsum.photos/seed/${encodeURIComponent( seed )}/${width}/${height}.jpg`; }; 49:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","react-email",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/react-email","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"react-email"}]]}]}]]}],["$","$L4a",null,{"namespace":"@emailcn","registryDependencies":["https://emailcn.run/r/react-email/default-fonts.json","https://emailcn.run/r/react-email/theme-default.json"]}]]}],null]}],["$","$L4b",null,{"files":[{"path":"registry/bases/react-email/components/marketing/team/team.tsx","content":"$4c","type":"registry:component","target":"components/email/team.tsx"},{"path":"registry/email-assets.ts","content":"$4d","type":"registry:file","target":"components/email/email-assets.ts"}],"className":"h-[70svh] min-h-80"}]]}]