@nexa-stack/framework 1.0.0 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -3
- package/package.json +22 -5
- package/packages/server/src/router.ts +36 -12
- package/public/assets/blog-CGOdzgkO.js +1 -0
- package/public/assets/blog-ML7LFtff.js +1 -0
- package/public/assets/components-B_D1ccvJ.js +50 -0
- package/public/assets/components-C67m2tNE.js +1 -0
- package/public/assets/components-DCNIrNdJ.js +50 -0
- package/public/assets/components-DZ9oc9zI.js +1 -0
- package/public/assets/contact-CAfovn36.js +1 -0
- package/public/assets/contact-bMUqmce3.js +1 -0
- package/public/assets/docs-B92Otuxs.js +20 -0
- package/public/assets/docs-BGOHuCe3.js +20 -0
- package/public/assets/docs-BUkg7Pd2.css +1 -0
- package/public/assets/echarts-mount-DdBiYEc1.js +19 -0
- package/public/assets/echarts-mount-kJrXh_za.js +19 -0
- package/public/assets/echarts-nexa-BsAEVjT0.js +1 -0
- package/public/assets/integration-BNpFB3SL.js +1 -0
- package/public/assets/integration-Br6tmvWh.js +1 -0
- package/public/assets/integration-D7vdPco_.js +1 -0
- package/public/assets/main-BBkehs0N.js +1 -0
- package/public/assets/main-Cx_-Fq0O.css +1 -0
- package/public/assets/main-ny0uOGg1.js +1 -0
- package/public/assets/src-B4_Kaae6.css +1 -0
- package/public/assets/src-BfdoaLcc.js +1 -0
- package/public/assets/src-D__MdyFu.js +1 -0
- package/public/cards/README.md +17 -0
- package/public/cards/bloom.jpg +0 -0
- package/public/favicon.svg +11 -0
- package/public/nexa-hero-sculpture-1280.png +0 -0
- package/public/nexa-hero-sculpture-640.png +0 -0
- package/public/nexa-hero-sculpture-960.png +0 -0
- package/public/nexa-hero-sculpture.png +0 -0
- package/public/nexa-hero-sculpture.webp +0 -0
- package/public/nexa-mark-24.png +0 -0
- package/public/nexa-mark-256.png +0 -0
- package/public/nexa-mark-32.png +0 -0
- package/public/nexa-mark-40.png +0 -0
- package/public/nexa-mark-48.png +0 -0
- package/public/nexa-mark-512.png +0 -0
- package/public/nexa-mark-64.png +0 -0
- package/public/nexa-mark-96.png +0 -0
- package/public/nexa-mark-apple.png +0 -0
- package/public/nexa-mark-product-256.png +0 -0
- package/public/nexa-mark-product.png +0 -0
- package/public/nexa-mark-source.png +0 -0
- package/public/nexa-mark-trim.png +0 -0
- package/public/nexa-mark.png +0 -0
- package/public/nexa-mark.webp +0 -0
- package/public/nexa-palette-vision.png +0 -0
- package/public/nexa-wordmark.png +0 -0
- package/public/nexa-wordmark.webp +0 -0
- package/public/og.png +0 -0
- package/public/site/about.html +101 -0
- package/public/site/blog.html +87 -0
- package/public/site/components.html +251 -0
- package/public/site/contact.html +72 -0
- package/public/site/docs/buttons.html +157 -0
- package/public/site/docs/cards.html +159 -0
- package/public/site/docs/colors.html +216 -0
- package/public/site/docs/commands.html +170 -0
- package/public/site/docs/data.html +122 -0
- package/public/site/docs/feedback.html +111 -0
- package/public/site/docs/forms.html +117 -0
- package/public/site/docs/icons.html +125 -0
- package/public/site/docs/index.html +82 -0
- package/public/site/docs/installation.html +83 -0
- package/public/site/docs/layout.html +116 -0
- package/public/site/docs/media.html +96 -0
- package/public/site/docs/navigation.html +122 -0
- package/public/site/docs/overlays.html +95 -0
- package/public/site/docs/pickers.html +126 -0
- package/public/site/docs/sections.html +111 -0
- package/public/site/docs/typography.html +97 -0
- package/public/site/docs/usage.html +76 -0
- package/public/site/features.html +107 -0
- package/public/site/index.html +117 -0
- package/public/site/integration.html +43 -0
- package/public/site/pricing.html +87 -0
- package/ui/cards/README.md +17 -0
- package/ui/cards/bloom.jpg +0 -0
- package/ui/echarts-mount-DWNKcqeo.js +22945 -0
- package/ui/echarts-nexa-BY8eW9ug.js +456 -0
- package/ui/favicon.svg +11 -0
- package/ui/nexa-hero-sculpture-1280.png +0 -0
- package/ui/nexa-hero-sculpture-640.png +0 -0
- package/ui/nexa-hero-sculpture-960.png +0 -0
- package/ui/nexa-hero-sculpture.png +0 -0
- package/ui/nexa-hero-sculpture.webp +0 -0
- package/ui/nexa-mark-24.png +0 -0
- package/ui/nexa-mark-256.png +0 -0
- package/ui/nexa-mark-32.png +0 -0
- package/ui/nexa-mark-40.png +0 -0
- package/ui/nexa-mark-48.png +0 -0
- package/ui/nexa-mark-512.png +0 -0
- package/ui/nexa-mark-64.png +0 -0
- package/ui/nexa-mark-96.png +0 -0
- package/ui/nexa-mark-apple.png +0 -0
- package/ui/nexa-mark-product-256.png +0 -0
- package/ui/nexa-mark-product.png +0 -0
- package/ui/nexa-mark-source.png +0 -0
- package/ui/nexa-mark-trim.png +0 -0
- package/ui/nexa-mark.png +0 -0
- package/ui/nexa-mark.webp +0 -0
- package/ui/nexa-palette-vision.png +0 -0
- package/ui/nexa-wordmark.png +0 -0
- package/ui/nexa-wordmark.webp +0 -0
- package/ui/nexa.css +2 -0
- package/ui/nexa.js +2971 -0
- package/ui/nexa.umd.js +80 -0
- package/ui/og.png +0 -0
- package/ui/types/components/art.d.ts +11 -0
- package/ui/types/components/card-layouts.d.ts +11 -0
- package/ui/types/components/card.d.ts +11 -0
- package/ui/types/components/charts.d.ts +7 -0
- package/ui/types/components/extra.d.ts +2 -0
- package/ui/types/components/helpers.d.ts +18 -0
- package/ui/types/components/icons.d.ts +24 -0
- package/ui/types/components/index.d.ts +2 -0
- package/ui/types/components/pickers.d.ts +8 -0
- package/ui/types/components/structure.d.ts +2 -0
- package/ui/types/core/behaviors.d.ts +2 -0
- package/ui/types/core/brand-assets.d.ts +44 -0
- package/ui/types/core/colormap.d.ts +49 -0
- package/ui/types/core/echarts-mount.d.ts +5 -0
- package/ui/types/core/echarts-nexa.d.ts +71 -0
- package/ui/types/core/parser.d.ts +11 -0
- package/ui/types/core/registry.d.ts +13 -0
- package/ui/types/core/renderer.d.ts +14 -0
- package/ui/types/core/schema.d.ts +8 -0
- package/ui/types/core/toast.d.ts +11 -0
- package/ui/types/core/validate.d.ts +1 -0
- package/ui/types/index.d.ts +50 -0
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" dir="ltr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<title>Usage - Nexa Docs</title>
|
|
7
|
+
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
8
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
9
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
10
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
11
|
+
<style>
|
|
12
|
+
/* Inline boot: hide chrome until docs.ts adds .doc-ready (stops HTML flicker) */
|
|
13
|
+
html:not(.doc-ready) body.doc-body > .doc-shell,
|
|
14
|
+
html:not(.doc-ready) body.doc-body > .nexa-host { opacity: 0; }
|
|
15
|
+
html { background: #F7F9FC; }
|
|
16
|
+
</style>
|
|
17
|
+
<script type="module" crossorigin src="/assets/components-B_D1ccvJ.js"></script>
|
|
18
|
+
<script type="module" crossorigin src="/assets/docs-BGOHuCe3.js"></script>
|
|
19
|
+
<link rel="stylesheet" crossorigin href="/assets/docs-BUkg7Pd2.css">
|
|
20
|
+
</head>
|
|
21
|
+
<body class="doc-body" nexa="luxury light brand font-inter essential">
|
|
22
|
+
|
|
23
|
+
<header
|
|
24
|
+
nexa="header vision dock"
|
|
25
|
+
logo-href="/site/index.html"
|
|
26
|
+
links="Docs|/site/docs/index.html,Home|/site/index.html,Components|/site/components.html,Features|/site/features.html,Pricing|/site/pricing.html,About|/site/about.html,Blog|/site/blog.html,Contact|/site/contact.html"
|
|
27
|
+
cta="Start free"
|
|
28
|
+
cta-href="/site/pricing.html"></header>
|
|
29
|
+
|
|
30
|
+
<div class="doc-progress" data-doc-progress></div>
|
|
31
|
+
<div class="doc-shell">
|
|
32
|
+
<button class="doc-menu-toggle" type="button" data-doc-menu aria-expanded="false" aria-controls="doc-side">Browse docs <span>⌄</span></button>
|
|
33
|
+
<aside class="doc-side" id="doc-side" data-doc-side></aside>
|
|
34
|
+
<main class="doc-main">
|
|
35
|
+
<div class="doc-crumb"><a href="/site/docs/index.html">Documentation</a><span>/</span><span>Usage</span></div>
|
|
36
|
+
<div class="doc-page-head">
|
|
37
|
+
<div><h1>Usage</h1><p class="doc-lead">Commands live on the <code>nexa</code> attribute. Props use HTML attributes.</p></div>
|
|
38
|
+
<button type="button" class="doc-search" data-doc-search aria-label="Search documentation"><span>Search docs</span><kbd>⌘ K</kbd></button>
|
|
39
|
+
</div>
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
<h2>Command shape</h2>
|
|
43
|
+
<p><code>nexa="<component> [variant] [size] [state]…"</code></p>
|
|
44
|
+
|
|
45
|
+
<h3>Fields</h3>
|
|
46
|
+
<p>Type modifiers + float / required.</p>
|
|
47
|
+
<div class="doc-example">
|
|
48
|
+
<div class="doc-opts-wrap"><div class="doc-opts"><span class="doc-opt-cmd"><code>field</code></span><span class="doc-opt is-mod">text</span><span class="doc-opt is-mod">email</span><span class="doc-opt is-mod">password</span><span class="doc-opt is-mod">number</span><span class="doc-opt is-mod">date</span><span class="doc-opt is-mod">file</span><span class="doc-opt is-mod">search</span><span class="doc-opt is-mod">tel</span><span class="doc-opt is-mod">url</span><span class="doc-opt is-mod">color</span><span class="doc-opt is-mod">range</span><span class="doc-opt is-mod">checkbox</span><span class="doc-opt is-mod">radio</span><span class="doc-opt is-mod">hidden</span><span class="doc-opt is-mod">small</span><span class="doc-opt is-mod">medium</span><span class="doc-opt is-mod">large</span><span class="doc-opt is-mod">required</span><span class="doc-opt is-mod">disabled</span><span class="doc-opt is-mod">readonly</span><span class="doc-opt is-mod">error</span><span class="doc-opt is-mod">success</span><span class="doc-opt is-mod">float</span><span class="doc-opt is-mod">checked</span></div></div>
|
|
49
|
+
<div class="doc-preview">
|
|
50
|
+
<div class="doc-demo"><span class="doc-demo-label">email</span><div nexa="field email" label="Email" style="min-width:200px"></div></div>
|
|
51
|
+
<div class="doc-demo"><span class="doc-demo-label">float</span><div nexa="field email float" label="Work email" style="min-width:200px"></div></div>
|
|
52
|
+
<div class="doc-demo"><span class="doc-demo-label">required</span><div nexa="field password float required" label="Password" style="min-width:200px"></div></div>
|
|
53
|
+
</div>
|
|
54
|
+
<div class="doc-code">
|
|
55
|
+
<div class="doc-code-bar"><button type="button" class="doc-copy" data-copy="use-field">Copy</button></div>
|
|
56
|
+
<pre><code id="use-field"><div nexa="field email" label="Email"></div>
|
|
57
|
+
<div nexa="field email float" label="Work email"></div>
|
|
58
|
+
<div nexa="field password float required" label="Password"></div></code></pre>
|
|
59
|
+
</div>
|
|
60
|
+
</div>
|
|
61
|
+
|
|
62
|
+
<h2>Aliases</h2>
|
|
63
|
+
|
|
64
|
+
<ul>
|
|
65
|
+
<li><code>btn</code> → <code>button</code></li>
|
|
66
|
+
<li>Official header uses mark + wordmark automatically with <code>header vision</code></li>
|
|
67
|
+
</ul>
|
|
68
|
+
</main>
|
|
69
|
+
<aside class="doc-outline" data-doc-outline aria-label="On this page"></aside>
|
|
70
|
+
</div>
|
|
71
|
+
<dialog class="doc-search-dialog" data-doc-dialog aria-label="Search documentation">
|
|
72
|
+
<div class="doc-search-box"><span aria-hidden="true">⌕</span><input data-doc-search-input type="search" placeholder="Search pages and components" autocomplete="off"><kbd>Esc</kbd></div>
|
|
73
|
+
<div class="doc-search-results" data-doc-search-results></div>
|
|
74
|
+
</dialog>
|
|
75
|
+
</body>
|
|
76
|
+
</html>
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" dir="ltr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<title>Nexa — Features & Widgets</title>
|
|
7
|
+
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
8
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
9
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
10
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
|
11
|
+
<script type="module" crossorigin src="/assets/components-B_D1ccvJ.js"></script>
|
|
12
|
+
<script type="module" crossorigin src="/assets/main-ny0uOGg1.js"></script>
|
|
13
|
+
<link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
|
|
14
|
+
</head>
|
|
15
|
+
<body nexa="luxury light brand font-inter essential">
|
|
16
|
+
|
|
17
|
+
<header
|
|
18
|
+
nexa="header vision dock"
|
|
19
|
+
logo-href="/site/index.html"
|
|
20
|
+
links="Home|/site/index.html,Components|/site/components.html,Features|/site/features.html,Pricing|/site/pricing.html,About|/site/about.html,Blog|/site/blog.html,Contact|/site/contact.html"
|
|
21
|
+
cta="Start free"
|
|
22
|
+
cta-href="/site/pricing.html"></header>
|
|
23
|
+
|
|
24
|
+
<section
|
|
25
|
+
nexa="hero minimal centered"
|
|
26
|
+
eyebrow="WIDGET COVERAGE"
|
|
27
|
+
title="Everything you need|for a real product"
|
|
28
|
+
text="Pickers, feedback layers, data widgets, and structure — all driven by short nexa commands."
|
|
29
|
+
cta="Compare plans"
|
|
30
|
+
cta-href="/site/pricing.html"></section>
|
|
31
|
+
|
|
32
|
+
<section
|
|
33
|
+
nexa="features cards-3"
|
|
34
|
+
eyebrow="COVERAGE"
|
|
35
|
+
title="From landing page to production app."
|
|
36
|
+
items="Forms|Validate, fields, autocomplete, date and time.;Feedback|Alerts, toast queue, modal, sheet, offcanvas.;Data|Tables, ECharts, stats, tree, timeline, transfer.;Pickers|dp · tp · ac · rating · stepper · chip · fab."></section>
|
|
37
|
+
|
|
38
|
+
<div nexa="container">
|
|
39
|
+
<div nexa="stack gap-large" style="padding-block:clamp(40px,6vw,72px)">
|
|
40
|
+
|
|
41
|
+
<div nexa="grid cols-2 gap-large">
|
|
42
|
+
<div nexa="datepicker" name="launch" label="Launch date" value="2026-08-28"></div>
|
|
43
|
+
<div nexa="timepicker" name="launch_time" label="Launch time" value="14:30" step="15"></div>
|
|
44
|
+
</div>
|
|
45
|
+
|
|
46
|
+
<div nexa="autocomplete" name="stack" label="Stack" placeholder="Search frameworks…"
|
|
47
|
+
options="Nexa,Bootstrap,Material,Tailwind,React,Vue,Svelte"></div>
|
|
48
|
+
|
|
49
|
+
<div nexa="grid cols-2 gap-large">
|
|
50
|
+
<div nexa="chart area pro"
|
|
51
|
+
title="Weekly activity"
|
|
52
|
+
subtitle="ECharts area chart"
|
|
53
|
+
data="W1|40;W2|55;W3|48;W4|72;W5|68;W6|90"></div>
|
|
54
|
+
<div nexa="chart line pro"
|
|
55
|
+
title="Daily commands"
|
|
56
|
+
subtitle="ECharts line chart"
|
|
57
|
+
data="Sun|12;Mon|19;Tue|15;Wed|28;Thu|24;Fri|32;Sat|30"></div>
|
|
58
|
+
</div>
|
|
59
|
+
|
|
60
|
+
<div nexa="table striped hover"
|
|
61
|
+
headers="Widget|Status|Notes"
|
|
62
|
+
rows="Autocomplete|Ready|Filterable combobox;Bottom sheet|Ready|data-sheet-open;Form validate|Ready|nexa:valid event;Toast queue|Ready|nexa.toast() API"></div>
|
|
63
|
+
|
|
64
|
+
<div nexa="grid cols-2 gap-large">
|
|
65
|
+
<div nexa="tree"
|
|
66
|
+
items="src/core/parser.ts,src/core/renderer.ts,src/components/pickers.ts,docs/WIDGETS_LOCKED.md"></div>
|
|
67
|
+
<div nexa="transfer"
|
|
68
|
+
source="Dashboard,Billing,Team,API Keys,Webhooks"
|
|
69
|
+
target="Team,API Keys"
|
|
70
|
+
left-label="Available"
|
|
71
|
+
right-label="Selected"></div>
|
|
72
|
+
</div>
|
|
73
|
+
|
|
74
|
+
<div class="row" style="display:flex;flex-wrap:wrap;gap:12px;align-items:center">
|
|
75
|
+
<button nexa="btn primary pill" data-sheet-open="demo-sheet">Open sheet</button>
|
|
76
|
+
<button nexa="btn outline" data-offcanvas-open="demo-panel">Open offcanvas</button>
|
|
77
|
+
<span nexa="tooltip" label="?" text="Sheet and offcanvas — mobile-friendly layers."></span>
|
|
78
|
+
<a nexa="btn ghost" href="/site/components.html">Full library →</a>
|
|
79
|
+
</div>
|
|
80
|
+
<div id="demo-sheet" nexa="sheet" title="Quick settings" text="Bottom sheet — great for mobile actions." cta="Done"></div>
|
|
81
|
+
<div id="demo-panel" nexa="offcanvas" title="Side panel" text="Offcanvas navigation or settings."></div>
|
|
82
|
+
|
|
83
|
+
<div nexa="carousel autoplay"
|
|
84
|
+
interval="4000"
|
|
85
|
+
slides="Pickers|Date, time, autocomplete, rating.;Layers|Modal, sheet, offcanvas, toast queue.;Structure|Tree, timeline, transfer lists."></div>
|
|
86
|
+
|
|
87
|
+
</div>
|
|
88
|
+
</div>
|
|
89
|
+
|
|
90
|
+
<section
|
|
91
|
+
nexa="cta bold"
|
|
92
|
+
eyebrow="READY?"
|
|
93
|
+
title="Pick your plan|and ship."
|
|
94
|
+
cta="View pricing"
|
|
95
|
+
cta-href="/site/pricing.html"></section>
|
|
96
|
+
|
|
97
|
+
<footer
|
|
98
|
+
nexa="footer dark"
|
|
99
|
+
logo="Nexa"
|
|
100
|
+
logo-image="/nexa-mark.png"
|
|
101
|
+
logo-href="/site/index.html"
|
|
102
|
+
copy="© 2026 Nexa Framework"
|
|
103
|
+
product-links="Components|/site/components.html;Features|/site/features.html;Pricing|/site/pricing.html"
|
|
104
|
+
resource-links="Contact|/site/contact.html"></footer>
|
|
105
|
+
|
|
106
|
+
</body>
|
|
107
|
+
</html>
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" dir="ltr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<title>Nexa — Interfaces from a single command</title>
|
|
7
|
+
<meta name="description" content="Nexa is a Vanilla TypeScript UI engine that turns short commands into polished, responsive interfaces.">
|
|
8
|
+
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
9
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
10
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
11
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
|
12
|
+
<script type="module" crossorigin src="/assets/components-B_D1ccvJ.js"></script>
|
|
13
|
+
<script type="module" crossorigin src="/assets/main-ny0uOGg1.js"></script>
|
|
14
|
+
<link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
|
|
15
|
+
</head>
|
|
16
|
+
<body nexa="luxury light brand font-inter essential">
|
|
17
|
+
|
|
18
|
+
<header
|
|
19
|
+
nexa="header vision dock"
|
|
20
|
+
logo-href="/site/index.html"
|
|
21
|
+
links="Docs|/site/docs/index.html,Components|/site/components.html,Features|/site/features.html,Pricing|/site/pricing.html,About|/site/about.html,Blog|/site/blog.html,Contact|/site/contact.html"
|
|
22
|
+
cta="Start free"
|
|
23
|
+
cta-href="/site/pricing.html"></header>
|
|
24
|
+
|
|
25
|
+
<section
|
|
26
|
+
id="top"
|
|
27
|
+
nexa="hero vision split luxury"
|
|
28
|
+
eyebrow="NEXA FRAMEWORK"
|
|
29
|
+
title="Modern interfaces|from a single command"
|
|
30
|
+
text="A complete Vanilla TypeScript UI engine. Headers, sections, cards, forms, charts, pickers, and overlays — described in plain words, rendered with luxury defaults. No React required."
|
|
31
|
+
cta="Explore features"
|
|
32
|
+
cta-href="/site/features.html"
|
|
33
|
+
cta2="View pricing"
|
|
34
|
+
cta2-href="/site/pricing.html"></section>
|
|
35
|
+
|
|
36
|
+
<section
|
|
37
|
+
nexa="logos"
|
|
38
|
+
label="BUILT ON OPEN, DEPLOYED EVERYWHERE"
|
|
39
|
+
brands="VANILLA JS,TYPESCRIPT,VITE,ECHARTS,LUCIDE"></section>
|
|
40
|
+
|
|
41
|
+
<section
|
|
42
|
+
id="features"
|
|
43
|
+
nexa="features cards-4"
|
|
44
|
+
eyebrow="WHY NEXA"
|
|
45
|
+
title="Shortcut speed. Custom-quality output."
|
|
46
|
+
items="01|Command first|Ship full sections with human phrases, not utility soup.;02|Luxury defaults|Premium, responsive UI out of the box — no design debt.;03|Color Map|One seed color dresses every component, start to finish.;04|No lock-in|Raw HTML, CSS, and JS — it stays your stack."></section>
|
|
47
|
+
|
|
48
|
+
<div nexa="container">
|
|
49
|
+
<div nexa="stack gap-large" style="padding-block:clamp(40px,6vw,72px)">
|
|
50
|
+
|
|
51
|
+
<div nexa="stat" stats="Components|66;Commands|1;Themes|Unlimited;Bundle|Vanilla TS"></div>
|
|
52
|
+
|
|
53
|
+
<div nexa="grid cols-2 gap-large">
|
|
54
|
+
<div nexa="chart bar pro"
|
|
55
|
+
title="Adoption in 6 months"
|
|
56
|
+
subtitle="Teams shipping with Nexa — ECharts"
|
|
57
|
+
data="Jan|42;Feb|58;Mar|71;Apr|65;May|88;Jun|96"></div>
|
|
58
|
+
<div nexa="chart donut pro"
|
|
59
|
+
title="Plan mix"
|
|
60
|
+
subtitle="Active subscriptions"
|
|
61
|
+
data="Pro|48;Studio|27;Starter|25"></div>
|
|
62
|
+
</div>
|
|
63
|
+
|
|
64
|
+
<div nexa="stack gap-small">
|
|
65
|
+
<div nexa="alert success" title="Production ready" text="Full widget set — pickers, feedback layers, structure, and form validation."></div>
|
|
66
|
+
<div nexa="tabs pills" tabs="Idea|Describe the page in minutes.;Widgets|Date · Time · Autocomplete · Sheet · Tree · Timeline · Transfer.;Brand|One mark, one gradient, the whole site aligned."></div>
|
|
67
|
+
</div>
|
|
68
|
+
|
|
69
|
+
<div nexa="grid cols-3 gap-large">
|
|
70
|
+
<div nexa="stepper" steps="Design,Build,Launch" active="2"></div>
|
|
71
|
+
<div nexa="rating" value="4.8" max="5"></div>
|
|
72
|
+
<div nexa="chips" items="Autocomplete,Sheet,Tree,Transfer,Validate"></div>
|
|
73
|
+
</div>
|
|
74
|
+
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
|
+
|
|
78
|
+
<section
|
|
79
|
+
nexa="testimonials featured"
|
|
80
|
+
eyebrow="FROM BUILDERS"
|
|
81
|
+
quote="I described the page in minutes — Nexa handled the hours of layout and polish."
|
|
82
|
+
name="Sarah H."
|
|
83
|
+
role="Product Designer"></section>
|
|
84
|
+
|
|
85
|
+
<section
|
|
86
|
+
nexa="posts cards-3 compact"
|
|
87
|
+
eyebrow="FROM THE BLOG"
|
|
88
|
+
title="Latest posts"
|
|
89
|
+
items="Color Map|One hex dresses the whole site.|Aug 28;Pickers|Date, time, autocomplete, rating.|Aug 25;Structure|Tree, timeline, and transfer lists.|Aug 22"></section>
|
|
90
|
+
|
|
91
|
+
<section
|
|
92
|
+
id="pricing"
|
|
93
|
+
nexa="pricing"
|
|
94
|
+
eyebrow="START BUILDING"
|
|
95
|
+
title="Plans for every stage."
|
|
96
|
+
popular="1"
|
|
97
|
+
plans="Starter|0|Explore the engine and personal projects.|Core components,Responsive themes,Community updates|Start free;Pro|19|Ship premium products with the full kit.|All widgets + pickers,Featured presets,Priority updates|Choose Pro;Studio|49|For teams shipping many experiences.|Unlimited projects,Custom tokens,Team license|Choose Studio"></section>
|
|
98
|
+
|
|
99
|
+
<section
|
|
100
|
+
nexa="cta bold"
|
|
101
|
+
eyebrow="NEXT STEP"
|
|
102
|
+
title="Describe it.|Nexa builds it."
|
|
103
|
+
cta="Browse components"
|
|
104
|
+
cta-href="/site/components.html"></section>
|
|
105
|
+
|
|
106
|
+
<footer
|
|
107
|
+
nexa="footer dark"
|
|
108
|
+
logo="Nexa"
|
|
109
|
+
logo-image="/nexa-mark.png"
|
|
110
|
+
logo-href="/site/index.html"
|
|
111
|
+
copy="© 2026 Nexa Framework"
|
|
112
|
+
product-links="Components|/site/components.html;Features|/site/features.html;Pricing|/site/pricing.html;Blog|/site/blog.html"
|
|
113
|
+
resource-links="About|/site/about.html;Contact|/site/contact.html;GitHub|#"
|
|
114
|
+
company-links="Privacy|#;Terms|#;Support|/site/contact.html"></footer>
|
|
115
|
+
|
|
116
|
+
</body>
|
|
117
|
+
</html>
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" dir="ltr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<title>Nexa + Nexa Stack</title>
|
|
7
|
+
<meta name="description" content="A live Nexa frontend connected to the Nexa Stack REST API.">
|
|
8
|
+
<script type="module" crossorigin src="/assets/integration-D7vdPco_.js"></script>
|
|
9
|
+
<link rel="modulepreload" crossorigin href="/assets/components-B_D1ccvJ.js">
|
|
10
|
+
<link rel="modulepreload" crossorigin href="/assets/main-ny0uOGg1.js">
|
|
11
|
+
<link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
|
|
12
|
+
</head>
|
|
13
|
+
<body nexa="luxury light brand font-inter essential">
|
|
14
|
+
<header nexa="header vision dock" logo-href="/site/index.html" links="Home|/site/index.html,Docs|/site/docs/index.html,Integration|/site/integration.html" cta="Admin" cta-href="/admin"></header>
|
|
15
|
+
|
|
16
|
+
<section nexa="hero centered minimal medium" eyebrow="LIVE BACKEND BRIDGE" title="Nexa UI +|Nexa Stack API" text="This page is served by the backend and reads/writes the posts resource through the same-origin REST API."></section>
|
|
17
|
+
|
|
18
|
+
<main nexa="container">
|
|
19
|
+
<div nexa="grid cols-2 gap-large" style="padding-block:48px">
|
|
20
|
+
<form id="login-form" nexa="form validate">
|
|
21
|
+
<small>AUTHENTICATION</small><h2>Connect your account</h2>
|
|
22
|
+
<div nexa="field email required float" name="email" label="Email"></div>
|
|
23
|
+
<div nexa="field password required float" name="password" label="Password"></div>
|
|
24
|
+
<button nexa="btn primary pill" type="submit">Sign in to API</button>
|
|
25
|
+
<p id="login-message" aria-live="polite">Use an account from your Nexa Stack backend.</p>
|
|
26
|
+
</form>
|
|
27
|
+
<form id="post-form" nexa="form validate" hidden>
|
|
28
|
+
<div nexa="field text required float" name="title" label="Post title"></div>
|
|
29
|
+
<div nexa="textarea required float" name="body" label="Post body"></div>
|
|
30
|
+
<button nexa="btn primary pill" type="submit">Create post</button>
|
|
31
|
+
<p id="post-message" aria-live="polite"></p>
|
|
32
|
+
</form>
|
|
33
|
+
<section aria-labelledby="posts-title" id="posts-section" hidden>
|
|
34
|
+
<small>LIVE RESOURCE</small><h2 id="posts-title">Latest posts</h2>
|
|
35
|
+
<div id="posts-list" nexa="stack gap-small"></div>
|
|
36
|
+
</section>
|
|
37
|
+
</div>
|
|
38
|
+
</main>
|
|
39
|
+
|
|
40
|
+
<section nexa="cta bold" eyebrow="ONE ORIGIN" title="No proxy.|No CORS surprises." cta="Open API" cta-href="/api"></section>
|
|
41
|
+
<footer nexa="footer dark simple" logo="Nexa" logo-href="/site/index.html" copy="Nexa Framework + Nexa Stack"></footer>
|
|
42
|
+
</body>
|
|
43
|
+
</html>
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" dir="ltr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
+
<title>Nexa — Pricing</title>
|
|
7
|
+
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
8
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
9
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
10
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
|
11
|
+
<script type="module" crossorigin src="/assets/components-B_D1ccvJ.js"></script>
|
|
12
|
+
<script type="module" crossorigin src="/assets/main-ny0uOGg1.js"></script>
|
|
13
|
+
<link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
|
|
14
|
+
</head>
|
|
15
|
+
<body nexa="luxury light brand font-inter essential">
|
|
16
|
+
|
|
17
|
+
<header
|
|
18
|
+
nexa="header vision dock"
|
|
19
|
+
logo-href="/site/index.html"
|
|
20
|
+
links="Home|/site/index.html,Components|/site/components.html,Features|/site/features.html,Pricing|/site/pricing.html,About|/site/about.html,Blog|/site/blog.html,Contact|/site/contact.html"
|
|
21
|
+
cta="Contact sales"
|
|
22
|
+
cta-href="/site/contact.html"></header>
|
|
23
|
+
|
|
24
|
+
<section
|
|
25
|
+
nexa="hero minimal centered"
|
|
26
|
+
eyebrow="PRICING"
|
|
27
|
+
title="Simple plans|that scale with you"
|
|
28
|
+
text="Start free. Upgrade to Pro when you ship. Studio for teams."
|
|
29
|
+
cta="Talk to us"
|
|
30
|
+
cta-href="/site/contact.html"></section>
|
|
31
|
+
|
|
32
|
+
<section
|
|
33
|
+
id="plans"
|
|
34
|
+
nexa="pricing"
|
|
35
|
+
eyebrow="PLANS"
|
|
36
|
+
title="Use Nexa at every stage."
|
|
37
|
+
popular="1"
|
|
38
|
+
plans="Starter|0|Explore the engine and personal projects.|Core components,Responsive themes,Community updates|Start free;Pro|19|Ship premium products with the full kit.|All widgets + pickers,ECharts charts,Priority support|Choose Pro;Studio|49|For teams shipping many experiences.|Unlimited projects,Custom Color Maps,Team license|Choose Studio"></section>
|
|
39
|
+
|
|
40
|
+
<div nexa="container">
|
|
41
|
+
<div nexa="stack gap-large" style="padding-block:clamp(32px,5vw,64px)">
|
|
42
|
+
|
|
43
|
+
<div nexa="table striped hover compact"
|
|
44
|
+
headers="Feature|Starter|Pro|Studio"
|
|
45
|
+
rows="UI components|45+|50+|50+;Pickers + structure|Basic|Full|Full;ECharts (pro)|—|Yes|Yes;Form validate|Yes|Yes|Yes;Commercial license|—|Yes|Yes"></div>
|
|
46
|
+
|
|
47
|
+
<div nexa="grid cols-2 gap-large">
|
|
48
|
+
<section nexa="checkout compact"
|
|
49
|
+
title="Complete order"
|
|
50
|
+
plan="Pro Plan"
|
|
51
|
+
period="Monthly · renews automatically"
|
|
52
|
+
total="$19"></section>
|
|
53
|
+
<div nexa="stack gap-small">
|
|
54
|
+
<div nexa="alert info" title="Flexible billing" text="Cancel anytime. No annual lock-in on Starter and Pro."></div>
|
|
55
|
+
<div nexa="accordion"
|
|
56
|
+
items="Is there a trial?|Starter is free forever. Pro includes a 14-day trial.;Can I upgrade?|Yes — instantly from your account.;Enterprise?|Contact us for custom SLA and seats.;Refunds?|30-day guarantee on your first Pro payment."></div>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
|
|
60
|
+
</div>
|
|
61
|
+
</div>
|
|
62
|
+
|
|
63
|
+
<section
|
|
64
|
+
nexa="testimonials featured"
|
|
65
|
+
eyebrow="TESTIMONIALS"
|
|
66
|
+
quote="We went from wireframe to a polished landing page in one day — Nexa changed our velocity."
|
|
67
|
+
name="Omar N."
|
|
68
|
+
role="CTO, SaaS startup"></section>
|
|
69
|
+
|
|
70
|
+
<section
|
|
71
|
+
nexa="cta bold"
|
|
72
|
+
eyebrow="QUESTIONS?"
|
|
73
|
+
title="We are|here to help."
|
|
74
|
+
cta="Contact us"
|
|
75
|
+
cta-href="/site/contact.html"></section>
|
|
76
|
+
|
|
77
|
+
<footer
|
|
78
|
+
nexa="footer dark"
|
|
79
|
+
logo="Nexa"
|
|
80
|
+
logo-image="/nexa-mark.png"
|
|
81
|
+
logo-href="/site/index.html"
|
|
82
|
+
copy="© 2026 Nexa Framework"
|
|
83
|
+
product-links="Components|/site/components.html;Pricing|/site/pricing.html;Features|/site/features.html"
|
|
84
|
+
company-links="Contact|/site/contact.html"></footer>
|
|
85
|
+
|
|
86
|
+
</body>
|
|
87
|
+
</html>
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
# Card images
|
|
2
|
+
|
|
3
|
+
Drop custom card images here — served at `/cards/filename.png`.
|
|
4
|
+
|
|
5
|
+
## Bloom (page figure)
|
|
6
|
+
|
|
7
|
+
| File | Use |
|
|
8
|
+
|------|-----|
|
|
9
|
+
| `/cards/bloom.jpg` | Centered figure on Components library |
|
|
10
|
+
|
|
11
|
+
## Official Nexa assets
|
|
12
|
+
|
|
13
|
+
| Keyword | Asset |
|
|
14
|
+
|---------|--------|
|
|
15
|
+
| `image="hero"` | Hero sculpture scene |
|
|
16
|
+
| `avatar="mark"` / `image="mark"` | `/nexa-mark.png` |
|
|
17
|
+
| `image="sculpture"` | Same as `hero` |
|
|
Binary file
|