@opensite/ui 3.7.8 → 3.8.0

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.
Files changed (13) hide show
  1. package/dist/blog-cards-tagline-cta.cjs +52 -59
  2. package/dist/blog-cards-tagline-cta.d.cts +1 -1
  3. package/dist/blog-cards-tagline-cta.d.ts +1 -1
  4. package/dist/blog-cards-tagline-cta.js +52 -59
  5. package/dist/blog-horizontal-cards.cjs +44 -29
  6. package/dist/blog-horizontal-cards.js +44 -29
  7. package/dist/contact-demo.cjs +1 -1
  8. package/dist/contact-demo.js +1 -1
  9. package/dist/registry.cjs +103 -98
  10. package/dist/registry.js +103 -98
  11. package/dist/stats-bar-comparison.cjs +6 -39
  12. package/dist/stats-bar-comparison.js +6 -39
  13. package/package.json +1 -1
package/dist/blog-cards-tagline-cta.cjs CHANGED
@@ -513,7 +513,6 @@ function BlogCardsTaglineCta({
513
513
  postsSlot,
514
514
  readMoreText,
515
515
  className,
516
- containerClassName,
517
516
  headerClassName,
518
517
  badgeClassName,
519
518
  headingClassName,
@@ -523,7 +522,8 @@ function BlogCardsTaglineCta({
523
522
  postCardClassName,
524
523
  optixFlowConfig,
525
524
  background,
526
- spacing,
525
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
526
+ spacing = "lg",
527
527
  pattern,
528
528
  patternOpacity
529
529
  }) {
@@ -567,7 +567,7 @@ function BlogCardsTaglineCta({
567
567
  Card,
568
568
  {
569
569
  className: cn(
570
- "grid grid-rows-[auto_auto_1fr_auto] overflow-hidden pt-0",
570
+ "grid grid-rows-[auto_auto_1fr_auto] gap-4 overflow-hidden pt-0",
571
571
  postCardClassName
572
572
  ),
573
573
  children: [
@@ -582,13 +582,14 @@ function BlogCardsTaglineCta({
582
582
  src: post.image,
583
583
  alt: postTitle,
584
584
  className: "h-full w-full object-cover object-center",
585
- optixFlowConfig
585
+ optixFlowConfig,
586
+ loading: "eager"
586
587
  }
587
588
  )
588
589
  }
589
590
  ) }),
590
- /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: post.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold hover:underline md:text-xl", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: postHref, children: post.title }) }) }),
591
- /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: postSummary && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: postSummary }) }),
591
+ /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { className: post.image ? "pt-0" : "pt-6", children: post.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold hover:underline md:text-xl", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: postHref, children: post.title }) }) }),
592
+ /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: postSummary && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "opacity-70 line-clamp-4", children: postSummary }) }),
592
593
  /* @__PURE__ */ jsxRuntime.jsx(CardFooter, { children: readMoreText && /* @__PURE__ */ jsxRuntime.jsxs(
593
594
  pressable.Pressable,
594
595
  {
@@ -622,60 +623,52 @@ function BlogCardsTaglineCta({
622
623
  className: cn(className),
623
624
  pattern,
624
625
  patternOpacity,
625
- children: /* @__PURE__ */ jsxRuntime.jsxs(
626
- "div",
627
- {
628
- className: cn(
629
- "container mx-auto flex flex-col items-center gap-16 lg:px-16",
630
- containerClassName
631
- ),
632
- children: [
633
- /* @__PURE__ */ jsxRuntime.jsxs(
634
- "div",
635
- {
636
- className: cn(
637
- "text-center flex flex-col items-center px-4 md:px-0",
638
- headerClassName
639
- ),
640
- children: [
641
- badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", className: cn("mb-6", badgeClassName), children: badge }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-6", badgeClassName), children: badge })),
642
- heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
643
- "h2",
644
- {
645
- className: cn(
646
- "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-4xl lg:mb-6 lg:max-w-3xl lg:text-5xl",
647
- headingClassName
648
- ),
649
- children: heading
650
- }
651
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
652
- description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
653
- "p",
654
- {
655
- className: cn(
656
- "mb-8 text-muted-foreground md:text-base lg:max-w-2xl lg:text-lg text-balance",
657
- descriptionClassName
658
- ),
659
- children: description
660
- }
661
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
662
- ctaActionContent
663
- ]
664
- }
626
+ containerClassName,
627
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto flex flex-col items-center gap-16 lg:px-16", children: [
628
+ /* @__PURE__ */ jsxRuntime.jsxs(
629
+ "div",
630
+ {
631
+ className: cn(
632
+ "text-center flex flex-col items-center px-4 md:px-0",
633
+ headerClassName
665
634
  ),
666
- /* @__PURE__ */ jsxRuntime.jsx(
667
- "div",
668
- {
669
- className: cn(
670
- "grid gap-6 md:grid-cols-2 lg:grid-cols-3 lg:gap-8",
671
- postsClassName
672
- ),
673
- children: postsContent
674
- }
675
- )
676
- ]
677
- }
678
- )
635
+ children: [
636
+ badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
637
+ heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
638
+ "h2",
639
+ {
640
+ className: cn(
641
+ "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-4xl lg:mb-6 lg:max-w-3xl lg:text-5xl",
642
+ headingClassName
643
+ ),
644
+ children: heading
645
+ }
646
+ ) : heading),
647
+ description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
648
+ "p",
649
+ {
650
+ className: cn(
651
+ "mb-8 md:text-base max-w-full md:max-w-md lg:text-lg text-balance",
652
+ descriptionClassName
653
+ ),
654
+ children: description
655
+ }
656
+ ) : description),
657
+ ctaActionContent
658
+ ]
659
+ }
660
+ ),
661
+ /* @__PURE__ */ jsxRuntime.jsx(
662
+ "div",
663
+ {
664
+ className: cn(
665
+ "grid gap-6 md:grid-cols-2 lg:grid-cols-3 lg:gap-8",
666
+ postsClassName
667
+ ),
668
+ children: postsContent
669
+ }
670
+ )
671
+ ] })
679
672
  }
680
673
  );
681
674
  }
package/dist/blog-cards-tagline-cta.d.cts CHANGED
@@ -98,6 +98,6 @@ interface BlogCardsTaglineCtaProps {
98
98
  /** Optional Section ID */
99
99
  sectionId?: string;
100
100
  }
101
- declare function BlogCardsTaglineCta({ sectionId, badge, heading, description, ctaAction, ctaSlot, posts, postsSlot, readMoreText, className, containerClassName, headerClassName, badgeClassName, headingClassName, descriptionClassName, ctaClassName, postsClassName, postCardClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: BlogCardsTaglineCtaProps): React.JSX.Element;
101
+ declare function BlogCardsTaglineCta({ sectionId, badge, heading, description, ctaAction, ctaSlot, posts, postsSlot, readMoreText, className, headerClassName, badgeClassName, headingClassName, descriptionClassName, ctaClassName, postsClassName, postCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: BlogCardsTaglineCtaProps): React.JSX.Element;
102
102
 
103
103
  export { BlogCardsTaglineCta, type BlogCardsTaglineCtaProps };
package/dist/blog-cards-tagline-cta.d.ts CHANGED
@@ -98,6 +98,6 @@ interface BlogCardsTaglineCtaProps {
98
98
  /** Optional Section ID */
99
99
  sectionId?: string;
100
100
  }
101
- declare function BlogCardsTaglineCta({ sectionId, badge, heading, description, ctaAction, ctaSlot, posts, postsSlot, readMoreText, className, containerClassName, headerClassName, badgeClassName, headingClassName, descriptionClassName, ctaClassName, postsClassName, postCardClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: BlogCardsTaglineCtaProps): React.JSX.Element;
101
+ declare function BlogCardsTaglineCta({ sectionId, badge, heading, description, ctaAction, ctaSlot, posts, postsSlot, readMoreText, className, headerClassName, badgeClassName, headingClassName, descriptionClassName, ctaClassName, postsClassName, postCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: BlogCardsTaglineCtaProps): React.JSX.Element;
102
102
 
103
103
  export { BlogCardsTaglineCta, type BlogCardsTaglineCtaProps };
package/dist/blog-cards-tagline-cta.js CHANGED
@@ -492,7 +492,6 @@ function BlogCardsTaglineCta({
492
492
  postsSlot,
493
493
  readMoreText,
494
494
  className,
495
- containerClassName,
496
495
  headerClassName,
497
496
  badgeClassName,
498
497
  headingClassName,
@@ -502,7 +501,8 @@ function BlogCardsTaglineCta({
502
501
  postCardClassName,
503
502
  optixFlowConfig,
504
503
  background,
505
- spacing,
504
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
505
+ spacing = "lg",
506
506
  pattern,
507
507
  patternOpacity
508
508
  }) {
@@ -546,7 +546,7 @@ function BlogCardsTaglineCta({
546
546
  Card,
547
547
  {
548
548
  className: cn(
549
- "grid grid-rows-[auto_auto_1fr_auto] overflow-hidden pt-0",
549
+ "grid grid-rows-[auto_auto_1fr_auto] gap-4 overflow-hidden pt-0",
550
550
  postCardClassName
551
551
  ),
552
552
  children: [
@@ -561,13 +561,14 @@ function BlogCardsTaglineCta({
561
561
  src: post.image,
562
562
  alt: postTitle,
563
563
  className: "h-full w-full object-cover object-center",
564
- optixFlowConfig
564
+ optixFlowConfig,
565
+ loading: "eager"
565
566
  }
566
567
  )
567
568
  }
568
569
  ) }),
569
- /* @__PURE__ */ jsx(CardHeader, { children: post.title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold hover:underline md:text-xl", children: /* @__PURE__ */ jsx(Pressable, { href: postHref, children: post.title }) }) }),
570
- /* @__PURE__ */ jsx(CardContent, { children: postSummary && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: postSummary }) }),
570
+ /* @__PURE__ */ jsx(CardHeader, { className: post.image ? "pt-0" : "pt-6", children: post.title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold hover:underline md:text-xl", children: /* @__PURE__ */ jsx(Pressable, { href: postHref, children: post.title }) }) }),
571
+ /* @__PURE__ */ jsx(CardContent, { children: postSummary && /* @__PURE__ */ jsx("p", { className: "opacity-70 line-clamp-4", children: postSummary }) }),
571
572
  /* @__PURE__ */ jsx(CardFooter, { children: readMoreText && /* @__PURE__ */ jsxs(
572
573
  Pressable,
573
574
  {
@@ -601,60 +602,52 @@ function BlogCardsTaglineCta({
601
602
  className: cn(className),
602
603
  pattern,
603
604
  patternOpacity,
604
- children: /* @__PURE__ */ jsxs(
605
- "div",
606
- {
607
- className: cn(
608
- "container mx-auto flex flex-col items-center gap-16 lg:px-16",
609
- containerClassName
610
- ),
611
- children: [
612
- /* @__PURE__ */ jsxs(
613
- "div",
614
- {
615
- className: cn(
616
- "text-center flex flex-col items-center px-4 md:px-0",
617
- headerClassName
618
- ),
619
- children: [
620
- badge && (typeof badge === "string" ? /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: cn("mb-6", badgeClassName), children: badge }) : /* @__PURE__ */ jsx("div", { className: cn("mb-6", badgeClassName), children: badge })),
621
- heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
622
- "h2",
623
- {
624
- className: cn(
625
- "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-4xl lg:mb-6 lg:max-w-3xl lg:text-5xl",
626
- headingClassName
627
- ),
628
- children: heading
629
- }
630
- ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
631
- description && (typeof description === "string" ? /* @__PURE__ */ jsx(
632
- "p",
633
- {
634
- className: cn(
635
- "mb-8 text-muted-foreground md:text-base lg:max-w-2xl lg:text-lg text-balance",
636
- descriptionClassName
637
- ),
638
- children: description
639
- }
640
- ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
641
- ctaActionContent
642
- ]
643
- }
605
+ containerClassName,
606
+ children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex flex-col items-center gap-16 lg:px-16", children: [
607
+ /* @__PURE__ */ jsxs(
608
+ "div",
609
+ {
610
+ className: cn(
611
+ "text-center flex flex-col items-center px-4 md:px-0",
612
+ headerClassName
644
613
  ),
645
- /* @__PURE__ */ jsx(
646
- "div",
647
- {
648
- className: cn(
649
- "grid gap-6 md:grid-cols-2 lg:grid-cols-3 lg:gap-8",
650
- postsClassName
651
- ),
652
- children: postsContent
653
- }
654
- )
655
- ]
656
- }
657
- )
614
+ children: [
615
+ badge && (typeof badge === "string" ? /* @__PURE__ */ jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
616
+ heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
617
+ "h2",
618
+ {
619
+ className: cn(
620
+ "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-4xl lg:mb-6 lg:max-w-3xl lg:text-5xl",
621
+ headingClassName
622
+ ),
623
+ children: heading
624
+ }
625
+ ) : heading),
626
+ description && (typeof description === "string" ? /* @__PURE__ */ jsx(
627
+ "p",
628
+ {
629
+ className: cn(
630
+ "mb-8 md:text-base max-w-full md:max-w-md lg:text-lg text-balance",
631
+ descriptionClassName
632
+ ),
633
+ children: description
634
+ }
635
+ ) : description),
636
+ ctaActionContent
637
+ ]
638
+ }
639
+ ),
640
+ /* @__PURE__ */ jsx(
641
+ "div",
642
+ {
643
+ className: cn(
644
+ "grid gap-6 md:grid-cols-2 lg:grid-cols-3 lg:gap-8",
645
+ postsClassName
646
+ ),
647
+ children: postsContent
648
+ }
649
+ )
650
+ ] })
658
651
  }
659
652
  );
660
653
  }
package/dist/blog-horizontal-cards.cjs CHANGED
@@ -541,11 +541,11 @@ function BlogHorizontalCards({
541
541
  )
542
542
  }
543
543
  ) }),
544
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-3", children: [
545
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 text-sm opacity-70", children: [
544
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-4", children: [
545
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-start items-center gap-3 md:gap-4 text-sm flex-wrap", children: [
546
546
  postLabel && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: postLabel }),
547
- post.author && /* @__PURE__ */ jsxRuntime.jsx("span", { children: post.author }),
548
- postDate && /* @__PURE__ */ jsxRuntime.jsx("span", { children: postDate })
547
+ post.author && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: post.author }),
548
+ postDate && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-70", children: postDate })
549
549
  ] }),
550
550
  post.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl leading-tight font-bold lg:text-2xl", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: postHref, className: "hover:underline", children: post.title }) }),
551
551
  postSummary && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base opacity-70 line-clamp-3", children: postSummary }),
@@ -577,31 +577,46 @@ function BlogHorizontalCards({
577
577
  pattern,
578
578
  patternOpacity,
579
579
  containerClassName,
580
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
581
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto max-w-3xl text-center", headerClassName), children: [
582
- badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
583
- heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
584
- "h2",
585
- {
586
- className: cn(
587
- "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-5xl lg:mb-6",
588
- headingClassName
589
- ),
590
- children: heading
591
- }
592
- ) : heading),
593
- description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
594
- "p",
595
- {
596
- className: cn(
597
- "mb-12 opacity-70 md:text-base lg:text-lg text-balance",
598
- descriptionClassName
599
- ),
600
- children: description
601
- }
602
- ) : description)
603
- ] }),
604
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mx-auto max-w-5xl space-y-12", postsClassName), children: postsContent }),
580
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-6 md:gap-12", children: [
581
+ /* @__PURE__ */ jsxRuntime.jsxs(
582
+ "div",
583
+ {
584
+ className: cn("max-w-full md:max-w-3xl text-left", headerClassName),
585
+ children: [
586
+ badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
587
+ heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
588
+ "h2",
589
+ {
590
+ className: cn(
591
+ "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-5xl lg:mb-6",
592
+ headingClassName
593
+ ),
594
+ children: heading
595
+ }
596
+ ) : heading),
597
+ description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
598
+ "p",
599
+ {
600
+ className: cn(
601
+ "mb-12 opacity-70 md:text-base lg:text-lg text-balance",
602
+ descriptionClassName
603
+ ),
604
+ children: description
605
+ }
606
+ ) : description)
607
+ ]
608
+ }
609
+ ),
610
+ /* @__PURE__ */ jsxRuntime.jsx(
611
+ "div",
612
+ {
613
+ className: cn(
614
+ "max-w-full md:max-w-3xl space-y-16 md:space-y-24",
615
+ postsClassName
616
+ ),
617
+ children: postsContent
618
+ }
619
+ ),
605
620
  (ctaSlot || ctaAction) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-16 text-center", ctaClassName), children: ctaContent })
606
621
  ] })
607
622
  }
package/dist/blog-horizontal-cards.js CHANGED
@@ -520,11 +520,11 @@ function BlogHorizontalCards({
520
520
  )
521
521
  }
522
522
  ) }),
523
- /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-3", children: [
524
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 text-sm opacity-70", children: [
523
+ /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
524
+ /* @__PURE__ */ jsxs("div", { className: "flex justify-start items-center gap-3 md:gap-4 text-sm flex-wrap", children: [
525
525
  postLabel && /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: postLabel }),
526
- post.author && /* @__PURE__ */ jsx("span", { children: post.author }),
527
- postDate && /* @__PURE__ */ jsx("span", { children: postDate })
526
+ post.author && /* @__PURE__ */ jsx("span", { className: "font-semibold", children: post.author }),
527
+ postDate && /* @__PURE__ */ jsx("span", { className: "opacity-70", children: postDate })
528
528
  ] }),
529
529
  post.title && /* @__PURE__ */ jsx("h3", { className: "text-xl leading-tight font-bold lg:text-2xl", children: /* @__PURE__ */ jsx(Pressable, { href: postHref, className: "hover:underline", children: post.title }) }),
530
530
  postSummary && /* @__PURE__ */ jsx("p", { className: "text-base opacity-70 line-clamp-3", children: postSummary }),
@@ -556,31 +556,46 @@ function BlogHorizontalCards({
556
556
  pattern,
557
557
  patternOpacity,
558
558
  containerClassName,
559
- children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
560
- /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-3xl text-center", headerClassName), children: [
561
- badge && (typeof badge === "string" ? /* @__PURE__ */ jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
562
- heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
563
- "h2",
564
- {
565
- className: cn(
566
- "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-5xl lg:mb-6",
567
- headingClassName
568
- ),
569
- children: heading
570
- }
571
- ) : heading),
572
- description && (typeof description === "string" ? /* @__PURE__ */ jsx(
573
- "p",
574
- {
575
- className: cn(
576
- "mb-12 opacity-70 md:text-base lg:text-lg text-balance",
577
- descriptionClassName
578
- ),
579
- children: description
580
- }
581
- ) : description)
582
- ] }),
583
- /* @__PURE__ */ jsx("div", { className: cn("mx-auto max-w-5xl space-y-12", postsClassName), children: postsContent }),
559
+ children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-6 md:gap-12", children: [
560
+ /* @__PURE__ */ jsxs(
561
+ "div",
562
+ {
563
+ className: cn("max-w-full md:max-w-3xl text-left", headerClassName),
564
+ children: [
565
+ badge && (typeof badge === "string" ? /* @__PURE__ */ jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
566
+ heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
567
+ "h2",
568
+ {
569
+ className: cn(
570
+ "mb-3 text-3xl font-semibold text-pretty md:mb-4 md:text-5xl lg:mb-6",
571
+ headingClassName
572
+ ),
573
+ children: heading
574
+ }
575
+ ) : heading),
576
+ description && (typeof description === "string" ? /* @__PURE__ */ jsx(
577
+ "p",
578
+ {
579
+ className: cn(
580
+ "mb-12 opacity-70 md:text-base lg:text-lg text-balance",
581
+ descriptionClassName
582
+ ),
583
+ children: description
584
+ }
585
+ ) : description)
586
+ ]
587
+ }
588
+ ),
589
+ /* @__PURE__ */ jsx(
590
+ "div",
591
+ {
592
+ className: cn(
593
+ "max-w-full md:max-w-3xl space-y-16 md:space-y-24",
594
+ postsClassName
595
+ ),
596
+ children: postsContent
597
+ }
598
+ ),
584
599
  (ctaSlot || ctaAction) && /* @__PURE__ */ jsx("div", { className: cn("mt-16 text-center", ctaClassName), children: ctaContent })
585
600
  ] })
586
601
  }
package/dist/contact-demo.cjs CHANGED
@@ -622,7 +622,7 @@ function ContactDemo({
622
622
  as: "h2",
623
623
  text: heading,
624
624
  className: cn(
625
- "text-5xl lg:text-6xl xl:text-7xl text-pretty font-bold text-left md:text-center",
625
+ "justify-start text-left text-5xl font-bold text-pretty md:justify-center md:text-center lg:text-6xl xl:text-7xl",
626
626
  headingClassName
627
627
  ),
628
628
  animateBy: "words",
package/dist/contact-demo.js CHANGED
@@ -616,7 +616,7 @@ function ContactDemo({
616
616
  as: "h2",
617
617
  text: heading,
618
618
  className: cn(
619
- "text-5xl lg:text-6xl xl:text-7xl text-pretty font-bold text-left md:text-center",
619
+ "justify-start text-left text-5xl font-bold text-pretty md:justify-center md:text-center lg:text-6xl xl:text-7xl",
620
620
  headingClassName
621
621
  ),
622
622
  animateBy: "words",