drupal-campaign-emailbuilder

A self-contained browser bundle of the EmailBuilder.js block editor and its official renderer, wrapped in a small stable API for the Drupal campaign module's campaign_emailbuilder submodule.

Upstream publishes no browser-ready editor artifact: the editor exists only as a private Vite + React 18 + MUI 5 sample app in its repository, and the renderer package ships CJS/ESM with bare-specifier imports. This wrapper forks that sample (examples/vite-emailbuilder-mui, MIT), strips its standalone-page chrome (samples drawer, URL-hash sharing, JSON import/export buttons), and builds everything — React, MUI, editor, renderer — into one IIFE file with no external references.

API

Loading dist/campaign-emailbuilder.min.js as a classic script defines window.CampaignEmailBuilder:

const instance = CampaignEmailBuilder.mount(containerElement, {
  // Optional: initial design document (defaults to an empty email layout).
  document: savedDocument,
  // Optional: called with the new document on every document mutation.
  onChange: (document) => { /* sync hidden inputs, etc. */ },
});

instance.getDocument();          // Current design document (JSON-serializable).
instance.getHtml();              // renderToStaticMarkup(document, {rootBlockId: 'root'})
                                 // via the official @usewaypoint/email-builder renderer.
instance.loadDocument(document); // Replace the current document (re-edit flow).
instance.unmount();              // Tear down the editor.

CampaignEmailBuilder.version;    // Wrapper version string.

Notes:

• The container element must have a resolvable height; the editor fills it.
• The editor state store is a singleton. A second mount() call does not error, but all instances share one document — one editor per page is the supported shape.
• onChange fires synchronously on every document mutation; debounce in the caller if needed.
• The wrapper knows nothing about Drupal (no Drupal.*, no drupalSettings); the submodule's glue JS owns that side.

Pinned upstream versions

All dependencies are pinned exact (no ^/~), matching the upstream sample at the @usewaypoint/[email protected] era (upstream repo state of 2026-02-09, commit ce3e610):

| Package | Version | | --- | --- | | @usewaypoint/email-builder (renderer) | 0.0.9 | | @usewaypoint/document-core | 0.0.6 | | @usewaypoint/block-avatar | 0.0.3 | | @usewaypoint/block-button | 0.0.3 | | @usewaypoint/block-columns-container | 0.0.3 | | @usewaypoint/block-container | 0.0.2 | | @usewaypoint/block-divider | 0.0.4 | | @usewaypoint/block-heading | 0.0.3 | | @usewaypoint/block-html | 0.0.3 | | @usewaypoint/block-image | 0.0.5 | | @usewaypoint/block-spacer | 0.0.3 | | @usewaypoint/block-text | 0.0.7 | | react / react-dom | 18.2.0 | | @mui/material / @mui/icons-material | 5.15.10 | | @emotion/react | 11.11.3 | | @emotion/styled | 11.11.0 | | zustand | 4.5.1 | | zod | 3.22.4 | | react-colorful | 5.6.1 | | highlight.js | 11.9.0 | | prettier | 3.2.5 |

The committed package-lock.json is the byte-exact build record.

Build

npm ci
npm run build

Emits dist/campaign-emailbuilder.min.js (single self-contained IIFE; MUI and emotion inject styles at runtime, so no separate CSS file is produced).

Verify

Scripted headless check of the public API (uses Playwright, which is deliberately not a dependency of this package):

npm install --no-save --no-package-lock playwright
npm run check

For a manual look, build and open dev/index.html in a browser.

Publish (maintainer)

Publishing is a maintainer act. Consuming sites never build this project; they download the published registry tarball into web/libraries (see the module README).

The package is deliberately unscoped. An @drupal-… npm organization would claim a Drupal-branded namespace, which the Drupal trademark policy treats as needing a license grant (its examples are drupal-modules.com, drupal-themes.co.uk); drupal- prefixed package names are long-standing common practice. So there is no organization to create — only an npm login.

npm login
npm ci
npm run check   # requires playwright, see above
npm publish

dist/ is gitignored and files ships only dist, so a prepublishOnly hook rebuilds the bundle — publishing from a clean checkout can never produce an empty tarball. Unscoped packages are public by default; no --access flag is needed.

After publishing, confirm the exact URL the CI anchor fetches resolves:

curl -fsSLI https://registry.npmjs.org/drupal-campaign-emailbuilder/-/drupal-campaign-emailbuilder-0.1.0.tgz | head -1

Bump version in package.json (and the version constant in src/index.tsx) before publishing; the module's libraries record pins the published version.

License

MIT — see LICENSE. Forked from usewaypoint/email-builder-js (MIT, copyright Waypoint / Metaccountant, Inc.). Bundled third-party packages (React, MUI, emotion, zustand, zod, and the @usewaypoint/* packages) are MIT-licensed.