From f328076024a7f230f1bd1d249c404265c064ebeb Mon Sep 17 00:00:00 2001 From: Benny Powers Date: Wed, 15 Apr 2026 15:25:17 +0300 Subject: [PATCH 1/3] feat!: remove bundled entrypoint (pfe.min.js) The bundled entrypoint causes custom element double-registration issues and is not the recommended way to consume the library. Closes #3087 Assisted-By: Claude Opus 4.6 (1M context) --- .changeset/remove-bundled-entrypoint.md | 9 ++++ elements/package.json | 2 - package.json | 17 +------ scripts/bundle.js | 66 ------------------------- 4 files changed, 10 insertions(+), 84 deletions(-) create mode 100644 .changeset/remove-bundled-entrypoint.md delete mode 100755 scripts/bundle.js diff --git a/.changeset/remove-bundled-entrypoint.md b/.changeset/remove-bundled-entrypoint.md new file mode 100644 index 0000000000..e521614146 --- /dev/null +++ b/.changeset/remove-bundled-entrypoint.md @@ -0,0 +1,9 @@ +--- +"@patternfly/elements": major +--- + +Removed the bundled entrypoint (`pfe.min.js`). Import individual +elements directly instead, e.g. `import '@patternfly/elements/pf-button/pf-button.js'`. + +The bundled entrypoint caused custom element double-registration issues +and is not recommended for production use. diff --git a/elements/package.json b/elements/package.json index be137e3b38..af86f52f9d 100644 --- a/elements/package.json +++ b/elements/package.json @@ -5,11 +5,9 @@ "description": "PatternFly Elements", "customElements": "custom-elements.json", "type": "module", - "main": "./pfe.min.js", "module": "./pfe.js", "types": "./pfe.d.ts", "exports": { - ".": "./pfe.min.js", "./form-control.css": "./form-control.css", "./form-control.css.js": "./form-control.css.js", "./pf-accordion/pf-accordion-header.js": "./pf-accordion/pf-accordion-header.js", diff --git a/package.json b/package.json index cea4bdb900..50f07f541a 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "build:lightdom", "build:elements", "build:create", - "build:bundle", + "build:react" ] }, @@ -137,21 +137,6 @@ "core/**/*.tsbuildinfo" ] }, - "build:bundle": { - "command": "node scripts/bundle.js", - "dependencies": [ - "build:core" - ], - "files": [ - "elements/**/*.ts", - "elements/**/*.css", - "core/**/*.ts", - "scripts/bundle.js" - ], - "output": [ - "elements/pfe.min.js" - ] - }, "build:react": { "command": "npx tsx scripts/generate-react-wrappers.ts", "dependencies": [ diff --git a/scripts/bundle.js b/scripts/bundle.js deleted file mode 100755 index 9253115d2c..0000000000 --- a/scripts/bundle.js +++ /dev/null @@ -1,66 +0,0 @@ -#!/usr/bin/env node -/* globals process */ -import { build } from 'esbuild'; -import { join } from 'node:path'; -import { fileURLToPath } from 'node:url'; -import { litCssPlugin } from 'esbuild-plugin-lit-css'; -import { glob } from 'glob'; - -import postcss from 'postcss'; -import postcssNesting from 'postcss-nesting'; - -const resolveDir = join(fileURLToPath(import.meta.url), '../../elements'); - -const entryPoints = - (await glob('./pf-*/pf-*.ts', { cwd: resolveDir })) - .map(x => x.replace('.ts', '.js')); - -const contents = entryPoints.map(x => `export * from './${x.replaceAll('\\', '/')}';`).join('\n'); - -/** - * @param {object} options - * @param {object} options.outfile file path to bundle to - */ -export async function bundle({ outfile = 'elements/pfe.min.js' } = {}) { - await build({ - stdin: { - contents, - loader: 'ts', - resolveDir, - }, - format: 'esm', - outfile, - allowOverwrite: true, - treeShaking: true, - legalComments: 'linked', - logLevel: 'info', - sourcemap: true, - bundle: true, - minify: true, - minifyWhitespace: true, - - external: [ - 'lit', - 'tslib', - ], - - plugins: [ - litCssPlugin({ - cssnano: false, - filter: /\.css$/, - transform: (str, { filePath }) => - postcss(postcssNesting()) - .process(str, { from: filePath }) - .css, - }), - ], - }); -} - -if (process.argv.at(1) === import.meta.url) { - try { - await bundle(); - } catch { - process.exit(1); - } -} From d3e68cc1342e8901438e869f766afe72f105bddf Mon Sep 17 00:00:00 2001 From: Benny Powers Date: Wed, 15 Apr 2026 15:32:22 +0300 Subject: [PATCH 2/3] fix: remove bundle references from docs plugin Remove the bundle() call and pfe.min.* passthrough copies from the Eleventy docs plugin, since the bundled entrypoint was removed. Assisted-By: Claude Opus 4.6 (1M context) --- docs/_plugins/pfe-assets.cjs | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/docs/_plugins/pfe-assets.cjs b/docs/_plugins/pfe-assets.cjs index 240eee6b01..60f2969c45 100644 --- a/docs/_plugins/pfe-assets.cjs +++ b/docs/_plugins/pfe-assets.cjs @@ -63,18 +63,10 @@ function demoPaths(content) { } } -/** Generate a single-file bundle of all the repo's components and their dependencies */ -async function bundle() { - const { bundle } = await import('../../scripts/bundle.js'); - await bundle(); -} - module.exports = { configFunction(eleventyConfig, options) { eleventyConfig.addPassthroughCopy('docs/images/favicon.ico'); eleventyConfig.addPassthroughCopy('docs/bundle.{js,map,ts}'); - eleventyConfig.addPassthroughCopy('docs/pfe.min.{map,css}'); - eleventyConfig.addPassthroughCopy({ 'elements/pfe.min.*': '/' } ); eleventyConfig.addPassthroughCopy('docs/demo.{js,map,ts}'); eleventyConfig.addPassthroughCopy('docs/main.mjs'); eleventyConfig.addPassthroughCopy({ @@ -94,7 +86,5 @@ module.exports = { // so here we transform the paths found in those files to match the docs site's file structure eleventyConfig.addTransform('demo-paths', demoPaths); - // create /docs/pfe.min.js - eleventyConfig.on('eleventy.before', () => bundle(options)); }, }; From e9bc40b8f79cc6a3bbbe911f595a82314762c7b3 Mon Sep 17 00:00:00 2001 From: Benny Powers Date: Wed, 15 Apr 2026 15:36:45 +0300 Subject: [PATCH 3/3] fix: remove trailing blank line in pfe-assets plugin Fixes padded-blocks lint error. Assisted-By: Claude Opus 4.6 (1M context) --- docs/_plugins/pfe-assets.cjs | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/_plugins/pfe-assets.cjs b/docs/_plugins/pfe-assets.cjs index 60f2969c45..d6f43cbd29 100644 --- a/docs/_plugins/pfe-assets.cjs +++ b/docs/_plugins/pfe-assets.cjs @@ -85,6 +85,5 @@ module.exports = { // The demo files are written primarily for the dev SPA (`npm start`), // so here we transform the paths found in those files to match the docs site's file structure eleventyConfig.addTransform('demo-paths', demoPaths); - }, };