@retinalabsllc/zairusjs 0.2.0 → 0.2.2
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/dist/index.d.mts +72 -1
- package/dist/index.d.ts +72 -1
- package/dist/index.js +604 -141
- package/dist/index.mjs +591 -132
- package/package.json +3 -2
package/dist/index.mjs
CHANGED
|
@@ -109,8 +109,335 @@ var ThreeDButton = ({
|
|
|
109
109
|
);
|
|
110
110
|
};
|
|
111
111
|
|
|
112
|
-
// src/components/
|
|
112
|
+
// src/components/ThreeDActionButton.tsx
|
|
113
113
|
import React3 from "react";
|
|
114
|
+
import { HugeiconsIcon as HugeiconsIcon2 } from "@hugeicons/react";
|
|
115
|
+
import { Loading03Icon } from "@hugeicons/core-free-icons";
|
|
116
|
+
var ThreeDActionButton = ({
|
|
117
|
+
type = "button",
|
|
118
|
+
onClick,
|
|
119
|
+
disabled = false,
|
|
120
|
+
isLoading = false,
|
|
121
|
+
children,
|
|
122
|
+
className = "",
|
|
123
|
+
ariaLabel
|
|
124
|
+
}) => {
|
|
125
|
+
const isInteractionDisabled = disabled || isLoading;
|
|
126
|
+
const baseShadow = `
|
|
127
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.3),
|
|
128
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
129
|
+
0 3px 0 0 #0c0c0c,
|
|
130
|
+
0 6px 10px rgba(0, 0, 0, 0.3)
|
|
131
|
+
`;
|
|
132
|
+
const hoverShadow = `
|
|
133
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
134
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
135
|
+
0 4px 0 0 #0c0c0c,
|
|
136
|
+
0 8px 12px rgba(0, 0, 0, 0.35)
|
|
137
|
+
`;
|
|
138
|
+
const activeShadow = `
|
|
139
|
+
inset 0 1px 0 0 rgba(255, 255, 255, 0.1),
|
|
140
|
+
inset 0 -1px 0 0 rgba(0, 0, 0, 0.5),
|
|
141
|
+
0 1px 0 0 #0c0c0c,
|
|
142
|
+
0 2px 4px rgba(0, 0, 0, 0.2)
|
|
143
|
+
`;
|
|
144
|
+
const disabledShadow = `
|
|
145
|
+
inset 0 1px 0 0 rgba(255, 255, 255, 0.15),
|
|
146
|
+
inset 0 -1px 0 0 rgba(0, 0, 0, 0.3),
|
|
147
|
+
0 1px 0 0 #1c1c1c
|
|
148
|
+
`;
|
|
149
|
+
return /* @__PURE__ */ React3.createElement(
|
|
150
|
+
"button",
|
|
151
|
+
{
|
|
152
|
+
type,
|
|
153
|
+
disabled: isInteractionDisabled,
|
|
154
|
+
onClick,
|
|
155
|
+
"aria-label": ariaLabel,
|
|
156
|
+
className: `
|
|
157
|
+
relative inline-flex items-center justify-center py-2.5 px-8 rounded-full
|
|
158
|
+
bg-neutral-950 text-white text-xs tracking-widest
|
|
159
|
+
transition-all duration-150 select-none group outline-none
|
|
160
|
+
${isInteractionDisabled ? "opacity-50 cursor-not-allowed" : "active:translate-y-0.5"}
|
|
161
|
+
${className}
|
|
162
|
+
`,
|
|
163
|
+
style: { boxShadow: isInteractionDisabled ? disabledShadow : baseShadow },
|
|
164
|
+
onMouseEnter: (e) => {
|
|
165
|
+
if (isInteractionDisabled) return;
|
|
166
|
+
e.currentTarget.style.boxShadow = hoverShadow;
|
|
167
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
168
|
+
},
|
|
169
|
+
onMouseLeave: (e) => {
|
|
170
|
+
if (isInteractionDisabled) return;
|
|
171
|
+
e.currentTarget.style.boxShadow = baseShadow;
|
|
172
|
+
e.currentTarget.style.transform = "translateY(0px)";
|
|
173
|
+
},
|
|
174
|
+
onMouseDown: (e) => {
|
|
175
|
+
if (isInteractionDisabled) return;
|
|
176
|
+
e.currentTarget.style.boxShadow = activeShadow;
|
|
177
|
+
e.currentTarget.style.transform = "translateY(2px)";
|
|
178
|
+
},
|
|
179
|
+
onMouseUp: (e) => {
|
|
180
|
+
if (isInteractionDisabled) return;
|
|
181
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
182
|
+
}
|
|
183
|
+
},
|
|
184
|
+
/* @__PURE__ */ React3.createElement("span", { className: "absolute inset-0 rounded-full bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none" }),
|
|
185
|
+
/* @__PURE__ */ React3.createElement("span", { className: "relative z-10 flex items-center justify-center gap-2 leading-none" }, isLoading ? /* @__PURE__ */ React3.createElement(HugeiconsIcon2, { icon: Loading03Icon, size: 16, className: "animate-spin text-white" }) : children)
|
|
186
|
+
);
|
|
187
|
+
};
|
|
188
|
+
|
|
189
|
+
// src/components/ZairusAuth.tsx
|
|
190
|
+
import React4, { useState as useState2, useRef, useEffect, Suspense } from "react";
|
|
191
|
+
import { useSearchParams } from "next/navigation";
|
|
192
|
+
import toast from "react-hot-toast";
|
|
193
|
+
import { useGoogleReCaptcha, GoogleReCaptchaProvider } from "react-google-recaptcha-v3";
|
|
194
|
+
var InputSpinner = () => /* @__PURE__ */ React4.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React4.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React4.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
|
|
195
|
+
function AuthFormInner({
|
|
196
|
+
companyName,
|
|
197
|
+
workspaceLabel = "Workspace",
|
|
198
|
+
termsUrl = "https://retinalabs.company/terms-of-service",
|
|
199
|
+
privacyUrl = "https://retinalabs.company/privacy-policy",
|
|
200
|
+
requireNames = true,
|
|
201
|
+
requireOrganization = true,
|
|
202
|
+
useRecaptcha = false,
|
|
203
|
+
defaultRedirectPath = "/app",
|
|
204
|
+
onAuthRequest,
|
|
205
|
+
onVerifyOtp
|
|
206
|
+
}) {
|
|
207
|
+
const searchParams = useSearchParams();
|
|
208
|
+
const redirectUrl = searchParams.get("redirect") || defaultRedirectPath;
|
|
209
|
+
const captchaContext = useRecaptcha ? useGoogleReCaptcha() : null;
|
|
210
|
+
const [mode, setMode] = useState2("LOGIN");
|
|
211
|
+
const [step, setStep] = useState2("INPUT");
|
|
212
|
+
const getInitialSignupStep = () => {
|
|
213
|
+
if (requireNames) return "NAME";
|
|
214
|
+
if (requireOrganization) return "ORGANIZATION";
|
|
215
|
+
return "EMAIL_ID";
|
|
216
|
+
};
|
|
217
|
+
const [signupStep, setSignupStep] = useState2(getInitialSignupStep());
|
|
218
|
+
const [isSubmitting, setIsSubmitting] = useState2(false);
|
|
219
|
+
const [countdown, setCountdown] = useState2(0);
|
|
220
|
+
const [emailId, setEmailId] = useState2("");
|
|
221
|
+
const [firstName, setFirstName] = useState2("");
|
|
222
|
+
const [lastName, setLastName] = useState2("");
|
|
223
|
+
const [orgName, setOrgName] = useState2("");
|
|
224
|
+
const [agreedToTerms, setAgreedToTerms] = useState2(false);
|
|
225
|
+
const [otp, setOtp] = useState2(["", "", "", "", "", ""]);
|
|
226
|
+
const inputRefs = useRef([]);
|
|
227
|
+
const cleanAlpha = (val) => val.replace(/[^a-zA-Z\s-]/g, "");
|
|
228
|
+
const cleanOrgName = (val) => val.replace(/[^a-zA-Z0-9\s]/g, "").substring(0, 50);
|
|
229
|
+
const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
|
|
230
|
+
useEffect(() => {
|
|
231
|
+
if (countdown > 0) {
|
|
232
|
+
const timer = setTimeout(() => setCountdown(countdown - 1), 1e3);
|
|
233
|
+
return () => clearTimeout(timer);
|
|
234
|
+
}
|
|
235
|
+
}, [countdown]);
|
|
236
|
+
const handleOtpChange = (index, value) => {
|
|
237
|
+
const cleanValue = value.replace(/[^0-9]/g, "");
|
|
238
|
+
if (!cleanValue && value !== "") return;
|
|
239
|
+
const newOtp = [...otp];
|
|
240
|
+
newOtp[index] = cleanValue.slice(-1);
|
|
241
|
+
setOtp(newOtp);
|
|
242
|
+
if (cleanValue && index < 5) {
|
|
243
|
+
inputRefs.current[index + 1]?.focus();
|
|
244
|
+
}
|
|
245
|
+
};
|
|
246
|
+
const handlePaste = (e) => {
|
|
247
|
+
e.preventDefault();
|
|
248
|
+
const pastedData = e.clipboardData.getData("text/plain");
|
|
249
|
+
const numbersOnly = pastedData.replace(/[^0-9]/g, "");
|
|
250
|
+
if (!numbersOnly) return;
|
|
251
|
+
const newOtp = [...otp];
|
|
252
|
+
const length = Math.min(numbersOnly.length, 6);
|
|
253
|
+
for (let i = 0; i < length; i++) {
|
|
254
|
+
newOtp[i] = numbersOnly[i];
|
|
255
|
+
}
|
|
256
|
+
setOtp(newOtp);
|
|
257
|
+
if (length < 6) {
|
|
258
|
+
inputRefs.current[length]?.focus();
|
|
259
|
+
} else {
|
|
260
|
+
inputRefs.current[5]?.focus();
|
|
261
|
+
verifyOtpCode(newOtp.join(""));
|
|
262
|
+
}
|
|
263
|
+
};
|
|
264
|
+
const handleAuthRequestSubmit = async (e) => {
|
|
265
|
+
if (e) e.preventDefault();
|
|
266
|
+
if (mode === "SIGNUP" && !agreedToTerms) {
|
|
267
|
+
toast.error("You must agree to the Terms and Privacy Policy.");
|
|
268
|
+
return;
|
|
269
|
+
}
|
|
270
|
+
if (isSubmitting || countdown > 0) return;
|
|
271
|
+
setIsSubmitting(true);
|
|
272
|
+
try {
|
|
273
|
+
let recaptchaToken = void 0;
|
|
274
|
+
if (useRecaptcha && captchaContext?.executeRecaptcha) {
|
|
275
|
+
recaptchaToken = await captchaContext.executeRecaptcha("auth_request");
|
|
276
|
+
}
|
|
277
|
+
const res = await onAuthRequest({
|
|
278
|
+
email: emailId,
|
|
279
|
+
firstName: mode === "SIGNUP" && requireNames ? firstName : void 0,
|
|
280
|
+
lastName: mode === "SIGNUP" && requireNames ? lastName : void 0,
|
|
281
|
+
organizationName: mode === "SIGNUP" && requireOrganization ? orgName : void 0,
|
|
282
|
+
mode,
|
|
283
|
+
recaptchaToken
|
|
284
|
+
});
|
|
285
|
+
if (res.success) {
|
|
286
|
+
toast.success("Verification code sent");
|
|
287
|
+
setStep("OTP");
|
|
288
|
+
setCountdown(60);
|
|
289
|
+
} else {
|
|
290
|
+
toast.error(res.error || "Authentication failed.");
|
|
291
|
+
}
|
|
292
|
+
} catch {
|
|
293
|
+
toast.error("Service unavailable. Try again later.");
|
|
294
|
+
} finally {
|
|
295
|
+
setIsSubmitting(false);
|
|
296
|
+
}
|
|
297
|
+
};
|
|
298
|
+
const verifyOtpCode = async (codeToVerify) => {
|
|
299
|
+
if (codeToVerify.length !== 6 || isSubmitting) return;
|
|
300
|
+
setIsSubmitting(true);
|
|
301
|
+
try {
|
|
302
|
+
const res = await onVerifyOtp({ email: emailId, code: codeToVerify });
|
|
303
|
+
if (res.success) {
|
|
304
|
+
window.location.href = redirectUrl;
|
|
305
|
+
} else {
|
|
306
|
+
toast.error(res.error || "Invalid code.");
|
|
307
|
+
setOtp(["", "", "", "", "", ""]);
|
|
308
|
+
inputRefs.current[0]?.focus();
|
|
309
|
+
}
|
|
310
|
+
} catch {
|
|
311
|
+
toast.error("Verification failed.");
|
|
312
|
+
} finally {
|
|
313
|
+
setIsSubmitting(false);
|
|
314
|
+
}
|
|
315
|
+
};
|
|
316
|
+
const handleNextSignupStep = () => {
|
|
317
|
+
if (signupStep === "NAME") {
|
|
318
|
+
if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
319
|
+
else setSignupStep("EMAIL_ID");
|
|
320
|
+
} else if (signupStep === "ORGANIZATION") {
|
|
321
|
+
setSignupStep("EMAIL_ID");
|
|
322
|
+
}
|
|
323
|
+
};
|
|
324
|
+
const isContinueDisabled = () => {
|
|
325
|
+
if (isSubmitting) return true;
|
|
326
|
+
if (mode === "LOGIN") return emailId.length < 3;
|
|
327
|
+
if (mode === "SIGNUP") {
|
|
328
|
+
if (signupStep === "NAME") return firstName.trim() === "" || lastName.trim() === "";
|
|
329
|
+
if (signupStep === "ORGANIZATION") return orgName.trim().length < 3;
|
|
330
|
+
if (signupStep === "EMAIL_ID") return emailId.length < 3 || !agreedToTerms;
|
|
331
|
+
}
|
|
332
|
+
return false;
|
|
333
|
+
};
|
|
334
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "w-full max-w-md mx-auto border border-neutral-100 flex flex-col relative z-10 animate-in fade-in duration-300 rounded-2xl bg-white shadow-xs" }, /* @__PURE__ */ React4.createElement("div", { className: "p-8 md:p-12" }, step === "INPUT" && /* @__PURE__ */ React4.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React4.createElement("div", { className: "mb-12 text-center mt-2" }, /* @__PURE__ */ React4.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight " }, mode === "LOGIN" ? `${companyName} ${workspaceLabel}` : "Create Account"), /* @__PURE__ */ React4.createElement("div", { className: "text-[13px] text-neutral-500" }, mode === "LOGIN" ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, "Don't have an account? ", /* @__PURE__ */ React4.createElement("button", { type: "button", onClick: () => {
|
|
335
|
+
setMode("SIGNUP");
|
|
336
|
+
setSignupStep(getInitialSignupStep());
|
|
337
|
+
}, className: "text-black transition-colors ml-1" }, "Sign up")) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, "Already have an account? ", /* @__PURE__ */ React4.createElement("button", { type: "button", onClick: () => setMode("LOGIN"), className: "text-black transition-colors ml-1" }, "Log in")))), /* @__PURE__ */ React4.createElement("form", { className: "space-y-6", autoComplete: "off", onSubmit: (e) => {
|
|
338
|
+
e.preventDefault();
|
|
339
|
+
if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
340
|
+
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
341
|
+
else handleAuthRequestSubmit();
|
|
342
|
+
} }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React4.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React4.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "First Name"), /* @__PURE__ */ React4.createElement(
|
|
343
|
+
"input",
|
|
344
|
+
{
|
|
345
|
+
type: "text",
|
|
346
|
+
value: firstName,
|
|
347
|
+
onChange: (e) => setFirstName(cleanAlpha(e.target.value)),
|
|
348
|
+
required: true,
|
|
349
|
+
autoFocus: true,
|
|
350
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
351
|
+
placeholder: "First name"
|
|
352
|
+
}
|
|
353
|
+
)), /* @__PURE__ */ React4.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React4.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Last Name"), /* @__PURE__ */ React4.createElement(
|
|
354
|
+
"input",
|
|
355
|
+
{
|
|
356
|
+
type: "text",
|
|
357
|
+
value: lastName,
|
|
358
|
+
onChange: (e) => setLastName(cleanAlpha(e.target.value)),
|
|
359
|
+
required: true,
|
|
360
|
+
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
361
|
+
placeholder: "Last name"
|
|
362
|
+
}
|
|
363
|
+
))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React4.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React4.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Organization Name"), /* @__PURE__ */ React4.createElement(
|
|
364
|
+
"input",
|
|
365
|
+
{
|
|
366
|
+
type: "text",
|
|
367
|
+
value: orgName,
|
|
368
|
+
onChange: (e) => setOrgName(cleanOrgName(e.target.value)),
|
|
369
|
+
required: true,
|
|
370
|
+
autoFocus: true,
|
|
371
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
372
|
+
placeholder: "Acme Corporation"
|
|
373
|
+
}
|
|
374
|
+
))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ React4.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React4.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React4.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Email ID"), /* @__PURE__ */ React4.createElement(
|
|
375
|
+
"input",
|
|
376
|
+
{
|
|
377
|
+
type: "email",
|
|
378
|
+
value: emailId,
|
|
379
|
+
onChange: (e) => setEmailId(cleanEmailId(e.target.value)),
|
|
380
|
+
required: true,
|
|
381
|
+
autoFocus: true,
|
|
382
|
+
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
383
|
+
placeholder: "name@company.com"
|
|
384
|
+
}
|
|
385
|
+
)), mode === "SIGNUP" && /* @__PURE__ */ React4.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ React4.createElement(
|
|
386
|
+
"input",
|
|
387
|
+
{
|
|
388
|
+
type: "checkbox",
|
|
389
|
+
id: "zairus-terms",
|
|
390
|
+
checked: agreedToTerms,
|
|
391
|
+
onChange: (e) => setAgreedToTerms(e.target.checked),
|
|
392
|
+
className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer",
|
|
393
|
+
required: true
|
|
394
|
+
}
|
|
395
|
+
), /* @__PURE__ */ React4.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ React4.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline font-medium" }, "Terms of Service"), " and ", /* @__PURE__ */ React4.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline font-medium" }, "Privacy Policy"), "."))), /* @__PURE__ */ React4.createElement(
|
|
396
|
+
ThreeDActionButton,
|
|
397
|
+
{
|
|
398
|
+
type: "submit",
|
|
399
|
+
disabled: isContinueDisabled(),
|
|
400
|
+
isLoading: isSubmitting,
|
|
401
|
+
className: "w-full mt-10"
|
|
402
|
+
},
|
|
403
|
+
"Continue"
|
|
404
|
+
))), step === "OTP" && /* @__PURE__ */ React4.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React4.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ React4.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight " }, "Security Check"), /* @__PURE__ */ React4.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the code sent to ", /* @__PURE__ */ React4.createElement("br", null), /* @__PURE__ */ React4.createElement("span", { className: "text-black font-medium" }, emailId))), /* @__PURE__ */ React4.createElement("form", { className: "space-y-10", autoComplete: "off", onSubmit: (e) => {
|
|
405
|
+
e.preventDefault();
|
|
406
|
+
verifyOtpCode(otp.join(""));
|
|
407
|
+
} }, /* @__PURE__ */ React4.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React4.createElement(
|
|
408
|
+
"input",
|
|
409
|
+
{
|
|
410
|
+
key: index,
|
|
411
|
+
ref: (el) => {
|
|
412
|
+
inputRefs.current[index] = el;
|
|
413
|
+
},
|
|
414
|
+
type: "text",
|
|
415
|
+
inputMode: "numeric",
|
|
416
|
+
maxLength: 1,
|
|
417
|
+
value: digit,
|
|
418
|
+
onChange: (e) => handleOtpChange(index, e.target.value),
|
|
419
|
+
className: "w-10 h-10 text-center text-xl bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
|
|
420
|
+
}
|
|
421
|
+
))), /* @__PURE__ */ React4.createElement(
|
|
422
|
+
ThreeDActionButton,
|
|
423
|
+
{
|
|
424
|
+
type: "submit",
|
|
425
|
+
disabled: otp.join("").length < 6,
|
|
426
|
+
isLoading: isSubmitting,
|
|
427
|
+
className: "w-full"
|
|
428
|
+
},
|
|
429
|
+
"Verify Code"
|
|
430
|
+
)))));
|
|
431
|
+
}
|
|
432
|
+
var ZairusAuth = (props) => {
|
|
433
|
+
if (props.useRecaptcha && props.recaptchaSiteKey) {
|
|
434
|
+
return /* @__PURE__ */ React4.createElement(GoogleReCaptchaProvider, { reCaptchaKey: props.recaptchaSiteKey }, /* @__PURE__ */ React4.createElement(Suspense, { fallback: /* @__PURE__ */ React4.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ React4.createElement(InputSpinner, null)) }, /* @__PURE__ */ React4.createElement(AuthFormInner, { ...props })));
|
|
435
|
+
}
|
|
436
|
+
return /* @__PURE__ */ React4.createElement(Suspense, { fallback: /* @__PURE__ */ React4.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ React4.createElement(InputSpinner, null)) }, /* @__PURE__ */ React4.createElement(AuthFormInner, { ...props }));
|
|
437
|
+
};
|
|
438
|
+
|
|
439
|
+
// src/components/Header.tsx
|
|
440
|
+
import React5 from "react";
|
|
114
441
|
import Link2 from "next/link";
|
|
115
442
|
import Image from "next/image";
|
|
116
443
|
import { usePathname } from "next/navigation";
|
|
@@ -124,7 +451,7 @@ var NavLink = ({
|
|
|
124
451
|
const isActive = pathname === href;
|
|
125
452
|
const activeClass = light ? "text-neutral-950 font-medium" : "text-white font-medium";
|
|
126
453
|
const inactiveClass = light ? "text-neutral-600 hover:text-neutral-950" : "text-neutral-400 hover:text-white";
|
|
127
|
-
return /* @__PURE__ */
|
|
454
|
+
return /* @__PURE__ */ React5.createElement(
|
|
128
455
|
Link2,
|
|
129
456
|
{
|
|
130
457
|
href,
|
|
@@ -151,7 +478,7 @@ var Header = ({
|
|
|
151
478
|
const titleColor = light ? "text-black" : "text-white";
|
|
152
479
|
const subtitleColor = light ? "text-neutral-500" : "text-neutral-400";
|
|
153
480
|
const hasBrandSection = showLogo || !hideHeaderText;
|
|
154
|
-
return /* @__PURE__ */
|
|
481
|
+
return /* @__PURE__ */ React5.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React5.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ React5.createElement("header", { className: `${headerLayoutWidth} ${headerBgStyle} backdrop-blur-md rounded-full py-2 px-6 flex items-center border transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ React5.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ React5.createElement(Link2, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70" }, showLogo && /* @__PURE__ */ React5.createElement(
|
|
155
482
|
Image,
|
|
156
483
|
{
|
|
157
484
|
src: logoSrc,
|
|
@@ -161,7 +488,7 @@ var Header = ({
|
|
|
161
488
|
className: `object-contain w-5 h-auto ${invert ? "invert" : ""}`,
|
|
162
489
|
priority: true
|
|
163
490
|
}
|
|
164
|
-
), !hideHeaderText && /* @__PURE__ */
|
|
491
|
+
), !hideHeaderText && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React5.createElement("span", { className: `text-[12px] leading-none tracking-wide mb-1 transition-colors ${titleColor}` }, companyName), subtitle && /* @__PURE__ */ React5.createElement("span", { className: `text-[9px] tracking-widest leading-none transition-colors ${subtitleColor}` }, subtitle)))), /* @__PURE__ */ React5.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ React5.createElement(
|
|
165
492
|
NavLink,
|
|
166
493
|
{
|
|
167
494
|
key: index,
|
|
@@ -174,9 +501,9 @@ var Header = ({
|
|
|
174
501
|
};
|
|
175
502
|
|
|
176
503
|
// src/components/Footer.tsx
|
|
177
|
-
import
|
|
504
|
+
import React6, { useState as useState3 } from "react";
|
|
178
505
|
import Link3 from "next/link";
|
|
179
|
-
import { HugeiconsIcon as
|
|
506
|
+
import { HugeiconsIcon as HugeiconsIcon3 } from "@hugeicons/react";
|
|
180
507
|
var Footer = ({
|
|
181
508
|
description,
|
|
182
509
|
columns,
|
|
@@ -184,20 +511,20 @@ var Footer = ({
|
|
|
184
511
|
copyrightText,
|
|
185
512
|
topSection
|
|
186
513
|
}) => {
|
|
187
|
-
const [openCol, setOpenCol] =
|
|
514
|
+
const [openCol, setOpenCol] = useState3(null);
|
|
188
515
|
const toggleColumn = (idx) => {
|
|
189
516
|
setOpenCol(openCol === idx ? null : idx);
|
|
190
517
|
};
|
|
191
|
-
return /* @__PURE__ */
|
|
518
|
+
return /* @__PURE__ */ React6.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React6.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("p", { className: "text-[12px] font-serif text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ React6.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ React6.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ React6.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 uppercase" }, col.title), /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
|
|
192
519
|
const isOpen = openCol === idx;
|
|
193
|
-
return /* @__PURE__ */
|
|
520
|
+
return /* @__PURE__ */ React6.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ React6.createElement(
|
|
194
521
|
"button",
|
|
195
522
|
{
|
|
196
523
|
onClick: () => toggleColumn(idx),
|
|
197
524
|
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
198
525
|
},
|
|
199
|
-
/* @__PURE__ */
|
|
200
|
-
/* @__PURE__ */
|
|
526
|
+
/* @__PURE__ */ React6.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black uppercase" }, col.title),
|
|
527
|
+
/* @__PURE__ */ React6.createElement(
|
|
201
528
|
"svg",
|
|
202
529
|
{
|
|
203
530
|
className: `w-4 h-4 text-neutral-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
@@ -205,10 +532,10 @@ var Footer = ({
|
|
|
205
532
|
viewBox: "0 0 24 24",
|
|
206
533
|
stroke: "currentColor"
|
|
207
534
|
},
|
|
208
|
-
/* @__PURE__ */
|
|
535
|
+
/* @__PURE__ */ React6.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
209
536
|
)
|
|
210
|
-
), /* @__PURE__ */
|
|
211
|
-
})))), /* @__PURE__ */
|
|
537
|
+
), /* @__PURE__ */ React6.createElement("div", { className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] pb-6 opacity-100" : "grid-rows-[0fr] opacity-0"}` }, /* @__PURE__ */ React6.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
538
|
+
})))), /* @__PURE__ */ React6.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__ */ React6.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ React6.createElement(
|
|
212
539
|
"a",
|
|
213
540
|
{
|
|
214
541
|
key: idx,
|
|
@@ -218,12 +545,12 @@ var Footer = ({
|
|
|
218
545
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
219
546
|
"aria-label": social.name
|
|
220
547
|
},
|
|
221
|
-
/* @__PURE__ */
|
|
548
|
+
/* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: social.icon, size: 20 })
|
|
222
549
|
))))))));
|
|
223
550
|
};
|
|
224
551
|
|
|
225
552
|
// src/components/HeroSection.tsx
|
|
226
|
-
import
|
|
553
|
+
import React7 from "react";
|
|
227
554
|
import Link4 from "next/link";
|
|
228
555
|
import Image2 from "next/image";
|
|
229
556
|
var HeroSection = ({
|
|
@@ -239,7 +566,7 @@ var HeroSection = ({
|
|
|
239
566
|
showImage = false,
|
|
240
567
|
imageSrc = "/assets/ai.avif"
|
|
241
568
|
}) => {
|
|
242
|
-
return /* @__PURE__ */
|
|
569
|
+
return /* @__PURE__ */ React7.createElement("section", { className: "relative pt-32 sm:pt-40 pb-16 flex flex-col items-center overflow-hidden w-full" }, /* @__PURE__ */ React7.createElement(
|
|
243
570
|
"div",
|
|
244
571
|
{
|
|
245
572
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0",
|
|
@@ -247,7 +574,7 @@ var HeroSection = ({
|
|
|
247
574
|
background: `radial-gradient(120% 100% at 50% 0%, #043324 0%, #21a473 45%, #e0f6ce 80%, #f5f5f5 100%)`
|
|
248
575
|
}
|
|
249
576
|
}
|
|
250
|
-
), /* @__PURE__ */
|
|
577
|
+
), /* @__PURE__ */ React7.createElement(
|
|
251
578
|
"div",
|
|
252
579
|
{
|
|
253
580
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -255,14 +582,14 @@ var HeroSection = ({
|
|
|
255
582
|
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")`
|
|
256
583
|
}
|
|
257
584
|
}
|
|
258
|
-
), /* @__PURE__ */
|
|
585
|
+
), /* @__PURE__ */ React7.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" }, badgeText && /* @__PURE__ */ React7.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-4 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ React7.createElement("span", { className: "text-[10px] tracking-[0.4em] text-white uppercase" }, badgeText)), /* @__PURE__ */ React7.createElement("h1", { className: "text-[40px] md:text-5xl lg:text-7xl text-white tracking-tight leading-[1.05] max-w-4xl mb-4" }, titlePrefix), /* @__PURE__ */ React7.createElement("div", { className: "flex justify-center mt-2 mb-10 md:mb-14" }, /* @__PURE__ */ React7.createElement("span", { className: "relative inline-block mx-1.5 px-4 py-2 md:py-3 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none font-serif text-4xl lg:text-6xl tracking-tight" }, /* @__PURE__ */ React7.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React7.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React7.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React7.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__ */ React7.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__ */ React7.createElement("svg", { width: "18", height: "22", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ React7.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React7.createElement("span", { className: "ml-1 bg-[#21a473] text-[10px] text-white px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel)))), subtitle && /* @__PURE__ */ React7.createElement("p", { className: "text-[13px] md:text-[15px] text-[#bbf7df]/90 max-w-xl mx-auto mb-10 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col sm:flex-row gap-4 justify-center items-center w-full px-2 sm:px-0 mx-auto mb-10" }, ctaText && ctaHref && /* @__PURE__ */ React7.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ React7.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React7.createElement(
|
|
259
586
|
Link4,
|
|
260
587
|
{
|
|
261
588
|
href: secondaryCtaHref,
|
|
262
589
|
className: "w-full sm:w-60 inline-flex items-center justify-center text-[12px] tracking-widest rounded-full px-8 py-2.5 bg-white text-black transition-colors hover:bg-neutral-200 outline-none"
|
|
263
590
|
},
|
|
264
591
|
secondaryCtaText
|
|
265
|
-
)), showImage && /* @__PURE__ */
|
|
592
|
+
)), showImage && /* @__PURE__ */ React7.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ React7.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ React7.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ React7.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__ */ React7.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ React7.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ React7.createElement(
|
|
266
593
|
Image2,
|
|
267
594
|
{
|
|
268
595
|
src: imageSrc,
|
|
@@ -272,14 +599,14 @@ var HeroSection = ({
|
|
|
272
599
|
className: "object-cover object-top",
|
|
273
600
|
priority: true
|
|
274
601
|
}
|
|
275
|
-
))), /* @__PURE__ */
|
|
602
|
+
))), /* @__PURE__ */ React7.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__ */ React7.createElement("div", { className: "w-16 md:w-24 h-1 md:h-1.5 bg-slate-400/30 rounded-b-md" }))))));
|
|
276
603
|
};
|
|
277
604
|
|
|
278
605
|
// src/components/AppBento2.tsx
|
|
279
|
-
import
|
|
280
|
-
import { HugeiconsIcon as
|
|
606
|
+
import React8 from "react";
|
|
607
|
+
import { HugeiconsIcon as HugeiconsIcon4 } from "@hugeicons/react";
|
|
281
608
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
282
|
-
return /* @__PURE__ */
|
|
609
|
+
return /* @__PURE__ */ React8.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ React8.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React8.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React8.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ React8.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React8.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4 uppercase" }, tagline), /* @__PURE__ */ React8.createElement("h2", { className: "text-3xl font-serif md:text-4xl tracking-tight text-black leading-[1.1]" }, headline))), /* @__PURE__ */ React8.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
283
610
|
const isWhite = i === 0;
|
|
284
611
|
const isBlack = i === 1;
|
|
285
612
|
const isNeutral = i === 2;
|
|
@@ -301,35 +628,35 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
301
628
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
302
629
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
303
630
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
304
|
-
return /* @__PURE__ */
|
|
631
|
+
return /* @__PURE__ */ React8.createElement(
|
|
305
632
|
"div",
|
|
306
633
|
{
|
|
307
634
|
key: i,
|
|
308
635
|
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
309
636
|
style: { boxShadow: getShadowStyle() }
|
|
310
637
|
},
|
|
311
|
-
/* @__PURE__ */
|
|
638
|
+
/* @__PURE__ */ React8.createElement(
|
|
312
639
|
"div",
|
|
313
640
|
{
|
|
314
641
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
315
642
|
style: { 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")` }
|
|
316
643
|
}
|
|
317
644
|
),
|
|
318
|
-
isBlack && /* @__PURE__ */
|
|
319
|
-
/* @__PURE__ */
|
|
320
|
-
/* @__PURE__ */
|
|
645
|
+
isBlack && /* @__PURE__ */ React8.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" }),
|
|
646
|
+
/* @__PURE__ */ React8.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React8.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ React8.createElement(HugeiconsIcon4, { icon: f.icon, size: 180 }))),
|
|
647
|
+
/* @__PURE__ */ React8.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React8.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React8.createElement("span", { className: `text-[9px] uppercase tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ React8.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ React8.createElement(HugeiconsIcon4, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ React8.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React8.createElement("h3", { className: `text-xl font-serif mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ React8.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
321
648
|
);
|
|
322
649
|
})))));
|
|
323
650
|
};
|
|
324
651
|
|
|
325
652
|
// src/components/FeatureScroll.tsx
|
|
326
|
-
import
|
|
653
|
+
import React9, { useRef as useRef2, useState as useState4, useEffect as useEffect2 } from "react";
|
|
327
654
|
import Image3 from "next/image";
|
|
328
|
-
import { HugeiconsIcon as
|
|
329
|
-
import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon } from "@hugeicons/core-free-icons";
|
|
655
|
+
import { HugeiconsIcon as HugeiconsIcon5 } from "@hugeicons/react";
|
|
656
|
+
import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
|
|
330
657
|
var FeatureCard = ({ feature }) => {
|
|
331
|
-
const [isLoading, setIsLoading] =
|
|
332
|
-
return /* @__PURE__ */
|
|
658
|
+
const [isLoading, setIsLoading] = useState4(!!feature.image);
|
|
659
|
+
return /* @__PURE__ */ React9.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__ */ React9.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React9.createElement(
|
|
333
660
|
"div",
|
|
334
661
|
{
|
|
335
662
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -338,7 +665,7 @@ var FeatureCard = ({ feature }) => {
|
|
|
338
665
|
backgroundRepeat: "repeat"
|
|
339
666
|
}
|
|
340
667
|
}
|
|
341
|
-
), isLoading && feature.image && /* @__PURE__ */
|
|
668
|
+
), isLoading && feature.image && /* @__PURE__ */ React9.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-50/50 backdrop-blur-sm" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: Loading03Icon2, size: 32, className: "animate-spin text-neutral-400" })), feature.image ? /* @__PURE__ */ React9.createElement(
|
|
342
669
|
Image3,
|
|
343
670
|
{
|
|
344
671
|
src: feature.image,
|
|
@@ -352,12 +679,12 @@ var FeatureCard = ({ feature }) => {
|
|
|
352
679
|
group-hover:scale-105
|
|
353
680
|
`
|
|
354
681
|
}
|
|
355
|
-
) : /* @__PURE__ */
|
|
682
|
+
) : /* @__PURE__ */ React9.createElement("div", { className: "absolute inset-0 bg-white z-0 transition-transform duration-700 ease-out group-hover:scale-105" })), /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__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 max-w-[90%]" }, feature.desc)));
|
|
356
683
|
};
|
|
357
684
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
358
|
-
const scrollRef =
|
|
359
|
-
const [canScrollLeft, setCanScrollLeft] =
|
|
360
|
-
const [canScrollRight, setCanScrollRight] =
|
|
685
|
+
const scrollRef = useRef2(null);
|
|
686
|
+
const [canScrollLeft, setCanScrollLeft] = useState4(false);
|
|
687
|
+
const [canScrollRight, setCanScrollRight] = useState4(true);
|
|
361
688
|
const checkScroll = () => {
|
|
362
689
|
if (scrollRef.current) {
|
|
363
690
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -365,7 +692,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
365
692
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
366
693
|
}
|
|
367
694
|
};
|
|
368
|
-
|
|
695
|
+
useEffect2(() => {
|
|
369
696
|
checkScroll();
|
|
370
697
|
window.addEventListener("resize", checkScroll);
|
|
371
698
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -376,7 +703,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
376
703
|
scrollRef.current.scrollBy({ left: scrollAmount, behavior: "smooth" });
|
|
377
704
|
}
|
|
378
705
|
};
|
|
379
|
-
return /* @__PURE__ */
|
|
706
|
+
return /* @__PURE__ */ React9.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__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 md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ React9.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ React9.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React9.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ React9.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ React9.createElement(
|
|
380
707
|
"button",
|
|
381
708
|
{
|
|
382
709
|
onClick: () => scroll("left"),
|
|
@@ -384,8 +711,8 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
384
711
|
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",
|
|
385
712
|
"aria-label": "Previous feature"
|
|
386
713
|
},
|
|
387
|
-
/* @__PURE__ */
|
|
388
|
-
), /* @__PURE__ */
|
|
714
|
+
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowLeft01Icon, size: 20 })
|
|
715
|
+
), /* @__PURE__ */ React9.createElement(
|
|
389
716
|
"button",
|
|
390
717
|
{
|
|
391
718
|
onClick: () => scroll("right"),
|
|
@@ -393,39 +720,39 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
393
720
|
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",
|
|
394
721
|
"aria-label": "Next feature"
|
|
395
722
|
},
|
|
396
|
-
/* @__PURE__ */
|
|
397
|
-
))), /* @__PURE__ */
|
|
723
|
+
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowRight01Icon, size: 20 })
|
|
724
|
+
))), /* @__PURE__ */ React9.createElement(
|
|
398
725
|
"div",
|
|
399
726
|
{
|
|
400
727
|
ref: scrollRef,
|
|
401
728
|
onScroll: checkScroll,
|
|
402
729
|
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"
|
|
403
730
|
},
|
|
404
|
-
features.map((feature, idx) => /* @__PURE__ */
|
|
405
|
-
), /* @__PURE__ */
|
|
731
|
+
features.map((feature, idx) => /* @__PURE__ */ React9.createElement(FeatureCard, { key: idx, feature }))
|
|
732
|
+
), /* @__PURE__ */ React9.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ React9.createElement(
|
|
406
733
|
"button",
|
|
407
734
|
{
|
|
408
735
|
onClick: () => scroll("left"),
|
|
409
736
|
disabled: !canScrollLeft,
|
|
410
737
|
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"
|
|
411
738
|
},
|
|
412
|
-
/* @__PURE__ */
|
|
413
|
-
), /* @__PURE__ */
|
|
739
|
+
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowLeft01Icon, size: 20 })
|
|
740
|
+
), /* @__PURE__ */ React9.createElement(
|
|
414
741
|
"button",
|
|
415
742
|
{
|
|
416
743
|
onClick: () => scroll("right"),
|
|
417
744
|
disabled: !canScrollRight,
|
|
418
745
|
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"
|
|
419
746
|
},
|
|
420
|
-
/* @__PURE__ */
|
|
747
|
+
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowRight01Icon, size: 20 })
|
|
421
748
|
))));
|
|
422
749
|
};
|
|
423
750
|
|
|
424
751
|
// src/components/AITranscriptionFeature.tsx
|
|
425
|
-
import
|
|
752
|
+
import React10, { useState as useState5 } from "react";
|
|
426
753
|
import Image4 from "next/image";
|
|
427
|
-
import { HugeiconsIcon as
|
|
428
|
-
import { Loading03Icon as
|
|
754
|
+
import { HugeiconsIcon as HugeiconsIcon6 } from "@hugeicons/react";
|
|
755
|
+
import { Loading03Icon as Loading03Icon3 } from "@hugeicons/core-free-icons";
|
|
429
756
|
var AITranscriptionFeature = ({
|
|
430
757
|
tagline,
|
|
431
758
|
headline,
|
|
@@ -436,8 +763,8 @@ var AITranscriptionFeature = ({
|
|
|
436
763
|
cursorLabel,
|
|
437
764
|
detailTextSuffix
|
|
438
765
|
}) => {
|
|
439
|
-
const [isLoading, setIsLoading] =
|
|
440
|
-
return /* @__PURE__ */
|
|
766
|
+
const [isLoading, setIsLoading] = useState5(!!imagePath);
|
|
767
|
+
return /* @__PURE__ */ React10.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ React10.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React10.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__ */ React10.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React10.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight animate-gradient-wipe leading-[1.05] mb-4" }, headline), /* @__PURE__ */ React10.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-xl mx-auto" }, description)), /* @__PURE__ */ React10.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__ */ React10.createElement(
|
|
441
768
|
"div",
|
|
442
769
|
{
|
|
443
770
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -446,7 +773,7 @@ var AITranscriptionFeature = ({
|
|
|
446
773
|
backgroundRepeat: "repeat"
|
|
447
774
|
}
|
|
448
775
|
}
|
|
449
|
-
), isLoading && imagePath && /* @__PURE__ */
|
|
776
|
+
), isLoading && imagePath && /* @__PURE__ */ React10.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__ */ React10.createElement(HugeiconsIcon6, { icon: Loading03Icon3, size: 32, className: "animate-spin text-neutral-400" })), imagePath ? /* @__PURE__ */ React10.createElement(
|
|
450
777
|
Image4,
|
|
451
778
|
{
|
|
452
779
|
src: imagePath,
|
|
@@ -459,32 +786,32 @@ var AITranscriptionFeature = ({
|
|
|
459
786
|
${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}
|
|
460
787
|
`
|
|
461
788
|
}
|
|
462
|
-
) : /* @__PURE__ */
|
|
789
|
+
) : /* @__PURE__ */ React10.createElement("div", { className: "absolute inset-0 bg-white z-0" })), /* @__PURE__ */ React10.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__ */ React10.createElement("p", { className: "text-[18px] sm:text-[22px] md:text-[25px] leading-[1.8] text-neutral-800" }, detailTextPrefix, " ", /* @__PURE__ */ React10.createElement("span", { className: "relative font-serif inline-block mx-1 px-2.5 py-0.5 bg-[#20A272]/10 border border-[#20A272] rounded-[3px] text-[#1C3D36] transition-all duration-300 max-w-full wrap-break-word" }, /* @__PURE__ */ React10.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React10.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React10.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ React10.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__ */ React10.createElement("span", { className: "absolute -bottom-6 -right-4 sm:-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__ */ React10.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__ */ React10.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#20A272", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React10.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))));
|
|
463
790
|
};
|
|
464
791
|
|
|
465
792
|
// src/components/PlatformFeatures.tsx
|
|
466
|
-
import
|
|
467
|
-
import { HugeiconsIcon as
|
|
793
|
+
import React11 from "react";
|
|
794
|
+
import { HugeiconsIcon as HugeiconsIcon7 } from "@hugeicons/react";
|
|
468
795
|
var PlatformFeatures = ({
|
|
469
796
|
tagline,
|
|
470
797
|
headline,
|
|
471
798
|
description,
|
|
472
799
|
features
|
|
473
800
|
}) => {
|
|
474
|
-
return /* @__PURE__ */
|
|
801
|
+
return /* @__PURE__ */ React11.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ React11.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ React11.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React11.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ React11.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ React11.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ React11.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__ */ React11.createElement(
|
|
475
802
|
"div",
|
|
476
803
|
{
|
|
477
804
|
key: idx,
|
|
478
805
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
479
806
|
style: { animationDelay: feature.delay || "0ms" }
|
|
480
807
|
},
|
|
481
|
-
/* @__PURE__ */
|
|
482
|
-
/* @__PURE__ */
|
|
808
|
+
/* @__PURE__ */ React11.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__ */ React11.createElement(HugeiconsIcon7, { icon: feature.icon, size: 24 })),
|
|
809
|
+
/* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("h3", { className: "text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React11.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
483
810
|
)))));
|
|
484
811
|
};
|
|
485
812
|
|
|
486
813
|
// src/components/ManagedDocument.tsx
|
|
487
|
-
import
|
|
814
|
+
import React12 from "react";
|
|
488
815
|
var ManagedDocument = ({
|
|
489
816
|
tagline,
|
|
490
817
|
title,
|
|
@@ -494,7 +821,7 @@ var ManagedDocument = ({
|
|
|
494
821
|
}) => {
|
|
495
822
|
return (
|
|
496
823
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
497
|
-
/* @__PURE__ */
|
|
824
|
+
/* @__PURE__ */ React12.createElement("div", { className: "grow pt-28 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React12.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React12.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React12.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React12.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React12.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), sections.map((section, index) => /* @__PURE__ */ React12.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React12.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 text-left uppercase" }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ React12.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left font-light" }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ React12.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ React12.createElement("div", { className: `bg-neutral-100 rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ React12.createElement("p", { className: "italic text-neutral-900 text-[13px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ React12.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React12.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React12.createElement(
|
|
498
825
|
"a",
|
|
499
826
|
{
|
|
500
827
|
href: `mailto:${contactEmail}`,
|
|
@@ -506,18 +833,18 @@ var ManagedDocument = ({
|
|
|
506
833
|
};
|
|
507
834
|
|
|
508
835
|
// src/components/ManagedContactBlock.tsx
|
|
509
|
-
import
|
|
510
|
-
import { HugeiconsIcon as
|
|
836
|
+
import React13, { useState as useState6, useEffect as useEffect3 } from "react";
|
|
837
|
+
import { HugeiconsIcon as HugeiconsIcon8 } from "@hugeicons/react";
|
|
511
838
|
var SecureEmail = ({ user, domain, className }) => {
|
|
512
|
-
const [isMounted, setIsMounted] =
|
|
513
|
-
|
|
839
|
+
const [isMounted, setIsMounted] = useState6(false);
|
|
840
|
+
useEffect3(() => {
|
|
514
841
|
setIsMounted(true);
|
|
515
842
|
}, []);
|
|
516
843
|
if (!isMounted) {
|
|
517
|
-
return /* @__PURE__ */
|
|
844
|
+
return /* @__PURE__ */ React13.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
518
845
|
}
|
|
519
846
|
const email = `${user}@${domain}`;
|
|
520
|
-
return /* @__PURE__ */
|
|
847
|
+
return /* @__PURE__ */ React13.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
521
848
|
};
|
|
522
849
|
var ManagedContactBlock = ({
|
|
523
850
|
tagline,
|
|
@@ -526,7 +853,7 @@ var ManagedContactBlock = ({
|
|
|
526
853
|
emails,
|
|
527
854
|
socials
|
|
528
855
|
}) => {
|
|
529
|
-
return /* @__PURE__ */
|
|
856
|
+
return /* @__PURE__ */ React13.createElement("div", { className: "grow pt-28 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React13.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React13.createElement(
|
|
530
857
|
"div",
|
|
531
858
|
{
|
|
532
859
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -535,21 +862,21 @@ var ManagedContactBlock = ({
|
|
|
535
862
|
backgroundRepeat: "repeat"
|
|
536
863
|
}
|
|
537
864
|
}
|
|
538
|
-
), /* @__PURE__ */
|
|
865
|
+
), /* @__PURE__ */ React13.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React13.createElement("div", { className: "relative px-8 md:px-12 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 font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React13.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ React13.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ React13.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React13.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Contact Details"), /* @__PURE__ */ React13.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ React13.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ React13.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ React13.createElement("p", { className: "pt-2" }, /* @__PURE__ */ React13.createElement(
|
|
539
866
|
"a",
|
|
540
867
|
{
|
|
541
868
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
542
869
|
className: "transition-colors hover:text-black"
|
|
543
870
|
},
|
|
544
871
|
company.phone
|
|
545
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
872
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ React13.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React13.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Email Directory"), /* @__PURE__ */ React13.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ React13.createElement("div", { key: idx }, /* @__PURE__ */ React13.createElement("p", { className: "text-[10px] tracking-[0.2em] mb-1.5 text-neutral-500 uppercase" }, email.label), /* @__PURE__ */ React13.createElement(
|
|
546
873
|
SecureEmail,
|
|
547
874
|
{
|
|
548
875
|
user: email.user,
|
|
549
876
|
domain: email.domain,
|
|
550
877
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
551
878
|
}
|
|
552
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
879
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ React13.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React13.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Find Us Online"), /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ React13.createElement(
|
|
553
880
|
"a",
|
|
554
881
|
{
|
|
555
882
|
key: idx,
|
|
@@ -559,29 +886,29 @@ var ManagedContactBlock = ({
|
|
|
559
886
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
560
887
|
"aria-label": social.label
|
|
561
888
|
},
|
|
562
|
-
/* @__PURE__ */
|
|
563
|
-
/* @__PURE__ */
|
|
889
|
+
/* @__PURE__ */ React13.createElement(HugeiconsIcon8, { icon: social.icon, size: 18 }),
|
|
890
|
+
/* @__PURE__ */ React13.createElement("span", { className: "text-[13px]" }, social.label)
|
|
564
891
|
)))))))));
|
|
565
892
|
};
|
|
566
893
|
|
|
567
894
|
// src/components/ManagedPricingBlock.tsx
|
|
568
|
-
import
|
|
895
|
+
import React14 from "react";
|
|
569
896
|
import Link5 from "next/link";
|
|
570
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
571
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
897
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ React14.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__ */ React14.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ React14.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
898
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ React14.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__ */ React14.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ React14.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
572
899
|
var ManagedPricingBlock = ({
|
|
573
900
|
tagline,
|
|
574
901
|
title,
|
|
575
902
|
plans
|
|
576
903
|
}) => {
|
|
577
|
-
return /* @__PURE__ */
|
|
904
|
+
return /* @__PURE__ */ React14.createElement("div", { className: "grow pt-40 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React14.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ React14.createElement("div", { className: "w-full flex flex-col items-center text-center mb-12" }, tagline && /* @__PURE__ */ React14.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block uppercase" }, tagline), /* @__PURE__ */ React14.createElement("h1", { className: "text-2xl font-serif sm:text-3xl mt-3 text-black tracking-tight" }, title)), /* @__PURE__ */ React14.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl" }, plans.map((plan, planIdx) => /* @__PURE__ */ React14.createElement(
|
|
578
905
|
"div",
|
|
579
906
|
{
|
|
580
907
|
key: planIdx,
|
|
581
908
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden ${plan.isPremium ? "border border-neutral-100" : ""}`
|
|
582
909
|
},
|
|
583
|
-
/* @__PURE__ */
|
|
584
|
-
plan.isPremium ? /* @__PURE__ */
|
|
910
|
+
/* @__PURE__ */ React14.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React14.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ React14.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ React14.createElement("span", { className: "text-3xl text-black" }, plan.price), plan.period && /* @__PURE__ */ React14.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ React14.createElement("p", { className: "text-xs text-neutral-500 mt-2" }, plan.description)),
|
|
911
|
+
plan.isPremium ? /* @__PURE__ */ React14.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ React14.createElement(
|
|
585
912
|
Link5,
|
|
586
913
|
{
|
|
587
914
|
href: plan.ctaHref,
|
|
@@ -589,20 +916,20 @@ var ManagedPricingBlock = ({
|
|
|
589
916
|
},
|
|
590
917
|
plan.ctaText
|
|
591
918
|
),
|
|
592
|
-
/* @__PURE__ */
|
|
919
|
+
/* @__PURE__ */ React14.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
593
920
|
const isAvailable = feature.value !== false;
|
|
594
921
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
595
|
-
return /* @__PURE__ */
|
|
922
|
+
return /* @__PURE__ */ React14.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ React14.createElement(CheckIcon, null) : /* @__PURE__ */ React14.createElement(CrossIcon, null), /* @__PURE__ */ React14.createElement("span", { className: `text-xs ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ React14.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
596
923
|
}))
|
|
597
924
|
)))));
|
|
598
925
|
};
|
|
599
926
|
|
|
600
927
|
// src/components/ManagedBoardBlock.tsx
|
|
601
|
-
import
|
|
928
|
+
import React15 from "react";
|
|
602
929
|
import Image5 from "next/image";
|
|
603
|
-
import { HugeiconsIcon as
|
|
930
|
+
import { HugeiconsIcon as HugeiconsIcon9 } from "@hugeicons/react";
|
|
604
931
|
import { TwitterIcon, LinkedinIcon } from "@hugeicons/core-free-icons";
|
|
605
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
932
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ React15.createElement(
|
|
606
933
|
"a",
|
|
607
934
|
{
|
|
608
935
|
href,
|
|
@@ -611,7 +938,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ React13.
|
|
|
611
938
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
612
939
|
"aria-label": `${name} on ${label}`
|
|
613
940
|
},
|
|
614
|
-
/* @__PURE__ */
|
|
941
|
+
/* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon, size: 16 })
|
|
615
942
|
);
|
|
616
943
|
var ManagedBoardBlock = ({
|
|
617
944
|
tagline,
|
|
@@ -620,7 +947,7 @@ var ManagedBoardBlock = ({
|
|
|
620
947
|
contactText,
|
|
621
948
|
contactEmail
|
|
622
949
|
}) => {
|
|
623
|
-
return /* @__PURE__ */
|
|
950
|
+
return /* @__PURE__ */ React15.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React15.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ React15.createElement(
|
|
624
951
|
"div",
|
|
625
952
|
{
|
|
626
953
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -629,7 +956,7 @@ var ManagedBoardBlock = ({
|
|
|
629
956
|
backgroundRepeat: "repeat"
|
|
630
957
|
}
|
|
631
958
|
}
|
|
632
|
-
), /* @__PURE__ */
|
|
959
|
+
), /* @__PURE__ */ React15.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React15.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React15.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React15.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React15.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ React15.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__ */ React15.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ React15.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ React15.createElement(
|
|
633
960
|
Image5,
|
|
634
961
|
{
|
|
635
962
|
src: member.imageSrc,
|
|
@@ -638,7 +965,7 @@ var ManagedBoardBlock = ({
|
|
|
638
965
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
639
966
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
640
967
|
}
|
|
641
|
-
)), /* @__PURE__ */
|
|
968
|
+
)), /* @__PURE__ */ React15.createElement("div", { className: "pt-1" }, /* @__PURE__ */ React15.createElement("h3", { className: "text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ React15.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-500 mt-1.5 uppercase" }, member.title))), /* @__PURE__ */ React15.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ React15.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ React15.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React15.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ React15.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ React15.createElement(
|
|
642
969
|
MemberSocialLink,
|
|
643
970
|
{
|
|
644
971
|
href: `https://x.com/${member.twitterHandle}`,
|
|
@@ -646,7 +973,7 @@ var ManagedBoardBlock = ({
|
|
|
646
973
|
label: "X",
|
|
647
974
|
name: member.name
|
|
648
975
|
}
|
|
649
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
976
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ React15.createElement(
|
|
650
977
|
MemberSocialLink,
|
|
651
978
|
{
|
|
652
979
|
href: member.linkedinHandle,
|
|
@@ -654,23 +981,23 @@ var ManagedBoardBlock = ({
|
|
|
654
981
|
label: "LinkedIn",
|
|
655
982
|
name: member.name
|
|
656
983
|
}
|
|
657
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
984
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ React15.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React15.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React15.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
658
985
|
};
|
|
659
986
|
|
|
660
987
|
// src/components/ManagedProjectsBlock.tsx
|
|
661
|
-
import
|
|
988
|
+
import React16 from "react";
|
|
662
989
|
import Link6 from "next/link";
|
|
663
990
|
var GridSection = ({
|
|
664
991
|
children,
|
|
665
992
|
isLast = false,
|
|
666
993
|
className = "py-8 md:py-10"
|
|
667
|
-
}) => /* @__PURE__ */
|
|
994
|
+
}) => /* @__PURE__ */ React16.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "border-b border-neutral-100" : ""}` }, children);
|
|
668
995
|
var ManagedProjectsBlock = ({
|
|
669
996
|
tagline,
|
|
670
997
|
title,
|
|
671
998
|
projects
|
|
672
999
|
}) => {
|
|
673
|
-
return /* @__PURE__ */
|
|
1000
|
+
return /* @__PURE__ */ React16.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React16.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ React16.createElement(
|
|
674
1001
|
"div",
|
|
675
1002
|
{
|
|
676
1003
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -679,15 +1006,15 @@ var ManagedProjectsBlock = ({
|
|
|
679
1006
|
backgroundRepeat: "repeat"
|
|
680
1007
|
}
|
|
681
1008
|
}
|
|
682
|
-
), /* @__PURE__ */
|
|
1009
|
+
), /* @__PURE__ */ React16.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React16.createElement(GridSection, null, tagline && /* @__PURE__ */ React16.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React16.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
683
1010
|
const isLast = index === projects.length - 1;
|
|
684
|
-
const projectContent = /* @__PURE__ */
|
|
685
|
-
return /* @__PURE__ */
|
|
1011
|
+
const projectContent = /* @__PURE__ */ React16.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ React16.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__ */ React16.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ React16.createElement("h2", { className: "text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ React16.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__ */ React16.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__ */ React16.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 shrink-0 uppercase" }, project.date)), /* @__PURE__ */ React16.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
1012
|
+
return /* @__PURE__ */ React16.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__ */ React16.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React16.createElement(Link6, { href: project.link, className: "block outline-none" }, projectContent));
|
|
686
1013
|
}))));
|
|
687
1014
|
};
|
|
688
1015
|
|
|
689
1016
|
// src/components/ManagedNotFoundBlock.tsx
|
|
690
|
-
import
|
|
1017
|
+
import React17 from "react";
|
|
691
1018
|
import Link7 from "next/link";
|
|
692
1019
|
var ManagedNotFoundBlock = ({
|
|
693
1020
|
title = "404 - Page Not Found",
|
|
@@ -695,15 +1022,15 @@ var ManagedNotFoundBlock = ({
|
|
|
695
1022
|
backLinkText = "\u2190 Go back to Homepage",
|
|
696
1023
|
backLinkHref = "/"
|
|
697
1024
|
}) => {
|
|
698
|
-
return /* @__PURE__ */
|
|
1025
|
+
return /* @__PURE__ */ React17.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ React17.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ React17.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ React17.createElement(
|
|
699
1026
|
"svg",
|
|
700
1027
|
{
|
|
701
1028
|
xmlns: "http://www.w3.org/2000/svg",
|
|
702
1029
|
viewBox: "0 0 24 24",
|
|
703
1030
|
className: "w-12 h-12 fill-neutral-200"
|
|
704
1031
|
},
|
|
705
|
-
/* @__PURE__ */
|
|
706
|
-
)), /* @__PURE__ */
|
|
1032
|
+
/* @__PURE__ */ React17.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" })
|
|
1033
|
+
)), /* @__PURE__ */ React17.createElement("h1", { className: "text-xl font-serif md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description), /* @__PURE__ */ React17.createElement(
|
|
707
1034
|
Link7,
|
|
708
1035
|
{
|
|
709
1036
|
href: backLinkHref,
|
|
@@ -714,9 +1041,9 @@ var ManagedNotFoundBlock = ({
|
|
|
714
1041
|
};
|
|
715
1042
|
|
|
716
1043
|
// src/components/PageSpinner.tsx
|
|
717
|
-
import
|
|
718
|
-
import { HugeiconsIcon as
|
|
719
|
-
import { Loading03Icon as
|
|
1044
|
+
import React18 from "react";
|
|
1045
|
+
import { HugeiconsIcon as HugeiconsIcon10 } from "@hugeicons/react";
|
|
1046
|
+
import { Loading03Icon as Loading03Icon4 } from "@hugeicons/core-free-icons";
|
|
720
1047
|
var PageSpinner = ({
|
|
721
1048
|
className = "",
|
|
722
1049
|
iconClassName = "text-black",
|
|
@@ -724,10 +1051,10 @@ var PageSpinner = ({
|
|
|
724
1051
|
}) => {
|
|
725
1052
|
return (
|
|
726
1053
|
// z-[100] ensures it sits above absolute headers and modals
|
|
727
|
-
/* @__PURE__ */
|
|
728
|
-
|
|
1054
|
+
/* @__PURE__ */ React18.createElement("div", { className: `fixed inset-0 z-100 flex flex-col items-center justify-center w-full h-full pointer-events-none ${className}` }, /* @__PURE__ */ React18.createElement(
|
|
1055
|
+
HugeiconsIcon10,
|
|
729
1056
|
{
|
|
730
|
-
icon:
|
|
1057
|
+
icon: Loading03Icon4,
|
|
731
1058
|
size,
|
|
732
1059
|
className: `animate-spin mb-4 ${iconClassName}`
|
|
733
1060
|
}
|
|
@@ -736,10 +1063,10 @@ var PageSpinner = ({
|
|
|
736
1063
|
};
|
|
737
1064
|
|
|
738
1065
|
// src/components/ManagedToaster.tsx
|
|
739
|
-
import
|
|
1066
|
+
import React19 from "react";
|
|
740
1067
|
import { Toaster } from "react-hot-toast";
|
|
741
1068
|
var ManagedToaster = (props) => {
|
|
742
|
-
return /* @__PURE__ */
|
|
1069
|
+
return /* @__PURE__ */ React19.createElement(
|
|
743
1070
|
Toaster,
|
|
744
1071
|
{
|
|
745
1072
|
position: "top-right",
|
|
@@ -774,7 +1101,7 @@ var ManagedToaster = (props) => {
|
|
|
774
1101
|
};
|
|
775
1102
|
|
|
776
1103
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
777
|
-
import
|
|
1104
|
+
import React20 from "react";
|
|
778
1105
|
import Image6 from "next/image";
|
|
779
1106
|
var ManagedNewsletterSplitBlock = ({
|
|
780
1107
|
tagline,
|
|
@@ -788,7 +1115,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
788
1115
|
ctaHref = "/contact-us",
|
|
789
1116
|
children
|
|
790
1117
|
}) => {
|
|
791
|
-
return /* @__PURE__ */
|
|
1118
|
+
return /* @__PURE__ */ React20.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0" }, /* @__PURE__ */ React20.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ React20.createElement(
|
|
792
1119
|
Image6,
|
|
793
1120
|
{
|
|
794
1121
|
src: imageSrc,
|
|
@@ -798,7 +1125,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
798
1125
|
className: "object-cover object-top grayscale opacity-60",
|
|
799
1126
|
quality: 100
|
|
800
1127
|
}
|
|
801
|
-
), /* @__PURE__ */
|
|
1128
|
+
), /* @__PURE__ */ React20.createElement(
|
|
802
1129
|
"div",
|
|
803
1130
|
{
|
|
804
1131
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -806,7 +1133,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
806
1133
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
807
1134
|
}
|
|
808
1135
|
}
|
|
809
|
-
), /* @__PURE__ */
|
|
1136
|
+
), /* @__PURE__ */ React20.createElement(
|
|
810
1137
|
"div",
|
|
811
1138
|
{
|
|
812
1139
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -814,7 +1141,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
814
1141
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
815
1142
|
}
|
|
816
1143
|
}
|
|
817
|
-
)), /* @__PURE__ */
|
|
1144
|
+
)), /* @__PURE__ */ React20.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__ */ React20.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__ */ React20.createElement(
|
|
818
1145
|
"div",
|
|
819
1146
|
{
|
|
820
1147
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -823,7 +1150,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
823
1150
|
backgroundRepeat: "repeat"
|
|
824
1151
|
}
|
|
825
1152
|
}
|
|
826
|
-
), /* @__PURE__ */
|
|
1153
|
+
), /* @__PURE__ */ React20.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React20.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ React20.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 uppercase" }, tagline), /* @__PURE__ */ React20.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ React20.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 uppercase" }, subtitle)), /* @__PURE__ */ React20.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ React20.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ React20.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ React20.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React20.createElement("div", { className: "grow h-px bg-neutral-200" }), /* @__PURE__ */ React20.createElement("span", { className: "shrink mx-4 text-[10px] tracking-[0.2em] text-neutral-400 uppercase" }, dividerText), /* @__PURE__ */ React20.createElement("div", { className: "grow h-px bg-neutral-200" })), ctaText && ctaHref && /* @__PURE__ */ React20.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React20.createElement(
|
|
827
1154
|
ThreeDButton,
|
|
828
1155
|
{
|
|
829
1156
|
href: ctaHref,
|
|
@@ -834,7 +1161,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
834
1161
|
};
|
|
835
1162
|
|
|
836
1163
|
// src/components/ReusableInputs.tsx
|
|
837
|
-
import
|
|
1164
|
+
import React21 from "react";
|
|
838
1165
|
var TextInput = ({
|
|
839
1166
|
label,
|
|
840
1167
|
value,
|
|
@@ -844,7 +1171,7 @@ var TextInput = ({
|
|
|
844
1171
|
disabled,
|
|
845
1172
|
readOnly,
|
|
846
1173
|
onClick
|
|
847
|
-
}) => /* @__PURE__ */
|
|
1174
|
+
}) => /* @__PURE__ */ React21.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, /* @__PURE__ */ React21.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ React21.createElement(
|
|
848
1175
|
"input",
|
|
849
1176
|
{
|
|
850
1177
|
type: "text",
|
|
@@ -865,7 +1192,7 @@ var NumberInput = ({
|
|
|
865
1192
|
placeholder,
|
|
866
1193
|
maxLength,
|
|
867
1194
|
disabled
|
|
868
|
-
}) => /* @__PURE__ */
|
|
1195
|
+
}) => /* @__PURE__ */ React21.createElement("div", { className: "space-y-2 flex-1 w-full" }, /* @__PURE__ */ React21.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ React21.createElement(
|
|
869
1196
|
"input",
|
|
870
1197
|
{
|
|
871
1198
|
type: "text",
|
|
@@ -883,14 +1210,14 @@ var NumberInput = ({
|
|
|
883
1210
|
));
|
|
884
1211
|
|
|
885
1212
|
// src/components/PortfolioHero.tsx
|
|
886
|
-
import
|
|
1213
|
+
import React22, { useEffect as useEffect4, useRef as useRef3 } from "react";
|
|
887
1214
|
import Link8 from "next/link";
|
|
888
1215
|
import Image7 from "next/image";
|
|
889
|
-
import { HugeiconsIcon as
|
|
1216
|
+
import { HugeiconsIcon as HugeiconsIcon11 } from "@hugeicons/react";
|
|
890
1217
|
import { ArrowRight01Icon as ArrowRight01Icon2 } from "@hugeicons/core-free-icons";
|
|
891
1218
|
var useScrollAnimation = () => {
|
|
892
|
-
const elementRef =
|
|
893
|
-
|
|
1219
|
+
const elementRef = useRef3(null);
|
|
1220
|
+
useEffect4(() => {
|
|
894
1221
|
const el = elementRef.current;
|
|
895
1222
|
if (!el) return;
|
|
896
1223
|
const observer = new IntersectionObserver(
|
|
@@ -926,13 +1253,13 @@ var PortfolioHero = ({
|
|
|
926
1253
|
secondaryCtaHref
|
|
927
1254
|
}) => {
|
|
928
1255
|
const heroContentRef = useScrollAnimation();
|
|
929
|
-
return /* @__PURE__ */
|
|
1256
|
+
return /* @__PURE__ */ React22.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" }, /* @__PURE__ */ React22.createElement(
|
|
930
1257
|
"div",
|
|
931
1258
|
{
|
|
932
1259
|
ref: heroContentRef,
|
|
933
1260
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
934
1261
|
},
|
|
935
|
-
/* @__PURE__ */
|
|
1262
|
+
/* @__PURE__ */ React22.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React22.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__ */ React22.createElement(
|
|
936
1263
|
Image7,
|
|
937
1264
|
{
|
|
938
1265
|
src: imageSrc,
|
|
@@ -943,7 +1270,7 @@ var PortfolioHero = ({
|
|
|
943
1270
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
944
1271
|
quality: 100
|
|
945
1272
|
}
|
|
946
|
-
)), /* @__PURE__ */
|
|
1273
|
+
)), /* @__PURE__ */ React22.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ React22.createElement("h1", { className: "text-3xl font-serif sm:text-5xl animate-gradient-wipe lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ React22.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 uppercase" }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ React22.createElement(
|
|
947
1274
|
"a",
|
|
948
1275
|
{
|
|
949
1276
|
href: socialLinkHref,
|
|
@@ -953,31 +1280,160 @@ var PortfolioHero = ({
|
|
|
953
1280
|
},
|
|
954
1281
|
socialLinkText
|
|
955
1282
|
))),
|
|
956
|
-
/* @__PURE__ */
|
|
957
|
-
/* @__PURE__ */
|
|
1283
|
+
/* @__PURE__ */ React22.createElement("p", { className: "text-[13px] md:text-[16px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
1284
|
+
/* @__PURE__ */ React22.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ React22.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ React22.createElement(
|
|
958
1285
|
ThreeDButton,
|
|
959
1286
|
{
|
|
960
1287
|
href: primaryCtaHref,
|
|
961
1288
|
className: "py-3 uppercase tracking-widest text-[11px]"
|
|
962
1289
|
},
|
|
963
1290
|
primaryCtaText
|
|
964
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
1291
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React22.createElement(
|
|
965
1292
|
Link8,
|
|
966
1293
|
{
|
|
967
1294
|
href: secondaryCtaHref,
|
|
968
1295
|
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-200 transition-colors text-black hover:bg-neutral-200 outline-none"
|
|
969
1296
|
},
|
|
970
1297
|
secondaryCtaText,
|
|
971
|
-
/* @__PURE__ */
|
|
1298
|
+
/* @__PURE__ */ React22.createElement(HugeiconsIcon11, { icon: ArrowRight01Icon2, size: 16 })
|
|
972
1299
|
))
|
|
973
1300
|
));
|
|
974
1301
|
};
|
|
1302
|
+
|
|
1303
|
+
// src/components/ProductHero.tsx
|
|
1304
|
+
import React23, { useState as useState7, useEffect as useEffect5, useCallback } from "react";
|
|
1305
|
+
import Link9 from "next/link";
|
|
1306
|
+
import Image8 from "next/image";
|
|
1307
|
+
var ProductHero = ({
|
|
1308
|
+
badgeText,
|
|
1309
|
+
titlePrefix,
|
|
1310
|
+
highlightText,
|
|
1311
|
+
subtitle,
|
|
1312
|
+
ctaText,
|
|
1313
|
+
ctaHref,
|
|
1314
|
+
secondaryCtaText,
|
|
1315
|
+
secondaryCtaHref,
|
|
1316
|
+
images
|
|
1317
|
+
}) => {
|
|
1318
|
+
const [currentIndex, setCurrentIndex] = useState7(0);
|
|
1319
|
+
const nextSlide = useCallback(() => {
|
|
1320
|
+
setCurrentIndex((prev) => (prev + 1) % images.length);
|
|
1321
|
+
}, [images.length]);
|
|
1322
|
+
const prevSlide = useCallback(() => {
|
|
1323
|
+
setCurrentIndex((prev) => (prev - 1 + images.length) % images.length);
|
|
1324
|
+
}, [images.length]);
|
|
1325
|
+
useEffect5(() => {
|
|
1326
|
+
const timer = setInterval(() => {
|
|
1327
|
+
nextSlide();
|
|
1328
|
+
}, 5e3);
|
|
1329
|
+
return () => clearInterval(timer);
|
|
1330
|
+
}, [nextSlide]);
|
|
1331
|
+
const getCarouselClasses = (idx) => {
|
|
1332
|
+
const diff = (idx - currentIndex + images.length) % images.length;
|
|
1333
|
+
if (diff === 0) {
|
|
1334
|
+
return "translate-x-0 scale-100 opacity-100 z-30 pointer-events-auto shadow-2xl";
|
|
1335
|
+
}
|
|
1336
|
+
if (diff === 1 || diff < 0 && diff === -2) {
|
|
1337
|
+
return "translate-x-[40%] sm:translate-x-[35%] scale-90 opacity-30 z-20 cursor-pointer hover:opacity-50";
|
|
1338
|
+
}
|
|
1339
|
+
if (diff === images.length - 1 || diff === -1) {
|
|
1340
|
+
return "-translate-x-[40%] sm:-translate-x-[35%] scale-90 opacity-30 z-20 cursor-pointer hover:opacity-50";
|
|
1341
|
+
}
|
|
1342
|
+
return "opacity-0 z-0 scale-75 pointer-events-none";
|
|
1343
|
+
};
|
|
1344
|
+
return /* @__PURE__ */ React23.createElement("section", { className: "relative pt-32 sm:pt-40 pb-0 flex flex-col items-center overflow-hidden w-full bg-[#f5f5f5]" }, /* @__PURE__ */ React23.createElement(
|
|
1345
|
+
"div",
|
|
1346
|
+
{
|
|
1347
|
+
className: "absolute inset-0 w-full h-full pointer-events-none z-0 bg-linear-to-b from-white via-white to-[#f5f5f5]"
|
|
1348
|
+
}
|
|
1349
|
+
), /* @__PURE__ */ React23.createElement(
|
|
1350
|
+
"div",
|
|
1351
|
+
{
|
|
1352
|
+
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.3] mix-blend-overlay",
|
|
1353
|
+
style: {
|
|
1354
|
+
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")`
|
|
1355
|
+
}
|
|
1356
|
+
}
|
|
1357
|
+
), /* @__PURE__ */ React23.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" }, badgeText && /* @__PURE__ */ React23.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-4 py-1.5 rounded-full bg-neutral-100 border border-neutral-200 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ React23.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-600 uppercase font-medium" }, badgeText)), /* @__PURE__ */ React23.createElement("h1", { className: "text-[40px] md:text-5xl lg:text-7xl text-black tracking-tight leading-[1.05] max-w-4xl mb-4" }, titlePrefix, " ", /* @__PURE__ */ React23.createElement("span", { className: "bg-linear-to-r from-[#043324] to-[#21a473] bg-clip-text text-transparent font-serif italic pr-2" }, highlightText)), subtitle && /* @__PURE__ */ React23.createElement("p", { className: "text-[13px] md:text-[16px] text-neutral-600 max-w-xl mx-auto mb-10 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ React23.createElement("div", { className: "flex flex-col sm:flex-row gap-4 justify-center items-center w-full px-2 sm:px-0 mx-auto mb-12 relative z-30" }, ctaText && ctaHref && /* @__PURE__ */ React23.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ React23.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React23.createElement(
|
|
1358
|
+
Link9,
|
|
1359
|
+
{
|
|
1360
|
+
href: secondaryCtaHref,
|
|
1361
|
+
className: "w-full sm:w-60 inline-flex items-center justify-center text-[12px] tracking-widest rounded-full px-8 py-2.5 bg-white text-black border border-neutral-200 transition-colors hover:bg-neutral-50 outline-none shadow-sm"
|
|
1362
|
+
},
|
|
1363
|
+
secondaryCtaText
|
|
1364
|
+
)), /* @__PURE__ */ React23.createElement("div", { className: "relative w-full max-w-4xl mx-auto px-2 sm:px-6 mt-8 z-20" }, /* @__PURE__ */ React23.createElement("div", { className: "relative w-full aspect-4/3 md:aspect-video flex items-center justify-center" }, /* @__PURE__ */ React23.createElement("button", { onClick: prevSlide, className: "absolute left-0 sm:-left-12 z-40 p-2 text-neutral-400 hover:text-black transition-colors outline-none", "aria-label": "Previous image" }, /* @__PURE__ */ React23.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React23.createElement("path", { d: "M15 18l-6-6 6-6" }))), /* @__PURE__ */ React23.createElement("button", { onClick: nextSlide, className: "absolute right-0 sm:-right-12 z-40 p-2 text-neutral-400 hover:text-black transition-colors outline-none", "aria-label": "Next image" }, /* @__PURE__ */ React23.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React23.createElement("path", { d: "M9 18l6-6-6-6" }))), images.map((src, idx) => /* @__PURE__ */ React23.createElement(
|
|
1365
|
+
"div",
|
|
1366
|
+
{
|
|
1367
|
+
key: idx,
|
|
1368
|
+
onClick: () => {
|
|
1369
|
+
if (currentIndex !== idx) setCurrentIndex(idx);
|
|
1370
|
+
},
|
|
1371
|
+
className: `absolute inset-0 transition-all duration-700 ease-out transform ${getCarouselClasses(idx)}`
|
|
1372
|
+
},
|
|
1373
|
+
/* @__PURE__ */ React23.createElement("div", { className: "relative w-full h-full rounded-2xl overflow-hidden shadow-xl" }, /* @__PURE__ */ React23.createElement(
|
|
1374
|
+
Image8,
|
|
1375
|
+
{
|
|
1376
|
+
src,
|
|
1377
|
+
alt: `Product Overview ${idx + 1}`,
|
|
1378
|
+
fill: true,
|
|
1379
|
+
sizes: "(max-width: 768px) 100vw, 800px",
|
|
1380
|
+
className: "object-cover object-center select-none",
|
|
1381
|
+
priority: idx === 0
|
|
1382
|
+
}
|
|
1383
|
+
))
|
|
1384
|
+
)), /* @__PURE__ */ React23.createElement("div", { className: "absolute inset-x-0 bottom-0 h-1/3 sm:h-1/2 bg-linear-to-t from-[#f5f5f5] to-transparent z-40 pointer-events-none" })))));
|
|
1385
|
+
};
|
|
1386
|
+
|
|
1387
|
+
// src/components/GifFeatureCard.tsx
|
|
1388
|
+
import React24, { useState as useState8 } from "react";
|
|
1389
|
+
import Image9 from "next/image";
|
|
1390
|
+
import { HugeiconsIcon as HugeiconsIcon12 } from "@hugeicons/react";
|
|
1391
|
+
import { Loading03Icon as Loading03Icon5 } from "@hugeicons/core-free-icons";
|
|
1392
|
+
var GifFeatureCard = ({
|
|
1393
|
+
gifSrc,
|
|
1394
|
+
title,
|
|
1395
|
+
subtitle,
|
|
1396
|
+
alt = "Feature animation",
|
|
1397
|
+
className = "aspect-video"
|
|
1398
|
+
}) => {
|
|
1399
|
+
const [isLoading, setIsLoading] = useState8(true);
|
|
1400
|
+
return /* @__PURE__ */ React24.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ React24.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ React24.createElement(
|
|
1401
|
+
HugeiconsIcon12,
|
|
1402
|
+
{
|
|
1403
|
+
icon: Loading03Icon5,
|
|
1404
|
+
size: 32,
|
|
1405
|
+
className: "animate-spin text-white"
|
|
1406
|
+
}
|
|
1407
|
+
)), /* @__PURE__ */ React24.createElement(
|
|
1408
|
+
"div",
|
|
1409
|
+
{
|
|
1410
|
+
className: `absolute inset-0 z-0 transition-all duration-1000 ease-out ${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}`
|
|
1411
|
+
},
|
|
1412
|
+
/* @__PURE__ */ React24.createElement(
|
|
1413
|
+
Image9,
|
|
1414
|
+
{
|
|
1415
|
+
src: gifSrc,
|
|
1416
|
+
alt,
|
|
1417
|
+
fill: true,
|
|
1418
|
+
unoptimized: true,
|
|
1419
|
+
onLoad: () => setIsLoading(false),
|
|
1420
|
+
className: "object-cover object-center pointer-events-none"
|
|
1421
|
+
}
|
|
1422
|
+
)
|
|
1423
|
+
), /* @__PURE__ */ React24.createElement(
|
|
1424
|
+
"div",
|
|
1425
|
+
{
|
|
1426
|
+
className: "absolute inset-x-0 bottom-0 h-1/2 sm:h-2/3 bg-linear-to-t from-black/95 via-black/40 to-transparent z-10 pointer-events-none transition-opacity duration-700"
|
|
1427
|
+
}
|
|
1428
|
+
), /* @__PURE__ */ React24.createElement("div", { className: "absolute inset-x-0 bottom-0 p-6 sm:p-8 z-30 flex flex-col justify-end text-left pointer-events-none" }, title && /* @__PURE__ */ React24.createElement("h3", { className: "text-xl sm:text-2xl md:text-3xl font-medium text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ React24.createElement("p", { className: "text-[13px] sm:text-[15px] leading-relaxed text-neutral-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
1429
|
+
};
|
|
975
1430
|
export {
|
|
976
1431
|
AITranscriptionFeature,
|
|
977
1432
|
AppBento2,
|
|
978
1433
|
Faq,
|
|
979
1434
|
FeatureScroll,
|
|
980
1435
|
Footer,
|
|
1436
|
+
GifFeatureCard,
|
|
981
1437
|
Header,
|
|
982
1438
|
HeroSection,
|
|
983
1439
|
ManagedBoardBlock,
|
|
@@ -992,6 +1448,9 @@ export {
|
|
|
992
1448
|
PageSpinner,
|
|
993
1449
|
PlatformFeatures,
|
|
994
1450
|
PortfolioHero,
|
|
1451
|
+
ProductHero,
|
|
995
1452
|
TextInput,
|
|
996
|
-
|
|
1453
|
+
ThreeDActionButton,
|
|
1454
|
+
ThreeDButton,
|
|
1455
|
+
ZairusAuth
|
|
997
1456
|
};
|