@nextworks/blocks-templates 0.2.0-alpha.0 → 0.2.0-alpha.11

package/dist/templates/saasdashboard/components/SmoothScroll.jsx

@@ -0,0 +1,86 @@
+"use client";
+import { useEffect } from "react";
+// Smoothly scrolls to section links with a faster duration
+export function SmoothScroll() {
+    useEffect(() => {
+        let suppressClick = false;
+        const animateTo = (href) => {
+            const el = document.querySelector(href);
+            if (!el)
+                return;
+            const navbarOffsetPx = 64;
+            const start = window.scrollY;
+            const targetTop = el.getBoundingClientRect().top + window.scrollY - navbarOffsetPx;
+            const distance = targetTop - start;
+            const duration = 300;
+            const startTime = performance.now();
+            const easeOutQuart = (t) => 1 - Math.pow(1 - t, 4);
+            const step = (now) => {
+                const elapsed = now - startTime;
+                const t = Math.min(1, elapsed / duration);
+                const eased = easeOutQuart(t);
+                window.scrollTo(0, start + distance * eased);
+                if (t < 1)
+                    requestAnimationFrame(step);
+                else
+                    history.replaceState(null, "", href);
+            };
+            requestAnimationFrame(step);
+        };
+        const onPointerDown = (e) => {
+            const ev = e;
+            const target = e.currentTarget;
+            const href = target.getAttribute("href");
+            if (!href || !href.startsWith("#"))
+                return;
+            // Only primary button, no modifiers
+            if (ev.button !== 0 ||
+                ev.metaKey ||
+                ev.ctrlKey ||
+                ev.altKey ||
+                ev.shiftKey)
+                return;
+            e.preventDefault();
+            suppressClick = true;
+            animateTo(href);
+        };
+        const onClick = (e) => {
+            const target = e.currentTarget;
+            const href = target.getAttribute("href");
+            if (!href || !href.startsWith("#"))
+                return;
+            if (suppressClick) {
+                e.preventDefault();
+                suppressClick = false;
+                return;
+            }
+            e.preventDefault();
+            animateTo(href);
+        };
+        const onKeyDown = (e) => {
+            const ev = e;
+            if (ev.key !== "Enter" && ev.key !== " ")
+                return;
+            const target = e.currentTarget;
+            const href = target.getAttribute("href");
+            if (!href || !href.startsWith("#"))
+                return;
+            e.preventDefault();
+            animateTo(href);
+        };
+        const links = Array.from(document.querySelectorAll('a[href^="#"]'));
+        links.forEach((a) => {
+            a.addEventListener("pointerdown", onPointerDown);
+            a.addEventListener("click", onClick);
+            a.addEventListener("keydown", onKeyDown);
+        });
+        return () => {
+            links.forEach((a) => {
+                a.removeEventListener("pointerdown", onPointerDown);
+                a.removeEventListener("click", onClick);
+                a.removeEventListener("keydown", onKeyDown);
+            });
+        };
+    }, []);
+    return null;
+}

package/dist/templates/saasdashboard/components/Testimonials.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Testimonials.d.ts","sourceRoot":"","sources":["../../../../src/templates/saasdashboard/components/Testimonials.tsx"],"names":[],"mappings":"AAKA,wBAAgB,YAAY,gCAkE3B"}

package/dist/templates/saasdashboard/components/Testimonials.jsx

@@ -0,0 +1,39 @@
+"use client";
+import { Testimonials as SharedTestimonials } from "@nextworks/blocks-sections";
+import { cn } from "@nextworks/blocks-core";
+export function Testimonials() {
+    return (<div className="relative">
+      {/* Gradient mesh + fine noise overlays for depth */}
+      <div aria-hidden className="pointer-events-none absolute inset-0 -z-10 [background-image:radial-gradient(60rem_60rem_at_0%_0%,rgba(59,130,246,0.08),transparent_40%),radial-gradient(50rem_50rem_at_100%_100%,rgba(168,85,247,0.06),transparent_40%)] opacity-20"/>
+      <div aria-hidden className="pointer-events-none absolute inset-0 -z-10 [background-image:radial-gradient(rgba(255,255,255,0.07)_1px,transparent_1px)] [background-size:14px_14px] opacity-[0.05]"/>
+      <SharedTestimonials testimonials={[
+            {
+                testimonialText: "DashFlow replaced 6 different tools for us. Our team productivity increased 40% in the first month.",
+                testimonialAuthor: "- Sarah Chen, Marketing Director at TechStart",
+                testimonialAuthorInitials: "SC",
+            },
+            {
+                testimonialText: "Finally, a dashboard that actually makes sense. Setup took 10 minutes, not 10 hours.",
+                testimonialAuthor: "- Mike Rodriguez, Operations Manager",
+                testimonialAuthorInitials: "MR",
+            },
+            {
+                testimonialText: "The analytics alone pay for the subscription. We spot trends weeks earlier now.",
+                testimonialAuthor: "- Lisa Park, CEO of GrowthCo",
+                testimonialAuthorInitials: "LP",
+            },
+        ]} testimonialSectionHeader="What Our Customers Say" className={cn("relative")} section={{ className: "py-16 px-6 bg-background" }} container={{ className: "max-w-7xl mx-auto" }} header={{ className: "text-center mb-12" }} heading={{
+            className: "text-3xl md:text-4xl font-bold font-inter text-[var(--heading-fg)]",
+        }} grid={{
+            className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8",
+        }} card={{
+            className: "p-6 rounded-lg transition-transform duration-200 hover:-translate-y-1 bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)] shadow-[var(--card-shadow)]",
+        }} text={{
+            className: "italic font-inter font-normal text-base text-[var(--card-fg)]",
+        }} author={{
+            className: "text-sm font-medium font-inter text-[var(--card-muted-fg)]",
+        }} avatar={{
+            className: "w-12 h-12 rounded-full flex items-center justify-center text-lg font-bold bg-[var(--badge-bg)] text-[var(--badge-fg)] border-[var(--badge-border)]",
+        }} avatarText={{ className: "font-bold" }} ariaLabel="Customer testimonials"/>
+    </div>);
+}

package/dist/templates/saasdashboard/components/TrustBadges.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrustBadges.d.ts","sourceRoot":"","sources":["../../../../src/templates/saasdashboard/components/TrustBadges.tsx"],"names":[],"mappings":"AA4BA,wBAAgB,WAAW,gCAwB1B"}

package/dist/templates/saasdashboard/components/TrustBadges.jsx

@@ -0,0 +1,36 @@
+"use client";
+import { TrustBadges as SharedTrustBadges } from "@nextworks/blocks-sections";
+import { cn } from "@nextworks/blocks-core";
+const defaultBadgesInfo = [
+    {
+        badgeText: "10,000+ businesses",
+        badgeDescription: "Trusted by",
+        badgeIcon: "📊",
+    },
+    {
+        badgeText: "SOC 2 Compliant",
+        badgeDescription: "Enterprise security",
+        badgeIcon: "🔒",
+    },
+    {
+        badgeText: "99.9% Uptime",
+        badgeDescription: "Reliable service",
+        badgeIcon: "⚡",
+    },
+    {
+        badgeText: "4.9/5 Rating",
+        badgeDescription: "Customer satisfaction",
+        badgeIcon: "⭐",
+    },
+];
+export function TrustBadges() {
+    return (<SharedTrustBadges badges={defaultBadgesInfo} className={cn("relative")} section={{ className: "py-8 px-6 bg-blue-950/10 dark:bg-blue-950" }} heading={{
+            className: "text-2xl font-bold font-inter text-gray-700 dark:text-gray-200",
+        }} badgesContainer={{
+            className: "flex flex-wrap items-center justify-center gap-8",
+        }} badge={{
+            className: "transition-all duration-200 grayscale hover:grayscale-0 hover:-translate-y-0.5",
+        }} text={{
+            className: "text-base font-medium font-inter text-gray-900 dark:text-white",
+        }} ariaLabel="Trust badges section"/>);
+}

package/package.json

@@ -1,34 +1,34 @@
-{
-  "name": "@nextworks/blocks-templates",
-  "version": "0.2.0-alpha.0",
-  "private": false,
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist",
-    "package.json",
-    "README.md"
-  ],
-  "repository": "github:jblh/nextworks-cli",
-  "bugs": "https://github.com/jblh/nextworks-cli/issues",
-  "homepage": "https://github.com/jblh/nextworks-cli#readme",
-  "scripts": {
-    "build": "npx tsc -p tsconfig.json"
-  },
-  "dependencies": {
-    "@nextworks/blocks-core": "0.2.0-alpha.0",
-    "@nextworks/blocks-sections": "0.2.0-alpha.0",
-    "lucide-react": "^0.542.0"
-  },
-  "devDependencies": {
-    "typescript": "^5.9.3",
-    "@types/node": "^20",
-    "@types/react": "^19",
-    "@types/react-dom": "^19"
-  },
-  "peerDependencies": {
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "next": "^15.0.0 || ^16.0.0"
-  }
-}
+{
+  "name": "@nextworks/blocks-templates",
+  "version": "0.2.0-alpha.11",
+  "private": false,
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "package.json",
+    "README.md"
+  ],
+  "repository": "github:jblh/nextworks-cli",
+  "bugs": "https://github.com/jblh/nextworks-cli/issues",
+  "homepage": "https://github.com/jblh/nextworks-cli#readme",
+  "scripts": {
+    "build": "npx tsc -p tsconfig.json"
+  },
+  "dependencies": {
+    "@nextworks/blocks-core": "0.2.0-alpha.11",
+    "@nextworks/blocks-sections": "0.2.0-alpha.11",
+    "lucide-react": "^0.542.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.9.3",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "next": "^15.0.0 || ^16.0.0"
+  }
+}