@opensite/ui 3.7.2 → 3.7.3

package/dist/link-page-newsletter-social.cjs

@@ -512,6 +512,47 @@ var SocialLinkIcon = React4__namespace.forwardRef(
   }
 );
 SocialLinkIcon.displayName = "SocialLinkIcon";
+var SIZE_CLASSES = {
+  sm: "max-h-6 sm:max-h-7",
+  md: "max-h-8 sm:max-h-9 lg:max-h-10",
+  lg: "max-h-10 sm:max-h-12 lg:max-h-14",
+  xl: "max-h-12 sm:max-h-14 lg:max-h-16"
+};
+var BrandLogo = ({
+  logo,
+  logoSlot,
+  logoClassName,
+  size = "md",
+  optixFlowConfig
+}) => {
+  if (logoSlot) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot });
+  if (!logo || !logo.src) return null;
+  const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
+    img.Img,
+    {
+      src: logo.src,
+      className: cn(
+        "w-auto object-contain",
+        SIZE_CLASSES[size],
+        logo.className
+      ),
+      alt: logo.alt || "Logo",
+      optixFlowConfig,
+      loading: "eager"
+    }
+  );
+  if (logo.url) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      pressable.Pressable,
+      {
+        href: logo.url,
+        className: cn("flex items-center", logoClassName),
+        children: imgElement
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
+};
 var DEFAULT_STYLE_RULES = {
   formContainer: "w-full flex flex-col gap-3 justify-center items-center",
   fieldsContainer: "",
@@ -534,6 +575,9 @@ function LinkPageNewsletterSocial({
   bio,
   avatar,
   avatarUrl,
+  logo,
+  logoSlot,
+  logoClassName,
   profileSlot,
   newsletterHeading,
   newsletterDescription,
@@ -590,14 +634,23 @@ function LinkPageNewsletterSocial({
           headerClassName
         ),
         children: [
-          resolvedAvatar && /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
               className: cn(
                 "flex h-24 w-full max-w-72 items-center justify-center",
                 avatarClassName
               ),
-              children: /* @__PURE__ */ jsxRuntime.jsx(
+              children: logo ? /* @__PURE__ */ jsxRuntime.jsx(
+                BrandLogo,
+                {
+                  logo,
+                  logoSlot,
+                  size: "xl",
+                  logoClassName: cn("mb-2", logoClassName),
+                  optixFlowConfig
+                }
+              ) : logoSlot ? logoSlot : resolvedAvatar ? /* @__PURE__ */ jsxRuntime.jsx(
                 img.Img,
                 {
                   src: resolvedAvatar.src,
@@ -605,7 +658,7 @@ function LinkPageNewsletterSocial({
                   className: "h-auto max-h-24 w-auto max-w-full object-contain",
                   optixFlowConfig
                 }
-              )
+              ) : null
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
@@ -617,6 +670,9 @@ function LinkPageNewsletterSocial({
     );
   }, [
     profileSlot,
+    logo,
+    logoSlot,
+    logoClassName,
     avatar,
     avatarUrl,
     avatarClassName,

package/dist/link-page-newsletter-social.d.cts

@@ -1,8 +1,11 @@
 import * as React from 'react';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Cgd-IXlI.cjs';
 import { FormEngineProps } from '@page-speed/forms/integration';
+import { L as LogoConfig } from './types-mWZcgKth.cjs';
 import { I as ImageItem, A as ActionConfig, j as SocialLinkItem, O as OptixFlowConfig } from './blocks-DyouPohq.cjs';
 import 'react/jsx-runtime';
+import './dynamic-icon.cjs';
+import '@page-speed/icon';
 import 'class-variance-authority';
 import '@page-speed/pressable';
 import '@opensite/hooks/usePlatformFromUrl';
@@ -41,6 +44,18 @@ interface LinkPageNewsletterSocialProps {
      * Avatar image URL (legacy)
      */
     avatarUrl?: string;
+    /**
+     * Optional LogoConfig for BrandLogo rendering (takes priority over avatar)
+     */
+    logo?: LogoConfig;
+    /**
+     * Custom slot for the logo/avatar (takes priority over logo and avatar)
+     */
+    logoSlot?: React.ReactNode;
+    /**
+     * Additional CSS classes for the logo image
+     */
+    logoClassName?: string;
     /**
      * Custom slot for profile header content
      */
@@ -239,6 +254,6 @@ interface LinkPageNewsletterSocialProps {
  * />
  * ```
  */
-declare function LinkPageNewsletterSocial({ sectionId, name, bio, avatar, avatarUrl, profileSlot, newsletterHeading, newsletterDescription, formEngineSetup, buttonAction, helperText, newsletterSlot, formSlot, links, linksSlot, linkChevronIcon, socialLinks, socialLinksSlot, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, bioClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, newsletterCardClassName, newsletterHeadingClassName, newsletterDescriptionClassName, linksClassName, linkClassName, linkIconClassName, linkLabelClassName, linkChevronClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, optixFlowConfig, }: LinkPageNewsletterSocialProps): React.JSX.Element;
+declare function LinkPageNewsletterSocial({ sectionId, name, bio, avatar, avatarUrl, logo, logoSlot, logoClassName, profileSlot, newsletterHeading, newsletterDescription, formEngineSetup, buttonAction, helperText, newsletterSlot, formSlot, links, linksSlot, linkChevronIcon, socialLinks, socialLinksSlot, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, bioClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, newsletterCardClassName, newsletterHeadingClassName, newsletterDescriptionClassName, linksClassName, linkClassName, linkIconClassName, linkLabelClassName, linkChevronClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, optixFlowConfig, }: LinkPageNewsletterSocialProps): React.JSX.Element;
 
 export { LinkPageNewsletterSocial, type LinkPageNewsletterSocialProps, type NewsletterSocialLink, type NewsletterSocialSocialLink };

package/dist/link-page-newsletter-social.d.ts

@@ -1,8 +1,11 @@
 import * as React from 'react';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Dud0DKXB.js';
 import { FormEngineProps } from '@page-speed/forms/integration';
+import { L as LogoConfig } from './types-hJ2R0GoH.js';
 import { I as ImageItem, A as ActionConfig, j as SocialLinkItem, O as OptixFlowConfig } from './blocks-DyouPohq.js';
 import 'react/jsx-runtime';
+import './dynamic-icon.js';
+import '@page-speed/icon';
 import 'class-variance-authority';
 import '@page-speed/pressable';
 import '@opensite/hooks/usePlatformFromUrl';
@@ -41,6 +44,18 @@ interface LinkPageNewsletterSocialProps {
      * Avatar image URL (legacy)
      */
     avatarUrl?: string;
+    /**
+     * Optional LogoConfig for BrandLogo rendering (takes priority over avatar)
+     */
+    logo?: LogoConfig;
+    /**
+     * Custom slot for the logo/avatar (takes priority over logo and avatar)
+     */
+    logoSlot?: React.ReactNode;
+    /**
+     * Additional CSS classes for the logo image
+     */
+    logoClassName?: string;
     /**
      * Custom slot for profile header content
      */
@@ -239,6 +254,6 @@ interface LinkPageNewsletterSocialProps {
  * />
  * ```
  */
-declare function LinkPageNewsletterSocial({ sectionId, name, bio, avatar, avatarUrl, profileSlot, newsletterHeading, newsletterDescription, formEngineSetup, buttonAction, helperText, newsletterSlot, formSlot, links, linksSlot, linkChevronIcon, socialLinks, socialLinksSlot, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, bioClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, newsletterCardClassName, newsletterHeadingClassName, newsletterDescriptionClassName, linksClassName, linkClassName, linkIconClassName, linkLabelClassName, linkChevronClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, optixFlowConfig, }: LinkPageNewsletterSocialProps): React.JSX.Element;
+declare function LinkPageNewsletterSocial({ sectionId, name, bio, avatar, avatarUrl, logo, logoSlot, logoClassName, profileSlot, newsletterHeading, newsletterDescription, formEngineSetup, buttonAction, helperText, newsletterSlot, formSlot, links, linksSlot, linkChevronIcon, socialLinks, socialLinksSlot, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, bioClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, newsletterCardClassName, newsletterHeadingClassName, newsletterDescriptionClassName, linksClassName, linkClassName, linkIconClassName, linkLabelClassName, linkChevronClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, optixFlowConfig, }: LinkPageNewsletterSocialProps): React.JSX.Element;
 
 export { LinkPageNewsletterSocial, type LinkPageNewsletterSocialProps, type NewsletterSocialLink, type NewsletterSocialSocialLink };

package/dist/link-page-newsletter-social.js

@@ -491,6 +491,47 @@ var SocialLinkIcon = React4.forwardRef(
   }
 );
 SocialLinkIcon.displayName = "SocialLinkIcon";
+var SIZE_CLASSES = {
+  sm: "max-h-6 sm:max-h-7",
+  md: "max-h-8 sm:max-h-9 lg:max-h-10",
+  lg: "max-h-10 sm:max-h-12 lg:max-h-14",
+  xl: "max-h-12 sm:max-h-14 lg:max-h-16"
+};
+var BrandLogo = ({
+  logo,
+  logoSlot,
+  logoClassName,
+  size = "md",
+  optixFlowConfig
+}) => {
+  if (logoSlot) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot });
+  if (!logo || !logo.src) return null;
+  const imgElement = /* @__PURE__ */ jsx(
+    Img,
+    {
+      src: logo.src,
+      className: cn(
+        "w-auto object-contain",
+        SIZE_CLASSES[size],
+        logo.className
+      ),
+      alt: logo.alt || "Logo",
+      optixFlowConfig,
+      loading: "eager"
+    }
+  );
+  if (logo.url) {
+    return /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        href: logo.url,
+        className: cn("flex items-center", logoClassName),
+        children: imgElement
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
+};
 var DEFAULT_STYLE_RULES = {
   formContainer: "w-full flex flex-col gap-3 justify-center items-center",
   fieldsContainer: "",
@@ -513,6 +554,9 @@ function LinkPageNewsletterSocial({
   bio,
   avatar,
   avatarUrl,
+  logo,
+  logoSlot,
+  logoClassName,
   profileSlot,
   newsletterHeading,
   newsletterDescription,
@@ -569,14 +613,23 @@ function LinkPageNewsletterSocial({
           headerClassName
         ),
         children: [
-          resolvedAvatar && /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx(
             "div",
             {
               className: cn(
                 "flex h-24 w-full max-w-72 items-center justify-center",
                 avatarClassName
               ),
-              children: /* @__PURE__ */ jsx(
+              children: logo ? /* @__PURE__ */ jsx(
+                BrandLogo,
+                {
+                  logo,
+                  logoSlot,
+                  size: "xl",
+                  logoClassName: cn("mb-2", logoClassName),
+                  optixFlowConfig
+                }
+              ) : logoSlot ? logoSlot : resolvedAvatar ? /* @__PURE__ */ jsx(
                 Img,
                 {
                   src: resolvedAvatar.src,
@@ -584,7 +637,7 @@ function LinkPageNewsletterSocial({
                   className: "h-auto max-h-24 w-auto max-w-full object-contain",
                   optixFlowConfig
                 }
-              )
+              ) : null
             }
           ),
           /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
@@ -596,6 +649,9 @@ function LinkPageNewsletterSocial({
     );
   }, [
     profileSlot,
+    logo,
+    logoSlot,
+    logoClassName,
     avatar,
     avatarUrl,
     avatarClassName,

package/dist/link-tree-block.cjs

@@ -547,6 +547,47 @@ var SocialLinkIcon = React5__namespace.forwardRef(
   }
 );
 SocialLinkIcon.displayName = "SocialLinkIcon";
+var SIZE_CLASSES = {
+  sm: "max-h-6 sm:max-h-7",
+  md: "max-h-8 sm:max-h-9 lg:max-h-10",
+  lg: "max-h-10 sm:max-h-12 lg:max-h-14",
+  xl: "max-h-12 sm:max-h-14 lg:max-h-16"
+};
+var BrandLogo = ({
+  logo,
+  logoSlot,
+  logoClassName,
+  size = "md",
+  optixFlowConfig
+}) => {
+  if (logoSlot) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot });
+  if (!logo || !logo.src) return null;
+  const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
+    img.Img,
+    {
+      src: logo.src,
+      className: cn(
+        "w-auto object-contain",
+        SIZE_CLASSES[size],
+        logo.className
+      ),
+      alt: logo.alt || "Logo",
+      optixFlowConfig,
+      loading: "eager"
+    }
+  );
+  if (logo.url) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      pressable.Pressable,
+      {
+        href: logo.url,
+        className: cn("flex items-center", logoClassName),
+        children: imgElement
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
+};
 function LinkTreeBlock({
   sectionId = "link-tree-block",
   brandName,
@@ -556,6 +597,9 @@ function LinkTreeBlock({
   brandVerified = false,
   verifiedIcon,
   brandSlot,
+  logo,
+  logoSlot,
+  logoClassName,
   links,
   linksSlot,
   socialLinks,
@@ -652,7 +696,16 @@ function LinkTreeBlock({
                   "flex h-24 w-full max-w-72 items-center justify-center",
                   avatarClassName
                 ),
-                children: resolvedAvatar && /* @__PURE__ */ jsxRuntime.jsx(
+                children: logo ? /* @__PURE__ */ jsxRuntime.jsx(
+                  BrandLogo,
+                  {
+                    logo,
+                    logoSlot,
+                    size: "xl",
+                    logoClassName: cn("mb-2", logoClassName),
+                    optixFlowConfig
+                  }
+                ) : logoSlot ? logoSlot : resolvedAvatar ? /* @__PURE__ */ jsxRuntime.jsx(
                   img.Img,
                   {
                     src: resolvedAvatar.src,
@@ -660,7 +713,7 @@ function LinkTreeBlock({
                     className: "h-auto max-h-24 w-auto max-w-full object-contain",
                     optixFlowConfig
                   }
-                )
+                ) : null
               }
             ),
             brandVerified && /* @__PURE__ */ jsxRuntime.jsx(
@@ -710,6 +763,9 @@ function LinkTreeBlock({
     brandSlot,
     headerClassName,
     avatarClassName,
+    logo,
+    logoSlot,
+    logoClassName,
     resolvedAvatar,
     optixFlowConfig,
     brandVerified,

package/dist/link-tree-block.d.cts

@@ -1,7 +1,10 @@
 import * as React from 'react';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Cgd-IXlI.cjs';
+import { L as LogoConfig } from './types-mWZcgKth.cjs';
 import { I as ImageItem, A as ActionConfig, j as SocialLinkItem, O as OptixFlowConfig } from './blocks-DyouPohq.cjs';
 import 'react/jsx-runtime';
+import './dynamic-icon.cjs';
+import '@page-speed/icon';
 import 'class-variance-authority';
 import '@page-speed/pressable';
 import '@opensite/hooks/usePlatformFromUrl';
@@ -69,6 +72,18 @@ interface LinkTreeBlockProps {
      * Custom slot for rendering brand header
      */
     brandSlot?: React.ReactNode;
+    /**
+     * Optional LogoConfig for BrandLogo rendering (takes priority over avatar)
+     */
+    logo?: LogoConfig;
+    /**
+     * Custom slot for the logo/avatar (takes priority over logo and avatar)
+     */
+    logoSlot?: React.ReactNode;
+    /**
+     * Additional CSS classes for the logo image
+     */
+    logoClassName?: string;
     /**
      * Array of links to display
      */
@@ -288,6 +303,6 @@ interface LinkTreeBlockProps {
  * />
  * ```
  */
-declare function LinkTreeBlock({ sectionId, brandName, brandTagline, brandLogo, brandAvatar, brandVerified, verifiedIcon, brandSlot, links, linksSlot, socialLinks, socialLinksSlot, mediaGallery, mediaGallerySlot, mediaGalleryTitle, mediaGalleryLimit, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, taglineClassName, verifiedBadgeClassName, verifiedIconClassName, linksClassName, linkClassName, featuredLinkClassName, linkIconClassName, linkLabelClassName, linkDescriptionClassName, linkBadgeClassName, linkChevronClassName, mediaGalleryClassName, mediaGalleryTitleClassName, mediaGalleryGridClassName, mediaGalleryItemClassName, mediaGalleryMediaClassName, mediaGalleryOverlayClassName, mediaGalleryPlayIconClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, backgroundPattern, optixFlowConfig, }: LinkTreeBlockProps): React.JSX.Element;
+declare function LinkTreeBlock({ sectionId, brandName, brandTagline, brandLogo, brandAvatar, brandVerified, verifiedIcon, brandSlot, logo, logoSlot, logoClassName, links, linksSlot, socialLinks, socialLinksSlot, mediaGallery, mediaGallerySlot, mediaGalleryTitle, mediaGalleryLimit, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, taglineClassName, verifiedBadgeClassName, verifiedIconClassName, linksClassName, linkClassName, featuredLinkClassName, linkIconClassName, linkLabelClassName, linkDescriptionClassName, linkBadgeClassName, linkChevronClassName, mediaGalleryClassName, mediaGalleryTitleClassName, mediaGalleryGridClassName, mediaGalleryItemClassName, mediaGalleryMediaClassName, mediaGalleryOverlayClassName, mediaGalleryPlayIconClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, backgroundPattern, optixFlowConfig, }: LinkTreeBlockProps): React.JSX.Element;
 
 export { LinkTreeBlock, type LinkTreeBlockProps, type LinkTreeLink, type MediaGalleryItem, type SocialLink };

package/dist/link-tree-block.d.ts

@@ -1,7 +1,10 @@
 import * as React from 'react';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Dud0DKXB.js';
+import { L as LogoConfig } from './types-hJ2R0GoH.js';
 import { I as ImageItem, A as ActionConfig, j as SocialLinkItem, O as OptixFlowConfig } from './blocks-DyouPohq.js';
 import 'react/jsx-runtime';
+import './dynamic-icon.js';
+import '@page-speed/icon';
 import 'class-variance-authority';
 import '@page-speed/pressable';
 import '@opensite/hooks/usePlatformFromUrl';
@@ -69,6 +72,18 @@ interface LinkTreeBlockProps {
      * Custom slot for rendering brand header
      */
     brandSlot?: React.ReactNode;
+    /**
+     * Optional LogoConfig for BrandLogo rendering (takes priority over avatar)
+     */
+    logo?: LogoConfig;
+    /**
+     * Custom slot for the logo/avatar (takes priority over logo and avatar)
+     */
+    logoSlot?: React.ReactNode;
+    /**
+     * Additional CSS classes for the logo image
+     */
+    logoClassName?: string;
     /**
      * Array of links to display
      */
@@ -288,6 +303,6 @@ interface LinkTreeBlockProps {
  * />
  * ```
  */
-declare function LinkTreeBlock({ sectionId, brandName, brandTagline, brandLogo, brandAvatar, brandVerified, verifiedIcon, brandSlot, links, linksSlot, socialLinks, socialLinksSlot, mediaGallery, mediaGallerySlot, mediaGalleryTitle, mediaGalleryLimit, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, taglineClassName, verifiedBadgeClassName, verifiedIconClassName, linksClassName, linkClassName, featuredLinkClassName, linkIconClassName, linkLabelClassName, linkDescriptionClassName, linkBadgeClassName, linkChevronClassName, mediaGalleryClassName, mediaGalleryTitleClassName, mediaGalleryGridClassName, mediaGalleryItemClassName, mediaGalleryMediaClassName, mediaGalleryOverlayClassName, mediaGalleryPlayIconClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, backgroundPattern, optixFlowConfig, }: LinkTreeBlockProps): React.JSX.Element;
+declare function LinkTreeBlock({ sectionId, brandName, brandTagline, brandLogo, brandAvatar, brandVerified, verifiedIcon, brandSlot, logo, logoSlot, logoClassName, links, linksSlot, socialLinks, socialLinksSlot, mediaGallery, mediaGallerySlot, mediaGalleryTitle, mediaGalleryLimit, footerAction, footerSlot, className, contentClassName, headerClassName, avatarClassName, nameClassName, taglineClassName, verifiedBadgeClassName, verifiedIconClassName, linksClassName, linkClassName, featuredLinkClassName, linkIconClassName, linkLabelClassName, linkDescriptionClassName, linkBadgeClassName, linkChevronClassName, mediaGalleryClassName, mediaGalleryTitleClassName, mediaGalleryGridClassName, mediaGalleryItemClassName, mediaGalleryMediaClassName, mediaGalleryOverlayClassName, mediaGalleryPlayIconClassName, socialLinksClassName, socialLinkClassName, socialIconClassName, footerClassName, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, backgroundPattern, optixFlowConfig, }: LinkTreeBlockProps): React.JSX.Element;
 
 export { LinkTreeBlock, type LinkTreeBlockProps, type LinkTreeLink, type MediaGalleryItem, type SocialLink };

package/dist/link-tree-block.js

@@ -526,6 +526,47 @@ var SocialLinkIcon = React5.forwardRef(
   }
 );
 SocialLinkIcon.displayName = "SocialLinkIcon";
+var SIZE_CLASSES = {
+  sm: "max-h-6 sm:max-h-7",
+  md: "max-h-8 sm:max-h-9 lg:max-h-10",
+  lg: "max-h-10 sm:max-h-12 lg:max-h-14",
+  xl: "max-h-12 sm:max-h-14 lg:max-h-16"
+};
+var BrandLogo = ({
+  logo,
+  logoSlot,
+  logoClassName,
+  size = "md",
+  optixFlowConfig
+}) => {
+  if (logoSlot) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot });
+  if (!logo || !logo.src) return null;
+  const imgElement = /* @__PURE__ */ jsx(
+    Img,
+    {
+      src: logo.src,
+      className: cn(
+        "w-auto object-contain",
+        SIZE_CLASSES[size],
+        logo.className
+      ),
+      alt: logo.alt || "Logo",
+      optixFlowConfig,
+      loading: "eager"
+    }
+  );
+  if (logo.url) {
+    return /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        href: logo.url,
+        className: cn("flex items-center", logoClassName),
+        children: imgElement
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
+};
 function LinkTreeBlock({
   sectionId = "link-tree-block",
   brandName,
@@ -535,6 +576,9 @@ function LinkTreeBlock({
   brandVerified = false,
   verifiedIcon,
   brandSlot,
+  logo,
+  logoSlot,
+  logoClassName,
   links,
   linksSlot,
   socialLinks,
@@ -631,7 +675,16 @@ function LinkTreeBlock({
                   "flex h-24 w-full max-w-72 items-center justify-center",
                   avatarClassName
                 ),
-                children: resolvedAvatar && /* @__PURE__ */ jsx(
+                children: logo ? /* @__PURE__ */ jsx(
+                  BrandLogo,
+                  {
+                    logo,
+                    logoSlot,
+                    size: "xl",
+                    logoClassName: cn("mb-2", logoClassName),
+                    optixFlowConfig
+                  }
+                ) : logoSlot ? logoSlot : resolvedAvatar ? /* @__PURE__ */ jsx(
                   Img,
                   {
                     src: resolvedAvatar.src,
@@ -639,7 +692,7 @@ function LinkTreeBlock({
                     className: "h-auto max-h-24 w-auto max-w-full object-contain",
                     optixFlowConfig
                   }
-                )
+                ) : null
               }
             ),
             brandVerified && /* @__PURE__ */ jsx(
@@ -689,6 +742,9 @@ function LinkTreeBlock({
     brandSlot,
     headerClassName,
     avatarClassName,
+    logo,
+    logoSlot,
+    logoClassName,
     resolvedAvatar,
     optixFlowConfig,
     brandVerified,