release: WRNexusJS 0.6.0

packages/ui/components/FeatureGrid.wrn

@@ -1,23 +1,27 @@
 component FeatureGrid {
   props {
-    items = []
-    columns = 3
-    tabletColumns = 2
-    mobileColumns = 1
-    gap = "md"
-    minItemWidth = ""
-    equalHeight = true
-    align = "stretch"
-    maxWidth = "full"
-    variant = "default"
-    label = "Features"
-    class = ""
+    size: string = "default"
+    color: string = "primary"
+    items: unknown[] = []
+    columns: number = 3
+    tabletColumns: number = 2
+    mobileColumns: number = 1
+    gap: string = "md"
+    minItemWidth: string = ""
+    equalHeight: boolean = true
+    align: string = "stretch"
+    maxWidth: string = "full"
+    variant: string = "default"
+    label: string = "Features"
+    class: string = ""
   }
 
   view {
     <section
       {...attrs}
       data-ui-component="FeatureGrid"
+      data-size='{size}'
+      data-color='{color}'
       data-columns='{columns}'
       data-tablet-columns='{tabletColumns}'
       data-mobile-columns='{mobileColumns}'
@@ -27,7 +31,7 @@ component FeatureGrid {
       data-align='{align}'
       data-max-width='{maxWidth}'
       data-variant='{variant}'
-      class='wire-feature-grid {class}'
+      class='wire-feature-grid wire-next--color-{color} wire-next--size-{size} {class}'
       aria-label='{label}'
       style='--wire-feature-grid-columns: {columns}; --wire-feature-grid-tablet-columns: {tabletColumns}; --wire-feature-grid-mobile-columns: {mobileColumns}; --wire-feature-grid-min-item-width: {minItemWidth || "17rem"};'
     >