@maizzle/framework 3.7.2 → 3.7.3

package/.github/workflows/nodejs.yml

@@ -1,29 +1,29 @@
-# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
-# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
-
-name: Node.js CI
-
-on:
-  push:
-    branches: [master]
-  pull_request:
-    branches: [master]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [12, 14, 16]
-
-    steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
-        with:
-          node-version: ${{ matrix.node-version }}
-      - run: npm install
-      - run: npm test
-        env:
-          CI: true
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Node.js CI
+
+on:
+  push:
+    branches: [master]
+  pull_request:
+    branches: [master]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [12, 14, 16]
+
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: npm install
+      - run: npm test
+        env:
+          CI: true

package/package.json

@@ -1,84 +1,84 @@
-{
-  "name": "@maizzle/framework",
-  "version": "3.7.2",
-  "description": "Maizzle is a framework that helps you quickly build HTML emails with Tailwind CSS.",
-  "license": "MIT",
-  "main": "src/index.js",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/maizzle/framework.git"
-  },
-  "bugs": "https://github.com/maizzle/framework/issues",
-  "homepage": "https://maizzle.com",
-  "author": "Cosmin Popovici (https://github.com/cossssmin)",
-  "keywords": [
-    "maizzle",
-    "tailwindcss",
-    "responsive-email",
-    "email-framework",
-    "email-template",
-    "email-marketing",
-    "email-campaigns",
-    "email-newsletter",
-    "email-boilerplate",
-    "html-emails"
-  ],
-  "publishConfig": {
-    "access": "public"
-  },
-  "scripts": {
-    "test": "xo && nyc ava -s",
-    "style": "xo",
-    "release": "np"
-  },
-  "dependencies": {
-    "browser-sync": "^2.26.13",
-    "color-shorthand-hex-to-six-digit": "^3.0.2",
-    "email-comb": "^5.0.0",
-    "front-matter": "^4.0.0",
-    "fs-extra": "^10.0.0",
-    "glob-promise": "^4.1.0",
-    "html-crush": "^4.0.0",
-    "juice": "^8.0.0",
-    "lodash": "^4.17.20",
-    "ora": "^5.1.0",
-    "postcss": "^8.2.14",
-    "postcss-import": "^14.0.0",
-    "postcss-merge-longhand": "^5.0.1",
-    "posthtml": "^0.16.4",
-    "posthtml-attrs-parser": "^0.1.1",
-    "posthtml-content": "^0.0.3",
-    "posthtml-expressions": "^1.8.1",
-    "posthtml-extend": "^0.6.0",
-    "posthtml-extra-attributes": "^1.0.0",
-    "posthtml-fetch": "^2.0.0",
-    "posthtml-markdownit": "^1.2.2",
-    "posthtml-modules": "^0.7.4",
-    "posthtml-mso": "^1.0.2",
-    "posthtml-postcss-merge-longhand": "^1.0.2",
-    "posthtml-remove-attributes": "^1.0.0",
-    "posthtml-safe-class-names": "^1.0.4",
-    "posthtml-url-parameters": "^1.0.4",
-    "pretty": "^2.0.0",
-    "prevent-widows": "^1.0.2",
-    "query-string": "^7.0.0",
-    "string-strip-html": "^8.2.0",
-    "tailwindcss": "^2.2.2",
-    "tailwindcss-box-shadow": "^1.0.0"
-  },
-  "devDependencies": {
-    "autoprefixer": "^10.0.2",
-    "ava": "^3.13.0",
-    "np": "*",
-    "nyc": "^15.1.0",
-    "xo": "0.39.1"
-  },
-  "engines": {
-    "node": ">=12.13.0"
-  },
-  "ava": {
-    "files": [
-      "test/**/test*.js"
-    ]
-  }
-}
+{
+  "name": "@maizzle/framework",
+  "version": "3.7.3",
+  "description": "Maizzle is a framework that helps you quickly build HTML emails with Tailwind CSS.",
+  "license": "MIT",
+  "main": "src/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/maizzle/framework.git"
+  },
+  "bugs": "https://github.com/maizzle/framework/issues",
+  "homepage": "https://maizzle.com",
+  "author": "Cosmin Popovici (https://github.com/cossssmin)",
+  "keywords": [
+    "maizzle",
+    "tailwindcss",
+    "responsive-email",
+    "email-framework",
+    "email-template",
+    "email-marketing",
+    "email-campaigns",
+    "email-newsletter",
+    "email-boilerplate",
+    "html-emails"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "test": "xo && nyc ava -s",
+    "style": "xo",
+    "release": "np"
+  },
+  "dependencies": {
+    "browser-sync": "^2.26.13",
+    "color-shorthand-hex-to-six-digit": "^3.0.2",
+    "email-comb": "^5.0.0",
+    "front-matter": "^4.0.0",
+    "fs-extra": "^10.0.0",
+    "glob-promise": "^4.1.0",
+    "html-crush": "^4.0.0",
+    "juice": "^8.0.0",
+    "lodash": "^4.17.20",
+    "ora": "^5.1.0",
+    "postcss": "^8.2.14",
+    "postcss-import": "^14.0.0",
+    "postcss-merge-longhand": "^5.0.1",
+    "posthtml": "^0.16.4",
+    "posthtml-attrs-parser": "^0.1.1",
+    "posthtml-content": "^0.0.3",
+    "posthtml-expressions": "^1.8.1",
+    "posthtml-extend": "^0.6.0",
+    "posthtml-extra-attributes": "^1.0.0",
+    "posthtml-fetch": "^2.0.0",
+    "posthtml-markdownit": "^1.2.2",
+    "posthtml-modules": "^0.7.4",
+    "posthtml-mso": "^1.0.2",
+    "posthtml-postcss-merge-longhand": "^1.0.2",
+    "posthtml-remove-attributes": "^1.0.0",
+    "posthtml-safe-class-names": "^1.0.4",
+    "posthtml-url-parameters": "^1.0.4",
+    "pretty": "^2.0.0",
+    "prevent-widows": "^1.0.2",
+    "query-string": "^7.0.0",
+    "string-strip-html": "^8.2.0",
+    "tailwindcss": "^2.2.2",
+    "tailwindcss-box-shadow": "^1.0.0"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.0.2",
+    "ava": "^3.13.0",
+    "np": "*",
+    "nyc": "^15.1.0",
+    "xo": "0.39.1"
+  },
+  "engines": {
+    "node": ">=12.13.0"
+  },
+  "ava": {
+    "files": [
+      "test/**/test*.js"
+    ]
+  }
+}

package/src/generators/posthtml.js

@@ -1,60 +1,60 @@
-const fm = require('front-matter')
-const posthtml = require('posthtml')
-const {get, merge} = require('lodash')
-const fetch = require('posthtml-fetch')
-const layouts = require('posthtml-extend')
-const modules = require('posthtml-modules')
-const expressions = require('posthtml-expressions')
-
-module.exports = async (html, config) => {
-  const layoutsOptions = get(config, 'build.layouts', {})
-
-  const fetchOptions = get(config, 'build.posthtml.fetch', {})
-  const fetchPlugin = fetch({...fetchOptions})
-
-  const modulesOptions = get(config, 'build.components', {})
-  // Fake `from` option so we can reference modules relatively
-  const modulesRoot = modulesOptions.root || './'
-  const modulesFrom = modulesOptions.from || `${modulesRoot}/fake`
-
-  const posthtmlOptions = get(config, 'build.posthtml.options', {})
-  const posthtmlPlugins = get(config, 'build.posthtml.plugins', [])
-
-  const expressionsOptions = merge({strictMode: false}, get(config, 'build.posthtml.expressions', {}))
-
-  const locals = merge(
-    get(expressionsOptions, 'locals', {}),
-    get(config, 'locals', {}),
-    {page: config}
-  )
-
-  return posthtml([
-    fetchPlugin,
-    layouts(
-      merge(
-        {
-          strict: false,
-          plugins: [
-            expressions({...expressionsOptions, locals})
-          ]
-        },
-        layoutsOptions
-      )
-    ),
-    modules({
-      parser: posthtmlOptions,
-      from: modulesFrom,
-      root: modulesRoot,
-      tag: 'component',
-      attribute: 'src',
-      plugins: [
-        fetchPlugin
-      ],
-      locals,
-      ...modulesOptions
-    }),
-    ...posthtmlPlugins
-  ])
-    .process(html, {...posthtmlOptions})
-    .then(result => fm(result.html).body)
-}
+const fm = require('front-matter')
+const posthtml = require('posthtml')
+const {get, merge} = require('lodash')
+const fetch = require('posthtml-fetch')
+const layouts = require('posthtml-extend')
+const modules = require('posthtml-modules')
+const expressions = require('posthtml-expressions')
+
+module.exports = async (html, config) => {
+  const layoutsOptions = get(config, 'build.layouts', {})
+
+  const fetchOptions = get(config, 'build.posthtml.fetch', {})
+  const fetchPlugin = fetch({...fetchOptions})
+
+  const modulesOptions = get(config, 'build.components', {})
+  // Fake `from` option so we can reference modules relatively
+  const modulesRoot = modulesOptions.root || './'
+  const modulesFrom = modulesOptions.from || `${modulesRoot}/fake`
+
+  const posthtmlOptions = get(config, 'build.posthtml.options', {})
+  const posthtmlPlugins = get(config, 'build.posthtml.plugins', [])
+
+  const expressionsOptions = merge({strictMode: false}, get(config, 'build.posthtml.expressions', {}))
+
+  const locals = merge(
+    get(expressionsOptions, 'locals', {}),
+    get(config, 'locals', {}),
+    {page: config}
+  )
+
+  return posthtml([
+    fetchPlugin,
+    layouts(
+      merge(
+        {
+          strict: false,
+          plugins: [
+            expressions({...expressionsOptions, locals})
+          ]
+        },
+        layoutsOptions
+      )
+    ),
+    modules({
+      parser: posthtmlOptions,
+      from: modulesFrom,
+      root: modulesRoot,
+      tag: 'component',
+      attribute: 'src',
+      plugins: [
+        fetchPlugin
+      ],
+      locals,
+      ...modulesOptions
+    }),
+    ...posthtmlPlugins
+  ])
+    .process(html, {...posthtmlOptions})
+    .then(result => fm(result.html).body)
+}

package/src/generators/tailwindcss.js

@@ -1,84 +1,84 @@
-const path = require('path')
-const fs = require('fs-extra')
-const postcss = require('postcss')
-const tailwindcss = require('tailwindcss')
-const postcssImport = require('postcss-import')
-const postcssNested = require('tailwindcss/nesting')
-const {requireUncached} = require('../utils/helpers')
-const mergeLonghand = require('postcss-merge-longhand')
-const {get, isObject, isEmpty, merge} = require('lodash')
-
-module.exports = {
-  compile: async (css = '', html = '', tailwindConfig = {}, maizzleConfig = {}) => {
-    tailwindConfig = (isObject(tailwindConfig) && !isEmpty(tailwindConfig)) ? tailwindConfig : get(maizzleConfig, 'build.tailwind.config', 'tailwind.config.js')
-
-    // Compute the Tailwind config to use
-    const userConfig = () => {
-      // If a custom config object was passed, use that
-      if (isObject(tailwindConfig) && !isEmpty(tailwindConfig)) {
-        return tailwindConfig
-      }
-
-      /**
-       * Try loading a fresh tailwind.config.js, with fallback to an empty object.
-       * This will use the default Tailwind config (with rem units etc)
-       */
-      try {
-        return requireUncached(path.resolve(process.cwd(), tailwindConfig))
-      } catch {
-        return {}
-      }
-    }
-
-    // Merge user's Tailwind config on top of a 'base' config
-    const config = merge({
-      important: true,
-      purge: {
-        enabled: maizzleConfig.env !== 'local',
-        content: [
-          'src/**/*.*',
-          {raw: html}
-        ],
-        options: get(maizzleConfig, 'purgeCSS', {})
-      },
-      corePlugins: {
-        animation: false,
-        backgroundOpacity: false,
-        borderOpacity: false,
-        boxShadow: false,
-        divideOpacity: false,
-        placeholderOpacity: false,
-        ringColor: false,
-        ringWidth: false,
-        ringOpacity: false,
-        ringOffsetColor: false,
-        textOpacity: false
-      },
-      plugins: []
-    }, userConfig())
-
-    // Merge user's Tailwind plugins with our default ones
-    config.plugins.push(require('tailwindcss-box-shadow'))
-
-    const userFilePath = get(maizzleConfig, 'build.tailwind.css', path.join(process.cwd(), 'src/css/tailwind.css'))
-
-    css = await fs.pathExists(userFilePath).then(async exists => {
-      if (exists) {
-        const userFileCSS = await fs.readFile(path.resolve(userFilePath), 'utf8')
-        return userFileCSS
-      }
-
-      return css
-    })
-
-    return postcss([
-      postcssImport({path: userFilePath ? path.dirname(userFilePath) : []}),
-      postcssNested(),
-      tailwindcss(config),
-      maizzleConfig.env === 'local' ? () => {} : mergeLonghand(),
-      ...get(maizzleConfig, 'build.postcss.plugins', [])
-    ])
-      .process(css, {from: undefined})
-      .then(result => result.css)
-  }
-}
+const path = require('path')
+const fs = require('fs-extra')
+const postcss = require('postcss')
+const tailwindcss = require('tailwindcss')
+const postcssImport = require('postcss-import')
+const postcssNested = require('tailwindcss/nesting')
+const {requireUncached} = require('../utils/helpers')
+const mergeLonghand = require('postcss-merge-longhand')
+const {get, isObject, isEmpty, merge} = require('lodash')
+
+module.exports = {
+  compile: async (css = '', html = '', tailwindConfig = {}, maizzleConfig = {}) => {
+    tailwindConfig = (isObject(tailwindConfig) && !isEmpty(tailwindConfig)) ? tailwindConfig : get(maizzleConfig, 'build.tailwind.config', 'tailwind.config.js')
+
+    // Compute the Tailwind config to use
+    const userConfig = () => {
+      // If a custom config object was passed, use that
+      if (isObject(tailwindConfig) && !isEmpty(tailwindConfig)) {
+        return tailwindConfig
+      }
+
+      /**
+       * Try loading a fresh tailwind.config.js, with fallback to an empty object.
+       * This will use the default Tailwind config (with rem units etc)
+       */
+      try {
+        return requireUncached(path.resolve(process.cwd(), tailwindConfig))
+      } catch {
+        return {}
+      }
+    }
+
+    // Merge user's Tailwind config on top of a 'base' config
+    const config = merge({
+      important: true,
+      purge: {
+        enabled: maizzleConfig.env !== 'local',
+        content: [
+          'src/**/*.*',
+          {raw: html}
+        ],
+        options: get(maizzleConfig, 'purgeCSS', {})
+      },
+      corePlugins: {
+        animation: false,
+        backgroundOpacity: false,
+        borderOpacity: false,
+        boxShadow: false,
+        divideOpacity: false,
+        placeholderOpacity: false,
+        ringColor: false,
+        ringWidth: false,
+        ringOpacity: false,
+        ringOffsetColor: false,
+        textOpacity: false
+      },
+      plugins: []
+    }, userConfig())
+
+    // Merge user's Tailwind plugins with our default ones
+    config.plugins.push(require('tailwindcss-box-shadow'))
+
+    const userFilePath = get(maizzleConfig, 'build.tailwind.css', path.join(process.cwd(), 'src/css/tailwind.css'))
+
+    css = await fs.pathExists(userFilePath).then(async exists => {
+      if (exists) {
+        const userFileCSS = await fs.readFile(path.resolve(userFilePath), 'utf8')
+        return userFileCSS + css
+      }
+
+      return css
+    })
+
+    return postcss([
+      postcssImport({path: userFilePath ? path.dirname(userFilePath) : []}),
+      postcssNested(),
+      tailwindcss(config),
+      maizzleConfig.env === 'local' ? () => {} : mergeLonghand(),
+      ...get(maizzleConfig, 'build.postcss.plugins', [])
+    ])
+      .process(css, {from: undefined})
+      .then(result => result.css)
+  }
+}

package/src/transformers/base-image-url.js

@@ -1,9 +1,9 @@
-module.exports = async (html, config = {}, direct = false) => {
-  const url = direct ? config : config.baseImageURL
-
-  if (url) {
-    return html.replace(/([^"'=\s(]+\.(?:jpe?g|a?png|avif|gif|svg|webp|jfif|pjpeg|pjp))/gi, url + '$1')
-  }
-
-  return html
-}
+module.exports = async (html, config = {}, direct = false) => {
+  const url = direct ? config : config.baseImageURL
+
+  if (url) {
+    return html.replace(/([^"'=\s(]+\.(?:jpe?g|a?png|avif|gif|svg|webp|jfif|pjpeg|pjp))/gi, url + '$1')
+  }
+
+  return html
+}

package/src/transformers/index.js

@@ -1,57 +1,57 @@
-const inline = require('./inline')
-const minify = require('./minify')
-const markdown = require('./markdown')
-const prettify = require('./prettify')
-const ensureSixHEX = require('./six-hex')
-const addURLParams = require('./url-params')
-const transformContents = require('./transform')
-const preventWidows = require('./prevent-widows')
-const replaceStrings = require('./replace-strings')
-const safeClassNames = require('./safe-class-names')
-const applyBaseImageUrl = require('./base-image-url')
-const removeUnusedCSS = require('./remove-unused-css')
-const removeAttributes = require('./remove-attributes')
-const attributeToStyle = require('./attribute-to-style')
-const removeInlineSizes = require('./remove-inline-sizes')
-const applyExtraAttributes = require('./extra-attributes')
-const removeInlineBgColor = require('./remove-inline-bgcolor')
-
-exports.process = async (html, config) => {
-  html = await safeClassNames(html, config)
-  html = await transformContents(html, config)
-  html = await markdown(html, config)
-  html = await preventWidows(html, config)
-  html = await attributeToStyle(html, config)
-  html = await inline(html, config)
-  html = await removeUnusedCSS(html, config)
-  html = await removeInlineSizes(html, config)
-  html = await removeInlineBgColor(html, config)
-  html = await removeAttributes(html, config)
-  html = await applyExtraAttributes(html, config)
-  html = await applyBaseImageUrl(html, config)
-  html = await addURLParams(html, config)
-  html = await ensureSixHEX(html, config)
-  html = await prettify(html, config)
-  html = await minify(html, config)
-  html = await replaceStrings(html, config)
-
-  return html
-}
-
-exports.inlineCSS = (html, config) => inline(html, config, true)
-exports.minify = (html, config) => minify(html, config, true)
-exports.markdown = (html, config) => markdown(html, config, true)
-exports.prettify = (html, config) => prettify(html, config, true)
-exports.ensureSixHEX = (html, config) => ensureSixHEX(html, config)
-exports.addURLParams = (html, config) => addURLParams(html, config, true)
-exports.transformContents = (html, config) => transformContents(html, config, true)
-exports.preventWidows = (html, config) => preventWidows(html, config, true)
-exports.replaceStrings = (html, config) => replaceStrings(html, config, true)
-exports.safeClassNames = (html, config) => safeClassNames(html, config, true)
-exports.applyBaseImageUrl = (html, config) => applyBaseImageUrl(html, config, true)
-exports.removeUnusedCSS = (html, config) => removeUnusedCSS(html, config, true)
-exports.removeAttributes = (html, config) => removeAttributes(html, config, true)
-exports.removeInlineSizes = (html, config) => removeInlineSizes(html, config, true)
-exports.applyExtraAttributes = (html, config) => applyExtraAttributes(html, config, true)
-exports.removeInlineBgColor = (html, config) => removeInlineBgColor(html, config, true)
-exports.attributeToStyle = (html, config) => attributeToStyle(html, config, true)
+const inline = require('./inline')
+const minify = require('./minify')
+const markdown = require('./markdown')
+const prettify = require('./prettify')
+const ensureSixHEX = require('./six-hex')
+const addURLParams = require('./url-params')
+const transformContents = require('./transform')
+const preventWidows = require('./prevent-widows')
+const replaceStrings = require('./replace-strings')
+const safeClassNames = require('./safe-class-names')
+const applyBaseImageUrl = require('./base-image-url')
+const removeUnusedCSS = require('./remove-unused-css')
+const removeAttributes = require('./remove-attributes')
+const attributeToStyle = require('./attribute-to-style')
+const removeInlineSizes = require('./remove-inline-sizes')
+const applyExtraAttributes = require('./extra-attributes')
+const removeInlineBgColor = require('./remove-inline-bgcolor')
+
+exports.process = async (html, config) => {
+  html = await safeClassNames(html, config)
+  html = await transformContents(html, config)
+  html = await markdown(html, config)
+  html = await preventWidows(html, config)
+  html = await attributeToStyle(html, config)
+  html = await inline(html, config)
+  html = await removeUnusedCSS(html, config)
+  html = await removeInlineSizes(html, config)
+  html = await removeInlineBgColor(html, config)
+  html = await removeAttributes(html, config)
+  html = await applyExtraAttributes(html, config)
+  html = await applyBaseImageUrl(html, config)
+  html = await addURLParams(html, config)
+  html = await ensureSixHEX(html, config)
+  html = await prettify(html, config)
+  html = await minify(html, config)
+  html = await replaceStrings(html, config)
+
+  return html
+}
+
+exports.inlineCSS = (html, config) => inline(html, config, true)
+exports.minify = (html, config) => minify(html, config, true)
+exports.markdown = (html, config) => markdown(html, config, true)
+exports.prettify = (html, config) => prettify(html, config, true)
+exports.ensureSixHEX = (html, config) => ensureSixHEX(html, config)
+exports.addURLParams = (html, config) => addURLParams(html, config, true)
+exports.transformContents = (html, config) => transformContents(html, config, true)
+exports.preventWidows = (html, config) => preventWidows(html, config, true)
+exports.replaceStrings = (html, config) => replaceStrings(html, config, true)
+exports.safeClassNames = (html, config) => safeClassNames(html, config, true)
+exports.applyBaseImageUrl = (html, config) => applyBaseImageUrl(html, config, true)
+exports.removeUnusedCSS = (html, config) => removeUnusedCSS(html, config, true)
+exports.removeAttributes = (html, config) => removeAttributes(html, config, true)
+exports.removeInlineSizes = (html, config) => removeInlineSizes(html, config, true)
+exports.applyExtraAttributes = (html, config) => applyExtraAttributes(html, config, true)
+exports.removeInlineBgColor = (html, config) => removeInlineBgColor(html, config, true)
+exports.attributeToStyle = (html, config) => attributeToStyle(html, config, true)