@retinalabsllc/zairusjs 0.2.1 → 0.2.3
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 +178 -3
- package/dist/index.d.ts +178 -3
- package/dist/index.js +1253 -168
- package/dist/index.mjs +1248 -157
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -53,7 +53,14 @@ __export(index_exports, {
|
|
|
53
53
|
PortfolioHero: () => PortfolioHero,
|
|
54
54
|
ProductHero: () => ProductHero,
|
|
55
55
|
TextInput: () => TextInput,
|
|
56
|
-
|
|
56
|
+
ThreeDActionButton: () => ThreeDActionButton,
|
|
57
|
+
ThreeDButton: () => ThreeDButton,
|
|
58
|
+
UniversalHeader: () => UniversalHeader,
|
|
59
|
+
UniversalIdentityPage: () => UniversalIdentityPage,
|
|
60
|
+
UniversalMembersPage: () => UniversalMembersPage,
|
|
61
|
+
UniversalOrganizationPage: () => UniversalOrganizationPage,
|
|
62
|
+
UniversalSidebar: () => UniversalSidebar,
|
|
63
|
+
ZairusAuth: () => ZairusAuth
|
|
57
64
|
});
|
|
58
65
|
module.exports = __toCommonJS(index_exports);
|
|
59
66
|
|
|
@@ -166,22 +173,349 @@ var ThreeDButton = ({
|
|
|
166
173
|
);
|
|
167
174
|
};
|
|
168
175
|
|
|
169
|
-
// src/components/
|
|
176
|
+
// src/components/ThreeDActionButton.tsx
|
|
170
177
|
var import_react4 = __toESM(require("react"));
|
|
178
|
+
var import_react5 = require("@hugeicons/react");
|
|
179
|
+
var import_core_free_icons2 = require("@hugeicons/core-free-icons");
|
|
180
|
+
var ThreeDActionButton = ({
|
|
181
|
+
type = "button",
|
|
182
|
+
onClick,
|
|
183
|
+
disabled = false,
|
|
184
|
+
isLoading = false,
|
|
185
|
+
children,
|
|
186
|
+
className = "",
|
|
187
|
+
ariaLabel
|
|
188
|
+
}) => {
|
|
189
|
+
const isInteractionDisabled = disabled || isLoading;
|
|
190
|
+
const baseShadow = `
|
|
191
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.3),
|
|
192
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
193
|
+
0 3px 0 0 #0c0c0c,
|
|
194
|
+
0 6px 10px rgba(0, 0, 0, 0.3)
|
|
195
|
+
`;
|
|
196
|
+
const hoverShadow = `
|
|
197
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
198
|
+
inset 0 -2px 0 0 rgba(0, 0, 0, 0.5),
|
|
199
|
+
0 4px 0 0 #0c0c0c,
|
|
200
|
+
0 8px 12px rgba(0, 0, 0, 0.35)
|
|
201
|
+
`;
|
|
202
|
+
const activeShadow = `
|
|
203
|
+
inset 0 1px 0 0 rgba(255, 255, 255, 0.1),
|
|
204
|
+
inset 0 -1px 0 0 rgba(0, 0, 0, 0.5),
|
|
205
|
+
0 1px 0 0 #0c0c0c,
|
|
206
|
+
0 2px 4px rgba(0, 0, 0, 0.2)
|
|
207
|
+
`;
|
|
208
|
+
const disabledShadow = `
|
|
209
|
+
inset 0 1px 0 0 rgba(255, 255, 255, 0.15),
|
|
210
|
+
inset 0 -1px 0 0 rgba(0, 0, 0, 0.3),
|
|
211
|
+
0 1px 0 0 #1c1c1c
|
|
212
|
+
`;
|
|
213
|
+
return /* @__PURE__ */ import_react4.default.createElement(
|
|
214
|
+
"button",
|
|
215
|
+
{
|
|
216
|
+
type,
|
|
217
|
+
disabled: isInteractionDisabled,
|
|
218
|
+
onClick,
|
|
219
|
+
"aria-label": ariaLabel,
|
|
220
|
+
className: `
|
|
221
|
+
relative inline-flex items-center justify-center py-2.5 px-8 rounded-full
|
|
222
|
+
bg-neutral-950 text-white text-xs tracking-widest
|
|
223
|
+
transition-all duration-150 select-none group outline-none
|
|
224
|
+
${isInteractionDisabled ? "opacity-50 cursor-not-allowed" : "active:translate-y-0.5"}
|
|
225
|
+
${className}
|
|
226
|
+
`,
|
|
227
|
+
style: { boxShadow: isInteractionDisabled ? disabledShadow : baseShadow },
|
|
228
|
+
onMouseEnter: (e) => {
|
|
229
|
+
if (isInteractionDisabled) return;
|
|
230
|
+
e.currentTarget.style.boxShadow = hoverShadow;
|
|
231
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
232
|
+
},
|
|
233
|
+
onMouseLeave: (e) => {
|
|
234
|
+
if (isInteractionDisabled) return;
|
|
235
|
+
e.currentTarget.style.boxShadow = baseShadow;
|
|
236
|
+
e.currentTarget.style.transform = "translateY(0px)";
|
|
237
|
+
},
|
|
238
|
+
onMouseDown: (e) => {
|
|
239
|
+
if (isInteractionDisabled) return;
|
|
240
|
+
e.currentTarget.style.boxShadow = activeShadow;
|
|
241
|
+
e.currentTarget.style.transform = "translateY(2px)";
|
|
242
|
+
},
|
|
243
|
+
onMouseUp: (e) => {
|
|
244
|
+
if (isInteractionDisabled) return;
|
|
245
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
246
|
+
}
|
|
247
|
+
},
|
|
248
|
+
/* @__PURE__ */ import_react4.default.createElement("span", { className: "absolute inset-0 rounded-full bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none" }),
|
|
249
|
+
/* @__PURE__ */ import_react4.default.createElement("span", { className: "relative z-10 flex items-center justify-center gap-2 leading-none" }, isLoading ? /* @__PURE__ */ import_react4.default.createElement(import_react5.HugeiconsIcon, { icon: import_core_free_icons2.Loading03Icon, size: 16, className: "animate-spin text-white" }) : children)
|
|
250
|
+
);
|
|
251
|
+
};
|
|
252
|
+
|
|
253
|
+
// src/components/ZairusAuth.tsx
|
|
254
|
+
var import_react6 = __toESM(require("react"));
|
|
255
|
+
var import_navigation = require("next/navigation");
|
|
256
|
+
var import_react_hot_toast = __toESM(require("react-hot-toast"));
|
|
257
|
+
var import_react_google_recaptcha_v3 = require("react-google-recaptcha-v3");
|
|
258
|
+
var InputSpinner = () => /* @__PURE__ */ import_react6.default.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__ */ import_react6.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react6.default.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" }));
|
|
259
|
+
function AuthFormInner({
|
|
260
|
+
companyName,
|
|
261
|
+
workspaceLabel = "Workspace",
|
|
262
|
+
termsUrl = "https://retinalabs.company/terms-of-service",
|
|
263
|
+
privacyUrl = "https://retinalabs.company/privacy-policy",
|
|
264
|
+
requireNames = true,
|
|
265
|
+
requireOrganization = true,
|
|
266
|
+
useRecaptcha = false,
|
|
267
|
+
defaultRedirectPath = "/app",
|
|
268
|
+
onAuthRequest,
|
|
269
|
+
onVerifyOtp
|
|
270
|
+
}) {
|
|
271
|
+
const searchParams = (0, import_navigation.useSearchParams)();
|
|
272
|
+
const redirectUrl = searchParams.get("redirect") || defaultRedirectPath;
|
|
273
|
+
const captchaContext = useRecaptcha ? (0, import_react_google_recaptcha_v3.useGoogleReCaptcha)() : null;
|
|
274
|
+
const [mode, setMode] = (0, import_react6.useState)("LOGIN");
|
|
275
|
+
const [step, setStep] = (0, import_react6.useState)("INPUT");
|
|
276
|
+
const getInitialSignupStep = () => {
|
|
277
|
+
if (requireNames) return "NAME";
|
|
278
|
+
if (requireOrganization) return "ORGANIZATION";
|
|
279
|
+
return "EMAIL_ID";
|
|
280
|
+
};
|
|
281
|
+
const [signupStep, setSignupStep] = (0, import_react6.useState)(getInitialSignupStep());
|
|
282
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react6.useState)(false);
|
|
283
|
+
const [countdown, setCountdown] = (0, import_react6.useState)(0);
|
|
284
|
+
const [emailId, setEmailId] = (0, import_react6.useState)("");
|
|
285
|
+
const [firstName, setFirstName] = (0, import_react6.useState)("");
|
|
286
|
+
const [lastName, setLastName] = (0, import_react6.useState)("");
|
|
287
|
+
const [orgName, setOrgName] = (0, import_react6.useState)("");
|
|
288
|
+
const [agreedToTerms, setAgreedToTerms] = (0, import_react6.useState)(false);
|
|
289
|
+
const [otp, setOtp] = (0, import_react6.useState)(["", "", "", "", "", ""]);
|
|
290
|
+
const inputRefs = (0, import_react6.useRef)([]);
|
|
291
|
+
const cleanAlpha = (val) => val.replace(/[^a-zA-Z\s-]/g, "");
|
|
292
|
+
const cleanOrgName = (val) => val.replace(/[^a-zA-Z0-9\s]/g, "").substring(0, 50);
|
|
293
|
+
const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
|
|
294
|
+
(0, import_react6.useEffect)(() => {
|
|
295
|
+
if (countdown > 0) {
|
|
296
|
+
const timer = setTimeout(() => setCountdown(countdown - 1), 1e3);
|
|
297
|
+
return () => clearTimeout(timer);
|
|
298
|
+
}
|
|
299
|
+
}, [countdown]);
|
|
300
|
+
const handleOtpChange = (index, value) => {
|
|
301
|
+
const cleanValue = value.replace(/[^0-9]/g, "");
|
|
302
|
+
if (!cleanValue && value !== "") return;
|
|
303
|
+
const newOtp = [...otp];
|
|
304
|
+
newOtp[index] = cleanValue.slice(-1);
|
|
305
|
+
setOtp(newOtp);
|
|
306
|
+
if (cleanValue && index < 5) {
|
|
307
|
+
inputRefs.current[index + 1]?.focus();
|
|
308
|
+
}
|
|
309
|
+
};
|
|
310
|
+
const handlePaste = (e) => {
|
|
311
|
+
e.preventDefault();
|
|
312
|
+
const pastedData = e.clipboardData.getData("text/plain");
|
|
313
|
+
const numbersOnly = pastedData.replace(/[^0-9]/g, "");
|
|
314
|
+
if (!numbersOnly) return;
|
|
315
|
+
const newOtp = [...otp];
|
|
316
|
+
const length = Math.min(numbersOnly.length, 6);
|
|
317
|
+
for (let i = 0; i < length; i++) {
|
|
318
|
+
newOtp[i] = numbersOnly[i];
|
|
319
|
+
}
|
|
320
|
+
setOtp(newOtp);
|
|
321
|
+
if (length < 6) {
|
|
322
|
+
inputRefs.current[length]?.focus();
|
|
323
|
+
} else {
|
|
324
|
+
inputRefs.current[5]?.focus();
|
|
325
|
+
verifyOtpCode(newOtp.join(""));
|
|
326
|
+
}
|
|
327
|
+
};
|
|
328
|
+
const handleAuthRequestSubmit = async (e) => {
|
|
329
|
+
if (e) e.preventDefault();
|
|
330
|
+
if (mode === "SIGNUP" && !agreedToTerms) {
|
|
331
|
+
import_react_hot_toast.default.error("You must agree to the Terms and Privacy Policy.");
|
|
332
|
+
return;
|
|
333
|
+
}
|
|
334
|
+
if (isSubmitting || countdown > 0) return;
|
|
335
|
+
setIsSubmitting(true);
|
|
336
|
+
try {
|
|
337
|
+
let recaptchaToken = void 0;
|
|
338
|
+
if (useRecaptcha && captchaContext?.executeRecaptcha) {
|
|
339
|
+
recaptchaToken = await captchaContext.executeRecaptcha("auth_request");
|
|
340
|
+
}
|
|
341
|
+
const res = await onAuthRequest({
|
|
342
|
+
email: emailId,
|
|
343
|
+
firstName: mode === "SIGNUP" && requireNames ? firstName : void 0,
|
|
344
|
+
lastName: mode === "SIGNUP" && requireNames ? lastName : void 0,
|
|
345
|
+
organizationName: mode === "SIGNUP" && requireOrganization ? orgName : void 0,
|
|
346
|
+
mode,
|
|
347
|
+
recaptchaToken
|
|
348
|
+
});
|
|
349
|
+
if (res.success) {
|
|
350
|
+
import_react_hot_toast.default.success("Verification code sent");
|
|
351
|
+
setStep("OTP");
|
|
352
|
+
setCountdown(60);
|
|
353
|
+
} else {
|
|
354
|
+
import_react_hot_toast.default.error(res.error || "Authentication failed.");
|
|
355
|
+
}
|
|
356
|
+
} catch {
|
|
357
|
+
import_react_hot_toast.default.error("Service unavailable. Try again later.");
|
|
358
|
+
} finally {
|
|
359
|
+
setIsSubmitting(false);
|
|
360
|
+
}
|
|
361
|
+
};
|
|
362
|
+
const verifyOtpCode = async (codeToVerify) => {
|
|
363
|
+
if (codeToVerify.length !== 6 || isSubmitting) return;
|
|
364
|
+
setIsSubmitting(true);
|
|
365
|
+
try {
|
|
366
|
+
const res = await onVerifyOtp({ email: emailId, code: codeToVerify });
|
|
367
|
+
if (res.success) {
|
|
368
|
+
window.location.href = redirectUrl;
|
|
369
|
+
} else {
|
|
370
|
+
import_react_hot_toast.default.error(res.error || "Invalid code.");
|
|
371
|
+
setOtp(["", "", "", "", "", ""]);
|
|
372
|
+
inputRefs.current[0]?.focus();
|
|
373
|
+
}
|
|
374
|
+
} catch {
|
|
375
|
+
import_react_hot_toast.default.error("Verification failed.");
|
|
376
|
+
} finally {
|
|
377
|
+
setIsSubmitting(false);
|
|
378
|
+
}
|
|
379
|
+
};
|
|
380
|
+
const handleNextSignupStep = () => {
|
|
381
|
+
if (signupStep === "NAME") {
|
|
382
|
+
if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
383
|
+
else setSignupStep("EMAIL_ID");
|
|
384
|
+
} else if (signupStep === "ORGANIZATION") {
|
|
385
|
+
setSignupStep("EMAIL_ID");
|
|
386
|
+
}
|
|
387
|
+
};
|
|
388
|
+
const isContinueDisabled = () => {
|
|
389
|
+
if (isSubmitting) return true;
|
|
390
|
+
if (mode === "LOGIN") return emailId.length < 3;
|
|
391
|
+
if (mode === "SIGNUP") {
|
|
392
|
+
if (signupStep === "NAME") return firstName.trim() === "" || lastName.trim() === "";
|
|
393
|
+
if (signupStep === "ORGANIZATION") return orgName.trim().length < 3;
|
|
394
|
+
if (signupStep === "EMAIL_ID") return emailId.length < 3 || !agreedToTerms;
|
|
395
|
+
}
|
|
396
|
+
return false;
|
|
397
|
+
};
|
|
398
|
+
return /* @__PURE__ */ import_react6.default.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__ */ import_react6.default.createElement("div", { className: "p-8 md:p-12" }, step === "INPUT" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "mb-12 text-center mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight " }, mode === "LOGIN" ? `${companyName} ${workspaceLabel}` : "Create Account"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-[13px] text-neutral-500" }, mode === "LOGIN" ? /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, "Don't have an account? ", /* @__PURE__ */ import_react6.default.createElement("button", { type: "button", onClick: () => {
|
|
399
|
+
setMode("SIGNUP");
|
|
400
|
+
setSignupStep(getInitialSignupStep());
|
|
401
|
+
}, className: "text-black transition-colors ml-1" }, "Sign up")) : /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, "Already have an account? ", /* @__PURE__ */ import_react6.default.createElement("button", { type: "button", onClick: () => setMode("LOGIN"), className: "text-black transition-colors ml-1" }, "Log in")))), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-6", autoComplete: "off", onSubmit: (e) => {
|
|
402
|
+
e.preventDefault();
|
|
403
|
+
if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
404
|
+
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
405
|
+
else handleAuthRequestSubmit();
|
|
406
|
+
} }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "First Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
407
|
+
"input",
|
|
408
|
+
{
|
|
409
|
+
type: "text",
|
|
410
|
+
value: firstName,
|
|
411
|
+
onChange: (e) => setFirstName(cleanAlpha(e.target.value)),
|
|
412
|
+
required: true,
|
|
413
|
+
autoFocus: true,
|
|
414
|
+
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",
|
|
415
|
+
placeholder: "First name"
|
|
416
|
+
}
|
|
417
|
+
)), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Last Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
418
|
+
"input",
|
|
419
|
+
{
|
|
420
|
+
type: "text",
|
|
421
|
+
value: lastName,
|
|
422
|
+
onChange: (e) => setLastName(cleanAlpha(e.target.value)),
|
|
423
|
+
required: true,
|
|
424
|
+
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",
|
|
425
|
+
placeholder: "Last name"
|
|
426
|
+
}
|
|
427
|
+
))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Organization Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
428
|
+
"input",
|
|
429
|
+
{
|
|
430
|
+
type: "text",
|
|
431
|
+
value: orgName,
|
|
432
|
+
onChange: (e) => setOrgName(cleanOrgName(e.target.value)),
|
|
433
|
+
required: true,
|
|
434
|
+
autoFocus: true,
|
|
435
|
+
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",
|
|
436
|
+
placeholder: "Acme Corporation"
|
|
437
|
+
}
|
|
438
|
+
))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Email ID"), /* @__PURE__ */ import_react6.default.createElement(
|
|
439
|
+
"input",
|
|
440
|
+
{
|
|
441
|
+
type: "email",
|
|
442
|
+
value: emailId,
|
|
443
|
+
onChange: (e) => setEmailId(cleanEmailId(e.target.value)),
|
|
444
|
+
required: true,
|
|
445
|
+
autoFocus: true,
|
|
446
|
+
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",
|
|
447
|
+
placeholder: "name@company.com"
|
|
448
|
+
}
|
|
449
|
+
)), mode === "SIGNUP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
450
|
+
"input",
|
|
451
|
+
{
|
|
452
|
+
type: "checkbox",
|
|
453
|
+
id: "zairus-terms",
|
|
454
|
+
checked: agreedToTerms,
|
|
455
|
+
onChange: (e) => setAgreedToTerms(e.target.checked),
|
|
456
|
+
className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer",
|
|
457
|
+
required: true
|
|
458
|
+
}
|
|
459
|
+
), /* @__PURE__ */ import_react6.default.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ import_react6.default.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline font-medium" }, "Terms of Service"), " and ", /* @__PURE__ */ import_react6.default.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline font-medium" }, "Privacy Policy"), "."))), /* @__PURE__ */ import_react6.default.createElement(
|
|
460
|
+
ThreeDActionButton,
|
|
461
|
+
{
|
|
462
|
+
type: "submit",
|
|
463
|
+
disabled: isContinueDisabled(),
|
|
464
|
+
isLoading: isSubmitting,
|
|
465
|
+
className: "w-full mt-10"
|
|
466
|
+
},
|
|
467
|
+
"Continue"
|
|
468
|
+
))), step === "OTP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight " }, "Security Check"), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the code sent to ", /* @__PURE__ */ import_react6.default.createElement("br", null), /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-black font-medium" }, emailId))), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-10", autoComplete: "off", onSubmit: (e) => {
|
|
469
|
+
e.preventDefault();
|
|
470
|
+
verifyOtpCode(otp.join(""));
|
|
471
|
+
} }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react6.default.createElement(
|
|
472
|
+
"input",
|
|
473
|
+
{
|
|
474
|
+
key: index,
|
|
475
|
+
ref: (el) => {
|
|
476
|
+
inputRefs.current[index] = el;
|
|
477
|
+
},
|
|
478
|
+
type: "text",
|
|
479
|
+
inputMode: "numeric",
|
|
480
|
+
maxLength: 1,
|
|
481
|
+
value: digit,
|
|
482
|
+
onChange: (e) => handleOtpChange(index, e.target.value),
|
|
483
|
+
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"
|
|
484
|
+
}
|
|
485
|
+
))), /* @__PURE__ */ import_react6.default.createElement(
|
|
486
|
+
ThreeDActionButton,
|
|
487
|
+
{
|
|
488
|
+
type: "submit",
|
|
489
|
+
disabled: otp.join("").length < 6,
|
|
490
|
+
isLoading: isSubmitting,
|
|
491
|
+
className: "w-full"
|
|
492
|
+
},
|
|
493
|
+
"Verify Code"
|
|
494
|
+
)))));
|
|
495
|
+
}
|
|
496
|
+
var ZairusAuth = (props) => {
|
|
497
|
+
if (props.useRecaptcha && props.recaptchaSiteKey) {
|
|
498
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react_google_recaptcha_v3.GoogleReCaptchaProvider, { reCaptchaKey: props.recaptchaSiteKey }, /* @__PURE__ */ import_react6.default.createElement(import_react6.Suspense, { fallback: /* @__PURE__ */ import_react6.default.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ import_react6.default.createElement(InputSpinner, null)) }, /* @__PURE__ */ import_react6.default.createElement(AuthFormInner, { ...props })));
|
|
499
|
+
}
|
|
500
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.Suspense, { fallback: /* @__PURE__ */ import_react6.default.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ import_react6.default.createElement(InputSpinner, null)) }, /* @__PURE__ */ import_react6.default.createElement(AuthFormInner, { ...props }));
|
|
501
|
+
};
|
|
502
|
+
|
|
503
|
+
// src/components/Header.tsx
|
|
504
|
+
var import_react7 = __toESM(require("react"));
|
|
171
505
|
var import_link2 = __toESM(require("next/link"));
|
|
172
506
|
var import_image = __toESM(require("next/image"));
|
|
173
|
-
var
|
|
507
|
+
var import_navigation2 = require("next/navigation");
|
|
174
508
|
var NavLink = ({
|
|
175
509
|
href,
|
|
176
510
|
children,
|
|
177
511
|
className = "",
|
|
178
512
|
light = true
|
|
179
513
|
}) => {
|
|
180
|
-
const pathname = (0,
|
|
514
|
+
const pathname = (0, import_navigation2.usePathname)();
|
|
181
515
|
const isActive = pathname === href;
|
|
182
516
|
const activeClass = light ? "text-neutral-950 font-medium" : "text-white font-medium";
|
|
183
517
|
const inactiveClass = light ? "text-neutral-600 hover:text-neutral-950" : "text-neutral-400 hover:text-white";
|
|
184
|
-
return /* @__PURE__ */
|
|
518
|
+
return /* @__PURE__ */ import_react7.default.createElement(
|
|
185
519
|
import_link2.default,
|
|
186
520
|
{
|
|
187
521
|
href,
|
|
@@ -208,7 +542,7 @@ var Header = ({
|
|
|
208
542
|
const titleColor = light ? "text-black" : "text-white";
|
|
209
543
|
const subtitleColor = light ? "text-neutral-500" : "text-neutral-400";
|
|
210
544
|
const hasBrandSection = showLogo || !hideHeaderText;
|
|
211
|
-
return /* @__PURE__ */
|
|
545
|
+
return /* @__PURE__ */ import_react7.default.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ import_react7.default.createElement("header", { className: `${headerLayoutWidth} ${headerBgStyle} backdrop-blur-md rounded-full py-2 px-6 flex items-center border transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ import_react7.default.createElement(import_link2.default, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70" }, showLogo && /* @__PURE__ */ import_react7.default.createElement(
|
|
212
546
|
import_image.default,
|
|
213
547
|
{
|
|
214
548
|
src: logoSrc,
|
|
@@ -218,7 +552,7 @@ var Header = ({
|
|
|
218
552
|
className: `object-contain w-5 h-auto ${invert ? "invert" : ""}`,
|
|
219
553
|
priority: true
|
|
220
554
|
}
|
|
221
|
-
), !hideHeaderText && /* @__PURE__ */
|
|
555
|
+
), !hideHeaderText && /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: `text-[12px] leading-none tracking-wide mb-1 transition-colors ${titleColor}` }, companyName), subtitle && /* @__PURE__ */ import_react7.default.createElement("span", { className: `text-[9px] tracking-widest leading-none transition-colors ${subtitleColor}` }, subtitle)))), /* @__PURE__ */ import_react7.default.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ import_react7.default.createElement(
|
|
222
556
|
NavLink,
|
|
223
557
|
{
|
|
224
558
|
key: index,
|
|
@@ -231,9 +565,9 @@ var Header = ({
|
|
|
231
565
|
};
|
|
232
566
|
|
|
233
567
|
// src/components/Footer.tsx
|
|
234
|
-
var
|
|
568
|
+
var import_react8 = __toESM(require("react"));
|
|
235
569
|
var import_link3 = __toESM(require("next/link"));
|
|
236
|
-
var
|
|
570
|
+
var import_react9 = require("@hugeicons/react");
|
|
237
571
|
var Footer = ({
|
|
238
572
|
description,
|
|
239
573
|
columns,
|
|
@@ -241,20 +575,20 @@ var Footer = ({
|
|
|
241
575
|
copyrightText,
|
|
242
576
|
topSection
|
|
243
577
|
}) => {
|
|
244
|
-
const [openCol, setOpenCol] = (0,
|
|
578
|
+
const [openCol, setOpenCol] = (0, import_react8.useState)(null);
|
|
245
579
|
const toggleColumn = (idx) => {
|
|
246
580
|
setOpenCol(openCol === idx ? null : idx);
|
|
247
581
|
};
|
|
248
|
-
return /* @__PURE__ */
|
|
582
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react8.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-[12px] font-serif text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ import_react8.default.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ import_react8.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 uppercase" }, col.title), /* @__PURE__ */ import_react8.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react8.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react8.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ import_react8.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
|
|
249
583
|
const isOpen = openCol === idx;
|
|
250
|
-
return /* @__PURE__ */
|
|
584
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ import_react8.default.createElement(
|
|
251
585
|
"button",
|
|
252
586
|
{
|
|
253
587
|
onClick: () => toggleColumn(idx),
|
|
254
588
|
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
255
589
|
},
|
|
256
|
-
/* @__PURE__ */
|
|
257
|
-
/* @__PURE__ */
|
|
590
|
+
/* @__PURE__ */ import_react8.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black uppercase" }, col.title),
|
|
591
|
+
/* @__PURE__ */ import_react8.default.createElement(
|
|
258
592
|
"svg",
|
|
259
593
|
{
|
|
260
594
|
className: `w-4 h-4 text-neutral-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
@@ -262,10 +596,10 @@ var Footer = ({
|
|
|
262
596
|
viewBox: "0 0 24 24",
|
|
263
597
|
stroke: "currentColor"
|
|
264
598
|
},
|
|
265
|
-
/* @__PURE__ */
|
|
599
|
+
/* @__PURE__ */ import_react8.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
266
600
|
)
|
|
267
|
-
), /* @__PURE__ */
|
|
268
|
-
})))), /* @__PURE__ */
|
|
601
|
+
), /* @__PURE__ */ import_react8.default.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__ */ import_react8.default.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ import_react8.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react8.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react8.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ import_react8.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
602
|
+
})))), /* @__PURE__ */ import_react8.default.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__ */ import_react8.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ import_react8.default.createElement(
|
|
269
603
|
"a",
|
|
270
604
|
{
|
|
271
605
|
key: idx,
|
|
@@ -275,12 +609,12 @@ var Footer = ({
|
|
|
275
609
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
276
610
|
"aria-label": social.name
|
|
277
611
|
},
|
|
278
|
-
/* @__PURE__ */
|
|
612
|
+
/* @__PURE__ */ import_react8.default.createElement(import_react9.HugeiconsIcon, { icon: social.icon, size: 20 })
|
|
279
613
|
))))))));
|
|
280
614
|
};
|
|
281
615
|
|
|
282
616
|
// src/components/HeroSection.tsx
|
|
283
|
-
var
|
|
617
|
+
var import_react10 = __toESM(require("react"));
|
|
284
618
|
var import_link4 = __toESM(require("next/link"));
|
|
285
619
|
var import_image2 = __toESM(require("next/image"));
|
|
286
620
|
var HeroSection = ({
|
|
@@ -296,7 +630,7 @@ var HeroSection = ({
|
|
|
296
630
|
showImage = false,
|
|
297
631
|
imageSrc = "/assets/ai.avif"
|
|
298
632
|
}) => {
|
|
299
|
-
return /* @__PURE__ */
|
|
633
|
+
return /* @__PURE__ */ import_react10.default.createElement("section", { className: "relative pt-32 sm:pt-40 pb-16 flex flex-col items-center overflow-hidden w-full" }, /* @__PURE__ */ import_react10.default.createElement(
|
|
300
634
|
"div",
|
|
301
635
|
{
|
|
302
636
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0",
|
|
@@ -304,7 +638,7 @@ var HeroSection = ({
|
|
|
304
638
|
background: `radial-gradient(120% 100% at 50% 0%, #043324 0%, #21a473 45%, #e0f6ce 80%, #f5f5f5 100%)`
|
|
305
639
|
}
|
|
306
640
|
}
|
|
307
|
-
), /* @__PURE__ */
|
|
641
|
+
), /* @__PURE__ */ import_react10.default.createElement(
|
|
308
642
|
"div",
|
|
309
643
|
{
|
|
310
644
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -312,14 +646,14 @@ var HeroSection = ({
|
|
|
312
646
|
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")`
|
|
313
647
|
}
|
|
314
648
|
}
|
|
315
|
-
), /* @__PURE__ */
|
|
649
|
+
), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.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__ */ import_react10.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-white uppercase" }, badgeText)), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("div", { className: "flex justify-center mt-2 mb-10 md:mb-14" }, /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react10.default.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react10.default.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.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__ */ import_react10.default.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__ */ import_react10.default.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("p", { className: "text-[13px] md:text-[15px] text-[#bbf7df]/90 max-w-xl mx-auto mb-10 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ import_react10.default.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react10.default.createElement(
|
|
316
650
|
import_link4.default,
|
|
317
651
|
{
|
|
318
652
|
href: secondaryCtaHref,
|
|
319
653
|
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"
|
|
320
654
|
},
|
|
321
655
|
secondaryCtaText
|
|
322
|
-
)), showImage && /* @__PURE__ */
|
|
656
|
+
)), showImage && /* @__PURE__ */ import_react10.default.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ import_react10.default.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ import_react10.default.createElement(
|
|
323
657
|
import_image2.default,
|
|
324
658
|
{
|
|
325
659
|
src: imageSrc,
|
|
@@ -329,14 +663,14 @@ var HeroSection = ({
|
|
|
329
663
|
className: "object-cover object-top",
|
|
330
664
|
priority: true
|
|
331
665
|
}
|
|
332
|
-
))), /* @__PURE__ */
|
|
666
|
+
))), /* @__PURE__ */ import_react10.default.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__ */ import_react10.default.createElement("div", { className: "w-16 md:w-24 h-1 md:h-1.5 bg-slate-400/30 rounded-b-md" }))))));
|
|
333
667
|
};
|
|
334
668
|
|
|
335
669
|
// src/components/AppBento2.tsx
|
|
336
|
-
var
|
|
337
|
-
var
|
|
670
|
+
var import_react11 = __toESM(require("react"));
|
|
671
|
+
var import_react12 = require("@hugeicons/react");
|
|
338
672
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
339
|
-
return /* @__PURE__ */
|
|
673
|
+
return /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4 uppercase" }, tagline), /* @__PURE__ */ import_react11.default.createElement("h2", { className: "text-3xl font-serif md:text-4xl tracking-tight text-black leading-[1.1]" }, headline))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
340
674
|
const isWhite = i === 0;
|
|
341
675
|
const isBlack = i === 1;
|
|
342
676
|
const isNeutral = i === 2;
|
|
@@ -358,35 +692,35 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
358
692
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
359
693
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
360
694
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
361
|
-
return /* @__PURE__ */
|
|
695
|
+
return /* @__PURE__ */ import_react11.default.createElement(
|
|
362
696
|
"div",
|
|
363
697
|
{
|
|
364
698
|
key: i,
|
|
365
699
|
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
366
700
|
style: { boxShadow: getShadowStyle() }
|
|
367
701
|
},
|
|
368
|
-
/* @__PURE__ */
|
|
702
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
369
703
|
"div",
|
|
370
704
|
{
|
|
371
705
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
372
706
|
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")` }
|
|
373
707
|
}
|
|
374
708
|
),
|
|
375
|
-
isBlack && /* @__PURE__ */
|
|
376
|
-
/* @__PURE__ */
|
|
377
|
-
/* @__PURE__ */
|
|
709
|
+
isBlack && /* @__PURE__ */ import_react11.default.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" }),
|
|
710
|
+
/* @__PURE__ */ import_react11.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react11.default.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__ */ import_react11.default.createElement(import_react12.HugeiconsIcon, { icon: f.icon, size: 180 }))),
|
|
711
|
+
/* @__PURE__ */ import_react11.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: `text-[9px] uppercase tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react11.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ import_react11.default.createElement(import_react12.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react11.default.createElement("h3", { className: `text-xl font-serif mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react11.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
378
712
|
);
|
|
379
713
|
})))));
|
|
380
714
|
};
|
|
381
715
|
|
|
382
716
|
// src/components/FeatureScroll.tsx
|
|
383
|
-
var
|
|
717
|
+
var import_react13 = __toESM(require("react"));
|
|
384
718
|
var import_image3 = __toESM(require("next/image"));
|
|
385
|
-
var
|
|
386
|
-
var
|
|
719
|
+
var import_react14 = require("@hugeicons/react");
|
|
720
|
+
var import_core_free_icons3 = require("@hugeicons/core-free-icons");
|
|
387
721
|
var FeatureCard = ({ feature }) => {
|
|
388
|
-
const [isLoading, setIsLoading] = (0,
|
|
389
|
-
return /* @__PURE__ */
|
|
722
|
+
const [isLoading, setIsLoading] = (0, import_react13.useState)(!!feature.image);
|
|
723
|
+
return /* @__PURE__ */ import_react13.default.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__ */ import_react13.default.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ import_react13.default.createElement(
|
|
390
724
|
"div",
|
|
391
725
|
{
|
|
392
726
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -395,7 +729,7 @@ var FeatureCard = ({ feature }) => {
|
|
|
395
729
|
backgroundRepeat: "repeat"
|
|
396
730
|
}
|
|
397
731
|
}
|
|
398
|
-
), isLoading && feature.image && /* @__PURE__ */
|
|
732
|
+
), isLoading && feature.image && /* @__PURE__ */ import_react13.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-50/50 backdrop-blur-sm" }, /* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons3.Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), feature.image ? /* @__PURE__ */ import_react13.default.createElement(
|
|
399
733
|
import_image3.default,
|
|
400
734
|
{
|
|
401
735
|
src: feature.image,
|
|
@@ -409,12 +743,12 @@ var FeatureCard = ({ feature }) => {
|
|
|
409
743
|
group-hover:scale-105
|
|
410
744
|
`
|
|
411
745
|
}
|
|
412
|
-
) : /* @__PURE__ */
|
|
746
|
+
) : /* @__PURE__ */ import_react13.default.createElement("div", { className: "absolute inset-0 bg-white z-0 transition-transform duration-700 ease-out group-hover:scale-105" })), /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ import_react13.default.createElement("h3", { className: "text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ import_react13.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
413
747
|
};
|
|
414
748
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
415
|
-
const scrollRef = (0,
|
|
416
|
-
const [canScrollLeft, setCanScrollLeft] = (0,
|
|
417
|
-
const [canScrollRight, setCanScrollRight] = (0,
|
|
749
|
+
const scrollRef = (0, import_react13.useRef)(null);
|
|
750
|
+
const [canScrollLeft, setCanScrollLeft] = (0, import_react13.useState)(false);
|
|
751
|
+
const [canScrollRight, setCanScrollRight] = (0, import_react13.useState)(true);
|
|
418
752
|
const checkScroll = () => {
|
|
419
753
|
if (scrollRef.current) {
|
|
420
754
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -422,7 +756,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
422
756
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
423
757
|
}
|
|
424
758
|
};
|
|
425
|
-
(0,
|
|
759
|
+
(0, import_react13.useEffect)(() => {
|
|
426
760
|
checkScroll();
|
|
427
761
|
window.addEventListener("resize", checkScroll);
|
|
428
762
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -433,7 +767,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
433
767
|
scrollRef.current.scrollBy({ left: scrollAmount, behavior: "smooth" });
|
|
434
768
|
}
|
|
435
769
|
};
|
|
436
|
-
return /* @__PURE__ */
|
|
770
|
+
return /* @__PURE__ */ import_react13.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react13.default.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ import_react13.default.createElement(
|
|
437
771
|
"button",
|
|
438
772
|
{
|
|
439
773
|
onClick: () => scroll("left"),
|
|
@@ -441,8 +775,8 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
441
775
|
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",
|
|
442
776
|
"aria-label": "Previous feature"
|
|
443
777
|
},
|
|
444
|
-
/* @__PURE__ */
|
|
445
|
-
), /* @__PURE__ */
|
|
778
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons3.ArrowLeft01Icon, size: 20 })
|
|
779
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
|
446
780
|
"button",
|
|
447
781
|
{
|
|
448
782
|
onClick: () => scroll("right"),
|
|
@@ -450,39 +784,39 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
450
784
|
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",
|
|
451
785
|
"aria-label": "Next feature"
|
|
452
786
|
},
|
|
453
|
-
/* @__PURE__ */
|
|
454
|
-
))), /* @__PURE__ */
|
|
787
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons3.ArrowRight01Icon, size: 20 })
|
|
788
|
+
))), /* @__PURE__ */ import_react13.default.createElement(
|
|
455
789
|
"div",
|
|
456
790
|
{
|
|
457
791
|
ref: scrollRef,
|
|
458
792
|
onScroll: checkScroll,
|
|
459
793
|
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"
|
|
460
794
|
},
|
|
461
|
-
features.map((feature, idx) => /* @__PURE__ */
|
|
462
|
-
), /* @__PURE__ */
|
|
795
|
+
features.map((feature, idx) => /* @__PURE__ */ import_react13.default.createElement(FeatureCard, { key: idx, feature }))
|
|
796
|
+
), /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ import_react13.default.createElement(
|
|
463
797
|
"button",
|
|
464
798
|
{
|
|
465
799
|
onClick: () => scroll("left"),
|
|
466
800
|
disabled: !canScrollLeft,
|
|
467
801
|
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"
|
|
468
802
|
},
|
|
469
|
-
/* @__PURE__ */
|
|
470
|
-
), /* @__PURE__ */
|
|
803
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons3.ArrowLeft01Icon, size: 20 })
|
|
804
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
|
471
805
|
"button",
|
|
472
806
|
{
|
|
473
807
|
onClick: () => scroll("right"),
|
|
474
808
|
disabled: !canScrollRight,
|
|
475
809
|
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"
|
|
476
810
|
},
|
|
477
|
-
/* @__PURE__ */
|
|
811
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons3.ArrowRight01Icon, size: 20 })
|
|
478
812
|
))));
|
|
479
813
|
};
|
|
480
814
|
|
|
481
815
|
// src/components/AITranscriptionFeature.tsx
|
|
482
|
-
var
|
|
816
|
+
var import_react15 = __toESM(require("react"));
|
|
483
817
|
var import_image4 = __toESM(require("next/image"));
|
|
484
|
-
var
|
|
485
|
-
var
|
|
818
|
+
var import_react16 = require("@hugeicons/react");
|
|
819
|
+
var import_core_free_icons4 = require("@hugeicons/core-free-icons");
|
|
486
820
|
var AITranscriptionFeature = ({
|
|
487
821
|
tagline,
|
|
488
822
|
headline,
|
|
@@ -493,8 +827,8 @@ var AITranscriptionFeature = ({
|
|
|
493
827
|
cursorLabel,
|
|
494
828
|
detailTextSuffix
|
|
495
829
|
}) => {
|
|
496
|
-
const [isLoading, setIsLoading] = (0,
|
|
497
|
-
return /* @__PURE__ */
|
|
830
|
+
const [isLoading, setIsLoading] = (0, import_react15.useState)(!!imagePath);
|
|
831
|
+
return /* @__PURE__ */ import_react15.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react15.default.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight animate-gradient-wipe leading-[1.05] mb-4" }, headline), /* @__PURE__ */ import_react15.default.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-xl mx-auto" }, description)), /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement(
|
|
498
832
|
"div",
|
|
499
833
|
{
|
|
500
834
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -503,7 +837,7 @@ var AITranscriptionFeature = ({
|
|
|
503
837
|
backgroundRepeat: "repeat"
|
|
504
838
|
}
|
|
505
839
|
}
|
|
506
|
-
), isLoading && imagePath && /* @__PURE__ */
|
|
840
|
+
), isLoading && imagePath && /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement(import_react16.HugeiconsIcon, { icon: import_core_free_icons4.Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), imagePath ? /* @__PURE__ */ import_react15.default.createElement(
|
|
507
841
|
import_image4.default,
|
|
508
842
|
{
|
|
509
843
|
src: imagePath,
|
|
@@ -516,32 +850,32 @@ var AITranscriptionFeature = ({
|
|
|
516
850
|
${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}
|
|
517
851
|
`
|
|
518
852
|
}
|
|
519
|
-
) : /* @__PURE__ */
|
|
853
|
+
) : /* @__PURE__ */ import_react15.default.createElement("div", { className: "absolute inset-0 bg-white z-0" })), /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("p", { className: "text-[18px] sm:text-[22px] md:text-[25px] leading-[1.8] text-neutral-800" }, detailTextPrefix, " ", /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ import_react15.default.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ import_react15.default.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#20A272] rounded-[1px] z-10" }), /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.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__ */ import_react15.default.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__ */ import_react15.default.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#20A272", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ import_react15.default.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))));
|
|
520
854
|
};
|
|
521
855
|
|
|
522
856
|
// src/components/PlatformFeatures.tsx
|
|
523
|
-
var
|
|
524
|
-
var
|
|
857
|
+
var import_react17 = __toESM(require("react"));
|
|
858
|
+
var import_react18 = require("@hugeicons/react");
|
|
525
859
|
var PlatformFeatures = ({
|
|
526
860
|
tagline,
|
|
527
861
|
headline,
|
|
528
862
|
description,
|
|
529
863
|
features
|
|
530
864
|
}) => {
|
|
531
|
-
return /* @__PURE__ */
|
|
865
|
+
return /* @__PURE__ */ import_react17.default.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ import_react17.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react17.default.createElement("h2", { className: "text-3xl font-serif md:text-5xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ import_react17.default.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ import_react17.default.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ import_react17.default.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__ */ import_react17.default.createElement(
|
|
532
866
|
"div",
|
|
533
867
|
{
|
|
534
868
|
key: idx,
|
|
535
869
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
536
870
|
style: { animationDelay: feature.delay || "0ms" }
|
|
537
871
|
},
|
|
538
|
-
/* @__PURE__ */
|
|
539
|
-
/* @__PURE__ */
|
|
872
|
+
/* @__PURE__ */ import_react17.default.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__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: feature.icon, size: 24 })),
|
|
873
|
+
/* @__PURE__ */ import_react17.default.createElement("div", null, /* @__PURE__ */ import_react17.default.createElement("h3", { className: "text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ import_react17.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
540
874
|
)))));
|
|
541
875
|
};
|
|
542
876
|
|
|
543
877
|
// src/components/ManagedDocument.tsx
|
|
544
|
-
var
|
|
878
|
+
var import_react19 = __toESM(require("react"));
|
|
545
879
|
var ManagedDocument = ({
|
|
546
880
|
tagline,
|
|
547
881
|
title,
|
|
@@ -551,7 +885,7 @@ var ManagedDocument = ({
|
|
|
551
885
|
}) => {
|
|
552
886
|
return (
|
|
553
887
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
554
|
-
/* @__PURE__ */
|
|
888
|
+
/* @__PURE__ */ import_react19.default.createElement("div", { className: "grow pt-28 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react19.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ import_react19.default.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), sections.map((section, index) => /* @__PURE__ */ import_react19.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react19.default.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 text-left uppercase" }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react19.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left font-light" }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react19.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react19.default.createElement("div", { className: `bg-neutral-100 rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react19.default.createElement("p", { className: "italic text-neutral-900 text-[13px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react19.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react19.default.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react19.default.createElement(
|
|
555
889
|
"a",
|
|
556
890
|
{
|
|
557
891
|
href: `mailto:${contactEmail}`,
|
|
@@ -563,18 +897,18 @@ var ManagedDocument = ({
|
|
|
563
897
|
};
|
|
564
898
|
|
|
565
899
|
// src/components/ManagedContactBlock.tsx
|
|
566
|
-
var
|
|
567
|
-
var
|
|
900
|
+
var import_react20 = __toESM(require("react"));
|
|
901
|
+
var import_react21 = require("@hugeicons/react");
|
|
568
902
|
var SecureEmail = ({ user, domain, className }) => {
|
|
569
|
-
const [isMounted, setIsMounted] = (0,
|
|
570
|
-
(0,
|
|
903
|
+
const [isMounted, setIsMounted] = (0, import_react20.useState)(false);
|
|
904
|
+
(0, import_react20.useEffect)(() => {
|
|
571
905
|
setIsMounted(true);
|
|
572
906
|
}, []);
|
|
573
907
|
if (!isMounted) {
|
|
574
|
-
return /* @__PURE__ */
|
|
908
|
+
return /* @__PURE__ */ import_react20.default.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
575
909
|
}
|
|
576
910
|
const email = `${user}@${domain}`;
|
|
577
|
-
return /* @__PURE__ */
|
|
911
|
+
return /* @__PURE__ */ import_react20.default.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
578
912
|
};
|
|
579
913
|
var ManagedContactBlock = ({
|
|
580
914
|
tagline,
|
|
@@ -583,7 +917,7 @@ var ManagedContactBlock = ({
|
|
|
583
917
|
emails,
|
|
584
918
|
socials
|
|
585
919
|
}) => {
|
|
586
|
-
return /* @__PURE__ */
|
|
920
|
+
return /* @__PURE__ */ import_react20.default.createElement("div", { className: "grow pt-28 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react20.default.createElement(
|
|
587
921
|
"div",
|
|
588
922
|
{
|
|
589
923
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -592,21 +926,21 @@ var ManagedContactBlock = ({
|
|
|
592
926
|
backgroundRepeat: "repeat"
|
|
593
927
|
}
|
|
594
928
|
}
|
|
595
|
-
), /* @__PURE__ */
|
|
929
|
+
), /* @__PURE__ */ import_react20.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ import_react20.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ import_react20.default.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react20.default.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ import_react20.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react20.default.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Contact Details"), /* @__PURE__ */ import_react20.default.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ import_react20.default.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ import_react20.default.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ import_react20.default.createElement("p", { className: "pt-2" }, /* @__PURE__ */ import_react20.default.createElement(
|
|
596
930
|
"a",
|
|
597
931
|
{
|
|
598
932
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
599
933
|
className: "transition-colors hover:text-black"
|
|
600
934
|
},
|
|
601
935
|
company.phone
|
|
602
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
936
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ import_react20.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react20.default.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Email Directory"), /* @__PURE__ */ import_react20.default.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ import_react20.default.createElement("div", { key: idx }, /* @__PURE__ */ import_react20.default.createElement("p", { className: "text-[10px] tracking-[0.2em] mb-1.5 text-neutral-500 uppercase" }, email.label), /* @__PURE__ */ import_react20.default.createElement(
|
|
603
937
|
SecureEmail,
|
|
604
938
|
{
|
|
605
939
|
user: email.user,
|
|
606
940
|
domain: email.domain,
|
|
607
941
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
608
942
|
}
|
|
609
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
943
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ import_react20.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react20.default.createElement("h2", { className: "text-[11px] tracking-[0.2em] text-black mb-4 uppercase" }, "Find Us Online"), /* @__PURE__ */ import_react20.default.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ import_react20.default.createElement(
|
|
610
944
|
"a",
|
|
611
945
|
{
|
|
612
946
|
key: idx,
|
|
@@ -616,29 +950,29 @@ var ManagedContactBlock = ({
|
|
|
616
950
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
617
951
|
"aria-label": social.label
|
|
618
952
|
},
|
|
619
|
-
/* @__PURE__ */
|
|
620
|
-
/* @__PURE__ */
|
|
953
|
+
/* @__PURE__ */ import_react20.default.createElement(import_react21.HugeiconsIcon, { icon: social.icon, size: 18 }),
|
|
954
|
+
/* @__PURE__ */ import_react20.default.createElement("span", { className: "text-[13px]" }, social.label)
|
|
621
955
|
)))))))));
|
|
622
956
|
};
|
|
623
957
|
|
|
624
958
|
// src/components/ManagedPricingBlock.tsx
|
|
625
|
-
var
|
|
959
|
+
var import_react22 = __toESM(require("react"));
|
|
626
960
|
var import_link5 = __toESM(require("next/link"));
|
|
627
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
628
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
961
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ import_react22.default.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__ */ import_react22.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react22.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
962
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ import_react22.default.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__ */ import_react22.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react22.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
629
963
|
var ManagedPricingBlock = ({
|
|
630
964
|
tagline,
|
|
631
965
|
title,
|
|
632
966
|
plans
|
|
633
967
|
}) => {
|
|
634
|
-
return /* @__PURE__ */
|
|
968
|
+
return /* @__PURE__ */ import_react22.default.createElement("div", { className: "grow pt-40 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-12" }, tagline && /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block uppercase" }, tagline), /* @__PURE__ */ import_react22.default.createElement("h1", { className: "text-2xl font-serif sm:text-3xl mt-3 text-black tracking-tight" }, title)), /* @__PURE__ */ import_react22.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl" }, plans.map((plan, planIdx) => /* @__PURE__ */ import_react22.default.createElement(
|
|
635
969
|
"div",
|
|
636
970
|
{
|
|
637
971
|
key: planIdx,
|
|
638
972
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden ${plan.isPremium ? "border border-neutral-100" : ""}`
|
|
639
973
|
},
|
|
640
|
-
/* @__PURE__ */
|
|
641
|
-
plan.isPremium ? /* @__PURE__ */
|
|
974
|
+
/* @__PURE__ */ import_react22.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ import_react22.default.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-3xl text-black" }, plan.price), plan.period && /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ import_react22.default.createElement("p", { className: "text-xs text-neutral-500 mt-2" }, plan.description)),
|
|
975
|
+
plan.isPremium ? /* @__PURE__ */ import_react22.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react22.default.createElement(
|
|
642
976
|
import_link5.default,
|
|
643
977
|
{
|
|
644
978
|
href: plan.ctaHref,
|
|
@@ -646,20 +980,20 @@ var ManagedPricingBlock = ({
|
|
|
646
980
|
},
|
|
647
981
|
plan.ctaText
|
|
648
982
|
),
|
|
649
|
-
/* @__PURE__ */
|
|
983
|
+
/* @__PURE__ */ import_react22.default.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
650
984
|
const isAvailable = feature.value !== false;
|
|
651
985
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
652
|
-
return /* @__PURE__ */
|
|
986
|
+
return /* @__PURE__ */ import_react22.default.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ import_react22.default.createElement(CheckIcon, null) : /* @__PURE__ */ import_react22.default.createElement(CrossIcon, null), /* @__PURE__ */ import_react22.default.createElement("span", { className: `text-xs ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
653
987
|
}))
|
|
654
988
|
)))));
|
|
655
989
|
};
|
|
656
990
|
|
|
657
991
|
// src/components/ManagedBoardBlock.tsx
|
|
658
|
-
var
|
|
992
|
+
var import_react23 = __toESM(require("react"));
|
|
659
993
|
var import_image5 = __toESM(require("next/image"));
|
|
660
|
-
var
|
|
661
|
-
var
|
|
662
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
994
|
+
var import_react24 = require("@hugeicons/react");
|
|
995
|
+
var import_core_free_icons5 = require("@hugeicons/core-free-icons");
|
|
996
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_react23.default.createElement(
|
|
663
997
|
"a",
|
|
664
998
|
{
|
|
665
999
|
href,
|
|
@@ -668,7 +1002,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_r
|
|
|
668
1002
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
669
1003
|
"aria-label": `${name} on ${label}`
|
|
670
1004
|
},
|
|
671
|
-
/* @__PURE__ */
|
|
1005
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon, size: 16 })
|
|
672
1006
|
);
|
|
673
1007
|
var ManagedBoardBlock = ({
|
|
674
1008
|
tagline,
|
|
@@ -677,7 +1011,7 @@ var ManagedBoardBlock = ({
|
|
|
677
1011
|
contactText,
|
|
678
1012
|
contactEmail
|
|
679
1013
|
}) => {
|
|
680
|
-
return /* @__PURE__ */
|
|
1014
|
+
return /* @__PURE__ */ import_react23.default.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
681
1015
|
"div",
|
|
682
1016
|
{
|
|
683
1017
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -686,7 +1020,7 @@ var ManagedBoardBlock = ({
|
|
|
686
1020
|
backgroundRepeat: "repeat"
|
|
687
1021
|
}
|
|
688
1022
|
}
|
|
689
|
-
), /* @__PURE__ */
|
|
1023
|
+
), /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ import_react23.default.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ import_react23.default.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__ */ import_react23.default.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
690
1024
|
import_image5.default,
|
|
691
1025
|
{
|
|
692
1026
|
src: member.imageSrc,
|
|
@@ -695,39 +1029,39 @@ var ManagedBoardBlock = ({
|
|
|
695
1029
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
696
1030
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
697
1031
|
}
|
|
698
|
-
)), /* @__PURE__ */
|
|
1032
|
+
)), /* @__PURE__ */ import_react23.default.createElement("div", { className: "pt-1" }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-500 mt-1.5 uppercase" }, member.title))), /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ import_react23.default.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react23.default.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ import_react23.default.createElement(
|
|
699
1033
|
MemberSocialLink,
|
|
700
1034
|
{
|
|
701
1035
|
href: `https://x.com/${member.twitterHandle}`,
|
|
702
|
-
icon:
|
|
1036
|
+
icon: import_core_free_icons5.TwitterIcon,
|
|
703
1037
|
label: "X",
|
|
704
1038
|
name: member.name
|
|
705
1039
|
}
|
|
706
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
1040
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ import_react23.default.createElement(
|
|
707
1041
|
MemberSocialLink,
|
|
708
1042
|
{
|
|
709
1043
|
href: member.linkedinHandle,
|
|
710
|
-
icon:
|
|
1044
|
+
icon: import_core_free_icons5.LinkedinIcon,
|
|
711
1045
|
label: "LinkedIn",
|
|
712
1046
|
name: member.name
|
|
713
1047
|
}
|
|
714
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
1048
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[12px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react23.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
715
1049
|
};
|
|
716
1050
|
|
|
717
1051
|
// src/components/ManagedProjectsBlock.tsx
|
|
718
|
-
var
|
|
1052
|
+
var import_react25 = __toESM(require("react"));
|
|
719
1053
|
var import_link6 = __toESM(require("next/link"));
|
|
720
1054
|
var GridSection = ({
|
|
721
1055
|
children,
|
|
722
1056
|
isLast = false,
|
|
723
1057
|
className = "py-8 md:py-10"
|
|
724
|
-
}) => /* @__PURE__ */
|
|
1058
|
+
}) => /* @__PURE__ */ import_react25.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "border-b border-neutral-100" : ""}` }, children);
|
|
725
1059
|
var ManagedProjectsBlock = ({
|
|
726
1060
|
tagline,
|
|
727
1061
|
title,
|
|
728
1062
|
projects
|
|
729
1063
|
}) => {
|
|
730
|
-
return /* @__PURE__ */
|
|
1064
|
+
return /* @__PURE__ */ import_react25.default.createElement("div", { className: "grow pt-28 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
731
1065
|
"div",
|
|
732
1066
|
{
|
|
733
1067
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -736,15 +1070,15 @@ var ManagedProjectsBlock = ({
|
|
|
736
1070
|
backgroundRepeat: "repeat"
|
|
737
1071
|
}
|
|
738
1072
|
}
|
|
739
|
-
), /* @__PURE__ */
|
|
1073
|
+
), /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react25.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ import_react25.default.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
740
1074
|
const isLast = index === projects.length - 1;
|
|
741
|
-
const projectContent = /* @__PURE__ */
|
|
742
|
-
return /* @__PURE__ */
|
|
1075
|
+
const projectContent = /* @__PURE__ */ import_react25.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react25.default.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__ */ import_react25.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react25.default.createElement("h2", { className: "text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react25.default.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__ */ import_react25.default.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__ */ import_react25.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 shrink-0 uppercase" }, project.date)), /* @__PURE__ */ import_react25.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
1076
|
+
return /* @__PURE__ */ import_react25.default.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__ */ import_react25.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react25.default.createElement(import_link6.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
743
1077
|
}))));
|
|
744
1078
|
};
|
|
745
1079
|
|
|
746
1080
|
// src/components/ManagedNotFoundBlock.tsx
|
|
747
|
-
var
|
|
1081
|
+
var import_react26 = __toESM(require("react"));
|
|
748
1082
|
var import_link7 = __toESM(require("next/link"));
|
|
749
1083
|
var ManagedNotFoundBlock = ({
|
|
750
1084
|
title = "404 - Page Not Found",
|
|
@@ -752,15 +1086,15 @@ var ManagedNotFoundBlock = ({
|
|
|
752
1086
|
backLinkText = "\u2190 Go back to Homepage",
|
|
753
1087
|
backLinkHref = "/"
|
|
754
1088
|
}) => {
|
|
755
|
-
return /* @__PURE__ */
|
|
1089
|
+
return /* @__PURE__ */ import_react26.default.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ import_react26.default.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ import_react26.default.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ import_react26.default.createElement(
|
|
756
1090
|
"svg",
|
|
757
1091
|
{
|
|
758
1092
|
xmlns: "http://www.w3.org/2000/svg",
|
|
759
1093
|
viewBox: "0 0 24 24",
|
|
760
1094
|
className: "w-12 h-12 fill-neutral-200"
|
|
761
1095
|
},
|
|
762
|
-
/* @__PURE__ */
|
|
763
|
-
)), /* @__PURE__ */
|
|
1096
|
+
/* @__PURE__ */ import_react26.default.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" })
|
|
1097
|
+
)), /* @__PURE__ */ import_react26.default.createElement("h1", { className: "text-xl font-serif md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ import_react26.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description), /* @__PURE__ */ import_react26.default.createElement(
|
|
764
1098
|
import_link7.default,
|
|
765
1099
|
{
|
|
766
1100
|
href: backLinkHref,
|
|
@@ -771,9 +1105,9 @@ var ManagedNotFoundBlock = ({
|
|
|
771
1105
|
};
|
|
772
1106
|
|
|
773
1107
|
// src/components/PageSpinner.tsx
|
|
774
|
-
var
|
|
775
|
-
var
|
|
776
|
-
var
|
|
1108
|
+
var import_react27 = __toESM(require("react"));
|
|
1109
|
+
var import_react28 = require("@hugeicons/react");
|
|
1110
|
+
var import_core_free_icons6 = require("@hugeicons/core-free-icons");
|
|
777
1111
|
var PageSpinner = ({
|
|
778
1112
|
className = "",
|
|
779
1113
|
iconClassName = "text-black",
|
|
@@ -781,10 +1115,10 @@ var PageSpinner = ({
|
|
|
781
1115
|
}) => {
|
|
782
1116
|
return (
|
|
783
1117
|
// z-[100] ensures it sits above absolute headers and modals
|
|
784
|
-
/* @__PURE__ */
|
|
785
|
-
|
|
1118
|
+
/* @__PURE__ */ import_react27.default.createElement("div", { className: `fixed inset-0 z-100 flex flex-col items-center justify-center w-full h-full pointer-events-none ${className}` }, /* @__PURE__ */ import_react27.default.createElement(
|
|
1119
|
+
import_react28.HugeiconsIcon,
|
|
786
1120
|
{
|
|
787
|
-
icon:
|
|
1121
|
+
icon: import_core_free_icons6.Loading03Icon,
|
|
788
1122
|
size,
|
|
789
1123
|
className: `animate-spin mb-4 ${iconClassName}`
|
|
790
1124
|
}
|
|
@@ -793,14 +1127,13 @@ var PageSpinner = ({
|
|
|
793
1127
|
};
|
|
794
1128
|
|
|
795
1129
|
// src/components/ManagedToaster.tsx
|
|
796
|
-
var
|
|
797
|
-
var
|
|
798
|
-
var ManagedToaster = (
|
|
799
|
-
return /* @__PURE__ */
|
|
800
|
-
|
|
1130
|
+
var import_react29 = __toESM(require("react"));
|
|
1131
|
+
var import_react_hot_toast2 = require("react-hot-toast");
|
|
1132
|
+
var ManagedToaster = () => {
|
|
1133
|
+
return /* @__PURE__ */ import_react29.default.createElement(
|
|
1134
|
+
import_react_hot_toast2.Toaster,
|
|
801
1135
|
{
|
|
802
1136
|
position: "top-right",
|
|
803
|
-
...props,
|
|
804
1137
|
toastOptions: {
|
|
805
1138
|
style: {
|
|
806
1139
|
background: "#171717",
|
|
@@ -822,16 +1155,14 @@ var ManagedToaster = (props) => {
|
|
|
822
1155
|
primary: "#fafafa",
|
|
823
1156
|
secondary: "#171717"
|
|
824
1157
|
}
|
|
825
|
-
}
|
|
826
|
-
...props.toastOptions
|
|
827
|
-
// Allows overriding specific toast styles if needed
|
|
1158
|
+
}
|
|
828
1159
|
}
|
|
829
1160
|
}
|
|
830
1161
|
);
|
|
831
1162
|
};
|
|
832
1163
|
|
|
833
1164
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
834
|
-
var
|
|
1165
|
+
var import_react30 = __toESM(require("react"));
|
|
835
1166
|
var import_image6 = __toESM(require("next/image"));
|
|
836
1167
|
var ManagedNewsletterSplitBlock = ({
|
|
837
1168
|
tagline,
|
|
@@ -845,7 +1176,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
845
1176
|
ctaHref = "/contact-us",
|
|
846
1177
|
children
|
|
847
1178
|
}) => {
|
|
848
|
-
return /* @__PURE__ */
|
|
1179
|
+
return /* @__PURE__ */ import_react30.default.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0" }, /* @__PURE__ */ import_react30.default.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ import_react30.default.createElement(
|
|
849
1180
|
import_image6.default,
|
|
850
1181
|
{
|
|
851
1182
|
src: imageSrc,
|
|
@@ -855,7 +1186,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
855
1186
|
className: "object-cover object-top grayscale opacity-60",
|
|
856
1187
|
quality: 100
|
|
857
1188
|
}
|
|
858
|
-
), /* @__PURE__ */
|
|
1189
|
+
), /* @__PURE__ */ import_react30.default.createElement(
|
|
859
1190
|
"div",
|
|
860
1191
|
{
|
|
861
1192
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -863,7 +1194,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
863
1194
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
864
1195
|
}
|
|
865
1196
|
}
|
|
866
|
-
), /* @__PURE__ */
|
|
1197
|
+
), /* @__PURE__ */ import_react30.default.createElement(
|
|
867
1198
|
"div",
|
|
868
1199
|
{
|
|
869
1200
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -871,7 +1202,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
871
1202
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
872
1203
|
}
|
|
873
1204
|
}
|
|
874
|
-
)), /* @__PURE__ */
|
|
1205
|
+
)), /* @__PURE__ */ import_react30.default.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__ */ import_react30.default.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__ */ import_react30.default.createElement(
|
|
875
1206
|
"div",
|
|
876
1207
|
{
|
|
877
1208
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -880,7 +1211,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
880
1211
|
backgroundRepeat: "repeat"
|
|
881
1212
|
}
|
|
882
1213
|
}
|
|
883
|
-
), /* @__PURE__ */
|
|
1214
|
+
), /* @__PURE__ */ import_react30.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react30.default.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react30.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 uppercase" }, tagline), /* @__PURE__ */ import_react30.default.createElement("h1", { className: "text-4xl font-serif md:text-5xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react30.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 uppercase" }, subtitle)), /* @__PURE__ */ import_react30.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react30.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react30.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react30.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react30.default.createElement("div", { className: "grow h-px bg-neutral-200" }), /* @__PURE__ */ import_react30.default.createElement("span", { className: "shrink mx-4 text-[10px] tracking-[0.2em] text-neutral-400 uppercase" }, dividerText), /* @__PURE__ */ import_react30.default.createElement("div", { className: "grow h-px bg-neutral-200" })), ctaText && ctaHref && /* @__PURE__ */ import_react30.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react30.default.createElement(
|
|
884
1215
|
ThreeDButton,
|
|
885
1216
|
{
|
|
886
1217
|
href: ctaHref,
|
|
@@ -891,7 +1222,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
891
1222
|
};
|
|
892
1223
|
|
|
893
1224
|
// src/components/ReusableInputs.tsx
|
|
894
|
-
var
|
|
1225
|
+
var import_react31 = __toESM(require("react"));
|
|
895
1226
|
var TextInput = ({
|
|
896
1227
|
label,
|
|
897
1228
|
value,
|
|
@@ -901,7 +1232,7 @@ var TextInput = ({
|
|
|
901
1232
|
disabled,
|
|
902
1233
|
readOnly,
|
|
903
1234
|
onClick
|
|
904
|
-
}) => /* @__PURE__ */
|
|
1235
|
+
}) => /* @__PURE__ */ import_react31.default.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, /* @__PURE__ */ import_react31.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ import_react31.default.createElement(
|
|
905
1236
|
"input",
|
|
906
1237
|
{
|
|
907
1238
|
type: "text",
|
|
@@ -922,7 +1253,7 @@ var NumberInput = ({
|
|
|
922
1253
|
placeholder,
|
|
923
1254
|
maxLength,
|
|
924
1255
|
disabled
|
|
925
|
-
}) => /* @__PURE__ */
|
|
1256
|
+
}) => /* @__PURE__ */ import_react31.default.createElement("div", { className: "space-y-2 flex-1 w-full" }, /* @__PURE__ */ import_react31.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, label), /* @__PURE__ */ import_react31.default.createElement(
|
|
926
1257
|
"input",
|
|
927
1258
|
{
|
|
928
1259
|
type: "text",
|
|
@@ -940,14 +1271,14 @@ var NumberInput = ({
|
|
|
940
1271
|
));
|
|
941
1272
|
|
|
942
1273
|
// src/components/PortfolioHero.tsx
|
|
943
|
-
var
|
|
1274
|
+
var import_react32 = __toESM(require("react"));
|
|
944
1275
|
var import_link8 = __toESM(require("next/link"));
|
|
945
1276
|
var import_image7 = __toESM(require("next/image"));
|
|
946
|
-
var
|
|
947
|
-
var
|
|
1277
|
+
var import_react33 = require("@hugeicons/react");
|
|
1278
|
+
var import_core_free_icons7 = require("@hugeicons/core-free-icons");
|
|
948
1279
|
var useScrollAnimation = () => {
|
|
949
|
-
const elementRef = (0,
|
|
950
|
-
(0,
|
|
1280
|
+
const elementRef = (0, import_react32.useRef)(null);
|
|
1281
|
+
(0, import_react32.useEffect)(() => {
|
|
951
1282
|
const el = elementRef.current;
|
|
952
1283
|
if (!el) return;
|
|
953
1284
|
const observer = new IntersectionObserver(
|
|
@@ -983,13 +1314,13 @@ var PortfolioHero = ({
|
|
|
983
1314
|
secondaryCtaHref
|
|
984
1315
|
}) => {
|
|
985
1316
|
const heroContentRef = useScrollAnimation();
|
|
986
|
-
return /* @__PURE__ */
|
|
1317
|
+
return /* @__PURE__ */ import_react32.default.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__ */ import_react32.default.createElement(
|
|
987
1318
|
"div",
|
|
988
1319
|
{
|
|
989
1320
|
ref: heroContentRef,
|
|
990
1321
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
991
1322
|
},
|
|
992
|
-
/* @__PURE__ */
|
|
1323
|
+
/* @__PURE__ */ import_react32.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react32.default.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__ */ import_react32.default.createElement(
|
|
993
1324
|
import_image7.default,
|
|
994
1325
|
{
|
|
995
1326
|
src: imageSrc,
|
|
@@ -1000,7 +1331,7 @@ var PortfolioHero = ({
|
|
|
1000
1331
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
1001
1332
|
quality: 100
|
|
1002
1333
|
}
|
|
1003
|
-
)), /* @__PURE__ */
|
|
1334
|
+
)), /* @__PURE__ */ import_react32.default.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ import_react32.default.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__ */ import_react32.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 uppercase" }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ import_react32.default.createElement(
|
|
1004
1335
|
"a",
|
|
1005
1336
|
{
|
|
1006
1337
|
href: socialLinkHref,
|
|
@@ -1010,28 +1341,28 @@ var PortfolioHero = ({
|
|
|
1010
1341
|
},
|
|
1011
1342
|
socialLinkText
|
|
1012
1343
|
))),
|
|
1013
|
-
/* @__PURE__ */
|
|
1014
|
-
/* @__PURE__ */
|
|
1344
|
+
/* @__PURE__ */ import_react32.default.createElement("p", { className: "text-[13px] md:text-[16px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
1345
|
+
/* @__PURE__ */ import_react32.default.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ import_react32.default.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ import_react32.default.createElement(
|
|
1015
1346
|
ThreeDButton,
|
|
1016
1347
|
{
|
|
1017
1348
|
href: primaryCtaHref,
|
|
1018
1349
|
className: "py-3 uppercase tracking-widest text-[11px]"
|
|
1019
1350
|
},
|
|
1020
1351
|
primaryCtaText
|
|
1021
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
1352
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react32.default.createElement(
|
|
1022
1353
|
import_link8.default,
|
|
1023
1354
|
{
|
|
1024
1355
|
href: secondaryCtaHref,
|
|
1025
1356
|
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"
|
|
1026
1357
|
},
|
|
1027
1358
|
secondaryCtaText,
|
|
1028
|
-
/* @__PURE__ */
|
|
1359
|
+
/* @__PURE__ */ import_react32.default.createElement(import_react33.HugeiconsIcon, { icon: import_core_free_icons7.ArrowRight01Icon, size: 16 })
|
|
1029
1360
|
))
|
|
1030
1361
|
));
|
|
1031
1362
|
};
|
|
1032
1363
|
|
|
1033
1364
|
// src/components/ProductHero.tsx
|
|
1034
|
-
var
|
|
1365
|
+
var import_react34 = __toESM(require("react"));
|
|
1035
1366
|
var import_link9 = __toESM(require("next/link"));
|
|
1036
1367
|
var import_image8 = __toESM(require("next/image"));
|
|
1037
1368
|
var ProductHero = ({
|
|
@@ -1045,14 +1376,14 @@ var ProductHero = ({
|
|
|
1045
1376
|
secondaryCtaHref,
|
|
1046
1377
|
images
|
|
1047
1378
|
}) => {
|
|
1048
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
1049
|
-
const nextSlide = (0,
|
|
1379
|
+
const [currentIndex, setCurrentIndex] = (0, import_react34.useState)(0);
|
|
1380
|
+
const nextSlide = (0, import_react34.useCallback)(() => {
|
|
1050
1381
|
setCurrentIndex((prev) => (prev + 1) % images.length);
|
|
1051
1382
|
}, [images.length]);
|
|
1052
|
-
const prevSlide = (0,
|
|
1383
|
+
const prevSlide = (0, import_react34.useCallback)(() => {
|
|
1053
1384
|
setCurrentIndex((prev) => (prev - 1 + images.length) % images.length);
|
|
1054
1385
|
}, [images.length]);
|
|
1055
|
-
(0,
|
|
1386
|
+
(0, import_react34.useEffect)(() => {
|
|
1056
1387
|
const timer = setInterval(() => {
|
|
1057
1388
|
nextSlide();
|
|
1058
1389
|
}, 5e3);
|
|
@@ -1071,12 +1402,12 @@ var ProductHero = ({
|
|
|
1071
1402
|
}
|
|
1072
1403
|
return "opacity-0 z-0 scale-75 pointer-events-none";
|
|
1073
1404
|
};
|
|
1074
|
-
return /* @__PURE__ */
|
|
1405
|
+
return /* @__PURE__ */ import_react34.default.createElement("section", { className: "relative pt-32 sm:pt-40 pb-0 flex flex-col items-center overflow-hidden w-full bg-[#f5f5f5]" }, /* @__PURE__ */ import_react34.default.createElement(
|
|
1075
1406
|
"div",
|
|
1076
1407
|
{
|
|
1077
1408
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 bg-linear-to-b from-white via-white to-[#f5f5f5]"
|
|
1078
1409
|
}
|
|
1079
|
-
), /* @__PURE__ */
|
|
1410
|
+
), /* @__PURE__ */ import_react34.default.createElement(
|
|
1080
1411
|
"div",
|
|
1081
1412
|
{
|
|
1082
1413
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.3] mix-blend-overlay",
|
|
@@ -1084,14 +1415,14 @@ var ProductHero = ({
|
|
|
1084
1415
|
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")`
|
|
1085
1416
|
}
|
|
1086
1417
|
}
|
|
1087
|
-
), /* @__PURE__ */
|
|
1418
|
+
), /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.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__ */ import_react34.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-600 uppercase font-medium" }, badgeText)), /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.createElement("span", { className: "bg-linear-to-r from-[#043324] to-[#21a473] bg-clip-text text-transparent font-serif italic pr-2" }, highlightText)), subtitle && /* @__PURE__ */ import_react34.default.createElement("p", { className: "text-[13px] md:text-[16px] text-neutral-600 max-w-xl mx-auto mb-10 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ import_react34.default.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react34.default.createElement(
|
|
1088
1419
|
import_link9.default,
|
|
1089
1420
|
{
|
|
1090
1421
|
href: secondaryCtaHref,
|
|
1091
1422
|
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"
|
|
1092
1423
|
},
|
|
1093
1424
|
secondaryCtaText
|
|
1094
|
-
)), /* @__PURE__ */
|
|
1425
|
+
)), /* @__PURE__ */ import_react34.default.createElement("div", { className: "relative w-full max-w-4xl mx-auto px-2 sm:px-6 mt-8 z-20" }, /* @__PURE__ */ import_react34.default.createElement("div", { className: "relative w-full aspect-4/3 md:aspect-video flex items-center justify-center" }, /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react34.default.createElement("path", { d: "M15 18l-6-6 6-6" }))), /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react34.default.createElement("path", { d: "M9 18l6-6-6-6" }))), images.map((src, idx) => /* @__PURE__ */ import_react34.default.createElement(
|
|
1095
1426
|
"div",
|
|
1096
1427
|
{
|
|
1097
1428
|
key: idx,
|
|
@@ -1100,7 +1431,7 @@ var ProductHero = ({
|
|
|
1100
1431
|
},
|
|
1101
1432
|
className: `absolute inset-0 transition-all duration-700 ease-out transform ${getCarouselClasses(idx)}`
|
|
1102
1433
|
},
|
|
1103
|
-
/* @__PURE__ */
|
|
1434
|
+
/* @__PURE__ */ import_react34.default.createElement("div", { className: "relative w-full h-full rounded-2xl overflow-hidden shadow-xl" }, /* @__PURE__ */ import_react34.default.createElement(
|
|
1104
1435
|
import_image8.default,
|
|
1105
1436
|
{
|
|
1106
1437
|
src,
|
|
@@ -1111,14 +1442,14 @@ var ProductHero = ({
|
|
|
1111
1442
|
priority: idx === 0
|
|
1112
1443
|
}
|
|
1113
1444
|
))
|
|
1114
|
-
)), /* @__PURE__ */
|
|
1445
|
+
)), /* @__PURE__ */ import_react34.default.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" })))));
|
|
1115
1446
|
};
|
|
1116
1447
|
|
|
1117
1448
|
// src/components/GifFeatureCard.tsx
|
|
1118
|
-
var
|
|
1449
|
+
var import_react35 = __toESM(require("react"));
|
|
1119
1450
|
var import_image9 = __toESM(require("next/image"));
|
|
1120
|
-
var
|
|
1121
|
-
var
|
|
1451
|
+
var import_react36 = require("@hugeicons/react");
|
|
1452
|
+
var import_core_free_icons8 = require("@hugeicons/core-free-icons");
|
|
1122
1453
|
var GifFeatureCard = ({
|
|
1123
1454
|
gifSrc,
|
|
1124
1455
|
title,
|
|
@@ -1126,20 +1457,20 @@ var GifFeatureCard = ({
|
|
|
1126
1457
|
alt = "Feature animation",
|
|
1127
1458
|
className = "aspect-video"
|
|
1128
1459
|
}) => {
|
|
1129
|
-
const [isLoading, setIsLoading] = (0,
|
|
1130
|
-
return /* @__PURE__ */
|
|
1131
|
-
|
|
1460
|
+
const [isLoading, setIsLoading] = (0, import_react35.useState)(true);
|
|
1461
|
+
return /* @__PURE__ */ import_react35.default.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
1462
|
+
import_react36.HugeiconsIcon,
|
|
1132
1463
|
{
|
|
1133
|
-
icon:
|
|
1464
|
+
icon: import_core_free_icons8.Loading03Icon,
|
|
1134
1465
|
size: 32,
|
|
1135
1466
|
className: "animate-spin text-white"
|
|
1136
1467
|
}
|
|
1137
|
-
)), /* @__PURE__ */
|
|
1468
|
+
)), /* @__PURE__ */ import_react35.default.createElement(
|
|
1138
1469
|
"div",
|
|
1139
1470
|
{
|
|
1140
1471
|
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"}`
|
|
1141
1472
|
},
|
|
1142
|
-
/* @__PURE__ */
|
|
1473
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
1143
1474
|
import_image9.default,
|
|
1144
1475
|
{
|
|
1145
1476
|
src: gifSrc,
|
|
@@ -1150,12 +1481,759 @@ var GifFeatureCard = ({
|
|
|
1150
1481
|
className: "object-cover object-center pointer-events-none"
|
|
1151
1482
|
}
|
|
1152
1483
|
)
|
|
1153
|
-
), /* @__PURE__ */
|
|
1484
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
1154
1485
|
"div",
|
|
1155
1486
|
{
|
|
1156
1487
|
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"
|
|
1157
1488
|
}
|
|
1158
|
-
), /* @__PURE__ */
|
|
1489
|
+
), /* @__PURE__ */ import_react35.default.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__ */ import_react35.default.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__ */ import_react35.default.createElement("p", { className: "text-[13px] sm:text-[15px] leading-relaxed text-neutral-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
1490
|
+
};
|
|
1491
|
+
|
|
1492
|
+
// src/components/UniversalSidebar.tsx
|
|
1493
|
+
var import_react37 = __toESM(require("react"));
|
|
1494
|
+
var import_link10 = __toESM(require("next/link"));
|
|
1495
|
+
var import_react38 = require("@hugeicons/react");
|
|
1496
|
+
var import_core_free_icons9 = require("@hugeicons/core-free-icons");
|
|
1497
|
+
var UniversalSidebar = ({
|
|
1498
|
+
navItems,
|
|
1499
|
+
currentPath,
|
|
1500
|
+
isMobileOpen,
|
|
1501
|
+
closeMobile,
|
|
1502
|
+
onNavClick,
|
|
1503
|
+
showInterceptDialog = false,
|
|
1504
|
+
onCancelIntercept,
|
|
1505
|
+
onConfirmIntercept,
|
|
1506
|
+
interceptTitle = "Discard Changes",
|
|
1507
|
+
interceptMessage = "Are you sure you want to leave? All unsaved changes will be lost."
|
|
1508
|
+
}) => {
|
|
1509
|
+
const [isCollapsed, setIsCollapsed] = (0, import_react37.useState)(false);
|
|
1510
|
+
(0, import_react37.useEffect)(() => {
|
|
1511
|
+
if (isMobileOpen) {
|
|
1512
|
+
closeMobile();
|
|
1513
|
+
}
|
|
1514
|
+
}, [currentPath]);
|
|
1515
|
+
return /* @__PURE__ */ import_react37.default.createElement(import_react37.default.Fragment, null, /* @__PURE__ */ import_react37.default.createElement(
|
|
1516
|
+
"div",
|
|
1517
|
+
{
|
|
1518
|
+
className: `fixed inset-0 bg-black/30 shadow-2xl transition-opacity duration-300 md:hidden z-90 ${isMobileOpen ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none"}`,
|
|
1519
|
+
onClick: closeMobile
|
|
1520
|
+
}
|
|
1521
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
1522
|
+
"aside",
|
|
1523
|
+
{
|
|
1524
|
+
className: `
|
|
1525
|
+
fixed md:relative top-0 left-0 h-full bg-white
|
|
1526
|
+
transition-all duration-300 ease-in-out shrink-0 flex flex-col z-100 md:z-10
|
|
1527
|
+
${isMobileOpen ? "translate-x-0" : "-translate-x-full md:translate-x-0"}
|
|
1528
|
+
${isCollapsed ? "md:w-16 w-64" : "w-64"}
|
|
1529
|
+
`
|
|
1530
|
+
},
|
|
1531
|
+
/* @__PURE__ */ import_react37.default.createElement("div", { className: "md:hidden flex justify-end p-4 shrink-0" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
1532
|
+
"button",
|
|
1533
|
+
{
|
|
1534
|
+
onClick: closeMobile,
|
|
1535
|
+
className: "text-neutral-400 hover:text-black transition-colors outline-none",
|
|
1536
|
+
"aria-label": "Close Menu"
|
|
1537
|
+
},
|
|
1538
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons9.Cancel01Icon, size: 24 })
|
|
1539
|
+
)),
|
|
1540
|
+
/* @__PURE__ */ import_react37.default.createElement("nav", { className: "flex-1 py-6 flex flex-col gap-1.5 px-3 overflow-y-auto custom-scrollbar" }, navItems.map((item) => {
|
|
1541
|
+
const isCurrentRoute = item.path === "/mod" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`);
|
|
1542
|
+
return /* @__PURE__ */ import_react37.default.createElement(
|
|
1543
|
+
import_link10.default,
|
|
1544
|
+
{
|
|
1545
|
+
key: item.name,
|
|
1546
|
+
href: item.path,
|
|
1547
|
+
onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
|
|
1548
|
+
className: `flex items-center gap-3 px-3 py-2 rounded-full transition-all outline-none group ${isCurrentRoute ? "bg-neutral-100 text-black " : "text-neutral-500 hover:text-black hover:bg-neutral-50"}`,
|
|
1549
|
+
title: isCollapsed && !isMobileOpen ? item.name : void 0
|
|
1550
|
+
},
|
|
1551
|
+
/* @__PURE__ */ import_react37.default.createElement(
|
|
1552
|
+
import_react38.HugeiconsIcon,
|
|
1553
|
+
{
|
|
1554
|
+
icon: item.icon,
|
|
1555
|
+
size: 18,
|
|
1556
|
+
className: `shrink-0 transition-colors ${isCurrentRoute ? "text-black" : "text-neutral-400 group-hover:text-black"}`
|
|
1557
|
+
}
|
|
1558
|
+
),
|
|
1559
|
+
(!isCollapsed || isMobileOpen) && /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-xs tracking-wide truncate" }, item.name)
|
|
1560
|
+
);
|
|
1561
|
+
})),
|
|
1562
|
+
/* @__PURE__ */ import_react37.default.createElement("div", { className: "p-4 hidden md:block shrink-0" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
1563
|
+
"button",
|
|
1564
|
+
{
|
|
1565
|
+
onClick: () => setIsCollapsed(!isCollapsed),
|
|
1566
|
+
className: "flex items-center justify-center md:justify-start gap-3 w-full p-2.5 rounded-full text-neutral-500 hover:text-black hover:bg-neutral-50 transition-colors outline-none"
|
|
1567
|
+
},
|
|
1568
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons9.SidebarLeft01Icon, size: 18, className: "shrink-0 text-neutral-400" }),
|
|
1569
|
+
!isCollapsed && /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-xs" }, "Collapse")
|
|
1570
|
+
))
|
|
1571
|
+
), showInterceptDialog && /* @__PURE__ */ import_react37.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
1572
|
+
"div",
|
|
1573
|
+
{
|
|
1574
|
+
className: "absolute inset-0 bg-black/30",
|
|
1575
|
+
onClick: onCancelIntercept
|
|
1576
|
+
}
|
|
1577
|
+
), /* @__PURE__ */ import_react37.default.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react37.default.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-1" }, interceptTitle), /* @__PURE__ */ import_react37.default.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, interceptMessage)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
1578
|
+
"button",
|
|
1579
|
+
{
|
|
1580
|
+
onClick: onCancelIntercept,
|
|
1581
|
+
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1582
|
+
},
|
|
1583
|
+
"Cancel"
|
|
1584
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
1585
|
+
"button",
|
|
1586
|
+
{
|
|
1587
|
+
onClick: onConfirmIntercept,
|
|
1588
|
+
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors flex justify-center items-center outline-none"
|
|
1589
|
+
},
|
|
1590
|
+
"Leave"
|
|
1591
|
+
)))));
|
|
1592
|
+
};
|
|
1593
|
+
|
|
1594
|
+
// src/components/UniversalHeader.tsx
|
|
1595
|
+
var import_react39 = __toESM(require("react"));
|
|
1596
|
+
var import_link11 = __toESM(require("next/link"));
|
|
1597
|
+
var import_react40 = require("@hugeicons/react");
|
|
1598
|
+
var import_core_free_icons10 = require("@hugeicons/core-free-icons");
|
|
1599
|
+
var ButtonSpinner = () => /* @__PURE__ */ import_react39.default.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__ */ import_react39.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react39.default.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" }));
|
|
1600
|
+
var UniversalHeader = ({
|
|
1601
|
+
onOpenMobile,
|
|
1602
|
+
title,
|
|
1603
|
+
subtitle,
|
|
1604
|
+
homeUrl = "/app",
|
|
1605
|
+
showBackButton = false,
|
|
1606
|
+
backUrl = "/app",
|
|
1607
|
+
showWorkspaceSwitcher = false,
|
|
1608
|
+
workspaces = [],
|
|
1609
|
+
activeWorkspaceId,
|
|
1610
|
+
onSwitchWorkspace,
|
|
1611
|
+
showLogoutAction = false,
|
|
1612
|
+
onLogout
|
|
1613
|
+
}) => {
|
|
1614
|
+
const [showSwitcherDialog, setShowSwitcherDialog] = (0, import_react39.useState)(false);
|
|
1615
|
+
const [showLogoutDialog, setShowLogoutDialog] = (0, import_react39.useState)(false);
|
|
1616
|
+
const [isLoggingOut, setIsLoggingOut] = (0, import_react39.useState)(false);
|
|
1617
|
+
const handleLogoutInitiation = async () => {
|
|
1618
|
+
if (isLoggingOut || !onLogout) return;
|
|
1619
|
+
setIsLoggingOut(true);
|
|
1620
|
+
try {
|
|
1621
|
+
await onLogout();
|
|
1622
|
+
} catch (error) {
|
|
1623
|
+
setIsLoggingOut(false);
|
|
1624
|
+
setShowLogoutDialog(false);
|
|
1625
|
+
}
|
|
1626
|
+
};
|
|
1627
|
+
return /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full shrink-0 z-50 flex flex-col relative pointer-events-none" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full pointer-events-auto relative z-20" }, /* @__PURE__ */ import_react39.default.createElement("header", { className: "w-full bg-white pt-6 pb-3" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "max-w-7xl mx-auto px-6 flex justify-between items-center" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
1628
|
+
"button",
|
|
1629
|
+
{
|
|
1630
|
+
className: "md:hidden text-neutral-500 hover:text-black transition-colors outline-none",
|
|
1631
|
+
onClick: onOpenMobile,
|
|
1632
|
+
"aria-label": "Open Menu"
|
|
1633
|
+
},
|
|
1634
|
+
/* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.SidebarLeft01Icon, size: 24 })
|
|
1635
|
+
), /* @__PURE__ */ import_react39.default.createElement(import_link11.default, { href: homeUrl, className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[13px] text-black leading-none truncate tracking-wide mb-1" }, title), subtitle && /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[9px] text-neutral-500 truncate tracking-[0.2em] leading-none" }, subtitle)))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center gap-3" }, showWorkspaceSwitcher && workspaces.length > 0 && /* @__PURE__ */ import_react39.default.createElement(
|
|
1636
|
+
"button",
|
|
1637
|
+
{
|
|
1638
|
+
onClick: () => setShowSwitcherDialog(true),
|
|
1639
|
+
className: "w-10 h-10 rounded-full border border-neutral-200 bg-white flex items-center justify-center text-neutral-500 hover:text-black hover:border-black hover:bg-neutral-50 transition-all group outline-none",
|
|
1640
|
+
"aria-label": "Switch Workspace"
|
|
1641
|
+
},
|
|
1642
|
+
/* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.ArrowDataTransferHorizontalIcon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1643
|
+
), showLogoutAction && /* @__PURE__ */ import_react39.default.createElement(
|
|
1644
|
+
"button",
|
|
1645
|
+
{
|
|
1646
|
+
onClick: () => setShowLogoutDialog(true),
|
|
1647
|
+
className: "w-10 h-10 rounded-full border border-neutral-200 bg-white flex items-center justify-center text-neutral-500 hover:text-black hover:border-black hover:bg-neutral-50 transition-all group outline-none",
|
|
1648
|
+
"aria-label": "Secure Logout"
|
|
1649
|
+
},
|
|
1650
|
+
/* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.LogoutCircle02Icon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1651
|
+
), showBackButton && /* @__PURE__ */ import_react39.default.createElement(
|
|
1652
|
+
import_link11.default,
|
|
1653
|
+
{
|
|
1654
|
+
href: backUrl,
|
|
1655
|
+
className: "flex items-center justify-center w-10 h-10 border border-neutral-200 bg-white rounded-full text-neutral-500 hover:text-black hover:border-black hover:bg-neutral-50 transition-all group outline-none",
|
|
1656
|
+
"aria-label": "Go Back"
|
|
1657
|
+
},
|
|
1658
|
+
/* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.ArrowLeft01Icon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1659
|
+
))))), showSwitcherDialog && showWorkspaceSwitcher && workspaces.length > 0 && /* @__PURE__ */ import_react39.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
1660
|
+
"div",
|
|
1661
|
+
{
|
|
1662
|
+
className: "absolute inset-0 bg-black/30",
|
|
1663
|
+
onClick: () => setShowSwitcherDialog(false)
|
|
1664
|
+
}
|
|
1665
|
+
), /* @__PURE__ */ import_react39.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "p-5 text-center w-full" }, /* @__PURE__ */ import_react39.default.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-1" }, "Switch Workspace"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[11px] text-neutral-500 leading-snug" }, "Select an organization to switch your current context.")), /* @__PURE__ */ import_react39.default.createElement("div", { className: "max-h-75 overflow-y-auto w-full custom-scrollbar" }, workspaces.map((org) => /* @__PURE__ */ import_react39.default.createElement(
|
|
1666
|
+
"button",
|
|
1667
|
+
{
|
|
1668
|
+
key: org.id,
|
|
1669
|
+
onClick: () => {
|
|
1670
|
+
if (onSwitchWorkspace) onSwitchWorkspace(org.id);
|
|
1671
|
+
setShowSwitcherDialog(false);
|
|
1672
|
+
},
|
|
1673
|
+
className: "w-full text-left px-5 py-4 flex items-center justify-between hover:bg-neutral-50 transition-colors group outline-none last:border-0"
|
|
1674
|
+
},
|
|
1675
|
+
/* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col truncate pr-4" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: `text-[13px] truncate ${activeWorkspaceId === org.id ? "text-black" : "text-neutral-600 group-hover:text-black"}` }, org.name), /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[9px] text-neutral-400 tracking-[0.2em] mt-1" }, "Role: ", org.role)),
|
|
1676
|
+
activeWorkspaceId === org.id && /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.CheckmarkCircle01Icon, size: 18, className: "text-black shrink-0" })
|
|
1677
|
+
))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full flex mt-auto" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
1678
|
+
"button",
|
|
1679
|
+
{
|
|
1680
|
+
onClick: () => setShowSwitcherDialog(false),
|
|
1681
|
+
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1682
|
+
},
|
|
1683
|
+
"Cancel"
|
|
1684
|
+
)))), showLogoutDialog && showLogoutAction && /* @__PURE__ */ import_react39.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
1685
|
+
"div",
|
|
1686
|
+
{
|
|
1687
|
+
className: "absolute inset-0 bg-black/30",
|
|
1688
|
+
onClick: () => !isLoggingOut && setShowLogoutDialog(false)
|
|
1689
|
+
}
|
|
1690
|
+
), /* @__PURE__ */ import_react39.default.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react39.default.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-1" }, "Secure Logout"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, "Are you sure you want to log out? You will need to authenticate to return.")), /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
1691
|
+
"button",
|
|
1692
|
+
{
|
|
1693
|
+
onClick: () => setShowLogoutDialog(false),
|
|
1694
|
+
disabled: isLoggingOut,
|
|
1695
|
+
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1696
|
+
},
|
|
1697
|
+
"Cancel"
|
|
1698
|
+
), /* @__PURE__ */ import_react39.default.createElement(
|
|
1699
|
+
"button",
|
|
1700
|
+
{
|
|
1701
|
+
onClick: handleLogoutInitiation,
|
|
1702
|
+
disabled: isLoggingOut,
|
|
1703
|
+
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
|
|
1704
|
+
},
|
|
1705
|
+
isLoggingOut ? /* @__PURE__ */ import_react39.default.createElement(ButtonSpinner, null) : "Log Out"
|
|
1706
|
+
)))));
|
|
1707
|
+
};
|
|
1708
|
+
|
|
1709
|
+
// src/components/UniversalOrganizationPage.tsx
|
|
1710
|
+
var import_react41 = __toESM(require("react"));
|
|
1711
|
+
var import_react_hot_toast3 = __toESM(require("react-hot-toast"));
|
|
1712
|
+
var InputSpinner2 = () => /* @__PURE__ */ import_react41.default.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__ */ import_react41.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react41.default.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" }));
|
|
1713
|
+
var UniversalOrganizationPage = ({
|
|
1714
|
+
initialOrgName,
|
|
1715
|
+
initialSlug,
|
|
1716
|
+
orgId,
|
|
1717
|
+
isReadOnly = false,
|
|
1718
|
+
slugPrefixUrl = "ecosystem.com/org/",
|
|
1719
|
+
onSaveConfiguration,
|
|
1720
|
+
onCheckSlugAvailability
|
|
1721
|
+
}) => {
|
|
1722
|
+
const [orgName, setOrgName] = (0, import_react41.useState)(initialOrgName);
|
|
1723
|
+
const [slug, setSlug] = (0, import_react41.useState)(initialSlug);
|
|
1724
|
+
const [isCheckingSlug, setIsCheckingSlug] = (0, import_react41.useState)(false);
|
|
1725
|
+
const [slugAvailable, setSlugAvailable] = (0, import_react41.useState)(null);
|
|
1726
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react41.useState)(false);
|
|
1727
|
+
(0, import_react41.useEffect)(() => {
|
|
1728
|
+
setOrgName(initialOrgName || "");
|
|
1729
|
+
setSlug(initialSlug || "");
|
|
1730
|
+
}, [initialOrgName, initialSlug]);
|
|
1731
|
+
const handleOrgNameChange = (val) => {
|
|
1732
|
+
setOrgName(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
|
|
1733
|
+
};
|
|
1734
|
+
const handleSlugChange = (val) => {
|
|
1735
|
+
setSlug(val.toLowerCase().replace(/[^a-z0-9-]/g, "").replace(/-+/g, "-").substring(0, 50));
|
|
1736
|
+
};
|
|
1737
|
+
(0, import_react41.useEffect)(() => {
|
|
1738
|
+
if (!slug || slug === initialSlug) {
|
|
1739
|
+
setSlugAvailable(null);
|
|
1740
|
+
setIsCheckingSlug(false);
|
|
1741
|
+
return;
|
|
1742
|
+
}
|
|
1743
|
+
if (slug.length < 3) {
|
|
1744
|
+
setSlugAvailable(false);
|
|
1745
|
+
setIsCheckingSlug(false);
|
|
1746
|
+
return;
|
|
1747
|
+
}
|
|
1748
|
+
setIsCheckingSlug(true);
|
|
1749
|
+
setSlugAvailable(null);
|
|
1750
|
+
const checkTimer = setTimeout(async () => {
|
|
1751
|
+
try {
|
|
1752
|
+
const res = await onCheckSlugAvailability(slug);
|
|
1753
|
+
setSlugAvailable(res.available);
|
|
1754
|
+
} catch (error) {
|
|
1755
|
+
setSlugAvailable(null);
|
|
1756
|
+
} finally {
|
|
1757
|
+
setIsCheckingSlug(false);
|
|
1758
|
+
}
|
|
1759
|
+
}, 1500);
|
|
1760
|
+
return () => clearTimeout(checkTimer);
|
|
1761
|
+
}, [slug, initialSlug, onCheckSlugAvailability]);
|
|
1762
|
+
const handleSave = async (e) => {
|
|
1763
|
+
e.preventDefault();
|
|
1764
|
+
if (isSubmitting || isCheckingSlug || isReadOnly) return;
|
|
1765
|
+
if (slug !== initialSlug && slugAvailable === false) {
|
|
1766
|
+
import_react_hot_toast3.default.error("Please select an available workspace URL.");
|
|
1767
|
+
return;
|
|
1768
|
+
}
|
|
1769
|
+
setIsSubmitting(true);
|
|
1770
|
+
try {
|
|
1771
|
+
const payload = {
|
|
1772
|
+
organizationId: orgId,
|
|
1773
|
+
organizationName: orgName !== initialOrgName ? orgName : void 0,
|
|
1774
|
+
slug: slug !== initialSlug ? slug : void 0
|
|
1775
|
+
};
|
|
1776
|
+
const responseData = await onSaveConfiguration(payload);
|
|
1777
|
+
if (responseData.success) {
|
|
1778
|
+
import_react_hot_toast3.default.success("Organization updated successfully.");
|
|
1779
|
+
setTimeout(() => window.location.reload(), 1e3);
|
|
1780
|
+
} else {
|
|
1781
|
+
import_react_hot_toast3.default.error(responseData.error || "Failed to update organization.");
|
|
1782
|
+
setIsSubmitting(false);
|
|
1783
|
+
}
|
|
1784
|
+
} catch (error) {
|
|
1785
|
+
import_react_hot_toast3.default.error("Service unavailable. Try again later.");
|
|
1786
|
+
setIsSubmitting(false);
|
|
1787
|
+
}
|
|
1788
|
+
};
|
|
1789
|
+
const hasChanges = orgName !== initialOrgName || slug !== initialSlug;
|
|
1790
|
+
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || orgName.length < 3 || slug.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
1791
|
+
return /* @__PURE__ */ import_react41.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl rounded-2xl p-6 bg-white fade-in duration-300 min-h-full" }, /* @__PURE__ */ import_react41.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react41.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react41.default.createElement("div", null, /* @__PURE__ */ import_react41.default.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, "Organization"), /* @__PURE__ */ import_react41.default.createElement("p", { className: "text-xs text-neutral-500" }, "Manage your tenant workspace details and identity.")), isReadOnly && /* @__PURE__ */ import_react41.default.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0" }, "Read Only Access")), /* @__PURE__ */ import_react41.default.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ import_react41.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react41.default.createElement(
|
|
1792
|
+
TextInput,
|
|
1793
|
+
{
|
|
1794
|
+
label: "Organization Name",
|
|
1795
|
+
value: orgName,
|
|
1796
|
+
onChange: handleOrgNameChange,
|
|
1797
|
+
disabled: isReadOnly || isSubmitting,
|
|
1798
|
+
placeholder: "Acme Corporation",
|
|
1799
|
+
maxLength: 50
|
|
1800
|
+
}
|
|
1801
|
+
), /* @__PURE__ */ import_react41.default.createElement("div", { className: "space-y-2 relative w-full" }, /* @__PURE__ */ import_react41.default.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Organization Slug"), /* @__PURE__ */ import_react41.default.createElement("div", { className: "flex items-center relative w-full" }, /* @__PURE__ */ import_react41.default.createElement("span", { className: "text-neutral-400 text-sm py-3 pr-2 border-b border-neutral-200 shrink-0" }, slugPrefixUrl), /* @__PURE__ */ import_react41.default.createElement(
|
|
1802
|
+
"input",
|
|
1803
|
+
{
|
|
1804
|
+
type: "text",
|
|
1805
|
+
value: slug,
|
|
1806
|
+
disabled: isReadOnly || isSubmitting,
|
|
1807
|
+
onChange: (e) => handleSlugChange(e.target.value),
|
|
1808
|
+
spellCheck: "false",
|
|
1809
|
+
autoComplete: "off",
|
|
1810
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black pr-8 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1811
|
+
placeholder: "acme-corp"
|
|
1812
|
+
}
|
|
1813
|
+
), /* @__PURE__ */ import_react41.default.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ import_react41.default.createElement(InputSpinner2, null), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === false && /* @__PURE__ */ import_react41.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ import_react41.default.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react41.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === true && /* @__PURE__ */ import_react41.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ import_react41.default.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react41.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ import_react41.default.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ import_react41.default.createElement(
|
|
1814
|
+
ThreeDActionButton,
|
|
1815
|
+
{
|
|
1816
|
+
type: "submit",
|
|
1817
|
+
disabled: isSaveDisabled,
|
|
1818
|
+
isLoading: isSubmitting,
|
|
1819
|
+
className: "min-w-32"
|
|
1820
|
+
},
|
|
1821
|
+
"Save Changes"
|
|
1822
|
+
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ import_react41.default.createElement(
|
|
1823
|
+
"button",
|
|
1824
|
+
{
|
|
1825
|
+
type: "button",
|
|
1826
|
+
onClick: () => {
|
|
1827
|
+
setOrgName(initialOrgName);
|
|
1828
|
+
setSlug(initialSlug);
|
|
1829
|
+
},
|
|
1830
|
+
className: "text-[11px] tracking-widest text-neutral-500 hover:text-black transition-colors outline-none"
|
|
1831
|
+
},
|
|
1832
|
+
"Cancel"
|
|
1833
|
+
)))));
|
|
1834
|
+
};
|
|
1835
|
+
|
|
1836
|
+
// src/components/UniversalIdentityPage.tsx
|
|
1837
|
+
var import_react42 = __toESM(require("react"));
|
|
1838
|
+
var import_react_hot_toast4 = __toESM(require("react-hot-toast"));
|
|
1839
|
+
var ButtonSpinner2 = () => /* @__PURE__ */ import_react42.default.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__ */ import_react42.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react42.default.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" }));
|
|
1840
|
+
var UniversalIdentityPage = ({
|
|
1841
|
+
headerTitle,
|
|
1842
|
+
headerDescription,
|
|
1843
|
+
primaryInputLabel,
|
|
1844
|
+
secondaryInputLabel,
|
|
1845
|
+
initialPrimaryValue,
|
|
1846
|
+
initialSecondaryValue = "",
|
|
1847
|
+
resourceId,
|
|
1848
|
+
isReadOnly = false,
|
|
1849
|
+
allowDeletion = false,
|
|
1850
|
+
deleteWarningText = "This action will permanently delete all records and data for this entity.",
|
|
1851
|
+
onSaveIdentity,
|
|
1852
|
+
onDeleteResource,
|
|
1853
|
+
onSuccessfulDeleteRedirect = "/app"
|
|
1854
|
+
}) => {
|
|
1855
|
+
const [primaryValue, setPrimaryValue] = (0, import_react42.useState)(initialPrimaryValue);
|
|
1856
|
+
const [secondaryValue, setSecondaryValue] = (0, import_react42.useState)(initialSecondaryValue);
|
|
1857
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react42.useState)(false);
|
|
1858
|
+
const [isDeleteModalOpen, setIsDeleteModalOpen] = (0, import_react42.useState)(false);
|
|
1859
|
+
const [isDeleting, setIsDeleting] = (0, import_react42.useState)(false);
|
|
1860
|
+
(0, import_react42.useEffect)(() => {
|
|
1861
|
+
setPrimaryValue(initialPrimaryValue || "");
|
|
1862
|
+
setSecondaryValue(initialSecondaryValue || "");
|
|
1863
|
+
}, [initialPrimaryValue, initialSecondaryValue]);
|
|
1864
|
+
const handlePrimaryChange = (val) => {
|
|
1865
|
+
setPrimaryValue(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
|
|
1866
|
+
};
|
|
1867
|
+
const handleSecondaryChange = (val) => {
|
|
1868
|
+
setSecondaryValue(val.replace(/[^a-zA-Z0-9\s.,!-]/g, "").substring(0, 150));
|
|
1869
|
+
};
|
|
1870
|
+
const handleSave = async (e) => {
|
|
1871
|
+
e.preventDefault();
|
|
1872
|
+
if (isSubmitting || isReadOnly) return;
|
|
1873
|
+
setIsSubmitting(true);
|
|
1874
|
+
try {
|
|
1875
|
+
const res = await onSaveIdentity({
|
|
1876
|
+
resourceId,
|
|
1877
|
+
primaryValue: primaryValue !== initialPrimaryValue ? primaryValue : void 0,
|
|
1878
|
+
secondaryValue: secondaryValue !== initialSecondaryValue ? secondaryValue : void 0
|
|
1879
|
+
});
|
|
1880
|
+
if (res.success) {
|
|
1881
|
+
import_react_hot_toast4.default.success("Update successful.");
|
|
1882
|
+
} else {
|
|
1883
|
+
import_react_hot_toast4.default.error(res.error || "Update failed.");
|
|
1884
|
+
}
|
|
1885
|
+
} catch (error) {
|
|
1886
|
+
import_react_hot_toast4.default.error("Service unavailable.");
|
|
1887
|
+
} finally {
|
|
1888
|
+
setIsSubmitting(false);
|
|
1889
|
+
}
|
|
1890
|
+
};
|
|
1891
|
+
const handleDelete = async () => {
|
|
1892
|
+
if (isDeleting || isReadOnly || !onDeleteResource) return;
|
|
1893
|
+
setIsDeleting(true);
|
|
1894
|
+
try {
|
|
1895
|
+
const res = await onDeleteResource(resourceId);
|
|
1896
|
+
if (res.success) {
|
|
1897
|
+
import_react_hot_toast4.default.success("Deletion permanent.");
|
|
1898
|
+
setIsDeleteModalOpen(false);
|
|
1899
|
+
window.location.href = onSuccessfulDeleteRedirect;
|
|
1900
|
+
} else {
|
|
1901
|
+
import_react_hot_toast4.default.error(res.error || "Failed to delete.");
|
|
1902
|
+
setIsDeleting(false);
|
|
1903
|
+
}
|
|
1904
|
+
} catch (error) {
|
|
1905
|
+
import_react_hot_toast4.default.error("Network error occurred.");
|
|
1906
|
+
setIsDeleting(false);
|
|
1907
|
+
}
|
|
1908
|
+
};
|
|
1909
|
+
const hasChanges = primaryValue !== initialPrimaryValue || secondaryValue !== initialSecondaryValue;
|
|
1910
|
+
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || primaryValue.trim().length < 3;
|
|
1911
|
+
return /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl rounded-2xl p-6 bg-white fade-in duration-300 min-h-full" }, /* @__PURE__ */ import_react42.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react42.default.createElement("div", null, /* @__PURE__ */ import_react42.default.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), isReadOnly && /* @__PURE__ */ import_react42.default.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0" }, "Read Only Access")), /* @__PURE__ */ import_react42.default.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ import_react42.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react42.default.createElement(
|
|
1912
|
+
TextInput,
|
|
1913
|
+
{
|
|
1914
|
+
label: primaryInputLabel,
|
|
1915
|
+
value: primaryValue,
|
|
1916
|
+
onChange: handlePrimaryChange,
|
|
1917
|
+
disabled: isReadOnly || isSubmitting,
|
|
1918
|
+
maxLength: 50
|
|
1919
|
+
}
|
|
1920
|
+
), secondaryInputLabel && /* @__PURE__ */ import_react42.default.createElement(
|
|
1921
|
+
TextInput,
|
|
1922
|
+
{
|
|
1923
|
+
label: secondaryInputLabel,
|
|
1924
|
+
value: secondaryValue,
|
|
1925
|
+
onChange: handleSecondaryChange,
|
|
1926
|
+
disabled: isReadOnly || isSubmitting,
|
|
1927
|
+
maxLength: 150
|
|
1928
|
+
}
|
|
1929
|
+
), !isReadOnly && /* @__PURE__ */ import_react42.default.createElement("div", { className: "pt-8 mt-2 flex flex-col sm:flex-row sm:items-center justify-between gap-6" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex items-center gap-4 w-full sm:w-auto" }, /* @__PURE__ */ import_react42.default.createElement(
|
|
1930
|
+
ThreeDActionButton,
|
|
1931
|
+
{
|
|
1932
|
+
type: "submit",
|
|
1933
|
+
disabled: isSaveDisabled,
|
|
1934
|
+
isLoading: isSubmitting,
|
|
1935
|
+
className: "min-w-32 w-full sm:w-auto"
|
|
1936
|
+
},
|
|
1937
|
+
"Save Changes"
|
|
1938
|
+
), hasChanges && !isSubmitting && /* @__PURE__ */ import_react42.default.createElement(
|
|
1939
|
+
"button",
|
|
1940
|
+
{
|
|
1941
|
+
type: "button",
|
|
1942
|
+
onClick: () => {
|
|
1943
|
+
setPrimaryValue(initialPrimaryValue);
|
|
1944
|
+
setSecondaryValue(initialSecondaryValue);
|
|
1945
|
+
},
|
|
1946
|
+
className: "text-[11px] tracking-widest text-neutral-500 hover:text-black transition-colors w-full sm:w-auto py-2 sm:py-0 outline-none"
|
|
1947
|
+
},
|
|
1948
|
+
"Cancel"
|
|
1949
|
+
)), allowDeletion && /* @__PURE__ */ import_react42.default.createElement(
|
|
1950
|
+
"button",
|
|
1951
|
+
{
|
|
1952
|
+
type: "button",
|
|
1953
|
+
onClick: () => setIsDeleteModalOpen(true),
|
|
1954
|
+
className: "px-6 py-2 text-[11px] tracking-widest text-red-400 border border-red-200 hover:border-red-400 rounded-full transition-all w-full sm:w-auto outline-none"
|
|
1955
|
+
},
|
|
1956
|
+
"Delete ",
|
|
1957
|
+
headerTitle.split(" ")[0]
|
|
1958
|
+
)))), isDeleteModalOpen && !isReadOnly && allowDeletion && /* @__PURE__ */ import_react42.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "absolute inset-0 bg-black/30 shadow-2xl", onClick: () => !isDeleting && setIsDeleteModalOpen(false) }), /* @__PURE__ */ import_react42.default.createElement("div", { className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react42.default.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-1" }, "Confirm Deletion"), /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, deleteWarningText)), /* @__PURE__ */ import_react42.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react42.default.createElement(
|
|
1959
|
+
"button",
|
|
1960
|
+
{
|
|
1961
|
+
type: "button",
|
|
1962
|
+
onClick: () => setIsDeleteModalOpen(false),
|
|
1963
|
+
disabled: isDeleting,
|
|
1964
|
+
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1965
|
+
},
|
|
1966
|
+
"Cancel"
|
|
1967
|
+
), /* @__PURE__ */ import_react42.default.createElement(
|
|
1968
|
+
"button",
|
|
1969
|
+
{
|
|
1970
|
+
type: "button",
|
|
1971
|
+
onClick: handleDelete,
|
|
1972
|
+
disabled: isDeleting,
|
|
1973
|
+
className: "flex-1 py-2 text-[13px] text-red-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
|
|
1974
|
+
},
|
|
1975
|
+
isDeleting ? /* @__PURE__ */ import_react42.default.createElement(ButtonSpinner2, null) : "Delete"
|
|
1976
|
+
)))));
|
|
1977
|
+
};
|
|
1978
|
+
|
|
1979
|
+
// src/components/UniversalMembersPage.tsx
|
|
1980
|
+
var import_react43 = __toESM(require("react"));
|
|
1981
|
+
var import_react_hot_toast5 = __toESM(require("react-hot-toast"));
|
|
1982
|
+
var import_react44 = require("@hugeicons/react");
|
|
1983
|
+
var import_core_free_icons11 = require("@hugeicons/core-free-icons");
|
|
1984
|
+
var ButtonSpinner3 = () => /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.Loading03Icon, size: 16, className: "animate-spin text-white" });
|
|
1985
|
+
var PageSpinner2 = () => /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1986
|
+
var getInitials = (name) => {
|
|
1987
|
+
if (!name) return "U";
|
|
1988
|
+
const parts = name.trim().split(" ");
|
|
1989
|
+
if (parts.length >= 2) return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
|
|
1990
|
+
return parts[0].substring(0, 2).toUpperCase();
|
|
1991
|
+
};
|
|
1992
|
+
var resolveThemeColor = (colorCode) => {
|
|
1993
|
+
switch (colorCode) {
|
|
1994
|
+
case "COLOR_A":
|
|
1995
|
+
return "bg-blue-100 border-blue-200";
|
|
1996
|
+
case "COLOR_B":
|
|
1997
|
+
return "bg-emerald-100 border-emerald-200";
|
|
1998
|
+
case "COLOR_C":
|
|
1999
|
+
return "bg-rose-100 border-rose-200";
|
|
2000
|
+
case "COLOR_D":
|
|
2001
|
+
return "bg-amber-100 border-amber-200";
|
|
2002
|
+
case "COLOR_E":
|
|
2003
|
+
return "bg-purple-100 border-purple-200";
|
|
2004
|
+
case "COLOR_F":
|
|
2005
|
+
return "bg-pink-100 border-pink-200";
|
|
2006
|
+
default:
|
|
2007
|
+
return "bg-neutral-100 border-neutral-200";
|
|
2008
|
+
}
|
|
2009
|
+
};
|
|
2010
|
+
var cleanName = (val) => val.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50);
|
|
2011
|
+
var UniversalMembersPage = ({
|
|
2012
|
+
headerTitle,
|
|
2013
|
+
headerDescription,
|
|
2014
|
+
currentUserId,
|
|
2015
|
+
members,
|
|
2016
|
+
isLoading,
|
|
2017
|
+
currentPage,
|
|
2018
|
+
totalPages,
|
|
2019
|
+
onPageChange,
|
|
2020
|
+
canManage,
|
|
2021
|
+
canChangeRoles,
|
|
2022
|
+
availableRoles,
|
|
2023
|
+
requireNamesForInvite,
|
|
2024
|
+
onInviteMember,
|
|
2025
|
+
onRemoveMember,
|
|
2026
|
+
onUpdateRole
|
|
2027
|
+
}) => {
|
|
2028
|
+
const [currentView, setCurrentView] = (0, import_react43.useState)("list");
|
|
2029
|
+
const [selectedMember, setSelectedMember] = (0, import_react43.useState)(null);
|
|
2030
|
+
const [inviteEmail, setInviteEmail] = (0, import_react43.useState)("");
|
|
2031
|
+
const [inviteFirst, setInviteFirst] = (0, import_react43.useState)("");
|
|
2032
|
+
const [inviteLast, setInviteLast] = (0, import_react43.useState)("");
|
|
2033
|
+
const [isInviting, setIsInviting] = (0, import_react43.useState)(false);
|
|
2034
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = (0, import_react43.useState)(false);
|
|
2035
|
+
const [isUpdatingRole, setIsUpdatingRole] = (0, import_react43.useState)(false);
|
|
2036
|
+
const [memberToDelete, setMemberToDelete] = (0, import_react43.useState)(null);
|
|
2037
|
+
const [isDeleting, setIsDeleting] = (0, import_react43.useState)(false);
|
|
2038
|
+
const dropdownRef = (0, import_react43.useRef)(null);
|
|
2039
|
+
(0, import_react43.useEffect)(() => {
|
|
2040
|
+
function handleClickOutside(event) {
|
|
2041
|
+
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
2042
|
+
setIsRoleModalOpen(false);
|
|
2043
|
+
}
|
|
2044
|
+
}
|
|
2045
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
2046
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
2047
|
+
}, []);
|
|
2048
|
+
const handleInvite = async (e) => {
|
|
2049
|
+
e.preventDefault();
|
|
2050
|
+
if (isInviting || !canManage) return;
|
|
2051
|
+
setIsInviting(true);
|
|
2052
|
+
try {
|
|
2053
|
+
const res = await onInviteMember(inviteEmail, inviteFirst, inviteLast);
|
|
2054
|
+
if (res.success) {
|
|
2055
|
+
import_react_hot_toast5.default.success("Member added successfully.");
|
|
2056
|
+
setInviteEmail("");
|
|
2057
|
+
setInviteFirst("");
|
|
2058
|
+
setInviteLast("");
|
|
2059
|
+
setCurrentView("list");
|
|
2060
|
+
} else {
|
|
2061
|
+
import_react_hot_toast5.default.error(res.error || "Failed to add member.");
|
|
2062
|
+
}
|
|
2063
|
+
} catch (error) {
|
|
2064
|
+
import_react_hot_toast5.default.error("Service unavailable.");
|
|
2065
|
+
} finally {
|
|
2066
|
+
setIsInviting(false);
|
|
2067
|
+
}
|
|
2068
|
+
};
|
|
2069
|
+
const handleDelete = async () => {
|
|
2070
|
+
if (!memberToDelete || isDeleting || !canManage) return;
|
|
2071
|
+
setIsDeleting(true);
|
|
2072
|
+
try {
|
|
2073
|
+
const res = await onRemoveMember(memberToDelete);
|
|
2074
|
+
if (res.success) {
|
|
2075
|
+
import_react_hot_toast5.default.success("Member removed successfully.");
|
|
2076
|
+
setMemberToDelete(null);
|
|
2077
|
+
setCurrentView("list");
|
|
2078
|
+
} else {
|
|
2079
|
+
import_react_hot_toast5.default.error(res.error || "Failed to remove member.");
|
|
2080
|
+
}
|
|
2081
|
+
} catch (error) {
|
|
2082
|
+
import_react_hot_toast5.default.error("Service unavailable.");
|
|
2083
|
+
} finally {
|
|
2084
|
+
setIsDeleting(false);
|
|
2085
|
+
}
|
|
2086
|
+
};
|
|
2087
|
+
const handleRoleUpdate = async (newRole) => {
|
|
2088
|
+
if (!selectedMember || isUpdatingRole || selectedMember.role === newRole || !canChangeRoles) {
|
|
2089
|
+
setIsRoleModalOpen(false);
|
|
2090
|
+
return;
|
|
2091
|
+
}
|
|
2092
|
+
setIsRoleModalOpen(false);
|
|
2093
|
+
setIsUpdatingRole(true);
|
|
2094
|
+
try {
|
|
2095
|
+
const res = await onUpdateRole(selectedMember, newRole);
|
|
2096
|
+
if (res.success) {
|
|
2097
|
+
import_react_hot_toast5.default.success("Role updated successfully.");
|
|
2098
|
+
setSelectedMember({ ...selectedMember, role: newRole });
|
|
2099
|
+
} else {
|
|
2100
|
+
import_react_hot_toast5.default.error(res.error || "Failed to update role.");
|
|
2101
|
+
}
|
|
2102
|
+
} catch (error) {
|
|
2103
|
+
import_react_hot_toast5.default.error("Service unavailable.");
|
|
2104
|
+
} finally {
|
|
2105
|
+
setIsUpdatingRole(false);
|
|
2106
|
+
}
|
|
2107
|
+
};
|
|
2108
|
+
const goBack = () => {
|
|
2109
|
+
setCurrentView("list");
|
|
2110
|
+
setSelectedMember(null);
|
|
2111
|
+
setIsRoleModalOpen(false);
|
|
2112
|
+
};
|
|
2113
|
+
return /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white min-h-full" }, /* @__PURE__ */ import_react43.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" && /* @__PURE__ */ import_react43.default.createElement(import_react43.default.Fragment, null, /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), canManage && /* @__PURE__ */ import_react43.default.createElement(
|
|
2114
|
+
ThreeDActionButton,
|
|
2115
|
+
{
|
|
2116
|
+
onClick: () => setCurrentView("invite"),
|
|
2117
|
+
className: "w-fit shrink-0 gap-2"
|
|
2118
|
+
},
|
|
2119
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.UserAdd01Icon, size: 12 }),
|
|
2120
|
+
"Add Member"
|
|
2121
|
+
)), currentView !== "list" && /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ import_react43.default.createElement("button", { onClick: goBack, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.ArrowLeft01Icon, size: 12 }), " Back"), /* @__PURE__ */ import_react43.default.createElement("h1", { className: "text-lg text-black tracking-tight" }, currentView === "invite" ? "Add New Member" : "Member Profile"))), currentView === "list" && /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react43.default.createElement(PageSpinner2, null) : /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "divide-y divide-neutral-100" }, members.map((member) => /* @__PURE__ */ import_react43.default.createElement(
|
|
2122
|
+
"div",
|
|
2123
|
+
{
|
|
2124
|
+
key: member.id,
|
|
2125
|
+
onClick: () => {
|
|
2126
|
+
setSelectedMember(member);
|
|
2127
|
+
setCurrentView("details");
|
|
2128
|
+
},
|
|
2129
|
+
className: "flex items-center justify-between p-4 sm:p-5 hover:bg-neutral-50/50 transition-colors cursor-pointer group min-w-0"
|
|
2130
|
+
},
|
|
2131
|
+
/* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-3 sm:gap-4 min-w-0 flex-1" }, member.displayImage && member.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2132
|
+
"img",
|
|
2133
|
+
{
|
|
2134
|
+
src: member.displayImage,
|
|
2135
|
+
alt: member.fullName,
|
|
2136
|
+
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2137
|
+
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2138
|
+
}
|
|
2139
|
+
)) : /* @__PURE__ */ import_react43.default.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center text-black text-xs ${resolveThemeColor(member.profileColor)}` }, getInitials(member.fullName)), /* @__PURE__ */ import_react43.default.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-sm text-black truncate pr-2 sm:pr-4" }, member.fullName, " ", member.userId === currentUserId && /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-neutral-400 ml-1 sm:ml-2" }, "(You)")), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-xs text-neutral-500 truncate pr-2 sm:pr-4 mt-0.5" }, member.email))),
|
|
2140
|
+
/* @__PURE__ */ import_react43.default.createElement("div", { className: `shrink-0 pl-2 sm:pl-4 transition-opacity hidden sm:block ${canManage ? "opacity-0 group-hover:opacity-100" : "opacity-100"}` }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-black border border-neutral-200 px-4 py-2 rounded-full bg-white whitespace-nowrap" }, canManage ? "Manage" : "View"))
|
|
2141
|
+
))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2142
|
+
"button",
|
|
2143
|
+
{
|
|
2144
|
+
onClick: () => onPageChange(currentPage - 1),
|
|
2145
|
+
disabled: currentPage === 1 || isLoading,
|
|
2146
|
+
className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
2147
|
+
},
|
|
2148
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.ArrowLeft01Icon, size: 14 })
|
|
2149
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
2150
|
+
"button",
|
|
2151
|
+
{
|
|
2152
|
+
onClick: () => onPageChange(currentPage + 1),
|
|
2153
|
+
disabled: currentPage >= totalPages || isLoading,
|
|
2154
|
+
className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
2155
|
+
},
|
|
2156
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.ArrowRight01Icon, size: 14 })
|
|
2157
|
+
))))), currentView === "details" && selectedMember && /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full max-w-2xl text-left" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col gap-8" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-5" }, selectedMember.displayImage && selectedMember.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-16 h-16 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2158
|
+
"img",
|
|
2159
|
+
{
|
|
2160
|
+
src: selectedMember.displayImage,
|
|
2161
|
+
alt: selectedMember.fullName,
|
|
2162
|
+
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2163
|
+
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2164
|
+
}
|
|
2165
|
+
)) : /* @__PURE__ */ import_react43.default.createElement("div", { className: `w-16 h-16 shrink-0 rounded-full flex items-center justify-center text-black text-sm ${resolveThemeColor(selectedMember.profileColor)}` }, getInitials(selectedMember.fullName)), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("h2", { className: "text-lg text-black" }, selectedMember.fullName), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-sm text-neutral-500 mt-1" }, selectedMember.email))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "grid grid-cols-2 gap-6 border-t border-neutral-200 pt-8" }, /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Role"), canChangeRoles && selectedMember.userId !== currentUserId ? /* @__PURE__ */ import_react43.default.createElement(
|
|
2166
|
+
"button",
|
|
2167
|
+
{
|
|
2168
|
+
onClick: () => !isUpdatingRole && setIsRoleModalOpen(true),
|
|
2169
|
+
disabled: isUpdatingRole,
|
|
2170
|
+
className: `flex items-center gap-3 text-xs text-black pl-4 pr-3 py-2 border rounded-full transition-colors disabled:opacity-50 outline-none ${isRoleModalOpen ? "bg-neutral-50 border-neutral-300" : "bg-white border-neutral-200 hover:bg-neutral-50"}`
|
|
2171
|
+
},
|
|
2172
|
+
selectedMember.role,
|
|
2173
|
+
isUpdatingRole ? /* @__PURE__ */ import_react43.default.createElement(ButtonSpinner3, null) : /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.ArrowDown01Icon, size: 14, className: "text-neutral-400" })
|
|
2174
|
+
) : /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-xs text-black bg-neutral-50 px-4 py-2 rounded-full inline-block" }, selectedMember.role)), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Joined Date"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-sm text-black" }, new Date(selectedMember.joinedAt).toLocaleDateString()))), canManage && selectedMember.userId !== currentUserId && /* @__PURE__ */ import_react43.default.createElement("div", { className: "pt-8 mt-2 border-t border-neutral-200" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2175
|
+
"button",
|
|
2176
|
+
{
|
|
2177
|
+
onClick: () => setMemberToDelete(selectedMember),
|
|
2178
|
+
className: "flex items-center gap-2 text-[11px] tracking-widest text-red-600 hover:text-red-700 transition-colors w-fit outline-none"
|
|
2179
|
+
},
|
|
2180
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons11.Delete01Icon, size: 14 }),
|
|
2181
|
+
" Remove Member"
|
|
2182
|
+
)))), currentView === "invite" && canManage && /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full max-w-2xl text-left" }, /* @__PURE__ */ import_react43.default.createElement("form", { onSubmit: handleInvite, className: "space-y-8", autoComplete: "off" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2183
|
+
TextInput,
|
|
2184
|
+
{
|
|
2185
|
+
label: "Email Address",
|
|
2186
|
+
value: inviteEmail,
|
|
2187
|
+
onChange: (val) => setInviteEmail(val.toLowerCase()),
|
|
2188
|
+
disabled: isInviting,
|
|
2189
|
+
placeholder: "developer@acme.com"
|
|
2190
|
+
}
|
|
2191
|
+
), requireNamesForInvite && /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2192
|
+
TextInput,
|
|
2193
|
+
{
|
|
2194
|
+
label: "First Name",
|
|
2195
|
+
value: inviteFirst,
|
|
2196
|
+
onChange: (val) => setInviteFirst(cleanName(val)),
|
|
2197
|
+
disabled: isInviting,
|
|
2198
|
+
placeholder: "Jane"
|
|
2199
|
+
}
|
|
2200
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
2201
|
+
TextInput,
|
|
2202
|
+
{
|
|
2203
|
+
label: "Last Name",
|
|
2204
|
+
value: inviteLast,
|
|
2205
|
+
onChange: (val) => setInviteLast(cleanName(val)),
|
|
2206
|
+
disabled: isInviting,
|
|
2207
|
+
placeholder: "Doe"
|
|
2208
|
+
}
|
|
2209
|
+
)), /* @__PURE__ */ import_react43.default.createElement("div", { className: "pt-8 mt-2" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2210
|
+
ThreeDActionButton,
|
|
2211
|
+
{
|
|
2212
|
+
type: "submit",
|
|
2213
|
+
disabled: isInviting || !inviteEmail || requireNamesForInvite && (!inviteFirst || !inviteLast),
|
|
2214
|
+
isLoading: isInviting,
|
|
2215
|
+
className: "min-w-40"
|
|
2216
|
+
},
|
|
2217
|
+
"Send Invitation"
|
|
2218
|
+
)))), isRoleModalOpen && canChangeRoles && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isUpdatingRole && setIsRoleModalOpen(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { ref: dropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Update Role")), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, availableRoles.map((roleOption) => /* @__PURE__ */ import_react43.default.createElement(
|
|
2219
|
+
"button",
|
|
2220
|
+
{
|
|
2221
|
+
key: roleOption,
|
|
2222
|
+
onClick: () => handleRoleUpdate(roleOption),
|
|
2223
|
+
disabled: isUpdatingRole,
|
|
2224
|
+
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${selectedMember?.role === roleOption ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2225
|
+
},
|
|
2226
|
+
/* @__PURE__ */ import_react43.default.createElement("span", { className: "truncate pr-2" }, roleOption),
|
|
2227
|
+
selectedMember?.role === roleOption && /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-1.5 h-1.5 rounded-full shrink-0 bg-black" })
|
|
2228
|
+
))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2229
|
+
"button",
|
|
2230
|
+
{
|
|
2231
|
+
onClick: () => setIsRoleModalOpen(false),
|
|
2232
|
+
disabled: isUpdatingRole,
|
|
2233
|
+
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
2234
|
+
},
|
|
2235
|
+
"Cancel"
|
|
2236
|
+
)))), memberToDelete && canManage && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isDeleting && setMemberToDelete(null) }), /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-1" }, "Remove Member"), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, "Are you sure you want to remove this member? They will lose access instantly.")), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => setMemberToDelete(null), disabled: isDeleting, className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none" }, "Cancel"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: handleDelete, disabled: isDeleting, className: "flex-1 py-2 text-[13px] text-red-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center outline-none" }, isDeleting ? /* @__PURE__ */ import_react43.default.createElement(ButtonSpinner3, null) : "Remove")))));
|
|
1159
2237
|
};
|
|
1160
2238
|
// Annotate the CommonJS export names for ESM import in node:
|
|
1161
2239
|
0 && (module.exports = {
|
|
@@ -1181,5 +2259,12 @@ var GifFeatureCard = ({
|
|
|
1181
2259
|
PortfolioHero,
|
|
1182
2260
|
ProductHero,
|
|
1183
2261
|
TextInput,
|
|
1184
|
-
|
|
2262
|
+
ThreeDActionButton,
|
|
2263
|
+
ThreeDButton,
|
|
2264
|
+
UniversalHeader,
|
|
2265
|
+
UniversalIdentityPage,
|
|
2266
|
+
UniversalMembersPage,
|
|
2267
|
+
UniversalOrganizationPage,
|
|
2268
|
+
UniversalSidebar,
|
|
2269
|
+
ZairusAuth
|
|
1185
2270
|
});
|