bender/b6bf0fdc-ce84-4747-b124-d80ba86917a6
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2_1782035372174 into main #3

Merged
bender merged 1 commits from version_2_1782035372174 into main 2026-06-21 09:52:26 +00:00
Conversation 0 Commits 1 Files Changed 9 +321 -123
9 changed files with 321 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
src/pages/HomePage.tsx
View File

@@ -1,135 +1,36 @@
import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
import ContactCta from '@/components/sections/contact/ContactCta';
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
import FeaturesBento from '@/components/sections/features/FeaturesBento';
import HeroSplitMediaGrid from '@/components/sections/hero/HeroSplitMediaGrid';
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
// AUTO-GENERATED shell by per-section-migrate.
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
// files directly. Non-block content (wrappers, non-inlinable sections) is
// preserved inline; extracted section blocks become <XSection/> refs.
export default function HomePage() {
import React from 'react';
import HeroSection from './HomePage/sections/Hero';
import AboutSection from './HomePage/sections/About';
import FeaturesSection from './HomePage/sections/Features';
import MetricsSection from './HomePage/sections/Metrics';
import SocialProofSection from './HomePage/sections/SocialProof';
import TestimonialsSection from './HomePage/sections/Testimonials';
import FaqSection from './HomePage/sections/Faq';
import ContactSection from './HomePage/sections/Contact';
export default function HomePage(): React.JSX.Element {
return (
<>
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroSplitMediaGrid
tag="Education Elevated"
title="Master the Architecture of Digital Wealth"
description="Income Stack combines elite educational ebooks with actionable financial frameworks designed for the modern wealth builder."
primaryButton={{ text: "Unlock Income Stack", href: "#contact" }}
secondaryButton={{ text: "Explore Curriculum", href: "#about" }}
items={[
{ imageSrc: "http://img.b2bpic.net/free-photo/high-tech-office-ready-stock-trading_482257-121465.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-black-credit-card-debit-card_187299-47803.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<>
<HeroSection />
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutMediaOverlay
tag="Our Philosophy"
title="Knowledge is the Ultimate Asset"
description="We believe financial freedom is built on the foundation of structured knowledge. Income Stack provides you with the blueprints used by industry-leading wealth architects."
imageSrc="http://img.b2bpic.net/free-photo/management-verifying-task-progress_482257-80309.jpg"
/>
</SectionErrorBoundary>
</div>
<AboutSection />
<div id="features" data-section="features">
<SectionErrorBoundary name="features">
<FeaturesBento
tag="Systemized Growth"
title="Everything You Need to Stack Income"
description="Scalable strategies, risk management protocols, and actionable financial roadmaps."
features={[
{
title: "Advanced Analytics", description: "Track your wealth velocity and performance metrics with real-time feedback loops.", bentoComponent: "animated-bar-chart"
},
{
title: "Strategic Roadmap", description: "A step-by-step framework to maximize your return on effort.", bentoComponent: "checklist-timeline", heading: "The Blueprint", subheading: "Four critical stages to wealth", checklistItems: [
{ label: "Establish Baseline", detail: "Define your current financial constraints" },
{ label: "Execute Protocol", detail: "Implement income-generating systems" },
{ label: "Optimize Velocity", detail: "Refine and scale your existing flows" }
],
completedLabel: "Growth Unlocked"
}
]}
/>
</SectionErrorBoundary>
</div>
<FeaturesSection />
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsSimpleCards
tag="Proven Results"
title="Tangible Impact for Our Readers"
description="The metrics behind the Income Stack growth methodology."
metrics={[
{ value: "15k+", description: "Readers Stacked" },
{ value: "400%", description: "Average Income Growth" },
{ value: "24/7", description: "Knowledge Access" }
]}
/>
</SectionErrorBoundary>
</div>
<MetricsSection />
<div id="social-proof" data-section="social-proof">
<SectionErrorBoundary name="social-proof">
<SocialProofMarquee
tag="Industry Alignment"
title="Recognized by Industry Leaders"
names={["Forbes", "TechCrunch", "Financial Times", "Wall Street Journal", "Business Insider", "Inc. Magazine", "Fast Company"]}
description="Join a global network of wealth builders backed by industry leaders."
/>
</SectionErrorBoundary>
</div>
<SocialProofSection />
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialMarqueeOverlayCards
tag="Voice of Success"
title="Hear from the Stackers"
testimonials={[
{ name: "Sarah J.", role: "Finance Lead", company: "Global Tech", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confused-office-worker-shrugging-cant-understand-something-standing-white-background_1258-113735.jpg" },
{ name: "Michael R.", role: "CEO", company: "Growth Hub", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg" },
{ name: "Elena K.", role: "Strategist", company: "Wealth Firm", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-man-black-shirt-poses-against-dark-background-standing-studio_613910-15100.jpg" },
{ name: "David W.", role: "Developer", company: "Stack Co", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/professional-woman-smiling_23-2152009549.jpg" },
{ name: "Marcus L.", role: "Consultant", company: "Finance Inc", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-red-haired-man_158595-3777.jpg" }
]}
description="Success stories from our diverse community of financial architects."
/>
</SectionErrorBoundary>
</div>
<TestimonialsSection />
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTwoColumn
tag="Support"
title="Frequently Asked Questions"
description="Clear answers to help you start your journey."
items={[
{ question: "Is this for beginners?", answer: "Absolutely. Income Stack is designed to meet you where you are and scale with you." },
{ question: "What formats are provided?", answer: "All our ebooks are provided in high-quality PDF, ePub, and audiobook formats." },
{ question: "How do I get access?", answer: "Purchase once and receive lifetime updates and access to our community portal." },
{ question: "Is there support?", answer: "Yes, our team is available 24/7 to assist with your specific financial growth questions." }
]}
/>
</SectionErrorBoundary>
</div>
<FaqSection />
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Ready to Start?"
text="Join 15,000+ others who have already built their income stacks."
primaryButton={{ text: "Get Access", href: "#" }}
secondaryButton={{ text: "Contact Sales", href: "#" }}
/>
</SectionErrorBoundary>
</div>
<ContactSection />
</>
);
}

21
src/pages/HomePage/sections/About.tsx Normal file
View File

@@ -0,0 +1,21 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "about" section.
import React from 'react';
import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function AboutSection(): React.JSX.Element {
return (
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutMediaOverlay
tag="Our Philosophy"
title="Knowledge is the Ultimate Asset"
description="We believe financial freedom is built on the foundation of structured knowledge. Income Stack provides you with the blueprints used by industry-leading wealth architects."
imageSrc="http://img.b2bpic.net/free-photo/management-verifying-task-progress_482257-80309.jpg"
/>
</SectionErrorBoundary>
</div>
);
}

21
src/pages/HomePage/sections/Contact.tsx Normal file
View File

@@ -0,0 +1,21 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "contact" section.
import React from 'react';
import ContactCta from '@/components/sections/contact/ContactCta';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ContactSection(): React.JSX.Element {
return (
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Ready to Start?"
text="Join 15,000+ others who have already built their income stacks."
primaryButton={{ text: "Get Access", href: "#" }}
secondaryButton={{ text: "Contact Sales", href: "#" }}
/>
</SectionErrorBoundary>
</div>
);
}

26
src/pages/HomePage/sections/Faq.tsx Normal file
View File

@@ -0,0 +1,26 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "faq" section.
import React from 'react';
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTwoColumn
tag="Support"
title="Frequently Asked Questions"
description="Clear answers to help you start your journey."
items={[
{ question: "Is this for beginners?", answer: "Absolutely. Income Stack is designed to meet you where you are and scale with you." },
{ question: "What formats are provided?", answer: "All our ebooks are provided in high-quality PDF, ePub, and audiobook formats." },
{ question: "How do I get access?", answer: "Purchase once and receive lifetime updates and access to our community portal." },
{ question: "Is there support?", answer: "Yes, our team is available 24/7 to assist with your specific financial growth questions." }
]}
/>
</SectionErrorBoundary>
</div>
);
}

130
src/pages/HomePage/sections/Features.tsx Normal file
View File

@@ -0,0 +1,130 @@
/* eslint-disable */
// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
import Button from "@/components/ui/Button";
import TextAnimation from "@/components/ui/TextAnimation";
import GridOrCarousel from "@/components/ui/GridOrCarousel";
import ScrollReveal from "@/components/ui/ScrollReveal";
import InfoCardMarquee from "@/components/ui/InfoCardMarquee";
import TiltedStackCards from "@/components/ui/TiltedStackCards";
import AnimatedBarChart from "@/components/ui/AnimatedBarChart";
import OrbitingIcons from "@/components/ui/OrbitingIcons";
import IconTextMarquee from "@/components/ui/IconTextMarquee";
import ChatMarquee from "@/components/ui/ChatMarquee";
import ChecklistTimeline from "@/components/ui/ChecklistTimeline";
import MediaStack from "@/components/ui/MediaStack";
import type { LucideIcon } from "lucide-react";
const features = [
{
title: "Advanced Analytics",
description: "Track your wealth velocity and performance metrics with real-time feedback loops.",
bentoComponent: "animated-bar-chart"
},
{
title: "Strategic Roadmap",
description: "A step-by-step framework to maximize your return on effort.",
bentoComponent: "tilted-stack-cards",
stackCards: [
{
icon: "BookOpen",
title: "Learn",
subtitle: "Stage 1",
detail: "Master the foundational concepts"
},
{
icon: "Hammer",
title: "Build",
subtitle: "Stage 2",
detail: "Implement income-generating systems"
},
{
icon: "Layers",
title: "Stack & Scale",
subtitle: "Stage 3",
detail: "Refine and scale your existing flows"
}
]
}
];
type IconInput = string | LucideIcon;
type FeatureCard = { title: string; description: string } & (
| { bentoComponent: "info-card-marquee"; infoCards: { icon: IconInput; label: string; value: string }[] }
| { bentoComponent: "tilted-stack-cards"; stackCards: [{ icon: IconInput; title: string; subtitle: string; detail: string }, { icon: IconInput; title: string; subtitle: string; detail: string }, { icon: IconInput; title: string; subtitle: string; detail: string }] }
| { bentoComponent: "animated-bar-chart" }
| { bentoComponent: "orbiting-icons"; centerIcon: IconInput; orbitIcons: IconInput[] }
| { bentoComponent: "icon-text-marquee"; centerIcon: IconInput; marqueeTexts: string[] }
| { bentoComponent: "chat-marquee"; aiIcon: IconInput; userIcon: IconInput; exchanges: { userMessage: string; aiResponse: string }[]; placeholder: string }
| { bentoComponent: "checklist-timeline"; heading: string; subheading: string; checklistItems: [{ label: string; detail: string }, { label: string; detail: string }, { label: string; detail: string }]; completedLabel: string }
| { bentoComponent: "media-stack"; mediaItems: [{ imageSrc?: string; videoSrc?: string }, { imageSrc?: string; videoSrc?: string }, { imageSrc?: string; videoSrc?: string }] }
);
const getBentoComponent = (feature: FeatureCard) => {
switch (feature.bentoComponent) {
case "info-card-marquee": return <InfoCardMarquee items={feature.infoCards} />;
case "tilted-stack-cards": return <TiltedStackCards items={feature.stackCards} />;
case "animated-bar-chart": return <AnimatedBarChart />;
case "orbiting-icons": return <OrbitingIcons centerIcon={feature.centerIcon} items={feature.orbitIcons} />;
case "icon-text-marquee": return <IconTextMarquee centerIcon={feature.centerIcon} texts={feature.marqueeTexts} />;
case "chat-marquee": return <ChatMarquee aiIcon={feature.aiIcon} userIcon={feature.userIcon} exchanges={feature.exchanges} placeholder={feature.placeholder} />;
case "checklist-timeline": return <ChecklistTimeline heading={feature.heading} subheading={feature.subheading} items={feature.checklistItems} completedLabel={feature.completedLabel} />;
case "media-stack": return <MediaStack items={feature.mediaItems} />;
}
};
const FeaturesInline = () => (
<section aria-label="Features bento section" className="py-20">
<div className="flex flex-col gap-8 md:gap-10">
<div className="flex flex-col items-center w-content-width mx-auto gap-2">
<div className="px-3 py-1 mb-1 text-sm card rounded w-fit">
<p>{"Systemized Growth"}</p>
</div>
<TextAnimation
text={"Everything You Need to Stack Income"}
variant="slide-up"
gradientText={true}
tag="h2"
className="md:max-w-8/10 text-6xl 2xl:text-7xl leading-[1.15] font-semibold text-center text-balance"
/>
<TextAnimation
text={"Scalable strategies, risk management protocols, and actionable financial roadmaps."}
variant="slide-up"
gradientText={false}
tag="p"
className="md:max-w-7/10 text-lg md:text-xl leading-snug text-center text-balance"
/>
{(undefined || undefined) && (
<div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3">
{undefined && <Button text={undefined.text} href={undefined.href} variant="primary"/>}
{undefined && <Button text={undefined.text} href={undefined.href} variant="secondary"animationDelay={0.1} />}
</div>
)}
</div>
<ScrollReveal variant="fade">
<GridOrCarousel>
{features.map((feature) => (
<div key={feature.title} className="flex flex-col gap-3 xl:gap-3.5 2xl:gap-4 p-3 xl:p-3.5 2xl:p-4 card rounded h-full">
<div className="relative h-72 overflow-hidden rounded p-3 xl:p-3.5 2xl:p-4 bg-foreground/5 shadow shadow-foreground/5">{getBentoComponent(feature)}</div>
<div className="flex flex-col gap-1 p-3 xl:p-3.5 2xl:p-4">
<h3 className="text-2xl font-semibold leading-snug">{feature.title}</h3>
<p className="text-base leading-snug">{feature.description}</p>
</div>
</div>
))}
</GridOrCarousel>
</ScrollReveal>
</div>
</section>
);
export default function FeaturesSection() {
return (
<div data-webild-section="features" id="features">
<FeaturesInline />
</div>
);
}

26
src/pages/HomePage/sections/Hero.tsx Normal file
View File

@@ -0,0 +1,26 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "hero" section.
import React from 'react';
import HeroSplitMediaGrid from '@/components/sections/hero/HeroSplitMediaGrid';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function HeroSection(): React.JSX.Element {
return (
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroSplitMediaGrid
tag="Education Elevated"
title="Your Blueprint for Absolute Financial Autonomy"
description="Income Stack combines elite educational ebooks with actionable financial frameworks designed for the modern wealth builder."
primaryButton={{ text: "Unlock Income Stack", href: "#contact" }}
secondaryButton={{ text: "Explore Curriculum", href: "#about" }}
items={[
{ imageSrc: "http://img.b2bpic.net/free-photo/high-tech-office-ready-stock-trading_482257-121465.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-black-credit-card-debit-card_187299-47803.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

25
src/pages/HomePage/sections/Metrics.tsx Normal file
View File

@@ -0,0 +1,25 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "metrics" section.
import React from 'react';
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function MetricsSection(): React.JSX.Element {
return (
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsSimpleCards
tag="Proven Results"
title="Tangible Impact for Our Readers"
description="The metrics behind the Income Stack growth methodology."
metrics={[
{ value: "15k+", description: "Readers Stacked" },
{ value: "400%", description: "Average Income Growth" },
{ value: "24/7", description: "Knowledge Access" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

21
src/pages/HomePage/sections/SocialProof.tsx Normal file
View File

@@ -0,0 +1,21 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "social-proof" section.
import React from 'react';
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function SocialProofSection(): React.JSX.Element {
return (
<div id="social-proof" data-section="social-proof">
<SectionErrorBoundary name="social-proof">
<SocialProofMarquee
tag="Industry Alignment"
title="Recognized by Industry Leaders"
names={["Forbes", "TechCrunch", "Financial Times", "Wall Street Journal", "Business Insider", "Inc. Magazine", "Fast Company"]}
description="Join a global network of wealth builders backed by industry leaders."
/>
</SectionErrorBoundary>
</div>
);
}

27
src/pages/HomePage/sections/Testimonials.tsx Normal file
View File

@@ -0,0 +1,27 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "testimonials" section.
import React from 'react';
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function TestimonialsSection(): React.JSX.Element {
return (
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialMarqueeOverlayCards
tag="Voice of Success"
title="Hear from the Stackers"
testimonials={[
{ name: "Sarah J.", role: "Finance Lead", company: "Global Tech", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confused-office-worker-shrugging-cant-understand-something-standing-white-background_1258-113735.jpg" },
{ name: "Michael R.", role: "CEO", company: "Growth Hub", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg" },
{ name: "Elena K.", role: "Strategist", company: "Wealth Firm", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-man-black-shirt-poses-against-dark-background-standing-studio_613910-15100.jpg" },
{ name: "David W.", role: "Developer", company: "Stack Co", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/professional-woman-smiling_23-2152009549.jpg" },
{ name: "Marcus L.", role: "Consultant", company: "Finance Inc", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-red-haired-man_158595-3777.jpg" }
]}
description="Success stories from our diverse community of financial architects."
/>
</SectionErrorBoundary>
</div>
);
}