@opensite/ui 3.6.8 → 3.7.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.
- package/dist/hero-dashed-border-features.cjs +10 -1
- package/dist/hero-dashed-border-features.js +10 -1
- package/dist/hero-design-carousel-portfolio.cjs +1 -1
- package/dist/hero-design-carousel-portfolio.js +1 -1
- package/dist/hero-event-registration.cjs +48 -6
- package/dist/hero-event-registration.d.cts +15 -6
- package/dist/hero-event-registration.d.ts +15 -6
- package/dist/hero-event-registration.js +48 -6
- package/dist/hero-fullscreen-background-image.cjs +3 -3
- package/dist/hero-fullscreen-background-image.js +3 -3
- package/dist/hero-logo-centered-screenshot.cjs +52 -31
- package/dist/hero-logo-centered-screenshot.d.cts +12 -4
- package/dist/hero-logo-centered-screenshot.d.ts +12 -4
- package/dist/hero-logo-centered-screenshot.js +52 -31
- package/dist/hero-mentorship-video-split.cjs +0 -2
- package/dist/hero-mentorship-video-split.js +0 -2
- package/dist/hero-pattern-badge-logos.cjs +6 -6
- package/dist/hero-pattern-badge-logos.js +6 -6
- package/dist/hero-presentation-platform-video.cjs +5 -2
- package/dist/hero-presentation-platform-video.js +5 -2
- package/dist/hero-video-background-dark.cjs +3 -3
- package/dist/hero-video-background-dark.js +3 -3
- package/dist/registry.cjs +44 -55
- package/dist/registry.js +44 -55
- package/package.json +1 -1
|
@@ -623,7 +623,16 @@ function HeroDashedBorderFeatures({
|
|
|
623
623
|
),
|
|
624
624
|
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl", children: [
|
|
625
625
|
renderAnnouncement,
|
|
626
|
-
(logo || logoSlot) && /* @__PURE__ */ jsxRuntime.jsx(
|
|
626
|
+
(logo || logoSlot) && /* @__PURE__ */ jsxRuntime.jsx(
|
|
627
|
+
"div",
|
|
628
|
+
{
|
|
629
|
+
className: cn(
|
|
630
|
+
"mt-8 md:mt-16 mb-0 flex justify-center",
|
|
631
|
+
logoClassName
|
|
632
|
+
),
|
|
633
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(BrandLogo, { logo, logoSlot, size: "lg" })
|
|
634
|
+
}
|
|
635
|
+
),
|
|
627
636
|
heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
628
637
|
"h1",
|
|
629
638
|
{
|
|
@@ -602,7 +602,16 @@ function HeroDashedBorderFeatures({
|
|
|
602
602
|
),
|
|
603
603
|
children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl", children: [
|
|
604
604
|
renderAnnouncement,
|
|
605
|
-
(logo || logoSlot) && /* @__PURE__ */ jsx(
|
|
605
|
+
(logo || logoSlot) && /* @__PURE__ */ jsx(
|
|
606
|
+
"div",
|
|
607
|
+
{
|
|
608
|
+
className: cn(
|
|
609
|
+
"mt-8 md:mt-16 mb-0 flex justify-center",
|
|
610
|
+
logoClassName
|
|
611
|
+
),
|
|
612
|
+
children: /* @__PURE__ */ jsx(BrandLogo, { logo, logoSlot, size: "lg" })
|
|
613
|
+
}
|
|
614
|
+
),
|
|
606
615
|
heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
|
|
607
616
|
"h1",
|
|
608
617
|
{
|
|
@@ -534,6 +534,48 @@ function ActionComponent({ action }) {
|
|
|
534
534
|
}
|
|
535
535
|
);
|
|
536
536
|
}
|
|
537
|
+
var SIZE_CLASSES = {
|
|
538
|
+
sm: "max-h-6 sm:max-h-7",
|
|
539
|
+
md: "max-h-8 sm:max-h-9 lg:max-h-10",
|
|
540
|
+
lg: "max-h-10 sm:max-h-12 lg:max-h-14",
|
|
541
|
+
xl: "max-h-12 sm:max-h-14 lg:max-h-16"
|
|
542
|
+
};
|
|
543
|
+
var BrandLogo = ({
|
|
544
|
+
logo,
|
|
545
|
+
logoSlot,
|
|
546
|
+
logoClassName,
|
|
547
|
+
size = "md",
|
|
548
|
+
optixFlowConfig
|
|
549
|
+
}) => {
|
|
550
|
+
if (logoSlot) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot });
|
|
551
|
+
if (!logo || !logo.src) return null;
|
|
552
|
+
const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
|
|
553
|
+
img.Img,
|
|
554
|
+
{
|
|
555
|
+
src: logo.src,
|
|
556
|
+
className: cn(
|
|
557
|
+
"w-auto object-contain",
|
|
558
|
+
SIZE_CLASSES[size],
|
|
559
|
+
logo.className
|
|
560
|
+
),
|
|
561
|
+
alt: logo.alt || "Logo",
|
|
562
|
+
optixFlowConfig,
|
|
563
|
+
loading: "eager"
|
|
564
|
+
}
|
|
565
|
+
);
|
|
566
|
+
if (logo.url) {
|
|
567
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
568
|
+
pressable.Pressable,
|
|
569
|
+
{
|
|
570
|
+
href: logo.url,
|
|
571
|
+
className: cn("flex items-center", logoClassName),
|
|
572
|
+
children: imgElement
|
|
573
|
+
}
|
|
574
|
+
);
|
|
575
|
+
}
|
|
576
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
|
|
577
|
+
};
|
|
578
|
+
var brand_logo_default = BrandLogo;
|
|
537
579
|
function HeroEventRegistration({
|
|
538
580
|
sectionId = "hero-event-registration",
|
|
539
581
|
badgeText,
|
|
@@ -564,6 +606,8 @@ function HeroEventRegistration({
|
|
|
564
606
|
imageClassName,
|
|
565
607
|
optixFlowConfig,
|
|
566
608
|
logo,
|
|
609
|
+
logoSlot,
|
|
610
|
+
logoClassName,
|
|
567
611
|
directionConfig = { desktop: "mediaRight", mobile: "mediaTop" }
|
|
568
612
|
}) {
|
|
569
613
|
const renderBadge = React.useMemo(() => {
|
|
@@ -721,13 +765,11 @@ function HeroEventRegistration({
|
|
|
721
765
|
),
|
|
722
766
|
children: [
|
|
723
767
|
renderBadge,
|
|
724
|
-
logo && /* @__PURE__ */ jsxRuntime.jsx(
|
|
725
|
-
|
|
768
|
+
(logo || logoSlot) && /* @__PURE__ */ jsxRuntime.jsx(
|
|
769
|
+
"div",
|
|
726
770
|
{
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
className: "w-auto max-w-full h-12 md:h-14 object-contain my-4",
|
|
730
|
-
optixFlowConfig
|
|
771
|
+
className: cn("mb-1 mt-4 flex justify-start", logoClassName),
|
|
772
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(brand_logo_default, { logo, logoSlot, size: "lg" })
|
|
731
773
|
}
|
|
732
774
|
),
|
|
733
775
|
heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -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, k as StatItem, I as ImageItem, 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';
|
|
@@ -119,12 +122,18 @@ interface HeroEventRegistrationProps {
|
|
|
119
122
|
*/
|
|
120
123
|
optixFlowConfig?: OptixFlowConfig;
|
|
121
124
|
/**
|
|
122
|
-
*
|
|
125
|
+
* Brand logo configuration — renders centered above the heading.
|
|
126
|
+
* LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
|
|
123
127
|
*/
|
|
124
|
-
logo?:
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
+
logo?: LogoConfig;
|
|
129
|
+
/**
|
|
130
|
+
* Custom slot for logo (overrides logo prop)
|
|
131
|
+
*/
|
|
132
|
+
logoSlot?: React.ReactNode;
|
|
133
|
+
/**
|
|
134
|
+
* Additional CSS classes for the logo container
|
|
135
|
+
*/
|
|
136
|
+
logoClassName?: string;
|
|
128
137
|
/**
|
|
129
138
|
* Direction configuration for desktop and mobile layouts
|
|
130
139
|
* @default { desktop: 'mediaRight', mobile: 'mediaTop' }
|
|
@@ -133,6 +142,6 @@ interface HeroEventRegistrationProps {
|
|
|
133
142
|
/** Optional Section ID */
|
|
134
143
|
sectionId?: string;
|
|
135
144
|
}
|
|
136
|
-
declare function HeroEventRegistration({ sectionId, badgeText, badgeIcon, badgeSlot, heading, description, actions, actionsSlot, stats, statsSlot, image, imageSlot, locationLabel, locationSublabel, locationSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, statsClassName, imageClassName, optixFlowConfig, logo, directionConfig, }: HeroEventRegistrationProps): React.JSX.Element;
|
|
145
|
+
declare function HeroEventRegistration({ sectionId, badgeText, badgeIcon, badgeSlot, heading, description, actions, actionsSlot, stats, statsSlot, image, imageSlot, locationLabel, locationSublabel, locationSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, statsClassName, imageClassName, optixFlowConfig, logo, logoSlot, logoClassName, directionConfig, }: HeroEventRegistrationProps): React.JSX.Element;
|
|
137
146
|
|
|
138
147
|
export { HeroEventRegistration, type HeroEventRegistrationProps };
|
|
@@ -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, k as StatItem, I as ImageItem, 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';
|
|
@@ -119,12 +122,18 @@ interface HeroEventRegistrationProps {
|
|
|
119
122
|
*/
|
|
120
123
|
optixFlowConfig?: OptixFlowConfig;
|
|
121
124
|
/**
|
|
122
|
-
*
|
|
125
|
+
* Brand logo configuration — renders centered above the heading.
|
|
126
|
+
* LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
|
|
123
127
|
*/
|
|
124
|
-
logo?:
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
+
logo?: LogoConfig;
|
|
129
|
+
/**
|
|
130
|
+
* Custom slot for logo (overrides logo prop)
|
|
131
|
+
*/
|
|
132
|
+
logoSlot?: React.ReactNode;
|
|
133
|
+
/**
|
|
134
|
+
* Additional CSS classes for the logo container
|
|
135
|
+
*/
|
|
136
|
+
logoClassName?: string;
|
|
128
137
|
/**
|
|
129
138
|
* Direction configuration for desktop and mobile layouts
|
|
130
139
|
* @default { desktop: 'mediaRight', mobile: 'mediaTop' }
|
|
@@ -133,6 +142,6 @@ interface HeroEventRegistrationProps {
|
|
|
133
142
|
/** Optional Section ID */
|
|
134
143
|
sectionId?: string;
|
|
135
144
|
}
|
|
136
|
-
declare function HeroEventRegistration({ sectionId, badgeText, badgeIcon, badgeSlot, heading, description, actions, actionsSlot, stats, statsSlot, image, imageSlot, locationLabel, locationSublabel, locationSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, statsClassName, imageClassName, optixFlowConfig, logo, directionConfig, }: HeroEventRegistrationProps): React.JSX.Element;
|
|
145
|
+
declare function HeroEventRegistration({ sectionId, badgeText, badgeIcon, badgeSlot, heading, description, actions, actionsSlot, stats, statsSlot, image, imageSlot, locationLabel, locationSublabel, locationSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, statsClassName, imageClassName, optixFlowConfig, logo, logoSlot, logoClassName, directionConfig, }: HeroEventRegistrationProps): React.JSX.Element;
|
|
137
146
|
|
|
138
147
|
export { HeroEventRegistration, type HeroEventRegistrationProps };
|
|
@@ -513,6 +513,48 @@ function ActionComponent({ action }) {
|
|
|
513
513
|
}
|
|
514
514
|
);
|
|
515
515
|
}
|
|
516
|
+
var SIZE_CLASSES = {
|
|
517
|
+
sm: "max-h-6 sm:max-h-7",
|
|
518
|
+
md: "max-h-8 sm:max-h-9 lg:max-h-10",
|
|
519
|
+
lg: "max-h-10 sm:max-h-12 lg:max-h-14",
|
|
520
|
+
xl: "max-h-12 sm:max-h-14 lg:max-h-16"
|
|
521
|
+
};
|
|
522
|
+
var BrandLogo = ({
|
|
523
|
+
logo,
|
|
524
|
+
logoSlot,
|
|
525
|
+
logoClassName,
|
|
526
|
+
size = "md",
|
|
527
|
+
optixFlowConfig
|
|
528
|
+
}) => {
|
|
529
|
+
if (logoSlot) return /* @__PURE__ */ jsx(Fragment, { children: logoSlot });
|
|
530
|
+
if (!logo || !logo.src) return null;
|
|
531
|
+
const imgElement = /* @__PURE__ */ jsx(
|
|
532
|
+
Img,
|
|
533
|
+
{
|
|
534
|
+
src: logo.src,
|
|
535
|
+
className: cn(
|
|
536
|
+
"w-auto object-contain",
|
|
537
|
+
SIZE_CLASSES[size],
|
|
538
|
+
logo.className
|
|
539
|
+
),
|
|
540
|
+
alt: logo.alt || "Logo",
|
|
541
|
+
optixFlowConfig,
|
|
542
|
+
loading: "eager"
|
|
543
|
+
}
|
|
544
|
+
);
|
|
545
|
+
if (logo.url) {
|
|
546
|
+
return /* @__PURE__ */ jsx(
|
|
547
|
+
Pressable,
|
|
548
|
+
{
|
|
549
|
+
href: logo.url,
|
|
550
|
+
className: cn("flex items-center", logoClassName),
|
|
551
|
+
children: imgElement
|
|
552
|
+
}
|
|
553
|
+
);
|
|
554
|
+
}
|
|
555
|
+
return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
|
|
556
|
+
};
|
|
557
|
+
var brand_logo_default = BrandLogo;
|
|
516
558
|
function HeroEventRegistration({
|
|
517
559
|
sectionId = "hero-event-registration",
|
|
518
560
|
badgeText,
|
|
@@ -543,6 +585,8 @@ function HeroEventRegistration({
|
|
|
543
585
|
imageClassName,
|
|
544
586
|
optixFlowConfig,
|
|
545
587
|
logo,
|
|
588
|
+
logoSlot,
|
|
589
|
+
logoClassName,
|
|
546
590
|
directionConfig = { desktop: "mediaRight", mobile: "mediaTop" }
|
|
547
591
|
}) {
|
|
548
592
|
const renderBadge = useMemo(() => {
|
|
@@ -700,13 +744,11 @@ function HeroEventRegistration({
|
|
|
700
744
|
),
|
|
701
745
|
children: [
|
|
702
746
|
renderBadge,
|
|
703
|
-
logo && /* @__PURE__ */ jsx(
|
|
704
|
-
|
|
747
|
+
(logo || logoSlot) && /* @__PURE__ */ jsx(
|
|
748
|
+
"div",
|
|
705
749
|
{
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
className: "w-auto max-w-full h-12 md:h-14 object-contain my-4",
|
|
709
|
-
optixFlowConfig
|
|
750
|
+
className: cn("mb-1 mt-4 flex justify-start", logoClassName),
|
|
751
|
+
children: /* @__PURE__ */ jsx(brand_logo_default, { logo, logoSlot, size: "lg" })
|
|
710
752
|
}
|
|
711
753
|
),
|
|
712
754
|
heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
|
|
@@ -538,17 +538,17 @@ function HeroFullscreenBackgroundImage({
|
|
|
538
538
|
),
|
|
539
539
|
children: heading
|
|
540
540
|
}
|
|
541
|
-
) :
|
|
541
|
+
) : heading),
|
|
542
542
|
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
543
543
|
"p",
|
|
544
544
|
{
|
|
545
545
|
className: cn(
|
|
546
|
-
"text-center text-base text-balance text-white text-shadow-lg",
|
|
546
|
+
"text-center text-base text-balance text-white text-shadow-lg max-w-full md:max-w-sm",
|
|
547
547
|
descriptionClassName
|
|
548
548
|
),
|
|
549
549
|
children: description
|
|
550
550
|
}
|
|
551
|
-
) :
|
|
551
|
+
) : description),
|
|
552
552
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
553
553
|
BlockActions,
|
|
554
554
|
{
|
|
@@ -532,17 +532,17 @@ function HeroFullscreenBackgroundImage({
|
|
|
532
532
|
),
|
|
533
533
|
children: heading
|
|
534
534
|
}
|
|
535
|
-
) :
|
|
535
|
+
) : heading),
|
|
536
536
|
description && (typeof description === "string" ? /* @__PURE__ */ jsx(
|
|
537
537
|
"p",
|
|
538
538
|
{
|
|
539
539
|
className: cn(
|
|
540
|
-
"text-center text-base text-balance text-white text-shadow-lg",
|
|
540
|
+
"text-center text-base text-balance text-white text-shadow-lg max-w-full md:max-w-sm",
|
|
541
541
|
descriptionClassName
|
|
542
542
|
),
|
|
543
543
|
children: description
|
|
544
544
|
}
|
|
545
|
-
) :
|
|
545
|
+
) : description),
|
|
546
546
|
/* @__PURE__ */ jsx(
|
|
547
547
|
BlockActions,
|
|
548
548
|
{
|
|
@@ -392,10 +392,53 @@ var Section = React__default.default.forwardRef(
|
|
|
392
392
|
}
|
|
393
393
|
);
|
|
394
394
|
Section.displayName = "Section";
|
|
395
|
+
var SIZE_CLASSES = {
|
|
396
|
+
sm: "max-h-6 sm:max-h-7",
|
|
397
|
+
md: "max-h-8 sm:max-h-9 lg:max-h-10",
|
|
398
|
+
lg: "max-h-10 sm:max-h-12 lg:max-h-14",
|
|
399
|
+
xl: "max-h-12 sm:max-h-14 lg:max-h-16"
|
|
400
|
+
};
|
|
401
|
+
var BrandLogo = ({
|
|
402
|
+
logo,
|
|
403
|
+
logoSlot,
|
|
404
|
+
logoClassName,
|
|
405
|
+
size = "md",
|
|
406
|
+
optixFlowConfig
|
|
407
|
+
}) => {
|
|
408
|
+
if (logoSlot) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: logoSlot });
|
|
409
|
+
if (!logo || !logo.src) return null;
|
|
410
|
+
const imgElement = /* @__PURE__ */ jsxRuntime.jsx(
|
|
411
|
+
img.Img,
|
|
412
|
+
{
|
|
413
|
+
src: logo.src,
|
|
414
|
+
className: cn(
|
|
415
|
+
"w-auto object-contain",
|
|
416
|
+
SIZE_CLASSES[size],
|
|
417
|
+
logo.className
|
|
418
|
+
),
|
|
419
|
+
alt: logo.alt || "Logo",
|
|
420
|
+
optixFlowConfig,
|
|
421
|
+
loading: "eager"
|
|
422
|
+
}
|
|
423
|
+
);
|
|
424
|
+
if (logo.url) {
|
|
425
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
426
|
+
pressable.Pressable,
|
|
427
|
+
{
|
|
428
|
+
href: logo.url,
|
|
429
|
+
className: cn("flex items-center", logoClassName),
|
|
430
|
+
children: imgElement
|
|
431
|
+
}
|
|
432
|
+
);
|
|
433
|
+
}
|
|
434
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center", logoClassName), children: imgElement });
|
|
435
|
+
};
|
|
436
|
+
var brand_logo_default = BrandLogo;
|
|
395
437
|
function HeroLogoCenteredScreenshot({
|
|
396
438
|
sectionId = "hero-logo-centered-screenshot",
|
|
397
439
|
logo,
|
|
398
440
|
logoSlot,
|
|
441
|
+
logoClassName,
|
|
399
442
|
heading,
|
|
400
443
|
description,
|
|
401
444
|
action,
|
|
@@ -414,20 +457,6 @@ function HeroLogoCenteredScreenshot({
|
|
|
414
457
|
imageClassName,
|
|
415
458
|
optixFlowConfig
|
|
416
459
|
}) {
|
|
417
|
-
const renderLogo = React.useMemo(() => {
|
|
418
|
-
if (logoSlot) return logoSlot;
|
|
419
|
-
if (!logo) return null;
|
|
420
|
-
const logoSrc = typeof logo.src === "string" ? logo.src : logo.src.light;
|
|
421
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
422
|
-
img.Img,
|
|
423
|
-
{
|
|
424
|
-
src: logoSrc,
|
|
425
|
-
alt: logo.alt,
|
|
426
|
-
className: cn("h-10 md:h-16 object-contain", logo.className),
|
|
427
|
-
optixFlowConfig
|
|
428
|
-
}
|
|
429
|
-
);
|
|
430
|
-
}, [logoSlot, logo, optixFlowConfig]);
|
|
431
460
|
const renderAction = React.useMemo(() => {
|
|
432
461
|
if (actionSlot) return actionSlot;
|
|
433
462
|
if (!action) return null;
|
|
@@ -470,9 +499,10 @@ function HeroLogoCenteredScreenshot({
|
|
|
470
499
|
spacing,
|
|
471
500
|
pattern,
|
|
472
501
|
patternOpacity,
|
|
473
|
-
className
|
|
474
|
-
|
|
475
|
-
|
|
502
|
+
className,
|
|
503
|
+
containerClassName,
|
|
504
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
|
|
505
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto flex max-w-full md:max-w-5xl flex-col items-center", children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
476
506
|
"div",
|
|
477
507
|
{
|
|
478
508
|
className: cn(
|
|
@@ -480,7 +510,7 @@ function HeroLogoCenteredScreenshot({
|
|
|
480
510
|
contentClassName
|
|
481
511
|
),
|
|
482
512
|
children: [
|
|
483
|
-
|
|
513
|
+
(logo || logoSlot) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex justify-center", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(brand_logo_default, { logo, logoSlot, size: "lg" }) }),
|
|
484
514
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-center items-center w-full text-balance", children: [
|
|
485
515
|
heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
486
516
|
"h1",
|
|
@@ -491,33 +521,24 @@ function HeroLogoCenteredScreenshot({
|
|
|
491
521
|
),
|
|
492
522
|
children: heading
|
|
493
523
|
}
|
|
494
|
-
) :
|
|
495
|
-
"h1",
|
|
496
|
-
{
|
|
497
|
-
className: cn(
|
|
498
|
-
"mb-4 text-3xl font-medium lg:text-5xl",
|
|
499
|
-
headingClassName
|
|
500
|
-
),
|
|
501
|
-
children: heading
|
|
502
|
-
}
|
|
503
|
-
)),
|
|
524
|
+
) : heading),
|
|
504
525
|
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
505
526
|
"p",
|
|
506
527
|
{
|
|
507
528
|
className: cn(
|
|
508
|
-
"max-w-3xl lg:text-xl",
|
|
529
|
+
"max-w-full md:max-w-3xl lg:text-xl",
|
|
509
530
|
descriptionClassName
|
|
510
531
|
),
|
|
511
532
|
children: description
|
|
512
533
|
}
|
|
513
|
-
) :
|
|
534
|
+
) : description)
|
|
514
535
|
] }),
|
|
515
536
|
renderAction
|
|
516
537
|
]
|
|
517
538
|
}
|
|
518
539
|
) }),
|
|
519
540
|
renderImage
|
|
520
|
-
] })
|
|
541
|
+
] })
|
|
521
542
|
}
|
|
522
543
|
);
|
|
523
544
|
}
|
|
@@ -1,20 +1,28 @@
|
|
|
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
|
|
3
|
+
import { L as LogoConfig } from './types-mWZcgKth.cjs';
|
|
4
|
+
import { A as ActionConfig, I as ImageItem, 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';
|
|
8
11
|
|
|
9
12
|
interface HeroLogoCenteredScreenshotProps {
|
|
10
13
|
/**
|
|
11
|
-
*
|
|
14
|
+
* Brand logo configuration — renders above the announcement badge.
|
|
15
|
+
* LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
|
|
12
16
|
*/
|
|
13
|
-
logo?:
|
|
17
|
+
logo?: LogoConfig;
|
|
14
18
|
/**
|
|
15
19
|
* Custom slot for logo (overrides logo prop)
|
|
16
20
|
*/
|
|
17
21
|
logoSlot?: React.ReactNode;
|
|
22
|
+
/**
|
|
23
|
+
* Additional CSS classes for the logo container
|
|
24
|
+
*/
|
|
25
|
+
logoClassName?: string;
|
|
18
26
|
/**
|
|
19
27
|
* Main heading content
|
|
20
28
|
*/
|
|
@@ -85,6 +93,6 @@ interface HeroLogoCenteredScreenshotProps {
|
|
|
85
93
|
/** Optional Section ID */
|
|
86
94
|
sectionId?: string;
|
|
87
95
|
}
|
|
88
|
-
declare function HeroLogoCenteredScreenshot({ sectionId, logo, logoSlot, heading, description, action, actionSlot, image, imageSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, imageClassName, optixFlowConfig, }: HeroLogoCenteredScreenshotProps): React.JSX.Element;
|
|
96
|
+
declare function HeroLogoCenteredScreenshot({ sectionId, logo, logoSlot, logoClassName, heading, description, action, actionSlot, image, imageSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, imageClassName, optixFlowConfig, }: HeroLogoCenteredScreenshotProps): React.JSX.Element;
|
|
89
97
|
|
|
90
98
|
export { HeroLogoCenteredScreenshot, type HeroLogoCenteredScreenshotProps };
|
|
@@ -1,20 +1,28 @@
|
|
|
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
|
|
3
|
+
import { L as LogoConfig } from './types-hJ2R0GoH.js';
|
|
4
|
+
import { A as ActionConfig, I as ImageItem, 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';
|
|
8
11
|
|
|
9
12
|
interface HeroLogoCenteredScreenshotProps {
|
|
10
13
|
/**
|
|
11
|
-
*
|
|
14
|
+
* Brand logo configuration — renders above the announcement badge.
|
|
15
|
+
* LOGO MEDIA ONLY. Do not use photos, hero images, or video assets.
|
|
12
16
|
*/
|
|
13
|
-
logo?:
|
|
17
|
+
logo?: LogoConfig;
|
|
14
18
|
/**
|
|
15
19
|
* Custom slot for logo (overrides logo prop)
|
|
16
20
|
*/
|
|
17
21
|
logoSlot?: React.ReactNode;
|
|
22
|
+
/**
|
|
23
|
+
* Additional CSS classes for the logo container
|
|
24
|
+
*/
|
|
25
|
+
logoClassName?: string;
|
|
18
26
|
/**
|
|
19
27
|
* Main heading content
|
|
20
28
|
*/
|
|
@@ -85,6 +93,6 @@ interface HeroLogoCenteredScreenshotProps {
|
|
|
85
93
|
/** Optional Section ID */
|
|
86
94
|
sectionId?: string;
|
|
87
95
|
}
|
|
88
|
-
declare function HeroLogoCenteredScreenshot({ sectionId, logo, logoSlot, heading, description, action, actionSlot, image, imageSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, imageClassName, optixFlowConfig, }: HeroLogoCenteredScreenshotProps): React.JSX.Element;
|
|
96
|
+
declare function HeroLogoCenteredScreenshot({ sectionId, logo, logoSlot, logoClassName, heading, description, action, actionSlot, image, imageSlot, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, imageClassName, optixFlowConfig, }: HeroLogoCenteredScreenshotProps): React.JSX.Element;
|
|
89
97
|
|
|
90
98
|
export { HeroLogoCenteredScreenshot, type HeroLogoCenteredScreenshotProps };
|