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

feat: release design system engine, studio and component contracts

Browse Source
This commit is contained in:
Clintchiz committed 2026-10-19 13:09:03 +05:30
1 parent ff1065fb27
commit 3943b946d6
693 files changed
+175546 -3894
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/ui/components/Marquee.wrn
+15 -15
View File
@@ -22,11 +22,11 @@ component Marquee {
data-ui-component="Marquee"
aria-label='{title}'
class='wrn-marquee {class}'
>
<div class="wrn-marquee__layout">
data-wrn-owner="Marquee" data-wrn-part="root" data-wrn-component="Marquee" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<div class="wrn-marquee__layout" data-wrn-owner="Marquee" data-wrn-part="layout" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
{#if title}
<div class="wrn-marquee__title">
<span class="icon-[lucide--megaphone] wrn-marquee__icon" aria-hidden="true"></span>
<div class="wrn-marquee__title" data-wrn-owner="Marquee" data-wrn-part="title" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span class="icon-[lucide--megaphone] wrn-marquee__icon" aria-hidden="true" data-wrn-owner="Marquee" data-wrn-part="icon" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
<span>{title}</span>
</div>
{/if}
@@ -37,28 +37,28 @@ component Marquee {
@mouseleave='paused = false; output.resume({})'
@focusin='paused = true'
@focusout='paused = false'
>
data-wrn-owner="Marquee" data-wrn-part="window" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<div
class="wrn-marquee__track"
class:wrn-marquee-paused='paused'
>
data-wrn-owner="Marquee" data-wrn-part="track" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
{#each items as item}
<a
href='{item.href || "#"}'
class="wrn-marquee__item"
>
data-wrn-owner="Marquee" data-wrn-part="item" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span
class="wrn-marquee__dot"
data-color='{item.color || "primary"}'
aria-hidden="true"
></span>
data-wrn-owner="Marquee" data-wrn-part="dot" data-wrn-axis-size="{size}" data-wrn-axis-color='{item.color || "primary"}' data-wrn-axis-variant="{variant}"></span>
<span>{item.label || item.title}</span>
{#if item.meta}
<span class="wrn-marquee__meta">{item.meta}</span>
<span class="wrn-marquee__meta" data-wrn-owner="Marquee" data-wrn-part="meta" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">{item.meta}</span>
{/if}
</a>
{:empty}
<p class="wrn-marquee__empty">{description || "No announcements available."}</p>
<p class="wrn-marquee__empty" data-wrn-owner="Marquee" data-wrn-part="empty" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">{description || "No announcements available."}</p>
{/each}
{#if items.length > 0}
@@ -68,8 +68,8 @@ component Marquee {
aria-hidden="true"
tabindex="-1"
class="wrn-marquee__item"
>
<span class="wrn-marquee__dot" aria-hidden="true"></span>
data-wrn-owner="Marquee" data-wrn-part="item" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span class="wrn-marquee__dot" aria-hidden="true" data-wrn-owner="Marquee" data-wrn-part="dot" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
<span>{item.label || item.title}</span>
</a>
{/each}
@@ -82,9 +82,9 @@ component Marquee {
aria-label='{paused ? "Resume announcements" : "Pause announcements"}'
class="wrn-marquee__toggle"
@click='paused = !paused; paused ? output.pause({}) : output.resume({})'
>
<span class="icon-[lucide--pause] wrn-marquee__icon" data-show='!paused' aria-hidden="true"></span>
<span class="icon-[lucide--play] wrn-marquee__icon" data-show='paused' aria-hidden="true"></span>
data-wrn-owner="Marquee" data-wrn-part="toggle" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span class="icon-[lucide--pause] wrn-marquee__icon" data-show='!paused' aria-hidden="true" data-wrn-owner="Marquee" data-wrn-part="icon" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
<span class="icon-[lucide--play] wrn-marquee__icon" data-show='paused' aria-hidden="true" data-wrn-owner="Marquee" data-wrn-part="icon" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
</button>
</div>