update compiler plugin tests, components lib

Author: wakaztahir

lang/libs/components/src/Alert.ch

@@ -172,6 +172,11 @@ public #universal AlertInfo(props) {
     return <Alert {...props} variant="info">{props.children}</Alert>
 }
 
+// Destructive variant (shadcn naming convention)
+public #universal AlertDestructive(props) {
+    return <Alert {...props} variant="error">{props.children}</Alert>
+}
+
 // Shadcn AlertAction: positioned absolutely in the top-right corner of the alert.
 func alert_action_styles(page : &mut HtmlPage) : *char {
     return #css {

lang/libs/components/src/Avatar.ch

@@ -85,16 +85,10 @@ public #universal Avatar(props) {
     var size = props.size || "md"
     var out = classes + " " + ${avatar_styles(page)}
     var bordered = props.bordered ? "true" : "false"
-    return <span data-size={size} data-bordered={bordered} class={out}>{
-        props.src ? <img class={${avatar_img_styles(page)}} src={props.src} alt={props.alt} />
-                  : (props.fallback ? <span class={${avatar_fallback_styles(page)}}>{props.fallback}</span> : props.children)
-    }</span>
-}
-
-public #universal AvatarGroup(props) {
-    var classes = props.class || ""
-    if(props.className) { classes = props.className }
-    return <div class={classes + " " + ${avatar_group_styles(page)}}>{props.children}</div>
+    return <span data-size={size} data-bordered={bordered} class={out}>
+        {props.src ? <img class={${avatar_img_styles(page)}} src={props.src} alt={props.alt} />
+                  : (props.fallback ? <span class={${avatar_fallback_styles(page)}}>{props.fallback}</span> : props.children)}
+    </span>
 }
 
 public #universal AvatarMore(props) {
@@ -104,6 +98,39 @@ public #universal AvatarMore(props) {
     return <span class={classes + " " + ${avatar_count_styles(page)}}>{count}</span>
 }
 
+// Shadcn AvatarBadge: online/status indicator positioned bottom-right of avatar
+func avatar_badge_styles(page : &mut HtmlPage) : *char {
+    return #css {
+        position: absolute;
+        bottom: 0;
+        right: 0;
+        width: 12px;
+        height: 12px;
+        border-radius: 9999px;
+        border: 2px solid hsl(var(--background));
+        background: hsl(var(--success));
+    }
+}
+
+public #universal AvatarBadge(props) {
+    var classes = (props.className || props.class) || ""
+    return <span class={classes + " " + ${avatar_badge_styles(page)}} aria-label={props.label || "status"}></span>
+}
+
+// Shadcn AvatarGroup: overlapping avatar group container
+public #universal AvatarGroup(props) {
+    var classes = (props.className || props.class) || ""
+    var max = props.max || 0
+    var children = props.children
+    return <div class={classes + " " + ${avatar_group_styles(page)}}>{children}</div>
+}
+
+// Shadcn AvatarGroupCount: shows +N overflow count
+public #universal AvatarGroupCount(props) {
+    var classes = (props.className || props.class) || ""
+    return <span class={classes + " " + ${avatar_count_styles(page)}}>{props.children}</span>
+}
+
 // Legacy aliases
 public #universal AvatarSm(props) {
     return <Avatar {...props} size="sm">{props.children}</Avatar>

lang/libs/components/src/Badge.ch

@@ -72,6 +72,21 @@ func badge_styles(page : &mut HtmlPage) : *char {
             color: hsl(var(--info));
             background: transparent;
         }
+        &[data-variant="ghost"] {
+            background: transparent;
+            border-color: transparent;
+            color: hsl(var(--foreground));
+            &:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
+        }
+        &[data-variant="link"] {
+            background: transparent;
+            border-color: transparent;
+            color: hsl(var(--primary));
+            text-decoration: underline;
+            text-underline-offset: 4px;
+            cursor: pointer;
+            &:hover { text-decoration: underline; }
+        }
         &[data-size="xs"] {
             font-size: 0.625rem;
             padding: 0 0.4375rem;
@@ -134,3 +149,9 @@ public #universal BadgeInfo(props) {
 public #universal BadgeWarning(props) {
     return <Badge {...props} variant="warning">{props.children}</Badge>
 }
+public #universal BadgeGhost(props) {
+    return <Badge {...props} variant="ghost">{props.children}</Badge>
+}
+public #universal BadgeLink(props) {
+    return <Badge {...props} variant="link">{props.children}</Badge>
+}

lang/libs/components/src/Card.ch

@@ -19,6 +19,13 @@ func card_styles(page : &mut HtmlPage) : *char {
                 box-shadow: var(--shadow-md);
             }
         }
+        &[data-size="sm"] {
+            gap: 0.25rem;
+            padding: 0;
+            & > [data-slot="card-header"] { padding: 0.75rem 0.75rem 0; }
+            & > [data-slot="card-content"] { padding: 0 0.75rem; }
+            & > [data-slot="card-footer"] { padding: 0 0.75rem 0.75rem; }
+        }
     }
 }
 
@@ -95,8 +102,9 @@ func card_footer_styles(page : &mut HtmlPage) : *char {
 public #universal Card(props) {
     var classes = props.class || ""
     if(props.className) { classes = props.className }
+    var size = props.size || "default"
     var out = classes + " " + ${card_styles(page)}
-    return <div data-interactive={props.onClick ? "true" : "false"} class={out} onClick={props.onClick}>{props.children}</div>
+    return <div data-interactive={props.onClick ? "true" : "false"} data-size={size != "default" ? size : null} class={out} onClick={props.onClick}>{props.children}</div>
 }
 
 public #universal CardHeader(props) {