@maizzle/framework 5.0.0-beta.15 → 5.0.0-beta.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maizzle/framework",
-  "version": "5.0.0-beta.15",
+  "version": "5.0.0-beta.17",
   "description": "Maizzle is a framework that helps you quickly build HTML emails with Tailwind CSS.",
   "license": "MIT",
   "type": "module",
@@ -72,24 +72,25 @@
     "postcss-import": "^16.1.0",
     "postcss-safe-parser": "^7.0.0",
     "posthtml": "^0.16.6",
-    "posthtml-attrs-parser": "^1.1.0",
+    "posthtml-attrs-parser": "^1.1.1",
     "posthtml-base-url": "^3.1.4",
-    "posthtml-component": "^1.1.0",
-    "posthtml-content": "^2.0.1",
-    "posthtml-extra-attributes": "^3.0.0",
+    "posthtml-component": "^2.0.0",
+    "posthtml-content": "^2.1.0",
+    "posthtml-expressions": "^1.11.4",
+    "posthtml-extra-attributes": "^3.1.0",
     "posthtml-fetch": "^4.0.0",
-    "posthtml-markdownit": "^3.0.1",
-    "posthtml-mso": "^3.0.0",
+    "posthtml-markdownit": "^3.1.0",
+    "posthtml-mso": "^3.1.0",
     "posthtml-parser": "^0.12.0",
-    "posthtml-postcss": "^1.0.0",
-    "posthtml-postcss-merge-longhand": "^3.1.0",
+    "posthtml-postcss": "^1.0.2",
+    "posthtml-postcss-merge-longhand": "^3.1.2",
     "posthtml-render": "^3.0.0",
-    "posthtml-safe-class-names": "^4.0.2",
-    "posthtml-url-parameters": "^3.0.0",
+    "posthtml-safe-class-names": "^4.1.0",
+    "posthtml-url-parameters": "^3.1.0",
     "pretty": "^2.0.0",
     "string-remove-widows": "^4.0.22",
     "string-strip-html": "^13.4.8",
-    "tailwindcss": "^3.4.5",
+    "tailwindcss": "^3.4.7",
     "ws": "^8.17.0"
   },
   "devDependencies": {

package/src/posthtml/index.js

@@ -63,7 +63,7 @@ export async function process(html = '', config = {}) {
           },
         ),
       },
-      get(config, 'build.fetch', {})
+      get(config, 'fetch', {})
     )
   )
 
@@ -87,6 +87,8 @@ export async function process(html = '', config = {}) {
     ),
     expandLinkTag,
     postcssPlugin,
+    envTags(config.env),
+    envAttributes(config.env),
     ...get(config, 'posthtml.plugins.after', get(config, 'posthtml.plugins', []))
   ])
     .process(html, posthtmlOptions)

package/types/build.d.ts

@@ -1,5 +1,5 @@
 import type { SpinnerName } from 'cli-spinners';
-import type ExpressionsConfig from './expressions';
+import type { PostHTMLExpressions } from 'posthtml-expressions';
 
 export default interface BuildConfig {
   /**
@@ -19,9 +19,9 @@ export default interface BuildConfig {
   content?: string[];
 
   /**
-  Configure expressions.
+  Configure [posthtml-expressions](https://github.com/posthtml/posthtml-expressions) options.
   */
-  expressions?: ExpressionsConfig;
+  expressions?: PostHTMLExpressions;
 
   /**
    * Define the output path for compiled Templates, and what file extension they should use.

package/types/config.d.ts

@@ -8,11 +8,12 @@ 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';
 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 { PostHTMLFetchConfig } from 'posthtml-fetch';
+import type { PostHTMLComponents } from 'posthtml-component';
 
 import type { Config as TailwindConfig } from 'tailwindcss';
 
@@ -93,7 +94,7 @@ export default interface Config {
   /**
    * Configure components.
    */
-  components?: ComponentsConfig;
+  components?: PostHTMLComponents;
 
   /**
    * Configure how CSS is handled.
@@ -169,6 +170,11 @@ export default interface Config {
     tailwind?: TailwindConfig;
   }
 
+  /**
+   * Configure the [`<fetch>`](https://maizzle.com/docs/tags#fetch) tag.
+   */
+  fetch?: PostHTMLFetchConfig;
+
   /**
    * Transform text inside elements marked with custom attributes.
    * Filters work only on elements that contain only text.

package/types/events.d.ts

@@ -18,7 +18,12 @@ export default interface Events {
   * }
   * ```
   */
-  beforeCreate?: (params: { config: Config }) => void | Promise<void>;
+  beforeCreate?: (params: {
+    /**
+     * The computed Maizzle config object.
+     */
+    config: Config
+  }) => void | Promise<void>;
 
   /**
   * Runs after the Template's config has been computed, but just before it is compiled.
@@ -43,11 +48,13 @@ export default interface Events {
      */
     html: string;
     /**
-     * The Template's Front Matter.
+     * The Template's Front Matter data.
      */
     matter: { [key: string]: string };
     /**
      * The Template's computed config.
+     *
+     * This is the Environment config merged with the Template's Front Matter.
      */
     config: Config;
     /**
@@ -82,11 +89,13 @@ export default interface Events {
      */
     html: string;
     /**
-     * The Template's Front Matter.
+     * The Template's Front Matter data.
      */
     matter: { [key: string]: string };
     /**
      * The Template's computed config.
+     *
+     * This is the Environment config merged with the Template's Front Matter.
      */
     config: Config;
     /**
@@ -121,11 +130,13 @@ export default interface Events {
      */
     html: string;
     /**
-     * The Template's Front Matter.
+     * The Template's Front Matter data.
      */
     matter: { [key: string]: string };
     /**
      * The Template's computed config.
+     *
+     * This is the Environment config merged with the Template's Front Matter.
      */
     config: Config;
     /**
@@ -146,7 +157,7 @@ export default interface Events {
   * @example
   * ```
   * export default {
-  *   afterBuild: async ({files, config}) => {
+  *   afterBuild: async ({config, files}) => {
   *     // do something...
   *   }
   * }
@@ -154,12 +165,12 @@ export default interface Events {
   */
   afterBuild?: (params: {
     /**
-     * An array of paths to all the files inside the `build.output.path` directory.
+     * The computed Maizzle config object.
      */
-    files: string[];
+    config: Config;
     /**
-     * The Maizzle config object.
+     * An array of paths to all the files inside the `build.output.path` directory.
      */
-    config: Config;
+    files: string[];
   }) => string | Promise<string>;
 }

package/types/posthtml.d.ts

@@ -1,5 +1,5 @@
 import type { Directive } from 'posthtml-parser';
-import type ExpressionsConfig from './expressions';
+import type { PostHTMLExpressions } from 'posthtml-expressions';
 
 export interface PostHTMLOptions {
   /**
@@ -128,9 +128,9 @@ export interface PostHTMLOptions {
 
 export default interface PostHTMLConfig {
   /**
-  Configure expressions.
+  Configure [posthtml-expressions](https://github.com/posthtml/posthtml-expressions) options.
   */
-  expressions?: ExpressionsConfig;
+  expressions?: PostHTMLExpressions;
 
   /**
   Configure PostHTML options.

package/types/components.d.ts

@@ -1,195 +0,0 @@
-import type ExpressionsConfig from './expressions';
-import type { Options as PostHTMLParserOptions } from 'posthtml-parser';
-
-interface AnyObject {
-  [key: string]: string | AnyObject;
-}
-
-export default interface ComponentsConfig {
-  /**
-   * Root path where to look for folders containing component files.
-   *
-   * @default './'
-   */
-  root?: string;
-
-  /**
-   * Paths where to look for component files. Must be relative to `root`.
-   *
-   * @default ['src/components', 'src/layouts', 'src/templates']
-   */
-  folders?: string[];
-
-  /**
-   * Prefix to use for component tags.
-   *
-   * @default 'x-'
-   */
-  tagPrefix?: string;
-
-  /**
-   * Tag name to be used in HTML when using a component.
-   *
-   * @default 'component'
-   */
-  tag?: string;
-
-  /**
-   * Attribute name to be used when referencing a component via its path.
-   *
-   * @default 'src'
-   */
-  attribute?: string;
-
-  /**
-   * File extension that component files must use.
-   * Any other files will be ignored and not be made available as components.
-   *
-   * @default 'html'
-   */
-  fileExtension?: string;
-
-  /**
-   * Name of the tag that will be replaced with the content that is passed to the component.
-   *
-   * @default 'yield'
-   */
-  yield?: string;
-
-  /**
-  * Name of the slot tag, where the content will be injected.
-  *
-  * @default 'slot'
-  */
-  slot?: string;
-
-  /**
-   * Name of the fill tag, where the content to be injected is defined.
-   *
-   * @default 'fill'
-   */
-  fill?: string;
-
-  /**
-   * String to use as a separator between the slot tag and its name.
-   *
-   * @default ':'
-   */
-  slotSeparator?: string;
-
-  /**
-   * Tag name for pushing content to a stack.
-   *
-   * @default 'push'
-   */
-  push?: string;
-
-  /**
-   * Tag name for popping (rendering) content from a stack.
-   *
-   * @default 'stack'
-   */
-  stack?: string;
-
-  /**
-   * Name of the props attribute to use in the `<script>` tag of a component.
-   *
-   * @default 'props'
-   */
-  propsScriptAttribute?: string;
-
-  /**
-   * Name of the object that will be used to store the props of a component.
-   *
-   * @default 'props'
-   */
-  propsContext?: string;
-
-  /**
-   * Name of the attribute that will be used to pass props to a component as JSON.
-   *
-   * @default 'locals'
-   */
-  propsAttribute?: string;
-
-  /**
-   * Name of the key to use when retrieving props passed to a slot via `$slots.slotName.props`.
-   *
-   * @default 'props'
-   */
-  propsSlot?: string;
-
-  /**
-   * Configure [`posthtml-parser`](https://github.com/posthtml/posthtml-parser).
-   *
-   * @default
-   * {
-   *  recognizeNoValueAttribute: true,
-   *  recognizeSelfClosing: true
-   * }
-   */
-  parserOptions?: PostHTMLParserOptions;
-
-  /**
-   * Configure [`posthtml-expressions`](https://github.com/posthtml/posthtml-expressions).
-   *
-   * @default
-   * {
-   *   strictMode: false,
-   *   missingLocal: '{local}',
-   *   locals: {
-   *     page: config, // the computed Maizzle config object
-   *   }
-   * }
-   */
-  expressions?: ExpressionsConfig;
-
-  /**
-   * PostHTML plugins to apply to each parsed component.
-   *
-   * @default []
-   */
-  plugins?: Array<() => void>;
-
-  /**
-   * Extra rules for the PostHTML plugin that is used by components to parse attributes.
-   *
-   * @default {}
-   */
-  attrsParserRules?: Record<string, AnyObject>;
-
-  /**
-   * In strict mode, an error will be thrown if a component cannot be rendered.
-   *
-   * @default true
-   */
-  strict?: boolean;
-
-  /**
-   * Utility methods to be passed to `<script props>` in a component.
-   *
-   * @default {merge: _.mergeWith, template: _.template}
-   */
-  utilities?: Record<string, unknown>;
-
-  /**
-   * Define additional attributes that should be preserved for specific HTML elements.
-   *
-   * @default {}
-   */
-  elementAttributes?: Record<string, void>;
-
-  /**
-   * Attributes that should be preserved on all elements in components.
-   *
-   * @default ['data-*']
-   */
-  safelistAttributes?: string[];
-
-  /**
-   * Attributes that should be removed from all elements in components.
-   *
-   * @default []
-   */
-  blacklistAttributes?: string[];
-}

package/types/expressions.d.ts

@@ -1,100 +0,0 @@
-export default interface ExpressionsConfig {
-  /**
-  Define the starting and ending delimiters used for expressions.
-
-  @default ['{{', '}}']
-  */
-  delimiters?: string[];
-
-  /**
-  Define the starting and ending delimiters used for unescaped expressions.
-
-  @default ['{{{', '}}}']
-  */
-  unescapeDelimiters?: string[];
-
-  /**
-  Object containing data that will be available under the `page` object.
-
-  @default {}
-  */
-  locals?: Record<string, unknown>;
-
-  /**
-  Attribute name for `<script>` tags that contain locals.
-
-  @default 'locals'
-  */
-  localsAttr?: string;
-
-  /**
-  Whether to remove `<script>` tags that contain locals.
-
-  @default false
-  */
-  removeScriptLocals?: boolean;
-
-  /**
-  Tag names to be used for if/else statements.
-
-  @default ['if', 'elseif', 'else']
-  */
-  conditionalTags?: string[];
-
-  /**
-  Tag names to be used for switch statements.
-
-  @default ['switch', 'case', 'default']
-  */
-  switchTags?: string[];
-
-  /**
-  Tag names to be used for loops.
-
-  @default ['each', 'for']
-  */
-  loopTags?: string[];
-
-  /**
-  Tag names to be used for scopes.
-
-  @default ['scope']
-  */
-  scopeTags?: string[];
-
-  /**
-  Name of tag inside of which expression parsing is disabled.
-
-  @default 'raw'
-  */
-  ignoredTag?: string;
-
-  /**
-  Enabling strict mode will throw an error if an expression cannot be evaluated.
-
-  @default false
-  */
-  strictMode?: boolean;
-
-  /**
-  What to render when referencing a value that is not defined in `locals`.
-
-  By default, the string 'undefined' will be output.
-
-  @default undefined
-
-  @example
-
-  ```
-  // Output empty string if value is not defined
-  missingLocal: ''
-
-  // Output original reference if value is not defined
-  missingLocal: '{local}'
-
-  // Output custom string if value is not defined
-  missingLocal: 'ERR_NO_VALUE: {local}'
-  ```
-  */
-  missingLocal?: string;
-}