@maizzle/framework 6.0.0-4 → 6.0.0-6

package/CHANGELOG.md

@@ -4,7 +4,19 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [6.0.0-3] - 2025-07-14
+## [6.0.0-6] - 2025-07-14
+
+### Fixed
+
+- use extension when importing file 99835d3
+
+## [6.0.0-5] - 2025-07-14
+
+### Changed
+
+- run css compilation before components too 272bbdb
+
+## [6.0.0-4] - 2025-07-14
 
 ### Added
 
@@ -18,6 +30,26 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 - removed `posthtml-postcss` dependency
 
+## [6.0.0-3] - 2025-07-14
+
+### Added
+
+- safelist spark targeting selectors f29efb8
+- safelist targeting for superhuman beb6b41
+- safelist notion mail targeting 5cfd68f
+
+### Changed
+
+- safelisting outlook targeting b8b21f3
+- safelisting selectors acb7b80
+
+### Fixed
+
+- safelist class names for container queries b828c44
+- purge safelisting patterns d6b9c48
+- safelisting comcast targeting selector 9677421
+- preserve yahoo mail targeting selectors 2f3429f
+
 ## [6.0.0-2] - 2025-07-11
 
 ### Fixed

package/package.json

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

package/src/posthtml/index.js

@@ -11,9 +11,10 @@ import envAttributes from './plugins/envAttributes.js'
 import { getPosthtmlOptions } from './defaultConfig.js'
 import combineMediaQueries from './plugins/combineMediaQueries.js'
 import defaultComponentsConfig from './defaultComponentsConfig.js'
+import removeRawStyleAttributes from './plugins/removeRawStyleAttributes.js'
 
 // PostCSS
-import compileCss from './plugins/postcss/compileCss.js'
+import { compileCss } from './plugins/postcss/compileCss.js'
 
 export async function process(html = '', config = {}) {
   /**
@@ -71,6 +72,7 @@ export async function process(html = '', config = {}) {
 
   return posthtml([
     ...beforePlugins,
+    compileCss(config),
     fetchPlugin,
     components(componentsConfig),
     fetchPlugin,
@@ -80,6 +82,7 @@ export async function process(html = '', config = {}) {
     compileCss(config),
     get(config, 'css.combineMediaQueries') !== false
       && combineMediaQueries(get(config, 'css.combineMediaQueries', { sort: 'mobile-first' })),
+    removeRawStyleAttributes(),
     ...get(
       config,
       'posthtml.plugins.after',

package/src/posthtml/plugins/postcss/compileCss.js

@@ -9,7 +9,7 @@ import postcssSafeParser from 'postcss-safe-parser'
 import removeDuplicateSelectors from './removeDuplicateSelectors.js'
 import cleanupTailwindArtifacts from './cleanupTailwindArtifacts.js'
 
-const validAttributeNames = new Set([
+const attributes = new Set([
   'raw',
   'plain',
   'as-is',
@@ -17,6 +17,9 @@ const validAttributeNames = new Set([
   'unprocessed',
 ])
 
+// export attributes
+export const validAttributeNames = attributes
+
 /**
  * PostHTML plugin to process Tailwind CSS within style tags.
  *
@@ -24,21 +27,14 @@ const validAttributeNames = new Set([
  * compiles it with PostCSS. `<style>` tags marked as
  * `no-process` will be skipped.
  */
-export default function compile(config = {}) {
+export function compileCss(config = {}) {
   return tree => {
     return new Promise((resolve, reject) => {
       const stylePromises = []
 
       tree.walk(node => {
         if (node.tag === 'style' && node.content) {
-          if (node.attrs && Object.keys(node.attrs).some(attr => validAttributeNames.has(attr))) {
-            // Remove the attribute
-            for (const attr of Object.keys(node.attrs)) {
-              if (validAttributeNames.has(attr)) {
-                delete node.attrs[attr]
-              }
-            }
-
+          if (node.attrs && Object.keys(node.attrs).some(attr => attributes.has(attr))) {
             return node
           }
 

package/src/posthtml/plugins/removeRawStyleAttributes.js

@@ -0,0 +1,22 @@
+import { validAttributeNames } from './postcss/compileCss.js'
+
+const plugin = () => tree => {
+  const process = node => {
+    if (node.tag === 'style') {
+      if (node.attrs && Object.keys(node.attrs).some(attr => validAttributeNames.has(attr))) {
+        // Remove the attribute
+        for (const attr of Object.keys(node.attrs)) {
+          if (validAttributeNames.has(attr)) {
+            delete node.attrs[attr]
+          }
+        }
+      }
+    }
+
+    return node
+  }
+
+  return tree.walk(process)
+}
+
+export default plugin