fix(tools)!: remove cem/a config

.changeset/green-aliens-begin.md

@@ -0,0 +1,6 @@
+---
+"@patternfly/pfe-core": patch
+---
+
+`InternalsController`: add `ariaRelevant` property
+

.changeset/solid-rice-arrive.md

@@ -0,0 +1,5 @@
+---
+"@patternfly/pfe-tools": major
+---
+
+Removes the (previously deprecated) `@custom-elements-manifest/analyzer` config. Instead, use [`@pwrs/cem`](https://bennypowers.dev/cem). See PR [#2912](https://github.com/patternfly/patternfly-elements/pull/2912/files) for an example of how to migrate an npm monorepo.

.github/workflows/bundle.yml

@@ -25,7 +25,7 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
           cache: npm
 
       - name: Bundle

.github/workflows/commitlint.yml

@@ -31,7 +31,7 @@ jobs:
           fetch-depth: 0
       - uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version-file: '.nvmrc'
           cache: npm
       - run: npm ci --prefer-offline
       - run: npm i @commitlint/load

.github/workflows/preview.yml

@@ -13,7 +13,7 @@ jobs:
         uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
           cache: npm
 
       - name: Verify JSPM URL
@@ -23,11 +23,10 @@ jobs:
         run: curl https://cachefly.cachefly.net/CacheFlyDebug
 
       # Set up GitHub Actions caching for Wireit.
-      - uses: google/wireit@setup-github-actions-caching/v2  
+      - uses: google/wireit@setup-github-actions-caching/v2
 
       - run: npm ci --prefer-offline
       - run: npm run docs
-      - run: cat _site/components/icon/demo/custom-icon-sets/index.html
 
       - name: Publish to Netlify
         env:

.github/workflows/release.yml

@@ -14,9 +14,8 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
           cache: npm
-
       # Set up GitHub Actions caching for Wireit.
       - uses: google/wireit@setup-github-actions-caching/v2
 

.github/workflows/tests.yml

@@ -98,7 +98,7 @@ jobs:
     name: SSR Tests (Playwright)
     runs-on: ubuntu-latest
     container:
-      image: mcr.microsoft.com/playwright:v1.46.1-jammy
+      image: mcr.microsoft.com/playwright:v1.54.1-noble
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
@@ -161,8 +161,8 @@ jobs:
     strategy:
       matrix:
         node:
-          - '20'
-          - '21'
+          - '22'
+          - '24'
     if: |
       github.event_name == 'workflow_dispatch'
       ||   github.event_name == 'push'
@@ -284,7 +284,7 @@ jobs:
           cache: npm
 
       - name: Install dependencies
-        run: npm ci --prefer-offline
+        run: npm ci --prefer-offline --include=optional --verbose
 
       - name: Build
         id: build

.github/workflows/visual-regression.yml

@@ -29,14 +29,14 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
           cache: npm
 
       # Set up GitHub Actions caching for Wireit.
       - uses: google/wireit@setup-github-actions-caching/v2
 
       - run: npm ci --prefer-offline
-
+      - run: npx playwright install
       - name: Visual Regression Tests
         run: npx playwright test
         env:

.nvmrc

@@ -1 +1 @@
-v22.13.0
+v22.16.0

README.md

@@ -71,12 +71,6 @@ npm run test:watch -- --files 'elements/pf-{select,card}/test/*.spec.ts'
 # Run all tests excluding react and vue tests.
 npm run test:watch
 
-# Run all tests using a React wrapper in watch mode.
-npm run test:react
-
-# Run all tests using a Vue wrapper in watch mode.
-npm run test:vue
-
 # Run all tests with and without React and Vue wrappers.
 # This is run on pull request within CI.
 npm run test:ci

core/pfe-core/.config/cem.yaml

@@ -0,0 +1,9 @@
+sourceControlRootUrl: https://github.com/patternfly/patternfly-elements/tree/main/
+generate:
+  files:
+    - ./*/*.ts
+  exclude:
+    - './**/*.test.ts'
+    - './**/*.spec.ts'
+    - './**/*.e2e.ts'
+  output: custom-elements.json

core/pfe-core/controllers/internals-controller.ts

@@ -134,6 +134,7 @@ export class InternalsController implements ReactiveController, ARIAMixin {
   @aria ariaPosInSet: string | null = null;
   @aria ariaPressed: string | null = null;
   @aria ariaReadOnly: string | null = null;
+  @aria ariaRelevant: string | null = null;
   @aria ariaRequired: string | null = null;
   @aria ariaRoleDescription: string | null = null;
   @aria ariaRowCount: string | null = null;

core/pfe-core/package.json

@@ -61,13 +61,13 @@
   },
   "scripts": {
     "clean": "git clean -fX -e node_modules -e tsconfig.tsbuildinfo",
-    "analyze": "cem analyze",
+    "analyze": "cem generate",
     "test": "wtr --files './test/*.spec.ts' --config ../../web-test-runner.config.js"
   },
   "dependencies": {
     "@floating-ui/dom": "^1.6.10",
-    "@lit/context": "^1.1.3",
-    "lit": "^3.2.1"
+    "@lit/context": "^1.1.5",
+    "lit": "^3.3.0"
   },
   "repository": {
     "type": "git",
@@ -84,7 +84,6 @@
     "**/*.d.ts",
     "**/*.js",
     "**/*.js.map",
-    "!custom-elements-manifest.config.js",
     "custom-elements.json",
     "!demo/*",
     "!docs/*",

docs/docs/develop/javascript.md

@@ -84,7 +84,7 @@ export class PfCoolElement extends LitElement {
 Notice the block comment above the property declaration. This is called a JSDoc docblock,
 and it's contents will eventually end up in the custom elements manifest for this package.
 It's important to add a helpful description of every public property and method on your element's class.
-Learn more about [how to document components](https://custom-elements-manifest.open-wc.org/analyzer/getting-started/#documenting-your-components).
+Learn more about [how to document components](https://bennypowers.github.io/cem/).
 
 Now that we have declared the `follow` property, we can toggle it in our private `onClick` handler.
 

elements/.config/cem.yaml

@@ -0,0 +1,14 @@
+sourceControlRootUrl: https://github.com/patternfly/patternfly-elements/tree/main/
+generate:
+  files:
+    - ./*/*.ts
+  exclude:
+    - './**/*.test.ts'
+    - './**/*.spec.ts'
+    - './**/*.e2e.ts'
+  output: custom-elements.json
+  noDefaultExcludes: false
+  demoDiscovery:
+    fileGlob: ./*/demo/*.html
+    urlPattern: (?P<tag>[\\w-]+)/demo/(?P<demo>[\\w-]+).html
+    urlTemplate: https://patternflyelements.org/components/{tag}/{demo}/

elements/package.json

@@ -26,10 +26,11 @@
     "./pf-chip/pf-chip-group.js": "./pf-chip/pf-chip-group.js",
     "./pf-clipboard-copy/pf-clipboard-copy.js": "./pf-clipboard-copy/pf-clipboard-copy.js",
     "./pf-code-block/pf-code-block.js": "./pf-code-block/pf-code-block.js",
+    "./pf-dropdown/context.js": "./pf-dropdown/context.js",
+    "./pf-dropdown/pf-dropdown-group.js": "./pf-dropdown/pf-dropdown-group.js",
+    "./pf-dropdown/pf-dropdown-item.js": "./pf-dropdown/pf-dropdown-item.js",
+    "./pf-dropdown/pf-dropdown-menu.js": "./pf-dropdown/pf-dropdown-menu.js",
     "./pf-dropdown/pf-dropdown.js": "./pf-dropdown/pf-dropdown.js",
-    "./pf-dropdown/pf-dropdown-group.js": "./pf-dropdown/pf-dropdown-group.ts",
-    "./pf-dropdown/pf-dropdown-menu.js": "./pf-dropdown/pf-dropdown-menu.ts",
-    "./pf-dropdown/pf-dropdown-item.js": "./pf-dropdown/pf-dropdown-item.ts",
     "./pf-icon/pf-icon.js": "./pf-icon/pf-icon.js",
     "./pf-jazz-hands/pf-jazz-hands.js": "./pf-jazz-hands/pf-jazz-hands.js",
     "./pf-jump-links/pf-jump-links-item.js": "./pf-jump-links/pf-jump-links-item.js",
@@ -47,13 +48,15 @@
     "./pf-progress/pf-progress.js": "./pf-progress/pf-progress.js",
     "./pf-spinner/pf-spinner.js": "./pf-spinner/pf-spinner.js",
     "./pf-switch/pf-switch.js": "./pf-switch/pf-switch.js",
+    "./pf-table/context.js": "./pf-table/context.js",
+    "./pf-table/pf-caption.js": "./pf-table/pf-caption.js",
     "./pf-table/pf-table.js": "./pf-table/pf-table.js",
-    "./pf-table/pf-thead.js": "./pf-table/pf-thead.js",
     "./pf-table/pf-tbody.js": "./pf-table/pf-tbody.js",
-    "./pf-table/pf-tr.js": "./pf-table/pf-tr.js",
-    "./pf-table/pf-th.js": "./pf-table/pf-th.js",
     "./pf-table/pf-td.js": "./pf-table/pf-td.js",
-    "./pf-table/pf-caption.js": "./pf-table/pf-caption.js",
+    "./pf-table/pf-th.js": "./pf-table/pf-th.js",
+    "./pf-table/pf-thead.js": "./pf-table/pf-thead.js",
+    "./pf-table/pf-tr.js": "./pf-table/pf-tr.js",
+    "./pf-tabs/context.js": "./pf-tabs/context.js",
     "./pf-tabs/pf-tab-panel.js": "./pf-tabs/pf-tab-panel.js",
     "./pf-tabs/pf-tab.js": "./pf-tabs/pf-tab.js",
     "./pf-tabs/pf-tabs.js": "./pf-tabs/pf-tabs.js",
@@ -71,7 +74,7 @@
   },
   "scripts": {
     "prepublishOnly": "npm run build",
-    "analyze": "cem analyze",
+    "analyze": "cem generate",
     "build": "wireit",
     "test": "wtr --files './test/*.spec.ts' --config ../../web-test-runner.config.js"
   },
@@ -104,7 +107,6 @@
     "**/*.d.ts",
     "**/*.js",
     "**/*.js.map",
-    "!custom-elements-manifest.config.js",
     "!demo/*",
     "!docs/*",
     "!test/*"
@@ -128,10 +130,10 @@
     "Ajinyka Shinde <[email protected]>"
   ],
   "dependencies": {
-    "@lit/context": "^1.1.2",
+    "@lit/context": "^1.1.5",
     "@patternfly/icons": "^1.0.3",
-    "@patternfly/pfe-core": "^5.0.0",
-    "lit": "^3.2.1",
-    "tslib": "^2.6.3"
+    "@patternfly/pfe-core": "^5.0.2",
+    "lit": "^3.3.0",
+    "tslib": "^2.8.1"
   }
 }

elements/pf-tabs/pf-tabs.ts

@@ -1,4 +1,4 @@
-import { html, LitElement, type PropertyValues, type TemplateResult } from 'lit';
+import { html, LitElement, type TemplateResult } from 'lit';
 import { customElement } from 'lit/decorators/custom-element.js';
 import { property } from 'lit/decorators/property.js';
 import { query } from 'lit/decorators/query.js';

eleventy.config.cjs

@@ -85,7 +85,7 @@ module.exports = function(eleventyConfig) {
       ) {
         return null;
       } else {
-        return eleventyConfig.javascriptFunctions
+        return eleventyConfig.javascript.functions
             .slug($.text())
             .replace(/[&,+()$~%.'":*?!<>{}]/g, '');
       }