@mdxui/named 6.3.1 → 6.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/index.js +22 -15
- package/dist/components/index.js.map +1 -1
- package/dist/index.js +22 -15
- package/dist/index.js.map +1 -1
- package/dist/styles.css +319 -0
- package/dist/view/index.js +24 -17
- package/dist/view/index.js.map +1 -1
- package/package.json +8 -5
package/dist/styles.css
ADDED
|
@@ -0,0 +1,319 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @mdxui/named — named-agents theme envelope
|
|
3
|
+
* ============================================================================
|
|
4
|
+
*
|
|
5
|
+
* The named-agents baseline (https://named-agents.vercel.app, source on
|
|
6
|
+
* origin/main, Bryant's 2026-05-27 token + radii + mobile-padding polish) is a
|
|
7
|
+
* distinctive LIGHT design: cream surfaces, warm-ink text, a serif display face
|
|
8
|
+
* (Halant), a persimmon accent, and photographic hero artwork on large
|
|
9
|
+
* `--radius-image` masks.
|
|
10
|
+
*
|
|
11
|
+
* When the named dialect was packaged into @mdxui, its components were
|
|
12
|
+
* reimplemented against @mdxui/neo's GENERIC token vocabulary (`bg-background`,
|
|
13
|
+
* `text-foreground`, `text-muted-foreground`, `bg-card`, `border-border`,
|
|
14
|
+
* `var(--card)`, …) and shipped JSX-only. With no theme CSS the named subtree
|
|
15
|
+
* inherits whatever neo theme the host pins — typically a dark-neo surface — so
|
|
16
|
+
* the cream-serif baseline is lost.
|
|
17
|
+
*
|
|
18
|
+
* This file ships the token DEFINITIONS so the markup the package emits actually
|
|
19
|
+
* renders as the light baseline designed.
|
|
20
|
+
*
|
|
21
|
+
* Consume it from your Tailwind v4 entry (e.g. app/globals.css):
|
|
22
|
+
*
|
|
23
|
+
* @import "@mdxui/named/styles.css";
|
|
24
|
+
*
|
|
25
|
+
* SCOPING (critical)
|
|
26
|
+
* ------------------
|
|
27
|
+
* Everything is scoped under `[data-dialect="named"]` — the wrapper
|
|
28
|
+
* `NamedAgentView` renders around the whole named arc. The named components
|
|
29
|
+
* reference neo's SHARED token names (`--background`, `--card`, `--foreground`,
|
|
30
|
+
* `--muted-foreground`, `--primary`, `--border`, …). The host pins those names
|
|
31
|
+
* globally for its OTHER dialects, and uses `@theme inline`, which can BAKE the
|
|
32
|
+
* value into the generated utility — a CSS-var swap alone may not retarget it.
|
|
33
|
+
* So this envelope does BOTH, defensively:
|
|
34
|
+
*
|
|
35
|
+
* 1. re-points the neo CSS vars inside the scope (covers var()-reading utils
|
|
36
|
+
* + inline `var(--background)` / `var(--card)` styles the markup uses), and
|
|
37
|
+
* 2. ships the neo utilities the named markup references as explicit, SCOPED
|
|
38
|
+
* class rules (`[data-dialect="named"] .bg-background { … }`). They win
|
|
39
|
+
* inside the named subtree by selector specificity, are host-agnostic, and
|
|
40
|
+
* leave every other archetype untouched.
|
|
41
|
+
*
|
|
42
|
+
* It also restores the two things a CSS envelope alone cannot: the Halant serif
|
|
43
|
+
* `.font-halant` display face (loaded via @font-face) and the baseline
|
|
44
|
+
* `--radius-section` / `--radius-image` radii.
|
|
45
|
+
*
|
|
46
|
+
* This is shipped as raw CSS (not precompiled). The @font-face rules and the
|
|
47
|
+
* plain class rules need no Tailwind processing; the consumer can `@import` it
|
|
48
|
+
* directly into its `@import "tailwindcss"` entry.
|
|
49
|
+
*
|
|
50
|
+
* Provenance: named-agents app/globals.css + app/layout.tsx + lib/persona.ts on
|
|
51
|
+
* origin/main (commits 51ee081 color-token-system v2, 62d6f04 tokenized radii,
|
|
52
|
+
* 87268fa mobile padding).
|
|
53
|
+
*/
|
|
54
|
+
|
|
55
|
+
/* ──────────────────────────────────────────────────────────────────
|
|
56
|
+
FONTS — Halant (serif display) + Atkinson Hyperlegible, self-contained.
|
|
57
|
+
The baseline loads Halant via next/font and Atkinson via @font-face. The
|
|
58
|
+
package can't rely on the host loading either, so the envelope ships both via
|
|
59
|
+
@font-face (Google Fonts woff2). @font-face has no ordering constraint
|
|
60
|
+
(unlike @import url()), so it is safe to drop anywhere in the consumer's entry.
|
|
61
|
+
────────────────────────────────────────────────────────────────── */
|
|
62
|
+
@font-face {
|
|
63
|
+
font-family: 'Halant';
|
|
64
|
+
font-style: normal;
|
|
65
|
+
font-weight: 300;
|
|
66
|
+
font-display: swap;
|
|
67
|
+
src: url('https://fonts.gstatic.com/s/halant/v18/u-490qauQGQXz7Yu63LtNVk.woff2')
|
|
68
|
+
format('woff2');
|
|
69
|
+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
70
|
+
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
|
71
|
+
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
72
|
+
}
|
|
73
|
+
@font-face {
|
|
74
|
+
font-family: 'Halant';
|
|
75
|
+
font-style: normal;
|
|
76
|
+
font-weight: 400;
|
|
77
|
+
font-display: swap;
|
|
78
|
+
src: url('https://fonts.gstatic.com/s/halant/v18/u-4-0qauQGQXz7Yu.woff2')
|
|
79
|
+
format('woff2');
|
|
80
|
+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
81
|
+
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
|
82
|
+
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
83
|
+
}
|
|
84
|
+
@font-face {
|
|
85
|
+
font-family: 'Halant';
|
|
86
|
+
font-style: normal;
|
|
87
|
+
font-weight: 500;
|
|
88
|
+
font-display: swap;
|
|
89
|
+
src: url('https://fonts.gstatic.com/s/halant/v18/u-490qauQGQXz7Yu62vtNVk.woff2')
|
|
90
|
+
format('woff2');
|
|
91
|
+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
92
|
+
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
|
93
|
+
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
94
|
+
}
|
|
95
|
+
@font-face {
|
|
96
|
+
font-family: 'Halant';
|
|
97
|
+
font-style: normal;
|
|
98
|
+
font-weight: 600;
|
|
99
|
+
font-display: swap;
|
|
100
|
+
src: url('https://fonts.gstatic.com/s/halant/v18/u-490qauQGQXz7Yu6yPsNVk.woff2')
|
|
101
|
+
format('woff2');
|
|
102
|
+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
103
|
+
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
|
104
|
+
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
105
|
+
}
|
|
106
|
+
@font-face {
|
|
107
|
+
font-family: 'Halant';
|
|
108
|
+
font-style: normal;
|
|
109
|
+
font-weight: 700;
|
|
110
|
+
font-display: swap;
|
|
111
|
+
src: url('https://fonts.gstatic.com/s/halant/v18/u-490qauQGQXz7Yu6098NVk.woff2')
|
|
112
|
+
format('woff2');
|
|
113
|
+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
114
|
+
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
|
115
|
+
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
116
|
+
}
|
|
117
|
+
@font-face {
|
|
118
|
+
font-family: 'Atkinson Hyperlegible';
|
|
119
|
+
font-style: normal;
|
|
120
|
+
font-weight: 400 700;
|
|
121
|
+
font-display: swap;
|
|
122
|
+
src: url('https://fonts.gstatic.com/s/atkinsonhyperlegiblenext/v7/NaPNcYPdHfdVxJw0IfIP0lvYFqijb-UxCtm5_wdGseiJn3o.woff2')
|
|
123
|
+
format('woff2');
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/* ──────────────────────────────────────────────────────────────────
|
|
127
|
+
SCOPE ROOT — baseline tokens, applied ONLY to the named subtree.
|
|
128
|
+
`NamedAgentView` renders `<div data-dialect="named">` around the whole arc;
|
|
129
|
+
these cascade to every section without touching the host page.
|
|
130
|
+
|
|
131
|
+
Two layers:
|
|
132
|
+
• neo SHARED tokens the named markup actually references, RE-POINTED to the
|
|
133
|
+
cream baseline values. This retargets every neo util that reads the var
|
|
134
|
+
and the inline `var(--background)` / `var(--card)` hero/marquee styles.
|
|
135
|
+
• the baseline's own semantic + hue-library + radius tokens, a faithful
|
|
136
|
+
copy of named-agents app/globals.css :root (LIGHT / cream).
|
|
137
|
+
────────────────────────────────────────────────────────────────── */
|
|
138
|
+
[data-dialect='named'] {
|
|
139
|
+
/* ---- neo shared tokens, re-pointed to the cream baseline ----------- */
|
|
140
|
+
/* surfaces */
|
|
141
|
+
--background: oklch(0.945 0.01 95); /* baseline --color-surface */
|
|
142
|
+
--foreground: oklch(0.18 0.008 80); /* baseline --color-fg */
|
|
143
|
+
--card: oklch(0.975 0.005 95); /* baseline --color-surface-raised */
|
|
144
|
+
--card-foreground: oklch(0.18 0.008 80);
|
|
145
|
+
--popover: oklch(0.975 0.005 95);
|
|
146
|
+
--popover-foreground: oklch(0.18 0.008 80);
|
|
147
|
+
--muted: oklch(0.91 0.012 95); /* baseline --color-surface-sunken */
|
|
148
|
+
--muted-foreground: oklch(0.46 0.012 80); /* baseline --color-fg-muted */
|
|
149
|
+
/* primary CTA — neutral ink gradient endpoints collapse to the dark end */
|
|
150
|
+
--primary: oklch(0.06 0 0); /* baseline --color-btn-primary-to */
|
|
151
|
+
--primary-foreground: oklch(0.995 0.005 80); /* --color-btn-primary-fg */
|
|
152
|
+
--secondary: oklch(0.975 0.005 95);
|
|
153
|
+
--secondary-foreground: oklch(0.18 0.008 80);
|
|
154
|
+
--accent: oklch(0.81 0.11 45); /* baseline persimmon --color-accent */
|
|
155
|
+
--accent-foreground: oklch(0.18 0.008 80);
|
|
156
|
+
--border: oklch(0.18 0.008 80 / 0.1); /* baseline --color-border */
|
|
157
|
+
--input: oklch(0.18 0.008 80 / 0.1);
|
|
158
|
+
--ring: oklch(0.18 0.008 80 / 0.35); /* baseline --color-ring */
|
|
159
|
+
--destructive: oklch(0.58 0.18 25);
|
|
160
|
+
--destructive-foreground: oklch(0.995 0.005 80);
|
|
161
|
+
|
|
162
|
+
/* ---- baseline semantic layer (verbatim from globals.css :root) ----- */
|
|
163
|
+
--color-surface: oklch(0.945 0.01 95);
|
|
164
|
+
--color-surface-raised: oklch(0.975 0.005 95);
|
|
165
|
+
--color-surface-sunken: oklch(0.91 0.012 95);
|
|
166
|
+
|
|
167
|
+
--color-fg: oklch(0.18 0.008 80);
|
|
168
|
+
--color-fg-soft: oklch(0.32 0.01 80);
|
|
169
|
+
--color-fg-muted: oklch(0.46 0.012 80);
|
|
170
|
+
|
|
171
|
+
--color-border: oklch(0.18 0.008 80 / 0.1);
|
|
172
|
+
--color-border-strong: oklch(0.18 0.008 80 / 0.25);
|
|
173
|
+
--color-ring: oklch(0.18 0.008 80 / 0.35);
|
|
174
|
+
--color-hover: oklch(0.18 0.008 80 / 0.06);
|
|
175
|
+
|
|
176
|
+
--color-btn-primary-from: oklch(0.315 0.008 250);
|
|
177
|
+
--color-btn-primary-to: oklch(0.06 0 0);
|
|
178
|
+
--color-btn-primary-fg: oklch(0.995 0.005 80);
|
|
179
|
+
|
|
180
|
+
--color-destructive: oklch(0.58 0.18 25);
|
|
181
|
+
--color-destructive-fg: oklch(0.995 0.005 80);
|
|
182
|
+
|
|
183
|
+
/* ---- baseline hue library + persona accent (Priya = persimmon) ----- */
|
|
184
|
+
--hue-teal-soft: oklch(0.95 0.04 210);
|
|
185
|
+
--hue-teal-medium: oklch(0.84 0.095 210);
|
|
186
|
+
--hue-teal-strong: oklch(0.585 0.09 210);
|
|
187
|
+
|
|
188
|
+
--hue-orange-soft: oklch(0.92 0.045 48);
|
|
189
|
+
--hue-orange-medium: oklch(0.81 0.11 45);
|
|
190
|
+
--hue-orange-strong: oklch(0.64 0.165 42);
|
|
191
|
+
|
|
192
|
+
--hue-green-soft: oklch(0.905 0.048 134);
|
|
193
|
+
--hue-green-medium: oklch(0.865 0.07 134);
|
|
194
|
+
--hue-green-strong: oklch(0.635 0.107 134);
|
|
195
|
+
|
|
196
|
+
--hue-sky-blue-soft: oklch(0.95 0.025 235);
|
|
197
|
+
--hue-sky-blue-medium: oklch(0.825 0.1 235);
|
|
198
|
+
--hue-sky-blue-strong: oklch(0.585 0.14 235);
|
|
199
|
+
|
|
200
|
+
--hue-purple-soft: oklch(0.91 0.022 314);
|
|
201
|
+
--hue-purple-medium: oklch(0.86 0.045 314);
|
|
202
|
+
--hue-purple-strong: oklch(0.63 0.065 314);
|
|
203
|
+
|
|
204
|
+
--color-accent-soft: var(--hue-orange-soft);
|
|
205
|
+
--color-accent: var(--hue-orange-medium);
|
|
206
|
+
--color-accent-strong: var(--hue-orange-strong);
|
|
207
|
+
--color-accent-fg: oklch(0.18 0.008 80);
|
|
208
|
+
|
|
209
|
+
/* ---- baseline radii (62d6f04) ------------------------------------- */
|
|
210
|
+
--radius-section: 36px; /* large section containers */
|
|
211
|
+
--radius-image: 64px; /* hero artwork mask */
|
|
212
|
+
|
|
213
|
+
/* ---- fonts — Halant display, Atkinson/Inter body ------------------ */
|
|
214
|
+
--font-halant: 'Halant', ui-serif, Georgia, serif;
|
|
215
|
+
--font-inter: var(--font-inter, 'Atkinson Hyperlegible', system-ui, sans-serif);
|
|
216
|
+
|
|
217
|
+
/* Paint the named surface cream + warm ink, independent of the host's
|
|
218
|
+
dark page, so the editorial sections read on cream. */
|
|
219
|
+
background: var(--color-surface);
|
|
220
|
+
color: var(--color-fg);
|
|
221
|
+
font-family: 'Atkinson Hyperlegible', var(--font-inter), system-ui, sans-serif;
|
|
222
|
+
-webkit-font-smoothing: antialiased;
|
|
223
|
+
-moz-osx-font-smoothing: grayscale;
|
|
224
|
+
text-rendering: optimizeLegibility;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
/* ════════════════════════════════════════════════════════════════════
|
|
228
|
+
NEO UTILITIES — scoped class rules.
|
|
229
|
+
Every neo utility the named markup references, defined under the subtree so
|
|
230
|
+
it wins by specificity and is host-agnostic (and tree-shake-proof). Mapped to
|
|
231
|
+
the cream baseline values.
|
|
232
|
+
════════════════════════════════════════════════════════════════════ */
|
|
233
|
+
|
|
234
|
+
/* —— Serif display face (baseline `font-halant`) ——————————————————— */
|
|
235
|
+
[data-dialect='named'] .font-halant {
|
|
236
|
+
font-family: var(--font-halant);
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
/* —— Backgrounds —————————————————————————————————————————————————— */
|
|
240
|
+
[data-dialect='named'] .bg-background {
|
|
241
|
+
background-color: var(--color-surface);
|
|
242
|
+
}
|
|
243
|
+
[data-dialect='named'] .bg-card {
|
|
244
|
+
background-color: var(--color-surface-raised);
|
|
245
|
+
}
|
|
246
|
+
[data-dialect='named'] .bg-muted {
|
|
247
|
+
background-color: var(--color-surface-sunken);
|
|
248
|
+
}
|
|
249
|
+
[data-dialect='named'] .bg-primary {
|
|
250
|
+
background-color: var(--color-btn-primary-to);
|
|
251
|
+
}
|
|
252
|
+
[data-dialect='named'] .bg-primary\/10 {
|
|
253
|
+
background-color: oklch(0.06 0 0 / 0.1);
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
/* —— Text colors —————————————————————————————————————————————————— */
|
|
257
|
+
[data-dialect='named'] .text-foreground {
|
|
258
|
+
color: var(--color-fg);
|
|
259
|
+
}
|
|
260
|
+
[data-dialect='named'] .text-foreground\/70 {
|
|
261
|
+
color: oklch(0.18 0.008 80 / 0.7);
|
|
262
|
+
}
|
|
263
|
+
[data-dialect='named'] .text-foreground\/60 {
|
|
264
|
+
color: oklch(0.18 0.008 80 / 0.6);
|
|
265
|
+
}
|
|
266
|
+
[data-dialect='named'] .text-muted-foreground {
|
|
267
|
+
color: var(--color-fg-muted);
|
|
268
|
+
}
|
|
269
|
+
[data-dialect='named'] .text-card-foreground {
|
|
270
|
+
color: var(--color-fg);
|
|
271
|
+
}
|
|
272
|
+
[data-dialect='named'] .text-primary {
|
|
273
|
+
color: var(--color-fg);
|
|
274
|
+
}
|
|
275
|
+
[data-dialect='named'] .text-destructive {
|
|
276
|
+
color: var(--color-destructive);
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
/* —— Borders ——————————————————————————————————————————————————————— */
|
|
280
|
+
[data-dialect='named'] .border-border {
|
|
281
|
+
border-color: var(--color-border);
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
/* —— Fills / strokes (svg accents that read muted-foreground) ———————— */
|
|
285
|
+
[data-dialect='named'] .fill-muted-foreground\/20 {
|
|
286
|
+
fill: oklch(0.46 0.012 80 / 0.2);
|
|
287
|
+
}
|
|
288
|
+
[data-dialect='named'] .stroke-muted-foreground\/20 {
|
|
289
|
+
stroke: oklch(0.46 0.012 80 / 0.2);
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
/* —— Custom utilities the baseline markup relies on ———————————————— */
|
|
293
|
+
[data-dialect='named'] .card-shadow {
|
|
294
|
+
box-shadow: 0px 0.602px 0.602px -1.25px rgba(0, 0, 0, 0.36),
|
|
295
|
+
0px 2.289px 2.289px -2.5px rgba(0, 0, 0, 0.32),
|
|
296
|
+
0px 10px 10px -3.75px rgba(0, 0, 0, 0.13);
|
|
297
|
+
}
|
|
298
|
+
[data-dialect='named'] .feature-card-shadow {
|
|
299
|
+
box-shadow: rgba(0, 0, 0, 0.05) 0px 10px 40px -14px;
|
|
300
|
+
}
|
|
301
|
+
[data-dialect='named'] .integration-square-shadow {
|
|
302
|
+
box-shadow: 0px 0px 0px 1px var(--color-border),
|
|
303
|
+
0px 1px 3px 0px rgba(13, 17, 27, 0.12);
|
|
304
|
+
}
|
|
305
|
+
/* Features section overlay — soft fade from surface-raised to transparent. */
|
|
306
|
+
[data-dialect='named'] .features-gradient {
|
|
307
|
+
background: linear-gradient(
|
|
308
|
+
color-mix(in oklch, var(--color-surface-raised) 54%, transparent) 0%,
|
|
309
|
+
transparent 89.4895%
|
|
310
|
+
);
|
|
311
|
+
}
|
|
312
|
+
/* Pricing section overlay — surface-raised glow. */
|
|
313
|
+
[data-dialect='named'] .pricing-gradient {
|
|
314
|
+
background: linear-gradient(
|
|
315
|
+
180deg,
|
|
316
|
+
var(--color-surface-raised) 0%,
|
|
317
|
+
transparent 83.55%
|
|
318
|
+
);
|
|
319
|
+
}
|
package/dist/view/index.js
CHANGED
|
@@ -117,7 +117,7 @@ function Marquee({
|
|
|
117
117
|
// src/components/hero/hero.tsx
|
|
118
118
|
import { Button } from "@mdxui/primitives";
|
|
119
119
|
import { jsx as jsx3, jsxs } from "react/jsx-runtime";
|
|
120
|
-
var
|
|
120
|
+
var isRenderableSrc = (s) => /^(https?:)?\/\//i.test(s.trim()) || /^data:image\//i.test(s.trim());
|
|
121
121
|
var BRAND_LABELS = {
|
|
122
122
|
github: "GitHub",
|
|
123
123
|
gitlab: "GitLab",
|
|
@@ -146,7 +146,12 @@ function Hero({
|
|
|
146
146
|
ctaText = "Get Started",
|
|
147
147
|
ctaHref = "#pricing",
|
|
148
148
|
ctaVariant = "default",
|
|
149
|
-
|
|
149
|
+
// No default: the hero image renders only when the caller supplies a real,
|
|
150
|
+
// resolvable asset. The old `/images/hero/hero-main.png` default 404s on every
|
|
151
|
+
// consumer that doesn't host it (the live priya.studio.sb broken hero). When
|
|
152
|
+
// absent, the hero is single-column, no image (do-design-agency: never use an
|
|
153
|
+
// image hero without a real asset).
|
|
154
|
+
rightImageSrc,
|
|
150
155
|
rightImageAlt = "Portfolio showcase",
|
|
151
156
|
rightImageSizes = "(max-width: 768px) 100vw, 500px",
|
|
152
157
|
showIconOverlay: _showIconOverlay = true,
|
|
@@ -156,8 +161,9 @@ function Hero({
|
|
|
156
161
|
),
|
|
157
162
|
className
|
|
158
163
|
}) {
|
|
164
|
+
const hasHeroImage = !!rightImageSrc && isRenderableSrc(rightImageSrc);
|
|
159
165
|
return /* @__PURE__ */ jsx3("section", { className: cn("relative py-12 md:py-16 px-6 lg:px-12 bg-background", className), children: /* @__PURE__ */ jsxs("div", { className: "max-w-7xl mx-auto p-0 sm:p-16 rounded-none sm:rounded-3xl md:[background:linear-gradient(180deg,var(--card)_0%,transparent_83.55%)]", children: [
|
|
160
|
-
/* @__PURE__ */ jsxs("div", { className: "grid
|
|
166
|
+
/* @__PURE__ */ jsxs("div", { className: cn("grid gap-8 lg:gap-16 items-start mb-16 lg:mb-20", hasHeroImage && "lg:grid-cols-2"), children: [
|
|
161
167
|
/* @__PURE__ */ jsxs("div", { className: "space-y-6 lg:pt-8", children: [
|
|
162
168
|
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "down", delay: 0.1, children: /* @__PURE__ */ jsx3("div", { className: "inline-block", children: /* @__PURE__ */ jsxs(
|
|
163
169
|
"a",
|
|
@@ -172,20 +178,21 @@ function Hero({
|
|
|
172
178
|
]
|
|
173
179
|
}
|
|
174
180
|
) }) }),
|
|
175
|
-
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "up", delay: 0.2, children: /* @__PURE__ */ jsx3("h1", { className: "font-normal text-[clamp(56px,6vw,72px)] leading-tight tracking-tight text-foreground", children: heading }) }),
|
|
181
|
+
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "up", delay: 0.2, children: /* @__PURE__ */ jsx3("h1", { className: "font-halant font-normal text-[clamp(56px,6vw,72px)] leading-tight tracking-tight text-foreground", children: heading }) }),
|
|
176
182
|
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "up", delay: 0.3, children: /* @__PURE__ */ jsx3("p", { className: "text-lg leading-relaxed max-w-lg", children: description }) }),
|
|
177
183
|
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "up", delay: 0.4, trigger: "mount", children: /* @__PURE__ */ jsx3("div", { className: "flex flex-col sm:flex-row gap-3 pt-4", children: /* @__PURE__ */ jsx3(Button, { asChild: true, variant: ctaVariant, children: /* @__PURE__ */ jsxs("a", { href: ctaHref, children: [
|
|
178
184
|
ctaText,
|
|
179
185
|
/* @__PURE__ */ jsx3(HiChevronRight, { className: "w-4 h-4" })
|
|
180
186
|
] }) }) }) })
|
|
181
187
|
] }),
|
|
182
|
-
/* @__PURE__ */ jsx3(ScrollReveal, { direction: "right", delay: 0.2, children: /* @__PURE__ */ jsx3("div", { className: "relative flex justify-center lg:justify-end", children: /* @__PURE__ */ jsx3("div", { className: "relative w-full max-w-lg", children: /* @__PURE__ */ jsx3("div", { className: "relative w-full aspect-square", children: /* @__PURE__ */ jsx3(
|
|
188
|
+
hasHeroImage && /* @__PURE__ */ jsx3(ScrollReveal, { direction: "right", delay: 0.2, children: /* @__PURE__ */ jsx3("div", { className: "relative flex justify-center lg:justify-end", children: /* @__PURE__ */ jsx3("div", { className: "relative w-full max-w-lg", children: /* @__PURE__ */ jsx3("div", { className: "relative w-full aspect-square", children: /* @__PURE__ */ jsx3(
|
|
183
189
|
Image,
|
|
184
190
|
{
|
|
185
191
|
src: rightImageSrc,
|
|
186
192
|
alt: rightImageAlt,
|
|
187
193
|
fill: true,
|
|
188
|
-
className: "object-cover object-left-center
|
|
194
|
+
className: "object-cover object-left-center",
|
|
195
|
+
style: { borderRadius: "var(--radius-image, 1rem)" },
|
|
189
196
|
priority: true,
|
|
190
197
|
sizes: rightImageSizes
|
|
191
198
|
}
|
|
@@ -209,7 +216,7 @@ function Hero({
|
|
|
209
216
|
}
|
|
210
217
|
),
|
|
211
218
|
/* @__PURE__ */ jsx3(Marquee, { className: "relative z-0 py-2 [--gap:1.25rem] sm:[--gap:3rem]", children: marqueeImages.map(
|
|
212
|
-
(src, i) =>
|
|
219
|
+
(src, i) => isRenderableSrc(src) ? /* @__PURE__ */ jsx3(
|
|
213
220
|
"img",
|
|
214
221
|
{
|
|
215
222
|
src,
|
|
@@ -358,13 +365,13 @@ $.Priya.statusReport({
|
|
|
358
365
|
}
|
|
359
366
|
];
|
|
360
367
|
function Features({ heading = "How It Works", description = "Priya handles the repetitive work so you can focus on what matters. Here's how she automates your entire product workflow.", features = defaultFeatures, className }) {
|
|
361
|
-
return /* @__PURE__ */ jsx5("section", { id: "features", className: cn("flex justify-center items-center pb-0 md:pb-10 bg-background", className), children: /* @__PURE__ */ jsxs2("div", { className: "features-gradient flex flex-col items-center w-full relative overflow-visible
|
|
368
|
+
return /* @__PURE__ */ jsx5("section", { id: "features", className: cn("flex justify-center items-center pb-0 md:pb-10 bg-background", className), children: /* @__PURE__ */ jsxs2("div", { className: "features-gradient flex flex-col items-center w-full relative overflow-visible gap-16 h-min max-w-[1400px] py-10 sm:py-20", style: { borderRadius: "var(--radius-section, 36px)" }, children: [
|
|
362
369
|
/* @__PURE__ */ jsx5(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsxs2("div", { className: "text-center w-full px-4 md:px-6 space-y-4", children: [
|
|
363
|
-
/* @__PURE__ */ jsx5("h2", { className: "font-normal text-[clamp(32px,4vw,40px)] leading-tight text-foreground", children: heading }),
|
|
370
|
+
/* @__PURE__ */ jsx5("h2", { className: "font-halant font-normal text-[clamp(32px,4vw,40px)] leading-tight text-foreground", children: heading }),
|
|
364
371
|
/* @__PURE__ */ jsx5("p", { className: "text-base md:text-lg text-muted-foreground max-w-2xl mx-auto", children: description })
|
|
365
372
|
] }) }),
|
|
366
373
|
/* @__PURE__ */ jsx5("div", { className: "w-full px-4 lg:px-18 space-y-10", children: features.map((feature, index) => /* @__PURE__ */ jsx5(ScrollReveal, { direction: "up", delay: index * 0.1, children: /* @__PURE__ */ jsxs2("div", { className: "grid md:grid-cols-2 overflow-hidden bg-card w-full rounded-3xl feature-card-shadow opacity-100 border border-border", children: [
|
|
367
|
-
/* @__PURE__ */ jsxs2("div", { className: "flex flex-col px-
|
|
374
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex flex-col px-4 py-8 lg:px-8 lg:py-12 xl:px-12 xl:py-20", children: [
|
|
368
375
|
/* @__PURE__ */ jsx5("div", { className: "mb-4", children: /* @__PURE__ */ jsx5("span", { className: "inline-flex size-10 items-center justify-center rounded-lg font-mono text-sm font-medium bg-card dark:bg-muted border border-border dark:border-border text-foreground", children: feature.badge }) }),
|
|
369
376
|
/* @__PURE__ */ jsx5("h3", { className: "mb-3 text-2xl font-medium sm:mb-5 md:text-3xl text-foreground", children: feature.title }),
|
|
370
377
|
/* @__PURE__ */ jsx5("div", { className: "mb-8 text-sm sm:mb-10 md:text-base text-muted-foreground", children: feature.description }),
|
|
@@ -409,7 +416,7 @@ function Pricing({
|
|
|
409
416
|
}) {
|
|
410
417
|
return /* @__PURE__ */ jsx6("section", { id: "pricing", className: cn(`pt-12 md:pt-16 pb-10 sm:pb-20 ${backgroundColor}`, className), children: /* @__PURE__ */ jsxs3("div", { className: "max-w-7xl mx-auto p-6 sm:p-16 rounded-none sm:rounded-3xl pricing-gradient", children: [
|
|
411
418
|
/* @__PURE__ */ jsx6(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsxs3("div", { className: "text-center my-16 sm:my-12", children: [
|
|
412
|
-
/* @__PURE__ */ jsx6("h2", { className: "font-normal text-[clamp(32px,4vw,40px)] leading-tight text-foreground mb-4", children: heading }),
|
|
419
|
+
/* @__PURE__ */ jsx6("h2", { className: "font-halant font-normal text-[clamp(32px,4vw,40px)] leading-tight text-foreground mb-4", children: heading }),
|
|
413
420
|
/* @__PURE__ */ jsx6("p", { className: "text-base text-muted-foreground max-w-2xl mx-auto", children: subheading })
|
|
414
421
|
] }) }),
|
|
415
422
|
/* @__PURE__ */ jsx6(ScrollReveal, { direction: "up", delay: 0.2, children: /* @__PURE__ */ jsxs3("div", { className: "bg-card mx-auto flex w-full md:max-w-md lg:max-w-3xl flex-col rounded-3xl border border-border feature-card-shadow p-6 md:p-8 px-6", children: [
|
|
@@ -485,7 +492,7 @@ function PricingTiers({
|
|
|
485
492
|
}) {
|
|
486
493
|
return /* @__PURE__ */ jsx7("section", { id: "pricing", className: cn(`pt-12 md:pt-16 pb-10 sm:pb-20 ${backgroundColor}`, className), children: /* @__PURE__ */ jsxs4("div", { className: "max-w-7xl mx-auto p-6 sm:p-16 rounded-none sm:rounded-3xl pricing-gradient", children: [
|
|
487
494
|
/* @__PURE__ */ jsx7(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsxs4("div", { className: "text-center my-16 sm:my-12", children: [
|
|
488
|
-
/* @__PURE__ */ jsx7("h2", { className: "font-normal text-[clamp(32px,4vw,52px)] leading-tight text-foreground mb-4", children: heading }),
|
|
495
|
+
/* @__PURE__ */ jsx7("h2", { className: "font-halant font-normal text-[clamp(32px,4vw,52px)] leading-tight text-foreground mb-4", children: heading }),
|
|
489
496
|
/* @__PURE__ */ jsx7("p", { className: "text-base text-muted-foreground max-w-2xl mx-auto", children: subheading })
|
|
490
497
|
] }) }),
|
|
491
498
|
/* @__PURE__ */ jsx7("ul", { className: "grid gap-6 lg:grid-cols-3 lg:items-stretch", children: tiers.map((tier, index) => /* @__PURE__ */ jsx7("li", { className: tier.featured ? "lg:col-span-2 flex" : "lg:col-span-1 flex", children: /* @__PURE__ */ jsx7(ScrollReveal, { direction: "up", delay: 0.2 + index * 0.1, className: "w-full", children: /* @__PURE__ */ jsx7(
|
|
@@ -547,7 +554,7 @@ var defaultButtons = [
|
|
|
547
554
|
function CTA({ heading = "Ready to Save 15 Hours Per Week?", subheading = "Setup with Github \u2013 takes 5 minutes.", buttons = defaultButtons, backgroundColor: _backgroundColor, className }) {
|
|
548
555
|
const bgClass = "bg-card";
|
|
549
556
|
return /* @__PURE__ */ jsx8("section", { className: cn(`py-20 md:py-32 px-4 md:px-6 ${bgClass}`, className), children: /* @__PURE__ */ jsx8("div", { className: "max-w-3xl mx-auto text-center", children: /* @__PURE__ */ jsx8(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsxs5("div", { className: "space-y-6", children: [
|
|
550
|
-
/* @__PURE__ */ jsx8("h2", { className: "font-normal text-foreground text-[clamp(32px,5vw,52px)] leading-tight tracking-tight", children: heading }),
|
|
557
|
+
/* @__PURE__ */ jsx8("h2", { className: "font-halant font-normal text-foreground text-[clamp(32px,5vw,52px)] leading-tight tracking-tight", children: heading }),
|
|
551
558
|
/* @__PURE__ */ jsx8("p", { className: "max-w-2xl mx-auto text-[clamp(16px,2vw,18px)] leading-relaxed text-muted-foreground", children: subheading }),
|
|
552
559
|
/* @__PURE__ */ jsx8("div", { className: "flex flex-col sm:flex-row gap-3 justify-center items-center pt-4", children: buttons.map((button, index) => /* @__PURE__ */ jsx8(Button4, { asChild: true, variant: button.variant === "primary" ? "default" : "secondary", children: /* @__PURE__ */ jsxs5("a", { href: button.href, children: [
|
|
553
560
|
button.text,
|
|
@@ -587,8 +594,8 @@ var defaultFaqs = [
|
|
|
587
594
|
];
|
|
588
595
|
function FAQ({ heading = "FAQs", faqs = defaultFaqs, backgroundColor = "bg-background", className }) {
|
|
589
596
|
return /* @__PURE__ */ jsx9("section", { id: "faq", className: cn(`py-20 px-6 lg:px-12 ${backgroundColor}`, className), children: /* @__PURE__ */ jsxs6("div", { className: "max-w-4xl mx-auto", children: [
|
|
590
|
-
/* @__PURE__ */ jsx9(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsx9("div", { className: "text-center mb-12", children: /* @__PURE__ */ jsx9("h2", { className: "font-normal text-[clamp(32px,4vw,52px)] leading-tight text-foreground mb-4", children: heading }) }) }),
|
|
591
|
-
/* @__PURE__ */ jsx9(Accordion, { type: "single", collapsible: true, className: "space-y-4", children: faqs.map((faq, index) => /* @__PURE__ */ jsx9(ScrollReveal, { direction: "up", delay: 0.15 + index * 0.05, children: /* @__PURE__ */ jsxs6(AccordionItem, { value: `item-${index}`, className: "rounded-xl px-6 border border-border bg-card shadow-sm", children: [
|
|
597
|
+
/* @__PURE__ */ jsx9(ScrollReveal, { direction: "up", delay: 0.1, children: /* @__PURE__ */ jsx9("div", { className: "text-center mb-12", children: /* @__PURE__ */ jsx9("h2", { className: "font-halant font-normal text-[clamp(32px,4vw,52px)] leading-tight text-foreground mb-4", children: heading }) }) }),
|
|
598
|
+
/* @__PURE__ */ jsx9(Accordion, { type: "single", collapsible: true, className: "space-y-4", children: faqs.map((faq, index) => /* @__PURE__ */ jsx9(ScrollReveal, { direction: "up", delay: 0.15 + index * 0.05, children: /* @__PURE__ */ jsxs6(AccordionItem, { value: `item-${index}`, className: "rounded-xl px-4 sm:px-6 border border-border bg-card shadow-sm", children: [
|
|
592
599
|
/* @__PURE__ */ jsx9(AccordionTrigger, { className: "hover:no-underline py-5 text-base font-medium text-foreground", children: faq.question }),
|
|
593
600
|
/* @__PURE__ */ jsx9(AccordionContent, { className: "pb-5 text-sm text-muted-foreground leading-relaxed", children: faq.answer })
|
|
594
601
|
] }) }, index)) })
|
|
@@ -1046,7 +1053,7 @@ function mapWorkflows(workflows) {
|
|
|
1046
1053
|
import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1047
1054
|
function NamedAgentView({ content, theme, mode, brandName, hostname }) {
|
|
1048
1055
|
const { hero, problem, features, integration, pricing, faq, cta, contact } = content;
|
|
1049
|
-
return /* @__PURE__ */ jsx15(DialectShell, { theme, mode, children: /* @__PURE__ */ jsxs12(
|
|
1056
|
+
return /* @__PURE__ */ jsx15(DialectShell, { theme, mode, children: /* @__PURE__ */ jsx15("div", { "data-dialect": "named", children: /* @__PURE__ */ jsxs12(
|
|
1050
1057
|
NeoChrome,
|
|
1051
1058
|
{
|
|
1052
1059
|
brandName,
|
|
@@ -1135,7 +1142,7 @@ function NamedAgentView({ content, theme, mode, brandName, hostname }) {
|
|
|
1135
1142
|
)
|
|
1136
1143
|
]
|
|
1137
1144
|
}
|
|
1138
|
-
) });
|
|
1145
|
+
) }) });
|
|
1139
1146
|
}
|
|
1140
1147
|
var view_default = NamedAgentView;
|
|
1141
1148
|
export {
|