@maizzle/framework 5.0.0-beta.12 → 5.0.0-beta.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maizzle/framework",
-  "version": "5.0.0-beta.12",
+  "version": "5.0.0-beta.13",
   "description": "Maizzle is a framework that helps you quickly build HTML emails with Tailwind CSS.",
   "license": "MIT",
   "type": "module",

package/src/generators/render.js

@@ -6,7 +6,7 @@ import expressions from 'posthtml-expressions'
 import { parseFrontMatter } from '../utils/node.js'
 import defaultConfig from '../posthtml/defaultConfig.js'
 import { process as compilePostHTML } from '../posthtml/index.js'
-import { run as useTransformers, transformers } from '../transformers/index.js'
+import { run as useTransformers } from '../transformers/index.js'
 
 export async function render(html = '', config = {}) {
   if (typeof html !== 'string') {
@@ -70,7 +70,6 @@ export async function render(html = '', config = {}) {
       matter: matterData,
       config: templateConfig,
       posthtml: compilePostHTML,
-      transform: transformers,
     })) ?? content
   }
 
@@ -94,7 +93,6 @@ export async function render(html = '', config = {}) {
       matter: matterData,
       config: templateConfig,
       posthtml: compilePostHTML,
-      transform: transformers,
     })) ?? compiled.html
   }
 
@@ -130,7 +128,6 @@ export async function render(html = '', config = {}) {
       matter: matterData,
       config: templateConfig,
       posthtml: compilePostHTML,
-      transform: transformers,
     })) ?? compiled.html
   }
 

package/src/transformers/addAttributes.js

@@ -11,7 +11,7 @@ export default function posthtmlPlugin(attributes = {}) {
       role: 'none'
     },
     img: {
-      alt: ''
+      alt: true,
     }
   }
 

package/src/transformers/comb.js

@@ -37,7 +37,7 @@ const posthtmlPlugin = options => tree => {
 
   const { result: html } = emailComb(render(tree), options)
 
-  return parse(html)
+  return parse(html, posthtmlConfig)
 }
 
 export default posthtmlPlugin

package/src/transformers/index.js

@@ -2,6 +2,7 @@ import posthtml from 'posthtml'
 import get from 'lodash-es/get.js'
 import { defu as merge } from 'defu'
 
+import core from './core.js'
 import comb from './comb.js'
 import sixHex from './sixHex.js'
 import minify from './minify.js'
@@ -21,19 +22,17 @@ import replaceStrings from './replaceStrings.js'
 import attributeToStyle from './attributeToStyle.js'
 import removeAttributes from './removeAttributes.js'
 
-import coreTransformers from './core.js'
-
 import defaultPosthtmlConfig from '../posthtml/defaultConfig.js'
 
 /**
  * Use Maizzle Transformers on an HTML string.
  *
- * Only Transformers that are enabled in the `config` will be used.
+ * Only Transformers that are enabled in the passed
+ * `config` parameter will be used.
  *
  * @param {string} html The HTML content
  * @param {object} config The Maizzle config object
- * @returns {Promise<{ original: string, config: object, html: string }>}
- *   A Promise resolving to an object containing the original HTML, modified HTML, and the config
+ * @returns {Promise<{ html: string }>} A Promise resolving to an object containing the modified HTML
  */
 export async function run(html = '', config = {}) {
   const posthtmlPlugins = []
@@ -46,16 +45,16 @@ export async function run(html = '', config = {}) {
   /**
    * 1. Core transformers
    *
-   * Transformers that are always enabled
+   * Transformers that are always enabled.
    *
    */
-  posthtmlPlugins.push(coreTransformers(config))
+  posthtmlPlugins.push(core(config))
 
   /**
    * 2. Safe class names
    *
    * Rewrite Tailwind CSS class names to email-safe alternatives,
-   * unless explicitly disabled
+   * unless explicitly disabled.
    */
   if (get(config, 'css.safe') !== false) {
     posthtmlPlugins.push(
@@ -66,7 +65,6 @@ export async function run(html = '', config = {}) {
   /**
    * 3. Filters
    *
-   * Apply filters to HTML.
    * Filters are always applied, unless explicitly disabled.
    */
   if (get(config, 'filters') !== false) {
@@ -78,7 +76,7 @@ export async function run(html = '', config = {}) {
   /**
    * 4. Markdown
    *
-   * Convert Markdown to HTML with Markdown-it, unless explicitly disabled
+   * Convert Markdown to HTML with markdown-it, unless explicitly disabled.
    */
   if (get(config, 'markdown') !== false) {
     posthtmlPlugins.push(
@@ -88,7 +86,9 @@ export async function run(html = '', config = {}) {
 
   /**
    * 5. Prevent widow words
-   * Always runs, unless explicitly disabled
+   *
+   * Enabled by default, will prevent widow words in elements
+   * wrapped with a `prevent-widows` attribute.
    */
   if (get(config, 'widowWords') !== false) {
     posthtmlPlugins.push(
@@ -110,7 +110,7 @@ export async function run(html = '', config = {}) {
   /**
    * 7. Inline CSS
    *
-   * Inline CSS into HTML
+   * Inline CSS into HTML.
    */
   if (get(config, 'css.inline')) {
     posthtmlPlugins.push(inlineCSS(
@@ -150,7 +150,7 @@ export async function run(html = '', config = {}) {
   /**
    * 10. Shorthand CSS
    *
-   * Convert longhand CSS properties to shorthand in `style` attributes
+   * Convert longhand CSS properties to shorthand in `style` attributes.
    */
   if (get(config, 'css.shorthand')) {
     posthtmlPlugins.push(
@@ -161,7 +161,7 @@ export async function run(html = '', config = {}) {
   /**
    * 11. Add attributes
    *
-   * Add attributes to HTML tags
+   * Add attributes to HTML tags.
    */
   if (get(config, 'attributes.add') !== false) {
     posthtmlPlugins.push(
@@ -172,7 +172,7 @@ export async function run(html = '', config = {}) {
   /**
    * 12. Base URL
    *
-   * Add a base URL to relative paths
+   * Add a base URL to relative paths.
    */
   if (get(config, 'baseURL', get(config, 'baseUrl'))) {
     posthtmlPlugins.push(
@@ -180,7 +180,7 @@ export async function run(html = '', config = {}) {
     )
   } else {
     /**
-     * Set baseURL to `build.static.destination` if it's not already set
+     * Set baseURL to `build.static.destination` if it's not already set.
      */
     const destination = get(config, 'build.static.destination', '')
     if (destination && !config._dev) {
@@ -198,7 +198,7 @@ export async function run(html = '', config = {}) {
   /**
    * 13. URL parameters
    *
-   * Add parameters to URLs
+   * Add parameters to URLs.
    */
   if (get(config, 'urlParameters')) {
     posthtmlPlugins.push(
@@ -209,8 +209,7 @@ export async function run(html = '', config = {}) {
   /**
    * 14. Six-digit HEX
    *
-   * Convert three-digit HEX colors to six-digit
-   * Always runs, unless explicitly disabled
+   * Enabled by default, converts three-digit HEX colors to six-digit.
    */
   if (get(config, 'css.sixHex') !== false) {
     posthtmlPlugins.push(
@@ -221,7 +220,7 @@ export async function run(html = '', config = {}) {
   /**
    * 15. PostHTML MSO
    *
-   * Simplify writing MSO conditionals for Outlook
+   * Enabled by default, simplifies writing MSO conditionals for Outlook.
    */
   if (get(config, 'outlook') !== false) {
     posthtmlPlugins.push(
@@ -232,7 +231,7 @@ export async function run(html = '', config = {}) {
   /**
    * 16. Prettify
    *
-   * Pretty-print HTML using js-beautify
+   * Pretty-print HTML using js-beautify.
    */
   if (get(config, 'prettify')) {
     posthtmlPlugins.push(
@@ -243,7 +242,7 @@ export async function run(html = '', config = {}) {
   /**
    * 17. Minify
    *
-   * Minify HTML using html-crush
+   * Minify HTML using html-crush.
    */
   if (get(config, 'minify')) {
     posthtmlPlugins.push(
@@ -254,14 +253,14 @@ export async function run(html = '', config = {}) {
   /**
    * 18. <template> tags
    *
-   * Replace <template> tags with their content
+   * Replace <template> tags with their content.
    */
   posthtmlPlugins.push(templateTag())
 
   /**
    * 19. Replace strings
    *
-   * Replace strings through regular expressions
+   * Replace strings through regular expressions.
    */
   if (get(config, 'replaceStrings')) {
     posthtmlPlugins.push(
@@ -275,23 +274,3 @@ export async function run(html = '', config = {}) {
       html: result.html,
     }))
 }
-
-export const transformers = {
-  comb,
-  sixHex,
-  minify,
-  baseUrl,
-  inlineCSS,
-  prettify,
-  filters,
-  markdown,
-  posthtmlMso,
-  shorthandCss,
-  preventWidows,
-  addAttributes,
-  urlParameters,
-  safeClassNames,
-  replaceStrings,
-  attributeToStyle,
-  removeAttributes,
-}

package/src/transformers/inline.js

@@ -12,9 +12,10 @@ import isObject from 'lodash-es/isObject.js'
 import { parser as parse } from 'posthtml-parser'
 import { parseCSSRule } from '../utils/string.js'
 import { useAttributeSizes } from './useAttributeSizes.js'
+import defaultPostHTMLConfig from '../posthtml/defaultConfig.js'
 
 const posthtmlPlugin = (options = {}) => tree => {
-  return inline(render(tree), options).then(html => parse(html))
+  return inline(render(tree), options).then(html => parse(html, defaultPostHTMLConfig))
 }
 
 export default posthtmlPlugin

package/src/transformers/minify.js

@@ -4,6 +4,7 @@ import { defu as merge } from 'defu'
 import { render } from 'posthtml-render'
 import { parser as parse } from 'posthtml-parser'
 import posthtmlConfig from '../posthtml/defaultConfig.js'
+import defaultPostHTMLConfig from '../posthtml/defaultConfig.js'
 
 const posthtmlPlugin = (options = {}) => tree => {
   options = merge(options, {
@@ -12,7 +13,7 @@ const posthtmlPlugin = (options = {}) => tree => {
 
   const { result: html } = crush(render(tree), options)
 
-  return parse(html)
+  return parse(html, defaultPostHTMLConfig)
 }
 
 export default posthtmlPlugin

package/src/transformers/replaceStrings.js

@@ -4,6 +4,7 @@ import { render } from 'posthtml-render'
 import isEmpty from 'lodash-es/isEmpty.js'
 import { parser as parse } from 'posthtml-parser'
 import posthtmlConfig from '../posthtml/defaultConfig.js'
+import defaultPostHTMLConfig from '../posthtml/defaultConfig.js'
 
 const posthtmlPlugin = (replacements = {}) => tree => {
   if (!isEmpty(replacements)) {
@@ -17,7 +18,8 @@ const posthtmlPlugin = (replacements = {}) => tree => {
             return replacement
           }
         }
-      })
+      }),
+      defaultPostHTMLConfig
     )
   }
 

package/types/build.d.ts

@@ -1,13 +1,7 @@
-import ComponentsConfig from './components';
 import type { SpinnerName } from 'cli-spinners';
 import type ExpressionsConfig from './expressions';
 
 export default interface BuildConfig {
-  /**
-   * Components configuration.
-   */
-  components?: ComponentsConfig;
-
   /**
    * Paths where Maizzle should look for Templates to compile.
    *
@@ -22,7 +16,7 @@ export default interface BuildConfig {
    * }
    * ```
    */
-  content?: string | string[];
+  content?: string[];
 
   /**
   Configure expressions.
@@ -88,21 +82,6 @@ export default interface BuildConfig {
      * @default undefined
      */
     destination?: string;
-  } | {
-    /**
-     * An array of objects specifying source and destination directories for static files.
-     */
-    static: Array<{
-      /**
-       * Array of paths where Maizzle should look for static files.
-       */
-      source: string[];
-      /**
-       * Directory where static files should be copied to,
-       * relative to the `build.output` path.
-       */
-      destination: string;
-    }>;
   };
 
   /**

package/types/config.d.ts

@@ -5,6 +5,7 @@ import type PostHTMLConfig from './posthtml';
 import type MarkdownConfig from './markdown';
 import type { ProcessOptions } from 'postcss';
 import type PurgeCSSConfig from './css/purge';
+import type PlaintextConfig from './plaintext';
 import type CSSInlineConfig from './css/inline';
 import type { SpinnerName } from 'cli-spinners';
 import type ComponentsConfig from './components';
@@ -12,7 +13,6 @@ import type WidowWordsConfig from './widowWords';
 import type { CoreBeautifyOptions } from 'js-beautify';
 import type { BaseURLConfig } from 'posthtml-base-url';
 import type URLParametersConfig from './urlParameters';
-import type PlaintextConfig from './plaintext';
 
 import type { Config as TailwindConfig } from 'tailwindcss';
 
@@ -60,20 +60,8 @@ export default interface Config {
   }
 
   /**
-  Configure build settings.
-
-  @example
-  ```
-  export default {
-    build: {
-      components: ComponentsConfig,
-      posthtml: PostHTMLConfig,
-      tailwind: TailwindConfig,
-      templates: TemplatesConfig,
-    }
-  }
-  ```
-  */
+   * Configure build settings.
+   */
   build: BuildConfig;
 
   /**
@@ -177,7 +165,6 @@ export default interface Config {
 
     /**
      * Use a custom Tailwind CSS configuration object.
-     *
      */
     tailwind?: TailwindConfig;
   }
@@ -221,7 +208,7 @@ export default interface Config {
    * <p>{{ company.name }}</p>
    * ```
    */
-  locals?: Record<string, any>; // eslint-disable-line
+  locals?: Record<string, any>;
 
   /**
    * Configure the Markdown parser.

package/types/events.d.ts

@@ -1,172 +1,7 @@
 import type Config from "./config";
-import type {
-  safeClassNames,
-  markdown,
-  preventWidows,
-  attributeToStyle,
-  inlineCSS,
-  shorthandCSS,
-  removeUnusedCSS,
-  purgeCSS,
-  removeAttributes,
-  addAttributes,
-  prettify,
-  applyBaseURL,
-  addUrlParams,
-  sixHEX,
-  minify,
-  replaceStrings,
-  plaintext,
-} from "./index";
 
 type PostHTMLType = (html: string, config: Config) => { html: string; config: Config };
 
-type TransformType = {
-  /**
-  * Normalize escaped character class names like `\:` or `\/` by replacing them with email-safe alternatives.
-  *
-  * @param {string} html The HTML string to normalize.
-  * @param {Record<string, string>} replacements A dictionary of replacements to apply.
-  * @returns {string} The normalized HTML string.
-  * @see https://maizzle.com/docs/transformers/safe-class-names
-  */
-  safeClassNames: typeof safeClassNames;
-  /**
-  * Compile Markdown to HTML.
-  *
-  * @param {string} input The Markdown string to compile.
-  * @param {MarkdownConfig} [options] A configuration object for the Markdown compiler.
-  * @returns {string} The compiled HTML string.
-  * @see https://maizzle.com/docs/transformers/markdown
-  */
-  markdown: typeof markdown;
-  /**
-  * Prevent widow words inside a tag by adding a `&nbsp;` between its last two words.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {WidowWordsConfig} [options] A configuration object for the widow words transformer.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/widows
-  */
-  preventWidows: typeof preventWidows;
-  /**
-  * Duplicate HTML attributes to inline CSS.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {AttributeToStyleSupportedAttributes[]} attributes An array of attributes to inline.
-  * @param {PostHTMLConfig} [posthtmlConfig] A configuration object for PostHTML.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/attribute-to-style
-  */
-  attributeToStyle: typeof attributeToStyle;
-  /**
-  * Inline CSS styles in an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {CSSInlineConfig} [options] A configuration object for the CSS inliner.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/inline-css
-  */
-  inlineCSS: typeof inlineCSS;
-  /**
-  * Rewrite longhand CSS inside style attributes with shorthand syntax.
-  * Only works with margin, padding and border, and only when all sides are specified.
-  *
-  * @param {string} html The HTML string to process.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/shorthand-css
-  */
-  shorthandCSS: typeof shorthandCSS;
-  /**
-  * Remove unused CSS from `<style>` tags and HTML elements.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {PurgeCSSConfig} [options] A configuration object for `email-comb`.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/remove-unused-css
-  */
-  removeUnusedCSS: typeof removeUnusedCSS;
-  /**
-  * Remove HTML attributes from an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {string[] | Array<{ name: string; value: string | RegExp }>} [options] An array of attribute names to remove, or an array of objects with `name` and `value` properties.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/remove-attributes
-  */
-  removeAttributes: typeof removeAttributes;
-  /**
-  * Add attributes to elements in an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {Record<string, unknown>} [options] A dictionary of attributes to add.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/add-attributes
-  */
-  addAttributes: typeof addAttributes;
-  /**
-  * Pretty-print an HTML string.
-  *
-  * @param {string} html The HTML string to prettify.
-  * @param {HTMLBeautifyOptions} [options] A configuration object for `js-beautify`.
-  * @returns {string} The prettified HTML string.
-  * @see https://maizzle.com/docs/transformers/prettify
-  */
-  prettify: typeof prettify;
-  /**
-  * Prepend a string to sources and hrefs in an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {string | BaseURLConfig} [options] A string to prepend to sources and hrefs, or a configuration object for `posthtml-base-url`.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/base-url
-  */
-  applyBaseURL: typeof applyBaseURL;
-  /**
-  * Append parameters to URLs in an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {URLParametersConfig} [options] A configuration object for `posthtml-url-parameters`.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/url-parameters
-  */
-  addUrlParams: typeof addUrlParams;
-  /**
-  * Ensure that all HEX colors inside `bgcolor` and `color` attributes are defined with six digits.
-  *
-  * @param {string} html The HTML string to process.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/six-hex
-  */
-  sixHEX: typeof sixHEX;
-  /**
-  * Minify an HTML string, with email client considerations.
-  *
-  * @param {string} html The HTML string to minify.
-  * @param {MinifyConfig} [options] A configuration object for `html-minifier`.
-  * @returns {string} The minified HTML string.
-  * @see https://maizzle.com/docs/transformers/minify
-  */
-  minify: typeof minify;
-  /**
-  * Batch-replace strings in an HTML string.
-  *
-  * @param {string} html The HTML string to process.
-  * @param {Record<string, string>} [replacements] A dictionary of strings to replace.
-  * @returns {string} The processed HTML string.
-  * @see https://maizzle.com/docs/transformers/replace-strings
-  */
-  replaceStrings: typeof replaceStrings;
-  /**
-  * Generate a plaintext version of an HTML string.
-  * @param {string} html - The HTML string to convert to plaintext.
-  * @param {PlaintextConfig} [options] - A configuration object for the plaintext generator.
-  * @returns {Promise<string>} The plaintext version of the HTML string.
-  * @see https://maizzle.com/docs/plaintext
-  */
-  plaintext: typeof plaintext;
-};
-
 export default interface Events {
   /**
   * Runs after the Environment config has been computed, but before Templates are processed.
@@ -195,7 +30,7 @@ export default interface Events {
   * @example
   * ```
   * export default {
-  *   beforeRender: async ({html, matter, config, posthtml, transform}) => {
+  *   beforeRender: async ({html, matter, config, posthtml}) => {
   *     // do something...
   *     return html;
   *   }
@@ -222,10 +57,6 @@ export default interface Events {
      * @param {Config} config The Maizzle config object.
      */
     posthtml: PostHTMLType;
-    /**
-     * A collection of Maizzle Transformers.
-     */
-    transform: TransformType;
   }) => string | Promise<string>;
 
   /**
@@ -238,7 +69,7 @@ export default interface Events {
   * @example
   * ```
   * export default {
-  *   afterRender: async async ({html, matter, config, posthtml, transform}) => {
+  *   afterRender: async async ({html, matter, config, posthtml}) => {
   *     // do something...
   *     return html;
   *   }
@@ -265,10 +96,6 @@ export default interface Events {
     * @param {Config} config The Maizzle config object.
     */
     posthtml: PostHTMLType;
-    /**
-    * A collection of Maizzle Transformers.
-    */
-    transform: TransformType;
   }) => string | Promise<string>;
 
   /**
@@ -281,7 +108,7 @@ export default interface Events {
   * @example
   * ```
   * export default {
-  *   afterTransformers: async ({html, matter, config, posthtml, transform}) => {
+  *   afterTransformers: async ({html, matter, config, posthtml}) => {
   *     // do something...
   *     return html;
   *   }
@@ -308,10 +135,6 @@ export default interface Events {
     * @param {Config} config The Maizzle config object.
     */
     posthtml: PostHTMLType;
-    /**
-    * A collection of Maizzle Transformers.
-    */
-    transform: TransformType;
   }) => string | Promise<string>;
 
   /**
@@ -323,7 +146,7 @@ export default interface Events {
   * @example
   * ```
   * export default {
-  *   afterBuild: async ({files, config, transform}) => {
+  *   afterBuild: async ({files, config}) => {
   *     // do something...
   *   }
   * }
@@ -338,9 +161,5 @@ export default interface Events {
      * The Maizzle config object.
      */
     config: Config;
-    /**
-    * A collection of Maizzle Transformers.
-    */
-    transform: TransformType;
   }) => string | Promise<string>;
 }

package/types/urlParameters.d.ts

@@ -1,7 +1,7 @@
 import type { URLParametersConfig as URLParamsConfig } from 'posthtml-url-parameters';
 
 export default interface URLParametersConfig {
-  [key: string]: any; // eslint-disable-line
+  [key: string]: any;
 
   _options?: {
     /**