@opensite/ui 3.6.7 → 3.6.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -535,8 +535,53 @@ function ActionComponent({ action }) {
535
535
  }
536
536
  );
537
537
  }
538
+ var SIZE_CLASSES = {
539
+ sm: "max-h-6 sm:max-h-7",
540
+ md: "max-h-8 sm:max-h-9 lg:max-h-10",
541
+ lg: "max-h-10 sm:max-h-12 lg:max-h-14",
542
+ xl: "max-h-12 sm:max-h-14 lg:max-h-16"
543
+ };
544
+ var BrandLogo = ({
545
+ logo,
546
+ logoSlot,
547
+ logoClassName,
548
+ size = "md",
549
+ optixFlowConfig
550
+ }) => {
551
+ if (logoSlot) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot });
552
+ if (!logo || !logo.src) return null;
553
+ const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
554
+ img.Img,
555
+ {
556
+ src: logo.src,
557
+ className: cn(
558
+ "w-auto object-contain",
559
+ SIZE_CLASSES[size],
560
+ logo.className
561
+ ),
562
+ alt: logo.alt || "Logo",
563
+ optixFlowConfig,
564
+ loading: "eager"
565
+ }
566
+ );
567
+ if (logo.url) {
568
+ return /* @__PURE__ */ jsxRuntime.jsx(
569
+ pressable.Pressable,
570
+ {
571
+ href: logo.url,
572
+ className: cn("flex items-center", logoClassName),
573
+ children: imgElement
574
+ }
575
+ );
576
+ }
577
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
578
+ };
579
+ var brand_logo_default = BrandLogo;
538
580
  function HeroFloatingImages({
539
581
  sectionId = "hero-floating-images",
582
+ logo,
583
+ logoSlot,
584
+ logoClassName,
540
585
  badge,
541
586
  badgeIcon,
542
587
  heading,
@@ -698,7 +743,7 @@ function HeroFloatingImages({
698
743
  "absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
699
744
  zoomIndicatorClassName
700
745
  ),
701
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-background/90 shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: zoomIconName, size: 16 }) })
746
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: zoomIconName, size: 20 }) })
702
747
  }
703
748
  )
704
749
  ]
@@ -762,7 +807,7 @@ function HeroFloatingImages({
762
807
  badge && /* @__PURE__ */ jsxRuntime.jsxs(
763
808
  Badge,
764
809
  {
765
- variant: "secondary",
810
+ variant: "default",
766
811
  className: cn("mb-6 w-fit", badgeClassName),
767
812
  children: [
768
813
  badge,
@@ -770,11 +815,12 @@ function HeroFloatingImages({
770
815
  ]
771
816
  }
772
817
  ),
818
+ (logo || logoSlot) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-2 flex justify-start", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(brand_logo_default, { logo, logoSlot, size: "lg" }) }),
773
819
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
774
820
  "h1",
775
821
  {
776
822
  className: cn(
777
- "mb-6 text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl",
823
+ "mb-6 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-pretty",
778
824
  headingClassName
779
825
  ),
780
826
  children: heading
@@ -783,7 +829,10 @@ function HeroFloatingImages({
783
829
  description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
784
830
  "p",
785
831
  {
786
- className: cn("mb-8 max-w-lg text-lg", descriptionClassName),
832
+ className: cn(
833
+ "mb-8 max-w-lg text-lg text-balance",
834
+ descriptionClassName
835
+ ),
787
836
  children: description
788
837
  }
789
838
  ) : description),
@@ -1,7 +1,10 @@
1
1
  import * as React from 'react';
2
2
  import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Cgd-IXlI.cjs';
3
+ import { L as LogoConfig } from './types-mWZcgKth.cjs';
3
4
  import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DyouPohq.cjs';
4
5
  import 'react/jsx-runtime';
6
+ import './dynamic-icon.cjs';
7
+ import '@page-speed/icon';
5
8
  import 'class-variance-authority';
6
9
  import '@page-speed/pressable';
7
10
  import '@opensite/hooks/usePlatformFromUrl';
@@ -29,6 +32,19 @@ interface HeroFloatingImagesImage {
29
32
  className?: string;
30
33
  }
31
34
  interface HeroFloatingImagesProps {
35
+ /**
36
+ * Brand logo configuration — renders centered above the heading.
37
+ * LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
38
+ */
39
+ logo?: LogoConfig;
40
+ /**
41
+ * Custom slot for logo (overrides logo prop)
42
+ */
43
+ logoSlot?: React.ReactNode;
44
+ /**
45
+ * Additional CSS classes for the logo container
46
+ */
47
+ logoClassName?: string;
32
48
  /**
33
49
  * Badge content displayed above the heading
34
50
  */
@@ -171,6 +187,6 @@ interface HeroFloatingImagesProps {
171
187
  * />
172
188
  * ```
173
189
  */
174
- declare function HeroFloatingImages({ sectionId, badge, badgeIcon, heading, description, actions, actionsSlot, images, imagesSlot, zoomIconName, enableLightbox, background, pattern, patternOpacity, className, gridClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, galleryClassName, featuredImageClassName, secondaryImageClassName, imageClassName, zoomIndicatorClassName, optixFlowConfig, containerClassName, spacing, }: HeroFloatingImagesProps): React.JSX.Element;
190
+ declare function HeroFloatingImages({ sectionId, logo, logoSlot, logoClassName, badge, badgeIcon, heading, description, actions, actionsSlot, images, imagesSlot, zoomIconName, enableLightbox, background, pattern, patternOpacity, className, gridClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, galleryClassName, featuredImageClassName, secondaryImageClassName, imageClassName, zoomIndicatorClassName, optixFlowConfig, containerClassName, spacing, }: HeroFloatingImagesProps): React.JSX.Element;
175
191
 
176
192
  export { HeroFloatingImages, type HeroFloatingImagesProps };
@@ -1,7 +1,10 @@
1
1
  import * as React from 'react';
2
2
  import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-Dud0DKXB.js';
3
+ import { L as LogoConfig } from './types-hJ2R0GoH.js';
3
4
  import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DyouPohq.js';
4
5
  import 'react/jsx-runtime';
6
+ import './dynamic-icon.js';
7
+ import '@page-speed/icon';
5
8
  import 'class-variance-authority';
6
9
  import '@page-speed/pressable';
7
10
  import '@opensite/hooks/usePlatformFromUrl';
@@ -29,6 +32,19 @@ interface HeroFloatingImagesImage {
29
32
  className?: string;
30
33
  }
31
34
  interface HeroFloatingImagesProps {
35
+ /**
36
+ * Brand logo configuration — renders centered above the heading.
37
+ * LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
38
+ */
39
+ logo?: LogoConfig;
40
+ /**
41
+ * Custom slot for logo (overrides logo prop)
42
+ */
43
+ logoSlot?: React.ReactNode;
44
+ /**
45
+ * Additional CSS classes for the logo container
46
+ */
47
+ logoClassName?: string;
32
48
  /**
33
49
  * Badge content displayed above the heading
34
50
  */
@@ -171,6 +187,6 @@ interface HeroFloatingImagesProps {
171
187
  * />
172
188
  * ```
173
189
  */
174
- declare function HeroFloatingImages({ sectionId, badge, badgeIcon, heading, description, actions, actionsSlot, images, imagesSlot, zoomIconName, enableLightbox, background, pattern, patternOpacity, className, gridClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, galleryClassName, featuredImageClassName, secondaryImageClassName, imageClassName, zoomIndicatorClassName, optixFlowConfig, containerClassName, spacing, }: HeroFloatingImagesProps): React.JSX.Element;
190
+ declare function HeroFloatingImages({ sectionId, logo, logoSlot, logoClassName, badge, badgeIcon, heading, description, actions, actionsSlot, images, imagesSlot, zoomIconName, enableLightbox, background, pattern, patternOpacity, className, gridClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, galleryClassName, featuredImageClassName, secondaryImageClassName, imageClassName, zoomIndicatorClassName, optixFlowConfig, containerClassName, spacing, }: HeroFloatingImagesProps): React.JSX.Element;
175
191
 
176
192
  export { HeroFloatingImages, type HeroFloatingImagesProps };
@@ -514,8 +514,53 @@ function ActionComponent({ action }) {
514
514
  }
515
515
  );
516
516
  }
517
+ var SIZE_CLASSES = {
518
+ sm: "max-h-6 sm:max-h-7",
519
+ md: "max-h-8 sm:max-h-9 lg:max-h-10",
520
+ lg: "max-h-10 sm:max-h-12 lg:max-h-14",
521
+ xl: "max-h-12 sm:max-h-14 lg:max-h-16"
522
+ };
523
+ var BrandLogo = ({
524
+ logo,
525
+ logoSlot,
526
+ logoClassName,
527
+ size = "md",
528
+ optixFlowConfig
529
+ }) => {
530
+ if (logoSlot) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot });
531
+ if (!logo || !logo.src) return null;
532
+ const imgElement = /* @__PURE__ */ jsx(
533
+ Img,
534
+ {
535
+ src: logo.src,
536
+ className: cn(
537
+ "w-auto object-contain",
538
+ SIZE_CLASSES[size],
539
+ logo.className
540
+ ),
541
+ alt: logo.alt || "Logo",
542
+ optixFlowConfig,
543
+ loading: "eager"
544
+ }
545
+ );
546
+ if (logo.url) {
547
+ return /* @__PURE__ */ jsx(
548
+ Pressable,
549
+ {
550
+ href: logo.url,
551
+ className: cn("flex items-center", logoClassName),
552
+ children: imgElement
553
+ }
554
+ );
555
+ }
556
+ return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
557
+ };
558
+ var brand_logo_default = BrandLogo;
517
559
  function HeroFloatingImages({
518
560
  sectionId = "hero-floating-images",
561
+ logo,
562
+ logoSlot,
563
+ logoClassName,
519
564
  badge,
520
565
  badgeIcon,
521
566
  heading,
@@ -677,7 +722,7 @@ function HeroFloatingImages({
677
722
  "absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
678
723
  zoomIndicatorClassName
679
724
  ),
680
- children: /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-background/90 shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: zoomIconName, size: 16 }) })
725
+ children: /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: zoomIconName, size: 20 }) })
681
726
  }
682
727
  )
683
728
  ]
@@ -741,7 +786,7 @@ function HeroFloatingImages({
741
786
  badge && /* @__PURE__ */ jsxs(
742
787
  Badge,
743
788
  {
744
- variant: "secondary",
789
+ variant: "default",
745
790
  className: cn("mb-6 w-fit", badgeClassName),
746
791
  children: [
747
792
  badge,
@@ -749,11 +794,12 @@ function HeroFloatingImages({
749
794
  ]
750
795
  }
751
796
  ),
797
+ (logo || logoSlot) && /* @__PURE__ */ jsx("div", { className: cn("mb-2 flex justify-start", logoClassName), children: /* @__PURE__ */ jsx(brand_logo_default, { logo, logoSlot, size: "lg" }) }),
752
798
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
753
799
  "h1",
754
800
  {
755
801
  className: cn(
756
- "mb-6 text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl",
802
+ "mb-6 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-pretty",
757
803
  headingClassName
758
804
  ),
759
805
  children: heading
@@ -762,7 +808,10 @@ function HeroFloatingImages({
762
808
  description && (typeof description === "string" ? /* @__PURE__ */ jsx(
763
809
  "p",
764
810
  {
765
- className: cn("mb-8 max-w-lg text-lg", descriptionClassName),
811
+ className: cn(
812
+ "mb-8 max-w-lg text-lg text-balance",
813
+ descriptionClassName
814
+ ),
766
815
  children: description
767
816
  }
768
817
  ) : description),
@@ -541,7 +541,7 @@ function HeroOverlayCtaGrid({
541
541
  patternOpacity,
542
542
  className,
543
543
  containerClassName = "px-0 sm:px-0 lg:px-0 max-w-full relative z-10 h-screen w-screen flex justify-center items-center",
544
- contentClassName = "relative flex flex-col gap-12 px-6 pt-28 pb-6 md:pt-0 md:pb-0",
544
+ contentClassName = "relative flex flex-col gap-6 md:gap-12 px-6 pt-0 md:pt-28 pb-6 md:pt-0 md:pb-0 min-h-screen h-fit md:h-screen justify-end md:justify-center",
545
545
  headingClassName,
546
546
  descriptionClassName,
547
547
  optixFlowConfig
@@ -520,7 +520,7 @@ function HeroOverlayCtaGrid({
520
520
  patternOpacity,
521
521
  className,
522
522
  containerClassName = "px-0 sm:px-0 lg:px-0 max-w-full relative z-10 h-screen w-screen flex justify-center items-center",
523
- contentClassName = "relative flex flex-col gap-12 px-6 pt-28 pb-6 md:pt-0 md:pb-0",
523
+ contentClassName = "relative flex flex-col gap-6 md:gap-12 px-6 pt-0 md:pt-28 pb-6 md:pt-0 md:pb-0 min-h-screen h-fit md:h-screen justify-end md:justify-center",
524
524
  headingClassName,
525
525
  descriptionClassName,
526
526
  optixFlowConfig
package/dist/registry.cjs CHANGED
@@ -49522,7 +49522,7 @@ function HeroOverlayCtaGrid({
49522
49522
  patternOpacity,
49523
49523
  className,
49524
49524
  containerClassName = "px-0 sm:px-0 lg:px-0 max-w-full relative z-10 h-screen w-screen flex justify-center items-center",
49525
- contentClassName = "relative flex flex-col gap-12 px-6 pt-28 pb-6 md:pt-0 md:pb-0",
49525
+ contentClassName = "relative flex flex-col gap-6 md:gap-12 px-6 pt-0 md:pt-28 pb-6 md:pt-0 md:pb-0 min-h-screen h-fit md:h-screen justify-end md:justify-center",
49526
49526
  headingClassName,
49527
49527
  descriptionClassName,
49528
49528
  optixFlowConfig
@@ -49768,8 +49768,53 @@ function HeroSplitIconCards({
49768
49768
  }
49769
49769
  );
49770
49770
  }
49771
+ var SIZE_CLASSES = {
49772
+ sm: "max-h-6 sm:max-h-7",
49773
+ md: "max-h-8 sm:max-h-9 lg:max-h-10",
49774
+ lg: "max-h-10 sm:max-h-12 lg:max-h-14",
49775
+ xl: "max-h-12 sm:max-h-14 lg:max-h-16"
49776
+ };
49777
+ var BrandLogo = ({
49778
+ logo,
49779
+ logoSlot: logoSlot2,
49780
+ logoClassName,
49781
+ size = "md",
49782
+ optixFlowConfig
49783
+ }) => {
49784
+ if (logoSlot2) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot2 });
49785
+ if (!logo || !logo.src) return null;
49786
+ const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
49787
+ img$1.Img,
49788
+ {
49789
+ src: logo.src,
49790
+ className: cn(
49791
+ "w-auto object-contain",
49792
+ SIZE_CLASSES[size],
49793
+ logo.className
49794
+ ),
49795
+ alt: logo.alt || "Logo",
49796
+ optixFlowConfig,
49797
+ loading: "eager"
49798
+ }
49799
+ );
49800
+ if (logo.url) {
49801
+ return /* @__PURE__ */ jsxRuntime.jsx(
49802
+ pressable.Pressable,
49803
+ {
49804
+ href: logo.url,
49805
+ className: cn("flex items-center", logoClassName),
49806
+ children: imgElement
49807
+ }
49808
+ );
49809
+ }
49810
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
49811
+ };
49812
+ var brand_logo_default = BrandLogo;
49771
49813
  function HeroFloatingImages({
49772
49814
  sectionId = "hero-floating-images",
49815
+ logo,
49816
+ logoSlot: logoSlot2,
49817
+ logoClassName,
49773
49818
  badge,
49774
49819
  badgeIcon,
49775
49820
  heading,
@@ -49931,7 +49976,7 @@ function HeroFloatingImages({
49931
49976
  "absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
49932
49977
  zoomIndicatorClassName
49933
49978
  ),
49934
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-background/90 shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: zoomIconName, size: 16 }) })
49979
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: zoomIconName, size: 20 }) })
49935
49980
  }
49936
49981
  )
49937
49982
  ]
@@ -49995,7 +50040,7 @@ function HeroFloatingImages({
49995
50040
  badge && /* @__PURE__ */ jsxRuntime.jsxs(
49996
50041
  Badge,
49997
50042
  {
49998
- variant: "secondary",
50043
+ variant: "default",
49999
50044
  className: cn("mb-6 w-fit", badgeClassName),
50000
50045
  children: [
50001
50046
  badge,
@@ -50003,11 +50048,12 @@ function HeroFloatingImages({
50003
50048
  ]
50004
50049
  }
50005
50050
  ),
50051
+ (logo || logoSlot2) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-2 flex justify-start", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(brand_logo_default, { logo, logoSlot: logoSlot2, size: "lg" }) }),
50006
50052
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
50007
50053
  "h1",
50008
50054
  {
50009
50055
  className: cn(
50010
- "mb-6 text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl",
50056
+ "mb-6 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-pretty",
50011
50057
  headingClassName
50012
50058
  ),
50013
50059
  children: heading
@@ -50016,7 +50062,10 @@ function HeroFloatingImages({
50016
50062
  description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
50017
50063
  "p",
50018
50064
  {
50019
- className: cn("mb-8 max-w-lg text-lg", descriptionClassName),
50065
+ className: cn(
50066
+ "mb-8 max-w-lg text-lg text-balance",
50067
+ descriptionClassName
50068
+ ),
50020
50069
  children: description
50021
50070
  }
50022
50071
  ) : description),
@@ -53027,47 +53076,6 @@ function HeroGridPatternEfficiency({
53027
53076
  }
53028
53077
  );
53029
53078
  }
53030
- var SIZE_CLASSES = {
53031
- sm: "max-h-6 sm:max-h-7",
53032
- md: "max-h-8 sm:max-h-9 lg:max-h-10",
53033
- lg: "max-h-10 sm:max-h-12 lg:max-h-14",
53034
- xl: "max-h-12 sm:max-h-14 lg:max-h-16"
53035
- };
53036
- var BrandLogo = ({
53037
- logo,
53038
- logoSlot: logoSlot2,
53039
- logoClassName,
53040
- size = "md",
53041
- optixFlowConfig
53042
- }) => {
53043
- if (logoSlot2) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot2 });
53044
- if (!logo || !logo.src) return null;
53045
- const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
53046
- img$1.Img,
53047
- {
53048
- src: logo.src,
53049
- className: cn(
53050
- "w-auto object-contain",
53051
- SIZE_CLASSES[size],
53052
- logo.className
53053
- ),
53054
- alt: logo.alt || "Logo",
53055
- optixFlowConfig,
53056
- loading: "eager"
53057
- }
53058
- );
53059
- if (logo.url) {
53060
- return /* @__PURE__ */ jsxRuntime.jsx(
53061
- pressable.Pressable,
53062
- {
53063
- href: logo.url,
53064
- className: cn("flex items-center", logoClassName),
53065
- children: imgElement
53066
- }
53067
- );
53068
- }
53069
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
53070
- };
53071
53079
  function HeroDashedBorderFeatures({
53072
53080
  sectionId = "hero-dashed-border-features",
53073
53081
  logo,
package/dist/registry.js CHANGED
@@ -49482,7 +49482,7 @@ function HeroOverlayCtaGrid({
49482
49482
  patternOpacity,
49483
49483
  className,
49484
49484
  containerClassName = "px-0 sm:px-0 lg:px-0 max-w-full relative z-10 h-screen w-screen flex justify-center items-center",
49485
- contentClassName = "relative flex flex-col gap-12 px-6 pt-28 pb-6 md:pt-0 md:pb-0",
49485
+ contentClassName = "relative flex flex-col gap-6 md:gap-12 px-6 pt-0 md:pt-28 pb-6 md:pt-0 md:pb-0 min-h-screen h-fit md:h-screen justify-end md:justify-center",
49486
49486
  headingClassName,
49487
49487
  descriptionClassName,
49488
49488
  optixFlowConfig
@@ -49728,8 +49728,53 @@ function HeroSplitIconCards({
49728
49728
  }
49729
49729
  );
49730
49730
  }
49731
+ var SIZE_CLASSES = {
49732
+ sm: "max-h-6 sm:max-h-7",
49733
+ md: "max-h-8 sm:max-h-9 lg:max-h-10",
49734
+ lg: "max-h-10 sm:max-h-12 lg:max-h-14",
49735
+ xl: "max-h-12 sm:max-h-14 lg:max-h-16"
49736
+ };
49737
+ var BrandLogo = ({
49738
+ logo,
49739
+ logoSlot: logoSlot2,
49740
+ logoClassName,
49741
+ size = "md",
49742
+ optixFlowConfig
49743
+ }) => {
49744
+ if (logoSlot2) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot2 });
49745
+ if (!logo || !logo.src) return null;
49746
+ const imgElement = /* @__PURE__ */ jsx(
49747
+ Img,
49748
+ {
49749
+ src: logo.src,
49750
+ className: cn(
49751
+ "w-auto object-contain",
49752
+ SIZE_CLASSES[size],
49753
+ logo.className
49754
+ ),
49755
+ alt: logo.alt || "Logo",
49756
+ optixFlowConfig,
49757
+ loading: "eager"
49758
+ }
49759
+ );
49760
+ if (logo.url) {
49761
+ return /* @__PURE__ */ jsx(
49762
+ Pressable,
49763
+ {
49764
+ href: logo.url,
49765
+ className: cn("flex items-center", logoClassName),
49766
+ children: imgElement
49767
+ }
49768
+ );
49769
+ }
49770
+ return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
49771
+ };
49772
+ var brand_logo_default = BrandLogo;
49731
49773
  function HeroFloatingImages({
49732
49774
  sectionId = "hero-floating-images",
49775
+ logo,
49776
+ logoSlot: logoSlot2,
49777
+ logoClassName,
49733
49778
  badge,
49734
49779
  badgeIcon,
49735
49780
  heading,
@@ -49891,7 +49936,7 @@ function HeroFloatingImages({
49891
49936
  "absolute inset-0 flex items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
49892
49937
  zoomIndicatorClassName
49893
49938
  ),
49894
- children: /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-background/90 shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: zoomIconName, size: 16 }) })
49939
+ children: /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: zoomIconName, size: 20 }) })
49895
49940
  }
49896
49941
  )
49897
49942
  ]
@@ -49955,7 +50000,7 @@ function HeroFloatingImages({
49955
50000
  badge && /* @__PURE__ */ jsxs(
49956
50001
  Badge,
49957
50002
  {
49958
- variant: "secondary",
50003
+ variant: "default",
49959
50004
  className: cn("mb-6 w-fit", badgeClassName),
49960
50005
  children: [
49961
50006
  badge,
@@ -49963,11 +50008,12 @@ function HeroFloatingImages({
49963
50008
  ]
49964
50009
  }
49965
50010
  ),
50011
+ (logo || logoSlot2) && /* @__PURE__ */ jsx("div", { className: cn("mb-2 flex justify-start", logoClassName), children: /* @__PURE__ */ jsx(brand_logo_default, { logo, logoSlot: logoSlot2, size: "lg" }) }),
49966
50012
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
49967
50013
  "h1",
49968
50014
  {
49969
50015
  className: cn(
49970
- "mb-6 text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl",
50016
+ "mb-6 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-pretty",
49971
50017
  headingClassName
49972
50018
  ),
49973
50019
  children: heading
@@ -49976,7 +50022,10 @@ function HeroFloatingImages({
49976
50022
  description && (typeof description === "string" ? /* @__PURE__ */ jsx(
49977
50023
  "p",
49978
50024
  {
49979
- className: cn("mb-8 max-w-lg text-lg", descriptionClassName),
50025
+ className: cn(
50026
+ "mb-8 max-w-lg text-lg text-balance",
50027
+ descriptionClassName
50028
+ ),
49980
50029
  children: description
49981
50030
  }
49982
50031
  ) : description),
@@ -52987,47 +53036,6 @@ function HeroGridPatternEfficiency({
52987
53036
  }
52988
53037
  );
52989
53038
  }
52990
- var SIZE_CLASSES = {
52991
- sm: "max-h-6 sm:max-h-7",
52992
- md: "max-h-8 sm:max-h-9 lg:max-h-10",
52993
- lg: "max-h-10 sm:max-h-12 lg:max-h-14",
52994
- xl: "max-h-12 sm:max-h-14 lg:max-h-16"
52995
- };
52996
- var BrandLogo = ({
52997
- logo,
52998
- logoSlot: logoSlot2,
52999
- logoClassName,
53000
- size = "md",
53001
- optixFlowConfig
53002
- }) => {
53003
- if (logoSlot2) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot2 });
53004
- if (!logo || !logo.src) return null;
53005
- const imgElement = /* @__PURE__ */ jsx(
53006
- Img,
53007
- {
53008
- src: logo.src,
53009
- className: cn(
53010
- "w-auto object-contain",
53011
- SIZE_CLASSES[size],
53012
- logo.className
53013
- ),
53014
- alt: logo.alt || "Logo",
53015
- optixFlowConfig,
53016
- loading: "eager"
53017
- }
53018
- );
53019
- if (logo.url) {
53020
- return /* @__PURE__ */ jsx(
53021
- Pressable,
53022
- {
53023
- href: logo.url,
53024
- className: cn("flex items-center", logoClassName),
53025
- children: imgElement
53026
- }
53027
- );
53028
- }
53029
- return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
53030
- };
53031
53039
  function HeroDashedBorderFeatures({
53032
53040
  sectionId = "hero-dashed-border-features",
53033
53041
  logo,
@@ -77,6 +77,6 @@ interface SocialLinkIconProps extends Omit<PressableProps, "children">, SocialLi
77
77
  * />
78
78
  * ```
79
79
  */
80
- declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement>>;
80
+ declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
81
81
 
82
82
  export { SocialLinkIcon, type SocialLinkIconDynamicIconProps, type SocialLinkIconProps };
@@ -77,6 +77,6 @@ interface SocialLinkIconProps extends Omit<PressableProps, "children">, SocialLi
77
77
  * />
78
78
  * ```
79
79
  */
80
- declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement>>;
80
+ declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
81
81
 
82
82
  export { SocialLinkIcon, type SocialLinkIconDynamicIconProps, type SocialLinkIconProps };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opensite/ui",
3
- "version": "3.6.7",
3
+ "version": "3.6.8",
4
4
  "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
5
5
  "keywords": [
6
6
  "react",