nextworks 0.2.0-alpha.11 → 0.2.0-alpha.13

package/dist/kits/blocks/app/templates/digitalagency/components/Testimonials.tsx

@@ -1,65 +1,65 @@
-"use client";
-
-import React from "react";
-import { Testimonials as SharedTestimonials } from "@/components/sections/Testimonials";
-
-export function Testimonials() {
-  return (
-    <section id="testimonials">
-      <SharedTestimonials
-        testimonialSectionHeader="What Our Customers Say"
-        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" }}
-        header={{ className: "text-center mb-12 md:mb-16" }}
-        heading={{
-          className:
-            "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-gray-800 dark:text-white",
-        }}
-        grid={{
-          className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8",
-        }}
-        card={{
-          className:
-            "bg-white dark:bg-gray-900 p-6 rounded-lg shadow-md transition-transform duration-200 hover:-translate-y-1 border border-fuchsia-200/60 dark:border-fuchsia-800/40",
-        }}
-        text={{
-          className:
-            "text-gray-700 dark:text-gray-300 text-base leading-relaxed italic font-inter",
-        }}
-        author={{
-          className:
-            "text-gray-600 dark:text-gray-400 text-sm font-medium font-poppins",
-        }}
-        avatar={{
-          className:
-            "w-12 h-12 bg-fuchsia-600 text-white rounded-full flex items-center justify-center text-lg font-bold",
-        }}
-        avatarText={{
-          className: "text-white font-bold",
-        }}
-        testimonials={[
-          {
-            testimonialText:
-              "Nexus Digital transformed our online presence completely.",
-            testimonialAuthor: "- Sarah Chen, CEO of TechFlow",
-            testimonialAuthorInitials: "SC",
-          },
-          {
-            testimonialText: "The team delivered beyond expectations.",
-            testimonialAuthor: "- Marcus Rodriguez, GreenLeaf Wellness",
-            testimonialAuthorInitials: "MR",
-          },
-          {
-            testimonialText:
-              "Professional, fast, and results-driven. They understood our vision and brought it to life perfectly.",
-            testimonialAuthor: "- Jennifer Walsh, UrbanFit",
-            testimonialAuthorInitials: "JW",
-          },
-        ]}
-        ariaLabel="Testimonials section"
-      />
-    </section>
-  );
-}
+"use client";
+
+import React from "react";
+import { Testimonials as SharedTestimonials } from "@/components/sections/Testimonials";
+
+export function Testimonials() {
+  return (
+    <section id="testimonials">
+      <SharedTestimonials
+        testimonialSectionHeader="What Our Customers Say"
+        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" }}
+        header={{ className: "text-center mb-12 md:mb-16" }}
+        heading={{
+          className:
+            "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins text-gray-800 dark:text-white",
+        }}
+        grid={{
+          className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8",
+        }}
+        card={{
+          className:
+            "bg-white dark:bg-gray-900 p-6 rounded-lg shadow-md transition-transform duration-200 hover:-translate-y-1 border border-fuchsia-200/60 dark:border-fuchsia-800/40",
+        }}
+        text={{
+          className:
+            "text-gray-700 dark:text-gray-300 text-base leading-relaxed italic font-inter",
+        }}
+        author={{
+          className:
+            "text-gray-600 dark:text-gray-400 text-sm font-medium font-poppins",
+        }}
+        avatar={{
+          className:
+            "w-12 h-12 bg-fuchsia-600 text-white rounded-full flex items-center justify-center text-lg font-bold",
+        }}
+        avatarText={{
+          className: "text-white font-bold",
+        }}
+        testimonials={[
+          {
+            testimonialText:
+              "Nexus Digital transformed our online presence completely.",
+            testimonialAuthor: "- Sarah Chen, CEO of TechFlow",
+            testimonialAuthorInitials: "SC",
+          },
+          {
+            testimonialText: "The team delivered beyond expectations.",
+            testimonialAuthor: "- Marcus Rodriguez, GreenLeaf Wellness",
+            testimonialAuthorInitials: "MR",
+          },
+          {
+            testimonialText:
+              "Professional, fast, and results-driven. They understood our vision and brought it to life perfectly.",
+            testimonialAuthor: "- Jennifer Walsh, UrbanFit",
+            testimonialAuthorInitials: "JW",
+          },
+        ]}
+        ariaLabel="Testimonials section"
+      />
+    </section>
+  );
+}

package/dist/kits/blocks/app/templates/digitalagency/page.tsx

@@ -1,38 +1,38 @@
-"use client";
-
-import React from "react";
-import { Navbar } from "./components/Navbar";
-import { Hero } from "./components/Hero";
-import { Services } from "./components/Services";
-import { Testimonials } from "./components/Testimonials";
-import { Process } from "./components/Process";
-import { Portfolio } from "./components/Portfolio";
-import { About } from "./components/About";
-import { Team } from "./components/Team";
-import { Pricing } from "./components/Pricing";
-import { CTA } from "./components/CTA";
-import { Contact } from "./components/Contact";
-import { Footer } from "./components/Footer";
-
-import { PresetThemeVars } from "./PresetThemeVars";
-
-export default function Page() {
-  return (
-    <PresetThemeVars>
-      <main>
-        <Navbar />
-        <Hero />
-        <Services />
-        <Portfolio />
-        <Testimonials />
-        <Process />
-        <About />
-        <Team />
-        <Pricing />
-        <CTA />
-        <Contact />
-        <Footer />
-      </main>
-    </PresetThemeVars>
-  );
-}
+"use client";
+
+import React from "react";
+import { Navbar } from "./components/Navbar";
+import { Hero } from "./components/Hero";
+import { Services } from "./components/Services";
+import { Testimonials } from "./components/Testimonials";
+import { Process } from "./components/Process";
+import { Portfolio } from "./components/Portfolio";
+import { About } from "./components/About";
+import { Team } from "./components/Team";
+import { Pricing } from "./components/Pricing";
+import { CTA } from "./components/CTA";
+import { Contact } from "./components/Contact";
+import { Footer } from "./components/Footer";
+
+import { PresetThemeVars } from "./PresetThemeVars";
+
+export default function Page() {
+  return (
+    <PresetThemeVars>
+      <main>
+        <Navbar />
+        <Hero />
+        <Services />
+        <Portfolio />
+        <Testimonials />
+        <Process />
+        <About />
+        <Team />
+        <Pricing />
+        <CTA />
+        <Contact />
+        <Footer />
+      </main>
+    </PresetThemeVars>
+  );
+}

package/dist/kits/blocks/app/templates/gallery/PresetThemeVars.tsx

@@ -1,84 +1,84 @@
-import React from "react";
-import { cn } from "@/lib/utils";
-
-type Props = React.PropsWithChildren<{ className?: string }>;
-
-/**
- * Gallery template token-bridge wrapper.
- *
- * Maps component-level CSS variables (btn, input, card, etc.) to the
- * EnhancedThemeProvider token variables applied on :root (e.g., --primary,
- * --foreground, --card, --ring). Colors are driven by the selected Color Theme, not a fixed preset palette.
- */
-export function PresetThemeVars({ className, children }: Props) {
-  return (
-    <div
-      className={cn(
-        // Buttons (leave bg/fg unset by default so tokenized variants can apply; set ring here)
-        "[--btn-ring:var(--ring)]",
-
-        // Inputs
-        "[--input-bg:var(--background)]",
-        "[--input-fg:var(--foreground)]",
-        "[--input-placeholder:var(--muted-foreground)]",
-        "[--input-border:var(--input)]",
-        "[--input-focus-ring:var(--ring)]",
-        "[--input-ring-offset:var(--background)]",
-
-        // Cards
-        "[--card-bg:var(--card)]",
-        "[--card-fg:var(--card-foreground)]",
-        "[--card-title-fg:var(--foreground)]",
-        "[--card-muted-fg:var(--muted-foreground)]",
-        "[--card-border:var(--border)]",
-        "[--card-shadow:0_6px_20px_rgba(0,0,0,0.06)]",
-
-        // Badges/Chips (align to accent; active uses primary)
-        "[--badge-bg:var(--accent)]",
-        "[--badge-fg:var(--accent-foreground)]",
-        "[--badge-border:var(--border)]",
-        "[--badge-active-bg:var(--primary)]",
-        "[--badge-active-fg:var(--primary-foreground)]",
-        "[--badge-active-border:var(--primary)]",
-
-        // Typography helpers
-        "[--heading-fg:var(--foreground)]",
-        "[--subheading-fg:var(--muted-foreground)]",
-        "[--description-fg:var(--foreground)]",
-
-        // Process timeline
-        "[--process-step-bg:var(--primary)]",
-        "[--process-step-fg:var(--primary-foreground)]",
-        "[--process-connector:var(--border)]",
-
-        // Footer
-        "[--footer-bg:transparent]",
-        "[--footer-fg:var(--foreground)]",
-        "[--footer-heading-fg:var(--foreground)]",
-        "[--footer-link-fg:var(--muted-foreground)]",
-        "[--footer-link-hover-fg:var(--primary)]",
-        "[--footer-link-hover-bg:color-mix(in oklab, var(--primary) 12%, transparent)]",
-        "[--footer-muted-fg:var(--muted-foreground)]",
-        "[--footer-border:var(--border)]",
-
-        // Table (optional)
-        "[--table-fg:inherit]",
-        "[--table-muted-fg:var(--muted-foreground)]",
-        "[--table-head-fg:var(--foreground)]",
-        "[--table-border:var(--border)]",
-        "[--table-row-hover-bg:var(--muted)]",
-
-        // Navbar
-        "[--navbar-toggle-bg:var(--background)]",
-        "[--navbar-hover-bg:color-mix(in oklab, var(--primary) 12%, transparent)]",
-        "[--navbar-ring:var(--ring)]",
-        "[--navbar-border:var(--border)]",
-        "[--navbar-accent:var(--foreground)]",
-
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
+import React from "react";
+import { cn } from "@/lib/utils";
+
+type Props = React.PropsWithChildren<{ className?: string }>;
+
+/**
+ * Gallery template token-bridge wrapper.
+ *
+ * Maps component-level CSS variables (btn, input, card, etc.) to the
+ * EnhancedThemeProvider token variables applied on :root (e.g., --primary,
+ * --foreground, --card, --ring). Colors are driven by the selected Color Theme, not a fixed preset palette.
+ */
+export function PresetThemeVars({ className, children }: Props) {
+  return (
+    <div
+      className={cn(
+        // Buttons (leave bg/fg unset by default so tokenized variants can apply; set ring here)
+        "[--btn-ring:var(--ring)]",
+
+        // Inputs
+        "[--input-bg:var(--background)]",
+        "[--input-fg:var(--foreground)]",
+        "[--input-placeholder:var(--muted-foreground)]",
+        "[--input-border:var(--input)]",
+        "[--input-focus-ring:var(--ring)]",
+        "[--input-ring-offset:var(--background)]",
+
+        // Cards
+        "[--card-bg:var(--card)]",
+        "[--card-fg:var(--card-foreground)]",
+        "[--card-title-fg:var(--foreground)]",
+        "[--card-muted-fg:var(--muted-foreground)]",
+        "[--card-border:var(--border)]",
+        "[--card-shadow:0_6px_20px_rgba(0,0,0,0.06)]",
+
+        // Badges/Chips (align to accent; active uses primary)
+        "[--badge-bg:var(--accent)]",
+        "[--badge-fg:var(--accent-foreground)]",
+        "[--badge-border:var(--border)]",
+        "[--badge-active-bg:var(--primary)]",
+        "[--badge-active-fg:var(--primary-foreground)]",
+        "[--badge-active-border:var(--primary)]",
+
+        // Typography helpers
+        "[--heading-fg:var(--foreground)]",
+        "[--subheading-fg:var(--muted-foreground)]",
+        "[--description-fg:var(--foreground)]",
+
+        // Process timeline
+        "[--process-step-bg:var(--primary)]",
+        "[--process-step-fg:var(--primary-foreground)]",
+        "[--process-connector:var(--border)]",
+
+        // Footer
+        "[--footer-bg:transparent]",
+        "[--footer-fg:var(--foreground)]",
+        "[--footer-heading-fg:var(--foreground)]",
+        "[--footer-link-fg:var(--muted-foreground)]",
+        "[--footer-link-hover-fg:var(--primary)]",
+        "[--footer-link-hover-bg:color-mix(in oklab, var(--primary) 12%, transparent)]",
+        "[--footer-muted-fg:var(--muted-foreground)]",
+        "[--footer-border:var(--border)]",
+
+        // Table (optional)
+        "[--table-fg:inherit]",
+        "[--table-muted-fg:var(--muted-foreground)]",
+        "[--table-head-fg:var(--foreground)]",
+        "[--table-border:var(--border)]",
+        "[--table-row-hover-bg:var(--muted)]",
+
+        // Navbar
+        "[--navbar-toggle-bg:var(--background)]",
+        "[--navbar-hover-bg:color-mix(in oklab, var(--primary) 12%, transparent)]",
+        "[--navbar-ring:var(--ring)]",
+        "[--navbar-border:var(--border)]",
+        "[--navbar-accent:var(--foreground)]",
+
+        className,
+      )}
+    >
+      {children}
+    </div>
+  );
+}

package/dist/kits/blocks/app/templates/productlaunch/PresetThemeVars.tsx

@@ -1,75 +1,75 @@
-import React from "react";
-import { cn } from "@/lib/utils";
-
-type Props = React.PropsWithChildren<{ className?: string }>;
-
-/**
- * ProductLaunch template theme variables wrapper.
- * Not used by default for the ProductLaunch template.
- *
- * Sets a small CSS variable contract consumed by shared components
- * (Buttons, Inputs, Cards, Badges, Footer, Table, etc.).
- *
- * You can override any variable per-section by re-declaring it on
- * that section/container.
- */
-export function PresetThemeVars({ className, children }: Props) {
-  return (
-    <div
-      className={cn(
-        // Button ring shared across template
-        "[--btn-ring:theme(colors.purple.500)] dark:[--btn-ring:theme(colors.purple.400)]",
-
-        // Inputs (Contact)
-        "[--input-bg:theme(colors.white)] dark:[--input-bg:theme(colors.gray.900)]",
-        "[--input-fg:theme(colors.gray.900)] dark:[--input-fg:theme(colors.gray.100)]",
-        "[--input-placeholder:theme(colors.gray.400)] dark:[--input-placeholder:theme(colors.gray.500)]",
-        "[--input-border:theme(colors.purple.200)] dark:[--input-border:theme(colors.purple.700)]",
-        "[--input-focus-ring:theme(colors.purple.500)] dark:[--input-focus-ring:theme(colors.purple.400)]",
-        "[--input-ring-offset:theme(colors.white)] dark:[--input-ring-offset:theme(colors.gray.900)]",
-
-        // Cards (Features, ServicesGrid, Pricing, Testimonials, etc.)
-        "[--card-bg:theme(colors.white)] dark:[--card-bg:theme(colors.gray.900)]",
-        "[--card-fg:theme(colors.gray.900)] dark:[--card-fg:theme(colors.gray.100)]",
-        "[--card-title-fg:theme(colors.gray.900)] dark:[--card-title-fg:theme(colors.gray.100)]",
-        "[--card-muted-fg:theme(colors.gray.500)] dark:[--card-muted-fg:theme(colors.gray.400)]",
-        "[--card-border:theme(colors.gray.200)] dark:[--card-border:theme(colors.gray.800)]",
-        "[--card-shadow:0_6px_20px_rgba(0,0,0,0.06)]",
-
-        // Badges/Chips (Portfolio filters/tags, Pricing badge, Testimonials avatar)
-        "[--badge-bg:theme(colors.purple.50)] dark:[--badge-bg:theme(colors.purple.950)]",
-        "[--badge-fg:theme(colors.purple.700)] dark:[--badge-fg:theme(colors.purple.300)]",
-        "[--badge-border:theme(colors.purple.200)] dark:[--badge-border:theme(colors.purple.800)]",
-        "[--badge-active-bg:theme(colors.purple.600)] dark:[--badge-active-bg:theme(colors.purple.500)]",
-        "[--badge-active-fg:theme(colors.white)] dark:[--badge-active-fg:theme(colors.white)]",
-        "[--badge-active-border:theme(colors.purple.700)] dark:[--badge-active-border:theme(colors.purple.400)]",
-
-        // Headings/Subheadings
-        "[--heading-fg:theme(colors.gray.900)] dark:[--heading-fg:theme(colors.gray.100)]",
-        "[--subheading-fg:theme(colors.gray.600)] dark:[--subheading-fg:theme(colors.gray.300)]",
-        "[--description-fg:theme(colors.gray.700)] dark:[--description-fg:theme(colors.gray.200)]",
-
-        // Footer
-        "[--footer-bg:transparent] dark:[--footer-bg:transparent]",
-        "[--footer-fg:theme(colors.gray.800)] dark:[--footer-fg:theme(colors.gray.100)]",
-        "[--footer-heading-fg:theme(colors.gray.900)] dark:[--footer-heading-fg:theme(colors.gray.100)]",
-        "[--footer-link-fg:theme(colors.gray.700)] dark:[--footer-link-fg:theme(colors.gray.300)]",
-        "[--footer-link-hover-fg:theme(colors.purple.700)] dark:[--footer-link-hover-fg:theme(colors.purple.400)]",
-        "[--footer-link-hover-bg:theme(colors.purple.50)] dark:[--footer-link-hover-bg:color-mix(in_oklab,oklch(0.17_0.05_324)_20%,transparent)]",
-        "[--footer-muted-fg:theme(colors.gray.500)] dark:[--footer-muted-fg:theme(colors.gray.400)]",
-        "[--footer-border:theme(colors.gray.200)] dark:[--footer-border:theme(colors.gray.800)]",
-
-        // Table (optional)
-        "[--table-fg:inherit]",
-        "[--table-muted-fg:theme(colors.gray.500)] dark:[--table-muted-fg:theme(colors.gray.400)]",
-        "[--table-head-fg:theme(colors.gray.700)] dark:[--table-head-fg:theme(colors.gray.300)]",
-        "[--table-border:theme(colors.gray.200)] dark:[--table-border:theme(colors.gray.800)]",
-        "[--table-row-hover-bg:theme(colors.gray.50)] dark:[--table-row-hover-bg:theme(colors.gray.900)]",
-
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
+import React from "react";
+import { cn } from "@/lib/utils";
+
+type Props = React.PropsWithChildren<{ className?: string }>;
+
+/**
+ * ProductLaunch template theme variables wrapper.
+ * Not used by default for the ProductLaunch template.
+ *
+ * Sets a small CSS variable contract consumed by shared components
+ * (Buttons, Inputs, Cards, Badges, Footer, Table, etc.).
+ *
+ * You can override any variable per-section by re-declaring it on
+ * that section/container.
+ */
+export function PresetThemeVars({ className, children }: Props) {
+  return (
+    <div
+      className={cn(
+        // Button ring shared across template
+        "[--btn-ring:theme(colors.purple.500)] dark:[--btn-ring:theme(colors.purple.400)]",
+
+        // Inputs (Contact)
+        "[--input-bg:theme(colors.white)] dark:[--input-bg:theme(colors.gray.900)]",
+        "[--input-fg:theme(colors.gray.900)] dark:[--input-fg:theme(colors.gray.100)]",
+        "[--input-placeholder:theme(colors.gray.400)] dark:[--input-placeholder:theme(colors.gray.500)]",
+        "[--input-border:theme(colors.purple.200)] dark:[--input-border:theme(colors.purple.700)]",
+        "[--input-focus-ring:theme(colors.purple.500)] dark:[--input-focus-ring:theme(colors.purple.400)]",
+        "[--input-ring-offset:theme(colors.white)] dark:[--input-ring-offset:theme(colors.gray.900)]",
+
+        // Cards (Features, ServicesGrid, Pricing, Testimonials, etc.)
+        "[--card-bg:theme(colors.white)] dark:[--card-bg:theme(colors.gray.900)]",
+        "[--card-fg:theme(colors.gray.900)] dark:[--card-fg:theme(colors.gray.100)]",
+        "[--card-title-fg:theme(colors.gray.900)] dark:[--card-title-fg:theme(colors.gray.100)]",
+        "[--card-muted-fg:theme(colors.gray.500)] dark:[--card-muted-fg:theme(colors.gray.400)]",
+        "[--card-border:theme(colors.gray.200)] dark:[--card-border:theme(colors.gray.800)]",
+        "[--card-shadow:0_6px_20px_rgba(0,0,0,0.06)]",
+
+        // Badges/Chips (Portfolio filters/tags, Pricing badge, Testimonials avatar)
+        "[--badge-bg:theme(colors.purple.50)] dark:[--badge-bg:theme(colors.purple.950)]",
+        "[--badge-fg:theme(colors.purple.700)] dark:[--badge-fg:theme(colors.purple.300)]",
+        "[--badge-border:theme(colors.purple.200)] dark:[--badge-border:theme(colors.purple.800)]",
+        "[--badge-active-bg:theme(colors.purple.600)] dark:[--badge-active-bg:theme(colors.purple.500)]",
+        "[--badge-active-fg:theme(colors.white)] dark:[--badge-active-fg:theme(colors.white)]",
+        "[--badge-active-border:theme(colors.purple.700)] dark:[--badge-active-border:theme(colors.purple.400)]",
+
+        // Headings/Subheadings
+        "[--heading-fg:theme(colors.gray.900)] dark:[--heading-fg:theme(colors.gray.100)]",
+        "[--subheading-fg:theme(colors.gray.600)] dark:[--subheading-fg:theme(colors.gray.300)]",
+        "[--description-fg:theme(colors.gray.700)] dark:[--description-fg:theme(colors.gray.200)]",
+
+        // Footer
+        "[--footer-bg:transparent] dark:[--footer-bg:transparent]",
+        "[--footer-fg:theme(colors.gray.800)] dark:[--footer-fg:theme(colors.gray.100)]",
+        "[--footer-heading-fg:theme(colors.gray.900)] dark:[--footer-heading-fg:theme(colors.gray.100)]",
+        "[--footer-link-fg:theme(colors.gray.700)] dark:[--footer-link-fg:theme(colors.gray.300)]",
+        "[--footer-link-hover-fg:theme(colors.purple.700)] dark:[--footer-link-hover-fg:theme(colors.purple.400)]",
+        "[--footer-link-hover-bg:theme(colors.purple.50)] dark:[--footer-link-hover-bg:color-mix(in_oklab,oklch(0.17_0.05_324)_20%,transparent)]",
+        "[--footer-muted-fg:theme(colors.gray.500)] dark:[--footer-muted-fg:theme(colors.gray.400)]",
+        "[--footer-border:theme(colors.gray.200)] dark:[--footer-border:theme(colors.gray.800)]",
+
+        // Table (optional)
+        "[--table-fg:inherit]",
+        "[--table-muted-fg:theme(colors.gray.500)] dark:[--table-muted-fg:theme(colors.gray.400)]",
+        "[--table-head-fg:theme(colors.gray.700)] dark:[--table-head-fg:theme(colors.gray.300)]",
+        "[--table-border:theme(colors.gray.200)] dark:[--table-border:theme(colors.gray.800)]",
+        "[--table-row-hover-bg:theme(colors.gray.50)] dark:[--table-row-hover-bg:theme(colors.gray.900)]",
+
+        className,
+      )}
+    >
+      {children}
+    </div>
+  );
+}