@retinalabsllc/zairusjs 0.1.3 → 0.1.5
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 +19 -4
- package/dist/index.d.ts +19 -4
- package/dist/index.js +53 -17
- package/dist/index.mjs +62 -26
- package/package.json +4 -1
package/dist/index.d.mts
CHANGED
|
@@ -31,6 +31,8 @@ interface HeaderProps {
|
|
|
31
31
|
subtitle?: string;
|
|
32
32
|
links: HeaderLink[];
|
|
33
33
|
showLogo?: boolean;
|
|
34
|
+
invert?: boolean;
|
|
35
|
+
hideHeaderText?: boolean;
|
|
34
36
|
}
|
|
35
37
|
declare const Header: React.FC<HeaderProps>;
|
|
36
38
|
|
|
@@ -58,14 +60,27 @@ interface FooterProps {
|
|
|
58
60
|
declare const Footer: React.FC<FooterProps>;
|
|
59
61
|
|
|
60
62
|
interface HeroSectionProps {
|
|
61
|
-
|
|
63
|
+
/** Optional small pill text at the very top (e.g., "AI Research Company") */
|
|
64
|
+
badgeText?: string;
|
|
65
|
+
/** The first part of the H1 (e.g., "Hey Retina," or "AI that sees,") */
|
|
62
66
|
titlePrefix: React.ReactNode;
|
|
67
|
+
/** The text that receives the green bounding box highlight */
|
|
63
68
|
highlightText: string;
|
|
69
|
+
/** The text inside the collaborator cursor tag */
|
|
64
70
|
cursorLabel: string;
|
|
65
|
-
subtitle
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
/** Optional subtitle below the main headline */
|
|
72
|
+
subtitle?: string;
|
|
73
|
+
/** Primary 3D Button text */
|
|
74
|
+
ctaText?: string;
|
|
75
|
+
/** Primary 3D Button link */
|
|
76
|
+
ctaHref?: string;
|
|
77
|
+
/** Optional Secondary flat white button text */
|
|
78
|
+
secondaryCtaText?: string;
|
|
79
|
+
/** Optional Secondary flat white button link */
|
|
80
|
+
secondaryCtaHref?: string;
|
|
81
|
+
/** Should the bottom dashboard image render? */
|
|
68
82
|
showImage?: boolean;
|
|
83
|
+
/** URL for the dashboard image */
|
|
69
84
|
imageSrc?: string;
|
|
70
85
|
}
|
|
71
86
|
declare const HeroSection: React.FC<HeroSectionProps>;
|
package/dist/index.d.ts
CHANGED
|
@@ -31,6 +31,8 @@ interface HeaderProps {
|
|
|
31
31
|
subtitle?: string;
|
|
32
32
|
links: HeaderLink[];
|
|
33
33
|
showLogo?: boolean;
|
|
34
|
+
invert?: boolean;
|
|
35
|
+
hideHeaderText?: boolean;
|
|
34
36
|
}
|
|
35
37
|
declare const Header: React.FC<HeaderProps>;
|
|
36
38
|
|
|
@@ -58,14 +60,27 @@ interface FooterProps {
|
|
|
58
60
|
declare const Footer: React.FC<FooterProps>;
|
|
59
61
|
|
|
60
62
|
interface HeroSectionProps {
|
|
61
|
-
|
|
63
|
+
/** Optional small pill text at the very top (e.g., "AI Research Company") */
|
|
64
|
+
badgeText?: string;
|
|
65
|
+
/** The first part of the H1 (e.g., "Hey Retina," or "AI that sees,") */
|
|
62
66
|
titlePrefix: React.ReactNode;
|
|
67
|
+
/** The text that receives the green bounding box highlight */
|
|
63
68
|
highlightText: string;
|
|
69
|
+
/** The text inside the collaborator cursor tag */
|
|
64
70
|
cursorLabel: string;
|
|
65
|
-
subtitle
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
/** Optional subtitle below the main headline */
|
|
72
|
+
subtitle?: string;
|
|
73
|
+
/** Primary 3D Button text */
|
|
74
|
+
ctaText?: string;
|
|
75
|
+
/** Primary 3D Button link */
|
|
76
|
+
ctaHref?: string;
|
|
77
|
+
/** Optional Secondary flat white button text */
|
|
78
|
+
secondaryCtaText?: string;
|
|
79
|
+
/** Optional Secondary flat white button link */
|
|
80
|
+
secondaryCtaHref?: string;
|
|
81
|
+
/** Should the bottom dashboard image render? */
|
|
68
82
|
showImage?: boolean;
|
|
83
|
+
/** URL for the dashboard image */
|
|
69
84
|
imageSrc?: string;
|
|
70
85
|
}
|
|
71
86
|
declare const HeroSection: React.FC<HeroSectionProps>;
|
package/dist/index.js
CHANGED
|
@@ -176,7 +176,7 @@ var NavLink = ({ href, children, className = "" }) => {
|
|
|
176
176
|
import_link2.default,
|
|
177
177
|
{
|
|
178
178
|
href,
|
|
179
|
-
className: `px-3 py-1.5 text-xs transition-colors duration-200 rounded-full ${isActive ? "text-
|
|
179
|
+
className: `px-3 py-1.5 text-xs transition-colors duration-200 rounded-full ${isActive ? "text-white font-medium" : "text-neutral-400 hover:text-white"} ${className}`
|
|
180
180
|
},
|
|
181
181
|
children
|
|
182
182
|
);
|
|
@@ -186,19 +186,21 @@ var Header = ({
|
|
|
186
186
|
companyName,
|
|
187
187
|
subtitle,
|
|
188
188
|
links,
|
|
189
|
-
showLogo = true
|
|
189
|
+
showLogo = true,
|
|
190
|
+
invert = false,
|
|
191
|
+
hideHeaderText = false
|
|
190
192
|
}) => {
|
|
191
|
-
return /* @__PURE__ */ import_react4.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_react4.default.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto" }, /* @__PURE__ */ import_react4.default.createElement("header", { className: "w-full bg-
|
|
193
|
+
return /* @__PURE__ */ import_react4.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_react4.default.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto" }, /* @__PURE__ */ import_react4.default.createElement("header", { className: "w-full bg-black/95 backdrop-blur-md rounded-full py-2 px-6 flex justify-between items-center shadow-[0_8px_60px_rgba(0,0,0,0.2)] border border-white/10" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react4.default.createElement(import_link2.default, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70" }, showLogo && /* @__PURE__ */ import_react4.default.createElement(
|
|
192
194
|
import_image.default,
|
|
193
195
|
{
|
|
194
196
|
src: logoSrc,
|
|
195
197
|
alt: `${companyName} Logo`,
|
|
196
198
|
width: 40,
|
|
197
199
|
height: 40,
|
|
198
|
-
className:
|
|
200
|
+
className: `object-contain w-5 h-auto ${invert ? "invert" : ""}`,
|
|
199
201
|
priority: true
|
|
200
202
|
}
|
|
201
|
-
), /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react4.default.createElement("span", { className: "text-[12px] text-
|
|
203
|
+
), !hideHeaderText && /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react4.default.createElement("span", { className: "text-[12px] text-white leading-none tracking-wide mb-1" }, companyName), subtitle && /* @__PURE__ */ import_react4.default.createElement("span", { className: "text-[9px] text-neutral-400 tracking-widest leading-none" }, subtitle)))), /* @__PURE__ */ import_react4.default.createElement("nav", { className: "flex items-center gap-1 md:gap-2" }, links.map((link, index) => /* @__PURE__ */ import_react4.default.createElement(
|
|
202
204
|
NavLink,
|
|
203
205
|
{
|
|
204
206
|
key: index,
|
|
@@ -220,7 +222,31 @@ var Footer = ({
|
|
|
220
222
|
copyrightText,
|
|
221
223
|
topSection
|
|
222
224
|
}) => {
|
|
223
|
-
|
|
225
|
+
const [openCol, setOpenCol] = (0, import_react5.useState)(null);
|
|
226
|
+
const toggleColumn = (idx) => {
|
|
227
|
+
setOpenCol(openCol === idx ? null : idx);
|
|
228
|
+
};
|
|
229
|
+
return /* @__PURE__ */ import_react5.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react5.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react5.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_react5.default.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ import_react5.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_react5.default.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 uppercase" }, col.title), /* @__PURE__ */ import_react5.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react5.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react5.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ import_react5.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
|
|
230
|
+
const isOpen = openCol === idx;
|
|
231
|
+
return /* @__PURE__ */ import_react5.default.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
232
|
+
"button",
|
|
233
|
+
{
|
|
234
|
+
onClick: () => toggleColumn(idx),
|
|
235
|
+
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
236
|
+
},
|
|
237
|
+
/* @__PURE__ */ import_react5.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black uppercase" }, col.title),
|
|
238
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
239
|
+
"svg",
|
|
240
|
+
{
|
|
241
|
+
className: `w-4 h-4 text-neutral-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
242
|
+
fill: "none",
|
|
243
|
+
viewBox: "0 0 24 24",
|
|
244
|
+
stroke: "currentColor"
|
|
245
|
+
},
|
|
246
|
+
/* @__PURE__ */ import_react5.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
247
|
+
)
|
|
248
|
+
), /* @__PURE__ */ import_react5.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_react5.default.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ import_react5.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react5.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react5.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ import_react5.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
249
|
+
})))), /* @__PURE__ */ import_react5.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_react5.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ import_react5.default.createElement(
|
|
224
250
|
"a",
|
|
225
251
|
{
|
|
226
252
|
key: idx,
|
|
@@ -236,6 +262,7 @@ var Footer = ({
|
|
|
236
262
|
|
|
237
263
|
// src/components/HeroSection.tsx
|
|
238
264
|
var import_react7 = __toESM(require("react"));
|
|
265
|
+
var import_link4 = __toESM(require("next/link"));
|
|
239
266
|
var import_image2 = __toESM(require("next/image"));
|
|
240
267
|
var HeroSection = ({
|
|
241
268
|
badgeText,
|
|
@@ -245,7 +272,9 @@ var HeroSection = ({
|
|
|
245
272
|
subtitle,
|
|
246
273
|
ctaText,
|
|
247
274
|
ctaHref,
|
|
248
|
-
|
|
275
|
+
secondaryCtaText,
|
|
276
|
+
secondaryCtaHref,
|
|
277
|
+
showImage = false,
|
|
249
278
|
imageSrc = "/assets/ai.avif"
|
|
250
279
|
}) => {
|
|
251
280
|
return /* @__PURE__ */ import_react7.default.createElement("section", { className: "relative pt-32 sm:pt-40 pb-16 flex flex-col items-center overflow-hidden w-full" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
@@ -264,7 +293,14 @@ var HeroSection = ({
|
|
|
264
293
|
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")`
|
|
265
294
|
}
|
|
266
295
|
}
|
|
267
|
-
), /* @__PURE__ */ import_react7.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" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-
|
|
296
|
+
), /* @__PURE__ */ import_react7.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_react7.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_react7.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-white uppercase" }, badgeText)), /* @__PURE__ */ import_react7.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_react7.default.createElement("div", { className: "flex justify-center mt-2 mb-10 md:mb-14" }, /* @__PURE__ */ import_react7.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 text-2xl md:text-4xl lg:text-6xl tracking-tight" }, /* @__PURE__ */ import_react7.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_react7.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_react7.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_react7.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_react7.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_react7.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_react7.default.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ import_react7.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_react7.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_react7.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_react7.default.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ import_react7.default.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react7.default.createElement(
|
|
297
|
+
import_link4.default,
|
|
298
|
+
{
|
|
299
|
+
href: secondaryCtaHref,
|
|
300
|
+
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"
|
|
301
|
+
},
|
|
302
|
+
secondaryCtaText
|
|
303
|
+
)), showImage && /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ import_react7.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_react7.default.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
268
304
|
import_image2.default,
|
|
269
305
|
{
|
|
270
306
|
src: imageSrc,
|
|
@@ -439,7 +475,7 @@ var AITranscriptionFeature = ({
|
|
|
439
475
|
detailTextSuffix
|
|
440
476
|
}) => {
|
|
441
477
|
const [isLoading, setIsLoading] = (0, import_react12.useState)(!!imagePath);
|
|
442
|
-
return /* @__PURE__ */ import_react12.default.createElement("section", { className: "py-24 w-full flex justify-center
|
|
478
|
+
return /* @__PURE__ */ import_react12.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react12.default.createElement("h2", { className: "text-3xl md:text-5xl tracking-tight animate-gradient-wipe leading-[1.05] mb-4" }, headline), /* @__PURE__ */ import_react12.default.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-xl mx-auto" }, description)), /* @__PURE__ */ import_react12.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_react12.default.createElement(
|
|
443
479
|
"div",
|
|
444
480
|
{
|
|
445
481
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -568,7 +604,7 @@ var ManagedContactBlock = ({
|
|
|
568
604
|
|
|
569
605
|
// src/components/ManagedPricingBlock.tsx
|
|
570
606
|
var import_react19 = __toESM(require("react"));
|
|
571
|
-
var
|
|
607
|
+
var import_link5 = __toESM(require("next/link"));
|
|
572
608
|
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ import_react19.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_react19.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react19.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
573
609
|
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ import_react19.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_react19.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react19.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
574
610
|
var ManagedPricingBlock = ({
|
|
@@ -584,7 +620,7 @@ var ManagedPricingBlock = ({
|
|
|
584
620
|
},
|
|
585
621
|
/* @__PURE__ */ import_react19.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ import_react19.default.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "text-3xl text-black" }, plan.price), plan.period && /* @__PURE__ */ import_react19.default.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ import_react19.default.createElement("p", { className: "text-xs text-neutral-500 mt-2" }, plan.description)),
|
|
586
622
|
plan.isPremium ? /* @__PURE__ */ import_react19.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react19.default.createElement(
|
|
587
|
-
|
|
623
|
+
import_link5.default,
|
|
588
624
|
{
|
|
589
625
|
href: plan.ctaHref,
|
|
590
626
|
className: "w-full py-2 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none"
|
|
@@ -661,7 +697,7 @@ var ManagedBoardBlock = ({
|
|
|
661
697
|
|
|
662
698
|
// src/components/ManagedProjectsBlock.tsx
|
|
663
699
|
var import_react22 = __toESM(require("react"));
|
|
664
|
-
var
|
|
700
|
+
var import_link6 = __toESM(require("next/link"));
|
|
665
701
|
var GridSection = ({
|
|
666
702
|
children,
|
|
667
703
|
isLast = false,
|
|
@@ -684,13 +720,13 @@ var ManagedProjectsBlock = ({
|
|
|
684
720
|
), /* @__PURE__ */ import_react22.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react22.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react22.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ import_react22.default.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
685
721
|
const isLast = index === projects.length - 1;
|
|
686
722
|
const projectContent = /* @__PURE__ */ import_react22.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react22.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_react22.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react22.default.createElement("h2", { className: "text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react22.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_react22.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_react22.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 shrink-0 uppercase" }, project.date)), /* @__PURE__ */ import_react22.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));
|
|
687
|
-
return /* @__PURE__ */ import_react22.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_react22.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react22.default.createElement(
|
|
723
|
+
return /* @__PURE__ */ import_react22.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_react22.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react22.default.createElement(import_link6.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
688
724
|
}))));
|
|
689
725
|
};
|
|
690
726
|
|
|
691
727
|
// src/components/ManagedNotFoundBlock.tsx
|
|
692
728
|
var import_react23 = __toESM(require("react"));
|
|
693
|
-
var
|
|
729
|
+
var import_link7 = __toESM(require("next/link"));
|
|
694
730
|
var ManagedNotFoundBlock = ({
|
|
695
731
|
title = "404 - Page Not Found",
|
|
696
732
|
description = "The page you are looking for does not exist or has been moved.",
|
|
@@ -706,7 +742,7 @@ var ManagedNotFoundBlock = ({
|
|
|
706
742
|
},
|
|
707
743
|
/* @__PURE__ */ import_react23.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" })
|
|
708
744
|
)), /* @__PURE__ */ import_react23.default.createElement("h1", { className: "text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description), /* @__PURE__ */ import_react23.default.createElement(
|
|
709
|
-
|
|
745
|
+
import_link7.default,
|
|
710
746
|
{
|
|
711
747
|
href: backLinkHref,
|
|
712
748
|
className: "text-[11px] tracking-[0.2em] text-neutral-400 hover:text-black transition-colors pb-1 uppercase"
|
|
@@ -886,7 +922,7 @@ var NumberInput = ({
|
|
|
886
922
|
|
|
887
923
|
// src/components/PortfolioHero.tsx
|
|
888
924
|
var import_react29 = __toESM(require("react"));
|
|
889
|
-
var
|
|
925
|
+
var import_link8 = __toESM(require("next/link"));
|
|
890
926
|
var import_image7 = __toESM(require("next/image"));
|
|
891
927
|
var import_react30 = require("@hugeicons/react");
|
|
892
928
|
var import_core_free_icons6 = require("@hugeicons/core-free-icons");
|
|
@@ -964,7 +1000,7 @@ var PortfolioHero = ({
|
|
|
964
1000
|
},
|
|
965
1001
|
primaryCtaText
|
|
966
1002
|
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react29.default.createElement(
|
|
967
|
-
|
|
1003
|
+
import_link8.default,
|
|
968
1004
|
{
|
|
969
1005
|
href: secondaryCtaHref,
|
|
970
1006
|
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] uppercase rounded-full px-8 py-3.5 bg-neutral-100 transition-colors text-black hover:bg-neutral-200 outline-none"
|
package/dist/index.mjs
CHANGED
|
@@ -121,7 +121,7 @@ var NavLink = ({ href, children, className = "" }) => {
|
|
|
121
121
|
Link2,
|
|
122
122
|
{
|
|
123
123
|
href,
|
|
124
|
-
className: `px-3 py-1.5 text-xs transition-colors duration-200 rounded-full ${isActive ? "text-
|
|
124
|
+
className: `px-3 py-1.5 text-xs transition-colors duration-200 rounded-full ${isActive ? "text-white font-medium" : "text-neutral-400 hover:text-white"} ${className}`
|
|
125
125
|
},
|
|
126
126
|
children
|
|
127
127
|
);
|
|
@@ -131,19 +131,21 @@ var Header = ({
|
|
|
131
131
|
companyName,
|
|
132
132
|
subtitle,
|
|
133
133
|
links,
|
|
134
|
-
showLogo = true
|
|
134
|
+
showLogo = true,
|
|
135
|
+
invert = false,
|
|
136
|
+
hideHeaderText = false
|
|
135
137
|
}) => {
|
|
136
|
-
return /* @__PURE__ */ React3.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React3.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto" }, /* @__PURE__ */ React3.createElement("header", { className: "w-full bg-
|
|
138
|
+
return /* @__PURE__ */ React3.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React3.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto" }, /* @__PURE__ */ React3.createElement("header", { className: "w-full bg-black/95 backdrop-blur-md rounded-full py-2 px-6 flex justify-between items-center shadow-[0_8px_60px_rgba(0,0,0,0.2)] border border-white/10" }, /* @__PURE__ */ React3.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React3.createElement(Link2, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70" }, showLogo && /* @__PURE__ */ React3.createElement(
|
|
137
139
|
Image,
|
|
138
140
|
{
|
|
139
141
|
src: logoSrc,
|
|
140
142
|
alt: `${companyName} Logo`,
|
|
141
143
|
width: 40,
|
|
142
144
|
height: 40,
|
|
143
|
-
className:
|
|
145
|
+
className: `object-contain w-5 h-auto ${invert ? "invert" : ""}`,
|
|
144
146
|
priority: true
|
|
145
147
|
}
|
|
146
|
-
), /* @__PURE__ */ React3.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React3.createElement("span", { className: "text-[12px] text-
|
|
148
|
+
), !hideHeaderText && /* @__PURE__ */ React3.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React3.createElement("span", { className: "text-[12px] text-white leading-none tracking-wide mb-1" }, companyName), subtitle && /* @__PURE__ */ React3.createElement("span", { className: "text-[9px] text-neutral-400 tracking-widest leading-none" }, subtitle)))), /* @__PURE__ */ React3.createElement("nav", { className: "flex items-center gap-1 md:gap-2" }, links.map((link, index) => /* @__PURE__ */ React3.createElement(
|
|
147
149
|
NavLink,
|
|
148
150
|
{
|
|
149
151
|
key: index,
|
|
@@ -155,7 +157,7 @@ var Header = ({
|
|
|
155
157
|
};
|
|
156
158
|
|
|
157
159
|
// src/components/Footer.tsx
|
|
158
|
-
import React4 from "react";
|
|
160
|
+
import React4, { useState as useState2 } from "react";
|
|
159
161
|
import Link3 from "next/link";
|
|
160
162
|
import { HugeiconsIcon as HugeiconsIcon2 } from "@hugeicons/react";
|
|
161
163
|
var Footer = ({
|
|
@@ -165,7 +167,31 @@ var Footer = ({
|
|
|
165
167
|
copyrightText,
|
|
166
168
|
topSection
|
|
167
169
|
}) => {
|
|
168
|
-
|
|
170
|
+
const [openCol, setOpenCol] = useState2(null);
|
|
171
|
+
const toggleColumn = (idx) => {
|
|
172
|
+
setOpenCol(openCol === idx ? null : idx);
|
|
173
|
+
};
|
|
174
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React4.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React4.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ React4.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ React4.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ React4.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ React4.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 uppercase" }, col.title), /* @__PURE__ */ React4.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React4.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React4.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ React4.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
|
|
175
|
+
const isOpen = openCol === idx;
|
|
176
|
+
return /* @__PURE__ */ React4.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ React4.createElement(
|
|
177
|
+
"button",
|
|
178
|
+
{
|
|
179
|
+
onClick: () => toggleColumn(idx),
|
|
180
|
+
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
181
|
+
},
|
|
182
|
+
/* @__PURE__ */ React4.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black uppercase" }, col.title),
|
|
183
|
+
/* @__PURE__ */ React4.createElement(
|
|
184
|
+
"svg",
|
|
185
|
+
{
|
|
186
|
+
className: `w-4 h-4 text-neutral-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
187
|
+
fill: "none",
|
|
188
|
+
viewBox: "0 0 24 24",
|
|
189
|
+
stroke: "currentColor"
|
|
190
|
+
},
|
|
191
|
+
/* @__PURE__ */ React4.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
192
|
+
)
|
|
193
|
+
), /* @__PURE__ */ React4.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__ */ React4.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React4.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ React4.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React4.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ React4.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
194
|
+
})))), /* @__PURE__ */ React4.createElement("div", { className: "pt-8 mt-4 border-t border-neutral-200 flex flex-col-reverse md:flex-row justify-between items-start md:items-center gap-6 relative z-20" }, /* @__PURE__ */ React4.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ React4.createElement(
|
|
169
195
|
"a",
|
|
170
196
|
{
|
|
171
197
|
key: idx,
|
|
@@ -181,6 +207,7 @@ var Footer = ({
|
|
|
181
207
|
|
|
182
208
|
// src/components/HeroSection.tsx
|
|
183
209
|
import React5 from "react";
|
|
210
|
+
import Link4 from "next/link";
|
|
184
211
|
import Image2 from "next/image";
|
|
185
212
|
var HeroSection = ({
|
|
186
213
|
badgeText,
|
|
@@ -190,7 +217,9 @@ var HeroSection = ({
|
|
|
190
217
|
subtitle,
|
|
191
218
|
ctaText,
|
|
192
219
|
ctaHref,
|
|
193
|
-
|
|
220
|
+
secondaryCtaText,
|
|
221
|
+
secondaryCtaHref,
|
|
222
|
+
showImage = false,
|
|
194
223
|
imageSrc = "/assets/ai.avif"
|
|
195
224
|
}) => {
|
|
196
225
|
return /* @__PURE__ */ React5.createElement("section", { className: "relative pt-32 sm:pt-40 pb-16 flex flex-col items-center overflow-hidden w-full" }, /* @__PURE__ */ React5.createElement(
|
|
@@ -209,7 +238,14 @@ var HeroSection = ({
|
|
|
209
238
|
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")`
|
|
210
239
|
}
|
|
211
240
|
}
|
|
212
|
-
), /* @__PURE__ */ React5.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ React5.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-
|
|
241
|
+
), /* @__PURE__ */ React5.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, badgeText && /* @__PURE__ */ React5.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__ */ React5.createElement("span", { className: "text-[10px] tracking-[0.4em] text-white uppercase" }, badgeText)), /* @__PURE__ */ React5.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__ */ React5.createElement("div", { className: "flex justify-center mt-2 mb-10 md:mb-14" }, /* @__PURE__ */ React5.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 text-2xl md:text-4xl lg:text-6xl tracking-tight" }, /* @__PURE__ */ React5.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute bottom-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), highlightText, /* @__PURE__ */ React5.createElement("span", { className: "absolute -bottom-5 -right-5 flex items-center z-20 pointer-events-none select-none filter drop-shadow-[0_2px_4px_rgba(0,0,0,0.25)]" }, /* @__PURE__ */ React5.createElement("svg", { width: "18", height: "22", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ React5.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React5.createElement("span", { className: "ml-1 bg-[#21a473] text-[10px] text-white px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel)))), subtitle && /* @__PURE__ */ React5.createElement("p", { className: "text-[13px] md:text-[15px] text-[#bbf7df]/90 max-w-xl mx-auto mb-10 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ React5.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__ */ React5.createElement("div", { className: "w-full sm:w-60 flex justify-center *:w-full" }, /* @__PURE__ */ React5.createElement(ThreeDButton, { href: ctaHref }, ctaText)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React5.createElement(
|
|
242
|
+
Link4,
|
|
243
|
+
{
|
|
244
|
+
href: secondaryCtaHref,
|
|
245
|
+
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"
|
|
246
|
+
},
|
|
247
|
+
secondaryCtaText
|
|
248
|
+
)), showImage && /* @__PURE__ */ React5.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ React5.createElement("div", { className: "absolute top-1.5 left-1/2 -translate-x-1/2 w-2.5 h-2.5 bg-[#0a0a0b] rounded-full flex items-center justify-center z-30" }, /* @__PURE__ */ React5.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ React5.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ React5.createElement(
|
|
213
249
|
Image2,
|
|
214
250
|
{
|
|
215
251
|
src: imageSrc,
|
|
@@ -270,12 +306,12 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
270
306
|
};
|
|
271
307
|
|
|
272
308
|
// src/components/FeatureScroll.tsx
|
|
273
|
-
import React7, { useRef, useState as
|
|
309
|
+
import React7, { useRef, useState as useState3, useEffect } from "react";
|
|
274
310
|
import Image3 from "next/image";
|
|
275
311
|
import { HugeiconsIcon as HugeiconsIcon4 } from "@hugeicons/react";
|
|
276
312
|
import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon } from "@hugeicons/core-free-icons";
|
|
277
313
|
var FeatureCard = ({ feature }) => {
|
|
278
|
-
const [isLoading, setIsLoading] =
|
|
314
|
+
const [isLoading, setIsLoading] = useState3(!!feature.image);
|
|
279
315
|
return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React7.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React7.createElement(
|
|
280
316
|
"div",
|
|
281
317
|
{
|
|
@@ -303,8 +339,8 @@ var FeatureCard = ({ feature }) => {
|
|
|
303
339
|
};
|
|
304
340
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
305
341
|
const scrollRef = useRef(null);
|
|
306
|
-
const [canScrollLeft, setCanScrollLeft] =
|
|
307
|
-
const [canScrollRight, setCanScrollRight] =
|
|
342
|
+
const [canScrollLeft, setCanScrollLeft] = useState3(false);
|
|
343
|
+
const [canScrollRight, setCanScrollRight] = useState3(true);
|
|
308
344
|
const checkScroll = () => {
|
|
309
345
|
if (scrollRef.current) {
|
|
310
346
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -369,7 +405,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
369
405
|
};
|
|
370
406
|
|
|
371
407
|
// src/components/AITranscriptionFeature.tsx
|
|
372
|
-
import React8, { useState as
|
|
408
|
+
import React8, { useState as useState4 } from "react";
|
|
373
409
|
import Image4 from "next/image";
|
|
374
410
|
import { HugeiconsIcon as HugeiconsIcon5 } from "@hugeicons/react";
|
|
375
411
|
import { Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
|
|
@@ -383,8 +419,8 @@ var AITranscriptionFeature = ({
|
|
|
383
419
|
cursorLabel,
|
|
384
420
|
detailTextSuffix
|
|
385
421
|
}) => {
|
|
386
|
-
const [isLoading, setIsLoading] =
|
|
387
|
-
return /* @__PURE__ */ React8.createElement("section", { className: "py-24 w-full flex justify-center
|
|
422
|
+
const [isLoading, setIsLoading] = useState4(!!imagePath);
|
|
423
|
+
return /* @__PURE__ */ React8.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ React8.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React8.createElement("div", { className: "flex flex-col items-center text-center mb-12 relative z-10 animate-in fade-in slide-in-from-bottom-4 duration-700" }, /* @__PURE__ */ React8.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React8.createElement("h2", { className: "text-3xl md:text-5xl tracking-tight animate-gradient-wipe leading-[1.05] mb-4" }, headline), /* @__PURE__ */ React8.createElement("p", { className: "text-[15px] md:text-[16px] leading-[1.8] text-neutral-600 max-w-xl mx-auto" }, description)), /* @__PURE__ */ React8.createElement("div", { className: "relative w-full max-w-5xl mx-auto aspect-video sm:aspect-21/9 bg-neutral-100 rounded-2xl overflow-hidden mb-12 flex items-center justify-center shadow-[0_0_40px_rgba(0,0,0,0.03)] animate-in fade-in zoom-in-95 duration-700 delay-150 fill-mode-both" }, /* @__PURE__ */ React8.createElement(
|
|
388
424
|
"div",
|
|
389
425
|
{
|
|
390
426
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-20 mix-blend-overlay",
|
|
@@ -453,10 +489,10 @@ var ManagedDocument = ({
|
|
|
453
489
|
};
|
|
454
490
|
|
|
455
491
|
// src/components/ManagedContactBlock.tsx
|
|
456
|
-
import React11, { useState as
|
|
492
|
+
import React11, { useState as useState5, useEffect as useEffect2 } from "react";
|
|
457
493
|
import { HugeiconsIcon as HugeiconsIcon7 } from "@hugeicons/react";
|
|
458
494
|
var SecureEmail = ({ user, domain, className }) => {
|
|
459
|
-
const [isMounted, setIsMounted] =
|
|
495
|
+
const [isMounted, setIsMounted] = useState5(false);
|
|
460
496
|
useEffect2(() => {
|
|
461
497
|
setIsMounted(true);
|
|
462
498
|
}, []);
|
|
@@ -513,7 +549,7 @@ var ManagedContactBlock = ({
|
|
|
513
549
|
|
|
514
550
|
// src/components/ManagedPricingBlock.tsx
|
|
515
551
|
import React12 from "react";
|
|
516
|
-
import
|
|
552
|
+
import Link5 from "next/link";
|
|
517
553
|
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ React12.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
518
554
|
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ React12.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
519
555
|
var ManagedPricingBlock = ({
|
|
@@ -529,7 +565,7 @@ var ManagedPricingBlock = ({
|
|
|
529
565
|
},
|
|
530
566
|
/* @__PURE__ */ React12.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React12.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ React12.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ React12.createElement("span", { className: "text-3xl text-black" }, plan.price), plan.period && /* @__PURE__ */ React12.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-neutral-500 mt-2" }, plan.description)),
|
|
531
567
|
plan.isPremium ? /* @__PURE__ */ React12.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ React12.createElement(
|
|
532
|
-
|
|
568
|
+
Link5,
|
|
533
569
|
{
|
|
534
570
|
href: plan.ctaHref,
|
|
535
571
|
className: "w-full py-2 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none"
|
|
@@ -606,7 +642,7 @@ var ManagedBoardBlock = ({
|
|
|
606
642
|
|
|
607
643
|
// src/components/ManagedProjectsBlock.tsx
|
|
608
644
|
import React14 from "react";
|
|
609
|
-
import
|
|
645
|
+
import Link6 from "next/link";
|
|
610
646
|
var GridSection = ({
|
|
611
647
|
children,
|
|
612
648
|
isLast = false,
|
|
@@ -629,13 +665,13 @@ var ManagedProjectsBlock = ({
|
|
|
629
665
|
), /* @__PURE__ */ React14.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React14.createElement(GridSection, null, tagline && /* @__PURE__ */ React14.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 text-left block uppercase" }, tagline), /* @__PURE__ */ React14.createElement("h1", { className: "text-4xl md:text-5xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
630
666
|
const isLast = index === projects.length - 1;
|
|
631
667
|
const projectContent = /* @__PURE__ */ React14.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ React14.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ React14.createElement("h2", { className: "text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ React14.createElement("span", { className: "text-[12px] opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ React14.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] uppercase transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-neutral-100 text-neutral-500 group-hover:bg-neutral-200 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ React14.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-500 shrink-0 uppercase" }, project.date)), /* @__PURE__ */ React14.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
632
|
-
return /* @__PURE__ */ React14.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ React14.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React14.createElement(
|
|
668
|
+
return /* @__PURE__ */ React14.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ React14.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React14.createElement(Link6, { href: project.link, className: "block outline-none" }, projectContent));
|
|
633
669
|
}))));
|
|
634
670
|
};
|
|
635
671
|
|
|
636
672
|
// src/components/ManagedNotFoundBlock.tsx
|
|
637
673
|
import React15 from "react";
|
|
638
|
-
import
|
|
674
|
+
import Link7 from "next/link";
|
|
639
675
|
var ManagedNotFoundBlock = ({
|
|
640
676
|
title = "404 - Page Not Found",
|
|
641
677
|
description = "The page you are looking for does not exist or has been moved.",
|
|
@@ -651,7 +687,7 @@ var ManagedNotFoundBlock = ({
|
|
|
651
687
|
},
|
|
652
688
|
/* @__PURE__ */ React15.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" })
|
|
653
689
|
)), /* @__PURE__ */ React15.createElement("h1", { className: "text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ React15.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description), /* @__PURE__ */ React15.createElement(
|
|
654
|
-
|
|
690
|
+
Link7,
|
|
655
691
|
{
|
|
656
692
|
href: backLinkHref,
|
|
657
693
|
className: "text-[11px] tracking-[0.2em] text-neutral-400 hover:text-black transition-colors pb-1 uppercase"
|
|
@@ -831,7 +867,7 @@ var NumberInput = ({
|
|
|
831
867
|
|
|
832
868
|
// src/components/PortfolioHero.tsx
|
|
833
869
|
import React20, { useEffect as useEffect3, useRef as useRef2 } from "react";
|
|
834
|
-
import
|
|
870
|
+
import Link8 from "next/link";
|
|
835
871
|
import Image7 from "next/image";
|
|
836
872
|
import { HugeiconsIcon as HugeiconsIcon10 } from "@hugeicons/react";
|
|
837
873
|
import { ArrowRight01Icon as ArrowRight01Icon2 } from "@hugeicons/core-free-icons";
|
|
@@ -909,7 +945,7 @@ var PortfolioHero = ({
|
|
|
909
945
|
},
|
|
910
946
|
primaryCtaText
|
|
911
947
|
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React20.createElement(
|
|
912
|
-
|
|
948
|
+
Link8,
|
|
913
949
|
{
|
|
914
950
|
href: secondaryCtaHref,
|
|
915
951
|
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] uppercase rounded-full px-8 py-3.5 bg-neutral-100 transition-colors text-black hover:bg-neutral-200 outline-none"
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@retinalabsllc/zairusjs",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.5",
|
|
4
4
|
"description": "A perceptive, Ai data driven Next.js UI component library.",
|
|
5
5
|
"author": "Retina Labs Company",
|
|
6
6
|
"license": "MIT",
|
|
@@ -56,5 +56,8 @@
|
|
|
56
56
|
"tailwindcss": "^4.0.0",
|
|
57
57
|
"tsup": "^8.0.0",
|
|
58
58
|
"typescript": "^5.0.0"
|
|
59
|
+
},
|
|
60
|
+
"overrides": {
|
|
61
|
+
"postcss": "^8.5.15"
|
|
59
62
|
}
|
|
60
63
|
}
|