@retinalabsllc/zairusjs 0.1.0
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.
- package/README.md +10 -0
- package/dist/index.d.mts +341 -0
- package/dist/index.d.ts +341 -0
- package/dist/index.js +983 -0
- package/dist/index.mjs +926 -0
- package/package.json +56 -0
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,926 @@
|
|
|
1
|
+
// src/components/Faq.tsx
|
|
2
|
+
import React, { useState } from "react";
|
|
3
|
+
import { HugeiconsIcon } from "@hugeicons/react";
|
|
4
|
+
import { ArrowDown01Icon } from "@hugeicons/core-free-icons";
|
|
5
|
+
var Faq = ({
|
|
6
|
+
title = "Frequently Asked Questions",
|
|
7
|
+
subtitle = "Infrastructure Architecture",
|
|
8
|
+
items
|
|
9
|
+
}) => {
|
|
10
|
+
const [activeFaq, setActiveFaq] = useState(null);
|
|
11
|
+
const toggleFaq = (index) => {
|
|
12
|
+
setActiveFaq(activeFaq === index ? null : index);
|
|
13
|
+
};
|
|
14
|
+
return /* @__PURE__ */ React.createElement("div", { className: "w-full flex justify-center mt-10 px-3 md:px-8 z-10 relative" }, /* @__PURE__ */ React.createElement("div", { className: "relative max-w-4xl w-full mx-auto flex flex-col z-10" }, /* @__PURE__ */ React.createElement("div", { className: "mb-10 md:mb-12 relative z-10" }, subtitle && /* @__PURE__ */ React.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, subtitle), title && /* @__PURE__ */ React.createElement("h2", { className: "text-3xl md:text-4xl tracking-tight text-black leading-[1.1] mt-4" }, title)), /* @__PURE__ */ React.createElement("div", { className: "flex flex-col relative z-10 bg-transparent" }, items.map((faq, index) => {
|
|
15
|
+
const isOpen = activeFaq === index;
|
|
16
|
+
const isLast = index === items.length - 1;
|
|
17
|
+
return /* @__PURE__ */ React.createElement(
|
|
18
|
+
"div",
|
|
19
|
+
{
|
|
20
|
+
key: index,
|
|
21
|
+
className: `transition-all duration-300 ${!isLast ? "border-b border-neutral-200" : ""}`
|
|
22
|
+
},
|
|
23
|
+
/* @__PURE__ */ React.createElement(
|
|
24
|
+
"button",
|
|
25
|
+
{
|
|
26
|
+
className: "flex items-center justify-between w-full gap-4 text-left py-5 md:py-6 group outline-none cursor-pointer bg-transparent",
|
|
27
|
+
onClick: () => toggleFaq(index)
|
|
28
|
+
},
|
|
29
|
+
/* @__PURE__ */ React.createElement(
|
|
30
|
+
"span",
|
|
31
|
+
{
|
|
32
|
+
className: `text-[13px] md:text-[14px] transition-colors ${isOpen ? "text-black " : "text-neutral-700 group-hover:text-black"}`
|
|
33
|
+
},
|
|
34
|
+
faq.question
|
|
35
|
+
),
|
|
36
|
+
/* @__PURE__ */ React.createElement(
|
|
37
|
+
"div",
|
|
38
|
+
{
|
|
39
|
+
className: `shrink-0 flex items-center justify-center w-8 h-8 rounded-full border transition-all duration-300 ${isOpen ? "rotate-180 border-black text-black" : "border-neutral-300 text-neutral-500 group-hover:border-neutral-400 group-hover:text-black"}`
|
|
40
|
+
},
|
|
41
|
+
/* @__PURE__ */ React.createElement(HugeiconsIcon, { icon: ArrowDown01Icon, size: 16 })
|
|
42
|
+
)
|
|
43
|
+
),
|
|
44
|
+
/* @__PURE__ */ React.createElement(
|
|
45
|
+
"div",
|
|
46
|
+
{
|
|
47
|
+
className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] pb-6 md:pb-8 opacity-100" : "grid-rows-[0fr] opacity-0"}`
|
|
48
|
+
},
|
|
49
|
+
/* @__PURE__ */ React.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React.createElement("p", { className: "text-[12px] md:text-[13px] leading-[1.8] text-neutral-600 pt-2 pr-4 md:pr-12" }, faq.answer))
|
|
50
|
+
)
|
|
51
|
+
);
|
|
52
|
+
}))));
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
// src/components/ThreeDButton.tsx
|
|
56
|
+
import React2 from "react";
|
|
57
|
+
import Link from "next/link";
|
|
58
|
+
var ThreeDButton = ({
|
|
59
|
+
href,
|
|
60
|
+
children,
|
|
61
|
+
className = "",
|
|
62
|
+
onClick
|
|
63
|
+
}) => {
|
|
64
|
+
const baseShadow = `
|
|
65
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.3),
|
|
66
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
67
|
+
0 3px 0 0 #0c0c0c,
|
|
68
|
+
0 6px 10px rgba(0, 0, 0, 0.3)
|
|
69
|
+
`;
|
|
70
|
+
const hoverShadow = `
|
|
71
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
72
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
73
|
+
0 4px 0 0 #0c0c0c,
|
|
74
|
+
0 8px 12px rgba(0, 0, 0, 0.35)
|
|
75
|
+
`;
|
|
76
|
+
const activeShadow = `
|
|
77
|
+
inset 0 1px 0 0 rgba(255, 255, 255, 0.1),
|
|
78
|
+
inset 0 -1px 0 0 rgba(0, 0, 0, 0.5),
|
|
79
|
+
0 1px 0 0 #0c0c0c,
|
|
80
|
+
0 2px 4px rgba(0, 0, 0, 0.2)
|
|
81
|
+
`;
|
|
82
|
+
return /* @__PURE__ */ React2.createElement(
|
|
83
|
+
Link,
|
|
84
|
+
{
|
|
85
|
+
href,
|
|
86
|
+
onClick,
|
|
87
|
+
className: `relative inline-flex items-center justify-center py-2.5 px-8 rounded-full bg-neutral-950 text-white text-xs transition-all duration-150 select-none group ${className}`,
|
|
88
|
+
style: { boxShadow: baseShadow },
|
|
89
|
+
onMouseEnter: (e) => {
|
|
90
|
+
e.currentTarget.style.boxShadow = hoverShadow;
|
|
91
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
92
|
+
},
|
|
93
|
+
onMouseLeave: (e) => {
|
|
94
|
+
e.currentTarget.style.boxShadow = baseShadow;
|
|
95
|
+
e.currentTarget.style.transform = "translateY(0px)";
|
|
96
|
+
},
|
|
97
|
+
onMouseDown: (e) => {
|
|
98
|
+
e.currentTarget.style.boxShadow = activeShadow;
|
|
99
|
+
e.currentTarget.style.transform = "translateY(2px)";
|
|
100
|
+
},
|
|
101
|
+
onMouseUp: (e) => {
|
|
102
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
/* @__PURE__ */ React2.createElement("span", { className: "absolute inset-0 rounded-full bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none" }),
|
|
106
|
+
/* @__PURE__ */ React2.createElement("span", { className: "relative z-10 pt-1 tracking-wide text-white/95 group-hover:text-white transition-colors duration-150 flex items-center justify-center leading-none" }, children)
|
|
107
|
+
);
|
|
108
|
+
};
|
|
109
|
+
|
|
110
|
+
// src/components/Header.tsx
|
|
111
|
+
import React3 from "react";
|
|
112
|
+
import Link2 from "next/link";
|
|
113
|
+
import Image from "next/image";
|
|
114
|
+
import { usePathname } from "next/navigation";
|
|
115
|
+
var NavLink = ({ href, children, className = "" }) => {
|
|
116
|
+
const pathname = usePathname();
|
|
117
|
+
const isActive = pathname === href;
|
|
118
|
+
return /* @__PURE__ */ React3.createElement(
|
|
119
|
+
Link2,
|
|
120
|
+
{
|
|
121
|
+
href,
|
|
122
|
+
className: `px-3 py-1.5 text-xs transition-colors duration-200 rounded-full ${isActive ? "text-neutral-950 font-medium" : "text-neutral-600 hover:text-neutral-950"} ${className}`
|
|
123
|
+
},
|
|
124
|
+
children
|
|
125
|
+
);
|
|
126
|
+
};
|
|
127
|
+
var Header = ({ logoSrc, companyName, subtitle, links }) => {
|
|
128
|
+
return /* @__PURE__ */ React3.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React3.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto" }, /* @__PURE__ */ React3.createElement("header", { className: "w-full bg-white/95 backdrop-blur-md rounded-full py-2 px-6 flex justify-between items-center shadow-[0_8px_60px_rgba(0,0,0,0.06)] border border-white/40" }, /* @__PURE__ */ React3.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React3.createElement(Link2, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70" }, /* @__PURE__ */ React3.createElement(
|
|
129
|
+
Image,
|
|
130
|
+
{
|
|
131
|
+
src: logoSrc,
|
|
132
|
+
alt: `${companyName} Logo`,
|
|
133
|
+
width: 40,
|
|
134
|
+
height: 40,
|
|
135
|
+
className: "object-contain w-5 h-auto invert",
|
|
136
|
+
priority: true
|
|
137
|
+
}
|
|
138
|
+
), /* @__PURE__ */ React3.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React3.createElement("span", { className: "text-[12px] text-black leading-none tracking-wide mb-1" }, companyName), subtitle && /* @__PURE__ */ React3.createElement("span", { className: "text-[9px] text-neutral-500 tracking-widest leading-none" }, subtitle)))), /* @__PURE__ */ React3.createElement("nav", { className: "flex items-center gap-1 md:gap-2" }, links.map((link, index) => /* @__PURE__ */ React3.createElement(
|
|
139
|
+
NavLink,
|
|
140
|
+
{
|
|
141
|
+
key: index,
|
|
142
|
+
href: link.href,
|
|
143
|
+
className: link.hideOnMobile ? "hidden sm:inline-flex" : ""
|
|
144
|
+
},
|
|
145
|
+
link.label
|
|
146
|
+
))))));
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
// src/components/Footer.tsx
|
|
150
|
+
import React4 from "react";
|
|
151
|
+
import Link3 from "next/link";
|
|
152
|
+
import { HugeiconsIcon as HugeiconsIcon2 } from "@hugeicons/react";
|
|
153
|
+
var Footer = ({
|
|
154
|
+
description,
|
|
155
|
+
columns,
|
|
156
|
+
socialLinks = [],
|
|
157
|
+
copyrightText,
|
|
158
|
+
topSection
|
|
159
|
+
}) => {
|
|
160
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React4.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-16 mb-12 text-left" }, /* @__PURE__ */ React4.createElement("div", { className: "max-w-sm flex flex-col items-start justify-between" }, /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed " }, description))), /* @__PURE__ */ React4.createElement("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-x-8 gap-y-12 w-full lg:w-auto text-left" }, columns.map((col, idx) => /* @__PURE__ */ React4.createElement("div", { key: idx }, /* @__PURE__ */ React4.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6" }, col.title), /* @__PURE__ */ React4.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React4.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React4.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ React4.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))))), /* @__PURE__ */ React4.createElement("div", { className: "pt-8 mt-4 border-t border-neutral-200 flex flex-col-reverse md:flex-row justify-between items-start md:items-center gap-6 relative z-20" }, /* @__PURE__ */ React4.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ React4.createElement(
|
|
161
|
+
"a",
|
|
162
|
+
{
|
|
163
|
+
key: idx,
|
|
164
|
+
href: social.href,
|
|
165
|
+
target: "_blank",
|
|
166
|
+
rel: "noopener noreferrer",
|
|
167
|
+
className: "text-neutral-400 hover:text-black transition-colors",
|
|
168
|
+
"aria-label": social.name
|
|
169
|
+
},
|
|
170
|
+
/* @__PURE__ */ React4.createElement(HugeiconsIcon2, { icon: social.icon, size: 20 })
|
|
171
|
+
))))))));
|
|
172
|
+
};
|
|
173
|
+
|
|
174
|
+
// src/components/HeroSection.tsx
|
|
175
|
+
import React5 from "react";
|
|
176
|
+
import Image2 from "next/image";
|
|
177
|
+
var HeroSection = ({
|
|
178
|
+
badgeText,
|
|
179
|
+
titlePrefix,
|
|
180
|
+
highlightText,
|
|
181
|
+
cursorLabel,
|
|
182
|
+
subtitle,
|
|
183
|
+
ctaText,
|
|
184
|
+
ctaHref,
|
|
185
|
+
showImage = true,
|
|
186
|
+
imageSrc = "/assets/ai.avif"
|
|
187
|
+
}) => {
|
|
188
|
+
return /* @__PURE__ */ React5.createElement("section", { className: "relative pt-32 sm:pt-40 pb-16 flex flex-col items-center overflow-hidden w-full" }, /* @__PURE__ */ React5.createElement(
|
|
189
|
+
"div",
|
|
190
|
+
{
|
|
191
|
+
className: "absolute inset-0 w-full h-full pointer-events-none z-0",
|
|
192
|
+
style: {
|
|
193
|
+
background: `radial-gradient(120% 100% at 50% 0%, #043324 0%, #21a473 45%, #e0f6ce 80%, #ffffff 100%)`
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
), /* @__PURE__ */ React5.createElement(
|
|
197
|
+
"div",
|
|
198
|
+
{
|
|
199
|
+
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
200
|
+
style: {
|
|
201
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
), /* @__PURE__ */ React5.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ React5.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-3.5 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ React5.createElement("span", { className: "flex h-2 w-2 rounded-full bg-[#3ae9a8]" }), /* @__PURE__ */ React5.createElement("span", { className: "text-[11px] tracking-wider text-white" }, badgeText)), /* @__PURE__ */ React5.createElement("h1", { className: "text-4xl sm:text-5xl md:text-6xl text-white tracking-tight leading-[1.3] max-w-3xl mb-6" }, titlePrefix, /* @__PURE__ */ React5.createElement("span", { className: "relative inline-block mx-1.5 px-3 py-1 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none whitespace-nowrap" }, /* @__PURE__ */ React5.createElement("span", { className: "absolute -top-[3.5px] -left-[3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute -top-[3.5px] -right-[3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute -bottom-[3.5px] -left-[3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute -bottom-[3.5px] -right-[3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), highlightText, /* @__PURE__ */ React5.createElement("span", { className: "absolute -bottom-5 -right-5 flex items-center z-20 pointer-events-none select-none filter drop-shadow-[0_2px_4px_rgba(0,0,0,0.25)]" }, /* @__PURE__ */ React5.createElement("svg", { width: "16", height: "20", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ React5.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React5.createElement("span", { className: "ml-1 bg-[#21a473] text-[10px] text-white font-mono font-medium px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel)))), /* @__PURE__ */ React5.createElement("p", { className: "text-sm sm:text-base md:text-lg text-[#bbf7df]/90 max-w-xl mx-auto mb-8 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ React5.createElement("div", { className: "mb-4" }, /* @__PURE__ */ React5.createElement(ThreeDButton, { href: ctaHref }, ctaText)), showImage && /* @__PURE__ */ React5.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ React5.createElement("div", { className: "absolute top-1.5 left-1/2 -translate-x-1/2 w-2.5 h-2.5 bg-[#0a0a0b] rounded-full flex items-center justify-center z-30" }, /* @__PURE__ */ React5.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ React5.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ React5.createElement(
|
|
205
|
+
Image2,
|
|
206
|
+
{
|
|
207
|
+
src: imageSrc,
|
|
208
|
+
alt: "Dashboard Preview",
|
|
209
|
+
fill: true,
|
|
210
|
+
sizes: "(max-w-1024px) 100vw, 1024px",
|
|
211
|
+
className: "object-cover object-top",
|
|
212
|
+
priority: true
|
|
213
|
+
}
|
|
214
|
+
))), /* @__PURE__ */ React5.createElement("div", { className: "relative w-[105%] h-2 md:h-2.5 bg-linear-to-b from-[#e2e8f0] via-[#cbd5e1] to-[#94a3b8] rounded-b-xl border-t border-slate-300 shadow-xl flex justify-center" }, /* @__PURE__ */ React5.createElement("div", { className: "w-16 md:w-24 h-1 md:h-1.5 bg-slate-400/30 rounded-b-md" }))))));
|
|
215
|
+
};
|
|
216
|
+
|
|
217
|
+
// src/components/AppBento2.tsx
|
|
218
|
+
import React6 from "react";
|
|
219
|
+
import { HugeiconsIcon as HugeiconsIcon3 } from "@hugeicons/react";
|
|
220
|
+
var AppBento2 = ({ tagline, headline, features }) => {
|
|
221
|
+
return /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React6.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React6.createElement("div", { className: "relative overflow-hidden mb-8 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React6.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React6.createElement("h2", { className: "text-3xl md:text-4xl tracking-tight text-black leading-[1.1]" }, headline))), /* @__PURE__ */ React6.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
222
|
+
const isHighlight = f.isWhite !== void 0 ? f.isWhite : f.isBrand || i === 1;
|
|
223
|
+
return /* @__PURE__ */ React6.createElement(
|
|
224
|
+
"div",
|
|
225
|
+
{
|
|
226
|
+
key: i,
|
|
227
|
+
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-70 transition-all duration-500 group text-left ${isHighlight ? "bg-black hover:-translate-y-1.5 active:translate-y-0.5" : "bg-neutral-100 hover:-translate-y-1"} ${f.size}`,
|
|
228
|
+
style: {
|
|
229
|
+
boxShadow: isHighlight ? `
|
|
230
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
231
|
+
inset 0 -3px 0 0 rgba(0, 0, 0, 0.6),
|
|
232
|
+
0 4px 0 0 #0c0c0c,
|
|
233
|
+
0 12px 24px rgba(0, 0, 0, 0.15)
|
|
234
|
+
` : "none"
|
|
235
|
+
}
|
|
236
|
+
},
|
|
237
|
+
/* @__PURE__ */ React6.createElement(
|
|
238
|
+
"div",
|
|
239
|
+
{
|
|
240
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
241
|
+
style: {
|
|
242
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
243
|
+
backgroundRepeat: "repeat"
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
),
|
|
247
|
+
isHighlight && /* @__PURE__ */ React6.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
248
|
+
/* @__PURE__ */ React6.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React6.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isHighlight ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: f.icon, size: 180 }))),
|
|
249
|
+
/* @__PURE__ */ React6.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React6.createElement("span", { className: `text-[9px] tracking-widest ${isHighlight ? "text-neutral-400" : "text-neutral-500"}` }, f.label), /* @__PURE__ */ React6.createElement("div", { className: `p-2 rounded-full transition-colors ${isHighlight ? "bg-white/10" : "bg-white"}` }, /* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: f.icon, size: 20, className: `transition-colors ${isHighlight ? "text-white" : "text-neutral-600 group-hover:text-black"}` }))), /* @__PURE__ */ React6.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React6.createElement("h3", { className: `text-xl mb-2 tracking-tight ${isHighlight ? "text-white" : "text-black"}` }, f.title), /* @__PURE__ */ React6.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${isHighlight ? "text-neutral-300" : "text-neutral-600"}` }, f.desc)))
|
|
250
|
+
);
|
|
251
|
+
})))));
|
|
252
|
+
};
|
|
253
|
+
|
|
254
|
+
// src/components/FeatureScroll.tsx
|
|
255
|
+
import React7, { useRef, useState as useState2, useEffect } from "react";
|
|
256
|
+
import Image3 from "next/image";
|
|
257
|
+
import { HugeiconsIcon as HugeiconsIcon4 } from "@hugeicons/react";
|
|
258
|
+
import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon } from "@hugeicons/core-free-icons";
|
|
259
|
+
var FeatureCard = ({ feature }) => {
|
|
260
|
+
const [isLoading, setIsLoading] = useState2(!!feature.image);
|
|
261
|
+
return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React7.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React7.createElement(
|
|
262
|
+
"div",
|
|
263
|
+
{
|
|
264
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
265
|
+
style: {
|
|
266
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
267
|
+
backgroundRepeat: "repeat"
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
), isLoading && feature.image && /* @__PURE__ */ React7.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-50/50 backdrop-blur-sm" }, /* @__PURE__ */ React7.createElement(HugeiconsIcon4, { icon: Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), feature.image ? /* @__PURE__ */ React7.createElement(
|
|
271
|
+
Image3,
|
|
272
|
+
{
|
|
273
|
+
src: feature.image,
|
|
274
|
+
alt: feature.title,
|
|
275
|
+
fill: true,
|
|
276
|
+
sizes: "(max-width: 768px) 90vw, 600px",
|
|
277
|
+
onLoad: () => setIsLoading(false),
|
|
278
|
+
className: `
|
|
279
|
+
object-cover transition-all duration-700 ease-out z-0
|
|
280
|
+
${isLoading ? "scale-110 blur-xl opacity-0" : "scale-100 blur-0 opacity-100"}
|
|
281
|
+
group-hover:scale-105
|
|
282
|
+
`
|
|
283
|
+
}
|
|
284
|
+
) : /* @__PURE__ */ React7.createElement("div", { className: "absolute inset-0 bg-white z-0 transition-transform duration-700 ease-out group-hover:scale-105" })), /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ React7.createElement("h3", { className: "text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React7.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
285
|
+
};
|
|
286
|
+
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
287
|
+
const scrollRef = useRef(null);
|
|
288
|
+
const [canScrollLeft, setCanScrollLeft] = useState2(false);
|
|
289
|
+
const [canScrollRight, setCanScrollRight] = useState2(true);
|
|
290
|
+
const checkScroll = () => {
|
|
291
|
+
if (scrollRef.current) {
|
|
292
|
+
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
293
|
+
setCanScrollLeft(scrollLeft > 0);
|
|
294
|
+
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
295
|
+
}
|
|
296
|
+
};
|
|
297
|
+
useEffect(() => {
|
|
298
|
+
checkScroll();
|
|
299
|
+
window.addEventListener("resize", checkScroll);
|
|
300
|
+
return () => window.removeEventListener("resize", checkScroll);
|
|
301
|
+
}, []);
|
|
302
|
+
const scroll = (direction) => {
|
|
303
|
+
if (scrollRef.current) {
|
|
304
|
+
const scrollAmount = direction === "left" ? -624 : 624;
|
|
305
|
+
scrollRef.current.scrollBy({ left: scrollAmount, behavior: "smooth" });
|
|
306
|
+
}
|
|
307
|
+
};
|
|
308
|
+
return /* @__PURE__ */ React7.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ React7.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ React7.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ React7.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React7.createElement("h2", { className: "text-3xl md:text-5xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ React7.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ React7.createElement(
|
|
309
|
+
"button",
|
|
310
|
+
{
|
|
311
|
+
onClick: () => scroll("left"),
|
|
312
|
+
disabled: !canScrollLeft,
|
|
313
|
+
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
314
|
+
"aria-label": "Previous feature"
|
|
315
|
+
},
|
|
316
|
+
/* @__PURE__ */ React7.createElement(HugeiconsIcon4, { icon: ArrowLeft01Icon, size: 20 })
|
|
317
|
+
), /* @__PURE__ */ React7.createElement(
|
|
318
|
+
"button",
|
|
319
|
+
{
|
|
320
|
+
onClick: () => scroll("right"),
|
|
321
|
+
disabled: !canScrollRight,
|
|
322
|
+
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
323
|
+
"aria-label": "Next feature"
|
|
324
|
+
},
|
|
325
|
+
/* @__PURE__ */ React7.createElement(HugeiconsIcon4, { icon: ArrowRight01Icon, size: 20 })
|
|
326
|
+
))), /* @__PURE__ */ React7.createElement(
|
|
327
|
+
"div",
|
|
328
|
+
{
|
|
329
|
+
ref: scrollRef,
|
|
330
|
+
onScroll: checkScroll,
|
|
331
|
+
className: "flex gap-6 overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] scrollbar-none pb-8 -mx-4 px-4 md:mx-0 md:px-0"
|
|
332
|
+
},
|
|
333
|
+
features.map((feature, idx) => /* @__PURE__ */ React7.createElement(FeatureCard, { key: idx, feature }))
|
|
334
|
+
), /* @__PURE__ */ React7.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ React7.createElement(
|
|
335
|
+
"button",
|
|
336
|
+
{
|
|
337
|
+
onClick: () => scroll("left"),
|
|
338
|
+
disabled: !canScrollLeft,
|
|
339
|
+
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
340
|
+
},
|
|
341
|
+
/* @__PURE__ */ React7.createElement(HugeiconsIcon4, { icon: ArrowLeft01Icon, size: 20 })
|
|
342
|
+
), /* @__PURE__ */ React7.createElement(
|
|
343
|
+
"button",
|
|
344
|
+
{
|
|
345
|
+
onClick: () => scroll("right"),
|
|
346
|
+
disabled: !canScrollRight,
|
|
347
|
+
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
348
|
+
},
|
|
349
|
+
/* @__PURE__ */ React7.createElement(HugeiconsIcon4, { icon: ArrowRight01Icon, size: 20 })
|
|
350
|
+
))));
|
|
351
|
+
};
|
|
352
|
+
|
|
353
|
+
// src/components/AITranscriptionFeature.tsx
|
|
354
|
+
import React8, { useState as useState3 } from "react";
|
|
355
|
+
import Image4 from "next/image";
|
|
356
|
+
import { HugeiconsIcon as HugeiconsIcon5 } from "@hugeicons/react";
|
|
357
|
+
import { Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
|
|
358
|
+
var AITranscriptionFeature = ({
|
|
359
|
+
tagline,
|
|
360
|
+
headline,
|
|
361
|
+
description,
|
|
362
|
+
imagePath = "",
|
|
363
|
+
detailTextPrefix,
|
|
364
|
+
highlightText,
|
|
365
|
+
cursorLabel,
|
|
366
|
+
detailTextSuffix
|
|
367
|
+
}) => {
|
|
368
|
+
const [isLoading, setIsLoading] = useState3(!!imagePath);
|
|
369
|
+
return /* @__PURE__ */ React8.createElement("section", { className: "py-24 w-full flex justify-center bg-white relative z-10" }, /* @__PURE__ */ React8.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React8.createElement("div", { className: "flex flex-col items-center text-center mb-12 relative z-10 animate-in fade-in slide-in-from-bottom-4 duration-700" }, /* @__PURE__ */ React8.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React8.createElement("h2", { className: "text-3xl md:text-5xl tracking-tight animate-gradient-wipe leading-[1.05] mb-4" }, headline), /* @__PURE__ */ React8.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-xl mx-auto" }, description)), /* @__PURE__ */ React8.createElement("div", { className: "relative w-full max-w-5xl mx-auto aspect-video sm:aspect-21/9 bg-neutral-100 rounded-2xl overflow-hidden mb-12 flex items-center justify-center shadow-[0_0_40px_rgba(0,0,0,0.03)] animate-in fade-in zoom-in-95 duration-700 delay-150 fill-mode-both" }, /* @__PURE__ */ React8.createElement(
|
|
370
|
+
"div",
|
|
371
|
+
{
|
|
372
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
373
|
+
style: {
|
|
374
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
375
|
+
backgroundRepeat: "repeat"
|
|
376
|
+
}
|
|
377
|
+
}
|
|
378
|
+
), isLoading && imagePath && /* @__PURE__ */ React8.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ React8.createElement(HugeiconsIcon5, { icon: Loading03Icon2, size: 32, className: "animate-spin text-neutral-400" })), imagePath ? /* @__PURE__ */ React8.createElement(
|
|
379
|
+
Image4,
|
|
380
|
+
{
|
|
381
|
+
src: imagePath,
|
|
382
|
+
alt: "Feature Interface",
|
|
383
|
+
fill: true,
|
|
384
|
+
sizes: "(max-width: 768px) 100vw, 1024px",
|
|
385
|
+
onLoad: () => setIsLoading(false),
|
|
386
|
+
className: `
|
|
387
|
+
object-cover transition-all duration-1000 ease-out z-0
|
|
388
|
+
${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}
|
|
389
|
+
`
|
|
390
|
+
}
|
|
391
|
+
) : /* @__PURE__ */ React8.createElement("div", { className: "absolute inset-0 bg-white z-0" })), /* @__PURE__ */ React8.createElement("div", { className: "max-w-3xl mx-auto text-center animate-in fade-in slide-in-from-bottom-4 duration-700 delay-300 fill-mode-both" }, /* @__PURE__ */ React8.createElement("p", { className: "text-[22px] md:text-[25px] leading-[1.8] text-neutral-800" }, detailTextPrefix, " ", /* @__PURE__ */ React8.createElement("span", { className: "relative inline-block mx-1 px-2.5 py-0.5 bg-[#20A272]/10 border border-[#20A272] rounded-[3px] text-[#1C3D36] transition-all duration-300 whitespace-nowrap" }, /* @__PURE__ */ React8.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React8.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React8.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React8.createElement("span", { className: "absolute bottom-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), highlightText, /* @__PURE__ */ React8.createElement("span", { className: "absolute -bottom-6 -right-6 flex items-center z-20 pointer-events-none select-none filter drop-shadow-[0_2px_4px_rgba(0,0,0,0.15)]" }, /* @__PURE__ */ React8.createElement("svg", { width: "16", height: "20", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ React8.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#20A272", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React8.createElement("span", { className: "ml-1 bg-[#20A272] text-[10px] text-white font-mono px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel))), " ", detailTextSuffix))));
|
|
392
|
+
};
|
|
393
|
+
|
|
394
|
+
// src/components/PlatformFeatures.tsx
|
|
395
|
+
import React9 from "react";
|
|
396
|
+
import { HugeiconsIcon as HugeiconsIcon6 } from "@hugeicons/react";
|
|
397
|
+
var PlatformFeatures = ({
|
|
398
|
+
tagline,
|
|
399
|
+
headline,
|
|
400
|
+
description,
|
|
401
|
+
features
|
|
402
|
+
}) => {
|
|
403
|
+
return /* @__PURE__ */ React9.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ React9.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ React9.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React9.createElement("h2", { className: "text-3xl md:text-5xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ React9.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ React9.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ React9.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-12" }, features.map((feature, idx) => /* @__PURE__ */ React9.createElement(
|
|
404
|
+
"div",
|
|
405
|
+
{
|
|
406
|
+
key: idx,
|
|
407
|
+
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
408
|
+
style: { animationDelay: feature.delay || "0ms" }
|
|
409
|
+
},
|
|
410
|
+
/* @__PURE__ */ React9.createElement("div", { className: "w-12 h-12 rounded-full bg-neutral-100 flex items-center justify-center text-neutral-600 mb-5 transition-colors duration-300" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon6, { icon: feature.icon, size: 24 })),
|
|
411
|
+
/* @__PURE__ */ React9.createElement("div", null, /* @__PURE__ */ React9.createElement("h3", { className: "text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React9.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
412
|
+
)))));
|
|
413
|
+
};
|
|
414
|
+
|
|
415
|
+
// src/components/ManagedDocument.tsx
|
|
416
|
+
import React10 from "react";
|
|
417
|
+
var ManagedDocument = ({
|
|
418
|
+
tagline,
|
|
419
|
+
title,
|
|
420
|
+
sections,
|
|
421
|
+
contactText,
|
|
422
|
+
contactEmail
|
|
423
|
+
}) => {
|
|
424
|
+
return (
|
|
425
|
+
// Outer layout wrapper (takes up available space, adds padding)
|
|
426
|
+
/* @__PURE__ */ React10.createElement("div", { className: "grow pt-28 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React10.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React10.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React10.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React10.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React10.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), sections.map((section, index) => /* @__PURE__ */ React10.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React10.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 text-left uppercase" }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ React10.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left font-light" }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ React10.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ React10.createElement("div", { className: `bg-neutral-100 rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ React10.createElement("p", { className: "italic text-neutral-900 text-[13px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ React10.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React10.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React10.createElement(
|
|
427
|
+
"a",
|
|
428
|
+
{
|
|
429
|
+
href: `mailto:${contactEmail}`,
|
|
430
|
+
className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors"
|
|
431
|
+
},
|
|
432
|
+
contactEmail
|
|
433
|
+
))))))
|
|
434
|
+
);
|
|
435
|
+
};
|
|
436
|
+
|
|
437
|
+
// src/components/ManagedContactBlock.tsx
|
|
438
|
+
import React11, { useState as useState4, useEffect as useEffect2 } from "react";
|
|
439
|
+
import { HugeiconsIcon as HugeiconsIcon7 } from "@hugeicons/react";
|
|
440
|
+
var SecureEmail = ({ user, domain, className }) => {
|
|
441
|
+
const [isMounted, setIsMounted] = useState4(false);
|
|
442
|
+
useEffect2(() => {
|
|
443
|
+
setIsMounted(true);
|
|
444
|
+
}, []);
|
|
445
|
+
if (!isMounted) {
|
|
446
|
+
return /* @__PURE__ */ React11.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
447
|
+
}
|
|
448
|
+
const email = `${user}@${domain}`;
|
|
449
|
+
return /* @__PURE__ */ React11.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
450
|
+
};
|
|
451
|
+
var ManagedContactBlock = ({
|
|
452
|
+
tagline,
|
|
453
|
+
title,
|
|
454
|
+
company,
|
|
455
|
+
emails,
|
|
456
|
+
socials
|
|
457
|
+
}) => {
|
|
458
|
+
return /* @__PURE__ */ React11.createElement("div", { className: "grow pt-28 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React11.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React11.createElement(
|
|
459
|
+
"div",
|
|
460
|
+
{
|
|
461
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
462
|
+
style: {
|
|
463
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
464
|
+
backgroundRepeat: "repeat"
|
|
465
|
+
}
|
|
466
|
+
}
|
|
467
|
+
), /* @__PURE__ */ React11.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React11.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ React11.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React11.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React11.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ React11.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-12" }, company && /* @__PURE__ */ React11.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React11.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Contact Details"), /* @__PURE__ */ React11.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ React11.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ React11.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ React11.createElement("p", { className: "pt-2" }, /* @__PURE__ */ React11.createElement(
|
|
468
|
+
"a",
|
|
469
|
+
{
|
|
470
|
+
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
471
|
+
className: "transition-colors hover:text-black"
|
|
472
|
+
},
|
|
473
|
+
company.phone
|
|
474
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ React11.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React11.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Email Directory"), /* @__PURE__ */ React11.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ React11.createElement("div", { key: idx }, /* @__PURE__ */ React11.createElement("p", { className: "text-[10px] tracking-[0.2em] mb-1.5 text-neutral-500 uppercase" }, email.label), /* @__PURE__ */ React11.createElement(
|
|
475
|
+
SecureEmail,
|
|
476
|
+
{
|
|
477
|
+
user: email.user,
|
|
478
|
+
domain: email.domain,
|
|
479
|
+
className: "text-neutral-600 transition-colors hover:text-black"
|
|
480
|
+
}
|
|
481
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ React11.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React11.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Find Us Online"), /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ React11.createElement(
|
|
482
|
+
"a",
|
|
483
|
+
{
|
|
484
|
+
key: idx,
|
|
485
|
+
href: social.href,
|
|
486
|
+
target: "_blank",
|
|
487
|
+
rel: "noopener noreferrer",
|
|
488
|
+
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
489
|
+
"aria-label": social.label
|
|
490
|
+
},
|
|
491
|
+
/* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: social.icon, size: 18 }),
|
|
492
|
+
/* @__PURE__ */ React11.createElement("span", { className: "text-[13px]" }, social.label)
|
|
493
|
+
)))))))));
|
|
494
|
+
};
|
|
495
|
+
|
|
496
|
+
// src/components/ManagedPricingBlock.tsx
|
|
497
|
+
import React12 from "react";
|
|
498
|
+
import Link4 from "next/link";
|
|
499
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ React12.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
500
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ React12.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
501
|
+
var ManagedPricingBlock = ({
|
|
502
|
+
tagline,
|
|
503
|
+
title,
|
|
504
|
+
plans
|
|
505
|
+
}) => {
|
|
506
|
+
return /* @__PURE__ */ React12.createElement("div", { className: "grow pt-40 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React12.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ React12.createElement("div", { className: "w-full flex flex-col items-center text-center mb-12" }, tagline && /* @__PURE__ */ React12.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block uppercase" }, tagline), /* @__PURE__ */ React12.createElement("h1", { className: "text-2xl sm:text-3xl mt-3 text-black tracking-tight" }, title)), /* @__PURE__ */ React12.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl" }, plans.map((plan, planIdx) => /* @__PURE__ */ React12.createElement(
|
|
507
|
+
"div",
|
|
508
|
+
{
|
|
509
|
+
key: planIdx,
|
|
510
|
+
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden ${plan.isPremium ? "border border-neutral-100" : ""}`
|
|
511
|
+
},
|
|
512
|
+
/* @__PURE__ */ React12.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React12.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ React12.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ React12.createElement("span", { className: "text-3xl text-black" }, plan.price), plan.period && /* @__PURE__ */ React12.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-neutral-500 mt-2" }, plan.description)),
|
|
513
|
+
plan.isPremium ? /* @__PURE__ */ React12.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ React12.createElement(
|
|
514
|
+
Link4,
|
|
515
|
+
{
|
|
516
|
+
href: plan.ctaHref,
|
|
517
|
+
className: "w-full py-2 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none"
|
|
518
|
+
},
|
|
519
|
+
plan.ctaText
|
|
520
|
+
),
|
|
521
|
+
/* @__PURE__ */ React12.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
522
|
+
const isAvailable = feature.value !== false;
|
|
523
|
+
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
524
|
+
return /* @__PURE__ */ React12.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ React12.createElement(CheckIcon, null) : /* @__PURE__ */ React12.createElement(CrossIcon, null), /* @__PURE__ */ React12.createElement("span", { className: `text-xs ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ React12.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
525
|
+
}))
|
|
526
|
+
)))));
|
|
527
|
+
};
|
|
528
|
+
|
|
529
|
+
// src/components/ManagedBoardBlock.tsx
|
|
530
|
+
import React13 from "react";
|
|
531
|
+
import Image5 from "next/image";
|
|
532
|
+
import { HugeiconsIcon as HugeiconsIcon8 } from "@hugeicons/react";
|
|
533
|
+
import { TwitterIcon, LinkedinIcon } from "@hugeicons/core-free-icons";
|
|
534
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ React13.createElement(
|
|
535
|
+
"a",
|
|
536
|
+
{
|
|
537
|
+
href,
|
|
538
|
+
target: "_blank",
|
|
539
|
+
rel: "noopener noreferrer",
|
|
540
|
+
className: "text-neutral-400 hover:text-black transition-colors",
|
|
541
|
+
"aria-label": `${name} on ${label}`
|
|
542
|
+
},
|
|
543
|
+
/* @__PURE__ */ React13.createElement(HugeiconsIcon8, { icon, size: 16 })
|
|
544
|
+
);
|
|
545
|
+
var ManagedBoardBlock = ({
|
|
546
|
+
tagline,
|
|
547
|
+
title,
|
|
548
|
+
members,
|
|
549
|
+
contactText,
|
|
550
|
+
contactEmail
|
|
551
|
+
}) => {
|
|
552
|
+
return /* @__PURE__ */ React13.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React13.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ React13.createElement(
|
|
553
|
+
"div",
|
|
554
|
+
{
|
|
555
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
556
|
+
style: {
|
|
557
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
558
|
+
backgroundRepeat: "repeat"
|
|
559
|
+
}
|
|
560
|
+
}
|
|
561
|
+
), /* @__PURE__ */ React13.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React13.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React13.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React13.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React13.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ React13.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-8" }, members.map((member, idx) => /* @__PURE__ */ React13.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ React13.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ React13.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ React13.createElement(
|
|
562
|
+
Image5,
|
|
563
|
+
{
|
|
564
|
+
src: member.imageSrc,
|
|
565
|
+
alt: member.name,
|
|
566
|
+
fill: true,
|
|
567
|
+
sizes: "(max-width: 768px) 56px, 64px",
|
|
568
|
+
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
569
|
+
}
|
|
570
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "pt-1" }, /* @__PURE__ */ React13.createElement("h3", { className: "text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ React13.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-500 mt-1.5 uppercase" }, member.title))), /* @__PURE__ */ React13.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ React13.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ React13.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React13.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ React13.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ React13.createElement(
|
|
571
|
+
MemberSocialLink,
|
|
572
|
+
{
|
|
573
|
+
href: `https://x.com/${member.twitterHandle}`,
|
|
574
|
+
icon: TwitterIcon,
|
|
575
|
+
label: "X",
|
|
576
|
+
name: member.name
|
|
577
|
+
}
|
|
578
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ React13.createElement(
|
|
579
|
+
MemberSocialLink,
|
|
580
|
+
{
|
|
581
|
+
href: member.linkedinHandle,
|
|
582
|
+
icon: LinkedinIcon,
|
|
583
|
+
label: "LinkedIn",
|
|
584
|
+
name: member.name
|
|
585
|
+
}
|
|
586
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ React13.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React13.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React13.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
587
|
+
};
|
|
588
|
+
|
|
589
|
+
// src/components/ManagedProjectsBlock.tsx
|
|
590
|
+
import React14 from "react";
|
|
591
|
+
import Link5 from "next/link";
|
|
592
|
+
var GridSection = ({
|
|
593
|
+
children,
|
|
594
|
+
isLast = false,
|
|
595
|
+
className = "py-8 md:py-10"
|
|
596
|
+
}) => /* @__PURE__ */ React14.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "border-b border-neutral-100" : ""}` }, children);
|
|
597
|
+
var ManagedProjectsBlock = ({
|
|
598
|
+
tagline,
|
|
599
|
+
title,
|
|
600
|
+
projects
|
|
601
|
+
}) => {
|
|
602
|
+
return /* @__PURE__ */ React14.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React14.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ React14.createElement(
|
|
603
|
+
"div",
|
|
604
|
+
{
|
|
605
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
606
|
+
style: {
|
|
607
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
608
|
+
backgroundRepeat: "repeat"
|
|
609
|
+
}
|
|
610
|
+
}
|
|
611
|
+
), /* @__PURE__ */ React14.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React14.createElement(GridSection, null, tagline && /* @__PURE__ */ React14.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React14.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
612
|
+
const isLast = index === projects.length - 1;
|
|
613
|
+
const projectContent = /* @__PURE__ */ React14.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ React14.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ React14.createElement("h2", { className: "text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ React14.createElement("span", { className: "text-[12px] opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ React14.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] uppercase transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-neutral-100 text-neutral-500 group-hover:bg-neutral-200 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ React14.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 shrink-0 uppercase" }, project.date)), /* @__PURE__ */ React14.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
614
|
+
return /* @__PURE__ */ React14.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ React14.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React14.createElement(Link5, { href: project.link, className: "block outline-none" }, projectContent));
|
|
615
|
+
}))));
|
|
616
|
+
};
|
|
617
|
+
|
|
618
|
+
// src/components/ManagedNotFoundBlock.tsx
|
|
619
|
+
import React15 from "react";
|
|
620
|
+
import Link6 from "next/link";
|
|
621
|
+
var ManagedNotFoundBlock = ({
|
|
622
|
+
title = "404 - Page Not Found",
|
|
623
|
+
description = "The page you are looking for does not exist or has been moved.",
|
|
624
|
+
backLinkText = "\u2190 Go back to Homepage",
|
|
625
|
+
backLinkHref = "/"
|
|
626
|
+
}) => {
|
|
627
|
+
return /* @__PURE__ */ React15.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ React15.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ React15.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ React15.createElement(
|
|
628
|
+
"svg",
|
|
629
|
+
{
|
|
630
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
631
|
+
viewBox: "0 0 24 24",
|
|
632
|
+
className: "w-12 h-12 fill-neutral-200"
|
|
633
|
+
},
|
|
634
|
+
/* @__PURE__ */ React15.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" })
|
|
635
|
+
)), /* @__PURE__ */ React15.createElement("h1", { className: "text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ React15.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description), /* @__PURE__ */ React15.createElement(
|
|
636
|
+
Link6,
|
|
637
|
+
{
|
|
638
|
+
href: backLinkHref,
|
|
639
|
+
className: "text-[11px] tracking-[0.2em] text-neutral-400 hover:text-black transition-colors pb-1 uppercase"
|
|
640
|
+
},
|
|
641
|
+
backLinkText
|
|
642
|
+
)));
|
|
643
|
+
};
|
|
644
|
+
|
|
645
|
+
// src/components/PageSpinner.tsx
|
|
646
|
+
import React16 from "react";
|
|
647
|
+
import { HugeiconsIcon as HugeiconsIcon9 } from "@hugeicons/react";
|
|
648
|
+
import { Loading03Icon as Loading03Icon3 } from "@hugeicons/core-free-icons";
|
|
649
|
+
var PageSpinner = ({
|
|
650
|
+
className = "",
|
|
651
|
+
iconClassName = "text-black",
|
|
652
|
+
size = 32
|
|
653
|
+
}) => {
|
|
654
|
+
return (
|
|
655
|
+
// z-[100] ensures it sits above absolute headers and modals
|
|
656
|
+
/* @__PURE__ */ React16.createElement("div", { className: `fixed inset-0 z-100 flex flex-col items-center justify-center w-full h-full pointer-events-none ${className}` }, /* @__PURE__ */ React16.createElement(
|
|
657
|
+
HugeiconsIcon9,
|
|
658
|
+
{
|
|
659
|
+
icon: Loading03Icon3,
|
|
660
|
+
size,
|
|
661
|
+
className: `animate-spin mb-4 ${iconClassName}`
|
|
662
|
+
}
|
|
663
|
+
))
|
|
664
|
+
);
|
|
665
|
+
};
|
|
666
|
+
|
|
667
|
+
// src/components/ManagedToaster.tsx
|
|
668
|
+
import React17 from "react";
|
|
669
|
+
import { Toaster } from "react-hot-toast";
|
|
670
|
+
var ManagedToaster = (props) => {
|
|
671
|
+
return /* @__PURE__ */ React17.createElement(
|
|
672
|
+
Toaster,
|
|
673
|
+
{
|
|
674
|
+
position: "top-right",
|
|
675
|
+
...props,
|
|
676
|
+
toastOptions: {
|
|
677
|
+
style: {
|
|
678
|
+
background: "#171717",
|
|
679
|
+
color: "#fafafa",
|
|
680
|
+
fontSize: "11px",
|
|
681
|
+
padding: "8px 12px",
|
|
682
|
+
borderRadius: "8px",
|
|
683
|
+
minWidth: "fit-content",
|
|
684
|
+
boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.5)"
|
|
685
|
+
},
|
|
686
|
+
success: {
|
|
687
|
+
iconTheme: {
|
|
688
|
+
primary: "#fafafa",
|
|
689
|
+
secondary: "#171717"
|
|
690
|
+
}
|
|
691
|
+
},
|
|
692
|
+
error: {
|
|
693
|
+
iconTheme: {
|
|
694
|
+
primary: "#fafafa",
|
|
695
|
+
secondary: "#171717"
|
|
696
|
+
}
|
|
697
|
+
},
|
|
698
|
+
...props.toastOptions
|
|
699
|
+
// Allows overriding specific toast styles if needed
|
|
700
|
+
}
|
|
701
|
+
}
|
|
702
|
+
);
|
|
703
|
+
};
|
|
704
|
+
|
|
705
|
+
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
706
|
+
import React18 from "react";
|
|
707
|
+
import Image6 from "next/image";
|
|
708
|
+
var ManagedNewsletterSplitBlock = ({
|
|
709
|
+
tagline,
|
|
710
|
+
title,
|
|
711
|
+
subtitle,
|
|
712
|
+
description,
|
|
713
|
+
imageSrc,
|
|
714
|
+
imageAlt = "Profile Image",
|
|
715
|
+
dividerText = "CONTACT",
|
|
716
|
+
ctaText = "Connect With Me",
|
|
717
|
+
ctaHref = "/contact-us",
|
|
718
|
+
children
|
|
719
|
+
}) => {
|
|
720
|
+
return /* @__PURE__ */ React18.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0 bg-white" }, /* @__PURE__ */ React18.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ React18.createElement(
|
|
721
|
+
Image6,
|
|
722
|
+
{
|
|
723
|
+
src: imageSrc,
|
|
724
|
+
alt: imageAlt,
|
|
725
|
+
fill: true,
|
|
726
|
+
priority: true,
|
|
727
|
+
className: "object-cover object-top grayscale opacity-60",
|
|
728
|
+
quality: 100
|
|
729
|
+
}
|
|
730
|
+
), /* @__PURE__ */ React18.createElement(
|
|
731
|
+
"div",
|
|
732
|
+
{
|
|
733
|
+
className: "absolute inset-0 z-10 pointer-events-none",
|
|
734
|
+
style: {
|
|
735
|
+
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
736
|
+
}
|
|
737
|
+
}
|
|
738
|
+
), /* @__PURE__ */ React18.createElement(
|
|
739
|
+
"div",
|
|
740
|
+
{
|
|
741
|
+
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
742
|
+
style: {
|
|
743
|
+
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
744
|
+
}
|
|
745
|
+
}
|
|
746
|
+
)), /* @__PURE__ */ React18.createElement("div", { className: "w-full md:w-1/2 flex mt-22 flex-col items-center justify-center p-4 md:p-12 relative z-20" }, /* @__PURE__ */ React18.createElement("div", { className: "relative w-full max-w-lg p-8 md:p-12 text-center md:text-left transition-all duration-700 ease-out" }, /* @__PURE__ */ React18.createElement(
|
|
747
|
+
"div",
|
|
748
|
+
{
|
|
749
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
750
|
+
style: {
|
|
751
|
+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
752
|
+
backgroundRepeat: "repeat"
|
|
753
|
+
}
|
|
754
|
+
}
|
|
755
|
+
), /* @__PURE__ */ React18.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React18.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ React18.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 uppercase" }, tagline), /* @__PURE__ */ React18.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ React18.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 uppercase" }, subtitle)), /* @__PURE__ */ React18.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ React18.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ React18.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ React18.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React18.createElement("div", { className: "grow h-px bg-neutral-200" }), /* @__PURE__ */ React18.createElement("span", { className: "shrink mx-4 text-[10px] tracking-[0.2em] text-neutral-400 uppercase" }, dividerText), /* @__PURE__ */ React18.createElement("div", { className: "grow h-px bg-neutral-200" })), ctaText && ctaHref && /* @__PURE__ */ React18.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React18.createElement(
|
|
756
|
+
ThreeDButton,
|
|
757
|
+
{
|
|
758
|
+
href: ctaHref,
|
|
759
|
+
className: "py-3 uppercase tracking-widest text-[11px]"
|
|
760
|
+
},
|
|
761
|
+
ctaText
|
|
762
|
+
)))))));
|
|
763
|
+
};
|
|
764
|
+
|
|
765
|
+
// src/components/ReusableInputs.tsx
|
|
766
|
+
import React19 from "react";
|
|
767
|
+
var TextInput = ({
|
|
768
|
+
label,
|
|
769
|
+
value,
|
|
770
|
+
onChange,
|
|
771
|
+
placeholder,
|
|
772
|
+
maxLength,
|
|
773
|
+
disabled,
|
|
774
|
+
readOnly,
|
|
775
|
+
onClick
|
|
776
|
+
}) => /* @__PURE__ */ React19.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, /* @__PURE__ */ React19.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ React19.createElement(
|
|
777
|
+
"input",
|
|
778
|
+
{
|
|
779
|
+
type: "text",
|
|
780
|
+
value,
|
|
781
|
+
onChange: (e) => onChange(e.target.value.substring(0, maxLength || 100)),
|
|
782
|
+
placeholder,
|
|
783
|
+
disabled,
|
|
784
|
+
readOnly,
|
|
785
|
+
autoComplete: "off",
|
|
786
|
+
spellCheck: "false",
|
|
787
|
+
className: `w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
|
|
788
|
+
}
|
|
789
|
+
));
|
|
790
|
+
var NumberInput = ({
|
|
791
|
+
label,
|
|
792
|
+
value,
|
|
793
|
+
onChange,
|
|
794
|
+
placeholder,
|
|
795
|
+
maxLength,
|
|
796
|
+
disabled
|
|
797
|
+
}) => /* @__PURE__ */ React19.createElement("div", { className: "space-y-2 flex-1 w-full" }, /* @__PURE__ */ React19.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ React19.createElement(
|
|
798
|
+
"input",
|
|
799
|
+
{
|
|
800
|
+
type: "text",
|
|
801
|
+
value,
|
|
802
|
+
onChange: (e) => {
|
|
803
|
+
const numOnly = e.target.value.replace(/[^0-9]/g, "");
|
|
804
|
+
onChange(numOnly.substring(0, maxLength || 20));
|
|
805
|
+
},
|
|
806
|
+
placeholder,
|
|
807
|
+
disabled,
|
|
808
|
+
autoComplete: "off",
|
|
809
|
+
spellCheck: "false",
|
|
810
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50"
|
|
811
|
+
}
|
|
812
|
+
));
|
|
813
|
+
|
|
814
|
+
// src/components/PortfolioHero.tsx
|
|
815
|
+
import React20, { useEffect as useEffect3, useRef as useRef2 } from "react";
|
|
816
|
+
import Link7 from "next/link";
|
|
817
|
+
import Image7 from "next/image";
|
|
818
|
+
import { HugeiconsIcon as HugeiconsIcon10 } from "@hugeicons/react";
|
|
819
|
+
import { ArrowRight01Icon as ArrowRight01Icon2 } from "@hugeicons/core-free-icons";
|
|
820
|
+
var useScrollAnimation = () => {
|
|
821
|
+
const elementRef = useRef2(null);
|
|
822
|
+
useEffect3(() => {
|
|
823
|
+
const el = elementRef.current;
|
|
824
|
+
if (!el) return;
|
|
825
|
+
const observer = new IntersectionObserver(
|
|
826
|
+
(entries) => {
|
|
827
|
+
entries.forEach((entry) => {
|
|
828
|
+
if (entry.isIntersecting) {
|
|
829
|
+
entry.target.classList.add("opacity-100", "translate-y-0");
|
|
830
|
+
entry.target.classList.remove("opacity-0", "translate-y-5");
|
|
831
|
+
observer.unobserve(entry.target);
|
|
832
|
+
}
|
|
833
|
+
});
|
|
834
|
+
},
|
|
835
|
+
{ threshold: 0.1 }
|
|
836
|
+
);
|
|
837
|
+
observer.observe(el);
|
|
838
|
+
return () => {
|
|
839
|
+
if (el) observer.unobserve(el);
|
|
840
|
+
};
|
|
841
|
+
}, []);
|
|
842
|
+
return elementRef;
|
|
843
|
+
};
|
|
844
|
+
var PortfolioHero = ({
|
|
845
|
+
imageSrc,
|
|
846
|
+
imageAlt = "Profile Avatar",
|
|
847
|
+
name,
|
|
848
|
+
socialLabel,
|
|
849
|
+
socialLinkText,
|
|
850
|
+
socialLinkHref,
|
|
851
|
+
bio,
|
|
852
|
+
primaryCtaText,
|
|
853
|
+
primaryCtaHref,
|
|
854
|
+
secondaryCtaText,
|
|
855
|
+
secondaryCtaHref
|
|
856
|
+
}) => {
|
|
857
|
+
const heroContentRef = useScrollAnimation();
|
|
858
|
+
return /* @__PURE__ */ React20.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full bg-white" }, /* @__PURE__ */ React20.createElement(
|
|
859
|
+
"div",
|
|
860
|
+
{
|
|
861
|
+
ref: heroContentRef,
|
|
862
|
+
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
863
|
+
},
|
|
864
|
+
/* @__PURE__ */ React20.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React20.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-200 shrink-0 shadow-sm" }, /* @__PURE__ */ React20.createElement(
|
|
865
|
+
Image7,
|
|
866
|
+
{
|
|
867
|
+
src: imageSrc,
|
|
868
|
+
alt: imageAlt,
|
|
869
|
+
fill: true,
|
|
870
|
+
priority: true,
|
|
871
|
+
className: "object-cover object-top grayscale",
|
|
872
|
+
sizes: "(max-width: 640px) 80px, 128px",
|
|
873
|
+
quality: 100
|
|
874
|
+
}
|
|
875
|
+
)), /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ React20.createElement("h1", { className: "text-3xl sm:text-5xl animate-gradient-wipe lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ React20.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 uppercase" }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ React20.createElement(
|
|
876
|
+
"a",
|
|
877
|
+
{
|
|
878
|
+
href: socialLinkHref,
|
|
879
|
+
target: "_blank",
|
|
880
|
+
rel: "noopener noreferrer",
|
|
881
|
+
className: "text-[12px] md:text-[14px] text-black hover:text-neutral-500 transition-colors mt-1 underline underline-offset-4 decoration-neutral-300"
|
|
882
|
+
},
|
|
883
|
+
socialLinkText
|
|
884
|
+
))),
|
|
885
|
+
/* @__PURE__ */ React20.createElement("p", { className: "text-[13px] md:text-[16px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
886
|
+
/* @__PURE__ */ React20.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ React20.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ React20.createElement(
|
|
887
|
+
ThreeDButton,
|
|
888
|
+
{
|
|
889
|
+
href: primaryCtaHref,
|
|
890
|
+
className: "py-3 uppercase tracking-widest text-[11px]"
|
|
891
|
+
},
|
|
892
|
+
primaryCtaText
|
|
893
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React20.createElement(
|
|
894
|
+
Link7,
|
|
895
|
+
{
|
|
896
|
+
href: secondaryCtaHref,
|
|
897
|
+
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] uppercase rounded-full px-8 py-3.5 bg-neutral-100 transition-colors text-black hover:bg-neutral-200 outline-none"
|
|
898
|
+
},
|
|
899
|
+
secondaryCtaText,
|
|
900
|
+
/* @__PURE__ */ React20.createElement(HugeiconsIcon10, { icon: ArrowRight01Icon2, size: 16 })
|
|
901
|
+
))
|
|
902
|
+
));
|
|
903
|
+
};
|
|
904
|
+
export {
|
|
905
|
+
AITranscriptionFeature,
|
|
906
|
+
AppBento2,
|
|
907
|
+
Faq,
|
|
908
|
+
FeatureScroll,
|
|
909
|
+
Footer,
|
|
910
|
+
Header,
|
|
911
|
+
HeroSection,
|
|
912
|
+
ManagedBoardBlock,
|
|
913
|
+
ManagedContactBlock,
|
|
914
|
+
ManagedDocument,
|
|
915
|
+
ManagedNewsletterSplitBlock,
|
|
916
|
+
ManagedNotFoundBlock,
|
|
917
|
+
ManagedPricingBlock,
|
|
918
|
+
ManagedProjectsBlock,
|
|
919
|
+
ManagedToaster,
|
|
920
|
+
NumberInput,
|
|
921
|
+
PageSpinner,
|
|
922
|
+
PlatformFeatures,
|
|
923
|
+
PortfolioHero,
|
|
924
|
+
TextInput,
|
|
925
|
+
ThreeDButton
|
|
926
|
+
};
|