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/Tabs.wrn
+11 -11
View File
@@ -127,14 +127,14 @@ component Tabs {
data-slide='{slideFrom}'
data-mode='{mode}'
data-param='{param}'
>
data-wrn-owner="Tabs" data-wrn-part="root" data-wrn-component="Tabs" data-wrn-axis-color='{color}' data-wrn-axis-size='{size}'>
<div
class="wrn-tabs__list"
role="tablist"
aria-label='{label}'
aria-orientation='{orientation}'
data-wrn-roving='{rovingAxis()}'
>
data-wrn-owner="Tabs" data-wrn-part="list" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">
{#each itemList() as item, index}
<button
type="button"
@@ -147,15 +147,15 @@ component Tabs {
aria-selected='{isSelected(item, index) ? "true" : "false"}'
aria-disabled='{item.disabled ? "true" : "false"}'
@click='selectTab(item, index, event)'
>
<span class='wrn-tabs__icon {item.icon}' data-show="item.icon" aria-hidden="true"></span>
<span class="wrn-tabs__label">{item.label || item.title}</span>
<span class="wrn-tabs__badge" data-show="item.badge">{item.badge}</span>
data-wrn-owner="Tabs" data-wrn-part="tab" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">
<span class='wrn-tabs__icon {item.icon}' data-show="item.icon" aria-hidden="true" data-wrn-owner="Tabs" data-wrn-part="icon" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}"></span>
<span class="wrn-tabs__label" data-wrn-owner="Tabs" data-wrn-part="label" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">{item.label || item.title}</span>
<span class="wrn-tabs__badge" data-show="item.badge" data-wrn-owner="Tabs" data-wrn-part="badge" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">{item.badge}</span>
</button>
{/each}
</div>
<div class="wrn-tabs__panels">
<div class="wrn-tabs__panels" data-wrn-owner="Tabs" data-wrn-part="panels" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">
{#each itemList() as item, index}
<div
class="wrn-tabs__panel"
@@ -164,12 +164,12 @@ component Tabs {
aria-labelledby='{tabId(item, index)}'
tabindex="0"
data-show='isSelected(item, index)'
>
<h3 class="wrn-tabs__title" data-show="item.title && item.title !== item.label">
data-wrn-owner="Tabs" data-wrn-part="panel" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">
<h3 class="wrn-tabs__title" data-show="item.title && item.title !== item.label" data-wrn-owner="Tabs" data-wrn-part="title" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">
{item.title}
</h3>
<p class="wrn-tabs__description" data-show="item.description">{item.description}</p>
<div class="wrn-tabs__content" data-show="item.content">{item.content}</div>
<p class="wrn-tabs__description" data-show="item.description" data-wrn-owner="Tabs" data-wrn-part="description" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">{item.description}</p>
<div class="wrn-tabs__content" data-show="item.content" data-wrn-owner="Tabs" data-wrn-part="content" data-wrn-axis-color="{color}" data-wrn-axis-size="{size}">{item.content}</div>
<slot name='{panelSlot(item, index)}'></slot>
</div>
{/each}