Merge branch 'staging/charmander' into fix/cta/add-focus-style

.changeset/curly-ways-march.md

@@ -0,0 +1,4 @@
+---
+"@rhds/elements": patch
+---
+React: add generated react wrappers to NPM package

.changeset/eager-dolls-wear.md

@@ -0,0 +1,4 @@
+---
+"@rhds/elements": patch
+---
+`<rh-site-status>`: automatically fetch status for the current domain

.changeset/nice-kangaroos-kiss.md

@@ -0,0 +1,5 @@
+---
+"@rhds/elements": minor
+---
+
+`<rh-pagination>`: Added dark color palette

.changeset/rh-cta-lightdom-shim.md

@@ -0,0 +1,5 @@
+---
+"@rhds/elements": minor
+---
+
+`<rh-cta>`: Added `rh-cta-lightdom-shim.css` as an optional file to help reduce layout shift before element is defined, where declarative shadow DOM is not an option.

.changeset/shy-houses-arrive.md

@@ -0,0 +1,4 @@
+---
+"@rhds/elements": patch
+---
+`<rh-card>`: applied heading font to card headings

.changeset/wet-feet-pull.md

@@ -0,0 +1,4 @@
+---
+"@rhds/elements": patch
+---
+`<rh-card>`: removes landmark semantics from card, simplifying page navigation for screen reader users

.github/workflows/validate-pr.yml

@@ -0,0 +1,25 @@
+name: Validate PRs
+
+on:
+  pull_request:
+    types:
+      - opened
+      - reopened
+      - synchronize
+      - edited
+
+jobs:
+  validate:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+      - run: npm i semantic-release @changesets/read --prefer-offline
+      - uses: actions/github-script@v7
+        with:
+          script: |
+            const { validate } = await import('${{ github.workspace }}/scripts/validate-prs.js');
+            await validate({ context });

docs/_includes/layout-base.njk

@@ -26,6 +26,7 @@
   <link rel="stylesheet" href="{{ '/assets/prism.css' | url }}" >
   <link rel="stylesheet" href="{{ '/assets/rhds.min.css' | url }}">
   <link rel="stylesheet" href="{{ '/assets/packages/@rhds/elements/elements/rh-footer/rh-footer-lightdom.css' | url }}">
+  <link rel="stylesheet" href="{{ '/assets/packages/@rhds/elements/elements/rh-cta/rh-cta-lightdom-shim.css' | url }}">
   <link rel="stylesheet" href="{{ '/assets/packages/@rhds/elements/elements/rh-subnav/rh-subnav-lightdom.css' | url }}">
 
   {% sassFile false %}

docs/_plugins/rhds.cjs

@@ -5,7 +5,6 @@ const path = require('node:path');
 const _slugify = require('slugify');
 const slugify = typeof _slugify === 'function' ? _slugify : _slugify.default;
 const capitalize = require('capitalize');
-const { glob } = require('glob');
 const exec = require('node:util').promisify(require('node:child_process').exec);
 const cheerio = require('cheerio');
 const RHDSAlphabetizeTagsPlugin = require('./alphabetize-tags.cjs');
@@ -283,6 +282,7 @@ module.exports = function(eleventyConfig, { tagsToAlphabetize }) {
     }
 
     try {
+      const { glob } = await import('glob');
       /** @type {(import('@patternfly/pfe-tools/11ty/DocsPage').DocsPage & { repoStatus?: any[] })[]} */
       const elements = await eleventyConfig.globalData?.elements();
       const filePaths = (await glob(`elements/*/docs/*.md`, { cwd: process.cwd() }))

docs/_plugins/shortcodes/repoStatus.cjs

@@ -250,10 +250,13 @@ function repoStatusTable() {
     return /* html */`
 <tr>
 <td data-label="Name">
-  <a href="/elements/${listItem.name}">${listItem.name}</a>
-  ${listItem.overallStatus !== 'Available' ? `<rh-tag color="${STATUS_LEGEND[listItem.overallStatus].color}" variant="${STATUS_LEGEND[listItem.overallStatus].variant}">
-    ${listItem.overallStatus}${STATUS_LEGEND[listItem.overallStatus].icon}
-  </rh-tag>` : ''}
+  <span>
+    <a href="/elements/${listItem.name}">${listItem.name}</a>
+    ${listItem.overallStatus !== 'Available' ?
+      `<rh-tag color="${STATUS_LEGEND[listItem.overallStatus].color}" variant="${STATUS_LEGEND[listItem.overallStatus].variant}">
+        ${listItem.overallStatus}${STATUS_LEGEND[listItem.overallStatus].icon}
+      </rh-tag>` : ''}
+  </span>
 </td>
 ${listItem.libraries.map(lib => {
     return /* html */`

docs/get-started/designers.md

@@ -40,6 +40,10 @@ Our design system libraries and the documentation website offer assets and guida
         <h3>Elements and patterns</h3>
         <p>Our libraries include <a href="/elements">elements</a> and <a href="/patterns">patterns</a> you can use to create digital experiences.</p>
     </div>
+    <div>
+        <h3>Accessibility</h3>
+        <p><a href="/accessibility/design/">Designer-specific guidelines</a> equip you with the information to create inclusive digital experiences.</p>
+    </div>
 </div>
 
 ## Access Figma

docs/get-started/developers/index.md

@@ -32,7 +32,7 @@ Our design system libraries and the documentation website offer assets and guida
     </div>
     <div>
         <h3>Documentation</h3>
-        <p>This website offers guidance about how to use our <a href="elements">elements</a> and <a href="patterns">patterns</a> correctly.</p>
+        <p>This website offers guidance about how to use our <a href="elements">elements</a> and <a href="patterns">patterns</a>. Learn how to apply them accessibily with <a href="/accessibility/development/">developer-specific guidelines</a>.</p>
     </div>
     <div>
         <h3>GitHub repositories</h3>