WorkRoot/WRNexusJS
2
0
Fork 0
Code Issues Pull Requests Actions 34 Packages Projects Releases Wiki Activity

release: WRNexusJS 0.2.79

Browse Source
This commit is contained in:
Clintchiz
2026-07-22 12:56:07 +05:30
parent c6fc0f1f63
commit 13dfa31d19
87 changed files with 472 additions and 280 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.publish/ai/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ai",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "Zero-dependency Claude (Anthropic) client for WrNexus apps.",
"license": "MIT",
.publish/authz/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/authz",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/authz — part of the WrNexus framework.",
"license": "MIT",
.publish/cli/package.json
+11 -11
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/cli",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/cli — part of the WrNexus framework.",
"license": "MIT",
@@ -28,16 +28,16 @@
"wrnexus": "./dist/index.js"
},
"dependencies": {
"@wrnexus/core": "^0.2.78",
"@wrnexus/router": "^0.2.78",
"@wrnexus/csr": "^0.2.78",
"@wrnexus/compiler": "^0.2.78",
"@wrnexus/styles": "^0.2.78",
"@wrnexus/dev-server": "^0.2.78",
"@wrnexus/ui": "^0.2.78",
"@wrnexus/validation": "^0.2.78",
"@wrnexus/i18n": "^0.2.78",
"@wrnexus/db": "^0.2.78"
"@wrnexus/core": "^0.2.79",
"@wrnexus/router": "^0.2.79",
"@wrnexus/csr": "^0.2.79",
"@wrnexus/compiler": "^0.2.79",
"@wrnexus/styles": "^0.2.79",
"@wrnexus/dev-server": "^0.2.79",
"@wrnexus/ui": "^0.2.79",
"@wrnexus/validation": "^0.2.79",
"@wrnexus/i18n": "^0.2.79",
"@wrnexus/db": "^0.2.79"
},
"files": [
"dist"
.publish/compiler/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/compiler",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/compiler — part of the WrNexus framework.",
"license": "MIT",
.publish/core/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/core",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/core — part of the WrNexus framework.",
"license": "MIT",
.publish/csr/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/csr",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/csr — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/db/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/db",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/db — part of the WrNexus framework.",
"license": "MIT",
.publish/dev-server/package.json
+14 -14
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/dev-server",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/dev-server — part of the WrNexus framework.",
"license": "MIT",
@@ -25,19 +25,19 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78",
"@wrnexus/dev-toolbar": "^0.2.78",
"@wrnexus/router": "^0.2.78",
"@wrnexus/ssr": "^0.2.78",
"@wrnexus/csr": "^0.2.78",
"@wrnexus/compiler": "^0.2.78",
"@wrnexus/styles": "^0.2.78",
"@wrnexus/ui": "^0.2.78",
"@wrnexus/validation": "^0.2.78",
"@wrnexus/i18n": "^0.2.78",
"@wrnexus/db": "^0.2.78",
"@wrnexus/pubsub": "^0.2.78",
"@wrnexus/uploader": "^0.2.78"
"@wrnexus/core": "^0.2.79",
"@wrnexus/dev-toolbar": "^0.2.79",
"@wrnexus/router": "^0.2.79",
"@wrnexus/ssr": "^0.2.79",
"@wrnexus/csr": "^0.2.79",
"@wrnexus/compiler": "^0.2.79",
"@wrnexus/styles": "^0.2.79",
"@wrnexus/ui": "^0.2.79",
"@wrnexus/validation": "^0.2.79",
"@wrnexus/i18n": "^0.2.79",
"@wrnexus/db": "^0.2.79",
"@wrnexus/pubsub": "^0.2.79",
"@wrnexus/uploader": "^0.2.79"
},
"files": [
"dist"
.publish/dev-toolbar/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/dev-toolbar",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/dev-toolbar — part of the WrNexus framework.",
"license": "MIT",
.publish/encryption/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/encryption",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/encryption — part of the WrNexus framework.",
"license": "MIT",
.publish/helpers/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/helpers",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "Safe convenience helpers for WrNexus request contexts and common application flows.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/i18n/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/i18n",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/i18n — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/jwt/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/jwt",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/jwt — part of the WrNexus framework.",
"license": "MIT",
.publish/mobile/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/mobile",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/mobile — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/native": "^0.2.78"
"@wrnexus/native": "^0.2.79"
},
"files": [
"dist"
.publish/native/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/native",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/native — part of the WrNexus framework.",
"license": "MIT",
.publish/oauth/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/oauth",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/oauth — part of the WrNexus framework.",
"license": "MIT",
.publish/pubsub/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/pubsub",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/pubsub — part of the WrNexus framework.",
"license": "MIT",
.publish/queue/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/queue",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/queue — part of the WrNexus framework.",
"license": "MIT",
.publish/reactive/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/reactive",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/reactive — part of the WrNexus framework.",
"license": "MIT",
.publish/router/package.json
+3 -3
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/router",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/router — part of the WrNexus framework.",
"license": "MIT",
@@ -21,8 +21,8 @@
}
},
"dependencies": {
"@wrnexus/compiler": "^0.2.78",
"@wrnexus/core": "^0.2.78"
"@wrnexus/compiler": "^0.2.79",
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/ssr/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ssr",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/ssr — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/styles/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/styles",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/styles — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/uploader": "^0.2.78"
"@wrnexus/uploader": "^0.2.79"
},
"files": [
"dist"
.publish/test/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/test",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/test — part of the WrNexus framework.",
"license": "MIT",
.publish/tracking/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/tracking",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/tracking — part of the WrNexus framework.",
"license": "MIT",
.publish/ui/components/AnalyticsDashboardPreview.wrn
+41 -21
View File
@@ -11,37 +11,57 @@ component AnalyticsDashboardPreview {
}
view {
<section class="px-4 sm:px-6 lg:px-8 {class}">
<div class="mx-auto grid w-full max-w-7xl gap-8 overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-5 shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.08))] sm:p-7 lg:grid-cols-[1.25fr_0.75fr] lg:items-center lg:p-8">
<section class="px-4 py-10 sm:px-6 sm:py-12 lg:px-8 lg:py-14 {class}">
<div
class="mx-auto grid w-full max-w-7xl gap-8 overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-5 shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.08))] sm:p-7 lg:grid-cols-[minmax(0,1.15fr)_minmax(20rem,0.85fr)] lg:items-center lg:p-8"
>
<div>
{#if image}
<img src="{image}" alt="{alt}" class="aspect-[16/9] w-full rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] object-cover" />
<img
src="{image}"
alt="{alt}"
class="aspect-[16/9] w-full rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] object-cover"
/>
{:else}
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] p-4 sm:p-5" role="img" aria-label="Delivery trend rising over seven days">
<div class="flex items-center justify-between gap-4 text-sm">
<strong class="text-[var(--wire-color-text,#0f172a)]">Delivery trend</strong>
<span class="font-bold text-[var(--wire-color-success,#059669)]">↗ 18.4%</span>
</div>
<svg class="mt-4 h-auto w-full text-[var(--wire-color-primary,#059669)]" viewBox="0 0 700 250" aria-hidden="true">
<defs>
<linearGradient id="wire-analytics-area" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="currentColor" stop-opacity=".24"></stop>
<stop offset="100%" stop-color="currentColor" stop-opacity="0"></stop>
</linearGradient>
</defs>
<g fill="none" stroke="var(--wire-color-border,#e2e8f0)"><path d="M20 50H680M20 115H680M20 180H680M20 230H680"></path></g>
<path fill="url(#wire-analytics-area)" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32 L680 230 L20 230Z"></path>
<path fill="none" stroke="currentColor" stroke-width="6" stroke-linecap="round" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32"></path>
</svg>
<div class="mt-2 flex justify-between text-[0.7rem] text-[var(--wire-color-text-muted,#64748b)]"><span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span></div>
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] p-4 sm:p-5"
role="img"
aria-label="Delivery trend rising over seven days"
>
<div class="flex items-center justify-between gap-4 text-sm">
<strong class="text-[var(--wire-color-text,#0f172a)]">Delivery trend</strong>
<span class="font-bold text-[var(--wire-color-success,#059669)]">↗ 18.4%</span>
</div>
<svg
class="mt-4 h-auto w-full text-[var(--wire-color-primary,#059669)]"
viewBox="0 0 700 250"
aria-hidden="true"
>
<defs>
<linearGradient
id="wire-analytics-area"
x1="0"
y1="0"
x2="0"
y2="1"
>
<stop offset="0%" stop-color="currentColor" stop-opacity=".24"></stop>
<stop offset="100%" stop-color="currentColor" stop-opacity="0"></stop>
</linearGradient>
</defs>
<g fill="none" stroke="var(--wire-color-border,#e2e8f0)"><path d="M20 50H680M20 115H680M20 180H680M20 230H680"></path></g>
<path fill="url(#wire-analytics-area)" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32 L680 230 L20 230Z"></path>
<path fill="none" stroke="currentColor" stroke-width="6" stroke-linecap="round" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32"></path>
</svg>
<div class="mt-2 flex justify-between text-[0.7rem] text-[var(--wire-color-muted,#64748b)]"><span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span></div>
</div>
{/if}
</div>
<div>
{#if eyebrow}<p class="m-0 text-xs font-bold uppercase tracking-[0.16em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</p>{/if}
{#if title}<h2 class="mt-4 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)]">{title}</h2>{/if}
{#if description}<p class="mt-4 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-4 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
<div class="mt-5"><slot /></div>
{#if href}<a href="{href}" class="mt-6 inline-flex items-center gap-2 font-semibold text-[var(--wire-color-primary,#059669)] no-underline">{actionLabel}<span aria-hidden="true">→</span></a>{/if}
</div>
.publish/ui/components/ChannelCard.wrn
+12 -6
View File
@@ -8,21 +8,27 @@ component ChannelCard {
}
view {
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article
class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}"
>
<div class="flex min-h-12 items-start justify-between gap-4">
{#if icon}
<span class="inline-grid h-12 w-12 shrink-0 place-items-center rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-xl text-[var(--wire-color-primary,#059669)] {icon}" aria-hidden="true"></span>
<span class="inline-grid h-12 w-12 shrink-0 place-items-center rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-xl text-[var(--wire-color-primary,#059669)] {icon}" aria-hidden="true"></span>
{/if}
<div class="flex min-w-0 justify-end"><slot /></div>
</div>
{#if title}<h3 class="mt-5 text-xl font-semibold tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center justify-between gap-3 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]" aria-label="Explore {title}">
<span>Explore {title}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
</a>
<a
href="{href}"
class="mt-6 inline-flex items-center justify-between gap-3 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]"
aria-label="Explore {title}"
>
<span>Explore {title}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
</a>
{/if}
</article>
}
.publish/ui/components/ChannelFlow.wrn
+20 -8
View File
@@ -4,22 +4,32 @@ component ChannelFlow {
}
view {
<div class="grid grid-cols-1 items-center gap-3 lg:grid-cols-[1fr_auto_1fr_auto_1.2fr_auto_1fr] {class}" role="img" aria-label="Customer event flows through profile and consent checks to communication channels, then delivery analytics and webhooks">
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="grid grid-cols-1 items-center gap-3 lg:grid-cols-[1fr_auto_1fr_auto_1.2fr_auto_1fr] {class}"
role="img"
aria-label="Customer event flows through profile and consent checks to communication channels, then delivery analytics and webhooks"
>
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--webhook] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Customer event</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">order.shipped</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">order.shipped</small>
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--shield-check] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Profile + consent</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">Eligibility checked</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">Eligibility checked</small>
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="grid grid-cols-2 gap-2 rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-3">
<div
class="grid grid-cols-2 gap-2 rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-3"
>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">WhatsApp</span>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">SMS</span>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">Email</span>
@@ -27,10 +37,12 @@ component ChannelFlow {
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--chart-no-axes-combined] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Delivery + analytics</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">Webhook emitted</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">Webhook emitted</small>
</div>
</div>
}
.publish/ui/components/CodeBlock.wrn
+7 -7
View File
@@ -1,11 +1,11 @@
component CodeBlock {
props {
language = "text"
title = ""
code = ""
copyable = true
class = ""
}
props {
language = "text"
title = ""
code = ""
copyable = true
class = ""
}
view {
<section class="overflow-hidden bg-[var(--wire-color-code-background,#020617)] text-[var(--wire-color-code-text,#e2e8f0)] {class}">
.publish/ui/components/CodeTabs.wrn
+3 -1
View File
@@ -4,7 +4,9 @@ component CodeTabs {
}
view {
<div class="overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] {class}">
<div
class="overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] {class}"
>
<slot />
</div>
}
.publish/ui/components/FeatureTabs.wrn
+2 -2
View File
@@ -11,7 +11,7 @@ component FeatureTabs {
}
view {
<article class="group flex h-full min-h-72 flex-col overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article class="group flex h-full min-h-72 flex-col overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}">
{#if image}
<img src="{image}" alt="{alt}" class="aspect-[16/9] w-full border-b border-[var(--wire-color-border,#e2e8f0)] object-cover" />
{/if}
@@ -19,7 +19,7 @@ component FeatureTabs {
<div class="flex flex-1 flex-col p-6">
{#if eyebrow}<p class="m-0 text-xs font-bold uppercase tracking-[0.14em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</p>{/if}
{#if title}<h3 class="mt-4 text-xl font-semibold leading-snug tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
<div class="mt-5"><slot /></div>
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center gap-2 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]">
.publish/ui/components/FinalCTA.wrn
+36 -3
View File
@@ -11,25 +11,58 @@ component FinalCTA {
view {
<span class="contents {class}">
{#if href}
{#if variant === "primary"}
<a
href="{href}"
class=' group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl px-5 py-2.5 text-sm font-semibold no-underline transition duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--wire-color-background,#ffffff)] {variant === "primary" ? "bg-[var(--wire-color-primary,#059669)] text-[var(--wire-color-primary-contrast,#ffffff)] hover:bg-[var(--wire-color-primary-hover,#047857)]" : "border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] text-[var(--wire-color-text,#0f172a)] hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)]"} '
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl bg-[var(--wire-color-primary,#059669)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-primary-contrast,#ffffff)] no-underline transition duration-200 hover:bg-[var(--wire-color-primary-hover,#047857)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
aria-disabled="{disabled}"
>
<span>{label}</span>
<span class="transition-transform duration-200 group-hover:translate-x-0.5" aria-hidden="true">→</span>
<span
class="transition-transform duration-200 group-hover:translate-x-0.5"
aria-hidden="true"
>
→
</span>
<slot />
</a>
{:else}
<a
href="{href}"
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-text,#0f172a)] no-underline transition duration-200 hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
aria-disabled="{disabled}"
>
<span>{label}</span>
<span
class="transition-transform duration-200 group-hover:translate-x-0.5"
aria-hidden="true"
>
→
</span>
<slot />
</a>
{/if}
{:else}
{#if variant === "primary"}
<button
type="{type}"
disabled="{disabled}"
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl bg-[var(--wire-color-primary,#059669)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-primary-contrast,#ffffff)] transition duration-200 hover:bg-[var(--wire-color-primary-hover,#047857)] disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
>
<span>{label}</span>
<slot />
</button>
{:else}
<button
type="{type}"
disabled="{disabled}"
class=' group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl px-5 py-2.5 text-sm font-semibold transition duration-200 disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--wire-color-background,#ffffff)] {variant === "primary" ? "bg-[var(--wire-color-primary,#059669)] text-[var(--wire-color-primary-contrast,#ffffff)] hover:bg-[var(--wire-color-primary-hover,#047857)]" : "border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] text-[var(--wire-color-text,#0f172a)] hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)]"} '
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-text,#0f172a)] transition duration-200 hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)] disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
>
<span>{label}</span>
<slot />
</button>
{/if}
{/if}
</span>
}
}
.publish/ui/components/MarketingSectionHeader.wrn
+3 -3
View File
@@ -8,7 +8,7 @@ component MarketingSectionHeader {
}
view {
<section class="px-4 py-16 sm:px-6 sm:py-20 lg:px-8 {class}">
<section class="px-4 py-12 sm:px-6 sm:py-16 lg:px-8 lg:py-20 {class}">
<div class="mx-auto w-full max-w-7xl">
<header
class="max-w-3xl"
@@ -22,11 +22,11 @@ component MarketingSectionHeader {
<h2 class="m-0 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">{title}</h2>
{/if}
{#if description}
<p class="mt-5 text-base leading-8 text-[var(--wire-color-text-muted,#64748b)] sm:text-lg">{description}</p>
<p class="mt-5 text-base leading-8 text-[var(--wire-color-muted,#64748b)] sm:text-lg">{description}</p>
{/if}
</header>
<div class="mt-8">
<div class="mt-10">
<slot />
</div>
</div>
.publish/ui/components/MetricGrid.wrn
+3 -3
View File
@@ -9,17 +9,17 @@ component MetricGrid {
<section class="px-4 sm:px-6 lg:px-8 {class}" aria-label="{label}">
<div class="mx-auto grid w-full max-w-7xl grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-4">
{#each metrics as metric}
<article class="flex min-h-40 flex-col justify-center rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))]">
<article class="flex min-h-40 flex-col justify-center rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))]">
<strong class="text-3xl font-semibold leading-none tracking-[-0.04em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">
{metric.value}
</strong>
<span class="mt-4 font-semibold text-[var(--wire-color-text,#0f172a)]">{metric.label}</span>
{#if metric.description}
<p class="mt-2 text-sm leading-6 text-[var(--wire-color-text-muted,#64748b)]">{metric.description}</p>
<p class="mt-2 text-sm leading-6 text-[var(--wire-color-muted,#64748b)]">{metric.description}</p>
{/if}
</article>
{:empty}
<p class="col-span-full rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] p-8 text-center text-[var(--wire-color-text-muted,#64748b)]">
<p class="col-span-full rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] p-8 text-center text-[var(--wire-color-muted,#64748b)]">
No metrics available.
</p>
{/each}
.publish/ui/components/ProductArchitectureDiagram.wrn
+5 -5
View File
@@ -9,26 +9,26 @@ component ProductArchitectureDiagram {
}
view {
<section class="overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.08))] {class}" aria-label="{title}">
<section class="overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.08))] {class}" aria-label="{title}">
<header class="flex flex-col gap-4 border-b border-[var(--wire-color-border,#e2e8f0)] p-6 sm:flex-row sm:items-start sm:justify-between lg:p-8">
<div>
{#if title}<p class="m-0 font-semibold text-[var(--wire-color-text,#0f172a)]">{title}</p>{/if}
{#if value}<strong class="mt-3 block text-3xl font-semibold tracking-[-0.04em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">{value}</strong>{/if}
{#if description}<p class="mt-3 max-w-2xl leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 max-w-2xl leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
</div>
{#if loading}
<span class="inline-flex w-max items-center gap-2 rounded-full bg-[var(--wire-color-surface-muted,#f8fafc)] px-3 py-1.5 text-xs font-semibold text-[var(--wire-color-text-muted,#64748b)]">
<span class="inline-flex w-max items-center gap-2 rounded-full bg-[var(--wire-color-surface-2,#f8fafc)] px-3 py-1.5 text-xs font-semibold text-[var(--wire-color-muted,#64748b)]">
<span class="h-2 w-2 animate-pulse rounded-full bg-[var(--wire-color-primary,#059669)]"></span>Loading
</span>
{/if}
</header>
<div class="bg-[var(--wire-color-surface-muted,#f8fafc)] p-4 sm:p-6 lg:p-8 empty:hidden">
<div class="bg-[var(--wire-color-surface-2,#f8fafc)] p-4 sm:p-6 lg:p-8 empty:hidden">
<slot />
</div>
{#if summary}
<p class="m-0 border-t border-[var(--wire-color-border,#e2e8f0)] px-6 py-5 text-sm leading-6 text-[var(--wire-color-text-muted,#64748b)] lg:px-8">{summary}</p>
<p class="m-0 border-t border-[var(--wire-color-border,#e2e8f0)] px-6 py-5 text-sm leading-6 text-[var(--wire-color-muted,#64748b)] lg:px-8">{summary}</p>
{/if}
</section>
}
.publish/ui/components/ProductCard.wrn
+3 -3
View File
@@ -10,13 +10,13 @@ component ProductCard {
}
view {
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<div class="flex min-h-7 items-start justify-between gap-4">
{#if eyebrow}<span class="text-xs font-bold uppercase tracking-[0.14em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</span>{/if}
{#if status}<span class="shrink-0 rounded-full bg-[var(--wire-color-surface-muted,#f8fafc)] px-2.5 py-1 text-[0.7rem] font-bold text-[var(--wire-color-text-muted,#64748b)]">{status}</span>{/if}
{#if status}<span class="shrink-0 rounded-full bg-[var(--wire-color-surface-2,#f8fafc)] px-2.5 py-1 text-[0.7rem] font-bold text-[var(--wire-color-muted,#64748b)]">{status}</span>{/if}
</div>
{#if title}<h3 class="mt-5 text-xl font-semibold tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center gap-2 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]">
<span>{actionLabel}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
.publish/ui/components/ProductGrid.wrn
+4 -4
View File
@@ -8,17 +8,17 @@ component ProductGrid {
}
view {
<section class="px-4 sm:px-6 lg:px-8 {class}">
<section class="px-4 py-10 sm:px-6 sm:py-12 lg:px-8 lg:py-14 {class}">
<div class="mx-auto w-full max-w-7xl">
{#if title}<h2 class="m-0 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)]">{title}</h2>{/if}
{#if description}<p class="mt-4 max-w-3xl leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-4 max-w-3xl leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if empty}
<div class="mt-8 rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] p-10 text-center text-[var(--wire-color-text-muted,#64748b)]">
<div class="mt-8 rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] p-10 text-center text-[var(--wire-color-muted,#64748b)]">
{emptyText}
</div>
{:else}
<div class="mt-8 grid grid-cols-1 items-stretch gap-5 md:grid-cols-2 xl:grid-cols-3 [&>*]:min-w-0 [&>*]:h-full">
<div class="mt-8 grid grid-cols-1 items-stretch gap-6 md:grid-cols-2 xl:grid-cols-3 xl:gap-7 [&>*]:min-w-0 [&>*]:h-full">
<slot />
</div>
{/if}
.publish/ui/components/ProductHero.wrn
+20 -20
View File
@@ -9,17 +9,9 @@ component ProductHero {
view {
<section
class="
relative isolate overflow-hidden border-b border-[var(--wire-color-border,#e2e8f0)]
bg-[var(--wire-color-background,#ffffff)] px-4 py-16 sm:px-6 sm:py-20 lg:px-8 lg:py-24
{class}
"
class=" relative isolate overflow-hidden border-b border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-bg,#ffffff)] px-4 py-14 sm:px-6 sm:py-18 lg:px-8 lg:py-20 {class} "
>
<div
class="pointer-events-none absolute inset-0 -z-10 opacity-80"
style="background: radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--wire-color-primary, #059669) 16%, transparent), transparent 36%);"
aria-hidden="true"
></div>
<div class="pointer-events-none absolute inset-0 -z-10 opacity-80" style="background: radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--wire-color-primary, #059669) 16%, transparent), transparent 36%);" aria-hidden="true" ></div>
<div class="mx-auto w-full max-w-7xl">
<div
@@ -28,25 +20,33 @@ component ProductHero {
class:text-center='{align === "center"}'
>
{#if eyebrow}
<p class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-[var(--wire-color-primary,#059669)] sm:text-sm">
{eyebrow}
</p>
<p
class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-[var(--wire-color-primary,#059669)] sm:text-sm"
>
{eyebrow}
</p>
{/if}
{#if title}
<h1 class="m-0 max-w-[18ch] text-4xl font-semibold leading-[1.05] tracking-[-0.045em] text-[var(--wire-color-text,#0f172a)] sm:text-5xl lg:text-6xl" class:mx-auto='{align === "center"}'>
{title}
</h1>
<h1
class="m-0 max-w-[18ch] text-4xl font-semibold leading-[1.05] tracking-[-0.045em] text-[var(--wire-color-text,#0f172a)] sm:text-5xl lg:text-6xl"
class:mx-auto='{align === "center"}'
>
{title}
</h1>
{/if}
{#if description}
<p class="mt-6 max-w-3xl text-base leading-8 text-[var(--wire-color-text-muted,#64748b)] sm:text-lg" class:mx-auto='{align === "center"}'>
{description}
</p>
<p
class="mt-6 max-w-3xl text-base leading-8 text-[var(--wire-color-muted,#64748b)] sm:text-lg"
class:mx-auto='{align === "center"}'
>
{description}
</p>
{/if}
</div>
<div class="mt-8 space-y-8">
<div class="mt-10 space-y-10">
<slot />
</div>
</div>
.publish/ui/components/ProductPageShell.wrn
+4 -9
View File
@@ -1,16 +1,11 @@
component ProductPageShell {
props { class = "" }
props {
class = ""
}
view {
<main
class="
min-h-screen w-full overflow-x-clip
bg-[var(--wire-color-background,#ffffff)]
font-[var(--wire-font-sans,ui-sans-serif,system-ui,sans-serif)]
text-[var(--wire-color-text,#0f172a)]
antialiased
{class}
"
class=" min-h-screen w-full overflow-x-clip bg-[var(--wire-color-bg,#ffffff)] font-[var(--wire-font-sans,ui-sans-serif,system-ui,sans-serif)] text-[var(--wire-color-text,#0f172a)] antialiased {class} "
>
<slot />
</main>
.publish/ui/components/ProductStatusBadge.wrn
+1 -1
View File
@@ -7,7 +7,7 @@ component ProductStatusBadge {
view {
<span
class=' inline-flex w-max items-center gap-1.5 rounded-full border px-2.5 py-1 text-[0.7rem] font-bold leading-none {status === "warning" ? "border-[var(--wire-color-warning,#d97706)] bg-[var(--wire-color-warning-soft,#fffbeb)] text-[var(--wire-color-warning,#d97706)]" : status === "muted" ? "border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] text-[var(--wire-color-text-muted,#64748b)]" : "border-[var(--wire-color-primary,#059669)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-[var(--wire-color-primary,#059669)]"} {class} '
class=' inline-flex w-max items-center gap-1.5 rounded-full border px-2.5 py-1 text-[0.7rem] font-bold leading-none {status === "warning" ? "border-[var(--wire-color-warning,#d97706)] bg-[var(--wire-color-warning-soft,#fffbeb)] text-[var(--wire-color-warning,#d97706)]" : status === "muted" ? "border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] text-[var(--wire-color-muted,#64748b)]" : "border-[var(--wire-color-primary,#059669)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-[var(--wire-color-primary,#059669)]"} {class} '
>
<span class="h-1.5 w-1.5 rounded-full bg-current" aria-hidden="true"></span>
{label}
.publish/ui/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ui",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/ui — part of the WrNexus framework.",
"license": "MIT",
@@ -25,7 +25,7 @@
"./ui.css": "./ui.css"
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist",
.publish/uploader/package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/uploader",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/uploader — part of the WrNexus framework.",
"license": "MIT",
@@ -21,7 +21,7 @@
}
},
"dependencies": {
"@wrnexus/core": "^0.2.78"
"@wrnexus/core": "^0.2.79"
},
"files": [
"dist"
.publish/validation/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/validation",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"description": "@wrnexus/validation — part of the WrNexus framework.",
"license": "MIT",
packages/ai/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ai",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"description": "Zero-dependency Claude (Anthropic) client for WrNexus apps.",
packages/authz/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/authz",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/cli/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/cli",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/cli/src/update.ts
+8
View File
@@ -775,6 +775,14 @@ const MIGRATIONS: Migration[] = [
// Language and shared UI behavior improve automatically after updating.
},
},
{
version: "0.2.79",
id: "ui-components-fix",
description: "Dev toolbar for optimization and developer.",
apply() {
// Language and shared UI behavior improve automatically after updating.
},
},
];
/** Release tooling uses this to require an explicit migration entry per version. */
packages/compiler/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/compiler",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/core/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/core",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/csr/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/csr",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/db/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/db",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/dev-server/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/dev-server",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/dev-toolbar/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/dev-toolbar",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"sideEffects": false,
packages/encryption/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/encryption",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/helpers/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/helpers",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"description": "Safe convenience helpers for WrNexus request contexts and common application flows.",
packages/i18n/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/i18n",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/jwt/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/jwt",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/mobile/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/mobile",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/native/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/native",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/oauth/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/oauth",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/pubsub/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/pubsub",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/queue/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/queue",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/reactive/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/reactive",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/router/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/router",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/ssr/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ssr",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/styles/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/styles",
"version": "0.2.78",
"version": "0.2.79",
"type": "module",
"main": "src/index.ts",
"exports": {
packages/styles/src/theme.ts
+48
View File
@@ -201,6 +201,30 @@ export const DEFAULT_THEMES: Record<string, ThemeTokens> = {
light: {
"color-scheme": "light",
"color-bg": "#ffffff",
"color-background": "#ffffff",
"color-foreground": "#0b1020",
"color-surface-raised": "#ffffff",
"color-surface-muted": "#eceff6",
"color-text-muted": "#5a6178",
"color-text-subtle": "#737b91",
"color-border-strong": "#c7cedd",
"color-primary-soft": "#eff6ff",
"color-secondary-soft": "#f1f5f9",
"color-info-soft": "#e0f2fe",
"color-success-soft": "#ecfdf3",
"color-warning-soft": "#fffbeb",
"color-danger-soft": "#fef2f2",
"color-code-background": "#0b1020",
"color-code-surface": "#141a30",
"color-code-text": "#e7ecff",
"color-code-muted": "#9aa6d0",
"color-code-border": "#27304d",
"shadow-sm": "0 1px 2px rgba(16,24,40,0.06)",
"shadow-md": "0 8px 24px rgba(16,24,40,0.10)",
"shadow-lg": "0 20px 50px rgba(16,24,40,0.14)",
"space-section": "5rem",
"space-section-sm": "3.5rem",
"container-max": "80rem",
"color-surface": "#f6f7fb",
"color-surface-2": "#eceff6",
"color-text": "#0b1020",
@@ -225,6 +249,30 @@ export const DEFAULT_THEMES: Record<string, ThemeTokens> = {
dark: {
"color-scheme": "dark",
"color-bg": "#0b1020",
"color-background": "#0b1020",
"color-foreground": "#e7ecff",
"color-surface-raised": "#1a223b",
"color-surface-muted": "#1c243f",
"color-text-muted": "#aab4d8",
"color-text-subtle": "#8995bd",
"color-border-strong": "#ffffff38",
"color-primary-soft": "#6c8cff24",
"color-secondary-soft": "#a78bfa24",
"color-info-soft": "#38bdf824",
"color-success-soft": "#4ade8024",
"color-warning-soft": "#fbbf2424",
"color-danger-soft": "#f8717124",
"color-code-background": "#060a15",
"color-code-surface": "#10172a",
"color-code-text": "#e7ecff",
"color-code-muted": "#9aa6d0",
"color-code-border": "#ffffff24",
"shadow-sm": "0 1px 2px rgba(0,0,0,0.28)",
"shadow-md": "0 10px 30px rgba(0,0,0,0.35)",
"shadow-lg": "0 24px 64px rgba(0,0,0,0.45)",
"space-section": "5rem",
"space-section-sm": "3.5rem",
"container-max": "80rem",
"color-surface": "#141a30",
"color-surface-2": "#1c243f",
"color-text": "#e7ecff",
packages/test/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/test",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/tracking/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/tracking",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/ui/components/AnalyticsDashboardPreview.wrn
+41 -21
View File
@@ -11,37 +11,57 @@ component AnalyticsDashboardPreview {
}
view {
<section class="px-4 sm:px-6 lg:px-8 {class}">
<div class="mx-auto grid w-full max-w-7xl gap-8 overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-5 shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.08))] sm:p-7 lg:grid-cols-[1.25fr_0.75fr] lg:items-center lg:p-8">
<section class="px-4 py-10 sm:px-6 sm:py-12 lg:px-8 lg:py-14 {class}">
<div
class="mx-auto grid w-full max-w-7xl gap-8 overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-5 shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.08))] sm:p-7 lg:grid-cols-[minmax(0,1.15fr)_minmax(20rem,0.85fr)] lg:items-center lg:p-8"
>
<div>
{#if image}
<img src="{image}" alt="{alt}" class="aspect-[16/9] w-full rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] object-cover" />
<img
src="{image}"
alt="{alt}"
class="aspect-[16/9] w-full rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] object-cover"
/>
{:else}
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] p-4 sm:p-5" role="img" aria-label="Delivery trend rising over seven days">
<div class="flex items-center justify-between gap-4 text-sm">
<strong class="text-[var(--wire-color-text,#0f172a)]">Delivery trend</strong>
<span class="font-bold text-[var(--wire-color-success,#059669)]">↗ 18.4%</span>
</div>
<svg class="mt-4 h-auto w-full text-[var(--wire-color-primary,#059669)]" viewBox="0 0 700 250" aria-hidden="true">
<defs>
<linearGradient id="wire-analytics-area" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="currentColor" stop-opacity=".24"></stop>
<stop offset="100%" stop-color="currentColor" stop-opacity="0"></stop>
</linearGradient>
</defs>
<g fill="none" stroke="var(--wire-color-border,#e2e8f0)"><path d="M20 50H680M20 115H680M20 180H680M20 230H680"></path></g>
<path fill="url(#wire-analytics-area)" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32 L680 230 L20 230Z"></path>
<path fill="none" stroke="currentColor" stroke-width="6" stroke-linecap="round" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32"></path>
</svg>
<div class="mt-2 flex justify-between text-[0.7rem] text-[var(--wire-color-text-muted,#64748b)]"><span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span></div>
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] p-4 sm:p-5"
role="img"
aria-label="Delivery trend rising over seven days"
>
<div class="flex items-center justify-between gap-4 text-sm">
<strong class="text-[var(--wire-color-text,#0f172a)]">Delivery trend</strong>
<span class="font-bold text-[var(--wire-color-success,#059669)]">↗ 18.4%</span>
</div>
<svg
class="mt-4 h-auto w-full text-[var(--wire-color-primary,#059669)]"
viewBox="0 0 700 250"
aria-hidden="true"
>
<defs>
<linearGradient
id="wire-analytics-area"
x1="0"
y1="0"
x2="0"
y2="1"
>
<stop offset="0%" stop-color="currentColor" stop-opacity=".24"></stop>
<stop offset="100%" stop-color="currentColor" stop-opacity="0"></stop>
</linearGradient>
</defs>
<g fill="none" stroke="var(--wire-color-border,#e2e8f0)"><path d="M20 50H680M20 115H680M20 180H680M20 230H680"></path></g>
<path fill="url(#wire-analytics-area)" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32 L680 230 L20 230Z"></path>
<path fill="none" stroke="currentColor" stroke-width="6" stroke-linecap="round" d="M20 210 C100 195 120 150 190 165 S310 195 370 120 S475 130 525 100 S610 90 680 32"></path>
</svg>
<div class="mt-2 flex justify-between text-[0.7rem] text-[var(--wire-color-muted,#64748b)]"><span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span></div>
</div>
{/if}
</div>
<div>
{#if eyebrow}<p class="m-0 text-xs font-bold uppercase tracking-[0.16em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</p>{/if}
{#if title}<h2 class="mt-4 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)]">{title}</h2>{/if}
{#if description}<p class="mt-4 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-4 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
<div class="mt-5"><slot /></div>
{#if href}<a href="{href}" class="mt-6 inline-flex items-center gap-2 font-semibold text-[var(--wire-color-primary,#059669)] no-underline">{actionLabel}<span aria-hidden="true">→</span></a>{/if}
</div>
packages/ui/components/ChannelCard.wrn
+12 -6
View File
@@ -8,21 +8,27 @@ component ChannelCard {
}
view {
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article
class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}"
>
<div class="flex min-h-12 items-start justify-between gap-4">
{#if icon}
<span class="inline-grid h-12 w-12 shrink-0 place-items-center rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-xl text-[var(--wire-color-primary,#059669)] {icon}" aria-hidden="true"></span>
<span class="inline-grid h-12 w-12 shrink-0 place-items-center rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-xl text-[var(--wire-color-primary,#059669)] {icon}" aria-hidden="true"></span>
{/if}
<div class="flex min-w-0 justify-end"><slot /></div>
</div>
{#if title}<h3 class="mt-5 text-xl font-semibold tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center justify-between gap-3 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]" aria-label="Explore {title}">
<span>Explore {title}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
</a>
<a
href="{href}"
class="mt-6 inline-flex items-center justify-between gap-3 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]"
aria-label="Explore {title}"
>
<span>Explore {title}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
</a>
{/if}
</article>
}
packages/ui/components/ChannelFlow.wrn
+20 -8
View File
@@ -4,22 +4,32 @@ component ChannelFlow {
}
view {
<div class="grid grid-cols-1 items-center gap-3 lg:grid-cols-[1fr_auto_1fr_auto_1.2fr_auto_1fr] {class}" role="img" aria-label="Customer event flows through profile and consent checks to communication channels, then delivery analytics and webhooks">
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="grid grid-cols-1 items-center gap-3 lg:grid-cols-[1fr_auto_1fr_auto_1.2fr_auto_1fr] {class}"
role="img"
aria-label="Customer event flows through profile and consent checks to communication channels, then delivery analytics and webhooks"
>
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--webhook] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Customer event</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">order.shipped</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">order.shipped</small>
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--shield-check] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Profile + consent</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">Eligibility checked</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">Eligibility checked</small>
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="grid grid-cols-2 gap-2 rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-3">
<div
class="grid grid-cols-2 gap-2 rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-3"
>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">WhatsApp</span>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">SMS</span>
<span class="rounded-xl bg-[var(--wire-color-primary-soft,#ecfdf5)] px-3 py-2.5 text-center text-xs font-bold text-[var(--wire-color-primary,#059669)]">Email</span>
@@ -27,10 +37,12 @@ component ChannelFlow {
</div>
<span class="hidden text-center text-xl text-[var(--wire-color-primary,#059669)] lg:block" aria-hidden="true">→</span>
<div class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4">
<div
class="rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-4"
>
<span class="icon-[lucide--chart-no-axes-combined] text-xl text-[var(--wire-color-primary,#059669)]" aria-hidden="true"></span>
<strong class="mt-3 block text-sm text-[var(--wire-color-text,#0f172a)]">Delivery + analytics</strong>
<small class="mt-1 block text-[var(--wire-color-text-muted,#64748b)]">Webhook emitted</small>
<small class="mt-1 block text-[var(--wire-color-muted,#64748b)]">Webhook emitted</small>
</div>
</div>
}
packages/ui/components/CodeBlock.wrn
+7 -7
View File
@@ -1,11 +1,11 @@
component CodeBlock {
props {
language = "text"
title = ""
code = ""
copyable = true
class = ""
}
props {
language = "text"
title = ""
code = ""
copyable = true
class = ""
}
view {
<section class="overflow-hidden bg-[var(--wire-color-code-background,#020617)] text-[var(--wire-color-code-text,#e2e8f0)] {class}">
packages/ui/components/CodeTabs.wrn
+3 -1
View File
@@ -4,7 +4,9 @@ component CodeTabs {
}
view {
<div class="overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] {class}">
<div
class="overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] {class}"
>
<slot />
</div>
}
packages/ui/components/FeatureTabs.wrn
+2 -2
View File
@@ -11,7 +11,7 @@ component FeatureTabs {
}
view {
<article class="group flex h-full min-h-72 flex-col overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article class="group flex h-full min-h-72 flex-col overflow-hidden rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}">
{#if image}
<img src="{image}" alt="{alt}" class="aspect-[16/9] w-full border-b border-[var(--wire-color-border,#e2e8f0)] object-cover" />
{/if}
@@ -19,7 +19,7 @@ component FeatureTabs {
<div class="flex flex-1 flex-col p-6">
{#if eyebrow}<p class="m-0 text-xs font-bold uppercase tracking-[0.14em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</p>{/if}
{#if title}<h3 class="mt-4 text-xl font-semibold leading-snug tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
<div class="mt-5"><slot /></div>
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center gap-2 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]">
packages/ui/components/FinalCTA.wrn
+36 -3
View File
@@ -11,25 +11,58 @@ component FinalCTA {
view {
<span class="contents {class}">
{#if href}
{#if variant === "primary"}
<a
href="{href}"
class=' group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl px-5 py-2.5 text-sm font-semibold no-underline transition duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--wire-color-background,#ffffff)] {variant === "primary" ? "bg-[var(--wire-color-primary,#059669)] text-[var(--wire-color-primary-contrast,#ffffff)] hover:bg-[var(--wire-color-primary-hover,#047857)]" : "border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] text-[var(--wire-color-text,#0f172a)] hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)]"} '
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl bg-[var(--wire-color-primary,#059669)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-primary-contrast,#ffffff)] no-underline transition duration-200 hover:bg-[var(--wire-color-primary-hover,#047857)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
aria-disabled="{disabled}"
>
<span>{label}</span>
<span class="transition-transform duration-200 group-hover:translate-x-0.5" aria-hidden="true">→</span>
<span
class="transition-transform duration-200 group-hover:translate-x-0.5"
aria-hidden="true"
>
→
</span>
<slot />
</a>
{:else}
<a
href="{href}"
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-text,#0f172a)] no-underline transition duration-200 hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
aria-disabled="{disabled}"
>
<span>{label}</span>
<span
class="transition-transform duration-200 group-hover:translate-x-0.5"
aria-hidden="true"
>
→
</span>
<slot />
</a>
{/if}
{:else}
{#if variant === "primary"}
<button
type="{type}"
disabled="{disabled}"
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl bg-[var(--wire-color-primary,#059669)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-primary-contrast,#ffffff)] transition duration-200 hover:bg-[var(--wire-color-primary-hover,#047857)] disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
>
<span>{label}</span>
<slot />
</button>
{:else}
<button
type="{type}"
disabled="{disabled}"
class=' group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl px-5 py-2.5 text-sm font-semibold transition duration-200 disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--wire-color-background,#ffffff)] {variant === "primary" ? "bg-[var(--wire-color-primary,#059669)] text-[var(--wire-color-primary-contrast,#ffffff)] hover:bg-[var(--wire-color-primary-hover,#047857)]" : "border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] text-[var(--wire-color-text,#0f172a)] hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)]"} '
class="group inline-flex min-h-11 items-center justify-center gap-2 rounded-xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] px-5 py-2.5 text-sm font-semibold text-[var(--wire-color-text,#0f172a)] transition duration-200 hover:border-[var(--wire-color-primary,#059669)] hover:text-[var(--wire-color-primary,#059669)] disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)] focus-visible:ring-offset-2"
>
<span>{label}</span>
<slot />
</button>
{/if}
{/if}
</span>
}
}
packages/ui/components/MarketingSectionHeader.wrn
+3 -3
View File
@@ -8,7 +8,7 @@ component MarketingSectionHeader {
}
view {
<section class="px-4 py-16 sm:px-6 sm:py-20 lg:px-8 {class}">
<section class="px-4 py-12 sm:px-6 sm:py-16 lg:px-8 lg:py-20 {class}">
<div class="mx-auto w-full max-w-7xl">
<header
class="max-w-3xl"
@@ -22,11 +22,11 @@ component MarketingSectionHeader {
<h2 class="m-0 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">{title}</h2>
{/if}
{#if description}
<p class="mt-5 text-base leading-8 text-[var(--wire-color-text-muted,#64748b)] sm:text-lg">{description}</p>
<p class="mt-5 text-base leading-8 text-[var(--wire-color-muted,#64748b)] sm:text-lg">{description}</p>
{/if}
</header>
<div class="mt-8">
<div class="mt-10">
<slot />
</div>
</div>
packages/ui/components/MetricGrid.wrn
+3 -3
View File
@@ -9,17 +9,17 @@ component MetricGrid {
<section class="px-4 sm:px-6 lg:px-8 {class}" aria-label="{label}">
<div class="mx-auto grid w-full max-w-7xl grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-4">
{#each metrics as metric}
<article class="flex min-h-40 flex-col justify-center rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))]">
<article class="flex min-h-40 flex-col justify-center rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))]">
<strong class="text-3xl font-semibold leading-none tracking-[-0.04em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">
{metric.value}
</strong>
<span class="mt-4 font-semibold text-[var(--wire-color-text,#0f172a)]">{metric.label}</span>
{#if metric.description}
<p class="mt-2 text-sm leading-6 text-[var(--wire-color-text-muted,#64748b)]">{metric.description}</p>
<p class="mt-2 text-sm leading-6 text-[var(--wire-color-muted,#64748b)]">{metric.description}</p>
{/if}
</article>
{:empty}
<p class="col-span-full rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] p-8 text-center text-[var(--wire-color-text-muted,#64748b)]">
<p class="col-span-full rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] p-8 text-center text-[var(--wire-color-muted,#64748b)]">
No metrics available.
</p>
{/each}
packages/ui/components/ProductArchitectureDiagram.wrn
+5 -5
View File
@@ -9,26 +9,26 @@ component ProductArchitectureDiagram {
}
view {
<section class="overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.08))] {class}" aria-label="{title}">
<section class="overflow-hidden rounded-3xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.08))] {class}" aria-label="{title}">
<header class="flex flex-col gap-4 border-b border-[var(--wire-color-border,#e2e8f0)] p-6 sm:flex-row sm:items-start sm:justify-between lg:p-8">
<div>
{#if title}<p class="m-0 font-semibold text-[var(--wire-color-text,#0f172a)]">{title}</p>{/if}
{#if value}<strong class="mt-3 block text-3xl font-semibold tracking-[-0.04em] text-[var(--wire-color-text,#0f172a)] sm:text-4xl">{value}</strong>{/if}
{#if description}<p class="mt-3 max-w-2xl leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 max-w-2xl leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
</div>
{#if loading}
<span class="inline-flex w-max items-center gap-2 rounded-full bg-[var(--wire-color-surface-muted,#f8fafc)] px-3 py-1.5 text-xs font-semibold text-[var(--wire-color-text-muted,#64748b)]">
<span class="inline-flex w-max items-center gap-2 rounded-full bg-[var(--wire-color-surface-2,#f8fafc)] px-3 py-1.5 text-xs font-semibold text-[var(--wire-color-muted,#64748b)]">
<span class="h-2 w-2 animate-pulse rounded-full bg-[var(--wire-color-primary,#059669)]"></span>Loading
</span>
{/if}
</header>
<div class="bg-[var(--wire-color-surface-muted,#f8fafc)] p-4 sm:p-6 lg:p-8 empty:hidden">
<div class="bg-[var(--wire-color-surface-2,#f8fafc)] p-4 sm:p-6 lg:p-8 empty:hidden">
<slot />
</div>
{#if summary}
<p class="m-0 border-t border-[var(--wire-color-border,#e2e8f0)] px-6 py-5 text-sm leading-6 text-[var(--wire-color-text-muted,#64748b)] lg:px-8">{summary}</p>
<p class="m-0 border-t border-[var(--wire-color-border,#e2e8f0)] px-6 py-5 text-sm leading-6 text-[var(--wire-color-muted,#64748b)] lg:px-8">{summary}</p>
{/if}
</section>
}
packages/ui/components/ProductCard.wrn
+3 -3
View File
@@ -10,13 +10,13 @@ component ProductCard {
}
view {
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-sm,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-md,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<article class="group flex h-full min-h-72 flex-col rounded-2xl border border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface,#ffffff)] p-6 shadow-[var(--wire-shadow-1,0_1px_2px_rgb(0_0_0/0.05))] transition duration-200 hover:-translate-y-1 hover:border-[var(--wire-color-primary,#059669)] hover:shadow-[var(--wire-shadow-1,0_12px_30px_rgb(0_0_0/0.10))] {class}">
<div class="flex min-h-7 items-start justify-between gap-4">
{#if eyebrow}<span class="text-xs font-bold uppercase tracking-[0.14em] text-[var(--wire-color-primary,#059669)]">{eyebrow}</span>{/if}
{#if status}<span class="shrink-0 rounded-full bg-[var(--wire-color-surface-muted,#f8fafc)] px-2.5 py-1 text-[0.7rem] font-bold text-[var(--wire-color-text-muted,#64748b)]">{status}</span>{/if}
{#if status}<span class="shrink-0 rounded-full bg-[var(--wire-color-surface-2,#f8fafc)] px-2.5 py-1 text-[0.7rem] font-bold text-[var(--wire-color-muted,#64748b)]">{status}</span>{/if}
</div>
{#if title}<h3 class="mt-5 text-xl font-semibold tracking-[-0.02em] text-[var(--wire-color-text,#0f172a)]">{title}</h3>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-3 flex-1 leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if href}
<a href="{href}" class="mt-6 inline-flex items-center gap-2 border-t border-[var(--wire-color-border,#e2e8f0)] pt-5 font-semibold text-[var(--wire-color-primary,#059669)] no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--wire-color-primary,#059669)]">
<span>{actionLabel}</span><span class="transition-transform group-hover:translate-x-0.5" aria-hidden="true">→</span>
packages/ui/components/ProductGrid.wrn
+4 -4
View File
@@ -8,17 +8,17 @@ component ProductGrid {
}
view {
<section class="px-4 sm:px-6 lg:px-8 {class}">
<section class="px-4 py-10 sm:px-6 sm:py-12 lg:px-8 lg:py-14 {class}">
<div class="mx-auto w-full max-w-7xl">
{#if title}<h2 class="m-0 text-3xl font-semibold tracking-[-0.035em] text-[var(--wire-color-text,#0f172a)]">{title}</h2>{/if}
{#if description}<p class="mt-4 max-w-3xl leading-7 text-[var(--wire-color-text-muted,#64748b)]">{description}</p>{/if}
{#if description}<p class="mt-4 max-w-3xl leading-7 text-[var(--wire-color-muted,#64748b)]">{description}</p>{/if}
{#if empty}
<div class="mt-8 rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] p-10 text-center text-[var(--wire-color-text-muted,#64748b)]">
<div class="mt-8 rounded-2xl border border-dashed border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] p-10 text-center text-[var(--wire-color-muted,#64748b)]">
{emptyText}
</div>
{:else}
<div class="mt-8 grid grid-cols-1 items-stretch gap-5 md:grid-cols-2 xl:grid-cols-3 [&>*]:min-w-0 [&>*]:h-full">
<div class="mt-8 grid grid-cols-1 items-stretch gap-6 md:grid-cols-2 xl:grid-cols-3 xl:gap-7 [&>*]:min-w-0 [&>*]:h-full">
<slot />
</div>
{/if}
packages/ui/components/ProductHero.wrn
+20 -20
View File
@@ -9,17 +9,9 @@ component ProductHero {
view {
<section
class="
relative isolate overflow-hidden border-b border-[var(--wire-color-border,#e2e8f0)]
bg-[var(--wire-color-background,#ffffff)] px-4 py-16 sm:px-6 sm:py-20 lg:px-8 lg:py-24
{class}
"
class=" relative isolate overflow-hidden border-b border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-bg,#ffffff)] px-4 py-14 sm:px-6 sm:py-18 lg:px-8 lg:py-20 {class} "
>
<div
class="pointer-events-none absolute inset-0 -z-10 opacity-80"
style="background: radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--wire-color-primary, #059669) 16%, transparent), transparent 36%);"
aria-hidden="true"
></div>
<div class="pointer-events-none absolute inset-0 -z-10 opacity-80" style="background: radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--wire-color-primary, #059669) 16%, transparent), transparent 36%);" aria-hidden="true" ></div>
<div class="mx-auto w-full max-w-7xl">
<div
@@ -28,25 +20,33 @@ component ProductHero {
class:text-center='{align === "center"}'
>
{#if eyebrow}
<p class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-[var(--wire-color-primary,#059669)] sm:text-sm">
{eyebrow}
</p>
<p
class="mb-4 text-xs font-bold uppercase tracking-[0.18em] text-[var(--wire-color-primary,#059669)] sm:text-sm"
>
{eyebrow}
</p>
{/if}
{#if title}
<h1 class="m-0 max-w-[18ch] text-4xl font-semibold leading-[1.05] tracking-[-0.045em] text-[var(--wire-color-text,#0f172a)] sm:text-5xl lg:text-6xl" class:mx-auto='{align === "center"}'>
{title}
</h1>
<h1
class="m-0 max-w-[18ch] text-4xl font-semibold leading-[1.05] tracking-[-0.045em] text-[var(--wire-color-text,#0f172a)] sm:text-5xl lg:text-6xl"
class:mx-auto='{align === "center"}'
>
{title}
</h1>
{/if}
{#if description}
<p class="mt-6 max-w-3xl text-base leading-8 text-[var(--wire-color-text-muted,#64748b)] sm:text-lg" class:mx-auto='{align === "center"}'>
{description}
</p>
<p
class="mt-6 max-w-3xl text-base leading-8 text-[var(--wire-color-muted,#64748b)] sm:text-lg"
class:mx-auto='{align === "center"}'
>
{description}
</p>
{/if}
</div>
<div class="mt-8 space-y-8">
<div class="mt-10 space-y-10">
<slot />
</div>
</div>
packages/ui/components/ProductPageShell.wrn
+4 -9
View File
@@ -1,16 +1,11 @@
component ProductPageShell {
props { class = "" }
props {
class = ""
}
view {
<main
class="
min-h-screen w-full overflow-x-clip
bg-[var(--wire-color-background,#ffffff)]
font-[var(--wire-font-sans,ui-sans-serif,system-ui,sans-serif)]
text-[var(--wire-color-text,#0f172a)]
antialiased
{class}
"
class=" min-h-screen w-full overflow-x-clip bg-[var(--wire-color-bg,#ffffff)] font-[var(--wire-font-sans,ui-sans-serif,system-ui,sans-serif)] text-[var(--wire-color-text,#0f172a)] antialiased {class} "
>
<slot />
</main>
packages/ui/components/ProductStatusBadge.wrn
+1 -1
View File
@@ -7,7 +7,7 @@ component ProductStatusBadge {
view {
<span
class=' inline-flex w-max items-center gap-1.5 rounded-full border px-2.5 py-1 text-[0.7rem] font-bold leading-none {status === "warning" ? "border-[var(--wire-color-warning,#d97706)] bg-[var(--wire-color-warning-soft,#fffbeb)] text-[var(--wire-color-warning,#d97706)]" : status === "muted" ? "border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-muted,#f8fafc)] text-[var(--wire-color-text-muted,#64748b)]" : "border-[var(--wire-color-primary,#059669)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-[var(--wire-color-primary,#059669)]"} {class} '
class=' inline-flex w-max items-center gap-1.5 rounded-full border px-2.5 py-1 text-[0.7rem] font-bold leading-none {status === "warning" ? "border-[var(--wire-color-warning,#d97706)] bg-[var(--wire-color-warning-soft,#fffbeb)] text-[var(--wire-color-warning,#d97706)]" : status === "muted" ? "border-[var(--wire-color-border,#e2e8f0)] bg-[var(--wire-color-surface-2,#f8fafc)] text-[var(--wire-color-muted,#64748b)]" : "border-[var(--wire-color-primary,#059669)] bg-[var(--wire-color-primary-soft,#ecfdf5)] text-[var(--wire-color-primary,#059669)]"} {class} '
>
<span class="h-1.5 w-1.5 rounded-full bg-current" aria-hidden="true"></span>
{label}
packages/ui/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/ui",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/uploader/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/uploader",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
packages/validation/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@wrnexus/validation",
"version": "0.2.78",
"version": "0.2.79",
"private": true,
"type": "module",
"main": "src/index.ts",
update-package-versions.mjs
+1 -1
View File
@@ -1,7 +1,7 @@
import { existsSync, readdirSync, readFileSync, writeFileSync } from "node:fs";
import { join } from "node:path";
const version = "0.2.78";
const version = "0.2.79";
const dependencyGroups = [
"dependencies",