@rei/cedar 14.0.2-alpha.0 → 14.0.2-alpha.2

package/dist/component-docgen.json

@@ -528,60 +528,6 @@
       }
     ]
   },
-  "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": "summary",
-        "description": "Sets the string content for the description body of the caption.",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "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-caption-summary-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of a cdr-caption"
-      },
-      {
-        "name": "--cdr-caption-cite-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Text color of a cdr-caption"
-      }
-    ]
-  },
   "CdrButton": {
     "name": "CdrButton",
     "description": "Initiates an action, such as completing a task or submitting information",
@@ -1284,349 +1230,180 @@
       }
     ]
   },
-  "CdrChip": {
-    "name": "CdrChip",
-    "description": "Allows people to make selections, filter content, or trigger actions",
+  "CdrCaption": {
+    "name": "CdrCaption",
+    "description": "Provides context and credit for an asset such as an image, video, or chart",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrChip",
-    "slots": [
-      {
-        "name": "icon-left",
-        "description": "Icon to the left of the content"
-      },
+    "displayName": "CdrCaption",
+    "props": [
       {
-        "name": "icon-right",
-        "description": "Icon to the right of the content"
+        "name": "summary",
+        "description": "Sets the string content for the description body of the caption.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string"
+        }
       },
       {
-        "name": "default",
-        "description": "Primary CdrChip content"
+        "name": "credit",
+        "description": "Sets the string content for attribution.",
+        "tags": {
+          "demoIgnore": [
+            {
+              "description": "true",
+              "title": "demoIgnore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string"
+        }
       }
     ],
     "sourceFiles": [
-      "./src/components/chip/CdrChip.vue"
+      "./src/components/caption/CdrCaption.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-chip-text-color",
-        "defaultValue": "--cdr-color-text-chip-default",
-        "description": "Text color of a cdr-chip"
-      },
-      {
-        "name": "--cdr-chip-fill-color",
-        "defaultValue": "--cdr-color-text-chip-default",
-        "description": "Fill color of a cdr-chip"
+        "name": "--cdr-caption-summary-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of a cdr-caption"
       },
       {
-        "name": "--cdr-chip-background-color-rest",
-        "defaultValue": "--cdr-color-background-chip-default-rest",
-        "description": "Background color of a cdr-chip"
-      },
+        "name": "--cdr-caption-cite-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Text color of a cdr-caption"
+      }
+    ]
+  },
+  "CdrCheckbox": {
+    "name": "CdrCheckbox",
+    "description": "Allows selecting one or more items from a list",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrCheckbox",
+    "props": [
       {
-        "name": "--cdr-chip-box-shadow-color-rest",
-        "defaultValue": "--cdr-color-border-chip-default-rest",
-        "description": "Box-shadow color of a cdr-chip"
+        "name": "labelClass",
+        "description": "Passes a CSS class to the label for custom styles",
+        "type": {
+          "name": "string"
+        }
       },
       {
-        "name": "--cdr-chip-background-color-disabled",
-        "defaultValue": "--cdr-color-background-chip-default-disabled",
-        "description": "Background color of a cdr-chip when disabled"
+        "name": "inputClass",
+        "description": "Passes a CSS class to the input for custom styles",
+        "type": {
+          "name": "string"
+        }
       },
       {
-        "name": "--cdr-chip-box-shadow-color-disabled",
-        "defaultValue": "--cdr-color-border-chip-default-disabled",
-        "description": "Box-shadow color of a cdr-chip when disabled"
+        "name": "contentClass",
+        "description": "Passes a CSS class to the slot wrapper for custom styles",
+        "type": {
+          "name": "string"
+        }
       },
       {
-        "name": "--cdr-chip-text-color-disabled",
-        "defaultValue": "--cdr-color-text-chip-disabled",
-        "description": "Text color of a cdr-chip when disabled"
+        "name": "indeterminate",
+        "description": "Show checkbox in indeterminate state. (NOTE: this is a visual-only state and there is no logic for when to show it)",
+        "type": {
+          "name": "boolean|string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
+        }
       },
       {
-        "name": "--cdr-chip-background-color-hover",
-        "defaultValue": "--cdr-color-background-chip-default-hover",
-        "description": "Background color of a cdr-chip on hover"
+        "name": "disabled",
+        "description": "Disables the checkbox",
+        "type": {
+          "name": "boolean"
+        }
       },
       {
-        "name": "--cdr-chip-box-shadow-color-hover",
-        "defaultValue": "--cdr-color-border-chip-default-hover",
-        "description": "Box-shadow color of a cdr-chip on hover"
+        "name": "trueValue",
+        "description": "The value when checked.",
+        "type": {
+          "name": "string|number|boolean|object|array|symbol|func"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
       },
       {
-        "name": "--cdr-chip-background-color-focus",
-        "defaultValue": "--cdr-color-background-chip-default-focus",
-        "description": "Background color of a cdr-chip on focus"
+        "name": "falseValue",
+        "description": "The value when unchecked.",
+        "type": {
+          "name": "string|number|boolean|object|array|symbol|func"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
+        }
       },
       {
-        "name": "--cdr-chip-box-shadow-color-focus",
-        "defaultValue": "--cdr-color-border-chip-default-focus",
-        "description": "Box-shadow color of a cdr-chip on focus"
+        "name": "customValue",
+        "description": "The value when used in a checkbox group. Replaces `trueValue` and `falseValue`.",
+        "type": {
+          "name": "string|number|boolean|object|array|symbol|func"
+        }
       },
       {
-        "name": "--cdr-chip-background-color-active",
-        "defaultValue": "--cdr-color-background-chip-default-active",
-        "description": "Background color of a cdr-chip when active"
+        "name": "background",
+        "description": "Sets the background color the input is rendered on",
+        "tags": {},
+        "values": [
+          "primary",
+          "secondary"
+        ],
+        "type": {
+          "name": "backgroundProps"
+        }
       },
       {
-        "name": "--cdr-chip-box-shadow-color-active",
-        "defaultValue": "--cdr-color-border-chip-default-active",
-        "description": "Box-shadow color of a cdr-chip when active"
+        "name": "size",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "small",
+          "medium",
+          "large"
+        ],
+        "type": {
+          "name": "sizeProps"
+        }
       },
       {
-        "name": "--cdr-chip-background-color-selected-rest",
-        "defaultValue": "--cdr-color-background-chip-default-selected",
-        "description": "Background color of a cdr-chip when selected"
-      },
-      {
-        "name": "--cdr-chip-box-shadow-color-selected-rest",
-        "defaultValue": "--cdr-color-border-chip-default-selected-rest",
-        "description": "Box-shadow color of a cdr-chip when selected"
-      },
-      {
-        "name": "--cdr-chip-background-color-selected-hover",
-        "defaultValue": "--cdr-color-background-chip-default-selected-hover",
-        "description": "Background color of a cdr-chip when selected and hovered"
-      },
-      {
-        "name": "--cdr-chip-box-shadow-color-selected-hover",
-        "defaultValue": "--cdr-color-border-chip-default-selected-hover",
-        "description": "Box-shadow color of a cdr-chip when selected and hovered"
-      },
-      {
-        "name": "--cdr-chip-background-color-selected-focus",
-        "defaultValue": "--cdr-color-background-chip-default-selected-focus",
-        "description": "Background color of a cdr-chip when selected and focused"
-      },
-      {
-        "name": "--cdr-chip-box-shadow-color-selected-focus",
-        "defaultValue": "--cdr-color-border-chip-default-selected-focus",
-        "description": "Box-shadow color of a cdr-chip when selected and focused"
-      },
-      {
-        "name": "--cdr-chip-background-color-selected-active",
-        "defaultValue": "--cdr-color-background-chip-default-selected-active",
-        "description": "Background color of a cdr-chip when selected and active"
-      },
-      {
-        "name": "--cdr-chip-box-shadow-color-selected-focus",
-        "defaultValue": "--cdr-color-border-chip-default-selected-focus",
-        "description": "Box-shadow color of a cdr-chip when selected and active"
-      }
-    ]
-  },
-  "CdrCard": {
-    "name": "CdrCard",
-    "description": "Related, interactive containers linking to a single subject or destination",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrCard",
-    "props": [
-      {
-        "name": "tag",
-        "description": "Sets valid HTML container element tag.",
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'article'"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "default",
-        "description": "CdrCard content"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/card/CdrCard.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-card-base-background-color",
-        "defaultValue": "--cdr-color-background-primary",
-        "description": "Background color of a cdr-card"
-      },
-      {
-        "name": "--cdr-card-base-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of a cdr-card"
-      },
-      {
-        "name": "--cdr-card-link-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Link text color of a cdr-card"
-      },
-      {
-        "name": "--cdr-card-link-hover-color",
-        "defaultValue": "--cdr-color-text-link-hover",
-        "description": "Link hover text color of a cdr-card"
-      }
-    ]
-  },
-  "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",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrCheckbox",
-    "props": [
-      {
-        "name": "labelClass",
-        "description": "Passes a CSS class to the label for custom styles",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "inputClass",
-        "description": "Passes a CSS class to the input for custom styles",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "contentClass",
-        "description": "Passes a CSS class to the slot wrapper for custom styles",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "indeterminate",
-        "description": "Show checkbox in indeterminate state. (NOTE: this is a visual-only state and there is no logic for when to show it)",
-        "type": {
-          "name": "boolean|string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "disabled",
-        "description": "Disables the checkbox",
-        "type": {
-          "name": "boolean"
-        }
-      },
-      {
-        "name": "trueValue",
-        "description": "The value when checked.",
-        "type": {
-          "name": "string|number|boolean|object|array|symbol|func"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "falseValue",
-        "description": "The value when unchecked.",
-        "type": {
-          "name": "string|number|boolean|object|array|symbol|func"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "customValue",
-        "description": "The value when used in a checkbox group. Replaces `trueValue` and `falseValue`.",
-        "type": {
-          "name": "string|number|boolean|object|array|symbol|func"
-        }
-      },
-      {
-        "name": "background",
-        "description": "Sets the background color the input is rendered on",
-        "tags": {},
-        "values": [
-          "primary",
-          "secondary"
-        ],
-        "type": {
-          "name": "backgroundProps"
-        }
-      },
-      {
-        "name": "size",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "small",
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "sizeProps"
-        }
-      },
-      {
-        "name": "modifier",
-        "description": "Use `hide-figure` to hide the checkbox, which leaves the text label as the clickable element.\nAdd appropriate custom styles to convey selected and unselected states.",
-        "tags": {},
-        "values": [
-          "hide-figure"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
-        }
+        "name": "modifier",
+        "description": "Use `hide-figure` to hide the checkbox, which leaves the text label as the clickable element.\nAdd appropriate custom styles to convey selected and unselected states.",
+        "tags": {},
+        "values": [
+          "hide-figure"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "''"
+        }
       },
       {
         "name": "modelValue",
@@ -1765,39 +1542,227 @@
       }
     ]
   },
-  "CdrFormError": {
-    "name": "CdrFormError",
-    "exportName": "default",
-    "displayName": "CdrFormError",
-    "description": "",
+  "CdrCard": {
+    "name": "CdrCard",
+    "description": "Related, interactive containers linking to a single subject or destination",
     "tags": {},
-    "props": [
+    "exportName": "default",
+    "displayName": "CdrCard",
+    "props": [
       {
-        "name": "error",
+        "name": "tag",
+        "description": "Sets valid HTML container element tag.",
         "type": {
-          "name": "boolean|string"
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'article'"
         }
       }
     ],
     "slots": [
       {
-        "name": "error"
+        "name": "default",
+        "description": "CdrCard content"
       }
     ],
     "sourceFiles": [
-      "./src/components/formError/CdrFormError.vue"
+      "./src/components/card/CdrCard.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-form-error-text-color",
-        "defaultValue": "--cdr-color-text-input-error",
-        "description": "Text color of a cdr-form-error"
+        "name": "--cdr-card-base-background-color",
+        "defaultValue": "--cdr-color-background-primary",
+        "description": "Background color of a cdr-card"
       },
       {
-        "name": "--cdr-form-error-fill-color",
-        "defaultValue": "--cdr-color-text-input-error",
-        "description": "Fill color of a cdr-form-error"
+        "name": "--cdr-card-base-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of a cdr-card"
+      },
+      {
+        "name": "--cdr-card-link-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Link text color of a cdr-card"
+      },
+      {
+        "name": "--cdr-card-link-hover-color",
+        "defaultValue": "--cdr-color-text-link-hover",
+        "description": "Link hover text color of a cdr-card"
+      }
+    ]
+  },
+  "CdrChip": {
+    "name": "CdrChip",
+    "description": "Allows people to make selections, filter content, or trigger actions",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrChip",
+    "slots": [
+      {
+        "name": "icon-left",
+        "description": "Icon to the left of the content"
+      },
+      {
+        "name": "icon-right",
+        "description": "Icon to the right of the content"
+      },
+      {
+        "name": "default",
+        "description": "Primary CdrChip content"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/chip/CdrChip.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-chip-text-color",
+        "defaultValue": "--cdr-color-text-chip-default",
+        "description": "Text color of a cdr-chip"
+      },
+      {
+        "name": "--cdr-chip-fill-color",
+        "defaultValue": "--cdr-color-text-chip-default",
+        "description": "Fill color of a cdr-chip"
+      },
+      {
+        "name": "--cdr-chip-background-color-rest",
+        "defaultValue": "--cdr-color-background-chip-default-rest",
+        "description": "Background color of a cdr-chip"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-rest",
+        "defaultValue": "--cdr-color-border-chip-default-rest",
+        "description": "Box-shadow color of a cdr-chip"
+      },
+      {
+        "name": "--cdr-chip-background-color-disabled",
+        "defaultValue": "--cdr-color-background-chip-default-disabled",
+        "description": "Background color of a cdr-chip when disabled"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-disabled",
+        "defaultValue": "--cdr-color-border-chip-default-disabled",
+        "description": "Box-shadow color of a cdr-chip when disabled"
+      },
+      {
+        "name": "--cdr-chip-text-color-disabled",
+        "defaultValue": "--cdr-color-text-chip-disabled",
+        "description": "Text color of a cdr-chip when disabled"
+      },
+      {
+        "name": "--cdr-chip-background-color-hover",
+        "defaultValue": "--cdr-color-background-chip-default-hover",
+        "description": "Background color of a cdr-chip on hover"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-hover",
+        "defaultValue": "--cdr-color-border-chip-default-hover",
+        "description": "Box-shadow color of a cdr-chip on hover"
+      },
+      {
+        "name": "--cdr-chip-background-color-focus",
+        "defaultValue": "--cdr-color-background-chip-default-focus",
+        "description": "Background color of a cdr-chip on focus"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-focus",
+        "defaultValue": "--cdr-color-border-chip-default-focus",
+        "description": "Box-shadow color of a cdr-chip on focus"
+      },
+      {
+        "name": "--cdr-chip-background-color-active",
+        "defaultValue": "--cdr-color-background-chip-default-active",
+        "description": "Background color of a cdr-chip when active"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-active",
+        "defaultValue": "--cdr-color-border-chip-default-active",
+        "description": "Box-shadow color of a cdr-chip when active"
+      },
+      {
+        "name": "--cdr-chip-background-color-selected-rest",
+        "defaultValue": "--cdr-color-background-chip-default-selected",
+        "description": "Background color of a cdr-chip when selected"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-selected-rest",
+        "defaultValue": "--cdr-color-border-chip-default-selected-rest",
+        "description": "Box-shadow color of a cdr-chip when selected"
+      },
+      {
+        "name": "--cdr-chip-background-color-selected-hover",
+        "defaultValue": "--cdr-color-background-chip-default-selected-hover",
+        "description": "Background color of a cdr-chip when selected and hovered"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-selected-hover",
+        "defaultValue": "--cdr-color-border-chip-default-selected-hover",
+        "description": "Box-shadow color of a cdr-chip when selected and hovered"
+      },
+      {
+        "name": "--cdr-chip-background-color-selected-focus",
+        "defaultValue": "--cdr-color-background-chip-default-selected-focus",
+        "description": "Background color of a cdr-chip when selected and focused"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-selected-focus",
+        "defaultValue": "--cdr-color-border-chip-default-selected-focus",
+        "description": "Box-shadow color of a cdr-chip when selected and focused"
+      },
+      {
+        "name": "--cdr-chip-background-color-selected-active",
+        "defaultValue": "--cdr-color-background-chip-default-selected-active",
+        "description": "Background color of a cdr-chip when selected and active"
+      },
+      {
+        "name": "--cdr-chip-box-shadow-color-selected-focus",
+        "defaultValue": "--cdr-color-border-chip-default-selected-focus",
+        "description": "Box-shadow color of a cdr-chip when selected and active"
+      }
+    ]
+  },
+  "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": {
@@ -1852,6 +1817,41 @@
       "./src/components/container/CdrContainer.vue"
     ]
   },
+  "CdrFormError": {
+    "name": "CdrFormError",
+    "exportName": "default",
+    "displayName": "CdrFormError",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "error",
+        "type": {
+          "name": "boolean|string"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "error"
+      }
+    ],
+    "sourceFiles": [
+      "./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": {
     "name": "CdrFormGroup",
     "description": "Groups related input elements together",
@@ -2028,16 +2028,75 @@
       "./src/components/grid/CdrGrid.vue"
     ]
   },
-  "CdrImg": {
-    "name": "CdrImg",
-    "description": "Media for capturing attention and communicating messages",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrImg",
-    "props": [
-      {
-        "name": "src",
-        "description": "Image source url.",
+  "CdrIcon": {
+    "name": "CdrIcon",
+    "description": "Communicates meaning through graphics representing simple and complex ideas",
+    "tags": {
+      "demoComponentNames": [
+        {
+          "description": "icon-account-profile, icon-camera",
+          "title": "demoComponentNames"
+        }
+      ]
+    },
+    "exportName": "default",
+    "displayName": "CdrIcon",
+    "props": [
+      {
+        "name": "use",
+        "description": "Only on CdrIcon. Sets the href attribute for use with SVG symbol sprite (see @rei/cedar-icons).",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "inheritColor",
+        "description": "Sets icon fill to \"inherit\" so as to use parent/ancestor fill color.",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
+        }
+      },
+      {
+        "name": "size",
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'medium'"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/icon/CdrIcon.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-icon-fill-default",
+        "defaultValue": "--cdr-color-icon-default",
+        "description": "Fill color of an icon"
+      }
+    ]
+  },
+  "CdrImg": {
+    "name": "CdrImg",
+    "description": "Media for capturing attention and communicating messages",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrImg",
+    "props": [
+      {
+        "name": "src",
+        "description": "Image source url.",
         "type": {
           "name": "string"
         },
@@ -2168,193 +2227,346 @@
       "./src/components/image/CdrImg.vue"
     ]
   },
-  "CdrIcon": {
-    "name": "CdrIcon",
-    "description": "Communicates meaning through graphics representing simple and complex ideas",
-    "tags": {
-      "demoComponentNames": [
-        {
-          "description": "icon-account-profile, icon-camera",
-          "title": "demoComponentNames"
-        }
-      ]
-    },
+  "CdrInput": {
+    "name": "CdrInput",
+    "description": "Allows for data entry, editing, and search",
+    "tags": {},
     "exportName": "default",
-    "displayName": "CdrIcon",
+    "displayName": "CdrInput",
     "props": [
       {
-        "name": "use",
-        "description": "Only on CdrIcon. Sets the href attribute for use with SVG symbol sprite (see @rei/cedar-icons).",
+        "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"
         }
       },
       {
-        "name": "inheritColor",
-        "description": "Sets icon fill to \"inherit\" so as to use parent/ancestor fill color.",
+        "name": "type",
+        "description": "'type' attribute for the input as defined by w3c.\n Only supporting text|email|number|password|search|url|date.\n The increment/decrement webkit psuedo element is hidden for number.",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "text",
+          "email",
+          "number",
+          "password",
+          "search",
+          "url",
+          "tel",
+          "date"
+        ],
         "type": {
-          "name": "boolean"
+          "name": "string"
         },
         "defaultValue": {
           "func": false,
-          "value": false
+          "value": "'text'"
         }
       },
       {
-        "name": "size",
+        "name": "label",
+        "description": "Sets the text value for the input label. Required for a11y compliance. Use ‘hideLabel’ if the label display is not desired. Required.",
         "type": {
           "name": "string"
         },
+        "required": true
+      },
+      {
+        "name": "numeric",
+        "description": "Sets default attributes for an input that should launch a numeric keyboard but is not strictly a 'number' (credit card, security code, postal code, etc.). Should be used in conjunction with the default text type input. An `input` listener can be used to fully restrict input values to numerical characters only",
+        "type": {
+          "name": "boolean"
+        },
         "defaultValue": {
           "func": false,
-          "value": "'medium'"
+          "value": false
         }
-      }
-    ],
-    "slots": [
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/icon/CdrIcon.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-icon-fill-default",
-        "defaultValue": "--cdr-color-icon-default",
-        "description": "Fill color of an icon"
-      }
-    ]
-  },
-  "CdrLabelWrapper": {
-    "name": "CdrLabelWrapper",
-    "exportName": "default",
-    "displayName": "CdrLabelWrapper",
-    "description": "",
-    "tags": {},
-    "props": [
+      },
       {
-        "name": "labelClass",
+        "name": "hideLabel",
+        "description": "Removes the label element but sets the input `aria-label` to `label` text for a11y.",
         "type": {
-          "name": "string"
+          "name": "boolean"
         }
       },
       {
-        "name": "contentClass",
+        "name": "rows",
+        "description": "Number of rows for input. Converts component to text-area if rows greater than 1.",
         "type": {
-          "name": "string"
+          "name": "number"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "1"
         }
       },
       {
         "name": "background",
+        "description": "Sets the background color the input is rendered on",
+        "tags": {},
+        "values": [
+          "primary",
+          "secondary"
+        ],
         "type": {
           "name": "backgroundProps"
         }
       },
       {
-        "name": "disabled",
+        "name": "size",
+        "description": "Sets the input field size",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "medium",
+          "large"
+        ],
         "type": {
-          "name": "boolean"
+          "name": "sizeProps"
         }
       },
       {
-        "name": "modifier",
+        "name": "errorRole",
+        "description": "Sets the `role` attribute for the embedded error state messaging.",
         "type": {
           "name": "string"
+        },
+        "required": false,
+        "defaultValue": {
+          "func": false,
+          "value": "'status'"
         }
       },
       {
-        "name": "size",
+        "name": "error",
+        "description": "Sets the input to an error state, displays the `error` slot if one is present.",
         "type": {
-          "name": "string"
+          "name": "boolean|string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
         }
-      }
-    ],
-    "slots": [
-      {
-        "name": "input"
       },
       {
-        "name": "svgs"
+        "name": "disabled",
+        "description": "Sets the disabled state for the input field and label styling. Also, restricts user input.",
+        "type": {
+          "name": "boolean"
+        }
       },
       {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/labelWrapper/CdrLabelWrapper.vue"
-    ],
-    "UIProperties": [
+        "name": "required",
+        "description": "Sets aria-required on the input field and displays an asterisk next to the input label.",
+        "type": {
+          "name": "boolean"
+        }
+      },
       {
-        "name": "--cdr-label-wrapper-text-color",
-        "defaultValue": "--cdr-color-text-input-label",
-        "description": "Text color of a label wrapper"
+        "name": "optional",
+        "description": "Displays '(optional)' text next to the input label.",
+        "type": {
+          "name": "boolean"
+        }
       },
       {
-        "name": "--cdr-label-wrapper-background-color",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a label wrapper"
+        "name": "modelValue",
+        "tags": {
+          "ignore": [
+            {
+              "description": true,
+              "title": "ignore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string|number"
+        }
       },
       {
-        "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": "labelClass",
+        "description": "Adds a custom class to the cdr-label-standalone wrapping div",
+        "type": {
+          "name": "string"
+        }
+      }
+    ],
+    "events": [
+      {
+        "name": "update:modelValue",
+        "description": "Event emitted by v-model on the <input> element",
+        "properties": [
+          {
+            "type": {
+              "names": [
+                "mixed"
+              ]
+            },
+            "name": "modelValue"
+          }
+        ],
+        "tags": [
+          {
+            "title": "param",
+            "type": {
+              "name": "mixed"
+            },
+            "name": "modelValue"
+          }
+        ]
+      }
+    ],
+    "slots": [
+      {
+        "name": "helper-text-top",
+        "description": "Helper text above the input field"
       },
       {
-        "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": "info",
+        "description": "Link or icon to the right above the input field."
       },
       {
-        "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": "pre-icon",
+        "description": "Icon preceding text within the input field"
       },
       {
-        "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": "post-icon",
+        "description": "Icon after text within the input field"
       },
       {
-        "name": "--cdr-label-wrapper-secondary-background-color",
+        "name": "info-action",
+        "description": "Action-wrapped icon within the input field (precedes post-icon)"
+      },
+      {
+        "name": "helper-text-bottom",
+        "description": "Helper text below the input field"
+      },
+      {
+        "name": "error",
+        "description": "Error messaging text that is displayed when the `error` prop is true."
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/input/CdrInput.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-input-label-background-color",
+        "defaultValue": "--cdr-color-border-input-default",
+        "description": "Background color of the cdr-button label"
+      },
+      {
+        "name": "--cdr-input-label-background-interaction",
+        "defaultValue": "--cdr-color-background-input-default-active",
+        "description": "Background color of the cdr-input label in hover, active, focus, and focus-within states"
+      },
+      {
+        "name": "--cdr-input-label-box-shadow-interaction",
+        "defaultValue": "--cdr-color-border-input-default-focus",
+        "description": "Box-shadow color of the cdr-input label in hover, active, focus, and focus-within states"
+      },
+      {
+        "name": "--cdr-input-label-fill-interaction",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Fill color of the cdr-input label in hover, active, focus, and focus-within states"
+      },
+      {
+        "name": "--cdr-input-svg-fill-focus",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Fill color of the cdr-input SVG when the parent is focused"
+      },
+      {
+        "name": "--cdr-input-wrap-fill",
+        "defaultValue": "--cdr-color-icon-default",
+        "description": "Fill color of the cdr-input wrapper"
+      },
+      {
+        "name": "--cdr-input-text-color-default",
+        "defaultValue": "--cdr-color-text-input-default",
+        "description": "Text color of a cdr-input by default"
+      },
+      {
+        "name": "--cdr-input-background-color-default",
         "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a secondary label wrapper"
+        "description": "Background color of a cdr-input by default"
       },
       {
-        "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-input-box-shadow-default",
+        "defaultValue": "--cdr-color-border-input-default",
+        "description": "Box-shadow color of a cdr-input by default"
       },
       {
-        "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-input-icon-fill",
+        "defaultValue": "--cdr-color-icon-default",
+        "description": "Fill color of an icon in a cdr-input"
       },
       {
-        "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-input-box-shadow-focus",
+        "defaultValue": "--cdr-color-border-input-default-focus",
+        "description": "Box shadow of a focused or active cdr-input"
       },
       {
-        "name": "--cdr-label-wrapper-text-color-disabled",
+        "name": "--cdr-input-background-color-disabled",
+        "defaultValue": "--cdr-color-background-input-default-disabled",
+        "description": "Background color of a disabled cdr-input"
+      },
+      {
+        "name": "--cdr-input-text-color-disabled",
         "defaultValue": "--cdr-color-text-input-disabled",
-        "description": "Text color of a disabled label wrapper"
+        "description": "Text color of a disabled cdr-input"
       },
       {
-        "name": "--cdr-label-wrapper-background-color-disabled",
-        "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a disabled label wrapper"
+        "name": "--cdr-input-box-shadow-disabled",
+        "defaultValue": "--cdr-color-border-input-default-disabled",
+        "description": "Box-shadow color of a disabled cdr-input"
       },
       {
-        "name": "--cdr-form-figure-background-color",
+        "name": "--cdr-input-background-color-default",
         "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a form figure"
+        "description": "Background color of a default cdr-input"
       },
       {
-        "name": "--cdr-form-figure-box-shadow-color",
-        "defaultValue": "--cdr-color-border-input-default",
-        "description": "Box shadow color of a form figure"
+        "name": "--cdr-input-background-color-default-focus",
+        "defaultValue": "--cdr-color-background-input-default-active",
+        "description": "Background color of a default cdr-input in active or focus state"
+      },
+      {
+        "name": "--cdr-input-background-color-secondary",
+        "defaultValue": "--cdr-color-background-input-secondary",
+        "description": "Background color of a secondary cdr-input"
+      },
+      {
+        "name": "--cdr-input-background-color-secondary-active",
+        "defaultValue": "--cdr-color-background-input-secondary-active",
+        "description": "Background color of a secondary cdr-input in active or focus state"
+      },
+      {
+        "name": "--cdr-input-error-background-color",
+        "defaultValue": "--cdr-color-background-input-error",
+        "description": "Background color of a cdr-input in error state"
+      },
+      {
+        "name": "--cdr-input-error-box-shadow",
+        "defaultValue": "--cdr-color-border-input-error",
+        "description": "Box-shadow color of a cdr-input in error state"
+      },
+      {
+        "name": "--cdr-input-helper-text-color",
+        "defaultValue": "--cdr-color-text-input-help",
+        "description": "Text color of a cdr-input's helper text"
       }
     ]
   },
@@ -2449,359 +2661,228 @@
       }
     ]
   },
-  "CdrInput": {
-    "name": "CdrInput",
-    "description": "Allows for data entry, editing, and search",
-    "tags": {},
+  "CdrLabelWrapper": {
+    "name": "CdrLabelWrapper",
     "exportName": "default",
-    "displayName": "CdrInput",
+    "displayName": "CdrLabelWrapper",
+    "description": "",
+    "tags": {},
     "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": "labelClass",
         "type": {
           "name": "string"
         }
       },
       {
-        "name": "type",
-        "description": "'type' attribute for the input as defined by w3c.\n Only supporting text|email|number|password|search|url|date.\n The increment/decrement webkit psuedo element is hidden for number.",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "text",
-          "email",
-          "number",
-          "password",
-          "search",
-          "url",
-          "tel",
-          "date"
-        ],
+        "name": "contentClass",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'text'"
         }
       },
       {
-        "name": "label",
-        "description": "Sets the text value for the input label. Required for a11y compliance. Use ‘hideLabel’ if the label display is not desired. Required.",
+        "name": "background",
         "type": {
-          "name": "string"
-        },
-        "required": true
+          "name": "backgroundProps"
+        }
       },
       {
-        "name": "numeric",
-        "description": "Sets default attributes for an input that should launch a numeric keyboard but is not strictly a 'number' (credit card, security code, postal code, etc.). Should be used in conjunction with the default text type input. An `input` listener can be used to fully restrict input values to numerical characters only",
+        "name": "disabled",
         "type": {
           "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
         }
       },
       {
-        "name": "hideLabel",
-        "description": "Removes the label element but sets the input `aria-label` to `label` text for a11y.",
+        "name": "modifier",
         "type": {
-          "name": "boolean"
+          "name": "string"
         }
       },
       {
-        "name": "rows",
-        "description": "Number of rows for input. Converts component to text-area if rows greater than 1.",
+        "name": "size",
         "type": {
-          "name": "number"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "1"
+          "name": "string"
         }
+      }
+    ],
+    "slots": [
+      {
+        "name": "input"
       },
       {
-        "name": "background",
-        "description": "Sets the background color the input is rendered on",
-        "tags": {},
-        "values": [
-          "primary",
-          "secondary"
-        ],
-        "type": {
-          "name": "backgroundProps"
-        }
-      },
-      {
-        "name": "size",
-        "description": "Sets the input field size",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "sizeProps"
-        }
-      },
-      {
-        "name": "errorRole",
-        "description": "Sets the `role` attribute for the embedded error state messaging.",
-        "type": {
-          "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "'status'"
-        }
-      },
-      {
-        "name": "error",
-        "description": "Sets the input to an error state, displays the `error` slot if one is present.",
-        "type": {
-          "name": "boolean|string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "disabled",
-        "description": "Sets the disabled state for the input field and label styling. Also, restricts user input.",
-        "type": {
-          "name": "boolean"
-        }
-      },
-      {
-        "name": "required",
-        "description": "Sets aria-required on the input field and displays an asterisk next to the input label.",
-        "type": {
-          "name": "boolean"
-        }
-      },
-      {
-        "name": "optional",
-        "description": "Displays '(optional)' text next to the input label.",
-        "type": {
-          "name": "boolean"
-        }
-      },
-      {
-        "name": "modelValue",
-        "tags": {
-          "ignore": [
-            {
-              "description": true,
-              "title": "ignore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string|number"
-        }
-      },
-      {
-        "name": "labelClass",
-        "description": "Adds a custom class to the cdr-label-standalone wrapping div",
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "events": [
-      {
-        "name": "update:modelValue",
-        "description": "Event emitted by v-model on the <input> element",
-        "properties": [
-          {
-            "type": {
-              "names": [
-                "mixed"
-              ]
-            },
-            "name": "modelValue"
-          }
-        ],
-        "tags": [
-          {
-            "title": "param",
-            "type": {
-              "name": "mixed"
-            },
-            "name": "modelValue"
-          }
-        ]
-      }
-    ],
-    "slots": [
-      {
-        "name": "helper-text-top",
-        "description": "Helper text above the input field"
-      },
-      {
-        "name": "info",
-        "description": "Link or icon to the right above the input field."
-      },
-      {
-        "name": "pre-icon",
-        "description": "Icon preceding text within the input field"
-      },
-      {
-        "name": "post-icon",
-        "description": "Icon after text within the input field"
-      },
-      {
-        "name": "info-action",
-        "description": "Action-wrapped icon within the input field (precedes post-icon)"
-      },
-      {
-        "name": "helper-text-bottom",
-        "description": "Helper text below the input field"
+        "name": "svgs"
       },
       {
-        "name": "error",
-        "description": "Error messaging text that is displayed when the `error` prop is true."
+        "name": "default"
       }
     ],
     "sourceFiles": [
-      "./src/components/input/CdrInput.vue"
+      "./src/components/labelWrapper/CdrLabelWrapper.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-input-label-background-color",
-        "defaultValue": "--cdr-color-border-input-default",
-        "description": "Background color of the cdr-button label"
-      },
-      {
-        "name": "--cdr-input-label-background-interaction",
-        "defaultValue": "--cdr-color-background-input-default-active",
-        "description": "Background color of the cdr-input label in hover, active, focus, and focus-within states"
+        "name": "--cdr-label-wrapper-text-color",
+        "defaultValue": "--cdr-color-text-input-label",
+        "description": "Text color of a label wrapper"
       },
       {
-        "name": "--cdr-input-label-box-shadow-interaction",
-        "defaultValue": "--cdr-color-border-input-default-focus",
-        "description": "Box-shadow color of the cdr-input label in hover, active, focus, and focus-within states"
+        "name": "--cdr-label-wrapper-background-color",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a label wrapper"
       },
       {
-        "name": "--cdr-input-label-fill-interaction",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Fill color of the cdr-input label in hover, active, focus, and focus-within states"
+        "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-input-svg-fill-focus",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Fill color of the cdr-input SVG when the parent is focused"
+        "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-input-wrap-fill",
-        "defaultValue": "--cdr-color-icon-default",
-        "description": "Fill color of the cdr-input wrapper"
+        "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-input-text-color-default",
-        "defaultValue": "--cdr-color-text-input-default",
-        "description": "Text color of a cdr-input by default"
+        "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-input-background-color-default",
+        "name": "--cdr-label-wrapper-secondary-background-color",
         "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a cdr-input by default"
-      },
-      {
-        "name": "--cdr-input-box-shadow-default",
-        "defaultValue": "--cdr-color-border-input-default",
-        "description": "Box-shadow color of a cdr-input by default"
+        "description": "Background color of a secondary label wrapper"
       },
       {
-        "name": "--cdr-input-icon-fill",
-        "defaultValue": "--cdr-color-icon-default",
-        "description": "Fill color of an icon in a cdr-input"
+        "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-input-box-shadow-focus",
-        "defaultValue": "--cdr-color-border-input-default-focus",
-        "description": "Box shadow of a focused or active cdr-input"
+        "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-input-background-color-disabled",
-        "defaultValue": "--cdr-color-background-input-default-disabled",
-        "description": "Background color of a disabled cdr-input"
+        "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-input-text-color-disabled",
+        "name": "--cdr-label-wrapper-text-color-disabled",
         "defaultValue": "--cdr-color-text-input-disabled",
-        "description": "Text color of a disabled cdr-input"
+        "description": "Text color of a disabled label wrapper"
       },
       {
-        "name": "--cdr-input-box-shadow-disabled",
-        "defaultValue": "--cdr-color-border-input-default-disabled",
-        "description": "Box-shadow color of a disabled cdr-input"
+        "name": "--cdr-label-wrapper-background-color-disabled",
+        "defaultValue": "--cdr-color-background-input-default",
+        "description": "Background color of a disabled label wrapper"
       },
       {
-        "name": "--cdr-input-background-color-default",
+        "name": "--cdr-form-figure-background-color",
         "defaultValue": "--cdr-color-background-input-default",
-        "description": "Background color of a default cdr-input"
+        "description": "Background color of a form figure"
       },
       {
-        "name": "--cdr-input-background-color-default-focus",
-        "defaultValue": "--cdr-color-background-input-default-active",
-        "description": "Background color of a default cdr-input in active or focus state"
-      },
+        "name": "--cdr-form-figure-box-shadow-color",
+        "defaultValue": "--cdr-color-border-input-default",
+        "description": "Box shadow color of a form figure"
+      }
+    ]
+  },
+  "CdrList": {
+    "name": "CdrList",
+    "description": "Groups related content items together either vertically or horizontally",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrList",
+    "props": [
       {
-        "name": "--cdr-input-background-color-secondary",
-        "defaultValue": "--cdr-color-background-input-secondary",
-        "description": "Background color of a secondary cdr-input"
+        "name": "tag",
+        "description": "Sets list type and HTML element as \"unordered\" or \"ordered\"",
+        "tags": {},
+        "values": [
+          "ul",
+          "ol"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'ul'"
+        }
       },
       {
-        "name": "--cdr-input-background-color-secondary-active",
-        "defaultValue": "--cdr-color-background-input-secondary-active",
-        "description": "Background color of a secondary cdr-input in active or focus state"
+        "name": "modifier",
+        "description": "Modifies the style variant for this component",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "true",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "ordered",
+          "unordered",
+          "compact",
+          "inline"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "''"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default",
+        "description": "CdrList content (list-items)"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/list/CdrList.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-list-inline-text-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Color of the unordered inline list item prefix"
       },
       {
-        "name": "--cdr-input-error-background-color",
-        "defaultValue": "--cdr-color-background-input-error",
-        "description": "Background color of a cdr-input in error state"
+        "name": "--cdr-list-ordered-nested-prefix-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Color of the nested ordered cdr-list item prefix"
       },
       {
-        "name": "--cdr-input-error-box-shadow",
-        "defaultValue": "--cdr-color-border-input-error",
-        "description": "Box-shadow color of a cdr-input in error state"
+        "name": "--cdr-list-unordered-prefix-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Color of the unordered cdr-list item prefix"
       },
       {
-        "name": "--cdr-input-helper-text-color",
-        "defaultValue": "--cdr-color-text-input-help",
-        "description": "Text color of a cdr-input's helper text"
+        "name": "--cdr-list-unordered-nested-prefix-color",
+        "defaultValue": "--cdr-color-text-secondary",
+        "description": "Color of the nested unordered cdr-list item prefix"
       }
     ]
   },
-  "CdrPagination": {
-    "name": "CdrPagination",
-    "description": "Allows people to navigate to the next or previous page within an experience",
+  "CdrModal": {
+    "name": "CdrModal",
+    "description": "Disruptive, action-blocking overlays used to display important information",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrPagination",
+    "displayName": "CdrModal",
     "props": [
       {
-        "name": "id",
-        "description": "Define a custom slug for the generated pagination item IDs. Slug is randomly generated if no ID provided.",
+        "name": "opened",
+        "description": "Toggles the state of the modal",
         "tags": {
           "demoIgnore": [
             {
@@ -2810,138 +2891,137 @@
             }
           ]
         },
+        "type": {
+          "name": "boolean"
+        },
+        "required": true
+      },
+      {
+        "name": "label",
+        "description": "Sets `aria-label` and modal title text. Can also use title slot to set title.",
         "type": {
           "name": "string"
-        }
+        },
+        "required": true
       },
       {
-        "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.",
+        "name": "showTitle",
+        "description": "Toggles the modal title text, which comes from `label` prop or `title` slot.",
         "type": {
-          "name": "number"
+          "name": "boolean"
         },
+        "required": false,
         "defaultValue": {
           "func": false,
-          "value": "null"
+          "value": true
         }
       },
       {
-        "name": "pages",
-        "description": "Array of objects containing pagination data.\nObjects must have structure of `{ page: number, url: string }`",
+        "name": "ariaDescribedby",
+        "description": "Text for aria-describedby attribute. Applied to modal content element",
         "type": {
-          "name": "paginationItem[]"
+          "name": "string"
         },
-        "required": true
+        "required": false,
+        "defaultValue": {
+          "func": false,
+          "value": "null"
+        }
       },
       {
-        "name": "linkTag",
-        "description": "Sets which tag type is used to render pagination elements",
+        "name": "role",
+        "description": "Sets the `role` attribute on the modal content element",
         "tags": {},
         "values": [
-          "a",
-          "button"
+          "dialog",
+          "alertDialog"
         ],
         "type": {
           "name": "string"
         },
+        "required": false,
+        "defaultValue": {
+          "func": false,
+          "value": "'dialog'"
+        }
+      },
+      {
+        "name": "id",
+        "description": "Sets unique `id` for modal",
+        "type": {
+          "name": "string"
+        },
+        "required": false,
         "defaultValue": {
           "func": false,
-          "value": "'a'"
+          "value": "null"
         }
       },
       {
-        "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`",
+        "name": "overlayClass",
+        "description": "Adds custom class to the `cdr-modal__overlay` div",
         "type": {
           "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
         }
       },
       {
-        "name": "modelValue",
-        "tags": {
-          "ignore": [
-            {
-              "description": "used for binding v-model, represents the current page",
-              "title": "ignore"
-            }
-          ]
-        },
+        "name": "wrapperClass",
+        "description": "Adds custom class to the `cdr-modal__outerWrap` div",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "contentClass",
+        "description": "Adds custom class to the `cdr-modal__innerWrap` div",
+        "type": {
+          "name": "string"
+        }
+      },
+      {
+        "name": "animationDuration",
+        "description": "Sets duration for modal's close animation",
         "type": {
           "name": "number"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "300"
         }
       }
     ],
     "events": [
       {
-        "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": "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": "closed",
+        "description": "Fires when modal is closed"
       }
     ],
-    "sourceFiles": [
-      "./src/components/pagination/CdrPagination.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"
-      },
+    "slots": [
       {
-        "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": "modal",
+        "description": "Use to override the entire CdrModal content container."
       },
       {
-        "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": "title",
+        "description": "Use to override the default title"
       },
       {
-        "name": "--cdr-pagination-link-text-color-disabled",
-        "defaultValue": "--cdr-color-text-disabled",
-        "description": "Text color of a disabled cdr-pagination link"
-      },
+        "name": "default"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/modal/CdrModal.vue"
+    ],
+    "UIProperties": [
       {
-        "name": "--cdr-pagination-link-fill-color-disabled",
-        "defaultValue": "--cdr-color-text-disabled",
-        "description": "Fill color of a disabled cdr-pagination link"
+        "name": "--cdr-modal-overlay-background-color",
+        "defaultValue": "--cdr-color-background-modal-overlay",
+        "description": "Background color of the modal overlay"
       },
       {
-        "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-modal-content-wrap-background-color",
+        "defaultValue": "--cdr-color-background-primary",
+        "description": "Background color of the content wrap"
       }
     ]
   },
@@ -3066,84 +3146,156 @@
       }
     ]
   },
-  "CdrList": {
-    "name": "CdrList",
-    "description": "Groups related content items together either vertically or horizontally",
+  "CdrPagination": {
+    "name": "CdrPagination",
+    "description": "Allows people to navigate to the next or previous page within an experience",
     "tags": {},
     "exportName": "default",
-    "displayName": "CdrList",
+    "displayName": "CdrPagination",
     "props": [
       {
-        "name": "tag",
-        "description": "Sets list type and HTML element as \"unordered\" or \"ordered\"",
-        "tags": {},
-        "values": [
-          "ul",
-          "ol"
-        ],
+        "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": "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": "'ul'"
+          "value": "null"
         }
       },
       {
-        "name": "modifier",
-        "description": "Modifies the style variant for this component",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "true",
-              "title": "demoSelectMultiple"
-            }
-          ]
+        "name": "pages",
+        "description": "Array of objects containing pagination data.\nObjects must have structure of `{ page: number, url: string }`",
+        "type": {
+          "name": "paginationItem[]"
         },
+        "required": true
+      },
+      {
+        "name": "linkTag",
+        "description": "Sets which tag type is used to render pagination elements",
+        "tags": {},
         "values": [
-          "ordered",
-          "unordered",
-          "compact",
-          "inline"
+          "a",
+          "button"
         ],
         "type": {
           "name": "string"
         },
+        "defaultValue": {
+          "func": false,
+          "value": "'a'"
+        }
+      },
+      {
+        "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": "modelValue",
+        "tags": {
+          "ignore": [
+            {
+              "description": "used for binding v-model, represents the current page",
+              "title": "ignore"
+            }
+          ]
+        },
+        "type": {
+          "name": "number"
+        }
       }
     ],
-    "slots": [
+    "events": [
       {
-        "name": "default",
-        "description": "CdrList content (list-items)"
+        "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": "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/list/CdrList.vue"
+      "./src/components/pagination/CdrPagination.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-list-inline-text-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Color of the unordered inline list item prefix"
+        "name": "--cdr-pagination-link-text-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of a cdr-pagination link"
       },
       {
-        "name": "--cdr-list-ordered-nested-prefix-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Color of the nested ordered cdr-list item prefix"
+        "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-list-unordered-prefix-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Color of the unordered cdr-list item prefix"
+        "name": "--cdr-pagination-link-fill-color-disabled",
+        "defaultValue": "--cdr-color-text-disabled",
+        "description": "Fill color of a disabled cdr-pagination link"
       },
       {
-        "name": "--cdr-list-unordered-nested-prefix-color",
-        "defaultValue": "--cdr-color-text-secondary",
-        "description": "Color of the nested unordered cdr-list item prefix"
+        "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"
       }
     ]
   },
@@ -3267,158 +3419,6 @@
       "./src/components/popover/CdrPopover.vue"
     ]
   },
-  "CdrModal": {
-    "name": "CdrModal",
-    "description": "Disruptive, action-blocking overlays used to display important information",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrModal",
-    "props": [
-      {
-        "name": "opened",
-        "description": "Toggles the state of the modal",
-        "tags": {
-          "demoIgnore": [
-            {
-              "description": "true",
-              "title": "demoIgnore"
-            }
-          ]
-        },
-        "type": {
-          "name": "boolean"
-        },
-        "required": true
-      },
-      {
-        "name": "label",
-        "description": "Sets `aria-label` and modal title text. Can also use title slot to set title.",
-        "type": {
-          "name": "string"
-        },
-        "required": true
-      },
-      {
-        "name": "showTitle",
-        "description": "Toggles the modal title text, which comes from `label` prop or `title` slot.",
-        "type": {
-          "name": "boolean"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "ariaDescribedby",
-        "description": "Text for aria-describedby attribute. Applied to modal content element",
-        "type": {
-          "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "null"
-        }
-      },
-      {
-        "name": "role",
-        "description": "Sets the `role` attribute on the modal content element",
-        "tags": {},
-        "values": [
-          "dialog",
-          "alertDialog"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "'dialog'"
-        }
-      },
-      {
-        "name": "id",
-        "description": "Sets unique `id` for modal",
-        "type": {
-          "name": "string"
-        },
-        "required": false,
-        "defaultValue": {
-          "func": false,
-          "value": "null"
-        }
-      },
-      {
-        "name": "overlayClass",
-        "description": "Adds custom class to the `cdr-modal__overlay` div",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "wrapperClass",
-        "description": "Adds custom class to the `cdr-modal__outerWrap` div",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "contentClass",
-        "description": "Adds custom class to the `cdr-modal__innerWrap` div",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "animationDuration",
-        "description": "Sets duration for modal's close animation",
-        "type": {
-          "name": "number"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "300"
-        }
-      }
-    ],
-    "events": [
-      {
-        "name": "closed",
-        "description": "Fires when modal is closed"
-      }
-    ],
-    "slots": [
-      {
-        "name": "modal",
-        "description": "Use to override the entire CdrModal content container."
-      },
-      {
-        "name": "title",
-        "description": "Use to override the default title"
-      },
-      {
-        "name": "default"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/modal/CdrModal.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-modal-overlay-background-color",
-        "defaultValue": "--cdr-color-background-modal-overlay",
-        "description": "Background color of the modal overlay"
-      },
-      {
-        "name": "--cdr-modal-content-wrap-background-color",
-        "defaultValue": "--cdr-color-background-primary",
-        "description": "Background color of the content wrap"
-      }
-    ]
-  },
   "CdrPopup": {
     "name": "CdrPopup",
     "description": "An internal helper component used by Popover and Tooltip",
@@ -3457,124 +3457,36 @@
           "value": true
         }
       },
-      {
-        "name": "contentClass",
-        "type": {
-          "name": "string"
-        }
-      }
-    ],
-    "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": "--cdr-popup-content-border-color",
-        "defaultValue": "--cdr-color-border-secondary",
-        "description": "Border color of cdr-popup content"
-      }
-    ]
-  },
-  "CdrQuote": {
-    "name": "CdrQuote",
-    "description": "Short excerpt used to emphasize content or break up a large body of text",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrQuote",
-    "props": [
-      {
-        "name": "tag",
-        "description": "Sets the semantic HTML element for the quote.",
-        "tags": {},
-        "values": [
-          "blockquote",
-          "aside",
-          "q",
-          "div"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'blockquote'"
-        }
-      },
-      {
-        "name": "modifier",
-        "description": "Modifies the style variant for the quote",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "true",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "pull"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "''"
-        }
-      },
-      {
-        "name": "summary",
-        "description": "Sets the quote body text.",
-        "type": {
-          "name": "string"
-        }
-      },
-      {
-        "name": "citation",
-        "description": "Sets the quote attribution text.",
+      {
+        "name": "contentClass",
         "type": {
           "name": "string"
         }
       }
     ],
+    "events": [
+      {
+        "name": "closed"
+      }
+    ],
     "slots": [
       {
         "name": "default"
       }
     ],
     "sourceFiles": [
-      "./src/components/quote/CdrQuote.vue"
+      "./src/components/popup/CdrPopup.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-popup-content-background",
+        "defaultValue": "--cdr-color-background-primary",
+        "description": "Background color of cdr-popup content"
       },
       {
-        "name": "--cdr-quote-pull-container-border-color",
-        "defaultValue": "--cdr-color-border-primary",
-        "description": "Border color of a cdr-quote pull container"
+        "name": "--cdr-popup-content-border-color",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Border color of cdr-popup content"
       }
     ]
   },
@@ -3818,6 +3730,94 @@
       }
     ]
   },
+  "CdrQuote": {
+    "name": "CdrQuote",
+    "description": "Short excerpt used to emphasize content or break up a large body of text",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrQuote",
+    "props": [
+      {
+        "name": "tag",
+        "description": "Sets the semantic HTML element for the quote.",
+        "tags": {},
+        "values": [
+          "blockquote",
+          "aside",
+          "q",
+          "div"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'blockquote'"
+        }
+      },
+      {
+        "name": "modifier",
+        "description": "Modifies the style variant for the quote",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "true",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "pull"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "''"
+        }
+      },
+      {
+        "name": "summary",
+        "description": "Sets the quote body text.",
+        "type": {
+          "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"
+      }
+    ]
+  },
   "CdrRating": {
     "name": "CdrRating",
     "description": "Provides insight into user opinions for products, experiences, and more",
@@ -4241,6 +4241,57 @@
       }
     ]
   },
+  "CdrSkeleton": {
+    "name": "CdrSkeleton",
+    "description": "Visually communicates content is in the process of loading",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrSkeleton",
+    "props": [
+      {
+        "name": "motion",
+        "description": "Toggle animation on/off.\nWhen `true`, animated gradient will be used while loading.\nWhen `false` a static background color will be used.\nAutomatically disabled if `prefers-reduced-motion` is set by user.",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "default",
+        "description": "CdrSkeleton content (CdrSkeletonBone components)"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/skeleton/CdrSkeleton.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-skeleton-bone-background-color",
+        "defaultValue": "#edeae3",
+        "description": "Skeleton bone background color"
+      },
+      {
+        "name": "--cdr-skeleton-gradient-1",
+        "defaultValue": "rgba(237,234,227,1)",
+        "description": "Skeleton shimmer gradient part 1"
+      },
+      {
+        "name": "--cdr-skeleton-gradient-2",
+        "defaultValue": "rgba(249,248,240,1)",
+        "description": "Skeleton shimmer gradient part 2"
+      },
+      {
+        "name": "--cdr-skeleton-gradient-3",
+        "defaultValue": "rgba(237,234,227,1)",
+        "description": "Skeleton shimmer gradient part 3"
+      }
+    ]
+  },
   "CdrSkeletonBone": {
     "name": "CdrSkeletonBone",
     "exportName": "default",
@@ -4260,73 +4311,176 @@
           ]
         },
         "values": [
-          "default",
-          "heading",
-          "line",
-          "rectangle",
-          "square"
+          "default",
+          "heading",
+          "line",
+          "rectangle",
+          "square"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'default'"
+        }
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/skeleton/CdrSkeletonBone.vue"
+    ]
+  },
+  "CdrTable": {
+    "name": "CdrTable",
+    "description": "Organizes structured data for users to easily scan, compare, and analyze",
+    "tags": {},
+    "exportName": "default",
+    "displayName": "CdrTable",
+    "props": [
+      {
+        "name": "striped",
+        "description": "Sets row colors to alternate between darker and lighter backgrounds.\nStriping will not apply when `border` is true",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
+        }
+      },
+      {
+        "name": "border",
+        "description": "Adds borders between rows. Will disable `striped` if both are true",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      },
+      {
+        "name": "fullWidth",
+        "description": "Sets the width to 100%. Also accepts space separated strings for breakpoints that it should be full width: { '@xs' | '@sm' | '@md' | '@lg' }",
+        "type": {
+          "name": "boolean|string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      },
+      {
+        "name": "responsive",
+        "description": "Makes the table scroll horizontally when it would overflow its container",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": true
+        }
+      },
+      {
+        "name": "hover",
+        "description": "Adds a darker background on row hover",
+        "type": {
+          "name": "boolean"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": false
+        }
+      },
+      {
+        "name": "size",
+        "description": "Sets the table size (cell padding); values can target responsive breakpoints. Example `small@lg`.",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "small",
+          "medium",
+          "large"
         ],
         "type": {
           "name": "string"
         },
         "defaultValue": {
           "func": false,
-          "value": "'default'"
-        }
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/skeleton/CdrSkeletonBone.vue"
-    ]
-  },
-  "CdrSkeleton": {
-    "name": "CdrSkeleton",
-    "description": "Visually communicates content is in the process of loading",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrSkeleton",
-    "props": [
-      {
-        "name": "motion",
-        "description": "Toggle animation on/off.\nWhen `true`, animated gradient will be used while loading.\nWhen `false` a static background color will be used.\nAutomatically disabled if `prefers-reduced-motion` is set by user.",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
+          "value": "'medium'"
         }
       }
     ],
     "slots": [
       {
         "name": "default",
-        "description": "CdrSkeleton content (CdrSkeletonBone components)"
+        "description": "CdrTable content (Valid table elements <th>, <tbody>, <tr>, <td>, etc.)"
       }
     ],
     "sourceFiles": [
-      "./src/components/skeleton/CdrSkeleton.vue"
+      "./src/components/table/CdrTable.vue"
     ],
     "UIProperties": [
       {
-        "name": "--cdr-skeleton-bone-background-color",
-        "defaultValue": "#edeae3",
-        "description": "Skeleton bone background color"
+        "name": "--cdr-table-base-text-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Color of the cdr-table base text"
       },
       {
-        "name": "--cdr-skeleton-gradient-1",
-        "defaultValue": "rgba(237,234,227,1)",
-        "description": "Skeleton shimmer gradient part 1"
+        "name": "--cdr-table-row-background-color",
+        "defaultValue": "--cdr-color-background-table-row",
+        "description": "Background color of the table rows"
       },
       {
-        "name": "--cdr-skeleton-gradient-2",
-        "defaultValue": "rgba(249,248,240,1)",
-        "description": "Skeleton shimmer gradient part 2"
+        "name": "--cdr-table-header-background-color",
+        "defaultValue": "--cdr-color-background-table-header",
+        "description": "Background color of the table header"
       },
       {
-        "name": "--cdr-skeleton-gradient-3",
-        "defaultValue": "rgba(237,234,227,1)",
-        "description": "Skeleton shimmer gradient part 3"
+        "name": "--cdr-table-text-cell-color",
+        "defaultValue": "--cdr-color-text-primary",
+        "description": "Text color of the table cells"
+      },
+      {
+        "name": "--cdr-table-border-color-default",
+        "defaultValue": "--cdr-color-border-table-default",
+        "description": "Default border color of the table"
+      },
+      {
+        "name": "--cdr-table-head-border-default",
+        "defaultValue": "--cdr-color-border-table-head",
+        "description": "Head border color of the table"
+      },
+      {
+        "name": "--cdr-table-odd-row-background-color",
+        "defaultValue": "--cdr-color-background-table-row-alt",
+        "description": "Background color of all odd rows in the table"
+      },
+      {
+        "name": "--cdr-table-header-odd-row-background-color",
+        "defaultValue": "--cdr-color-background-table-row",
+        "description": "Background color of odd rows in the table header"
+      },
+      {
+        "name": "--cdr-table-striped-odd-row-background-color",
+        "defaultValue": "--cdr-color-background-table-row",
+        "description": "Background color of the odd rows in striped tables"
+      },
+      {
+        "name": "--cdr-table-body-footer-odd-row-background-color",
+        "defaultValue": "--cdr-color-background-table-row-alt",
+        "description": "Background color of odd rows in the table body and footer"
+      },
+      {
+        "name": "--cdr-table-cell-background-color-hover",
+        "defaultValue": "--cdr-color-background-table-header",
+        "description": "Background color of table cells on hover"
       }
     ]
   },
@@ -4495,218 +4649,64 @@
         "description": "Fill of the cdr-switch x and check icons when it is checked"
       },
       {
-        "name": "--cdr-switch-box-shadow-color-checked-focus",
-        "defaultValue": "--cdr-color-border-secondary",
-        "description": "Box-shadow of the cdr-switch button when it is checked and in focus"
-      },
-      {
-        "name": "--cdr-switch-background-color-checked-focus",
-        "defaultValue": "--cdr-color-background-switch-selected-default-focus",
-        "description": "Background color of the cdr-switch button when it is checked and in focus"
-      },
-      {
-        "name": "--cdr-switch-handle-border-color-checked-focus",
-        "defaultValue": "--cdr-color-border-switch-handle-default-focus",
-        "description": "Border of the cdr-switch handle when it is checked and in focus"
-      },
-      {
-        "name": "--cdr-switch-handle-background-color-checked-focus",
-        "defaultValue": "--cdr-color-background-switch-handle-selected-default-focus",
-        "description": "Background color of the cdr-switch handle when it is checked and in focus"
-      },
-      {
-        "name": "--cdr-switch-icon-fill-checked-focus",
-        "defaultValue": "--cdr-color-icon-switch-selected-default-focus",
-        "description": "Fill of the cdr-switch x and check icons when it is checked and in focus"
-      },
-      {
-        "name": "--cdr-switch-handle-background-color-checked",
-        "defaultValue": "--cdr-color-background-switch-handle-selected-default-rest",
-        "description": "Background color of the cdr-switch handle when it is checked"
-      },
-      {
-        "name": "--cdr-switch-border-color-checked-hover",
-        "defaultValue": "--cdr-color-border-secondary",
-        "description": "Border of the cdr-switch button when it is checked and on hover but not in focus"
-      },
-      {
-        "name": "--cdr-switch-background-color-checked-hover",
-        "defaultValue": "--cdr-color-background-switch-selected-default-hover",
-        "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"
-      }
-    ]
-  },
-  "CdrTable": {
-    "name": "CdrTable",
-    "description": "Organizes structured data for users to easily scan, compare, and analyze",
-    "tags": {},
-    "exportName": "default",
-    "displayName": "CdrTable",
-    "props": [
-      {
-        "name": "striped",
-        "description": "Sets row colors to alternate between darker and lighter backgrounds.\nStriping will not apply when `border` is true",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "border",
-        "description": "Adds borders between rows. Will disable `striped` if both are true",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "fullWidth",
-        "description": "Sets the width to 100%. Also accepts space separated strings for breakpoints that it should be full width: { '@xs' | '@sm' | '@md' | '@lg' }",
-        "type": {
-          "name": "boolean|string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "responsive",
-        "description": "Makes the table scroll horizontally when it would overflow its container",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": true
-        }
-      },
-      {
-        "name": "hover",
-        "description": "Adds a darker background on row hover",
-        "type": {
-          "name": "boolean"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": false
-        }
-      },
-      {
-        "name": "size",
-        "description": "Sets the table size (cell padding); values can target responsive breakpoints. Example `small@lg`.",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "small",
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium'"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "default",
-        "description": "CdrTable content (Valid table elements <th>, <tbody>, <tr>, <td>, etc.)"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/table/CdrTable.vue"
-    ],
-    "UIProperties": [
+        "name": "--cdr-switch-box-shadow-color-checked-focus",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Box-shadow of the cdr-switch button when it is checked and in focus"
+      },
       {
-        "name": "--cdr-table-base-text-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Color of the cdr-table base text"
+        "name": "--cdr-switch-background-color-checked-focus",
+        "defaultValue": "--cdr-color-background-switch-selected-default-focus",
+        "description": "Background color of the cdr-switch button when it is checked and in focus"
       },
       {
-        "name": "--cdr-table-row-background-color",
-        "defaultValue": "--cdr-color-background-table-row",
-        "description": "Background color of the table rows"
+        "name": "--cdr-switch-handle-border-color-checked-focus",
+        "defaultValue": "--cdr-color-border-switch-handle-default-focus",
+        "description": "Border of the cdr-switch handle when it is checked and in focus"
       },
       {
-        "name": "--cdr-table-header-background-color",
-        "defaultValue": "--cdr-color-background-table-header",
-        "description": "Background color of the table header"
+        "name": "--cdr-switch-handle-background-color-checked-focus",
+        "defaultValue": "--cdr-color-background-switch-handle-selected-default-focus",
+        "description": "Background color of the cdr-switch handle when it is checked and in focus"
       },
       {
-        "name": "--cdr-table-text-cell-color",
-        "defaultValue": "--cdr-color-text-primary",
-        "description": "Text color of the table cells"
+        "name": "--cdr-switch-icon-fill-checked-focus",
+        "defaultValue": "--cdr-color-icon-switch-selected-default-focus",
+        "description": "Fill of the cdr-switch x and check icons when it is checked and in focus"
       },
       {
-        "name": "--cdr-table-border-color-default",
-        "defaultValue": "--cdr-color-border-table-default",
-        "description": "Default border color of the table"
+        "name": "--cdr-switch-handle-background-color-checked",
+        "defaultValue": "--cdr-color-background-switch-handle-selected-default-rest",
+        "description": "Background color of the cdr-switch handle when it is checked"
       },
       {
-        "name": "--cdr-table-head-border-default",
-        "defaultValue": "--cdr-color-border-table-head",
-        "description": "Head border color of the table"
+        "name": "--cdr-switch-border-color-checked-hover",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Border of the cdr-switch button when it is checked and on hover but not in focus"
       },
       {
-        "name": "--cdr-table-odd-row-background-color",
-        "defaultValue": "--cdr-color-background-table-row-alt",
-        "description": "Background color of all odd rows in the table"
+        "name": "--cdr-switch-background-color-checked-hover",
+        "defaultValue": "--cdr-color-background-switch-selected-default-hover",
+        "description": "Background color of the cdr-switch button when it is checked and on hover but not in focus"
       },
       {
-        "name": "--cdr-table-header-odd-row-background-color",
-        "defaultValue": "--cdr-color-background-table-row",
-        "description": "Background color of odd rows in the table header"
+        "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-table-striped-odd-row-background-color",
-        "defaultValue": "--cdr-color-background-table-row",
-        "description": "Background color of the odd rows in striped tables"
+        "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-table-body-footer-odd-row-background-color",
-        "defaultValue": "--cdr-color-background-table-row-alt",
-        "description": "Background color of odd rows in the table body and footer"
+        "name": "--cdr-switch-handle-border",
+        "defaultValue": "--cdr-color-border-secondary",
+        "description": "Border color of the cdr-switch handle"
       },
       {
-        "name": "--cdr-table-cell-background-color-hover",
-        "defaultValue": "--cdr-color-background-table-header",
-        "description": "Background color of table cells on hover"
+        "name": "--cdr-switch-handle-background-color-rest",
+        "defaultValue": "--cdr-color-background-switch-handle-default-rest",
+        "description": "Background color of the cdr-switch handle"
       }
     ]
   },
@@ -5229,99 +5229,6 @@
       }
     ]
   },
-  "CdrToggleGroup": {
-    "name": "CdrToggleGroup",
-    "exportName": "default",
-    "displayName": "CdrToggleGroup",
-    "description": "",
-    "tags": {},
-    "props": [
-      {
-        "name": "modelValue",
-        "tags": {
-          "ignore": [
-            {
-              "description": true,
-              "title": "ignore"
-            }
-          ]
-        },
-        "type": {
-          "name": "string|number|boolean|object|array"
-        },
-        "required": true
-      },
-      {
-        "name": "size",
-        "description": "Sets toggle button size",
-        "tags": {
-          "demoSelectMultiple": [
-            {
-              "description": "false",
-              "title": "demoSelectMultiple"
-            }
-          ]
-        },
-        "values": [
-          "medium",
-          "large"
-        ],
-        "type": {
-          "name": "string"
-        },
-        "defaultValue": {
-          "func": false,
-          "value": "'medium'"
-        }
-      }
-    ],
-    "events": [
-      {
-        "name": "update:modelValue",
-        "description": "Event emitted by v-model",
-        "properties": [
-          {
-            "type": {
-              "names": [
-                "mixed"
-              ]
-            },
-            "name": "modelValue"
-          }
-        ],
-        "tags": [
-          {
-            "title": "param",
-            "type": {
-              "name": "mixed"
-            },
-            "name": "modelValue"
-          }
-        ]
-      }
-    ],
-    "slots": [
-      {
-        "name": "default",
-        "description": "CdrToggleGroup content (CdrToggleButton components)"
-      }
-    ],
-    "sourceFiles": [
-      "./src/components/toggleButton/CdrToggleGroup.vue"
-    ],
-    "UIProperties": [
-      {
-        "name": "--cdr-toggle-group-border-color",
-        "defaultValue": "--cdr-color-border-primary",
-        "description": "Border color of the cdr-toggle-group"
-      },
-      {
-        "name": "--cdr-toggle-group-background-color-default-rest",
-        "defaultValue": "--cdr-color-background-toggle-group-default-rest",
-        "description": "Default background color of the cdr-toggle-group"
-      }
-    ]
-  },
   "CdrTooltip": {
     "name": "CdrTooltip",
     "description": "Floating label used to clarify interface actions",
@@ -5452,5 +5359,98 @@
         "description": "Background color of the cdr-popup arrow"
       }
     ]
+  },
+  "CdrToggleGroup": {
+    "name": "CdrToggleGroup",
+    "exportName": "default",
+    "displayName": "CdrToggleGroup",
+    "description": "",
+    "tags": {},
+    "props": [
+      {
+        "name": "modelValue",
+        "tags": {
+          "ignore": [
+            {
+              "description": true,
+              "title": "ignore"
+            }
+          ]
+        },
+        "type": {
+          "name": "string|number|boolean|object|array"
+        },
+        "required": true
+      },
+      {
+        "name": "size",
+        "description": "Sets toggle button size",
+        "tags": {
+          "demoSelectMultiple": [
+            {
+              "description": "false",
+              "title": "demoSelectMultiple"
+            }
+          ]
+        },
+        "values": [
+          "medium",
+          "large"
+        ],
+        "type": {
+          "name": "string"
+        },
+        "defaultValue": {
+          "func": false,
+          "value": "'medium'"
+        }
+      }
+    ],
+    "events": [
+      {
+        "name": "update:modelValue",
+        "description": "Event emitted by v-model",
+        "properties": [
+          {
+            "type": {
+              "names": [
+                "mixed"
+              ]
+            },
+            "name": "modelValue"
+          }
+        ],
+        "tags": [
+          {
+            "title": "param",
+            "type": {
+              "name": "mixed"
+            },
+            "name": "modelValue"
+          }
+        ]
+      }
+    ],
+    "slots": [
+      {
+        "name": "default",
+        "description": "CdrToggleGroup content (CdrToggleButton components)"
+      }
+    ],
+    "sourceFiles": [
+      "./src/components/toggleButton/CdrToggleGroup.vue"
+    ],
+    "UIProperties": [
+      {
+        "name": "--cdr-toggle-group-border-color",
+        "defaultValue": "--cdr-color-border-primary",
+        "description": "Border color of the cdr-toggle-group"
+      },
+      {
+        "name": "--cdr-toggle-group-background-color-default-rest",
+        "defaultValue": "--cdr-color-background-toggle-group-default-rest",
+        "description": "Default background color of the cdr-toggle-group"
+      }
+    ]
   }
 }