chore: update to @patternfly/elements rc

[bennypowers]

What I did

1. install @patternfly/elements
2. replace instances of pfe imports and elements
3. upgrade to pfe-tools 1.0 rc
4. upgrade to 11ty 2.0 beta
5. refactor 11ty config
6. nice up the importMap.cjs generator for 11ty 🤞 hopefully this is the one.
7. migrate from npm-run-all to wireit
8. upgrade dependencies

Testing Instructions

1. check changed docs and dev server demos
2. git clean -dfx && npm ci && npm start should run both the wds dev server and the 11ty dev server successfully. warning: this git clean is a destructive operation

Check all these DP demos:

1. Accordion main demo
2. Accordion context nested demo
3. Context Provider main demo
4. Context Provider context nested demo
5. Footer main demo (social icons)
6. Global footer nested demo (light dom css)
7. playgrounds (switching playground tabs)
8. Call to Action demo
9. Dialog demo
10. Stat demo
11. Tooltip demo

Notes to Reviewers

• Blocked by feat(tools): 11ty plugin anchors patternfly/patternfly-elements#2342
• Blocked by feat(tools): add minify option to ts css-imports patternfly/patternfly-elements#2358
• Blocked by fix(tools): find demos patternfly/patternfly-elements#2360
• Blocked by fix(tools): fix demo script import and styles patternfly/patternfly-elements#2362
• Blocked by fix(icon): add icon package exports patternfly/patternfly-elements#2367
• even if CI is green, check the test log to make sure all tests indeed ran and passed

[changeset-bot]

🦋 Changeset detected

Latest commit: 650fb37

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@rhds/elements	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[netlify]

✅ Deploy Preview for red-hat-design-system ready!

Name	Link
🔨 Latest commit	650fb37
🔍 Latest deploy log	https://app.netlify.com/sites/red-hat-design-system/deploys/63ea3ffde7f0df00086529f0
😎 Deploy Preview	https://deploy-preview-725--red-hat-design-system.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[bennypowers]

this is probably blocked on jspm rebuilding our package. i already reached out.

[bennypowers]

this should perhaps wait on patternfly/patternfly-elements#2343 to avoid churn

[zeroedin]

Should we bump to node 18 to match PFE with this?

[bennypowers]

Should we bump to node 18 to match PFE with this?

indubitably

[brianferry]

Error in your Eleventy config file 'eleventy.config.cjs'. (via EleventyConfigError) [11ty] 2. Package subpath './11ty/plugins/anchors.cjs' is not defined by "exports"

[zeroedin]

Get an error running npm start

git pull 
git clean -fdx
nvm use
npm ci
npm run start

Results in:

⬆️ [start] Service started
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './dev-server.js' is not defined by "exports" in /Users/xxx/Sites/_rhds/red-hat-design-system/node_modules/@patternfly/pfe-tools/package.json imported from /Users/xxx/Sites/_rhds/red-hat-design-system/web-dev-server.config.js
    at new NodeError (node:internal/errors:393:5)
    at throwExportsNotFound (node:internal/modules/esm/resolve:358:9)
    at packageExportsResolve (node:internal/modules/esm/resolve:668:3)
    at packageResolve (node:internal/modules/esm/resolve:843:14)
    at moduleResolve (node:internal/modules/esm/resolve:909:20)
    at defaultResolve (node:internal/modules/esm/resolve:1124:11)
    at nextResolve (node:internal/modules/esm/loader:163:28)
    at ESMLoader.resolve (node:internal/modules/esm/loader:841:30)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:424:18)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:40) {
  code: 'ERR_PACKAGE_PATH_NOT_EXPORTED'
}
❌ [start] Service exited unexpectedly
⬇️ [watch:docs] Service stopped
⬇️ [watch:compile] Service stopped

[bennypowers]

yeah i got those too
i thought they were fixed, but i'll take another look in the morning

[zeroedin]

yeah i got those too i thought they were fixed, but i'll take another look in the morning

Sounds good, was going down the rabbit hole, might be some missing exports in package.json in pfe-tools.

After adding: import { pfeDevServerConfig } from '@patternfly/pfe-tools/dev-server/config.js'; to web-dev-server.config.js npm start then fails on./11ty/plugins/anchors.cjs not being exported.

[bennypowers]

This remains blocked by patternfly/patternfly-elements#2342

[bennypowers]

wipes brow ok that's it. with the exception of the global footer playground on the footer page, which we'll do in a fast follow, this should cover it.

I'mm not happy with the level of complexity in importMap.cjs, but we've been there before, and I have a few ideas for fixing it (custom providers, injectHTML, a vendor bundle)

[brianferry]

@bennypowers

Took a look at the latest on the branch and this is looking great! I agree that the importMap and some of the regex / object.assign magic is a little much but can be improved on later.

I did notice a few smaller things that can be fast follows,

1. Tabs component looks like it’s trying to pull pf-tab / pf-tabs in but it doesn’t currently get imported.
2. The call-to-action analytics page does not load the styles for the code block when in the dev server, but demo page loads correctly.
3. Little add stylings here and there, like the accordion demo always needing to be the full height of the page.

PR looks good to me 👍

[bennypowers]

1. Tabs component looks like it’s trying to pull pf-tab / pf-tabs in but it doesn’t currently get imported.

Fixed

2. The `call-to-action` analytics page does not load the styles for the code block when in the dev server, but demo page loads correctly.

Fixed

3. Little add stylings here and there, like the accordion demo always needing to be the full height of the page.

???

PR looks good to me +1
Please drop an approval when you can

[bennypowers]

I believe 4407ef9 solves the problem of wireit running the 11ty build when tsc artifacts are missing

confirm fix by running this repro in /tmp

cd /tmp
git clone https://github.com/RedHat-UX/red-hat-design-system.git
cd red-hat-design-system
git checkout ad15695c65346fad60cfcdd5e3c65f126f7ea4be
npm ci
npm start

Then ctrl-c
then start again with

npm start

[brianferry]

Update looks good, thank you for all the work you've done on this @bennypowers!