[WIP] docs: standardize docs class table

packages/stacks-docs/_data/components/activity-indicator.json

@@ -1,29 +1,30 @@
 {
-  "indicator": [
+  "classes": [
     {
-      "class": ".s-activity-indicator",
-      "applies": "N/A",
+      "code": ".s-activity-indicator",
       "description": "Base activity indicator element with theme-aware coloring"
     },
     {
-      "class": ".s-activity-indicator__success",
+      "code": ".s-activity-indicator__success",
       "applies": ".s-activity-indicator",
       "description": "Styles the activity indicator in a success state"
     },
     {
-      "class": ".s-activity-indicator__warning",
+      "code": ".s-activity-indicator__warning",
       "applies": ".s-activity-indicator",
       "description": "Styles the activity indicator in a warning state"
     },
     {
-      "class": ".s-activity-indicator__danger",
+      "code": ".s-activity-indicator__danger",
       "applies": ".s-activity-indicator",
       "description": "Styles the activity indicator in a danger state"
     },
     {
-      "class": ".s-activity-indicator__sm",
+      "code": ".s-activity-indicator__sm",
       "applies": ".s-activity-indicator",
       "description": "Styles the activity indicator in a small size"
     }
-  ]
+  ],
+  "examples": ["", "3", "12", "370", "new"],
+  "variants": ["success", "warning", "danger"]
 }

packages/stacks-docs/_data/components/avatars-component.json → packages/stacks-docs/_data/components/avatars.json

@@ -1,59 +1,60 @@
 {
   "classes": [
     {
-      "class": ".s-avatar",
-      "applies": "N/A",
+      "code": ".s-avatar",
       "description": "The base avatar at 16px."
     },
     {
-      "class": ".s-avatar--image",
-      "applies": "N/A",
+      "code": ".s-avatar--image",
+      "parent": ".s-avatar",
       "description": "A child element for displaying a user’s profile image."
     },
     {
-      "class": ".s-avatar--letter",
-      "applies": "N/A",
+      "code": ".s-avatar--letter",
+      "parent": ".s-avatar",
       "description": "A child element for displaying an abbreviated Team name."
     },
     {
-      "class": ".s-avatar--badge",
-      "applies": "N/A",
+      "code": ".s-avatar--badge",
+      "parent": ".s-avatar",
       "description": "A child element that provides positioning to the shield on Team avatars."
     },
     {
-      "class": ".s-avatar--indicator",
-      "applies": "N/A",
+      "code": ".s-avatar--indicator",
+      "parent": ".s-avatar",
       "description": "A child element that provides positioning to the activity indicator on user's avatars."
     },
     {
-      "class": ".s-avatar__24",
+      "code": ".s-avatar__24",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 24px."
     },
     {
-      "class": ".s-avatar__32",
+      "code": ".s-avatar__32",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 32px."
     },
     {
-      "class": ".s-avatar__48",
+      "code": ".s-avatar__48",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 48px."
     },
     {
-      "class": ".s-avatar__64",
+      "code": ".s-avatar__64",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 64px."
     },
     {
-      "class": ".s-avatar__96",
+      "code": ".s-avatar__96",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 96px."
     },
     {
-      "class": ".s-avatar__128",
+      "code": ".s-avatar__128",
       "applies": ".s-avatar",
       "description": "Adds the proper border radius and scaling at 128px."
     }
-  ]
+  ],
+  "examples": [16, 24, 32, 48, 64, 96, 128],
+  "teamBgs": ["blue-400", "theme-primary", "png"]
 }