@nextworks/blocks-templates 0.1.0-alpha.0

package/dist/templates/digitalagency/components/NetworkPattern.jsx

@@ -0,0 +1,128 @@
+"use client";
+import React from "react";
+/**
+ * NetworkPattern
+ * Tailwind-based animated network background for hero fallbacks.
+ * Lightweight and dependency-free (no Chakra).
+ */
+export const NetworkPattern = () => {
+    return (
+    // <div className="relative h-full w-full">
+    <div className="relative h-full w-full overflow-hidden">
+      {/* Ambient gradient blobs behind the network */}
+      <div className="pointer-events-none absolute inset-0 -z-10 overflow-hidden">
+        <div className="absolute -top-16 -left-16 h-72 w-72 rounded-full bg-blue-500/25 blur-3xl"/>
+        <div className="absolute right-0 bottom-0 h-80 w-80 rounded-full bg-cyan-400/25 blur-3xl"/>
+        <div className="absolute top-14 right-1/3 h-56 w-56 rounded-full bg-indigo-500/15 blur-3xl"/>
+        <div className="absolute -bottom-10 left-1/4 h-64 w-64 rounded-full bg-sky-500/10 blur-3xl"/>
+      </div>
+
+      {/* Main SVG network pattern */}
+      <svg width="100%" height="100%" viewBox="0 0 900 520" className="absolute top-0 left-0 [transform:scale(1.12)]">
+        <defs>
+          <linearGradient id="nodeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+            <stop offset="0%" stopColor="#3B82F6" stopOpacity={1}/>
+            <stop offset="100%" stopColor="#2563EB" stopOpacity={1}/>
+          </linearGradient>
+
+          <linearGradient id="lineGradient" x1="0%" y1="0%" x2="100%" y2="0%">
+            <stop offset="0%" stopColor="#60A5FA" stopOpacity={0.28}/>
+            <stop offset="50%" stopColor="#3B82F6" stopOpacity={0.6}/>
+            <stop offset="100%" stopColor="#60A5FA" stopOpacity={0.28}/>
+          </linearGradient>
+        </defs>
+
+        {/* Subtle grid for depth */}
+        <g className="opacity-30">
+          {Array.from({ length: 18 }).map((_, i) => (<line key={`v-${i}`} x1={i * 50} y1={0} x2={i * 50} y2={520} stroke="#e5e7eb" strokeWidth="0.5"/>))}
+          {Array.from({ length: 12 }).map((_, i) => (<line key={`h-${i}`} x1={0} y1={i * 45} x2={900} y2={i * 45} stroke="#e5e7eb" strokeWidth="0.5"/>))}
+        </g>
+
+        {/* Connection Lines */}
+        <g>
+          <line x1="120" y1="80" x2="320" y2="180" stroke="url(#lineGradient)" strokeWidth="2"/>
+          <line x1="320" y1="180" x2="600" y2="140" stroke="url(#lineGradient)" strokeWidth="2"/>
+          <line x1="600" y1="140" x2="720" y2="340" stroke="url(#lineGradient)" strokeWidth="2"/>
+          <line x1="320" y1="180" x2="420" y2="420" stroke="url(#lineGradient)" strokeWidth="2"/>
+          <line x1="120" y1="80" x2="220" y2="320" stroke="url(#lineGradient)" strokeWidth="2"/>
+          <line x1="220" y1="320" x2="420" y2="420" stroke="url(#lineGradient)" strokeWidth="2"/>
+
+          <line x1="60" y1="260" x2="120" y2="80" stroke="url(#lineGradient)" strokeWidth="1.5"/>
+          <line x1="420" y1="420" x2="580" y2="470" stroke="url(#lineGradient)" strokeWidth="1.5"/>
+          <line x1="600" y1="140" x2="780" y2="80" stroke="url(#lineGradient)" strokeWidth="1.5"/>
+          <line x1="320" y1="180" x2="540" y2="260" stroke="url(#lineGradient)" strokeWidth="1.5"/>
+          <line x1="220" y1="320" x2="540" y2="260" stroke="url(#lineGradient)" strokeWidth="1.5"/>
+        </g>
+
+        {/* Network Nodes */}
+        <g>
+          <circle cx="320" cy="180" r="12" fill="url(#nodeGradient)" className="pulse-node">
+            <animate attributeName="r" values="12;15;12" dur="3s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="600" cy="140" r="10" fill="url(#nodeGradient)" className="pulse-node">
+            <animate attributeName="r" values="10;13;10" dur="3.5s" repeatCount="indefinite"/>
+          </circle>
+
+          <circle cx="120" cy="80" r="8" fill="#3B82F6" className="pulse-node">
+            <animate attributeName="r" values="8;11;8" dur="4s" begin="1s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="420" cy="420" r="8" fill="#3B82F6" className="pulse-node">
+            <animate attributeName="r" values="8;11;8" dur="4.5s" begin="2.5s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="720" cy="340" r="8" fill="#3B82F6" className="pulse-node">
+            <animate attributeName="r" values="8;11;8" dur="3.8s" begin="1.8s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="220" cy="320" r="8" fill="#3B82F6" className="pulse-node">
+            <animate attributeName="r" values="8;11;8" dur="4.2s" begin="0.5s" repeatCount="indefinite"/>
+          </circle>
+
+          <circle cx="60" cy="260" r="5" fill="#60A5FA" className="pulse-node">
+            <animate attributeName="r" values="5;7;5" dur="5s" begin="3s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="580" cy="470" r="5" fill="#60A5FA" className="pulse-node">
+            <animate attributeName="r" values="5;7;5" dur="5.5s" begin="4s" repeatCount="indefinite"/>
+          </circle>
+          <circle cx="780" cy="80" r="5" fill="#60A5FA" className="pulse-node">
+            <animate attributeName="r" values="5;7;5" dur="4.8s" begin="2s" repeatCount="indefinite"/>
+          </circle>
+
+          {/* Extra tiny detail nodes */}
+          <circle cx="200" cy="100" r="3" fill="#93C5FD"/>
+          <circle cx="380" cy="200" r="3" fill="#93C5FD"/>
+          <circle cx="150" cy="320" r="3" fill="#93C5FD"/>
+          <circle cx="500" cy="260" r="3" fill="#93C5FD"/>
+          <circle cx="660" cy="220" r="3" fill="#93C5FD"/>
+          <circle cx="740" cy="420" r="3" fill="#93C5FD"/>
+        </g>
+      </svg>
+
+      {/* Component-scoped CSS for subtle effects */}
+      <style>{`
+        .pulse-node {
+          filter: drop-shadow(0 0 8px rgba(37, 99, 235, 0.3));
+        }
+
+        @keyframes slow-pan {
+          0% {
+            transform: scale(1.08) translateY(0px);
+          }
+          50% {
+            transform: scale(1.1) translateY(-6px);
+          }
+          100% {
+            transform: scale(1.08) translateY(0px);
+          }
+        }
+
+        svg {
+          animation: slow-pan 18s ease-in-out infinite;
+        }
+
+        @media (max-width: 768px) {
+          svg {
+            transform: scale(1.15);
+          }
+        }
+      `}</style>
+    </div>);
+};

package/dist/templates/digitalagency/components/Portfolio.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare function Portfolio(): React.JSX.Element;
+//# sourceMappingURL=Portfolio.d.ts.map

package/dist/templates/digitalagency/components/Portfolio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Portfolio.d.ts","sourceRoot":"","sources":["../../../../src/templates/digitalagency/components/Portfolio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyF1B,wBAAgB,SAAS,sBA8DxB"}

package/dist/templates/digitalagency/components/Portfolio.js

@@ -0,0 +1,108 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PortfolioSimple } from "@nextworks/blocks-sections";
+// Default portfolio data without images - Digital Marketing Agency focused
+const defaultProjects = [
+    {
+        id: 1,
+        title: "TechStartup Growth Campaign",
+        category: "Digital Marketing",
+        industry: "Technology",
+        result: "+300% Leads",
+        description: "Comprehensive digital marketing campaign that increased qualified leads by 300% through targeted SEO, social media marketing, and conversion optimization strategies.",
+        tags: ["SEO", "Social Media", "PPC", "Analytics"],
+        color: "blue",
+        url: "#",
+    },
+    {
+        id: 2,
+        title: "E-Commerce Brand Launch",
+        category: "Brand Marketing",
+        industry: "Retail",
+        result: "+250% Revenue",
+        description: "Complete brand launch and digital marketing strategy for a new e-commerce platform, resulting in 250% revenue growth within the first 6 months.",
+        tags: ["Brand Strategy", "Content Marketing", "Influencer", "Email"],
+        color: "green",
+        url: "#",
+    },
+    {
+        id: 3,
+        title: "Healthcare Practice Expansion",
+        category: "Local Marketing",
+        industry: "Healthcare",
+        result: "+180% Patients",
+        description: "Local SEO and digital marketing campaign that helped a healthcare practice expand to three new locations and increase patient acquisition by 180%.",
+        tags: ["Local SEO", "Google Ads", "Reputation", "Content"],
+        color: "purple",
+        url: "#",
+    },
+    {
+        id: 4,
+        title: "SaaS Product Launch",
+        category: "B2B Marketing",
+        industry: "Software",
+        result: "+400% Signups",
+        description: "Strategic B2B marketing campaign for a SaaS product launch, achieving 400% increase in trial signups through targeted content marketing and account-based marketing.",
+        tags: ["B2B Strategy", "Content", "LinkedIn Ads", "Webinars"],
+        color: "indigo",
+        url: "#",
+    },
+    {
+        id: 5,
+        title: "Restaurant Chain Rebrand",
+        category: "Brand Marketing",
+        industry: "Food & Beverage",
+        result: "+220% Foot Traffic",
+        description: "Complete rebrand and digital marketing transformation for a restaurant chain, resulting in 220% increase in foot traffic and 150% growth in online orders.",
+        tags: ["Rebranding", "Social Media", "Local SEO", "Delivery"],
+        color: "red",
+        url: "#",
+    },
+    {
+        id: 6,
+        title: "Fitness App User Acquisition",
+        category: "Mobile Marketing",
+        industry: "Health & Fitness",
+        result: "+500% Downloads",
+        description: "Mobile-first marketing campaign that achieved 500% increase in app downloads through app store optimization, influencer partnerships, and targeted social media advertising.",
+        tags: ["ASO", "Influencer", "Social Ads", "Retention"],
+        color: "yellow",
+        url: "#",
+    },
+];
+const defaultFilters = [
+    "All Projects",
+    "Digital Marketing",
+    "Brand Marketing",
+    "B2B Marketing",
+    "Local Marketing",
+    "Mobile Marketing",
+];
+// Upgraded Portfolio Preset Component
+export function Portfolio() {
+    return (_jsx("section", { id: "portfolio", children: _jsx(PortfolioSimple, { enableMotion: true, projects: defaultProjects, filters: defaultFilters, sectionTitle: "Our Portfolio", sectionSubtitle: "Discover our successful projects that have transformed businesses across various industries with innovative digital solutions.", ctaTitle: "Ready to Start Your Project?", ctaDescription: "Let's work together to create something amazing that drives real results for your business.", section: {
+                className: "py-16 md:py-24 bg-background",
+            }, title: {
+                className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-[var(--heading-fg)]",
+            }, subtitle: {
+                className: "text-xl md:text-2xl font-inter text-[var(--subheading-fg)] max-w-2xl mx-auto leading-relaxed",
+            }, ctaTitleStyle: {
+                className: "text-2xl md:text-3xl font-bold text-[var(--heading-fg)]",
+            }, ctaDescriptionStyle: {
+                className: "text-lg md:text-xl text-[var(--subheading-fg)] max-w-md mx-auto",
+            }, tagStyle: {
+                className: "px-2 py-1 text-xs rounded-full border-[var(--badge-border)] text-[var(--badge-fg)] bg-[var(--badge-bg)]",
+            }, ctaSection: {
+                className: "space-y-6 text-center mt-16 pt-12 border-t border-[var(--footer-border)]",
+            }, cta1Label: "Start Your Project", cta1Href: "#contact", cta2Label: "View All Projects", cta2Href: "#portfolio", cta1Button: {
+                className: "h-10 px-6 flex items-center justify-center font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5 [--btn-bg:theme(colors.fuchsia.600)] hover:[--btn-hover-bg:theme(colors.fuchsia.700)] [--btn-fg:theme(colors.white)] hover:[--btn-hover-fg:theme(colors.white)]",
+            }, cta2Button: {
+                className: "h-10 px-6 flex items-center justify-center font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5 border-2 [--btn-bg:transparent] [--btn-fg:theme(colors.fuchsia.700)] [--btn-border:theme(colors.fuchsia.600)] hover:[--btn-hover-bg:theme(colors.fuchsia.600)] hover:[--btn-hover-fg:theme(colors.white)] dark:[--btn-fg:theme(colors.fuchsia.400)] dark:[--btn-border:theme(colors.fuchsia.500)] dark:hover:[--btn-hover-bg:theme(colors.fuchsia.500)] dark:hover:[--btn-hover-fg:theme(colors.white)]",
+            }, onProjectClick: (project) => {
+                console.log("Project clicked:", project);
+            }, onPrimaryCtaClick: () => {
+                console.log("CTA 1 clicked:");
+            }, onSecondaryCtaClick: () => {
+                console.log("CTA 2 clicked:");
+            }, ariaLabel: "Portfolio showcase section" }) }));
+}

package/dist/templates/digitalagency/components/Portfolio.jsx

@@ -0,0 +1,110 @@
+"use client";
+import React from "react";
+import { PortfolioSimple } from "@nextworks/blocks-sections";
+// Default portfolio data without images - Digital Marketing Agency focused
+const defaultProjects = [
+    {
+        id: 1,
+        title: "TechStartup Growth Campaign",
+        category: "Digital Marketing",
+        industry: "Technology",
+        result: "+300% Leads",
+        description: "Comprehensive digital marketing campaign that increased qualified leads by 300% through targeted SEO, social media marketing, and conversion optimization strategies.",
+        tags: ["SEO", "Social Media", "PPC", "Analytics"],
+        color: "blue",
+        url: "#",
+    },
+    {
+        id: 2,
+        title: "E-Commerce Brand Launch",
+        category: "Brand Marketing",
+        industry: "Retail",
+        result: "+250% Revenue",
+        description: "Complete brand launch and digital marketing strategy for a new e-commerce platform, resulting in 250% revenue growth within the first 6 months.",
+        tags: ["Brand Strategy", "Content Marketing", "Influencer", "Email"],
+        color: "green",
+        url: "#",
+    },
+    {
+        id: 3,
+        title: "Healthcare Practice Expansion",
+        category: "Local Marketing",
+        industry: "Healthcare",
+        result: "+180% Patients",
+        description: "Local SEO and digital marketing campaign that helped a healthcare practice expand to three new locations and increase patient acquisition by 180%.",
+        tags: ["Local SEO", "Google Ads", "Reputation", "Content"],
+        color: "purple",
+        url: "#",
+    },
+    {
+        id: 4,
+        title: "SaaS Product Launch",
+        category: "B2B Marketing",
+        industry: "Software",
+        result: "+400% Signups",
+        description: "Strategic B2B marketing campaign for a SaaS product launch, achieving 400% increase in trial signups through targeted content marketing and account-based marketing.",
+        tags: ["B2B Strategy", "Content", "LinkedIn Ads", "Webinars"],
+        color: "indigo",
+        url: "#",
+    },
+    {
+        id: 5,
+        title: "Restaurant Chain Rebrand",
+        category: "Brand Marketing",
+        industry: "Food & Beverage",
+        result: "+220% Foot Traffic",
+        description: "Complete rebrand and digital marketing transformation for a restaurant chain, resulting in 220% increase in foot traffic and 150% growth in online orders.",
+        tags: ["Rebranding", "Social Media", "Local SEO", "Delivery"],
+        color: "red",
+        url: "#",
+    },
+    {
+        id: 6,
+        title: "Fitness App User Acquisition",
+        category: "Mobile Marketing",
+        industry: "Health & Fitness",
+        result: "+500% Downloads",
+        description: "Mobile-first marketing campaign that achieved 500% increase in app downloads through app store optimization, influencer partnerships, and targeted social media advertising.",
+        tags: ["ASO", "Influencer", "Social Ads", "Retention"],
+        color: "yellow",
+        url: "#",
+    },
+];
+const defaultFilters = [
+    "All Projects",
+    "Digital Marketing",
+    "Brand Marketing",
+    "B2B Marketing",
+    "Local Marketing",
+    "Mobile Marketing",
+];
+// Upgraded Portfolio Preset Component
+export function Portfolio() {
+    return (<section id="portfolio">
+      <PortfolioSimple enableMotion={true} projects={defaultProjects} filters={defaultFilters} sectionTitle="Our Portfolio" sectionSubtitle="Discover our successful projects that have transformed businesses across various industries with innovative digital solutions." ctaTitle="Ready to Start Your Project?" ctaDescription="Let's work together to create something amazing that drives real results for your business." section={{
+            className: "py-16 md:py-24 bg-background",
+        }} title={{
+            className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-[var(--heading-fg)]",
+        }} subtitle={{
+            className: "text-xl md:text-2xl font-inter text-[var(--subheading-fg)] max-w-2xl mx-auto leading-relaxed",
+        }} ctaTitleStyle={{
+            className: "text-2xl md:text-3xl font-bold text-[var(--heading-fg)]",
+        }} ctaDescriptionStyle={{
+            className: "text-lg md:text-xl text-[var(--subheading-fg)] max-w-md mx-auto",
+        }} tagStyle={{
+            className: "px-2 py-1 text-xs rounded-full border-[var(--badge-border)] text-[var(--badge-fg)] bg-[var(--badge-bg)]",
+        }} ctaSection={{
+            className: "space-y-6 text-center mt-16 pt-12 border-t border-[var(--footer-border)]",
+        }} cta1Label="Start Your Project" cta1Href="#contact" cta2Label="View All Projects" cta2Href="#portfolio" cta1Button={{
+            className: "h-10 px-6 flex items-center justify-center font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5 [--btn-bg:theme(colors.fuchsia.600)] hover:[--btn-hover-bg:theme(colors.fuchsia.700)] [--btn-fg:theme(colors.white)] hover:[--btn-hover-fg:theme(colors.white)]",
+        }} cta2Button={{
+            className: "h-10 px-6 flex items-center justify-center font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5 border-2 [--btn-bg:transparent] [--btn-fg:theme(colors.fuchsia.700)] [--btn-border:theme(colors.fuchsia.600)] hover:[--btn-hover-bg:theme(colors.fuchsia.600)] hover:[--btn-hover-fg:theme(colors.white)] dark:[--btn-fg:theme(colors.fuchsia.400)] dark:[--btn-border:theme(colors.fuchsia.500)] dark:hover:[--btn-hover-bg:theme(colors.fuchsia.500)] dark:hover:[--btn-hover-fg:theme(colors.white)]",
+        }} onProjectClick={(project) => {
+            console.log("Project clicked:", project);
+        }} onPrimaryCtaClick={() => {
+            console.log("CTA 1 clicked:");
+        }} onSecondaryCtaClick={() => {
+            console.log("CTA 2 clicked:");
+        }} ariaLabel="Portfolio showcase section"/>
+    </section>);
+}

package/dist/templates/digitalagency/components/Pricing.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare function Pricing(): React.JSX.Element;
+//# sourceMappingURL=Pricing.d.ts.map

package/dist/templates/digitalagency/components/Pricing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pricing.d.ts","sourceRoot":"","sources":["../../../../src/templates/digitalagency/components/Pricing.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAsD1B,wBAAgB,OAAO,sBAyDtB"}

package/dist/templates/digitalagency/components/Pricing.js

@@ -0,0 +1,82 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Pricing as SharedPricing } from "@nextworks/blocks-sections";
+const AgencyPricingData = [
+    {
+        pricingPlanHeaderText: "Starter",
+        pricingPlanPrice: "$2,999",
+        pricingPlanFeatures: [
+            "5-page custom website",
+            "Mobile-responsive design",
+            "Basic SEO optimization",
+            "Contact form integration",
+            "2 rounds of revisions",
+            "1 month post-launch support",
+        ],
+        pricingPlanCTALabel: "Get Started",
+        pricingPlanCTAHref: "#contact",
+    },
+    {
+        pricingPlanHeaderText: "Professional",
+        pricingPlanPrice: "$5,999",
+        pricingPlanFeatures: [
+            "10-page custom website",
+            "Advanced responsive design",
+            "Comprehensive SEO setup",
+            "CMS integration",
+            "Analytics & tracking setup",
+            "Social media integration",
+            "3 rounds of revisions",
+            "3 months ongoing support",
+        ],
+        pricingPlanCTALabel: "Most Popular",
+        pricingPlanCTAHref: "#contact",
+        isPopular: true,
+    },
+    {
+        pricingPlanHeaderText: "Enterprise",
+        pricingPlanPrice: "Custom Quote",
+        pricingPlanFeatures: [
+            "Unlimited pages",
+            "Custom functionality",
+            "E-commerce integration",
+            "Advanced SEO strategy",
+            "Performance optimization",
+            "Third-party integrations",
+            "Priority support",
+            "Dedicated project manager",
+            "6 months ongoing support",
+        ],
+        pricingPlanCTALabel: "Contact Sales",
+        pricingPlanCTAHref: "#contact",
+    },
+];
+export function Pricing() {
+    return (_jsx("section", { id: "pricing", children: _jsx(SharedPricing, { pricingPlans: AgencyPricingData, pricingHeadingText: "Choose Your Plan", section: {
+                className: "py-16 md:py-20 lg:py-24 bg-fuchsia-50 dark:bg-gray-800",
+            }, container: {
+                className: "max-w-7xl mx-auto px-6",
+            }, heading: {
+                className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-center text-gray-800 dark:text-white mb-8",
+            }, grid: {
+                className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mt-8",
+            }, card: {
+                className: "relative bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200",
+            }, header: {
+                className: "p-6 text-center border-b border-gray-200 dark:border-gray-700",
+            }, title: {
+                className: "text-xl font-bold font-poppins text-gray-800 dark:text-white mb-2",
+            }, price: {
+                className: "text-3xl font-bold font-poppins text-fuchsia-600 dark:text-fuchsia-400 mb-4",
+            }, features: {
+                className: "p-6 space-y-3 font-inter",
+            }, featureItem: {
+                className: "flex items-center text-gray-600 dark:text-gray-300 text-sm",
+            }, cta: {
+                variant: "default",
+                size: "lg",
+                className: "w-full bg-fuchsia-600 hover:bg-fuchsia-700 dark:bg-fuchsia-600 dark:hover:bg-fuchsia-700 text-white hover:text-white font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5",
+            }, popularBadge: {
+                className: "absolute -top-3 left-1/2 transform -translate-x-1/2 bg-fuchsia-600 text-white px-4 py-1 rounded-full text-sm font-medium",
+            }, ariaLabel: "Pricing section" }) }));
+}

package/dist/templates/digitalagency/components/Pricing.jsx

@@ -0,0 +1,84 @@
+"use client";
+import React from "react";
+import { Pricing as SharedPricing } from "@nextworks/blocks-sections";
+const AgencyPricingData = [
+    {
+        pricingPlanHeaderText: "Starter",
+        pricingPlanPrice: "$2,999",
+        pricingPlanFeatures: [
+            "5-page custom website",
+            "Mobile-responsive design",
+            "Basic SEO optimization",
+            "Contact form integration",
+            "2 rounds of revisions",
+            "1 month post-launch support",
+        ],
+        pricingPlanCTALabel: "Get Started",
+        pricingPlanCTAHref: "#contact",
+    },
+    {
+        pricingPlanHeaderText: "Professional",
+        pricingPlanPrice: "$5,999",
+        pricingPlanFeatures: [
+            "10-page custom website",
+            "Advanced responsive design",
+            "Comprehensive SEO setup",
+            "CMS integration",
+            "Analytics & tracking setup",
+            "Social media integration",
+            "3 rounds of revisions",
+            "3 months ongoing support",
+        ],
+        pricingPlanCTALabel: "Most Popular",
+        pricingPlanCTAHref: "#contact",
+        isPopular: true,
+    },
+    {
+        pricingPlanHeaderText: "Enterprise",
+        pricingPlanPrice: "Custom Quote",
+        pricingPlanFeatures: [
+            "Unlimited pages",
+            "Custom functionality",
+            "E-commerce integration",
+            "Advanced SEO strategy",
+            "Performance optimization",
+            "Third-party integrations",
+            "Priority support",
+            "Dedicated project manager",
+            "6 months ongoing support",
+        ],
+        pricingPlanCTALabel: "Contact Sales",
+        pricingPlanCTAHref: "#contact",
+    },
+];
+export function Pricing() {
+    return (<section id="pricing">
+      <SharedPricing pricingPlans={AgencyPricingData} pricingHeadingText="Choose Your Plan" section={{
+            className: "py-16 md:py-20 lg:py-24 bg-fuchsia-50 dark:bg-gray-800",
+        }} container={{
+            className: "max-w-7xl mx-auto px-6",
+        }} heading={{
+            className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-center text-gray-800 dark:text-white mb-8",
+        }} grid={{
+            className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mt-8",
+        }} card={{
+            className: "relative bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200",
+        }} header={{
+            className: "p-6 text-center border-b border-gray-200 dark:border-gray-700",
+        }} title={{
+            className: "text-xl font-bold font-poppins text-gray-800 dark:text-white mb-2",
+        }} price={{
+            className: "text-3xl font-bold font-poppins text-fuchsia-600 dark:text-fuchsia-400 mb-4",
+        }} features={{
+            className: "p-6 space-y-3 font-inter",
+        }} featureItem={{
+            className: "flex items-center text-gray-600 dark:text-gray-300 text-sm",
+        }} cta={{
+            variant: "default",
+            size: "lg",
+            className: "w-full bg-fuchsia-600 hover:bg-fuchsia-700 dark:bg-fuchsia-600 dark:hover:bg-fuchsia-700 text-white hover:text-white font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5",
+        }} popularBadge={{
+            className: "absolute -top-3 left-1/2 transform -translate-x-1/2 bg-fuchsia-600 text-white px-4 py-1 rounded-full text-sm font-medium",
+        }} ariaLabel="Pricing section"/>
+    </section>);
+}

package/dist/templates/digitalagency/components/Process.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare function Process(): React.JSX.Element;
+//# sourceMappingURL=Process.d.ts.map

package/dist/templates/digitalagency/components/Process.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Process.d.ts","sourceRoot":"","sources":["../../../../src/templates/digitalagency/components/Process.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AA8B1B,wBAAgB,OAAO,sBA0BtB"}

package/dist/templates/digitalagency/components/Process.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ProcessTimeline } from "@nextworks/blocks-sections";
+const agencySteps = [
+    {
+        stepNumber: 1,
+        title: "Discovery Call",
+        description: "Understanding your goals and requirements",
+        icon: "🔍",
+    },
+    {
+        stepNumber: 2,
+        title: "Strategy & Design",
+        description: "Custom mockups and project roadmap",
+        icon: "🎨",
+    },
+    {
+        stepNumber: 3,
+        title: "Development",
+        description: "Building your site with regular updates",
+        icon: "⚡",
+    },
+    {
+        stepNumber: 4,
+        title: "Launch & Support",
+        description: "Going live with ongoing maintenance",
+        icon: "🚀",
+    },
+];
+export function Process() {
+    return (_jsx("section", { id: "process", children: _jsx(ProcessTimeline, { steps: agencySteps, heading: "How We Work", subheading: "Our proven 4-step process ensures your project delivers real results, on time and within budget.", section: {
+                className: "py-16 md:py-20 bg-fuchsia-50 dark:bg-gray-900 [--process-step-bg:theme(colors.fuchsia.600)] [--process-step-fg:theme(colors.white)] [--process-connector:theme(colors.gray.300)] dark:[--process-connector:theme(colors.gray.600)]",
+            }, container: { className: "max-w-6xl mx-auto px-6" }, headingStyle: {
+                className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-gray-800 dark:text-white leading-tight",
+            }, subheadingStyle: {
+                className: "text-xl md:text-2xl font-inter text-gray-600 dark:text-gray-300 max-w-2xl mx-auto leading-relaxed",
+            }, connectingLine: undefined, stepCircle: undefined, ariaLabel: "Process timeline section" }) }));
+}

package/dist/templates/digitalagency/components/Process.jsx

@@ -0,0 +1,40 @@
+"use client";
+import React from "react";
+import { ProcessTimeline } from "@nextworks/blocks-sections";
+const agencySteps = [
+    {
+        stepNumber: 1,
+        title: "Discovery Call",
+        description: "Understanding your goals and requirements",
+        icon: "🔍",
+    },
+    {
+        stepNumber: 2,
+        title: "Strategy & Design",
+        description: "Custom mockups and project roadmap",
+        icon: "🎨",
+    },
+    {
+        stepNumber: 3,
+        title: "Development",
+        description: "Building your site with regular updates",
+        icon: "⚡",
+    },
+    {
+        stepNumber: 4,
+        title: "Launch & Support",
+        description: "Going live with ongoing maintenance",
+        icon: "🚀",
+    },
+];
+export function Process() {
+    return (<section id="process">
+      <ProcessTimeline steps={agencySteps} heading="How We Work" subheading="Our proven 4-step process ensures your project delivers real results, on time and within budget." section={{
+            className: "py-16 md:py-20 bg-fuchsia-50 dark:bg-gray-900 [--process-step-bg:theme(colors.fuchsia.600)] [--process-step-fg:theme(colors.white)] [--process-connector:theme(colors.gray.300)] dark:[--process-connector:theme(colors.gray.600)]",
+        }} container={{ className: "max-w-6xl mx-auto px-6" }} headingStyle={{
+            className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-gray-800 dark:text-white leading-tight",
+        }} subheadingStyle={{
+            className: "text-xl md:text-2xl font-inter text-gray-600 dark:text-gray-300 max-w-2xl mx-auto leading-relaxed",
+        }} connectingLine={undefined} stepCircle={undefined} ariaLabel="Process timeline section"/>
+    </section>);
+}

package/dist/templates/digitalagency/components/Services.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare function Services(): React.JSX.Element;
+//# sourceMappingURL=Services.d.ts.map

package/dist/templates/digitalagency/components/Services.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Services.d.ts","sourceRoot":"","sources":["../../../../src/templates/digitalagency/components/Services.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AA4B1B,wBAAgB,QAAQ,sBAwBvB"}