release: WRNexusJS 0.3.5

.publish/ui/components/Toast.wrn

@@ -1,13 +1,19 @@
 component Toast {
   props {
-    class = ""
-    title = "Saved"
+    size = "default"
+    color = "primary"
+    title = "Toast"
     description = ""
-    variant = "success"
-    duration = 5000
+    items = []
+    variant = "default"
+    class = ""
   }
-  state visible = true
   view {
-    <div data-show="visible" role="status" aria-live="polite" class="pointer-events-auto flex w-full max-w-sm items-start gap-3 rounded-2xl border bg-white p-4 shadow-2xl dark:border-slate-800 dark:bg-slate-900 {class}"><span class="mt-0.5 flex size-8 items-center justify-center rounded-full {variant === 'success' ? 'bg-emerald-100 text-emerald-700' : variant === 'danger' ? 'bg-red-100 text-red-700' : 'bg-blue-100 text-blue-700'}">{variant === 'success' ? '✓' : variant === 'danger' ? '!' : 'i'}</span><div class="min-w-0 flex-1"><p class="font-semibold">{title}</p><p data-show="description" class="mt-1 text-sm text-slate-500">{description}</p></div><button type="button" aria-label="Close" @click="visible = false" class="rounded-lg p-1 text-slate-400 hover:bg-slate-100">×</button></div>
+    <section class="wire-next wire-next--color-{color} wire-next--size-{size} wire-next--toast wire-next--variant-{variant} {class}">
+      {#if title}<strong>{title}</strong>{/if}
+      {#if description}<p>{description}</p>{/if}
+      {#if items}<div class="wire-next__items">{#each items as item}<span>{item.label}</span>{/each}</div>{/if}
+      <slot />
+    </section>
   }
 }