@rei/cedar 15.0.0-alpha.0 → 15.0.0-beta.0

package/dist/component-docgen.json

@@ -1,32 +1,4 @@
 {
-  "CdrAbstract": {
-    "name": "CdrAbstract",
-    "exportName": "default",
-    "displayName": "CdrAbstract",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "tag",
-        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'p'"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/abstract/CdrAbstract.vue"
-    ]
-  },
   "CdrAccordion": {
     "name": "CdrAccordion",
     "description": "Vertically-stacked list that allows users to expand and collapse additional content",
@@ -191,6 +163,34 @@
       }
     ]
   },
+  "CdrAbstract": {
+    "name": "CdrAbstract",
+    "exportName": "default",
+    "displayName": "CdrAbstract",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "tag",
+        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'p'"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/abstract/CdrAbstract.vue"
+    ]
+  },
   "CdrAccordionGroup": {
     "name": "CdrAccordionGroup",
     "exportName": "default",
@@ -228,184 +228,206 @@
       "./src/components/accordion/CdrAccordionGroup.vue"
     ]
   },
-  "CdrBreadcrumb": {
-    "name": "CdrBreadcrumb",
-    "description": "Navigation used to reveal a page's location within the site hierarchy",
+  "CdrBanner": {
+    "name": "CdrBanner",
+    "description": "Provides contextual feedback messages for typical user actions",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrBreadcrumb",
+    "displayName": "CdrBanner",
     "props": [
       {
-        "name": "items",
-        "description": "Sets the array of a breadcrumb object containing a 'url' and 'name' property.",
+        "name": "type",
+        "description": "Sets the banner style.",
         "tags": {
-          "demoIgnore": [
+          "demoSelectMultiple": [
             {
-              "description": "true",
-              "title": "demoIgnore"
+              "description": "false",
+              "title": "demoSelectMultiple"
             }
           ]
         },
+        "values": [
+          "info",
+          "warning",
+          "success",
+          "error",
+          "default"
+        ],
         "type": {
-          "name": "breadcrumbItem[]"
+          "name": "string"
         },
         "defaultValue": {
-          "func": true,
-          "value": "() => []"
+          "func": false,
+          "value": "'default'"
         }
+      }
+    ],
+    "slots": [
+      {
+        "name": "icon-left",
+        "description": "Icon matching banner type"
       },
       {
-        "name": "truncationEnabled",
-        "description": "Controls the ability to truncate the entire breadcrumb path. If this value is false, truncation will no longer occur.",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
+        "name": "default",
+        "description": "Primary message content"
       },
       {
-        "name": "id",
-        "description": "Define a custom ID for the `<nav>` element. Randomly generated if no ID provided.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "events": [
+        "name": "icon-right",
+        "description": "Additional icon"
+      },
       {
-        "name": "navigate",
-        "description": "Emits when a breadcrumb item is clicked. `e.preventDefault()` may be used to override the default link navigation.",
-        "properties": [
-          {
-            "type": {
-              "names": [
-                "mixed"
-              ]
-            },
-            "name": "breadcrumb",
-            "description": "The breadcrumb data object"
-          }
-        ],
-        "tags": [
-          {
-            "title": "param",
-            "type": {
-              "name": "mixed"
-            },
-            "name": "breadcrumb",
-            "description": "The breadcrumb data object"
-          }
-        ]
-      }
-    ],
-    "slots": [
+        "name": "message-body",
+        "description": "Additional content about the message"
+      },
       {
-        "name": "link",
-        "scoped": true,
-        "bindings": [
-          {
-            "name": "class",
-            "title": "binding"
-          },
-          {
-            "name": "href",
-            "title": "binding"
-          },
-          {
-            "name": "content",
-            "title": "binding"
-          }
-        ]
+        "name": "info-action",
+        "description": "Action-wrapped icon"
       }
     ],
     "sourceFiles": [
-      "./src/components/breadcrumb/CdrBreadcrumb.vue"
+      "./src/components/banner/CdrBanner.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-breadcrumb-ellipses-icon-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Ellipses icon color"
+        "name": "--cdr-banner-message-body-background-color",
+        "defaultValue": "--cdr-color-background-primary",
+        "description": "Message body background color"
       },
       {
-        "name": "--cdr-breadcrumb-ellipses-icon-highlight-color",
-        "defaultValue": "--cdr-color-text-link-hover",
-        "description": "Ellipses icon hover, active and focus color"
+        "name": "--cdr-banner-icon-right-fill",
+        "defaultValue": "--cdr-color-text-emphasis",
+        "description": "Right icon fill color"
       },
       {
-        "name": "--cdr-breadcrumb-item-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Breadcrumb item color"
+        "name": "--cdr-banner-info-action-fill",
+        "defaultValue": "--cdr-color-text-link-rest",
+        "description": "Info action icon fill color"
       },
       {
-        "name": "--cdr-breadcrumb-item-linked-highlight-color",
-        "defaultValue": "--cdr-color-text-link-hover",
-        "description": "Breadcrumb item linked hover, active and focus color"
-      }
-    ]
-  },
-  "CdrCaption": {
-    "name": "CdrCaption",
-    "description": "Provides context and credit for an asset such as an image, video, or chart",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrCaption",
-    "props": [
+        "name": "--cdr-banner-default-icon-left-background-color",
+        "defaultValue": "--cdr-color-background-message-default-02",
+        "description": "Left icon background color for default banner"
+      },
       {
-        "name": "summary",
-        "description": "Sets the string content for the description body of the caption.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string"
-        }
+        "name": "--cdr-banner-default-icon-left-fill",
+        "defaultValue": "--cdr-color-icon-message-default",
+        "description": "Left icon fill color for default banner"
       },
       {
-        "name": "credit",
-        "description": "Sets the string content for attribution.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/caption/CdrCaption.vue"
-    ],
-    "UIProperties": [
+        "name": "--cdr-banner-default-wrapper-border-left-color",
+        "defaultValue": "--cdr-color-border-message-default-01",
+        "description": "Wrapper border left color for default banner"
+      },
       {
-        "name": "--cdr-caption-summary-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of a cdr-caption"
+        "name": "--cdr-banner-info-icon-left-background-color",
+        "defaultValue": "--cdr-color-background-message-info-02",
+        "description": "Left icon background color for info banner"
       },
       {
-        "name": "--cdr-caption-cite-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Text color of a cdr-caption"
-      }
+        "name": "--cdr-banner-info-icon-left-fill",
+        "defaultValue": "--cdr-color-icon-message-info",
+        "description": "Left icon fill color for info banner"
+      },
+      {
+        "name": "--cdr-banner-info-wrapper-border-left-color",
+        "defaultValue": "--cdr-color-border-message-info-01",
+        "description": "Wrapper border left color for info banner"
+      },
+      {
+        "name": "--cdr-banner-warning-icon-left-background-color",
+        "defaultValue": "--cdr-color-background-message-warning-02",
+        "description": "Left icon background color for warning banner"
+      },
+      {
+        "name": "--cdr-banner-warning-icon-left-fill",
+        "defaultValue": "--cdr-color-icon-message-warning",
+        "description": "Left icon fill color for warning banner"
+      },
+      {
+        "name": "--cdr-banner-warning-wrapper-border-left-color",
+        "defaultValue": "--cdr-color-border-message-warning-01",
+        "description": "Wrapper border left color for warning banner"
+      },
+      {
+        "name": "--cdr-banner-success-icon-left-background-color",
+        "defaultValue": "--cdr-color-background-message-success-02",
+        "description": "Left icon background color for success banner"
+      },
+      {
+        "name": "--cdr-banner-success-icon-left-fill",
+        "defaultValue": "--cdr-color-icon-message-success",
+        "description": "Left icon fill color for success banner"
+      },
+      {
+        "name": "--cdr-banner-success-wrapper-border-left-color",
+        "defaultValue": "--cdr-color-border-message-success-01",
+        "description": "Wrapper border left color for success banner"
+      },
+      {
+        "name": "--cdr-banner-error-icon-left-background-color",
+        "defaultValue": "--cdr-color-background-message-error-02",
+        "description": "Left icon background color for error banner"
+      },
+      {
+        "name": "--cdr-banner-error-icon-left-fill",
+        "defaultValue": "--cdr-color-icon-message-error",
+        "description": "Left icon fill color for error banner"
+      },
+      {
+        "name": "--cdr-banner-error-wrapper-border-left-color",
+        "defaultValue": "--cdr-color-border-message-error-01",
+        "description": "Wrapper border left color for error banner"
+      },
+      {
+        "name": "--cdr-banner-default-background-color",
+        "defaultValue": "--cdr-color-background-message-default-01",
+        "description": "Background color for a default cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-default-outline-color",
+        "defaultValue": "--cdr-color-border-message-default-02",
+        "description": "Outline color for a default cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-info-background-color",
+        "defaultValue": "--cdr-color-background-message-info-01",
+        "description": "Background color for an info cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-info-outline-color",
+        "defaultValue": "--cdr-color-border-message-info-02",
+        "description": "Outline color for an info cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-success-background-color",
+        "defaultValue": "--cdr-color-background-message-success-01",
+        "description": "Background color for a success cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-success-outline-color",
+        "defaultValue": "--cdr-color-border-message-success-02",
+        "description": "Outline color for a success cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-warning-background-color",
+        "defaultValue": "--cdr-color-background-message-warning-01",
+        "description": "Background color for a warning cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-warning-outline-color",
+        "defaultValue": "--cdr-color-border-message-warning-02",
+        "description": "Outline color for a warning cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-error-background-color",
+        "defaultValue": "--cdr-color-background-message-error-01",
+        "description": "Background color for an error cdr-banner"
+      },
+      {
+        "name": "--cdr-banner-error-outline-color",
+        "defaultValue": "--cdr-color-border-message-error-02",
+        "description": "Outline color for an error cdr-banner"
+      }
     ]
   },
   "CdrButton": {
@@ -505,11 +527,7 @@
           "large"
         ],
         "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium'"
+          "name": "sizeProps"
         }
       },
       {
@@ -1110,6 +1128,132 @@
       }
     ]
   },
+  "CdrBreadcrumb": {
+    "name": "CdrBreadcrumb",
+    "description": "Navigation used to reveal a page's location within the site hierarchy",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrBreadcrumb",
+    "props": [
+      {
+        "name": "items",
+        "description": "Sets the array of a breadcrumb object containing a 'url' and 'name' property.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "breadcrumbItem[]"
+        },
+        "defaultValue": {
+          "func": true,
+          "value": "() => []"
+        }
+      },
+      {
+        "name": "truncationEnabled",
+        "description": "Controls the ability to truncate the entire breadcrumb path. If this value is false, truncation will no longer occur.",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      },
+      {
+        "name": "id",
+        "description": "Define a custom ID for the `<nav>` element. Randomly generated if no ID provided.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string"
+        }
+      }
+    ],
+    "events": [
+      {
+        "name": "navigate",
+        "description": "Emits when a breadcrumb item is clicked. `e.preventDefault()` may be used to override the default link navigation.",
+        "properties": [
+          {
+            "type": {
+              "names": [
+                "mixed"
+              ]
+            },
+            "name": "breadcrumb",
+            "description": "The breadcrumb data object"
+          }
+        ],
+        "tags": [
+          {
+            "title": "param",
+            "type": {
+              "name": "mixed"
+            },
+            "name": "breadcrumb",
+            "description": "The breadcrumb data object"
+          }
+        ]
+      }
+    ],
+    "slots": [
+      {
+        "name": "link",
+        "scoped": true,
+        "bindings": [
+          {
+            "name": "class",
+            "title": "binding"
+          },
+          {
+            "name": "href",
+            "title": "binding"
+          },
+          {
+            "name": "content",
+            "title": "binding"
+          }
+        ]
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/breadcrumb/CdrBreadcrumb.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-breadcrumb-ellipses-icon-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Ellipses icon color"
+      },
+      {
+        "name": "--cdr-breadcrumb-ellipses-icon-highlight-color",
+        "defaultValue": "--cdr-color-text-link-hover",
+        "description": "Ellipses icon hover, active and focus color"
+      },
+      {
+        "name": "--cdr-breadcrumb-item-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Breadcrumb item color"
+      },
+      {
+        "name": "--cdr-breadcrumb-item-linked-highlight-color",
+        "defaultValue": "--cdr-color-text-link-hover",
+        "description": "Breadcrumb item linked hover, active and focus color"
+      }
+    ]
+  },
   "CdrCard": {
     "name": "CdrCard",
     "description": "Related, interactive containers linking to a single subject or destination",
@@ -1161,237 +1305,13 @@
       }
     ]
   },
-  "CdrBanner": {
-    "name": "CdrBanner",
-    "description": "Provides contextual feedback messages for typical user actions",
+  "CdrChip": {
+    "name": "CdrChip",
+    "description": "Allows people to make selections, filter content, or trigger actions",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrBanner",
-    "props": [
-      {
-        "name": "type",
-        "description": "Sets the banner style.",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "info",
-          "warning",
-          "success",
-          "error",
-          "default"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'default'"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "icon-left",
-        "description": "Icon matching banner type"
-      },
-      {
-        "name": "default",
-        "description": "Primary message content"
-      },
-      {
-        "name": "icon-right",
-        "description": "Additional icon"
-      },
-      {
-        "name": "message-body",
-        "description": "Additional content about the message"
-      },
-      {
-        "name": "info-action",
-        "description": "Action-wrapped icon"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/banner/CdrBanner.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-banner-message-body-background-color",
-        "defaultValue": "--cdr-color-background-primary",
-        "description": "Message body background color"
-      },
-      {
-        "name": "--cdr-banner-icon-right-fill",
-        "defaultValue": "--cdr-color-text-emphasis",
-        "description": "Right icon fill color"
-      },
-      {
-        "name": "--cdr-banner-info-action-fill",
-        "defaultValue": "--cdr-color-text-link-rest",
-        "description": "Info action icon fill color"
-      },
-      {
-        "name": "--cdr-banner-default-icon-left-background-color",
-        "defaultValue": "--cdr-color-background-message-default-02",
-        "description": "Left icon background color for default banner"
-      },
-      {
-        "name": "--cdr-banner-default-icon-left-fill",
-        "defaultValue": "--cdr-color-icon-message-default",
-        "description": "Left icon fill color for default banner"
-      },
-      {
-        "name": "--cdr-banner-default-wrapper-border-left-color",
-        "defaultValue": "--cdr-color-border-message-default-01",
-        "description": "Wrapper border left color for default banner"
-      },
-      {
-        "name": "--cdr-banner-info-icon-left-background-color",
-        "defaultValue": "--cdr-color-background-message-info-02",
-        "description": "Left icon background color for info banner"
-      },
-      {
-        "name": "--cdr-banner-info-icon-left-fill",
-        "defaultValue": "--cdr-color-icon-message-info",
-        "description": "Left icon fill color for info banner"
-      },
-      {
-        "name": "--cdr-banner-info-wrapper-border-left-color",
-        "defaultValue": "--cdr-color-border-message-info-01",
-        "description": "Wrapper border left color for info banner"
-      },
-      {
-        "name": "--cdr-banner-warning-icon-left-background-color",
-        "defaultValue": "--cdr-color-background-message-warning-02",
-        "description": "Left icon background color for warning banner"
-      },
-      {
-        "name": "--cdr-banner-warning-icon-left-fill",
-        "defaultValue": "--cdr-color-icon-message-warning",
-        "description": "Left icon fill color for warning banner"
-      },
-      {
-        "name": "--cdr-banner-warning-wrapper-border-left-color",
-        "defaultValue": "--cdr-color-border-message-warning-01",
-        "description": "Wrapper border left color for warning banner"
-      },
-      {
-        "name": "--cdr-banner-success-icon-left-background-color",
-        "defaultValue": "--cdr-color-background-message-success-02",
-        "description": "Left icon background color for success banner"
-      },
-      {
-        "name": "--cdr-banner-success-icon-left-fill",
-        "defaultValue": "--cdr-color-icon-message-success",
-        "description": "Left icon fill color for success banner"
-      },
-      {
-        "name": "--cdr-banner-success-wrapper-border-left-color",
-        "defaultValue": "--cdr-color-border-message-success-01",
-        "description": "Wrapper border left color for success banner"
-      },
-      {
-        "name": "--cdr-banner-error-icon-left-background-color",
-        "defaultValue": "--cdr-color-background-message-error-02",
-        "description": "Left icon background color for error banner"
-      },
-      {
-        "name": "--cdr-banner-error-icon-left-fill",
-        "defaultValue": "--cdr-color-icon-message-error",
-        "description": "Left icon fill color for error banner"
-      },
-      {
-        "name": "--cdr-banner-error-wrapper-border-left-color",
-        "defaultValue": "--cdr-color-border-message-error-01",
-        "description": "Wrapper border left color for error banner"
-      },
-      {
-        "name": "--cdr-banner-default-background-color",
-        "defaultValue": "--cdr-color-background-message-default-01",
-        "description": "Background color for a default cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-default-outline-color",
-        "defaultValue": "--cdr-color-border-message-default-02",
-        "description": "Outline color for a default cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-info-background-color",
-        "defaultValue": "--cdr-color-background-message-info-01",
-        "description": "Background color for an info cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-info-outline-color",
-        "defaultValue": "--cdr-color-border-message-info-02",
-        "description": "Outline color for an info cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-success-background-color",
-        "defaultValue": "--cdr-color-background-message-success-01",
-        "description": "Background color for a success cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-success-outline-color",
-        "defaultValue": "--cdr-color-border-message-success-02",
-        "description": "Outline color for a success cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-warning-background-color",
-        "defaultValue": "--cdr-color-background-message-warning-01",
-        "description": "Background color for a warning cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-warning-outline-color",
-        "defaultValue": "--cdr-color-border-message-warning-02",
-        "description": "Outline color for a warning cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-error-background-color",
-        "defaultValue": "--cdr-color-background-message-error-01",
-        "description": "Background color for an error cdr-banner"
-      },
-      {
-        "name": "--cdr-banner-error-outline-color",
-        "defaultValue": "--cdr-color-border-message-error-02",
-        "description": "Outline color for an error cdr-banner"
-      }
-    ]
-  },
-  "CdrChoreographer": {
-    "name": "CdrChoreographer",
-    "exportName": "default",
-    "displayName": "CdrChoreographer",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "schema",
-        "type": {
-          "name": "choreographerSchema[]"
-        },
-        "defaultValue": {
-          "func": true,
-          "value": "() => []"
-        }
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/choreographer/CdrChoreographer.vue"
-    ]
-  },
-  "CdrChip": {
-    "name": "CdrChip",
-    "description": "Allows people to make selections, filter content, or trigger actions",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrChip",
-    "slots": [
+    "displayName": "CdrChip",
+    "slots": [
       {
         "name": "icon-left",
         "description": "Icon to the left of the content"
@@ -1516,47 +1436,6 @@
       }
     ]
   },
-  "CdrChipGroup": {
-    "name": "CdrChipGroup",
-    "exportName": "default",
-    "displayName": "CdrChipGroup",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "label",
-        "description": "Sets a label that describes the chip group and what it is selecting. By default this label is visually hidden and only made available to screen readers.",
-        "type": {
-          "name": "string"
-        },
-        "required": true
-      },
-      {
-        "name": "hideLabel",
-        "description": "Visually hides the chip group label but makes it accessible to screen readers.",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "label",
-        "description": "Override CdrChip label content with a custom element"
-      },
-      {
-        "name": "default",
-        "description": "CdrChipGroup content (CdrChip components)"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/chip/CdrChipGroup.vue"
-    ]
-  },
   "CdrCheckbox": {
     "name": "CdrCheckbox",
     "description": "Allows selecting one or more items from a list",
@@ -1815,39 +1694,99 @@
       }
     ]
   },
-  "CdrFormError": {
-    "name": "CdrFormError",
-    "exportName": "default",
-    "displayName": "CdrFormError",
-    "description": "",
+  "CdrCaption": {
+    "name": "CdrCaption",
+    "description": "Provides context and credit for an asset such as an image, video, or chart",
     "tags": {},
+    "exportName": "default",
+    "displayName": "CdrCaption",
     "props": [
       {
-        "name": "error",
+        "name": "summary",
+        "description": "Sets the string content for the description body of the caption.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
         "type": {
-          "name": "boolean|string"
+          "name": "string"
         }
-      }
-    ],
-    "slots": [
+      },
       {
-        "name": "error"
+        "name": "credit",
+        "description": "Sets the string content for attribution.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string"
+        }
       }
     ],
     "sourceFiles": [
-      "./src/components/formError/CdrFormError.vue"
+      "./src/components/caption/CdrCaption.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-form-error-text-color",
-        "defaultValue": "--cdr-color-text-input-error",
-        "description": "Text color of a cdr-form-error"
+        "name": "--cdr-caption-summary-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of a cdr-caption"
       },
       {
-        "name": "--cdr-form-error-fill-color",
-        "defaultValue": "--cdr-color-text-input-error",
-        "description": "Fill color of a cdr-form-error"
+        "name": "--cdr-caption-cite-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Text color of a cdr-caption"
+      }
+    ]
+  },
+  "CdrChipGroup": {
+    "name": "CdrChipGroup",
+    "exportName": "default",
+    "displayName": "CdrChipGroup",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "label",
+        "description": "Sets a label that describes the chip group and what it is selecting. By default this label is visually hidden and only made available to screen readers.",
+        "type": {
+          "name": "string"
+        },
+        "required": true
+      },
+      {
+        "name": "hideLabel",
+        "description": "Visually hides the chip group label but makes it accessible to screen readers.",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "label",
+        "description": "Override CdrChip label content with a custom element"
+      },
+      {
+        "name": "default",
+        "description": "CdrChipGroup content (CdrChip components)"
       }
+    ],
+    "sourceFiles": [
+      "./src/components/chip/CdrChipGroup.vue"
     ]
   },
   "CdrContainer": {
@@ -1902,58 +1841,39 @@
       "./src/components/container/CdrContainer.vue"
     ]
   },
-  "CdrGrid": {
-    "name": "CdrGrid",
-    "description": "Simple wrapper for working with CSS grid",
-    "tags": {},
+  "CdrFormError": {
+    "name": "CdrFormError",
     "exportName": "default",
-    "displayName": "CdrGrid",
+    "displayName": "CdrFormError",
+    "description": "",
+    "tags": {},
     "props": [
       {
-        "name": "gutter",
-        "description": "Defines gutter size. Also accepts responsive values with `@breakpoint`: \"none@md\"",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "none",
-          "small",
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium@xs medium@sm large@md large@lg'"
-        }
-      },
-      {
-        "name": "tag",
-        "description": "Sets the HTML tag for the grid element",
+        "name": "error",
         "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'div'"
+          "name": "boolean|string"
         }
       }
     ],
     "slots": [
       {
-        "name": "default",
-        "description": "CdrGrid content (grid child elements)"
+        "name": "error"
       }
     ],
     "sourceFiles": [
-      "./src/components/grid/CdrGrid.vue"
+      "./src/components/formError/CdrFormError.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-form-error-text-color",
+        "defaultValue": "--cdr-color-text-input-error",
+        "description": "Text color of a cdr-form-error"
+      },
+      {
+        "name": "--cdr-form-error-fill-color",
+        "defaultValue": "--cdr-color-text-input-error",
+        "description": "Fill color of a cdr-form-error"
+      }
     ]
   },
   "CdrFormGroup": {
@@ -2078,6 +1998,82 @@
       }
     ]
   },
+  "CdrChoreographer": {
+    "name": "CdrChoreographer",
+    "description": "Choreographer is in an experimental stage and should be considered unstable",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrChoreographer",
+    "props": [
+      {
+        "name": "schema",
+        "type": {
+          "name": "choreographerSchema[]"
+        },
+        "defaultValue": {
+          "func": true,
+          "value": "() => []"
+        }
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/choreographer/CdrChoreographer.vue"
+    ]
+  },
+  "CdrGrid": {
+    "name": "CdrGrid",
+    "description": "Simple wrapper for working with CSS grid",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrGrid",
+    "props": [
+      {
+        "name": "gutter",
+        "description": "Defines gutter size. Also accepts responsive values with `@breakpoint`: \"none@md\"",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "none",
+          "small",
+          "medium",
+          "large"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'medium@xs medium@sm large@md large@lg'"
+        }
+      },
+      {
+        "name": "tag",
+        "description": "Sets the HTML tag for the grid element",
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'div'"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default",
+        "description": "CdrGrid content (grid child elements)"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/grid/CdrGrid.vue"
+    ]
+  },
   "CdrIcon": {
     "name": "CdrIcon",
     "description": "Communicates meaning through graphics representing simple and complex ideas",
@@ -2117,7 +2113,7 @@
         },
         "defaultValue": {
           "func": false,
-          "value": "'medium'"
+          "value": "undefined"
         }
       }
     ],
@@ -2137,220 +2133,16 @@
       }
     ]
   },
-  "CdrImg": {
-    "name": "CdrImg",
-    "description": "Media for capturing attention and communicating messages",
+  "CdrInput": {
+    "name": "CdrInput",
+    "description": "Allows for data entry, editing, and search",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrImg",
+    "displayName": "CdrInput",
     "props": [
       {
-        "name": "src",
-        "description": "The image src",
-        "required": true,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "alt",
-        "description": "The image alt. Defaults to empty string.",
-        "required": false,
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
-        }
-      },
-      {
-        "name": "srcset",
-        "description": "Comma seperated list of image sources",
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "sizes",
-        "description": "Comma seperated list of source sizes",
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "ratio",
-        "description": "Aspect ratio of the image, passes to the CSS aspect-ratio property.",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "position",
-        "description": "Object position of the image, passes value to CSS object-position property.",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "fit",
-        "description": "Object fit of the image, passes value to CSS object-fit property",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "radius",
-        "description": "Border radius of the image. Accepts shorthand for cedar radius tokens (\"soft\", \"softer\", \"round\") or a custom value which is passed ot the CSS border-radius property.",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"soft\""
-            },
-            {
-              "name": "\"softer\""
-            },
-            {
-              "name": "\"round\""
-            },
-            {
-              "name": "string"
-            }
-          ]
-        }
-      },
-      {
-        "name": "loading",
-        "description": "Value for loading attribute (\"lazy\", \"eager\", \"auto\")",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": true,
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"lazy\""
-            },
-            {
-              "name": "\"eager\""
-            }
-          ]
-        }
-      },
-      {
-        "name": "decoding",
-        "description": "value for decoding attribute ()",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": true,
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"async\""
-            },
-            {
-              "name": "\"sync\""
-            },
-            {
-              "name": "\"auto\""
-            }
-          ]
-        }
-      },
-      {
-        "name": "fetchpriority",
-        "description": "value for fetch priority attribute",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": true,
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"high\""
-            },
-            {
-              "name": "\"low\""
-            },
-            {
-              "name": "\"auto\""
-            }
-          ]
-        }
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/image/CdrImg.vue"
-    ]
-  },
-  "CdrInput": {
-    "name": "CdrInput",
-    "description": "Allows for data entry, editing, and search",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrInput",
-    "props": [
-      {
-        "name": "id",
-        "description": "Custom ID that is mapped to the label ‘for’ attribute. If this value is not set, it will be randomly generated.",
+        "name": "id",
+        "description": "Custom ID that is mapped to the label ‘for’ attribute. If this value is not set, it will be randomly generated.",
         "type": {
           "name": "string"
         }
@@ -2440,17 +2232,16 @@
         "tags": {
           "demoSelectMultiple": [
             {
-              "description": "false",
+              "description": "true",
               "title": "demoSelectMultiple"
             }
           ]
         },
         "values": [
-          "medium",
           "large"
         ],
         "type": {
-          "name": "sizeProps"
+          "name": "string"
         }
       },
       {
@@ -2685,66 +2476,247 @@
       }
     ]
   },
-  "CdrKicker": {
-    "name": "CdrKicker",
-    "exportName": "default",
-    "displayName": "CdrKicker",
-    "description": "",
+  "CdrImg": {
+    "name": "CdrImg",
+    "description": "Media for capturing attention and communicating messages",
     "tags": {},
-    "slots": [
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/kicker/CdrKicker.vue"
-    ]
-  },
-  "CdrHeadingSubheadingBlock": {
     "exportName": "default",
-    "displayName": "CdrHeadingSubheadingBlock",
-    "description": "",
-    "tags": {},
+    "displayName": "CdrImg",
     "props": [
       {
-        "name": "headingTag",
+        "name": "src",
+        "description": "The image src",
+        "required": true,
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'h1'"
         }
-      }
-    ],
-    "slots": [
-      {
-        "name": "default"
       },
       {
-        "name": "subheading"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/lead/CdrHeadingSubheadingBlock.vue"
-    ]
-  },
-  "CdrLabelStandalone": {
-    "name": "CdrLabelStandalone",
-    "exportName": "default",
-    "displayName": "CdrLabelStandalone",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "forId",
+        "name": "alt",
+        "description": "The image alt. Defaults to empty string.",
+        "required": false,
         "type": {
           "name": "string"
         },
-        "required": true
+        "defaultValue": {
+          "func": false,
+          "value": "''"
+        }
       },
       {
-        "name": "label",
+        "name": "srcset",
+        "description": "Comma seperated list of image sources",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "sizes",
+        "description": "Comma seperated list of source sizes",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "ratio",
+        "description": "Aspect ratio of the image, passes to the CSS aspect-ratio property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ],
+          "demoPlaceholderText": [
+            {
+              "description": "Example: '16-9'",
+              "title": "demoPlaceholderText"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "position",
+        "description": "Object position of the image, passes value to CSS object-position property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "fit",
+        "description": "Object fit of the image, passes value to CSS object-fit property",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "radius",
+        "description": "Border radius of the image. Accepts shorthand for cedar radius tokens (\"soft\", \"softer\", \"round\") or a custom value which is passed ot the CSS border-radius property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"soft\""
+            },
+            {
+              "name": "\"softer\""
+            },
+            {
+              "name": "\"round\""
+            },
+            {
+              "name": "string"
+            }
+          ]
+        }
+      },
+      {
+        "name": "loading",
+        "description": "Value for loading attribute (\"lazy\", \"eager\", \"auto\")",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"lazy\""
+            },
+            {
+              "name": "\"eager\""
+            }
+          ]
+        }
+      },
+      {
+        "name": "decoding",
+        "description": "value for decoding attribute ()",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"async\""
+            },
+            {
+              "name": "\"sync\""
+            },
+            {
+              "name": "\"auto\""
+            }
+          ]
+        }
+      },
+      {
+        "name": "fetchpriority",
+        "description": "value for fetch priority attribute",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"high\""
+            },
+            {
+              "name": "\"low\""
+            },
+            {
+              "name": "\"auto\""
+            }
+          ]
+        }
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/image/CdrImg.vue"
+    ]
+  },
+  "CdrKicker": {
+    "name": "CdrKicker",
+    "exportName": "default",
+    "displayName": "CdrKicker",
+    "description": "",
+    "tags": {},
+    "slots": [
+      {
+        "name": "default"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/kicker/CdrKicker.vue"
+    ]
+  },
+  "CdrLabelStandalone": {
+    "name": "CdrLabelStandalone",
+    "exportName": "default",
+    "displayName": "CdrLabelStandalone",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "forId",
+        "type": {
+          "name": "string"
+        },
+        "required": true
+      },
+      {
+        "name": "label",
         "type": {
           "name": "string"
         }
@@ -2820,189 +2792,58 @@
       }
     ]
   },
-  "CdrLabelWrapper": {
-    "name": "CdrLabelWrapper",
-    "exportName": "default",
-    "displayName": "CdrLabelWrapper",
-    "description": "",
+  "CdrLink": {
+    "name": "CdrLink",
+    "description": "Clickable text elements used for navigating to other pages or sections",
     "tags": {},
+    "exportName": "default",
+    "displayName": "CdrLink",
     "props": [
       {
-        "name": "labelClass",
+        "name": "tag",
+        "description": "Sets valid HTML element tag",
+        "tags": {},
+        "values": [
+          "a",
+          "button"
+        ],
         "type": {
           "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'a'"
         }
       },
       {
-        "name": "contentClass",
+        "name": "href",
+        "description": "Sets value for anchors href property. Requires tag prop value to be `a`.",
         "type": {
           "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'#'"
         }
       },
       {
-        "name": "background",
-        "type": {
-          "name": "backgroundProps"
-        }
-      },
-      {
-        "name": "disabled",
+        "name": "inheritColor",
+        "description": "Sets color and fill",
         "type": {
           "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
         }
       },
       {
         "name": "modifier",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "size",
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "input"
-      },
-      {
-        "name": "svgs"
-      },
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/labelWrapper/CdrLabelWrapper.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-label-wrapper-text-color",
-        "defaultValue": "--cdr-color-text-input-label",
-        "description": "Text color of a label wrapper"
-      },
-      {
-        "name": "--cdr-label-wrapper-background-color",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a label wrapper"
-      },
-      {
-        "name": "--cdr-label-wrapper-primary-background-color-hover",
-        "defaultValue": "--cdr-color-background-label-default-hover",
-        "description": "Background color of a primary label wrapper when hovered"
-      },
-      {
-        "name": "--cdr-label-wrapper-primary-background-color-focus",
-        "defaultValue": "--cdr-color-background-label-default-focus",
-        "description": "Background color of a primary label wrapper when it has focus within"
-      },
-      {
-        "name": "--cdr-label-wrapper-primary-focus-box-shadow-color",
-        "defaultValue": "--cdr-color-border-label-default-focus",
-        "description": "Box shadow color of a primary label wrapper when it has focus within"
-      },
-      {
-        "name": "--cdr-label-wrapper-primary-background-color-active",
-        "defaultValue": "--cdr-color-background-label-default-active",
-        "description": "Background color of a primary label wrapper when active"
-      },
-      {
-        "name": "--cdr-label-wrapper-secondary-background-color",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a secondary label wrapper"
-      },
-      {
-        "name": "--cdr-label-wrapper-secondary-background-color-hover",
-        "defaultValue": "--cdr-color-background-label-secondary-hover",
-        "description": "Background color of a secondary label wrapper when hovered"
-      },
-      {
-        "name": "--cdr-label-wrapper-secondary-background-color-focus",
-        "defaultValue": "--cdr-color-background-label-secondary-focus",
-        "description": "Background color of a secondary label wrapper when it has focus within"
-      },
-      {
-        "name": "--cdr-label-wrapper-secondary-background-color-active",
-        "defaultValue": "--cdr-color-background-label-secondary-active",
-        "description": "Background color of a secondary label wrapper when active"
-      },
-      {
-        "name": "--cdr-label-wrapper-text-color-disabled",
-        "defaultValue": "--cdr-color-text-input-disabled",
-        "description": "Text color of a disabled label wrapper"
-      },
-      {
-        "name": "--cdr-label-wrapper-background-color-disabled",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a disabled label wrapper"
-      },
-      {
-        "name": "--cdr-form-figure-background-color",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a form figure"
-      },
-      {
-        "name": "--cdr-form-figure-box-shadow-color",
-        "defaultValue": "--cdr-color-border-input-default",
-        "description": "Box shadow color of a form figure"
-      }
-    ]
-  },
-  "CdrLink": {
-    "name": "CdrLink",
-    "description": "Clickable text elements used for navigating to other pages or sections",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrLink",
-    "props": [
-      {
-        "name": "tag",
-        "description": "Sets valid HTML element tag",
-        "tags": {},
-        "values": [
-          "a",
-          "button"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'a'"
-        }
-      },
-      {
-        "name": "href",
-        "description": "Sets value for anchors href property. Requires tag prop value to be `a`.",
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'#'"
-        }
-      },
-      {
-        "name": "inheritColor",
-        "description": "Sets color and fill",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "modifier",
-        "description": "Modifies the style variant for this component.",
-        "tags": {},
-        "values": [
-          "standalone"
-        ],
+        "description": "Modifies the style variant for this component.",
+        "tags": {},
+        "values": [
+          "standalone"
+        ],
         "type": {
           "name": "string"
         },
@@ -3117,7 +2958,7 @@
         },
         "defaultValue": {
           "func": false,
-          "value": "''"
+          "value": "undefined"
         }
       }
     ],
@@ -3153,225 +2994,195 @@
       }
     ]
   },
-  "CdrLead": {
-    "name": "CdrLead",
-    "description": "Static presentation used for page leads",
-    "tags": {},
+  "CdrLabelWrapper": {
+    "name": "CdrLabelWrapper",
     "exportName": "default",
-    "displayName": "CdrLead",
+    "displayName": "CdrLabelWrapper",
+    "description": "",
+    "tags": {},
     "props": [
       {
-        "name": "imgSrc",
-        "description": "Sets the lead's image source",
+        "name": "labelClass",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "undefined"
         }
       },
       {
-        "name": "imgAlt",
-        "description": "Sets the lead's image alt",
+        "name": "contentClass",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
         }
       },
       {
-        "name": "heading",
-        "description": "Sets the lead's heading",
+        "name": "background",
+        "type": {
+          "name": "backgroundProps"
+        }
+      },
+      {
+        "name": "disabled",
+        "type": {
+          "name": "boolean"
+        }
+      },
+      {
+        "name": "modifier",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "undefined"
         }
       },
       {
-        "name": "subheading",
-        "description": "Sets the lead's subheading",
+        "name": "size",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "undefined"
         }
       }
     ],
     "slots": [
       {
-        "name": "content",
-        "description": "Override content section"
+        "name": "input"
+      },
+      {
+        "name": "svgs"
+      },
+      {
+        "name": "default"
       }
     ],
     "sourceFiles": [
-      "./src/components/lead/CdrLead.vue"
+      "./src/components/labelWrapper/CdrLabelWrapper.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-lead-base-background-color",
-        "defaultValue": "--cdr-color-background-primary",
-        "description": "Lead background color"
-      }
-    ]
-  },
-  "CdrPagination": {
-    "name": "CdrPagination",
-    "description": "Allows people to navigate to the next or previous page within an experience",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrPagination",
-    "props": [
+        "name": "--cdr-label-wrapper-text-color",
+        "defaultValue": "--cdr-color-text-input-label",
+        "description": "Text color of a label wrapper"
+      },
       {
-        "name": "id",
-        "description": "Define a custom slug for the generated pagination item IDs. Slug is randomly generated if no ID provided.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string"
-        }
+        "name": "--cdr-label-wrapper-background-color",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a label wrapper"
       },
       {
-        "name": "totalPages",
-        "description": "Sets the total number of pages for displaying \"Page x of <totalPages>\".\nSometimes the total number of pages is different than total page data objects in the pages array.\nFor example, if only the next and previous pages are provided.",
-        "type": {
-          "name": "number"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "null"
-        }
+        "name": "--cdr-label-wrapper-primary-background-color-hover",
+        "defaultValue": "--cdr-color-background-label-default-hover",
+        "description": "Background color of a primary label wrapper when hovered"
       },
       {
-        "name": "pages",
-        "description": "Array of objects containing pagination data.\nObjects must have structure of `{ page: number, url: string }`",
-        "type": {
-          "name": "paginationItem[]"
-        },
-        "required": true
+        "name": "--cdr-label-wrapper-primary-background-color-focus",
+        "defaultValue": "--cdr-color-background-label-default-focus",
+        "description": "Background color of a primary label wrapper when it has focus within"
       },
       {
-        "name": "linkTag",
-        "description": "Sets which tag type is used to render pagination elements",
-        "tags": {},
-        "values": [
-          "a",
-          "button"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'a'"
-        }
+        "name": "--cdr-label-wrapper-primary-focus-box-shadow-color",
+        "defaultValue": "--cdr-color-border-label-default-focus",
+        "description": "Box shadow color of a primary label wrapper when it has focus within"
       },
       {
-        "name": "forLabel",
-        "description": "Used to customize the aria-label for the root pagination element.\nFor page-level pagination (i.e, pagination that updates the entire page content and changes the URL)\nthis property should be omitted.\nFor intra-page navigation this property should describe the element being paginated, for example:\n`Pagination for sub-content`",
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
-        }
+        "name": "--cdr-label-wrapper-primary-background-color-active",
+        "defaultValue": "--cdr-color-background-label-default-active",
+        "description": "Background color of a primary label wrapper when active"
       },
       {
-        "name": "modelValue",
+        "name": "--cdr-label-wrapper-secondary-background-color",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a secondary label wrapper"
+      },
+      {
+        "name": "--cdr-label-wrapper-secondary-background-color-hover",
+        "defaultValue": "--cdr-color-background-label-secondary-hover",
+        "description": "Background color of a secondary label wrapper when hovered"
+      },
+      {
+        "name": "--cdr-label-wrapper-secondary-background-color-focus",
+        "defaultValue": "--cdr-color-background-label-secondary-focus",
+        "description": "Background color of a secondary label wrapper when it has focus within"
+      },
+      {
+        "name": "--cdr-label-wrapper-secondary-background-color-active",
+        "defaultValue": "--cdr-color-background-label-secondary-active",
+        "description": "Background color of a secondary label wrapper when active"
+      },
+      {
+        "name": "--cdr-label-wrapper-text-color-disabled",
+        "defaultValue": "--cdr-color-text-input-disabled",
+        "description": "Text color of a disabled label wrapper"
+      },
+      {
+        "name": "--cdr-label-wrapper-background-color-disabled",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a disabled label wrapper"
+      },
+      {
+        "name": "--cdr-form-figure-background-color",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a form figure"
+      },
+      {
+        "name": "--cdr-form-figure-box-shadow-color",
+        "defaultValue": "--cdr-color-border-input-default",
+        "description": "Box shadow color of a form figure"
+      }
+    ]
+  },
+  "CdrLead": {
+    "name": "CdrLead",
+    "description": "Container used for assembling leads",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrLead",
+    "props": [
+      {
+        "name": "surface",
+        "description": "Sets the orientation of the background surface",
         "tags": {
-          "ignore": [
+          "demoSelectMultiple": [
             {
-              "description": "used for binding v-model, represents the current page",
-              "title": "ignore"
+              "description": "false",
+              "title": "demoSelectMultiple"
             }
           ]
         },
+        "required": false,
         "type": {
-          "name": "number"
-        }
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"top\""
+            },
+            {
+              "name": "\"bottom\""
+            }
+          ]
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'bottom'"
+        },
+        "values": [
+          "top",
+          "bottom"
+        ]
       }
     ],
-    "events": [
+    "slots": [
       {
-        "name": "update:modelValue",
-        "description": "Event emitted by v-model on the select <input> element to indicate current page.\nOnly used on small devices",
-        "properties": [
-          {
-            "type": {
-              "names": [
-                "mixed"
-              ]
-            },
-            "name": "modelValue"
-          }
-        ],
-        "tags": [
-          {
-            "title": "param",
-            "type": {
-              "name": "mixed"
-            },
-            "name": "modelValue"
-          }
-        ]
+        "name": "top",
+        "description": "top slot"
       },
       {
-        "name": "navigate",
-        "description": "$emit event fired when page changes based on user interaction by clicking a link\nor selecting an option from the select on mobile.\n`event.preventDefault()` can be used to override the default link navigation behavior."
+        "name": "bottom",
+        "description": "bottom slot"
       }
     ],
     "sourceFiles": [
-      "./src/components/pagination/CdrPagination.vue"
+      "./src/components/lead/CdrLead.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-pagination-link-text-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of a cdr-pagination link"
-      },
-      {
-        "name": "--cdr-pagination-link-fill-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Fill color of a cdr-pagination link"
-      },
-      {
-        "name": "--cdr-pagination-link-background-color-interaction",
-        "defaultValue": "--cdr-color-background-pagination-hover",
-        "description": "Background color of a cdr-pagination link on hover/focus/active"
-      },
-      {
-        "name": "--cdr-pagination-link-current-background-color-keyline",
-        "defaultValue": "--cdr-color-background-pagination-keyline",
-        "description": "Background color of the keyline for the current cdr-pagination link"
-      },
-      {
-        "name": "--cdr-pagination-link-text-color-disabled",
-        "defaultValue": "--cdr-color-text-disabled",
-        "description": "Text color of a disabled cdr-pagination link"
-      },
-      {
-        "name": "--cdr-pagination-link-fill-color-disabled",
-        "defaultValue": "--cdr-color-text-disabled",
-        "description": "Fill color of a disabled cdr-pagination link"
-      },
-      {
-        "name": "--cdr-pagination-link-text-color-interactive-disabled",
-        "defaultValue": "--cdr-color-text-disabled",
-        "description": "Text color of a disabled cdr-pagination link on hover/focus/active"
+        "name": "--cdr-lead-surface-color",
+        "defaultValue": "--cdr-color-surface-primary",
+        "description": "Color of the lead's surface layer"
       }
     ]
   },
@@ -3526,299 +3337,290 @@
       }
     ]
   },
-  "CdrPopup": {
-    "name": "CdrPopup",
-    "description": "An internal helper component used by Popover and Tooltip",
+  "CdrPicture": {
+    "name": "CdrPicture",
+    "description": "Media for capturing attention and communicating messages while allowing for art-direction of the image",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrPopup",
+    "displayName": "CdrPicture",
     "props": [
       {
-        "name": "opened",
-        "type": {
-          "name": "boolean"
+        "name": "fetchpriority",
+        "description": "value for fetch priority attribute",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
         },
-        "defaultValue": {
-          "func": false,
-          "value": false
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"high\""
+            },
+            {
+              "name": "\"low\""
+            },
+            {
+              "name": "\"auto\""
+            }
+          ]
         }
       },
       {
-        "name": "position",
-        "type": {
-          "name": "string"
+        "name": "decoding",
+        "description": "value for decoding attribute ()",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
         },
         "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "'top'"
-        }
-      },
-      {
-        "name": "autoPosition",
         "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"async\""
+            },
+            {
+              "name": "\"sync\""
+            },
+            {
+              "name": "\"auto\""
+            }
+          ]
         }
       },
       {
-        "name": "contentClass",
+        "name": "loading",
+        "description": "Value for loading attribute (\"lazy\", \"eager\", \"auto\")",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": true,
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "required": false,
         "type": {
-          "name": "string"
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"lazy\""
+            },
+            {
+              "name": "\"eager\""
+            }
+          ]
         }
-      }
-    ],
-    "events": [
+      },
       {
-        "name": "closed"
-      }
-    ],
-    "slots": [
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/popup/CdrPopup.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-popup-content-background",
-        "defaultValue": "--cdr-color-background-primary",
-        "description": "Background color of cdr-popup content"
+        "name": "radius",
+        "description": "Border radius of the image. Accepts shorthand for cedar radius tokens (\"soft\", \"softer\", \"round\") or a custom value which is passed ot the CSS border-radius property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ]
+        },
+        "required": false,
+        "type": {
+          "name": "union",
+          "elements": [
+            {
+              "name": "\"soft\""
+            },
+            {
+              "name": "\"softer\""
+            },
+            {
+              "name": "\"round\""
+            },
+            {
+              "name": "string"
+            }
+          ]
+        }
       },
       {
-        "name": "--cdr-popup-content-border-color",
-        "defaultValue": "--cdr-color-border-secondary",
-        "description": "Border color of cdr-popup content"
-      }
-    ]
-  },
-  "CdrPopover": {
-    "name": "CdrPopover",
-    "description": "Small overlay used to display contextual information",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrPopover",
-    "props": [
-      {
-        "name": "position",
-        "description": "Sets the position where the popover will render relative to the trigger element.",
+        "name": "fit",
+        "description": "Object fit of the image, passes value to CSS object-fit property",
         "tags": {
-          "demoSelectMultiple": [
+          "demoTextField": [
             {
-              "description": "false",
-              "title": "demoSelectMultiple"
+              "description": "true",
+              "title": "demoTextField"
             }
           ]
         },
-        "values": [
-          "top",
-          "bottom",
-          "left",
-          "right"
-        ],
+        "required": false,
         "type": {
           "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "'top'"
         }
       },
       {
-        "name": "autoPosition",
-        "description": "If set to `true`, popover will attempt to dynamically set it's position to\nensure it renders within the visible browser window.\nIf `false` the popover will always render in the provided `position`.",
-        "type": {
-          "name": "boolean"
+        "name": "position",
+        "description": "Object position of the image, passes value to CSS object-position property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ]
         },
         "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": true
+        "type": {
+          "name": "string"
         }
       },
       {
-        "name": "label",
-        "description": "Sets the title for the popover content. Can also be provided via the `title` slot.",
+        "name": "ratio",
+        "description": "Aspect ratio of the image, passes to the CSS aspect-ratio property.",
+        "tags": {
+          "demoTextField": [
+            {
+              "description": "true",
+              "title": "demoTextField"
+            }
+          ],
+          "demoPlaceholderText": [
+            {
+              "description": "Example: '16-9'",
+              "title": "demoPlaceholderText"
+            }
+          ]
+        },
+        "required": false,
         "type": {
           "name": "string"
-        },
-        "required": false
+        }
       },
       {
-        "name": "id",
-        "description": "ID for the popover element, required for accessibility",
+        "name": "sizes",
+        "description": "Comma seperated list of source sizes",
+        "required": false,
         "type": {
           "name": "string"
-        },
-        "required": true
+        }
       },
       {
-        "name": "contentClass",
-        "description": "Add custom class to the popover content wrapper. Allows for overriding size, styling, etc.",
+        "name": "srcset",
+        "description": "Comma seperated list of image sources",
+        "required": false,
         "type": {
           "name": "string"
-        },
-        "required": false
+        }
       },
       {
-        "name": "open",
-        "description": "Used to programmatically control the popover state. Does not need to be set if you are using the `trigger` slot.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
+        "name": "alt",
+        "description": "The image alt. Defaults to empty string.",
+        "required": false,
         "type": {
-          "name": "boolean"
+          "name": "string"
         },
-        "required": false,
         "defaultValue": {
           "func": false,
-          "value": false
+          "value": "''"
         }
-      }
-    ],
-    "events": [
-      {
-        "name": "opened",
-        "description": "Emits when popover is opened"
-      },
-      {
-        "name": "closed",
-        "description": "Emits when popover is closed"
-      }
-    ],
-    "slots": [
-      {
-        "name": "trigger",
-        "description": " Slot for the element that triggers the popover."
-      },
-      {
-        "name": "title",
-        "description": "Sets the title for the popover. Can also be set with `label` prop"
       },
       {
-        "name": "default"
+        "name": "src",
+        "description": "The image src",
+        "required": true,
+        "type": {
+          "name": "string"
+        }
       },
       {
-        "name": "icon"
+        "name": "sources",
+        "description": "An object containing 1..n child objects containing HTMLSourceElement attributes",
+        "required": true,
+        "type": {
+          "name": "pictureSourceObject"
+        }
       }
     ],
     "sourceFiles": [
-      "./src/components/popover/CdrPopover.vue"
+      "./src/components/picture/CdrPicture.vue"
     ]
   },
-  "CdrRadio": {
-    "name": "CdrRadio",
-    "description": "Permits the selection of only one option from a list of two or more",
+  "CdrPagination": {
+    "name": "CdrPagination",
+    "description": "Allows people to navigate to the next or previous page within an experience",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrRadio",
+    "displayName": "CdrPagination",
     "props": [
       {
-        "name": "labelClass",
-        "description": "Adds CSS class to the label for custom styles.",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "inputClass",
-        "description": "Adds CSS class to the input for custom styles.",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "contentClass",
-        "description": "Adds CSS class to the slot wrapper for custom styles.",
+        "name": "id",
+        "description": "Define a custom slug for the generated pagination item IDs. Slug is randomly generated if no ID provided.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
         "type": {
           "name": "string"
         }
       },
       {
-        "name": "disabled",
-        "description": "Disables the radio",
+        "name": "totalPages",
+        "description": "Sets the total number of pages for displaying \"Page x of <totalPages>\".\nSometimes the total number of pages is different than total page data objects in the pages array.\nFor example, if only the next and previous pages are provided.",
         "type": {
-          "name": "boolean"
+          "name": "number"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "null"
         }
       },
       {
-        "name": "name",
-        "description": "Sets the name of the radio button.",
+        "name": "pages",
+        "description": "Array of objects containing pagination data.\nObjects must have structure of `{ page: number, url: string }`",
         "type": {
-          "name": "string"
+          "name": "paginationItem[]"
         },
         "required": true
       },
       {
-        "name": "modifier",
-        "description": "Modifies the style variants for this component",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "true",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
+        "name": "linkTag",
+        "description": "Sets which tag type is used to render pagination elements",
+        "tags": {},
         "values": [
-          "hide-figure"
+          "a",
+          "button"
         ],
         "type": {
           "name": "string"
         },
         "defaultValue": {
           "func": false,
-          "value": "''"
+          "value": "'a'"
         }
       },
       {
-        "name": "size",
-        "description": "Sets the radio size; values can target responsive breakpoints. Example `small@lg`",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "small",
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "sizeProps"
-        }
-      },
-      {
-        "name": "background",
-        "description": "Sets the background color the radio button is rendered on",
-        "tags": {},
-        "values": [
-          "primary",
-          "secondary"
-        ],
-        "type": {
-          "name": "backgroundProps"
-        }
-      },
-      {
-        "name": "customValue",
-        "description": "Sets the value of the radio.",
+        "name": "forLabel",
+        "description": "Used to customize the aria-label for the root pagination element.\nFor page-level pagination (i.e, pagination that updates the entire page content and changes the URL)\nthis property should be omitted.\nFor intra-page navigation this property should describe the element being paginated, for example:\n`Pagination for sub-content`",
         "type": {
-          "name": "string|number|boolean|object|array|symbol|func"
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "''"
         }
       },
       {
@@ -3826,20 +3628,20 @@
         "tags": {
           "ignore": [
             {
-              "description": "v-model binding",
+              "description": "used for binding v-model, represents the current page",
               "title": "ignore"
             }
           ]
         },
         "type": {
-          "name": "string|number|boolean|object|array|symbol|func"
+          "name": "number"
         }
       }
     ],
     "events": [
       {
         "name": "update:modelValue",
-        "description": "Event emitted by v-model on the radio's <input> element",
+        "description": "Event emitted by v-model on the select <input> element to indicate current page.\nOnly used on small devices",
         "properties": [
           {
             "type": {
@@ -3859,314 +3661,242 @@
             "name": "modelValue"
           }
         ]
-      }
-    ],
-    "slots": [
+      },
       {
-        "name": "default"
+        "name": "navigate",
+        "description": "$emit event fired when page changes based on user interaction by clicking a link\nor selecting an option from the select on mobile.\n`event.preventDefault()` can be used to override the default link navigation behavior."
       }
     ],
     "sourceFiles": [
-      "./src/components/radio/CdrRadio.vue"
+      "./src/components/pagination/CdrPagination.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-radio-box-shadow-color-selected",
-        "defaultValue": "--cdr-color-border-input-default-selected",
-        "description": "Box-shadow color of cdr-radio when selected"
-      },
-      {
-        "name": "--cdr-radio-background-color-selected",
-        "defaultValue": "--cdr-color-background-input-default-selected",
-        "description": "Background color of cdr-radio when selected"
-      },
-      {
-        "name": "--cdr-radio-inner-circle-background-color-selected",
-        "defaultValue": "--cdr-color-icon-checkbox-default-selected",
-        "description": "Background color of the inner circle of cdr-radio when selected"
-      },
-      {
-        "name": "--cdr-radio-box-shadow-color-hover",
-        "defaultValue": "--cdr-color-border-input-default-hover",
-        "description": "Box-shadow color of cdr-radio on hover"
-      },
-      {
-        "name": "--cdr-radio-background-color-hover",
-        "defaultValue": "--cdr-color-background-input-default-hover",
-        "description": "Background color of cdr-radio on hover"
-      },
-      {
-        "name": "--cdr-radio-box-shadow-color-selected-hover",
-        "defaultValue": "--cdr-color-border-input-default-selected-hover",
-        "description": "Box-shadow color of cdr-radio when selected on hover"
-      },
-      {
-        "name": "--cdr-radio-background-color-selected-hover",
-        "defaultValue": "--cdr-color-background-input-default-selected-hover",
-        "description": "Background color of cdr-radio when selected on hover"
-      },
-      {
-        "name": "--cdr-radio-box-shadow-color-disabled",
-        "defaultValue": "--cdr-color-border-input-default-disabled",
-        "description": "Box-shadow color of cdr-radio when disabled"
-      },
-      {
-        "name": "--cdr-radio-background-color-disabled",
-        "defaultValue": "--cdr-color-background-input-default-disabled",
-        "description": "Background color of cdr-radio when disabled"
-      },
-      {
-        "name": "--cdr-radio-inner-circle-background-color-disabled",
-        "defaultValue": "--cdr-color-background-input-default-disabled",
-        "description": "Background color of the inner circle of cdr-radio when disabled"
-      },
-      {
-        "name": "--cdr-radio-inner-circle-background-color-selected-disabled",
-        "defaultValue": "--cdr-color-background-input-default-disabled",
-        "description": "Background color of the inner circle of cdr-radio when selected and disabled"
+        "name": "--cdr-pagination-link-text-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of a cdr-pagination link"
       },
       {
-        "name": "--cdr-radio-box-shadow-color-focus",
-        "defaultValue": "--cdr-color-border-input-default-active",
-        "description": "Box-shadow color of cdr-radio on focus"
+        "name": "--cdr-pagination-link-fill-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Fill color of a cdr-pagination link"
       },
       {
-        "name": "--cdr-radio-background-color-focus",
-        "defaultValue": "--cdr-color-background-input-default-focus",
-        "description": "Background color of cdr-radio on focus"
+        "name": "--cdr-pagination-link-background-color-interaction",
+        "defaultValue": "--cdr-color-background-pagination-hover",
+        "description": "Background color of a cdr-pagination link on hover/focus/active"
       },
       {
-        "name": "--cdr-radio-background-color-selected-focus",
-        "defaultValue": "--cdr-color-background-input-default-selected-focus",
-        "description": "Background color of cdr-radio when selected on focus"
+        "name": "--cdr-pagination-link-current-background-color-keyline",
+        "defaultValue": "--cdr-color-background-pagination-keyline",
+        "description": "Background color of the keyline for the current cdr-pagination link"
       },
       {
-        "name": "--cdr-radio-box-shadow-color-active",
-        "defaultValue": "--cdr-color-border-input-default-active",
-        "description": "Box-shadow color of cdr-radio when active"
+        "name": "--cdr-pagination-link-text-color-disabled",
+        "defaultValue": "--cdr-color-text-disabled",
+        "description": "Text color of a disabled cdr-pagination link"
       },
       {
-        "name": "--cdr-radio-background-color-active",
-        "defaultValue": "--cdr-color-background-input-default-active",
-        "description": "Background color of cdr-radio when active"
+        "name": "--cdr-pagination-link-fill-color-disabled",
+        "defaultValue": "--cdr-color-text-disabled",
+        "description": "Fill color of a disabled cdr-pagination link"
       },
       {
-        "name": "--cdr-radio-inner-circle-background-color-selected-active",
-        "defaultValue": "--cdr-color-icon-checkbox-default-selected-active",
-        "description": "Background color of the inner circle of cdr-radio when selected and active"
+        "name": "--cdr-pagination-link-text-color-interactive-disabled",
+        "defaultValue": "--cdr-color-text-disabled",
+        "description": "Text color of a disabled cdr-pagination link on hover/focus/active"
       }
     ]
   },
-  "CdrPicture": {
-    "name": "CdrPicture",
-    "description": "Media for capturing attention and communicating messages while allowing for art-direction of the image",
+  "CdrPopover": {
+    "name": "CdrPopover",
+    "description": "Small overlay used to display contextual information",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrPicture",
+    "displayName": "CdrPopover",
     "props": [
       {
-        "name": "fetchpriority",
-        "description": "value for fetch priority attribute",
+        "name": "position",
+        "description": "Sets the position where the popover will render relative to the trigger element.",
         "tags": {
-          "demoIgnore": [
+          "demoSelectMultiple": [
             {
-              "description": true,
-              "title": "demoIgnore"
+              "description": "false",
+              "title": "demoSelectMultiple"
             }
           ]
         },
-        "required": false,
+        "values": [
+          "top",
+          "bottom",
+          "left",
+          "right"
+        ],
         "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"high\""
-            },
-            {
-              "name": "\"low\""
-            },
-            {
-              "name": "\"auto\""
-            }
-          ]
-        }
-      },
-      {
-        "name": "decoding",
-        "description": "value for decoding attribute ()",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": true,
-              "title": "demoIgnore"
-            }
-          ]
+          "name": "string"
         },
         "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"async\""
-            },
-            {
-              "name": "\"sync\""
-            },
-            {
-              "name": "\"auto\""
-            }
-          ]
+        "defaultValue": {
+          "func": false,
+          "value": "'top'"
         }
       },
       {
-        "name": "loading",
-        "description": "Value for loading attribute (\"lazy\", \"eager\", \"auto\")",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": true,
-              "title": "demoIgnore"
-            }
-          ]
+        "name": "autoPosition",
+        "description": "If set to `true`, popover will attempt to dynamically set it's position to\nensure it renders within the visible browser window.\nIf `false` the popover will always render in the provided `position`.",
+        "type": {
+          "name": "boolean"
         },
         "required": false,
-        "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"lazy\""
-            },
-            {
-              "name": "\"eager\""
-            }
-          ]
+        "defaultValue": {
+          "func": false,
+          "value": true
         }
       },
       {
-        "name": "radius",
-        "description": "Border radius of the image. Accepts shorthand for cedar radius tokens (\"soft\", \"softer\", \"round\") or a custom value which is passed ot the CSS border-radius property.",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
+        "name": "label",
+        "description": "Sets the title for the popover content. Can also be provided via the `title` slot.",
         "type": {
-          "name": "union",
-          "elements": [
-            {
-              "name": "\"soft\""
-            },
-            {
-              "name": "\"softer\""
-            },
-            {
-              "name": "\"round\""
-            },
-            {
-              "name": "string"
-            }
-          ]
-        }
+          "name": "string"
+        },
+        "required": false
       },
       {
-        "name": "fit",
-        "description": "Object fit of the image, passes value to CSS object-fit property",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
+        "name": "id",
+        "description": "ID for the popover element, required for accessibility",
         "type": {
           "name": "string"
-        }
+        },
+        "required": true
       },
       {
-        "name": "position",
-        "description": "Object position of the image, passes value to CSS object-position property.",
-        "tags": {
-          "demoTextField": [
-            {
-              "description": "true",
-              "title": "demoTextField"
-            }
-          ]
-        },
-        "required": false,
+        "name": "contentClass",
+        "description": "Add custom class to the popover content wrapper. Allows for overriding size, styling, etc.",
         "type": {
           "name": "string"
-        }
+        },
+        "required": false
       },
       {
-        "name": "ratio",
-        "description": "Aspect ratio of the image, passes to the CSS aspect-ratio property.",
+        "name": "open",
+        "description": "Used to programmatically control the popover state. Does not need to be set if you are using the `trigger` slot.",
         "tags": {
-          "demoSelectMultiple": [
+          "demoIgnore": [
             {
-              "description": "false",
-              "title": "demoSelectMultiple"
+              "description": "true",
+              "title": "demoIgnore"
             }
           ]
         },
-        "required": false,
         "type": {
-          "name": "string"
+          "name": "boolean"
+        },
+        "required": false,
+        "defaultValue": {
+          "func": false,
+          "value": false
         }
+      }
+    ],
+    "events": [
+      {
+        "name": "opened",
+        "description": "Emits when popover is opened"
       },
       {
-        "name": "sizes",
-        "description": "Comma seperated list of source sizes",
-        "required": false,
-        "type": {
-          "name": "string"
-        }
+        "name": "closed",
+        "description": "Emits when popover is closed"
+      }
+    ],
+    "slots": [
+      {
+        "name": "trigger",
+        "description": " Slot for the element that triggers the popover."
       },
       {
-        "name": "srcset",
-        "description": "Comma seperated list of image sources",
-        "required": false,
+        "name": "title",
+        "description": "Sets the title for the popover. Can also be set with `label` prop"
+      },
+      {
+        "name": "default"
+      },
+      {
+        "name": "icon"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/popover/CdrPopover.vue"
+    ]
+  },
+  "CdrPopup": {
+    "name": "CdrPopup",
+    "description": "An internal helper component used by Popover and Tooltip",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrPopup",
+    "props": [
+      {
+        "name": "opened",
         "type": {
-          "name": "string"
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
         }
       },
       {
-        "name": "alt",
-        "description": "The image alt. Defaults to empty string.",
-        "required": false,
+        "name": "position",
         "type": {
           "name": "string"
         },
+        "required": false,
         "defaultValue": {
           "func": false,
-          "value": "''"
+          "value": "'top'"
         }
       },
       {
-        "name": "src",
-        "description": "The image src",
-        "required": true,
+        "name": "autoPosition",
         "type": {
-          "name": "string"
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
         }
       },
       {
-        "name": "sources",
-        "description": "An object containing 1..n child objects containing HTMLSourceElement attributes",
-        "required": true,
+        "name": "contentClass",
         "type": {
-          "name": "pictureSourceObject"
+          "name": "string"
         }
       }
     ],
+    "events": [
+      {
+        "name": "closed"
+      }
+    ],
+    "slots": [
+      {
+        "name": "default"
+      }
+    ],
     "sourceFiles": [
-      "./src/components/picture/CdrPicture.vue"
+      "./src/components/popup/CdrPopup.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-popup-content-background",
+        "defaultValue": "--cdr-color-background-primary",
+        "description": "Background color of cdr-popup content"
+      },
+      {
+        "name": "--cdr-popup-content-border-color",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Border color of cdr-popup content"
+      }
     ]
   },
   "CdrQuote": {
@@ -4220,15 +3950,185 @@
         "name": "summary",
         "description": "Sets the quote body text.",
         "type": {
-          "name": "string"
+          "name": "string"
+        }
+      },
+      {
+        "name": "citation",
+        "description": "Sets the quote attribution text.",
+        "type": {
+          "name": "string"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/quote/CdrQuote.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-quote-cite-text-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Text color of a cdr-quote citation"
+      },
+      {
+        "name": "--cdr-quote-content-text-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of cdr-quote content"
+      },
+      {
+        "name": "--cdr-quote-pull-container-border-color",
+        "defaultValue": "--cdr-color-border-primary",
+        "description": "Border color of a cdr-quote pull container"
+      }
+    ]
+  },
+  "CdrRadio": {
+    "name": "CdrRadio",
+    "description": "Permits the selection of only one option from a list of two or more",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrRadio",
+    "props": [
+      {
+        "name": "labelClass",
+        "description": "Adds CSS class to the label for custom styles.",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "inputClass",
+        "description": "Adds CSS class to the input for custom styles.",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "contentClass",
+        "description": "Adds CSS class to the slot wrapper for custom styles.",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "disabled",
+        "description": "Disables the radio",
+        "type": {
+          "name": "boolean"
+        }
+      },
+      {
+        "name": "name",
+        "description": "Sets the name of the radio button.",
+        "type": {
+          "name": "string"
+        },
+        "required": true
+      },
+      {
+        "name": "modifier",
+        "description": "Modifies the style variants for this component",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "true",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "hide-figure"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "''"
+        }
+      },
+      {
+        "name": "size",
+        "description": "Sets the radio size; values can target responsive breakpoints. Example `small@lg`",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "small",
+          "medium",
+          "large"
+        ],
+        "type": {
+          "name": "sizeProps"
+        }
+      },
+      {
+        "name": "background",
+        "description": "Sets the background color the radio button is rendered on",
+        "tags": {},
+        "values": [
+          "primary",
+          "secondary"
+        ],
+        "type": {
+          "name": "backgroundProps"
+        }
+      },
+      {
+        "name": "customValue",
+        "description": "Sets the value of the radio.",
+        "type": {
+          "name": "string|number|boolean|object|array|symbol|func"
+        }
+      },
+      {
+        "name": "modelValue",
+        "tags": {
+          "ignore": [
+            {
+              "description": "v-model binding",
+              "title": "ignore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string|number|boolean|object|array|symbol|func"
         }
-      },
+      }
+    ],
+    "events": [
       {
-        "name": "citation",
-        "description": "Sets the quote attribution text.",
-        "type": {
-          "name": "string"
-        }
+        "name": "update:modelValue",
+        "description": "Event emitted by v-model on the radio's <input> element",
+        "properties": [
+          {
+            "type": {
+              "names": [
+                "mixed"
+              ]
+            },
+            "name": "modelValue"
+          }
+        ],
+        "tags": [
+          {
+            "title": "param",
+            "type": {
+              "name": "mixed"
+            },
+            "name": "modelValue"
+          }
+        ]
       }
     ],
     "slots": [
@@ -4237,23 +4137,93 @@
       }
     ],
     "sourceFiles": [
-      "./src/components/quote/CdrQuote.vue"
+      "./src/components/radio/CdrRadio.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-quote-cite-text-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Text color of a cdr-quote citation"
+        "name": "--cdr-radio-box-shadow-color-selected",
+        "defaultValue": "--cdr-color-border-input-default-selected",
+        "description": "Box-shadow color of cdr-radio when selected"
       },
       {
-        "name": "--cdr-quote-content-text-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of cdr-quote content"
+        "name": "--cdr-radio-background-color-selected",
+        "defaultValue": "--cdr-color-background-input-default-selected",
+        "description": "Background color of cdr-radio when selected"
       },
       {
-        "name": "--cdr-quote-pull-container-border-color",
-        "defaultValue": "--cdr-color-border-primary",
-        "description": "Border color of a cdr-quote pull container"
+        "name": "--cdr-radio-inner-circle-background-color-selected",
+        "defaultValue": "--cdr-color-icon-checkbox-default-selected",
+        "description": "Background color of the inner circle of cdr-radio when selected"
+      },
+      {
+        "name": "--cdr-radio-box-shadow-color-hover",
+        "defaultValue": "--cdr-color-border-input-default-hover",
+        "description": "Box-shadow color of cdr-radio on hover"
+      },
+      {
+        "name": "--cdr-radio-background-color-hover",
+        "defaultValue": "--cdr-color-background-input-default-hover",
+        "description": "Background color of cdr-radio on hover"
+      },
+      {
+        "name": "--cdr-radio-box-shadow-color-selected-hover",
+        "defaultValue": "--cdr-color-border-input-default-selected-hover",
+        "description": "Box-shadow color of cdr-radio when selected on hover"
+      },
+      {
+        "name": "--cdr-radio-background-color-selected-hover",
+        "defaultValue": "--cdr-color-background-input-default-selected-hover",
+        "description": "Background color of cdr-radio when selected on hover"
+      },
+      {
+        "name": "--cdr-radio-box-shadow-color-disabled",
+        "defaultValue": "--cdr-color-border-input-default-disabled",
+        "description": "Box-shadow color of cdr-radio when disabled"
+      },
+      {
+        "name": "--cdr-radio-background-color-disabled",
+        "defaultValue": "--cdr-color-background-input-default-disabled",
+        "description": "Background color of cdr-radio when disabled"
+      },
+      {
+        "name": "--cdr-radio-inner-circle-background-color-disabled",
+        "defaultValue": "--cdr-color-background-input-default-disabled",
+        "description": "Background color of the inner circle of cdr-radio when disabled"
+      },
+      {
+        "name": "--cdr-radio-inner-circle-background-color-selected-disabled",
+        "defaultValue": "--cdr-color-background-input-default-disabled",
+        "description": "Background color of the inner circle of cdr-radio when selected and disabled"
+      },
+      {
+        "name": "--cdr-radio-box-shadow-color-focus",
+        "defaultValue": "--cdr-color-border-input-default-active",
+        "description": "Box-shadow color of cdr-radio on focus"
+      },
+      {
+        "name": "--cdr-radio-background-color-focus",
+        "defaultValue": "--cdr-color-background-input-default-focus",
+        "description": "Background color of cdr-radio on focus"
+      },
+      {
+        "name": "--cdr-radio-background-color-selected-focus",
+        "defaultValue": "--cdr-color-background-input-default-selected-focus",
+        "description": "Background color of cdr-radio when selected on focus"
+      },
+      {
+        "name": "--cdr-radio-box-shadow-color-active",
+        "defaultValue": "--cdr-color-border-input-default-active",
+        "description": "Box-shadow color of cdr-radio when active"
+      },
+      {
+        "name": "--cdr-radio-background-color-active",
+        "defaultValue": "--cdr-color-background-input-default-active",
+        "description": "Background color of cdr-radio when active"
+      },
+      {
+        "name": "--cdr-radio-inner-circle-background-color-selected-active",
+        "defaultValue": "--cdr-color-icon-checkbox-default-selected-active",
+        "description": "Background color of the inner circle of cdr-radio when selected and active"
       }
     ]
   },
@@ -4323,11 +4293,7 @@
           "large"
         ],
         "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium'"
+          "name": "sizeProps"
         }
       }
     ],
@@ -4448,22 +4414,20 @@
       },
       {
         "name": "size",
-        "description": "Sets the component's size; values can target responsive breakpoints. Example `small@lg`",
+        "description": "Sets the component's size; values can target responsive breakpoints. Example `large@lg`",
         "tags": {
           "demoSelectMultiple": [
             {
-              "description": "false",
+              "description": "true",
               "title": "demoSelectMultiple"
             }
           ]
         },
         "values": [
-          "small",
-          "medium",
           "large"
         ],
         "type": {
-          "name": "sizeProps"
+          "name": "string"
         }
       },
       {
@@ -4731,6 +4695,44 @@
       }
     ]
   },
+  "CdrSkeletonBone": {
+    "name": "CdrSkeletonBone",
+    "exportName": "default",
+    "displayName": "CdrSkeletonBone",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "type",
+        "description": "Sets the type of content placeholder",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "default",
+          "heading",
+          "line",
+          "rectangle",
+          "square"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'default'"
+        }
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/skeleton/CdrSkeletonBone.vue"
+    ]
+  },
   "CdrSwitch": {
     "name": "CdrSwitch",
     "description": "Permits selection from two opposing options",
@@ -4936,114 +4938,25 @@
         "description": "Background color of the cdr-switch button when it is checked and on hover but not in focus"
       },
       {
-        "name": "--cdr-switch-icon-fill-checked-hover",
-        "defaultValue": "--cdr-color-icon-switch-selected-default-hover",
-        "description": "Fill of the cdr-switch x and check icons when it is checked and on hover but not in focus"
-      },
-      {
-        "name": "--cdr-switch-handle-border-color-checked-hover",
-        "defaultValue": "--cdr-color-border-switch-handle-default-hover",
-        "description": "Border of the cdr-switch handle when it is checked and on hover but not in focus"
-      },
-      {
-        "name": "--cdr-switch-handle-border",
-        "defaultValue": "--cdr-color-border-secondary",
-        "description": "Border color of the cdr-switch handle"
-      },
-      {
-        "name": "--cdr-switch-handle-background-color-rest",
-        "defaultValue": "--cdr-color-background-switch-handle-default-rest",
-        "description": "Background color of the cdr-switch handle"
-      }
-    ]
-  },
-  "CdrSkeletonBone": {
-    "name": "CdrSkeletonBone",
-    "exportName": "default",
-    "displayName": "CdrSkeletonBone",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "type",
-        "description": "Sets the type of content placeholder",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "default",
-          "heading",
-          "line",
-          "rectangle",
-          "square"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'default'"
-        }
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/skeleton/CdrSkeletonBone.vue"
-    ]
-  },
-  "CdrTabPanel": {
-    "name": "CdrTabPanel",
-    "exportName": "default",
-    "displayName": "CdrTabPanel",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "id",
-        "description": "Sets reference identifier for tab content. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `aria-labelledby` property.",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "name",
-        "description": "Sets tab display name. Required and must be unique for each tab. If `id` is not provided, this value will be used as the reference identifier.",
-        "type": {
-          "name": "string"
-        }
+        "name": "--cdr-switch-icon-fill-checked-hover",
+        "defaultValue": "--cdr-color-icon-switch-selected-default-hover",
+        "description": "Fill of the cdr-switch x and check icons when it is checked and on hover but not in focus"
       },
       {
-        "name": "ariaLabelledby",
-        "description": "Sets reference identifier for tab header. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `id` property.",
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "events": [
+        "name": "--cdr-switch-handle-border-color-checked-hover",
+        "defaultValue": "--cdr-color-border-switch-handle-default-hover",
+        "description": "Border of the cdr-switch handle when it is checked and on hover but not in focus"
+      },
       {
-        "name": "tab-change",
-        "description": "Emits when active tab is changed",
-        "tags": [
-          {
-            "title": "params",
-            "content": "state, panelId"
-          }
-        ]
-      }
-    ],
-    "slots": [
+        "name": "--cdr-switch-handle-border",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Border color of the cdr-switch handle"
+      },
       {
-        "name": "default",
-        "description": "CdrTabPanel content"
+        "name": "--cdr-switch-handle-background-color-rest",
+        "defaultValue": "--cdr-color-background-switch-handle-default-rest",
+        "description": "Background color of the cdr-switch handle"
       }
-    ],
-    "sourceFiles": [
-      "./src/components/tabs/CdrTabPanel.vue"
     ]
   },
   "CdrTable": {
@@ -5125,11 +5038,7 @@
           "large"
         ],
         "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium'"
+          "name": "sizeProps"
         }
       }
     ],
@@ -5200,40 +5109,55 @@
       }
     ]
   },
-  "CdrText": {
-    "name": "CdrText",
-    "description": "Text container used for any text element such as paragraphs, headings, and lists",
-    "tags": {},
+  "CdrTabPanel": {
+    "name": "CdrTabPanel",
     "exportName": "default",
-    "displayName": "CdrText",
+    "displayName": "CdrTabPanel",
+    "description": "",
+    "tags": {},
     "props": [
       {
-        "name": "tag",
-        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
+        "name": "id",
+        "description": "Sets reference identifier for tab content. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `aria-labelledby` property.",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "name",
+        "description": "Sets tab display name. Required and must be unique for each tab. If `id` is not provided, this value will be used as the reference identifier.",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "ariaLabelledby",
+        "description": "Sets reference identifier for tab header. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `id` property.",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'p'"
         }
       }
     ],
+    "events": [
+      {
+        "name": "tab-change",
+        "description": "Emits when active tab is changed",
+        "tags": [
+          {
+            "title": "params",
+            "content": "state, panelId"
+          }
+        ]
+      }
+    ],
     "slots": [
       {
         "name": "default",
-        "description": "CdrText content"
+        "description": "CdrTabPanel content"
       }
     ],
     "sourceFiles": [
-      "./src/components/text/CdrText.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-text-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color"
-      }
+      "./src/components/tabs/CdrTabPanel.vue"
     ]
   },
   "CdrTabs": {
@@ -5356,223 +5280,68 @@
       }
     ]
   },
-  "CdrToggleButton": {
-    "name": "CdrToggleButton",
-    "description": "Permits switching two or more options on and off",
+  "CdrText": {
+    "name": "CdrText",
+    "description": "Text container used for any text element such as paragraphs, headings, and lists",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrToggleButton",
+    "displayName": "CdrText",
     "props": [
       {
-        "name": "toggleValue",
-        "description": "Sets the value and aria-label for the toggle button. Display can be overridden using default slot",
+        "name": "tag",
+        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
+        "required": false,
         "type": {
           "name": "string"
         },
-        "required": true
+        "defaultValue": {
+          "func": false,
+          "value": "'p'"
+        }
       }
     ],
     "slots": [
       {
         "name": "default",
-        "description": "CdrToggleButton label content"
+        "description": "CdrText content"
       }
     ],
     "sourceFiles": [
-      "./src/components/toggleButton/CdrToggleButton.vue"
+      "./src/components/text/CdrText.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-toggle-button-color-default-rest",
-        "defaultValue": "--cdr-color-text-toggle-button-default-rest",
-        "description": "Default text color of the cdr-toggle-button"
-      },
-      {
-        "name": "--cdr-toggle-button-background-color-default-rest",
-        "defaultValue": "--cdr-color-background-toggle-button-default-rest",
-        "description": "Default background color of the cdr-toggle-button"
-      },
-      {
-        "name": "--cdr-toggle-button-border-color-default-focus",
-        "defaultValue": "--cdr-color-border-toggle-button-default-focus",
-        "description": "Focus border color of the cdr-toggle-button"
-      },
-      {
-        "name": "--cdr-toggle-button-background-color-default-focus",
-        "defaultValue": "--cdr-color-background-toggle-button-default-focus",
-        "description": "Focus background color of the cdr-toggle-button"
-      },
-      {
-        "name": "--cdr-toggle-button-icon-fill-default",
-        "defaultValue": "--cdr-color-icon-default",
-        "description": "Default fill color of the cdr-toggle-button's svg"
-      },
-      {
-        "name": "--cdr-toggle-button-background-color-default-selected-rest",
-        "defaultValue": "--cdr-color-background-toggle-button-default-selected-rest",
-        "description": "Selected background color of the cdr-toggle-button at rest"
-      },
-      {
-        "name": "--cdr-toggle-button-border-color-default-selected-rest",
-        "defaultValue": "--cdr-color-border-toggle-button-default-selected-rest",
-        "description": "Selected border color of the cdr-toggle-button at rest"
-      },
-      {
-        "name": "--cdr-toggle-button-icon-fill-selected-rest",
-        "defaultValue": "--cdr-color-icon-emphasis",
-        "description": "Selected fill color of the cdr-toggle-button's svg at rest"
-      },
-      {
-        "name": "--cdr-toggle-button-border-color-default-selected-focus",
-        "defaultValue": "--cdr-color-border-toggle-button-default-selected-focus",
-        "description": "Selected border color of the cdr-toggle-button on focus"
-      },
-      {
-        "name": "--cdr-toggle-button-background-color-default-selected-hover",
-        "defaultValue": "--cdr-color-background-toggle-button-default-selected-hover",
-        "description": "Selected background color of the cdr-toggle-button on hover"
-      },
-      {
-        "name": "--cdr-toggle-button-background-color-default-hover",
-        "defaultValue": "--cdr-color-background-toggle-button-default-hover",
-        "description": "Background color of the cdr-toggle-button on hover"
-      },
-      {
-        "name": "--cdr-toggle-button-border-color-hover-focus",
-        "defaultValue": "--cdr-color-border-toggle-button-default-selected-focus",
-        "description": "Hover border color of the cdr-toggle-button on focus"
+        "name": "--cdr-text-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color"
       }
     ]
   },
-  "CdrTooltip": {
-    "name": "CdrTooltip",
-    "description": "Floating label used to clarify interface actions",
-    "tags": {},
+  "CdrTitle": {
     "exportName": "default",
-    "displayName": "CdrTooltip",
+    "displayName": "CdrTitle",
+    "description": "",
+    "tags": {},
     "props": [
       {
-        "name": "position",
-        "description": "Sets the position where the tooltip will render relative to the trigger element.",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "top",
-          "bottom",
-          "left",
-          "right"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "'top'"
-        }
-      },
-      {
-        "name": "autoPosition",
-        "description": "If set to `true`, tooltip will attempt to dynamically set it's position to\nensure it renders within the visible browser window.\nIf `false` the tooltip will always render in the provided `position`.",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "id",
-        "description": "ID for the tooltip element, required for accessibility",
-        "type": {
-          "name": "string"
-        },
-        "required": true
-      },
-      {
-        "name": "contentClass",
-        "description": "Add custom class to the tooltip content wrapper. Allows for overriding size, styling, etc.",
+        "name": "tag",
+        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
         "type": {
           "name": "string"
         },
-        "required": false
-      },
-      {
-        "name": "open",
-        "description": "Used to programmatically control the tooltip state. Does not need to be set if you are using the `trigger` slot.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "boolean"
-        },
         "defaultValue": {
           "func": false,
-          "value": false
+          "value": "'h1'"
         }
       }
     ],
-    "events": [
-      {
-        "name": "opened",
-        "description": "Emits when tooltip is opened"
-      },
-      {
-        "name": "closed",
-        "description": "Emits when tooltip is closed"
-      }
-    ],
     "slots": [
       {
-        "name": "trigger",
-        "description": " Slot for the element that triggers the tooltip."
-      },
-      {
-        "name": "default",
-        "description": "CdrTooltip content"
+        "name": "default"
       }
     ],
     "sourceFiles": [
-      "./src/components/tooltip/CdrTooltip.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-popup-background-color-default",
-        "defaultValue": "--cdr-color-background-tooltip-default",
-        "description": "Background color of the cdr-popup"
-      },
-      {
-        "name": "--cdr-popup-text-color-default",
-        "defaultValue": "--cdr-color-text-tooltip-default",
-        "description": "Text color of the cdr-popup"
-      },
-      {
-        "name": "--cdr-popup-border-color-default",
-        "defaultValue": "--cdr-color-border-tooltip-default",
-        "description": "Border color of the cdr-popup"
-      },
-      {
-        "name": "--cdr-popup-arrow-border-bottom-color",
-        "defaultValue": "--cdr-color-border-tooltip-default",
-        "description": "Border color of the cdr-popup arrow"
-      },
-      {
-        "name": "--cdr-popup-arrow-background-color",
-        "defaultValue": "--cdr-color-background-tooltip-default",
-        "description": "Background color of the cdr-popup arrow"
-      }
+      "./src/components/title/CdrTitle.vue"
     ]
   },
   "CdrToast": {
@@ -5892,31 +5661,223 @@
       }
     ]
   },
-  "CdrTitle": {
+  "CdrToggleButton": {
+    "name": "CdrToggleButton",
+    "description": "Permits switching two or more options on and off",
+    "tags": {},
     "exportName": "default",
-    "displayName": "CdrTitle",
-    "description": "",
+    "displayName": "CdrToggleButton",
+    "props": [
+      {
+        "name": "toggleValue",
+        "description": "Sets the value and aria-label for the toggle button. Display can be overridden using default slot",
+        "type": {
+          "name": "string"
+        },
+        "required": true
+      }
+    ],
+    "slots": [
+      {
+        "name": "default",
+        "description": "CdrToggleButton label content"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/toggleButton/CdrToggleButton.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-toggle-button-color-default-rest",
+        "defaultValue": "--cdr-color-text-toggle-button-default-rest",
+        "description": "Default text color of the cdr-toggle-button"
+      },
+      {
+        "name": "--cdr-toggle-button-background-color-default-rest",
+        "defaultValue": "--cdr-color-background-toggle-button-default-rest",
+        "description": "Default background color of the cdr-toggle-button"
+      },
+      {
+        "name": "--cdr-toggle-button-border-color-default-focus",
+        "defaultValue": "--cdr-color-border-toggle-button-default-focus",
+        "description": "Focus border color of the cdr-toggle-button"
+      },
+      {
+        "name": "--cdr-toggle-button-background-color-default-focus",
+        "defaultValue": "--cdr-color-background-toggle-button-default-focus",
+        "description": "Focus background color of the cdr-toggle-button"
+      },
+      {
+        "name": "--cdr-toggle-button-icon-fill-default",
+        "defaultValue": "--cdr-color-icon-default",
+        "description": "Default fill color of the cdr-toggle-button's svg"
+      },
+      {
+        "name": "--cdr-toggle-button-background-color-default-selected-rest",
+        "defaultValue": "--cdr-color-background-toggle-button-default-selected-rest",
+        "description": "Selected background color of the cdr-toggle-button at rest"
+      },
+      {
+        "name": "--cdr-toggle-button-border-color-default-selected-rest",
+        "defaultValue": "--cdr-color-border-toggle-button-default-selected-rest",
+        "description": "Selected border color of the cdr-toggle-button at rest"
+      },
+      {
+        "name": "--cdr-toggle-button-icon-fill-selected-rest",
+        "defaultValue": "--cdr-color-icon-emphasis",
+        "description": "Selected fill color of the cdr-toggle-button's svg at rest"
+      },
+      {
+        "name": "--cdr-toggle-button-border-color-default-selected-focus",
+        "defaultValue": "--cdr-color-border-toggle-button-default-selected-focus",
+        "description": "Selected border color of the cdr-toggle-button on focus"
+      },
+      {
+        "name": "--cdr-toggle-button-background-color-default-selected-hover",
+        "defaultValue": "--cdr-color-background-toggle-button-default-selected-hover",
+        "description": "Selected background color of the cdr-toggle-button on hover"
+      },
+      {
+        "name": "--cdr-toggle-button-background-color-default-hover",
+        "defaultValue": "--cdr-color-background-toggle-button-default-hover",
+        "description": "Background color of the cdr-toggle-button on hover"
+      },
+      {
+        "name": "--cdr-toggle-button-border-color-hover-focus",
+        "defaultValue": "--cdr-color-border-toggle-button-default-selected-focus",
+        "description": "Hover border color of the cdr-toggle-button on focus"
+      }
+    ]
+  },
+  "CdrTooltip": {
+    "name": "CdrTooltip",
+    "description": "Floating label used to clarify interface actions",
     "tags": {},
+    "exportName": "default",
+    "displayName": "CdrTooltip",
     "props": [
       {
-        "name": "tag",
-        "description": "Sets the HTML tag (p, span, h1, h2, etc)",
+        "name": "position",
+        "description": "Sets the position where the tooltip will render relative to the trigger element.",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "top",
+          "bottom",
+          "left",
+          "right"
+        ],
         "type": {
           "name": "string"
         },
+        "required": false,
         "defaultValue": {
           "func": false,
-          "value": "'h1'"
+          "value": "'top'"
+        }
+      },
+      {
+        "name": "autoPosition",
+        "description": "If set to `true`, tooltip will attempt to dynamically set it's position to\nensure it renders within the visible browser window.\nIf `false` the tooltip will always render in the provided `position`.",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      },
+      {
+        "name": "id",
+        "description": "ID for the tooltip element, required for accessibility",
+        "type": {
+          "name": "string"
+        },
+        "required": true
+      },
+      {
+        "name": "contentClass",
+        "description": "Add custom class to the tooltip content wrapper. Allows for overriding size, styling, etc.",
+        "type": {
+          "name": "string"
+        },
+        "required": false
+      },
+      {
+        "name": "open",
+        "description": "Used to programmatically control the tooltip state. Does not need to be set if you are using the `trigger` slot.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
         }
       }
     ],
+    "events": [
+      {
+        "name": "opened",
+        "description": "Emits when tooltip is opened"
+      },
+      {
+        "name": "closed",
+        "description": "Emits when tooltip is closed"
+      }
+    ],
     "slots": [
       {
-        "name": "default"
+        "name": "trigger",
+        "description": " Slot for the element that triggers the tooltip."
+      },
+      {
+        "name": "default",
+        "description": "CdrTooltip content"
       }
     ],
     "sourceFiles": [
-      "./src/components/title/CdrTitle.vue"
+      "./src/components/tooltip/CdrTooltip.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-popup-background-color-default",
+        "defaultValue": "--cdr-color-background-tooltip-default",
+        "description": "Background color of the cdr-popup"
+      },
+      {
+        "name": "--cdr-popup-text-color-default",
+        "defaultValue": "--cdr-color-text-tooltip-default",
+        "description": "Text color of the cdr-popup"
+      },
+      {
+        "name": "--cdr-popup-border-color-default",
+        "defaultValue": "--cdr-color-border-tooltip-default",
+        "description": "Border color of the cdr-popup"
+      },
+      {
+        "name": "--cdr-popup-arrow-border-bottom-color",
+        "defaultValue": "--cdr-color-border-tooltip-default",
+        "description": "Border color of the cdr-popup arrow"
+      },
+      {
+        "name": "--cdr-popup-arrow-background-color",
+        "defaultValue": "--cdr-color-background-tooltip-default",
+        "description": "Background color of the cdr-popup arrow"
+      }
     ]
   }
 }