@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.
Files changed (133) hide show
  1. package/README.md +15 -3
  2. package/package.json +22 -5
  3. package/packages/server/src/router.ts +36 -12
  4. package/public/assets/blog-CGOdzgkO.js +1 -0
  5. package/public/assets/blog-ML7LFtff.js +1 -0
  6. package/public/assets/components-B_D1ccvJ.js +50 -0
  7. package/public/assets/components-C67m2tNE.js +1 -0
  8. package/public/assets/components-DCNIrNdJ.js +50 -0
  9. package/public/assets/components-DZ9oc9zI.js +1 -0
  10. package/public/assets/contact-CAfovn36.js +1 -0
  11. package/public/assets/contact-bMUqmce3.js +1 -0
  12. package/public/assets/docs-B92Otuxs.js +20 -0
  13. package/public/assets/docs-BGOHuCe3.js +20 -0
  14. package/public/assets/docs-BUkg7Pd2.css +1 -0
  15. package/public/assets/echarts-mount-DdBiYEc1.js +19 -0
  16. package/public/assets/echarts-mount-kJrXh_za.js +19 -0
  17. package/public/assets/echarts-nexa-BsAEVjT0.js +1 -0
  18. package/public/assets/integration-BNpFB3SL.js +1 -0
  19. package/public/assets/integration-Br6tmvWh.js +1 -0
  20. package/public/assets/integration-D7vdPco_.js +1 -0
  21. package/public/assets/main-BBkehs0N.js +1 -0
  22. package/public/assets/main-Cx_-Fq0O.css +1 -0
  23. package/public/assets/main-ny0uOGg1.js +1 -0
  24. package/public/assets/src-B4_Kaae6.css +1 -0
  25. package/public/assets/src-BfdoaLcc.js +1 -0
  26. package/public/assets/src-D__MdyFu.js +1 -0
  27. package/public/cards/README.md +17 -0
  28. package/public/cards/bloom.jpg +0 -0
  29. package/public/favicon.svg +11 -0
  30. package/public/nexa-hero-sculpture-1280.png +0 -0
  31. package/public/nexa-hero-sculpture-640.png +0 -0
  32. package/public/nexa-hero-sculpture-960.png +0 -0
  33. package/public/nexa-hero-sculpture.png +0 -0
  34. package/public/nexa-hero-sculpture.webp +0 -0
  35. package/public/nexa-mark-24.png +0 -0
  36. package/public/nexa-mark-256.png +0 -0
  37. package/public/nexa-mark-32.png +0 -0
  38. package/public/nexa-mark-40.png +0 -0
  39. package/public/nexa-mark-48.png +0 -0
  40. package/public/nexa-mark-512.png +0 -0
  41. package/public/nexa-mark-64.png +0 -0
  42. package/public/nexa-mark-96.png +0 -0
  43. package/public/nexa-mark-apple.png +0 -0
  44. package/public/nexa-mark-product-256.png +0 -0
  45. package/public/nexa-mark-product.png +0 -0
  46. package/public/nexa-mark-source.png +0 -0
  47. package/public/nexa-mark-trim.png +0 -0
  48. package/public/nexa-mark.png +0 -0
  49. package/public/nexa-mark.webp +0 -0
  50. package/public/nexa-palette-vision.png +0 -0
  51. package/public/nexa-wordmark.png +0 -0
  52. package/public/nexa-wordmark.webp +0 -0
  53. package/public/og.png +0 -0
  54. package/public/site/about.html +101 -0
  55. package/public/site/blog.html +87 -0
  56. package/public/site/components.html +251 -0
  57. package/public/site/contact.html +72 -0
  58. package/public/site/docs/buttons.html +157 -0
  59. package/public/site/docs/cards.html +159 -0
  60. package/public/site/docs/colors.html +216 -0
  61. package/public/site/docs/commands.html +170 -0
  62. package/public/site/docs/data.html +122 -0
  63. package/public/site/docs/feedback.html +111 -0
  64. package/public/site/docs/forms.html +117 -0
  65. package/public/site/docs/icons.html +125 -0
  66. package/public/site/docs/index.html +82 -0
  67. package/public/site/docs/installation.html +83 -0
  68. package/public/site/docs/layout.html +116 -0
  69. package/public/site/docs/media.html +96 -0
  70. package/public/site/docs/navigation.html +122 -0
  71. package/public/site/docs/overlays.html +95 -0
  72. package/public/site/docs/pickers.html +126 -0
  73. package/public/site/docs/sections.html +111 -0
  74. package/public/site/docs/typography.html +97 -0
  75. package/public/site/docs/usage.html +76 -0
  76. package/public/site/features.html +107 -0
  77. package/public/site/index.html +117 -0
  78. package/public/site/integration.html +43 -0
  79. package/public/site/pricing.html +87 -0
  80. package/ui/cards/README.md +17 -0
  81. package/ui/cards/bloom.jpg +0 -0
  82. package/ui/echarts-mount-DWNKcqeo.js +22945 -0
  83. package/ui/echarts-nexa-BY8eW9ug.js +456 -0
  84. package/ui/favicon.svg +11 -0
  85. package/ui/nexa-hero-sculpture-1280.png +0 -0
  86. package/ui/nexa-hero-sculpture-640.png +0 -0
  87. package/ui/nexa-hero-sculpture-960.png +0 -0
  88. package/ui/nexa-hero-sculpture.png +0 -0
  89. package/ui/nexa-hero-sculpture.webp +0 -0
  90. package/ui/nexa-mark-24.png +0 -0
  91. package/ui/nexa-mark-256.png +0 -0
  92. package/ui/nexa-mark-32.png +0 -0
  93. package/ui/nexa-mark-40.png +0 -0
  94. package/ui/nexa-mark-48.png +0 -0
  95. package/ui/nexa-mark-512.png +0 -0
  96. package/ui/nexa-mark-64.png +0 -0
  97. package/ui/nexa-mark-96.png +0 -0
  98. package/ui/nexa-mark-apple.png +0 -0
  99. package/ui/nexa-mark-product-256.png +0 -0
  100. package/ui/nexa-mark-product.png +0 -0
  101. package/ui/nexa-mark-source.png +0 -0
  102. package/ui/nexa-mark-trim.png +0 -0
  103. package/ui/nexa-mark.png +0 -0
  104. package/ui/nexa-mark.webp +0 -0
  105. package/ui/nexa-palette-vision.png +0 -0
  106. package/ui/nexa-wordmark.png +0 -0
  107. package/ui/nexa-wordmark.webp +0 -0
  108. package/ui/nexa.css +2 -0
  109. package/ui/nexa.js +2971 -0
  110. package/ui/nexa.umd.js +80 -0
  111. package/ui/og.png +0 -0
  112. package/ui/types/components/art.d.ts +11 -0
  113. package/ui/types/components/card-layouts.d.ts +11 -0
  114. package/ui/types/components/card.d.ts +11 -0
  115. package/ui/types/components/charts.d.ts +7 -0
  116. package/ui/types/components/extra.d.ts +2 -0
  117. package/ui/types/components/helpers.d.ts +18 -0
  118. package/ui/types/components/icons.d.ts +24 -0
  119. package/ui/types/components/index.d.ts +2 -0
  120. package/ui/types/components/pickers.d.ts +8 -0
  121. package/ui/types/components/structure.d.ts +2 -0
  122. package/ui/types/core/behaviors.d.ts +2 -0
  123. package/ui/types/core/brand-assets.d.ts +44 -0
  124. package/ui/types/core/colormap.d.ts +49 -0
  125. package/ui/types/core/echarts-mount.d.ts +5 -0
  126. package/ui/types/core/echarts-nexa.d.ts +71 -0
  127. package/ui/types/core/parser.d.ts +11 -0
  128. package/ui/types/core/registry.d.ts +13 -0
  129. package/ui/types/core/renderer.d.ts +14 -0
  130. package/ui/types/core/schema.d.ts +8 -0
  131. package/ui/types/core/toast.d.ts +11 -0
  132. package/ui/types/core/validate.d.ts +1 -0
  133. package/ui/types/index.d.ts +50 -0
package/public/site/about.html ADDED
@@ -0,0 +1,101 @@
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 — About</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="Join us"
22
+ cta-href="/site/contact.html"></header>
23
+
24
+ <section
25
+ nexa="hero vision split"
26
+ eyebrow="ABOUT NEXA"
27
+ title="We build tools|that build the future"
28
+ text="Nexa is a small team that believes human descriptions should become polished interfaces — fast, without framework lock-in."
29
+ cta="Our story"
30
+ cta-href="#story"
31
+ cta2="Contact"
32
+ cta2-href="/site/contact.html"></section>
33
+
34
+ <section nexa="logos" label="VALUES" brands="BUILD,SHIP,SCALE,OPEN,SIMPLE"></section>
35
+
36
+ <div nexa="container" id="story">
37
+ <div nexa="stack gap-large" style="padding-block:clamp(40px,6vw,72px)">
38
+
39
+ <div nexa="timeline"
40
+ items="2024|Idea|Command-first UI — less markup, richer output.;2025|Engine|Parser, registry, renderer, behaviors.;2026|Launch|50+ widgets, pickers, structure, feedback.;2026|Color Map|One seed color dresses the full theme."></div>
41
+
42
+ <div nexa="stat" stats="Years R&amp;D|2+;Widgets|50+;Demo pages|6;Lock-in|0"></div>
43
+
44
+ <div nexa="grid cols-3 gap-large">
45
+ <article nexa="card profile glass"
46
+ name="Loay"
47
+ role="Founder · Product"
48
+ text="Leads the vision — short commands, premium output."
49
+ avatar="male"></article>
50
+ <article nexa="card profile glass"
51
+ name="Nexa Team"
52
+ role="Engineering"
53
+ text="Vanilla TS — parser, renderer, widgets, motion."
54
+ avatar="mark"></article>
55
+ <article nexa="card profile glass"
56
+ name="Community"
57
+ role="Builders worldwide"
58
+ text="Feedback, examples, and real-world patterns."
59
+ image="https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=320&h=320&fit=crop"></article>
60
+ </div>
61
+
62
+ <div nexa="grid cols-2 gap-large">
63
+ <figure nexa="figure ratio-16x9"
64
+ image="https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=900&q=80"
65
+ caption="Design tokens and motion — part of Nexa DNA"></figure>
66
+ <div nexa="stack gap-small">
67
+ <div nexa="alert info" title="Our mission" text="A page should be described in minutes — Nexa handles the execution hours."></div>
68
+ <div nexa="collapse"
69
+ title="Manifesto"
70
+ text="Interfaces should be described, not assembled class-by-class. Nexa bridges human intent and polished UI."></div>
71
+ <div nexa="list" items="Open spirit,No framework lock-in,RTL + LTR,Premium defaults"></div>
72
+ </div>
73
+ </div>
74
+
75
+ </div>
76
+ </div>
77
+
78
+ <section
79
+ nexa="testimonials featured"
80
+ eyebrow="PARTNERS"
81
+ quote="Nexa gave us agency speed with product-team quality."
82
+ name="NOVA LABS"
83
+ role="Digital studio"></section>
84
+
85
+ <section
86
+ nexa="cta bold"
87
+ eyebrow="JOIN US"
88
+ title="Let us build|together."
89
+ cta="Get in touch"
90
+ cta-href="/site/contact.html"></section>
91
+
92
+ <footer
93
+ nexa="footer dark"
94
+ logo="Nexa"
95
+ logo-image="/nexa-mark.png"
96
+ logo-href="/site/index.html"
97
+ copy="© 2026 Nexa Framework"
98
+ company-links="About|/site/about.html;Contact|/site/contact.html"></footer>
99
+
100
+ </body>
101
+ </html>
package/public/site/blog.html ADDED
@@ -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 — Blog</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/blog-CGOdzgkO.js"></script>
12
+ <link rel="modulepreload" crossorigin href="/assets/components-B_D1ccvJ.js">
13
+ <link rel="modulepreload" crossorigin href="/assets/main-ny0uOGg1.js">
14
+ <link rel="modulepreload" crossorigin href="/assets/src-BfdoaLcc.js">
15
+ <link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
16
+ <link rel="stylesheet" crossorigin href="/assets/src-B4_Kaae6.css">
17
+ </head>
18
+ <body nexa="luxury light brand font-inter essential">
19
+
20
+ <header
21
+ nexa="header vision dock"
22
+ logo-href="/site/index.html"
23
+ 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"
24
+ cta="Subscribe"
25
+ cta-href="#newsletter"></header>
26
+
27
+ <section
28
+ nexa="hero minimal centered"
29
+ eyebrow="BLOG"
30
+ title="Ideas from|the Nexa team"
31
+ text="Product updates, Color Map patterns, widget guides, and builder stories."
32
+ cta="Latest posts"
33
+ cta-href="#posts"></section>
34
+
35
+ <section
36
+ id="posts"
37
+ nexa="posts cards-3 compact"
38
+ eyebrow="BLOG"
39
+ title="Latest articles"
40
+ items="6-page site|Nexa-only demo — no React, no legacy examples.|Aug 28;Pickers shipped|Date, time, autocomplete, rating, stepper.|Aug 25;Structure widgets|Tree, timeline, and transfer lists.|Aug 20;Feedback layers|Sheet, toast queue, form validate.|Aug 15;ECharts pro|Add pro for rich animated charts.|Aug 10;Blocks compact|Auth, checkout, and posts patterns.|Aug 5"></section>
41
+
42
+ <div nexa="container">
43
+ <div nexa="stack gap-large" style="padding-block:clamp(32px,5vw,64px)">
44
+
45
+ <article nexa="card cover glass soft"
46
+ badge="Featured"
47
+ category="LAUNCH"
48
+ title="Nexa Site — 6 pages, zero React"
49
+ text="A full demo built with nexa commands only — header, hero, pricing, pickers, charts, structure."
50
+ cta="Read more"></article>
51
+
52
+ <div nexa="grid cols-2 gap-large">
53
+ <div nexa="stack gap-small">
54
+ <nav nexa="pagination" pages="5" current="1"></nav>
55
+ <div nexa="list-group" items="Product|active;Engineering;Design;Community"></div>
56
+ </div>
57
+ <div nexa="chart spark pro" title="Weekly reads" data="12,18,14,22,19,28,26,34"></div>
58
+ </div>
59
+
60
+ <form id="newsletter" nexa="form validate">
61
+ <div nexa="grid cols-2 gap-large" style="align-items:end">
62
+ <div nexa="field email float required" name="email" label="Email for newsletter"></div>
63
+ <button nexa="primary pill shadow" type="submit">Subscribe</button>
64
+ </div>
65
+ </form>
66
+
67
+ </div>
68
+ </div>
69
+
70
+ <section
71
+ nexa="cta bold"
72
+ eyebrow="DO NOT MISS OUT"
73
+ title="Build. Ship.|Scale."
74
+ cta="Start free"
75
+ cta-href="/site/pricing.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;Blog|/site/blog.html;Features|/site/features.html"
84
+ company-links="Contact|/site/contact.html"></footer>
85
+
86
+ </body>
87
+ </html>
package/public/site/components.html ADDED
@@ -0,0 +1,251 @@
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 — Component Library</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
+ <style>
12
+ .lib{max-width:1180px;margin:0 auto;padding:clamp(24px,5vw,48px)}
13
+ .lib h1{margin:0 0 8px;font:800 clamp(28px,4vw,40px)/1.1 Inter,sans-serif;color:#0B1220}
14
+ .lib>p{margin:0 0 24px;color:#5B6478;font:15px/1.6 Inter,sans-serif;max-width:72ch}
15
+ .toc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
16
+ .toc a{font:600 12px/1 Inter,sans-serif;padding:7px 12px;border-radius:999px;background:#eef3ff;color:#2a4a8a;text-decoration:none;transition:transform .15s,box-shadow .15s}
17
+ .toc a:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(46,158,255,.14)}
18
+ .block{
19
+ margin-bottom:22px;
20
+ background:linear-gradient(165deg,#fff 0%,#f8fbff 55%,#f6f3ff 100%);
21
+ border:1px solid rgba(46,158,255,.12);border-radius:20px;
22
+ padding:22px 24px;box-shadow:0 14px 40px rgba(15,23,42,.05);
23
+ }
24
+ .block h2{margin:0 0 4px;font:800 17px/1.2 Inter,sans-serif;color:#0B1220}
25
+ .block>p{margin:0 0 14px;color:#5B6478;font:13px/1.5 Inter,sans-serif}
26
+ .row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
27
+ .col{display:flex;flex-direction:column;gap:12px}
28
+ .grid-2{display:grid;gap:16px;grid-template-columns:1fr 1fr}
29
+ .grid-3{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
30
+ .card-row{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
31
+ @media(max-width:860px){.grid-2,.grid-3{grid-template-columns:1fr}}
32
+ code{font:600 12px/1.4 ui-monospace,Consolas,monospace;background:#eef3ff;padding:2px 6px;border-radius:6px;color:#2a4a8a}
33
+ .toast-demo{display:grid;gap:14px;grid-template-columns:1fr auto;align-items:start}
34
+ @media(max-width:700px){.toast-demo{grid-template-columns:1fr}}
35
+ .figure-hero{
36
+ margin:0 auto;max-width:820px;
37
+ }
38
+ .figure-hero .nexa-host.nexa-figure,
39
+ .figure-hero figure{
40
+ width:100%;
41
+ }
42
+ </style>
43
+ <script type="module" crossorigin src="/assets/components-DZ9oc9zI.js"></script>
44
+ <link rel="modulepreload" crossorigin href="/assets/components-B_D1ccvJ.js">
45
+ <link rel="modulepreload" crossorigin href="/assets/main-ny0uOGg1.js">
46
+ <link rel="modulepreload" crossorigin href="/assets/src-BfdoaLcc.js">
47
+ <link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
48
+ <link rel="stylesheet" crossorigin href="/assets/src-B4_Kaae6.css">
49
+ </head>
50
+ <body nexa="luxury light brand font-inter essential">
51
+
52
+ <header
53
+ nexa="header vision dock"
54
+ logo-href="/site/index.html"
55
+ 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"
56
+ cta="Start free"
57
+ cta-href="/site/pricing.html"></header>
58
+
59
+ <main class="lib">
60
+ <h1>Nexa Component Library</h1>
61
+ <p>Live widgets with brand motion (<code>essential</code>), card models, and unified toast styling — same markup for preview and <code>nexa.toast()</code>.</p>
62
+
63
+ <nav class="toc" aria-label="Sections">
64
+ <a href="#cards">Cards</a>
65
+ <a href="#controls">Controls</a>
66
+ <a href="#forms">Forms</a>
67
+ <a href="#pickers">Pickers</a>
68
+ <a href="#feedback">Feedback</a>
69
+ <a href="#figure">Figure</a>
70
+ <a href="#layers">Layers</a>
71
+ <a href="#data">Data</a>
72
+ <a href="#structure">Structure</a>
73
+ <a href="#media">Media</a>
74
+ <a href="#blocks">Blocks</a>
75
+ </nav>
76
+
77
+ <section class="block" id="cards">
78
+ <h2>Cards — motion models</h2>
79
+ <p><code>card glow</code> · <code>card lift</code> · <code>card tilt</code> · <code>card aurora</code> · <code>card shine</code></p>
80
+ <div class="card-row">
81
+ <article nexa="card glow" badge="GLOW" title="Glow hover" text="Soft scale + brand shadow on hover."></article>
82
+ <article nexa="card lift" badge="LIFT" title="Lift hover" text="Rises with depth — pricing/feature style."></article>
83
+ <article nexa="card tilt" badge="TILT" title="3D tilt" text="Move the pointer — perspective tilt."></article>
84
+ <article nexa="card aurora glass" badge="AURORA" title="Aurora loop" text="Gradient background animation."></article>
85
+ <article nexa="card shine" badge="SHINE" title="Shine sweep" text="Light sweep across the surface."></article>
86
+ <article nexa="card icon glow" badge="ICON" title="Icon layout" text="Gradient icon tile + motion."></article>
87
+ </div>
88
+ </section>
89
+
90
+ <section class="block" id="controls">
91
+ <h2>Controls</h2>
92
+ <p><code>btn</code> · <code>badge</code> · <code>dropdown</code> · <code>button-group</code> · <code>switch</code></p>
93
+ <div class="row">
94
+ <button nexa="btn primary pill">Primary</button>
95
+ <button nexa="btn outline">Outline</button>
96
+ <button nexa="btn ghost">Ghost</button>
97
+ <span nexa="badge">NEW</span>
98
+ <span nexa="ico bold" name="sparkles"></span>
99
+ </div>
100
+ <div class="row" style="margin-top:14px">
101
+ <div nexa="dropdown" label="Actions" items="Edit,Duplicate,Archive"></div>
102
+ <div nexa="button-group" buttons="Save,Preview,Publish"></div>
103
+ <div nexa="switch checked" label="Notifications"></div>
104
+ </div>
105
+ </section>
106
+
107
+ <section class="block" id="forms">
108
+ <h2>Forms</h2>
109
+ <p><code>form validate</code> · <code>field</code> · <code>select</code> · <code>textarea</code></p>
110
+ <form nexa="form validate" id="demo-form" style="max-width:420px">
111
+ <div nexa="field email float required" name="email" label="Email"></div>
112
+ <div nexa="select" name="plan" label="Plan" options="Starter,Pro,Studio"></div>
113
+ <div nexa="textarea" name="msg" label="Message" rows="3"></div>
114
+ <button nexa="btn primary pill block" type="submit">Validate</button>
115
+ </form>
116
+ </section>
117
+
118
+ <section class="block" id="pickers">
119
+ <h2>Pickers</h2>
120
+ <p><code>datepicker</code> · <code>timepicker</code> · <code>autocomplete</code> · <code>rating</code> · <code>stepper</code> · <code>chips</code></p>
121
+ <div class="grid-2">
122
+ <div nexa="datepicker" label="Date" value="2026-08-28"></div>
123
+ <div nexa="timepicker" label="Time" value="14:30" step="15"></div>
124
+ </div>
125
+ <div style="margin-top:14px" nexa="autocomplete" label="Framework" placeholder="Search…" options="Nexa,Bootstrap,Material,Tailwind"></div>
126
+ <div class="grid-3" style="margin-top:14px">
127
+ <div nexa="rating" value="4" max="5"></div>
128
+ <div nexa="stepper" items="Account,Project,Launch" current="2"></div>
129
+ <div nexa="chips" items="HTML,CSS,TypeScript"></div>
130
+ </div>
131
+ </section>
132
+
133
+ <section class="block" id="feedback">
134
+ <h2>Feedback</h2>
135
+ <p><code>alert</code> · <code>progress</code> · <code>spinner</code> · <code>skeleton</code> · <code>toast</code> + <code>nexa.toast()</code></p>
136
+ <div class="col">
137
+ <div nexa="alert success" title="Success" text="Changes saved."></div>
138
+ <div nexa="alert warning" title="Warning" text="Check settings before continuing."></div>
139
+ <div nexa="progress" label="Upload" value="72"></div>
140
+ <div class="row">
141
+ <div nexa="spinner"></div>
142
+ <div nexa="skeleton lines-3"></div>
143
+ </div>
144
+ </div>
145
+ <div class="toast-demo" style="margin-top:16px">
146
+ <div>
147
+ <p style="margin:0 0 10px;font:600 12px/1.4 Inter,sans-serif;color:#5B6478">Static preview (same markup as API):</p>
148
+ <div nexa="toast success" text="Saved successfully"></div>
149
+ </div>
150
+ <div class="col">
151
+ <button nexa="btn outline" type="button" id="toast-one">Show toast</button>
152
+ <button nexa="btn primary pill" type="button" id="toast-queue">Toast queue (3)</button>
153
+ </div>
154
+ </div>
155
+ </section>
156
+
157
+ <section class="block" id="figure">
158
+ <h2>Figure — bloom asset</h2>
159
+ <p>Same image already used on this page — centered mid-layout for review. Local: <code>/cards/bloom.jpg</code></p>
160
+ <div class="figure-hero">
161
+ <figure nexa="figure ratio-16x9"
162
+ image="/cards/bloom.jpg"
163
+ caption="Bloom · 16:9"></figure>
164
+ </div>
165
+ </section>
166
+
167
+ <section class="block" id="layers">
168
+ <h2>Layers</h2>
169
+ <p><code>modal</code> · <code>sheet</code> · <code>offcanvas</code> · <code>popover</code> · <code>tooltip</code></p>
170
+ <div class="row">
171
+ <button nexa="btn primary" data-modal-open="demo-modal">Modal</button>
172
+ <button nexa="btn outline" data-sheet-open="demo-sheet">Sheet</button>
173
+ <button nexa="btn ghost" data-offcanvas-open="demo-oc">Offcanvas</button>
174
+ <div nexa="popover" label="Info" text="Popover content"></div>
175
+ <span nexa="tooltip" label="?" text="Tooltip help"></span>
176
+ </div>
177
+ <div id="demo-modal" nexa="modal" title="Confirm" text="Proceed with this action?" cta="OK" cancel="Cancel"></div>
178
+ <div id="demo-sheet" nexa="sheet" title="Quick settings" text="Bottom sheet content." cta="Done"></div>
179
+ <div id="demo-oc" nexa="offcanvas" title="Side panel" text="Offcanvas navigation."></div>
180
+ </section>
181
+
182
+ <section class="block" id="data">
183
+ <h2>Data &amp; Charts</h2>
184
+ <p><code>table</code> · <code>stat</code> · <code>chart pro</code></p>
185
+ <div nexa="table striped hover"
186
+ headers="Name|Plan|Status|Amount"
187
+ rows="Loay|Pro|Active|$19;Sara|Free|Pending|$0;Omar|Team|Active|$49"></div>
188
+ <div nexa="stat" style="margin-top:14px" stats="Users|12.4k;Revenue|$48k;Uptime|99.9%;NPS|72"></div>
189
+ <div class="grid-2" style="margin-top:14px">
190
+ <div nexa="chart bar pro" title="Growth" data="Jan|42;Feb|58;Mar|71;Apr|88"></div>
191
+ <div nexa="chart donut pro" title="Mix" data="Pro|48;Studio|27;Starter|25"></div>
192
+ </div>
193
+ </section>
194
+
195
+ <section class="block" id="structure">
196
+ <h2>Structure</h2>
197
+ <p><code>tree</code> · <code>timeline</code> · <code>transfer</code> · <code>tabs</code> · <code>accordion</code></p>
198
+ <div class="grid-2">
199
+ <div nexa="tree" items="src/core/parser.ts,src/components/pickers.ts,docs/PICKERS.md"></div>
200
+ <div nexa="timeline" items="Launch|Today|Library page live.;Pickers|Week|Date, time, AC.;Structure|Shipped|Tree, TL, transfer."></div>
201
+ </div>
202
+ <div style="margin-top:14px" nexa="transfer"
203
+ source="Dashboard,Billing,Team,API,Logs"
204
+ target="Team,API"
205
+ left-label="Available"
206
+ right-label="Selected"></div>
207
+ <div class="grid-2" style="margin-top:14px">
208
+ <div nexa="tabs pills" tabs="One|First panel.;Two|Second panel.;Three|Third panel."></div>
209
+ <div nexa="accordion" items="What is Nexa?|Command-first UI engine.;Need React?|No — Vanilla TS.;Docs?|See docs/ folder."></div>
210
+ </div>
211
+ </section>
212
+
213
+ <section class="block" id="media">
214
+ <h2>Media &amp; Nav</h2>
215
+ <p><code>avatar</code> · <code>carousel</code> · <code>breadcrumb</code> · <code>pagination</code></p>
216
+ <div class="grid-2">
217
+ <div class="row">
218
+ <div nexa="avatar male" name="Alex"></div>
219
+ <div nexa="avatar" name="NX"></div>
220
+ </div>
221
+ <div nexa="carousel autoplay" interval="3500"
222
+ slides="One|First slide.;Two|Second slide.;Three|Third slide."></div>
223
+ </div>
224
+ <div class="row" style="margin-top:14px">
225
+ <nav nexa="breadcrumb" items="Home,Components,Library"></nav>
226
+ <nav nexa="pagination" pages="5" current="2"></nav>
227
+ </div>
228
+ </section>
229
+
230
+ <section class="block" id="blocks">
231
+ <h2>Page blocks</h2>
232
+ <p><code>auth compact</code> · <code>checkout compact</code> · <code>posts compact</code></p>
233
+ <div nexa="posts compact cards-3"
234
+ title="Blog preview"
235
+ items="Color Map|One hex themes the site.|Aug 28;Pickers|Date, time, autocomplete.|Aug 25;Launch|Component library.|Aug 22"></div>
236
+ <div class="grid-2" style="margin-top:18px">
237
+ <div nexa="auth compact" title="Welcome back" subtitle="Sign in to continue."></div>
238
+ <div nexa="checkout compact" title="Checkout" plan="Pro" total="$19"></div>
239
+ </div>
240
+ </section>
241
+ </main>
242
+
243
+ <footer
244
+ nexa="footer dark"
245
+ logo="Nexa"
246
+ logo-image="/nexa-mark.png"
247
+ logo-href="/site/index.html"
248
+ copy="© 2026 Nexa Framework"></footer>
249
+
250
+ </body>
251
+ </html>
package/public/site/contact.html ADDED
@@ -0,0 +1,72 @@
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 — Contact</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/contact-CAfovn36.js"></script>
12
+ <link rel="modulepreload" crossorigin href="/assets/components-B_D1ccvJ.js">
13
+ <link rel="modulepreload" crossorigin href="/assets/main-ny0uOGg1.js">
14
+ <link rel="modulepreload" crossorigin href="/assets/src-BfdoaLcc.js">
15
+ <link rel="stylesheet" crossorigin href="/assets/main-Cx_-Fq0O.css">
16
+ <link rel="stylesheet" crossorigin href="/assets/src-B4_Kaae6.css">
17
+ </head>
18
+ <body nexa="luxury light brand font-inter essential">
19
+
20
+ <header
21
+ nexa="header vision dock"
22
+ logo-href="/site/index.html"
23
+ 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"
24
+ cta="Start free"
25
+ cta-href="/site/pricing.html"></header>
26
+
27
+ <section
28
+ nexa="hero minimal centered"
29
+ eyebrow="CONTACT"
30
+ title="We are|here to help"
31
+ text="Questions about Nexa, Enterprise, or partnerships — send a message and we will reply within one business day."
32
+ cta="Email us"
33
+ cta-href="mailto:hello@nexa.dev"></section>
34
+
35
+ <div nexa="container">
36
+ <div nexa="grid cols-2 gap-large" style="padding-block:clamp(40px,6vw,72px);align-items:start">
37
+
38
+ <form nexa="form validate" id="contact-form">
39
+ <span nexa="badge">Contact</span>
40
+ <div nexa="alert info" title="Send a message" text="Required fields are marked with *"></div>
41
+ <div nexa="field text float required" name="name" label="Full name"></div>
42
+ <div nexa="field email float required" name="email" label="Email" hint="We never share it"></div>
43
+ <div nexa="select required" name="topic" label="Topic" options="General,Enterprise,Partnership,Support"></div>
44
+ <div nexa="textarea required" name="message" label="Message" rows="5" placeholder="How can we help?"></div>
45
+ <div nexa="switch checked" label="Send me Nexa updates"></div>
46
+ <button nexa="primary block pill shadow" type="submit">Send message</button>
47
+ </form>
48
+
49
+ <div nexa="stack gap-large">
50
+ <div nexa="stat" stats="Response time|<24h;Languages|EN + AR;Support|Pro+"></div>
51
+ <div nexa="chip removable">Enterprise</div>
52
+ <div nexa="chips" items="Slack,Email,GitHub"></div>
53
+ <nav nexa="breadcrumb" items="Home,Contact,Form"></nav>
54
+ <figure nexa="figure ratio-16x9"
55
+ image="https://images.unsplash.com/photo-1497366216548-37526070297c?w=800&q=80"
56
+ caption="Remote-first — global team"></figure>
57
+ </div>
58
+
59
+ </div>
60
+ </div>
61
+
62
+ <section
63
+ nexa="cta bold"
64
+ eyebrow="OR TRY IT"
65
+ title="Explore|Nexa now."
66
+ cta="See widgets"
67
+ cta-href="/site/features.html"></section>
68
+
69
+ <footer nexa="footer dark simple" logo="Nexa" logo-href="/site/index.html" copy="© 2026 Nexa Framework · hello@nexa.dev"></footer>
70
+
71
+ </body>
72
+ </html>