Automate component version badges (#2656)

Author: alex-ju

website/docs/components/accordion/index.md

@@ -1,15 +1,31 @@
 ---
 title: Accordion
-description: An accordion is a vertically stacked list of container-like toggles that reveal or hide associated sections of content.
+description: >-
+  An accordion is a vertically stacked list of container-like toggles that
+  reveal or hide associated sections of content.
 caption: A list of toggles that reveal or hide associated content.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67221-87751&t=gWdKy44MzTP4cTRo-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/accordion
-related: ['components/reveal','components/flyout','components/modal','components/tabs']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67221-87751&t=gWdKy44MzTP4cTRo-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/accordion
+related:
+  - components/reveal
+  - components/flyout
+  - components/modal
+  - components/tabs
 previewImage: assets/illustrations/components/accordion.jpg
 navigation:
   hidden: false
-  keywords: ['toggle', 'disclosure', 'details', 'reveal', 'list', 'summary', 'expand', 'collapse']
+  keywords:
+    - toggle
+    - disclosure
+    - details
+    - reveal
+    - list
+    - summary
+    - expand
+    - collapse
 ---
 
 <section data-tab="Guidelines">

website/docs/components/alert/index.md

@@ -3,12 +3,23 @@ title: Alert
 description: Displays a brief message without interrupting a user’s task.
 caption: Displays a brief message without interrupting a user’s task.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67382-70353&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/alert
-related: ['components/modal', 'components/toast']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67382-70353&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/alert
+related:
+  - components/modal
+  - components/toast
 previewImage: assets/illustrations/components/alert.jpg
 navigation:
-  keywords: ['alert', 'toast', 'notification', 'banner', 'message']
+  keywords:
+    - alert
+    - toast
+    - notification
+    - banner
+    - message
+status:
+  updated: 4.15.0
 ---
 
 <section data-tab="Guidelines">

website/docs/components/app-footer/index.md

@@ -1,14 +1,28 @@
 ---
 title: App Footer
-description: A footer that appears on every screen to display supplementary information and links.
+description: >-
+  A footer that appears on every screen to display supplementary information and
+  links.
 caption: Displays supplementary information and links for the application.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67351-171799&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-footer
-related: ['layouts/app-frame', 'components/side-nav']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67351-171799&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-footer
+related:
+  - layouts/app-frame
+  - components/side-nav
 previewImage: assets/illustrations/components/app-footer.jpg
 navigation:
-  keywords: ['footer', 'copyright', 'support', 'terms', 'privacy', 'security', 'accessibility', 'system status']
+  keywords:
+    - footer
+    - copyright
+    - support
+    - terms
+    - privacy
+    - security
+    - accessibility
+    - system status
 ---
 
 <section data-tab="Guidelines">
@@ -28,4 +42,4 @@ navigation:
 
 <section data-tab="Accessibility">
   @include "partials/accessibility/accessibility.md"
-</section>
+</section>

website/docs/components/app-header/index.md

@@ -1,15 +1,27 @@
 ---
 title: App Header
-description: A header navigation that provides access to global elements and application utilities.
+description: >-
+  A header navigation that provides access to global elements and application
+  utilities.
 caption: Used as a global and utility navigation within an application.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67337-16625&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-header
-related: ['components/side-nav', 'components/app-footer', 'layouts/app-frame']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67337-16625&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-header
+related:
+  - components/side-nav
+  - components/app-footer
+  - layouts/app-frame
 previewImage: assets/illustrations/components/app-header.jpg
 navigation:
   hidden: true
-  keywords: ['navigation', 'header', 'navbar', 'menubar', 'topbar']
+  keywords:
+    - navigation
+    - header
+    - navbar
+    - menubar
+    - topbar
 ---
 
 <section data-tab="Guidelines">

website/docs/components/app-side-nav/index.md

@@ -1,15 +1,27 @@
 ---
 title: App Side Nav
 description: Used as a contextual navigation for subpages within an application.
-caption: A side navigation menu that provides access to subpages within a product or application.
+caption: >-
+  A side navigation menu that provides access to subpages within a product or
+  application.
 links:
-  figma: 
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-side-nav
-related: ['components/side-nav', 'components/breadcrumb','components/tabs','layouts/app-frame','components/app-header']
+  figma: null
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/app-side-nav
+related:
+  - components/side-nav
+  - components/breadcrumb
+  - components/tabs
+  - layouts/app-frame
+  - components/app-header
 previewImage: assets/illustrations/components/app-side-nav.jpg
 navigation:
   hidden: true
-  keywords: ['navigation', 'side navigation', 'sidenav', 'sidebar']
+  keywords:
+    - navigation
+    - side navigation
+    - sidenav
+    - sidebar
 ---
 
 <section data-tab="Guidelines">

website/docs/components/application-state/index.md

@@ -3,11 +3,16 @@ title: Application State
 description: An informational element that displays the current state of the application.
 caption: An informational element that displays the current state of the application.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67278-131631&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/application-state
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67278-131631&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/application-state
 previewImage: assets/illustrations/components/application-state.jpg
 navigation:
-  keywords: ['empty state', 'error state', 'message']
+  keywords:
+    - empty state
+    - error state
+    - message
 ---
 
 <section data-tab="Guidelines">

website/docs/components/badge-count/index.md

@@ -1,14 +1,24 @@
 ---
 title: Badge Count
-description: A numeric label used to display things like version number or collection enumerations.
+description: >-
+  A numeric label used to display things like version number or collection
+  enumerations.
 caption: A non-interactive numeric label.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67246-60779&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/badge-count
-related: ['components/badge', 'components/tag']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67246-60779&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/badge-count
+related:
+  - components/badge
+  - components/tag
 previewImage: assets/illustrations/components/badge-count.jpg
 navigation:
-  keywords: ['chip', 'pill', 'version number', 'counter']
+  keywords:
+    - chip
+    - pill
+    - version number
+    - counter
 ---
 
 <section data-tab="Guidelines">

website/docs/components/badge/index.md

@@ -1,14 +1,22 @@
 ---
 title: Badge
-description: Concise, non-interactive labels that represent metadata.
-caption: Concise, non-interactive labels that represent metadata.
+description: 'Concise, non-interactive labels that represent metadata.'
+caption: 'Concise, non-interactive labels that represent metadata.'
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67237-59854&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/badge
-related: ['components/badge-count','components/tag']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67237-59854&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/badge
+related:
+  - components/badge-count
+  - components/tag
 previewImage: assets/illustrations/components/badge.jpg
 navigation:
-  keywords: ['chip', 'pill', 'tag', 'label']
+  keywords:
+    - chip
+    - pill
+    - tag
+    - label
 ---
 
 <section data-tab="Guidelines">

website/docs/components/breadcrumb/index.md

@@ -1,14 +1,23 @@
 ---
 title: Breadcrumb
-description: A Breadcrumb is a type of secondary navigation that reveals the user’s location in an application.
+description: >-
+  A Breadcrumb is a type of secondary navigation that reveals the user’s
+  location in an application.
 caption: A secondary navigation that shows the user’s current location.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67385-83191&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/breadcrumb
-related: ['components/side-nav', 'components/tabs']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67385-83191&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/breadcrumb
+related:
+  - components/side-nav
+  - components/tabs
 previewImage: assets/illustrations/components/breadcrumb.jpg
 navigation:
-  keywords: ['navigation', 'crumb', 'path']
+  keywords:
+    - navigation
+    - crumb
+    - path
 ---
 
 <section data-tab="Guidelines">

website/docs/components/button-set/index.md

@@ -3,11 +3,20 @@ title: Button Set
 description: Provides consistent layout and spacing for a set of buttons.
 caption: A set of buttons.
 links:
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/button-set
-related: ['components/button','patterns/button-organization','components/segmented-group']
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/button-set
+related:
+  - components/button
+  - patterns/button-organization
+  - components/segmented-group
 previewImage: assets/illustrations/components/button-set.jpg
 navigation:
-  keywords: ['button group', 'button', 'button spacing', 'button alignment', 'button layout']
+  keywords:
+    - button group
+    - button
+    - button spacing
+    - button alignment
+    - button layout
 ---
 
 <section data-tab="Guidelines">

website/docs/components/button/index.md

@@ -1,14 +1,24 @@
 ---
 title: Button
-description: An interactive element that initiates an action or event, such as a form submission.
+description: >-
+  An interactive element that initiates an action or event, such as a form
+  submission.
 caption: An interactive element that initiates an action.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67397-95918&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/button
-related: ['components/button-set','patterns/button-organization','components/link/inline','components/link/standalone']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67397-95918&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/button
+related:
+  - components/button-set
+  - patterns/button-organization
+  - components/link/inline
+  - components/link/standalone
 previewImage: assets/illustrations/components/button.jpg
 navigation:
-  keywords: ['action', 'link']
+  keywords:
+    - action
+    - link
 ---
 
 <section data-tab="Guidelines">

website/docs/components/card/index.md

@@ -1,13 +1,18 @@
 ---
 title: Card
-description: A block container that provides styling for elevation, border, and background.
-caption: A block container that provides styling for elevation, border, and background.
+description: 'A block container that provides styling for elevation, border, and background.'
+caption: 'A block container that provides styling for elevation, border, and background.'
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67251-87362&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/card
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67251-87362&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/card
 previewImage: assets/illustrations/components/card.jpg
 navigation:
-  keywords: ['tile', 'container', 'box']
+  keywords:
+    - tile
+    - container
+    - box
 ---
 
 <section data-tab="Guidelines">

website/docs/components/code-block/index.md

@@ -1,16 +1,29 @@
 ---
 title: Code Block
-description: A container for displaying formatted chunks of code with syntax highlighting and related features.
+description: >-
+  A container for displaying formatted chunks of code with syntax highlighting
+  and related features.
 caption: A container for formatting chunks of code with syntax highlighting.
 links:
-  figma: https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67166-37020&t=w8xQlWxzH7bwXLe2-1
-  github: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/code-block
-related: ['components/copy/snippet', 'components/copy/button']
+  figma: >-
+    https://www.figma.com/design/iweq3r2Pi8xiJfD9e6lOhF/HDS-Components-v2.0?node-id=67166-37020&t=w8xQlWxzH7bwXLe2-1
+  github: >-
+    https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/code-block
+related:
+  - components/copy/snippet
+  - components/copy/button
 previewImage: assets/illustrations/components/code-block.jpg
 navigation:
-  keywords: ['code', 'snippet', 'copy', 'text', 'editor', 'language', 'example', 'syntax', 'highlight']
-status:
-  updated: 4.13.0
+  keywords:
+    - code
+    - snippet
+    - copy
+    - text
+    - editor
+    - language
+    - example
+    - syntax
+    - highlight
 ---
 
 <section data-tab="Guidelines">