fix: strip v5 prefix from docs titles, replace @jspm/generator with @pwrs/mappa

Strip the tag prefix (pf-v5-) from element display names in the docs
site sidebar, page titles, and demo headings so they show "Accordion"
instead of "V5 Accordion".

Replace @jspm/generator with @pwrs/mappa for import map generation in
both the 11ty docs build and the dev server plugin. This fixes the
"Unable to resolve npm:lit@3.3.2" build error and simplifies the import
map infrastructure.

Also adds v5 to the docs version dropdown and marks it as current.

Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: bennypowers

docs/_data/importMap.cjs

@@ -12,83 +12,44 @@ function readPackageVersion(module) {
   return packageLock.packages[`node_modules/${module}`].version;
 }
 
-const LIT_VERSION = readPackageVersion('lit');
-const FUSE_VERSION = readPackageVersion('fuse.js');
-const PRISM_VERSION = readPackageVersion('prismjs');
-
-const LIT_DEPS = [
-  {
-    target: `lit@${LIT_VERSION}`,
-    subpaths: [
-      '.',
-      './decorators/query-all.js',
-      './decorators/query-assigned-nodes.js',
-      './decorators/query-assigned-elements.js',
-      './decorators/query-async.js',
-      './decorators/query.js',
-      './decorators/state.js',
-      './decorators/property.js',
-      './decorators/custom-element.js',
-      './directives/async-append.js',
-      './directives/async-replace.js',
-      './directives/cache.js',
-      './directives/class-map.js',
-      './directives/guard.js',
-      './directives/if-defined.js',
-      './directives/live.js',
-      './directives/ref.js',
-      './directives/repeat.js',
-      './directives/style-map.js',
-      './directives/template-content.js',
-      './directives/unsafe-html.js',
-      './directives/unsafe-svg.js',
-      './directives/until.js',
-      './async-directive.js',
-      './decorators.js',
-      './directive.js',
-      './directive-helpers.js',
-      './html.js',
-      './polyfill-support.js',
-      './static-html.js',
-    ],
-  },
-  {
-    target: `@lit-labs/ssr-client`,
-    subpaths: [
-      '.',
-      './lit-element-hydrate-support.js',
-    ],
-  },
+const LOCAL_PACKAGES = [
+  '@patternfly/elements',
+  '@patternfly/pfe-core',
+  '@patternfly/pfe-tools',
+  '@patternfly/icons',
 ];
 
 module.exports = async function() {
-  const { Generator } = await import('@jspm/generator');
-
-  const generator = new Generator({
-    defaultProvider: 'jsdelivr',
-    env: ['production', 'browser', 'module'],
+  const { generate } = await import('@pwrs/mappa');
+
+  const map = await generate({
+    dependencies: {
+      'tslib': readPackageVersion('tslib'),
+      '@rhds/elements': readPackageVersion('@rhds/elements'),
+      'prismjs': readPackageVersion('prismjs'),
+      'element-internals-polyfill': readPackageVersion('element-internals-polyfill'),
+      'fuse.js': readPackageVersion('fuse.js'),
+      'lit': readPackageVersion('lit'),
+      '@lit-labs/ssr-client': readPackageVersion('@lit-labs/ssr-client'),
+    },
+  }, {
+    cdn: 'jsdelivr',
+    exclude: LOCAL_PACKAGES,
   });
 
-  await generator.install([
-    'tslib',
-    '@rhds/elements',
-    '@rhds/elements/rh-footer/rh-footer-universal.js',
-    `prismjs@${PRISM_VERSION}`,
-    'element-internals-polyfill',
-    `fuse.js@${FUSE_VERSION}`,
-    ...LIT_DEPS,
-  ]);
+  for (const key of Object.keys(map.imports)) {
+    for (const pkg of LOCAL_PACKAGES) {
+      if (key === pkg || key.startsWith(`${pkg}/`)) {
+        delete map.imports[key];
+      }
+    }
+  }
 
-  const map = generator.getMap();
   map.imports['/docs/zero-md.js'] = '/zero-md.js';
   map.imports['@patternfly/elements/'] = '/assets/@patternfly/elements/';
   map.imports['@patternfly/pfe-core/'] = '/assets/@patternfly/pfe-core/';
   map.imports['@patternfly/pfe-core'] = '/assets/@patternfly/pfe-core/core.js';
   map.imports['@patternfly/pfe-tools/'] = '/assets/@patternfly/pfe-tools/';
   map.imports['@patternfly/icons/'] = '/assets/@patternfly/icons/';
-  map.imports['@lit/context'] = map.scopes['https://cdn.jsdelivr.net/']['@lit/context'];
-  map.imports['lit/'] = map.imports.lit.replace('index.js', '');
-  map.scopes['https://cdn.jsdelivr.net/'].lit = map.imports.lit;
-  map.scopes['https://cdn.jsdelivr.net/']['lit/'] = map.imports.lit.replace('index.js', '');
   return map;
 };

docs/_data/versions.json

@@ -1,9 +1,15 @@
 [
+  {
+    "version": "v5.0.0",
+    "slug": "v5",
+    "label": "v5",
+    "current": true
+  },
   {
     "version": "v4.0.0",
     "slug": "v4",
     "label": "v4",
-    "current": true
+    "current": false
   },
   {
     "version": "v3.0.0",

docs/_plugins/create-import-map.cjs

@@ -1,21 +1,23 @@
 module.exports = function(eleventyConfig) {
   eleventyConfig.addPairedAsyncShortcode('generateImportMap', async content => {
-    const { Generator } = await import('@jspm/generator');
+    const { generate } = await import('@pwrs/mappa');
 
-    const generator = new Generator({
-      defaultProvider: 'jspm.io',
-      env: ['production', 'browser', 'module'],
-    });
+    const deps = {};
+    const specifierRe = /['"]([^'"]+)['"]/g;
+    for (const match of content.matchAll(specifierRe)) {
+      const spec = match[1];
+      if (!spec.startsWith('.') && !spec.startsWith('/')) {
+        const name = spec.startsWith('@')
+          ? spec.split('/').slice(0, 2).join('/')
+          : spec.split('/')[0];
+        deps[name] = '*';
+      }
+    }
 
-    const pins = await generator.addMappings(content);
+    const map = await generate({ dependencies: deps }, { cdn: 'esm.sh' });
 
-    const html = await generator.htmlInject(content, {
-      pins,
-      esModuleShims: true,
-      whitespace: true,
-    });
-
-    return html;
+    const script = `<script type="importmap">\n${JSON.stringify(map, null, 2)}\n</script>`;
+    return content.replace(/<script\b[^>]*type=["']module["'][^>]*>[\s\S]*?<\/script>/g, found =>
+      `${script}\n${found}`);
   });
 };
-