@nextworks/blocks-templates 0.1.0-alpha.11 → 0.1.0-alpha.13

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.
Files changed (96) hide show
  1. package/package.json +3 -3
  2. package/dist/index.d.ts +0 -5
  3. package/dist/templates/digitalagency/Page.d.ts +0 -3
  4. package/dist/templates/digitalagency/Page.js +0 -18
  5. package/dist/templates/digitalagency/PresetThemeVars.d.ts +0 -11
  6. package/dist/templates/digitalagency/PresetThemeVars.js +0 -29
  7. package/dist/templates/digitalagency/components/About.d.ts +0 -3
  8. package/dist/templates/digitalagency/components/About.js +0 -45
  9. package/dist/templates/digitalagency/components/CTA.d.ts +0 -3
  10. package/dist/templates/digitalagency/components/CTA.js +0 -33
  11. package/dist/templates/digitalagency/components/Contact.d.ts +0 -3
  12. package/dist/templates/digitalagency/components/Contact.js +0 -91
  13. package/dist/templates/digitalagency/components/Footer.d.ts +0 -8
  14. package/dist/templates/digitalagency/components/Footer.js +0 -58
  15. package/dist/templates/digitalagency/components/Hero.d.ts +0 -7
  16. package/dist/templates/digitalagency/components/Hero.js +0 -69
  17. package/dist/templates/digitalagency/components/Navbar.d.ts +0 -21
  18. package/dist/templates/digitalagency/components/Navbar.js +0 -86
  19. package/dist/templates/digitalagency/components/NetworkPattern.d.ts +0 -8
  20. package/dist/templates/digitalagency/components/NetworkPattern.js +0 -38
  21. package/dist/templates/digitalagency/components/Portfolio.d.ts +0 -3
  22. package/dist/templates/digitalagency/components/Portfolio.js +0 -108
  23. package/dist/templates/digitalagency/components/Pricing.d.ts +0 -3
  24. package/dist/templates/digitalagency/components/Pricing.js +0 -82
  25. package/dist/templates/digitalagency/components/Process.d.ts +0 -3
  26. package/dist/templates/digitalagency/components/Process.js +0 -38
  27. package/dist/templates/digitalagency/components/Services.d.ts +0 -3
  28. package/dist/templates/digitalagency/components/Services.js +0 -34
  29. package/dist/templates/digitalagency/components/Team.d.ts +0 -3
  30. package/dist/templates/digitalagency/components/Team.js +0 -14
  31. package/dist/templates/digitalagency/components/Testimonials.d.ts +0 -3
  32. package/dist/templates/digitalagency/components/Testimonials.js +0 -38
  33. package/dist/templates/gallery/PresetThemeVars.d.ts +0 -15
  34. package/dist/templates/gallery/PresetThemeVars.js +0 -31
  35. package/dist/templates/gallery/page.d.ts +0 -2
  36. package/dist/templates/gallery/page.js +0 -151
  37. package/dist/templates/productlaunch/Page.d.ts +0 -2
  38. package/dist/templates/productlaunch/Page.js +0 -20
  39. package/dist/templates/productlaunch/PresetThemeVars.d.ts +0 -16
  40. package/dist/templates/productlaunch/PresetThemeVars.js +0 -28
  41. package/dist/templates/productlaunch/components/About.d.ts +0 -15
  42. package/dist/templates/productlaunch/components/About.js +0 -59
  43. package/dist/templates/productlaunch/components/CTA.d.ts +0 -3
  44. package/dist/templates/productlaunch/components/CTA.js +0 -39
  45. package/dist/templates/productlaunch/components/Contact.d.ts +0 -3
  46. package/dist/templates/productlaunch/components/Contact.js +0 -93
  47. package/dist/templates/productlaunch/components/FAQ.d.ts +0 -7
  48. package/dist/templates/productlaunch/components/FAQ.js +0 -64
  49. package/dist/templates/productlaunch/components/Features.d.ts +0 -6
  50. package/dist/templates/productlaunch/components/Features.js +0 -52
  51. package/dist/templates/productlaunch/components/Footer.d.ts +0 -5
  52. package/dist/templates/productlaunch/components/Footer.js +0 -103
  53. package/dist/templates/productlaunch/components/Hero.d.ts +0 -6
  54. package/dist/templates/productlaunch/components/Hero.js +0 -70
  55. package/dist/templates/productlaunch/components/Navbar.d.ts +0 -25
  56. package/dist/templates/productlaunch/components/Navbar.js +0 -82
  57. package/dist/templates/productlaunch/components/Pricing.d.ts +0 -5
  58. package/dist/templates/productlaunch/components/Pricing.js +0 -77
  59. package/dist/templates/productlaunch/components/ProcessTimeline.d.ts +0 -5
  60. package/dist/templates/productlaunch/components/ProcessTimeline.js +0 -63
  61. package/dist/templates/productlaunch/components/ServicesGrid.d.ts +0 -5
  62. package/dist/templates/productlaunch/components/ServicesGrid.js +0 -41
  63. package/dist/templates/productlaunch/components/Team.d.ts +0 -5
  64. package/dist/templates/productlaunch/components/Team.js +0 -72
  65. package/dist/templates/productlaunch/components/Testimonials.d.ts +0 -5
  66. package/dist/templates/productlaunch/components/Testimonials.js +0 -55
  67. package/dist/templates/productlaunch/components/TrustBadges.d.ts +0 -5
  68. package/dist/templates/productlaunch/components/TrustBadges.js +0 -50
  69. package/dist/templates/saasdashboard/Page.d.ts +0 -2
  70. package/dist/templates/saasdashboard/Page.js +0 -15
  71. package/dist/templates/saasdashboard/PresetThemeVars.d.ts +0 -11
  72. package/dist/templates/saasdashboard/PresetThemeVars.js +0 -27
  73. package/dist/templates/saasdashboard/components/Contact.d.ts +0 -3
  74. package/dist/templates/saasdashboard/components/Contact.js +0 -83
  75. package/dist/templates/saasdashboard/components/Dashboard.d.ts +0 -21
  76. package/dist/templates/saasdashboard/components/Dashboard.js +0 -120
  77. package/dist/templates/saasdashboard/components/FAQ.d.ts +0 -2
  78. package/dist/templates/saasdashboard/components/FAQ.js +0 -35
  79. package/dist/templates/saasdashboard/components/Features.d.ts +0 -2
  80. package/dist/templates/saasdashboard/components/Features.js +0 -55
  81. package/dist/templates/saasdashboard/components/Footer.d.ts +0 -2
  82. package/dist/templates/saasdashboard/components/Footer.js +0 -52
  83. package/dist/templates/saasdashboard/components/Hero.d.ts +0 -2
  84. package/dist/templates/saasdashboard/components/Hero.js +0 -65
  85. package/dist/templates/saasdashboard/components/Hero_mask.d.ts +0 -3
  86. package/dist/templates/saasdashboard/components/Hero_mask.js +0 -73
  87. package/dist/templates/saasdashboard/components/Navbar.d.ts +0 -25
  88. package/dist/templates/saasdashboard/components/Navbar.js +0 -83
  89. package/dist/templates/saasdashboard/components/Pricing.d.ts +0 -2
  90. package/dist/templates/saasdashboard/components/Pricing.js +0 -65
  91. package/dist/templates/saasdashboard/components/SmoothScroll.d.ts +0 -2
  92. package/dist/templates/saasdashboard/components/SmoothScroll.js +0 -87
  93. package/dist/templates/saasdashboard/components/Testimonials.d.ts +0 -2
  94. package/dist/templates/saasdashboard/components/Testimonials.js +0 -35
  95. package/dist/templates/saasdashboard/components/TrustBadges.d.ts +0 -2
  96. package/dist/templates/saasdashboard/components/TrustBadges.js +0 -37
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nextworks/blocks-templates",
3
- "version": "0.1.0-alpha.11",
3
+ "version": "0.1.0-alpha.13",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -16,8 +16,8 @@
16
16
  "build": "npx tsc -p tsconfig.json"
17
17
  },
18
18
  "dependencies": {
19
- "@nextworks/blocks-core": "0.1.0-alpha.11",
20
- "@nextworks/blocks-sections": "0.1.0-alpha.11",
19
+ "@nextworks/blocks-core": "0.1.0-alpha.13",
20
+ "@nextworks/blocks-sections": "0.1.0-alpha.13",
21
21
  "lucide-react": "^0.542.0"
22
22
  },
23
23
  "devDependencies": {
package/dist/index.d.ts DELETED
@@ -1,5 +0,0 @@
1
- export * as ProductLaunch from "./templates/productlaunch/Page";
2
- export * as SaaSDashboard from "./templates/saasdashboard/Page";
3
- export * as DigitalAgency from "./templates/digitalagency/Page";
4
- export * as GalleryTemplate from "./templates/gallery/page";
5
- //# sourceMappingURL=index.d.ts.map
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- export declare function DigitalAgency(): React.JSX.Element;
3
- //# sourceMappingURL=Page.d.ts.map
@@ -1,18 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { Navbar } from "./components/Navbar";
4
- import { Hero } from "./components/Hero";
5
- import { Services } from "./components/Services";
6
- import { Testimonials } from "./components/Testimonials";
7
- import { Process } from "./components/Process";
8
- import { Portfolio } from "./components/Portfolio";
9
- import { About } from "./components/About";
10
- import { Team } from "./components/Team";
11
- import { Pricing } from "./components/Pricing";
12
- import { CTA } from "./components/CTA";
13
- import { Contact } from "./components/Contact";
14
- import { Footer } from "./components/Footer";
15
- import { PresetThemeVars } from "./PresetThemeVars";
16
- export function DigitalAgency() {
17
- return (_jsx(PresetThemeVars, { children: _jsxs("main", { children: [_jsx(Navbar, {}), _jsx(Hero, {}), _jsx(Services, {}), _jsx(Portfolio, {}), _jsx(Testimonials, {}), _jsx(Process, {}), _jsx(About, {}), _jsx(Team, {}), _jsx(Pricing, {}), _jsx(CTA, {}), _jsx(Contact, {}), _jsx(Footer, {})] }) }));
18
- }
@@ -1,11 +0,0 @@
1
- import React from "react";
2
- type Props = React.PropsWithChildren<{
3
- className?: string;
4
- }>;
5
- /**
6
- * DigitalAgency template theme variables wrapper.
7
- * Emerald-leaning palette; adjust to match your preset exactly.
8
- */
9
- export declare function PresetThemeVars({ className, children }: Props): React.JSX.Element;
10
- export {};
11
- //# sourceMappingURL=PresetThemeVars.d.ts.map
@@ -1,29 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { cn } from "@nextworks/blocks-core";
3
- /**
4
- * DigitalAgency template theme variables wrapper.
5
- * Emerald-leaning palette; adjust to match your preset exactly.
6
- */
7
- export function PresetThemeVars({ className, children }) {
8
- return (_jsx("div", { className: cn(
9
- // Shared button ring
10
- "[--btn-ring:theme(colors.emerald.500)] dark:[--btn-ring:theme(colors.emerald.400)]",
11
- // Inputs
12
- "[--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.emerald.200)] dark:[--input-border:theme(colors.emerald.700)]", "[--input-focus-ring:theme(colors.emerald.500)] dark:[--input-focus-ring:theme(colors.emerald.400)]", "[--input-ring-offset:theme(colors.white)] dark:[--input-ring-offset:theme(colors.gray.900)]",
13
- // Cards
14
- "[--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)]",
15
- // Badges/Chips
16
- "[--badge-bg:theme(colors.emerald.50)] dark:[--badge-bg:theme(colors.emerald.950)]", "[--badge-fg:theme(colors.emerald.700)] dark:[--badge-fg:theme(colors.emerald.300)]", "[--badge-border:theme(colors.emerald.200)] dark:[--badge-border:theme(colors.emerald.800)]", "[--badge-active-bg:theme(colors.emerald.600)] dark:[--badge-active-bg:theme(colors.emerald.500)]", "[--badge-active-fg:theme(colors.white)] dark:[--badge-active-fg:theme(colors.white)]", "[--badge-active-border:theme(colors.emerald.700)] dark:[--badge-active-border:theme(colors.emerald.400)]",
17
- // Headings/Subheadings
18
- "[--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)]",
19
- // Process timeline
20
- "[--process-step-bg:theme(colors.fuchsia.600)] dark:[--process-step-bg:theme(colors.fuchsia.500)]", "[--process-step-fg:theme(colors.white)] dark:[--process-step-fg:theme(colors.white)]", "[--process-connector:theme(colors.gray.300)] dark:[--process-connector:theme(colors.gray.600)]",
21
- // Portfolio metrics color
22
- "[--metric-fg:theme(colors.fuchsia.600)] dark:[--metric-fg:theme(colors.fuchsia.400)]",
23
- // Footer
24
- "[--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.emerald.700)] dark:[--footer-link-hover-fg:theme(colors.emerald.400)]", "[--footer-link-hover-bg:theme(colors.emerald.50)] dark:[--footer-link-hover-bg:color-mix(in_oklab,oklch(0.17_0.05_152)_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)]",
25
- // Table (optional)
26
- "[--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)]",
27
- // About section accent
28
- "[--about-accent:theme(colors.fuchsia.600)] dark:[--about-accent:theme(colors.fuchsia.400)]", className), children: children }));
29
- }
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- export declare function About(): React.JSX.Element;
3
- //# sourceMappingURL=About.d.ts.map
@@ -1,45 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { About as SharedAbout } from "@nextworks/blocks-sections";
4
- export function About() {
5
- return (_jsx(SharedAbout
6
- // Content
7
- , {
8
- // Content
9
- aboutSubheadingText: "About Us", aboutHeadingText: "Your Success Is Our Mission", aboutContentText: "With 50+ successful projects and 5 years of experience, we specialize in creating digital solutions that drive real business growth. Our team combines creative design with data-driven strategy.", aboutTextAlign: "center",
10
- // Stats
11
- showStats: true, animateStats: true, aboutStats: [
12
- { value: "2.5", suffix: "k+", label: "Leads Generated" },
13
- { value: "4.8", suffix: "%", label: "Avg. CTR" },
14
- { value: "92", suffix: "%", label: "Client Retention" },
15
- { value: "12", suffix: "M", label: "Ad Spend Managed" },
16
- ],
17
- // Slots / styling
18
- section: {
19
- className: "py-16 md:py-20 lg:py-24 bg-white dark:bg-gray-800",
20
- }, container: {
21
- className: "max-w-7xl mx-auto px-6",
22
- }, inner: {
23
- className: "flex flex-col gap-12",
24
- }, contentContainer: {
25
- className: "max-w-4xl mx-auto",
26
- }, contentStack: {
27
- className: "flex flex-col gap-6",
28
- }, subheading: {
29
- className: "text-sm font-semibold font-poppins uppercase tracking-wider text-[var(--about-accent)]",
30
- }, heading: {
31
- className: "text-4xl md:text-5xl lg:text-6xl font-bold leading-tight text-[var(--heading-fg)]",
32
- }, content: {
33
- className: "text-xl md:text-2xl max-w-3xl mx-auto leading-relaxed text-[var(--subheading-fg)]",
34
- }, statsSection: {
35
- className: "bg-card p-8 rounded-xl shadow-lg mx-auto max-w-5xl w-full border border-border bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)]",
36
- }, statsGrid: {
37
- className: "grid grid-cols-2 md:grid-cols-4 gap-8 justify-items-center",
38
- }, statItem: {
39
- className: "flex flex-col items-center gap-2",
40
- }, statNumber: {
41
- className: "text-4xl md:text-5xl font-bold font-poppins leading-none text-[var(--about-accent)]",
42
- }, statLabel: {
43
- className: "text-sm font-medium font-inter text-center text-[var(--card-muted-fg)]",
44
- } }));
45
- }
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- export declare function CTA(): React.JSX.Element;
3
- //# sourceMappingURL=CTA.d.ts.map
@@ -1,33 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { CTA as SharedCTA } from "@nextworks/blocks-sections";
4
- export function CTA() {
5
- return (_jsx(SharedCTA
6
- // Background colors moved to the section slot
7
- , {
8
- // Background colors moved to the section slot
9
- section: {
10
- className: "bg-sky-50 dark:bg-gray-900 text-foreground [--heading-fg:rgb(17,24,39)] dark:[--heading-fg:white] [--subheading-fg:rgba(17,24,39,0.8)] dark:[--subheading-fg:rgba(255,255,255,0.85)] [--description-fg:rgba(17,24,39,0.75)] dark:[--description-fg:rgba(255,255,255,0.75)]",
11
- },
12
- // Layout/height/centering handled by the container slot
13
- container: {
14
- className: "mx-auto flex h-[32vh] w-full max-w-6xl flex-col items-center justify-center overflow-hidden px-4 pb-8",
15
- },
16
- // Heading mapped to the new headingText slot
17
- headingText: {
18
- text: "Ready To Transform Your Business?",
19
- className: "text-4xl md:text-5xl lg:text-6xl font-bold font-poppins leading-tight",
20
- },
21
- // Use actionsWrapper for spacing instead of margin on the button
22
- actionsWrapper: {
23
- className: "mt-6 flex flex-col items-center gap-3 sm:flex-row [--btn-ring:rgba(192,38,211,0.35)] dark:[--btn-ring:rgba(192,38,211,0.45)]",
24
- },
25
- // Primary CTA mapped to ctaButton + ctaButtonStyle
26
- ctaButton: { label: "Get Your Free Quote", href: "#contact" }, ctaButtonStyle: {
27
- variant: "default",
28
- size: "lg",
29
- className: "font-poppins shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5 [--btn-bg:#c026d3] dark:[--btn-bg:#c026d3] [--btn-hover-bg:#a21caf] dark:[--btn-hover-bg:#a21caf] [--btn-fg:#ffffff] dark:[--btn-fg:#ffffff] hover:[--btn-hover-fg:#ffffff] dark:hover:[--btn-hover-fg:#ffffff] [--btn-border:transparent]",
30
- },
31
- // Preserve the previous top margin on the heading
32
- spacing: { topMargin: "mt-[8vh]" } }));
33
- }
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- export declare function Contact(): React.JSX.Element;
3
- //# sourceMappingURL=Contact.d.ts.map
@@ -1,91 +0,0 @@
1
- // app/templates/digitalagency/componets/Contact.tsx
2
- "use client";
3
- import { jsx as _jsx } from "react/jsx-runtime";
4
- import { Contact as SharedContact, } from "@nextworks/blocks-sections";
5
- const agencyContactFormData = [
6
- {
7
- id: "name",
8
- label: "Your Full Name",
9
- placeholder: "John Smith",
10
- required: true,
11
- type: "text",
12
- },
13
- {
14
- id: "email",
15
- label: "Email Address",
16
- placeholder: "john@yourcompany.com",
17
- required: true,
18
- type: "email",
19
- },
20
- {
21
- id: "phone",
22
- label: "Phone Number",
23
- placeholder: "+1 (555) 123-4567",
24
- required: false,
25
- type: "tel",
26
- },
27
- {
28
- id: "company",
29
- label: "Company Name",
30
- placeholder: "Your Company LLC",
31
- required: false,
32
- type: "text",
33
- },
34
- {
35
- id: "projectType",
36
- label: "Service Interested In",
37
- placeholder: "e.g. Web Design, SEO, E-commerce, Branding",
38
- required: false,
39
- type: "text",
40
- },
41
- {
42
- id: "budget",
43
- label: "Project Budget (Optional)",
44
- placeholder: "e.g. $3,000 - $6,000",
45
- required: false,
46
- type: "text",
47
- },
48
- {
49
- id: "message",
50
- label: "Project Details",
51
- placeholder: "Tell us about your project goals, timeline, and any specific requirements...",
52
- required: true,
53
- type: "textarea",
54
- },
55
- ];
56
- export function Contact() {
57
- const handleFormSubmit = (e) => {
58
- e.preventDefault();
59
- const data = Object.fromEntries(new FormData(e.currentTarget).entries());
60
- console.log("Contact form submitted:", data);
61
- };
62
- return (_jsx(SharedContact, { id: "contact", fields: agencyContactFormData, contactHeaderText: "Let\u2019s Talk Strategy", contactSubHeaderText: "We\u2019re here to help you grow \u2014 tell us how!",
63
- // Root and layout
64
- className: "w-full", section: { className: "py-16 px-4 bg-fuchsia-600 dark:bg-fuchsia-600" }, container: { className: "mx-auto max-w-4xl" },
65
- // Header slots (new)
66
- headerWrapper: { className: "mb-8 text-center" }, headerText: {
67
- className: "text-4xl md:text-5xl font-bold font-poppins text-white tracking-tight",
68
- }, subheaderText: {
69
- className: "mt-3 text-lg md:text-xl font-inter text-white/90 px-4 md:px-14",
70
- },
71
- // Form container
72
- form: {
73
- className: "bg-card p-8 rounded-lg shadow-md border border-border bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)]",
74
- },
75
- // Fields wrapper and field item (new)
76
- fieldsWrapper: { className: "space-y-4" }, field: { className: "space-y-2" },
77
- // Label + inputs (new)
78
- label: {
79
- className: "text-card-foreground text-sm font-medium font-poppins block",
80
- }, input: {
81
- className: "w-full p-3 rounded-md font-inter border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-2 focus-visible:ring-[var(--input-focus-ring)] focus-visible:ring-offset-[var(--input-ring-offset)]",
82
- }, textarea: {
83
- className: "w-full p-3 rounded-md resize-vertical min-h-[120px] font-inter border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-2 focus-visible:ring-[var(--input-focus-ring)] focus-visible:ring-offset-[var(--input-ring-offset)]",
84
- },
85
- // Submit button (new split between wrapper/style/text)
86
- submitButtonWrapper: { className: "pt-2" }, submitButtonStyle: {
87
- variant: "default",
88
- size: "lg",
89
- className: "w-full bg-fuchsia-700 hover:bg-fuchsia-800 text-white font-poppins font-medium shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5",
90
- }, submitButtonText: "Schedule Free Consultation", onSubmit: handleFormSubmit, ariaLabel: "Agency contact section" }));
91
- }
@@ -1,8 +0,0 @@
1
- import React from "react";
2
- /**
3
- * Upgraded preset Footer for the Digital Agency template
4
- * - Uses the shared Footer slot API
5
- * - Keeps brand distinct, flush-left; aligns top with nav headers
6
- */
7
- export declare function Footer(): React.JSX.Element;
8
- //# sourceMappingURL=Footer.d.ts.map
@@ -1,58 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { Footer as SharedFooter } from "@nextworks/blocks-sections";
4
- const agencyNavLinks = [
5
- {
6
- heading: "Services",
7
- links: [
8
- { name: "Web Design & Development", href: "#services" },
9
- { name: "SEO & Digital Marketing", href: "#services" },
10
- { name: "E-commerce Solutions", href: "#services" },
11
- { name: "Brand Identity & Design", href: "#services" },
12
- ],
13
- },
14
- {
15
- heading: "Company",
16
- links: [
17
- { name: "About Us", href: "#about" },
18
- { name: "Our Work", href: "#portfolio" },
19
- { name: "Process", href: "#process" },
20
- { name: "Contact", href: "#contact" },
21
- ],
22
- },
23
- {
24
- heading: "Resources",
25
- links: [
26
- { name: "Free Consultation", href: "#contact" },
27
- { name: "Case Studies", href: "#portfolio" },
28
- { name: "Get Quote", href: "#pricing" },
29
- { name: "Privacy Policy", href: "#privacy" },
30
- ],
31
- },
32
- ];
33
- /**
34
- * Upgraded preset Footer for the Digital Agency template
35
- * - Uses the shared Footer slot API
36
- * - Keeps brand distinct, flush-left; aligns top with nav headers
37
- */
38
- export function Footer() {
39
- return (_jsx(SharedFooter, { footerBrandName: "Nexus Digital", footerNavLinks: agencyNavLinks, ariaLabel: "Footer section", section: {
40
- className: "w-full bg-gray-100 dark:bg-gray-900 text-gray-800 dark:text-white",
41
- }, container: { className: "max-w-7xl mx-auto px-6" }, brand: {
42
- className: "text-2xl font-bold font-poppins text-fuchsia-600 dark:text-fuchsia-400",
43
- }, brandWrapper: {
44
- className: "flex flex-col items-start text-left lg:pr-8",
45
- }, navSection: {
46
- className: "flex flex-col lg:flex-row items-start justify-center gap-8 lg:gap-12 pt-6.5 pb-8",
47
- }, navGroup: { className: "flex flex-col items-start text-left pt-1.5" }, navHeading: {
48
- className: "font-bold font-poppins text-gray-800 dark:text-white mb-3 text-sm uppercase tracking-wider",
49
- }, navLink: {
50
- className: "text-gray-600 dark:text-gray-400 hover:text-fuchsia-600 dark:hover:text-fuchsia-400 transition-colors duration-200 text-sm mb-2 block font-inter",
51
- }, socialSection: {
52
- className: "flex items-center justify-center gap-4 py-4",
53
- }, socialLink: {
54
- className: "text-gray-600 dark:text-gray-400 hover:text-fuchsia-600 dark:hover:text-fuchsia-400 transition-colors duration-200 p-2 rounded-md hover:bg-gray-200 dark:hover:bg-gray-800",
55
- }, socialIcon: { className: "h-5 w-5" }, copyright: {
56
- className: "text-center text-xs text-gray-600 dark:text-gray-400 py-4 border-t border-gray-200 dark:border-gray-800 font-inter",
57
- } }));
58
- }
@@ -1,7 +0,0 @@
1
- import React from "react";
2
- /**
3
- * Upgraded HeroNew preset for the digital agency template,
4
- * wired to the shared HeroSplit with slots + cn API.
5
- */
6
- export declare function Hero(): React.JSX.Element;
7
- //# sourceMappingURL=Hero.d.ts.map
@@ -1,69 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { HeroSplit } from "@nextworks/blocks-sections";
4
- import { NetworkPattern } from "../components/NetworkPattern";
5
- /**
6
- * Upgraded HeroNew preset for the digital agency template,
7
- * wired to the shared HeroSplit with slots + cn API.
8
- */
9
- export function Hero() {
10
- return (_jsx("section", { id: "home", className: "bg-white dark:bg-black", children: _jsx(HeroSplit, { section: {
11
- className: "relative bg-gradient-to-br from-violet-600 to-fuchsia-600 px-6 pt-8 pb-16 md:pt-12 md:pb-20 text-white hero-pattern",
12
- }, heading: {
13
- text: "Digital Innovation That Drives Growth",
14
- className: "text-5xl md:text-5xl lg:text-7xl font-extrabold leading-tight text-white font-poppins",
15
- }, subheading: {
16
- text: "We craft exceptional digital experiences that transform businesses. From cutting-edge web applications to AI-powered solutions, we turn your vision into reality.",
17
- className: "mt-6 text-xl md:text-1xl text-white/90 max-w-3xl font-inter font-medium leading-relaxed",
18
- }, cta1: {
19
- label: "Start Your Project",
20
- href: "#contact",
21
- variant: "default",
22
- size: "lg",
23
- className: [
24
- "font-poppins font-semibold px-8 py-3 shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5 text-lg",
25
- "[--btn-bg:theme(colors.fuchsia.600)]",
26
- "hover:[--btn-hover-bg:theme(colors.fuchsia.700)]",
27
- "[--btn-fg:theme(colors.white)]",
28
- "hover:[--btn-hover-fg:theme(colors.white)]",
29
- ].join(" "),
30
- }, cta2: {
31
- label: "Explore Solutions",
32
- href: "#services",
33
- variant: "outline",
34
- size: "lg",
35
- className: [
36
- "font-poppins font-semibold px-8 py-3 text-lg shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5",
37
- "border-2", // match previous thickness
38
- // set colors via vars
39
- "[--btn-fg:oklch(0.51_0.18_341)]", // fuchsia-700-ish
40
- "[--btn-border:oklch(0.97_0.01_0)]", // white/90 approx
41
- "[--btn-bg:oklch(0.97_0.01_0_/0.9)]",
42
- "hover:[--btn-hover-bg:oklch(1_0_0)]", // white
43
- "hover:[--btn-hover-fg:oklch(0.51_0.18_341)]",
44
- // dark: make it a light outline with white text
45
- "dark:[--btn-fg:oklch(1_0_0)]",
46
- "dark:[--btn-border:oklch(1_0_0_/0.9)]",
47
- "dark:[--btn-bg:transparent]",
48
- "dark:hover:[--btn-hover-bg:oklch(1_0_0))]",
49
- ].join(" "),
50
- }, image: {
51
- src: undefined,
52
- alt: "Digital innovation network visualization",
53
- className: "object-contain",
54
- }, imageLayout: "full-bleed", fallback: _jsx(NetworkPattern, {}), imageContainer: { className: "mt-10 sm:mt-10 md:mt-0 md:mr-0 lg:mr-7" },
55
- // imageContainer={{
56
- // className:
57
- // "relative w-full min-h-[16rem] h-[20rem] md:h-[28rem] lg:h-[32rem] self-start mt-20 lg:mt-0 mb-10 lg:mb-0",
58
- // }}
59
- textContainer: {
60
- className: "flex-1 px-5 lg:px-8 lg:self-start pt-0 md:pt-2 lg:pt-4",
61
- }, buttonsContainer: {
62
- className: [
63
- "gap-4 mt-8 sm:flex-col lg:flex-row",
64
- "[--btn-ring:oklch(1_0_0)]", // white ring to match on purple bg
65
- ].join(" "),
66
- },
67
- // buttonsContainer={{ className: "flex gap-4 mt-8" }}
68
- textAlign: "center", ariaLabel: "Digital innovation that drives growth hero section" }) }));
69
- }
@@ -1,21 +0,0 @@
1
- import type { ComponentProps } from "react";
2
- import { Navbar as SharedNavbar } from "@nextworks/blocks-sections";
3
- /**
4
- * Digital Agency preset Navbar (Nexus Digital)
5
- *
6
- * - Preserves original branding, colors, and blur effect
7
- * - No CTA button (ctaButton = null)
8
- * - Fuchsia hover/focus accents for links and toggles
9
- * - Exposes the full Shared Navbar API via shallow-merge overrides
10
- *
11
- * Example overrides:
12
- * <Navbar
13
- * links={{ className: "hover:text-emerald-600" }}
14
- * container={{ className: "max-w-6xl mx-auto" }}
15
- * />
16
- */
17
- type SharedNavbarProps = ComponentProps<typeof SharedNavbar>;
18
- type PresetOverrides = Partial<SharedNavbarProps>;
19
- export declare function Navbar(overrides?: PresetOverrides): import("react").JSX.Element;
20
- export {};
21
- //# sourceMappingURL=Navbar.d.ts.map
@@ -1,86 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { Navbar as SharedNavbar } from "@nextworks/blocks-sections";
4
- import { BrandNodeGradientRing } from "@nextworks/blocks-core";
5
- const defaultProps = {
6
- brand: "Nexus Digital",
7
- brandNode: (_jsx(BrandNodeGradientRing, { gradient: "conic-gradient(#7c3aed, #ec4899, #7c3aed)" })),
8
- menuItems: [
9
- { label: "Home", href: "#home" },
10
- { label: "Services", href: "#services" },
11
- { label: "Portfolio", href: "#portfolio" },
12
- { label: "Pricing", href: "#pricing" },
13
- { label: "Contact", href: "#contact" },
14
- ],
15
- ctaButton: null,
16
- showColorModeToggle: true,
17
- navHeight: "h-16",
18
- sticky: true,
19
- ariaLabel: "Nexus Digital main navigation",
20
- // Allow page-level layout overrides if needed
21
- className: "",
22
- // Style slots (preserve original look; add defaults for new slots)
23
- nav: {
24
- className: "bg-white/80 dark:bg-gray-900/80 backdrop-blur border-b border-gray-200 dark:border-gray-800 " +
25
- "text-gray-800 dark:text-white " +
26
- // Accent variables for this preset (read by toggle, links, mobile links)
27
- "[--navbar-accent:theme(colors.fuchsia.600)] dark:[--navbar-accent:theme(colors.fuchsia.400)] " +
28
- "[--navbar-toggle-bg:theme(colors.white)] dark:[--navbar-toggle-bg:theme(colors.gray.900)] " +
29
- "[--navbar-hover-bg:theme(colors.fuchsia.50)] dark:[--navbar-hover-bg:color-mix(in oklab,oklch(0.24 0.07 330) 20%, transparent)] " +
30
- "[--navbar-ring:theme(colors.fuchsia.500)] dark:[--navbar-ring:theme(colors.fuchsia.400)] " +
31
- "[--navbar-border:theme(colors.gray.200)] dark:[--navbar-border:theme(colors.gray.800)]",
32
- },
33
- brandText: {
34
- className: "text-2xl font-bold font-poppins text-fuchsia-600 dark:text-fuchsia-400",
35
- },
36
- links: {
37
- className: "text-sm font-inter font-medium text-gray-700 dark:text-gray-200 " +
38
- "hover:text-fuchsia-600 dark:hover:text-fuchsia-400 " +
39
- "focus:ring-[var(--navbar-ring)]",
40
- },
41
- // CTA hidden by default; styled to match theme if enabled later
42
- ctaButtonStyle: {
43
- variant: "default",
44
- size: "default",
45
- className: "shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5 " +
46
- "bg-fuchsia-600 text-white hover:bg-fuchsia-700 " +
47
- "dark:bg-fuchsia-500 dark:hover:bg-fuchsia-400",
48
- },
49
- mobileMenu: {
50
- className: "border-t border-gray-200 dark:border-gray-800",
51
- },
52
- container: {
53
- className: "max-w-7xl mx-auto",
54
- },
55
- brandWrapper: {
56
- className: "",
57
- },
58
- desktopMenu: {
59
- className: "hidden items-center space-x-1 md:flex lg:space-x-6",
60
- },
61
- toggleButton: {
62
- className: "md:hidden flex items-center justify-center rounded-md p-2 transition-colors " +
63
- "hover:bg-fuchsia-50 dark:hover:bg-fuchsia-900/20 " +
64
- "focus:outline-none focus:ring-2 focus:ring-fuchsia-500 dark:focus:ring-fuchsia-400",
65
- },
66
- colorModeWrapper: {
67
- className: "ml-2",
68
- },
69
- // With variables above, ThemeToggle can rely on them; explicit override optional
70
- // themeToggle: { ... }
71
- ctaButtonWrapper: {
72
- className: "ml-2",
73
- },
74
- mobileMenuInner: {
75
- className: "space-y-2 px-4 pt-2 pb-4",
76
- },
77
- // Mobile links will read --navbar-hover-bg; explicit class optional
78
- mobileLinks: {
79
- className: "hover:bg-[var(--navbar-hover-bg)]",
80
- },
81
- };
82
- export function Navbar(overrides = {}) {
83
- // Shallow-merge: providing a slot object replaces that slot entirely.
84
- const props = Object.assign(Object.assign({}, defaultProps), overrides);
85
- return _jsx(SharedNavbar, Object.assign({}, props));
86
- }
@@ -1,8 +0,0 @@
1
- import React from "react";
2
- /**
3
- * NetworkPattern
4
- * Tailwind-based animated network background for hero fallbacks.
5
- * Lightweight and dependency-free (no Chakra).
6
- */
7
- export declare const NetworkPattern: React.FC;
8
- //# sourceMappingURL=NetworkPattern.d.ts.map
@@ -1,38 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- /**
4
- * NetworkPattern
5
- * Tailwind-based animated network background for hero fallbacks.
6
- * Lightweight and dependency-free (no Chakra).
7
- */
8
- export const NetworkPattern = () => {
9
- return (
10
- // <div className="relative h-full w-full">
11
- _jsxs("div", { className: "relative h-full w-full overflow-hidden", children: [_jsxs("div", { className: "pointer-events-none absolute inset-0 -z-10 overflow-hidden", children: [_jsx("div", { className: "absolute -top-16 -left-16 h-72 w-72 rounded-full bg-blue-500/25 blur-3xl" }), _jsx("div", { className: "absolute right-0 bottom-0 h-80 w-80 rounded-full bg-cyan-400/25 blur-3xl" }), _jsx("div", { className: "absolute top-14 right-1/3 h-56 w-56 rounded-full bg-indigo-500/15 blur-3xl" }), _jsx("div", { className: "absolute -bottom-10 left-1/4 h-64 w-64 rounded-full bg-sky-500/10 blur-3xl" })] }), _jsxs("svg", { width: "100%", height: "100%", viewBox: "0 0 900 520", className: "absolute top-0 left-0 [transform:scale(1.12)]", children: [_jsxs("defs", { children: [_jsxs("linearGradient", { id: "nodeGradient", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [_jsx("stop", { offset: "0%", stopColor: "#3B82F6", stopOpacity: 1 }), _jsx("stop", { offset: "100%", stopColor: "#2563EB", stopOpacity: 1 })] }), _jsxs("linearGradient", { id: "lineGradient", x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [_jsx("stop", { offset: "0%", stopColor: "#60A5FA", stopOpacity: 0.28 }), _jsx("stop", { offset: "50%", stopColor: "#3B82F6", stopOpacity: 0.6 }), _jsx("stop", { offset: "100%", stopColor: "#60A5FA", stopOpacity: 0.28 })] })] }), _jsxs("g", { className: "opacity-30", children: [Array.from({ length: 18 }).map((_, i) => (_jsx("line", { x1: i * 50, y1: 0, x2: i * 50, y2: 520, stroke: "#e5e7eb", strokeWidth: "0.5" }, `v-${i}`))), Array.from({ length: 12 }).map((_, i) => (_jsx("line", { x1: 0, y1: i * 45, x2: 900, y2: i * 45, stroke: "#e5e7eb", strokeWidth: "0.5" }, `h-${i}`)))] }), _jsxs("g", { children: [_jsx("line", { x1: "120", y1: "80", x2: "320", y2: "180", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "320", y1: "180", x2: "600", y2: "140", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "600", y1: "140", x2: "720", y2: "340", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "320", y1: "180", x2: "420", y2: "420", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "120", y1: "80", x2: "220", y2: "320", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "220", y1: "320", x2: "420", y2: "420", stroke: "url(#lineGradient)", strokeWidth: "2" }), _jsx("line", { x1: "60", y1: "260", x2: "120", y2: "80", stroke: "url(#lineGradient)", strokeWidth: "1.5" }), _jsx("line", { x1: "420", y1: "420", x2: "580", y2: "470", stroke: "url(#lineGradient)", strokeWidth: "1.5" }), _jsx("line", { x1: "600", y1: "140", x2: "780", y2: "80", stroke: "url(#lineGradient)", strokeWidth: "1.5" }), _jsx("line", { x1: "320", y1: "180", x2: "540", y2: "260", stroke: "url(#lineGradient)", strokeWidth: "1.5" }), _jsx("line", { x1: "220", y1: "320", x2: "540", y2: "260", stroke: "url(#lineGradient)", strokeWidth: "1.5" })] }), _jsxs("g", { children: [_jsx("circle", { cx: "320", cy: "180", r: "12", fill: "url(#nodeGradient)", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "12;15;12", dur: "3s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "600", cy: "140", r: "10", fill: "url(#nodeGradient)", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "10;13;10", dur: "3.5s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "120", cy: "80", r: "8", fill: "#3B82F6", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "8;11;8", dur: "4s", begin: "1s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "420", cy: "420", r: "8", fill: "#3B82F6", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "8;11;8", dur: "4.5s", begin: "2.5s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "720", cy: "340", r: "8", fill: "#3B82F6", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "8;11;8", dur: "3.8s", begin: "1.8s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "220", cy: "320", r: "8", fill: "#3B82F6", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "8;11;8", dur: "4.2s", begin: "0.5s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "60", cy: "260", r: "5", fill: "#60A5FA", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "5;7;5", dur: "5s", begin: "3s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "580", cy: "470", r: "5", fill: "#60A5FA", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "5;7;5", dur: "5.5s", begin: "4s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "780", cy: "80", r: "5", fill: "#60A5FA", className: "pulse-node", children: _jsx("animate", { attributeName: "r", values: "5;7;5", dur: "4.8s", begin: "2s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "200", cy: "100", r: "3", fill: "#93C5FD" }), _jsx("circle", { cx: "380", cy: "200", r: "3", fill: "#93C5FD" }), _jsx("circle", { cx: "150", cy: "320", r: "3", fill: "#93C5FD" }), _jsx("circle", { cx: "500", cy: "260", r: "3", fill: "#93C5FD" }), _jsx("circle", { cx: "660", cy: "220", r: "3", fill: "#93C5FD" }), _jsx("circle", { cx: "740", cy: "420", r: "3", fill: "#93C5FD" })] })] }), _jsx("style", { children: `
12
- .pulse-node {
13
- filter: drop-shadow(0 0 8px rgba(37, 99, 235, 0.3));
14
- }
15
-
16
- @keyframes slow-pan {
17
- 0% {
18
- transform: scale(1.08) translateY(0px);
19
- }
20
- 50% {
21
- transform: scale(1.1) translateY(-6px);
22
- }
23
- 100% {
24
- transform: scale(1.08) translateY(0px);
25
- }
26
- }
27
-
28
- svg {
29
- animation: slow-pan 18s ease-in-out infinite;
30
- }
31
-
32
- @media (max-width: 768px) {
33
- svg {
34
- transform: scale(1.15);
35
- }
36
- }
37
- ` })] }));
38
- };
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- export declare function Portfolio(): React.JSX.Element;
3
- //# sourceMappingURL=Portfolio.d.ts.map