feat: release design system engine, studio and component contracts

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

No files matched your search

+15 -15
View File
@@ -93,7 +93,7 @@ component Popover {
data-variant='{variant}'
class='wrn-popover {class}'
@keydown='handleKeydown(event)'
>
data-wrn-owner="Popover" data-wrn-part="root" data-wrn-component="Popover" data-wrn-axis-size='{size}' data-wrn-axis-color='{color}' data-wrn-axis-variant='{variant}'>
<button
type="button"
class="wrn-popover__trigger"
@@ -101,7 +101,7 @@ component Popover {
aria-haspopup="dialog"
aria-expanded='{open || visible ? "true" : "false"}'
@click='togglePopover(event)'
>
data-wrn-owner="Popover" data-wrn-part="trigger" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<slot name="trigger"></slot>
{#if triggerIcon}
<span class='{triggerIcon}' aria-hidden="true"></span>
@@ -118,7 +118,7 @@ component Popover {
data-show='{open || visible}'
aria-label='{closeLabel}'
@click='hidePopover("outside", event)'
></button>
data-wrn-owner="Popover" data-wrn-part="dismissLayer" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></button>
{/if}
<section
@@ -127,21 +127,21 @@ component Popover {
data-show='{open || visible}'
role="dialog"
aria-label='{title || triggerLabel}'
>
data-wrn-owner="Popover" data-wrn-part="panel" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
{#if showArrow}
<span class="wrn-popover__arrow" data-wrn-anchor-arrow="true" aria-hidden="true"></span>
<span class="wrn-popover__arrow" data-wrn-anchor-arrow="true" aria-hidden="true" data-wrn-owner="Popover" data-wrn-part="arrow" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
{/if}
{#if title || description || icon || showClose}
<header class="wrn-popover__header">
<div class="wrn-popover__heading">
<header class="wrn-popover__header" data-wrn-owner="Popover" data-wrn-part="header" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<div class="wrn-popover__heading" data-wrn-owner="Popover" data-wrn-part="heading" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
{#if icon}
<span class='wrn-popover__icon {icon}' aria-hidden="true"></span>
<span class='wrn-popover__icon {icon}' aria-hidden="true" data-wrn-owner="Popover" data-wrn-part="icon" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"></span>
{/if}
<div class="wrn-popover__heading-copy">
<div class="wrn-popover__heading-copy" data-wrn-owner="Popover" data-wrn-part="headingCopy" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<slot name="header"></slot>
{#if title}
<h3>{title}</h3>
<h3 data-wrn-owner="Popover" data-wrn-part="title" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">{title}</h3>
{/if}
{#if description}
<p>{description}</p>
@@ -155,25 +155,25 @@ component Popover {
class="wrn-popover__close"
aria-label='{closeLabel}'
@click='hidePopover("close-button", event)'
>
data-wrn-owner="Popover" data-wrn-part="close" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span class="icon-[lucide--x]" aria-hidden="true"></span>
</button>
{/if}
</header>
{/if}
<div class="wrn-popover__body">
<div class="wrn-popover__body" data-wrn-owner="Popover" data-wrn-part="body" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<slot></slot>
</div>
{#if actionLabel}
<footer class="wrn-popover__footer">
<footer class="wrn-popover__footer" data-wrn-owner="Popover" data-wrn-part="footer" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
{#if actionHref}
<a
href='{actionHref}'
class="wrn-popover__action"
@click='activateAction(event)'
>
data-wrn-owner="Popover" data-wrn-part="action" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span>{actionLabel}</span>
{#if actionIcon}
<span class='{actionIcon}' aria-hidden="true"></span>
@@ -186,7 +186,7 @@ component Popover {
type="button"
class="wrn-popover__action"
@click='activateAction(event)'
>
data-wrn-owner="Popover" data-wrn-part="action" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}">
<span>{actionLabel}</span>
{#if actionIcon}
<span class='{actionIcon}' aria-hidden="true"></span>