@keycloakify/angular-email 1.4.0 → 1.6.0

package/fesm2022/keycloakify-angular-email.mjs

@@ -1,899 +1,2684 @@
-import * as i0 from '@angular/core';
-import { input, computed, ChangeDetectionStrategy, Component, effect, CUSTOM_ELEMENTS_SCHEMA, inject, DOCUMENT, NO_ERRORS_SCHEMA, provideZonelessChangeDetection } from '@angular/core';
-import { NgTemplateOutlet } from '@angular/common';
-import { bootstrapApplication } from '@angular/platform-browser';
-import { renderApplication } from '@angular/platform-server';
-import { provideServerRendering } from '@angular/ssr';
-import * as cheerio from 'cheerio/slim';
-import { convert } from 'html-to-text';
-import juice from 'juice';
-import prettyPrint from 'pretty';
-
-class BackgroundComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $width = input(0, { ...(ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {}), alias: 'width' });
-    $height = input(0, { ...(ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {}), alias: 'height' });
-    $src = input(undefined, { ...(ngDevMode ? { debugName: "$src" } : /* istanbul ignore next */ {}), alias: 'src' });
-    $bgRepeat = input('no-repeat', { ...(ngDevMode ? { debugName: "$bgRepeat" } : /* istanbul ignore next */ {}), alias: 'bgRepeat' });
-    $bgColor = input(undefined, { ...(ngDevMode ? { debugName: "$bgColor" } : /* istanbul ignore next */ {}), alias: 'bgColor' });
-    $bgStyle = computed(() => ({ backgroundRepeat: this.$bgRepeat(), ...(this.$style() ?? {}) }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$bgStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BackgroundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: BackgroundComponent, isStandalone: true, selector: "ng-email-background", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $width: { classPropertyName: "$width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, $src: { classPropertyName: "$src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, $bgRepeat: { classPropertyName: "$bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, $bgColor: { classPropertyName: "$bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let width = $width();\n@let height = $height();\n\n<table\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  [border]=\"0\"\n  width=\"100%\"\n  [attr.height]=\"height\"\n  role=\"presentation\"\n>\n  <tr>\n    <td\n      [align]=\"'top'\"\n      [width]=\"width\"\n      [height]=\"height && width ? height : undefined\"\n      [attr.bgcolor]=\"$bgColor()\"\n      [attr.background]=\"$src()\"\n      [style]=\"$bgStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <ng-content />\n    </td>\n  </tr>\n</table>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BackgroundComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-background', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "@let width = $width();\n@let height = $height();\n\n<table\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  [border]=\"0\"\n  width=\"100%\"\n  [attr.height]=\"height\"\n  role=\"presentation\"\n>\n  <tr>\n    <td\n      [align]=\"'top'\"\n      [width]=\"width\"\n      [height]=\"height && width ? height : undefined\"\n      [attr.bgcolor]=\"$bgColor()\"\n      [attr.background]=\"$src()\"\n      [style]=\"$bgStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <ng-content />\n    </td>\n  </tr>\n</table>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], $height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], $src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], $bgRepeat: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgRepeat", required: false }] }], $bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }] } });
-
-class BodyComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: BodyComponent, isStandalone: true, selector: "ng-email-body", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<body\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</body>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BodyComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-body', changeDetection: ChangeDetectionStrategy.OnPush, template: "<body\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</body>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }] } });
-
-class ButtonComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(null, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $href = input(undefined, { ...(ngDevMode ? { debugName: "$href" } : /* istanbul ignore next */ {}), alias: 'href' });
-    $textContent = input.required({ ...(ngDevMode ? { debugName: "$textContent" } : /* istanbul ignore next */ {}), alias: 'textContent' });
-    $width = input(undefined, { ...(ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {}), alias: 'width' });
-    $height = input(undefined, { ...(ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {}), alias: 'height' });
-    $borderRadius = input(0, { ...(ngDevMode ? { debugName: "$borderRadius" } : /* istanbul ignore next */ {}), alias: 'borderRadius' });
-    $textColor = input(undefined, { ...(ngDevMode ? { debugName: "$textColor" } : /* istanbul ignore next */ {}), alias: 'textColor' });
-    $backgroundColor = input(undefined, { ...(ngDevMode ? { debugName: "$backgroundColor" } : /* istanbul ignore next */ {}), alias: 'backgroundColor' });
-    $borderColor = input(undefined, { ...(ngDevMode ? { debugName: "$borderColor" } : /* istanbul ignore next */ {}), alias: 'borderColor' });
-    $borderSize = input(1, { ...(ngDevMode ? { debugName: "$borderSize" } : /* istanbul ignore next */ {}), alias: 'borderSize' });
-    $fontSize = input(16, { ...(ngDevMode ? { debugName: "$fontSize" } : /* istanbul ignore next */ {}), alias: 'fontSize' });
-    $align = input('left', { ...(ngDevMode ? { debugName: "$align" } : /* istanbul ignore next */ {}), alias: 'align' });
-    $withBackground = input(false, { ...(ngDevMode ? { debugName: "$withBackground" } : /* istanbul ignore next */ {}), alias: 'withBackground' });
-    $arcsize = computed(() => Math.floor((this.$borderRadius() / (this.$height() ?? 1)) * 100), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$arcsize" }] : /* istanbul ignore next */ []));
-    $lineHeight = computed(() => this.$borderSize() ? (this.$height() ?? 0) - 2 * this.$borderSize() : (this.$height() ?? 0), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$lineHeight" }] : /* istanbul ignore next */ []));
-    $baseStyle = computed(() => ({
-        '-webkit-text-size-adjust': 'none',
-        borderRadius: `${this.$borderRadius()}px`,
-        display: 'inline-block',
-        fontSize: `${this.$fontSize()}px`,
-        lineHeight: `${this.$lineHeight()}px`,
-        maxWidth: this.$width() ? `${this.$width()}px` : undefined,
-        textAlign: 'center',
-        textDecoration: 'none',
-        width: '100%',
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$baseStyle" }] : /* istanbul ignore next */ []));
-    $borderStyles = computed(() => ({
-        border: `${this.$borderSize()}px solid ${this.$borderColor()}`,
-        msoBorderAlt: 'none',
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$borderStyles" }] : /* istanbul ignore next */ []));
-    $propStyles = computed(() => ({
-        // border styles
-        ...(this.$borderColor() ? this.$borderStyles() : {}),
-        // background styles
-        ...(this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {}),
-        // text styles
-        ...(this.$textColor() ? { color: this.$textColor() } : {}),
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$propStyles" }] : /* istanbul ignore next */ []));
-    $withBackgroundStyle = computed(() => ({
-        ...this.$baseStyle(),
-        // background styles
-        ...(this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {}),
-        // text styles
-        ...(this.$textColor() ? { color: this.$textColor() } : {}),
-        ...(this.$style() ?? {}),
-        ...(this.$withBackground() ? {} : { msoHide: 'all' }),
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$withBackgroundStyle" }] : /* istanbul ignore next */ []));
-    $withoutBackgroundStyle = computed(() => ({
-        ...this.$baseStyle(),
-        // background styles
-        ...this.$propStyles(),
-        ...(this.$style() ?? {}),
-        ...(this.$withBackground() ? {} : { msoHide: 'all' }),
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$withoutBackgroundStyle" }] : /* istanbul ignore next */ []));
-    $noBgInnerHtml = computed(() => {
-        const href = this.$href();
-        const borderColor = this.$borderColor();
-        const borderSize = this.$borderSize();
-        const height = this.$height();
-        const width = this.$width();
-        const arcsize = this.$arcsize();
-        const backgroundColor = this.$backgroundColor();
-        const fontSize = this.$fontSize();
-        const textColor = this.$textColor();
-        const textContent = this.$textContent();
-        return `<!--[if mso]>
-            <v:roundrect href="${href}" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="${height !== undefined ? `height:${height}px` : ''};v-text-anchor:middle;${width !== undefined ? `height:${width}px` : ''};" arcsize="${arcsize}%" ${borderColor ? `strokecolor=${borderColor}` : ''} ${borderSize ? `strokeweight="${borderSize}px"` : `stroke="false"`} ${backgroundColor ? `fillcolor=${backgroundColor}` : `fill="false"`}>
+import * as i0 from "@angular/core";
+import { CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, Component, DOCUMENT, NO_ERRORS_SCHEMA, computed, effect, inject, input, provideZonelessChangeDetection } from "@angular/core";
+import { NgTemplateOutlet } from "@angular/common";
+import { bootstrapApplication } from "@angular/platform-browser";
+import { renderApplication } from "@angular/platform-server";
+import { provideServerRendering } from "@angular/ssr";
+import * as cheerio from "cheerio/slim";
+import { convert } from "html-to-text";
+import juice from "juice";
+import prettyPrint from "pretty";
+var BackgroundComponent = class BackgroundComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$width = input(0, {
+		...ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {},
+		alias: "width"
+	});
+	$height = input(0, {
+		...ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {},
+		alias: "height"
+	});
+	$src = input(void 0, {
+		...ngDevMode ? { debugName: "$src" } : /* istanbul ignore next */ {},
+		alias: "src"
+	});
+	$bgRepeat = input("no-repeat", {
+		...ngDevMode ? { debugName: "$bgRepeat" } : /* istanbul ignore next */ {},
+		alias: "bgRepeat"
+	});
+	$bgColor = input(void 0, {
+		...ngDevMode ? { debugName: "$bgColor" } : /* istanbul ignore next */ {},
+		alias: "bgColor"
+	});
+	$bgStyle = computed(() => ({
+		backgroundRepeat: this.$bgRepeat(),
+		...this.$style() ?? {}
+	}), ...ngDevMode ? [{ debugName: "$bgStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: BackgroundComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: BackgroundComponent,
+		isStandalone: true,
+		selector: "ng-email-background",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$width: {
+				classPropertyName: "$width",
+				publicName: "width",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$height: {
+				classPropertyName: "$height",
+				publicName: "height",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$src: {
+				classPropertyName: "$src",
+				publicName: "src",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$bgRepeat: {
+				classPropertyName: "$bgRepeat",
+				publicName: "bgRepeat",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$bgColor: {
+				classPropertyName: "$bgColor",
+				publicName: "bgColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let width = $width();\n@let height = $height();\n\n<table\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  [border]=\"0\"\n  width=\"100%\"\n  [attr.height]=\"height\"\n  role=\"presentation\"\n>\n  <tr>\n    <td\n      [align]=\"'top'\"\n      [width]=\"width\"\n      [height]=\"height && width ? height : undefined\"\n      [attr.bgcolor]=\"$bgColor()\"\n      [attr.background]=\"$src()\"\n      [style]=\"$bgStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <ng-content />\n    </td>\n  </tr>\n</table>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: BackgroundComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-background",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [],
+			template: "@let width = $width();\n@let height = $height();\n\n<table\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  [border]=\"0\"\n  width=\"100%\"\n  [attr.height]=\"height\"\n  role=\"presentation\"\n>\n  <tr>\n    <td\n      [align]=\"'top'\"\n      [width]=\"width\"\n      [height]=\"height && width ? height : undefined\"\n      [attr.bgcolor]=\"$bgColor()\"\n      [attr.background]=\"$src()\"\n      [style]=\"$bgStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <ng-content />\n    </td>\n  </tr>\n</table>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$width: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "width",
+				required: false
+			}]
+		}],
+		$height: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "height",
+				required: false
+			}]
+		}],
+		$src: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "src",
+				required: false
+			}]
+		}],
+		$bgRepeat: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "bgRepeat",
+				required: false
+			}]
+		}],
+		$bgColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "bgColor",
+				required: false
+			}]
+		}]
+	}
+});
+var BodyComponent = class BodyComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: BodyComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: BodyComponent,
+		isStandalone: true,
+		selector: "ng-email-body",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<body\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</body>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: BodyComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-body",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<body\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</body>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}]
+	}
+});
+var ButtonComponent = class ButtonComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(null, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$href = input(void 0, {
+		...ngDevMode ? { debugName: "$href" } : /* istanbul ignore next */ {},
+		alias: "href"
+	});
+	$textContent = input.required({
+		...ngDevMode ? { debugName: "$textContent" } : /* istanbul ignore next */ {},
+		alias: "textContent"
+	});
+	$width = input(void 0, {
+		...ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {},
+		alias: "width"
+	});
+	$height = input(void 0, {
+		...ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {},
+		alias: "height"
+	});
+	$borderRadius = input(0, {
+		...ngDevMode ? { debugName: "$borderRadius" } : /* istanbul ignore next */ {},
+		alias: "borderRadius"
+	});
+	$textColor = input(void 0, {
+		...ngDevMode ? { debugName: "$textColor" } : /* istanbul ignore next */ {},
+		alias: "textColor"
+	});
+	$backgroundColor = input(void 0, {
+		...ngDevMode ? { debugName: "$backgroundColor" } : /* istanbul ignore next */ {},
+		alias: "backgroundColor"
+	});
+	$borderColor = input(void 0, {
+		...ngDevMode ? { debugName: "$borderColor" } : /* istanbul ignore next */ {},
+		alias: "borderColor"
+	});
+	$borderSize = input(1, {
+		...ngDevMode ? { debugName: "$borderSize" } : /* istanbul ignore next */ {},
+		alias: "borderSize"
+	});
+	$fontSize = input(16, {
+		...ngDevMode ? { debugName: "$fontSize" } : /* istanbul ignore next */ {},
+		alias: "fontSize"
+	});
+	$align = input("left", {
+		...ngDevMode ? { debugName: "$align" } : /* istanbul ignore next */ {},
+		alias: "align"
+	});
+	$withBackground = input(false, {
+		...ngDevMode ? { debugName: "$withBackground" } : /* istanbul ignore next */ {},
+		alias: "withBackground"
+	});
+	$arcsize = computed(() => Math.floor(this.$borderRadius() / (this.$height() ?? 1) * 100), ...ngDevMode ? [{ debugName: "$arcsize" }] : /* istanbul ignore next */ []);
+	$lineHeight = computed(() => this.$borderSize() ? (this.$height() ?? 0) - 2 * this.$borderSize() : this.$height() ?? 0, ...ngDevMode ? [{ debugName: "$lineHeight" }] : /* istanbul ignore next */ []);
+	$baseStyle = computed(() => ({
+		"-webkit-text-size-adjust": "none",
+		borderRadius: `${this.$borderRadius()}px`,
+		display: "inline-block",
+		fontSize: `${this.$fontSize()}px`,
+		lineHeight: `${this.$lineHeight()}px`,
+		maxWidth: this.$width() ? `${this.$width()}px` : void 0,
+		textAlign: "center",
+		textDecoration: "none",
+		width: "100%"
+	}), ...ngDevMode ? [{ debugName: "$baseStyle" }] : /* istanbul ignore next */ []);
+	$borderStyles = computed(() => ({
+		border: `${this.$borderSize()}px solid ${this.$borderColor()}`,
+		msoBorderAlt: "none"
+	}), ...ngDevMode ? [{ debugName: "$borderStyles" }] : /* istanbul ignore next */ []);
+	$propStyles = computed(() => ({
+		...this.$borderColor() ? this.$borderStyles() : {},
+		...this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {},
+		...this.$textColor() ? { color: this.$textColor() } : {}
+	}), ...ngDevMode ? [{ debugName: "$propStyles" }] : /* istanbul ignore next */ []);
+	$withBackgroundStyle = computed(() => ({
+		...this.$baseStyle(),
+		...this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {},
+		...this.$textColor() ? { color: this.$textColor() } : {},
+		...this.$style() ?? {},
+		...this.$withBackground() ? {} : { msoHide: "all" }
+	}), ...ngDevMode ? [{ debugName: "$withBackgroundStyle" }] : /* istanbul ignore next */ []);
+	$withoutBackgroundStyle = computed(() => ({
+		...this.$baseStyle(),
+		...this.$propStyles(),
+		...this.$style() ?? {},
+		...this.$withBackground() ? {} : { msoHide: "all" }
+	}), ...ngDevMode ? [{ debugName: "$withoutBackgroundStyle" }] : /* istanbul ignore next */ []);
+	$noBgInnerHtml = computed(() => {
+		const href = this.$href();
+		const borderColor = this.$borderColor();
+		const borderSize = this.$borderSize();
+		const height = this.$height();
+		const width = this.$width();
+		const arcsize = this.$arcsize();
+		const backgroundColor = this.$backgroundColor();
+		const fontSize = this.$fontSize();
+		const textColor = this.$textColor();
+		const textContent = this.$textContent();
+		return `<!--[if mso]>
+            <v:roundrect href="${href}" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="${height !== void 0 ? `height:${height}px` : ""};v-text-anchor:middle;${width !== void 0 ? `width:${width}px` : ""};" arcsize="${arcsize}%" ${borderColor ? `strokecolor="${borderColor}"` : ""} ${borderSize ? `strokeweight="${borderSize}px"` : `stroke="false"`} ${backgroundColor ? `fillcolor="${backgroundColor}"` : `fill="false"`}>
             <w:anchorlock/>
-            <center style="font-size:${fontSize}px;${textColor ? `color:${textColor};` : ''}">
+            <center style="font-size:${fontSize}px;${textColor ? `color:${textColor};` : ""}">
             ${textContent}
             </center></v:roundrect>
             <![endif]-->`;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$noBgInnerHtml" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: ButtonComponent, isStandalone: true, selector: "ng-email-button", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $href: { classPropertyName: "$href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, $textContent: { classPropertyName: "$textContent", publicName: "textContent", isSignal: true, isRequired: true, transformFunction: null }, $width: { classPropertyName: "$width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, $borderRadius: { classPropertyName: "$borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, $textColor: { classPropertyName: "$textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null }, $backgroundColor: { classPropertyName: "$backgroundColor", publicName: "backgroundColor", isSignal: true, isRequired: false, transformFunction: null }, $borderColor: { classPropertyName: "$borderColor", publicName: "borderColor", isSignal: true, isRequired: false, transformFunction: null }, $borderSize: { classPropertyName: "$borderSize", publicName: "borderSize", isSignal: true, isRequired: false, transformFunction: null }, $fontSize: { classPropertyName: "$fontSize", publicName: "fontSize", isSignal: true, isRequired: false, transformFunction: null }, $align: { classPropertyName: "$align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, $withBackground: { classPropertyName: "$withBackground", publicName: "withBackground", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let withBackground = $withBackground();\n@let align = $align();\n@let href = $href();\n@let height = $height();\n@let width = $width();\n@let borderRadius = $borderRadius();\n\n<ng-template #child><ng-content></ng-content></ng-template>\n\n<table\n  [width]=\"'100%'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  style=\"border-collapse: collapse\"\n  role=\"presentation\"\n>\n  <tr>\n    <td [align]=\"align\">\n      @if (withBackground) {\n        <table\n          [align]=\"align\"\n          [width]=\"width\"\n          [border]=\"0\"\n          [cellPadding]=\"0\"\n          [cellSpacing]=\"0\"\n          role=\"presentation\"\n          [style]=\"{\n            border: $borderSize() + 'px solid ' + ($borderColor() ?? 'inherit'),\n            borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n                height: height ? height + 'px' : undefined,\n                width: width ? width + 'px' : undefined,\n                maxWidth: width ? width + 'px' : undefined,\n                textAlign: 'center',\n              }\"\n            >\n              <a\n                [href]=\"href\"\n                [class]=\"$styleClass()\"\n                [style]=\"$withBackgroundStyle()\"\n              >\n                <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n              </a>\n            </td>\n          </tr>\n        </table>\n      } @else {\n        <noscript [attr.data-html]=\"$noBgInnerHtml()\"></noscript>\n        <a\n          [href]=\"href\"\n          [class]=\"$styleClass()\"\n          [style]=\"$withoutBackgroundStyle()\"\n        >\n          <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n        </a>\n      }\n    </td>\n  </tr>\n</table>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-button', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let withBackground = $withBackground();\n@let align = $align();\n@let href = $href();\n@let height = $height();\n@let width = $width();\n@let borderRadius = $borderRadius();\n\n<ng-template #child><ng-content></ng-content></ng-template>\n\n<table\n  [width]=\"'100%'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  style=\"border-collapse: collapse\"\n  role=\"presentation\"\n>\n  <tr>\n    <td [align]=\"align\">\n      @if (withBackground) {\n        <table\n          [align]=\"align\"\n          [width]=\"width\"\n          [border]=\"0\"\n          [cellPadding]=\"0\"\n          [cellSpacing]=\"0\"\n          role=\"presentation\"\n          [style]=\"{\n            border: $borderSize() + 'px solid ' + ($borderColor() ?? 'inherit'),\n            borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n                height: height ? height + 'px' : undefined,\n                width: width ? width + 'px' : undefined,\n                maxWidth: width ? width + 'px' : undefined,\n                textAlign: 'center',\n              }\"\n            >\n              <a\n                [href]=\"href\"\n                [class]=\"$styleClass()\"\n                [style]=\"$withBackgroundStyle()\"\n              >\n                <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n              </a>\n            </td>\n          </tr>\n        </table>\n      } @else {\n        <noscript [attr.data-html]=\"$noBgInnerHtml()\"></noscript>\n        <a\n          [href]=\"href\"\n          [class]=\"$styleClass()\"\n          [style]=\"$withoutBackgroundStyle()\"\n        >\n          <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n        </a>\n      }\n    </td>\n  </tr>\n</table>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], $textContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "textContent", required: true }] }], $width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], $height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], $borderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderRadius", required: false }] }], $textColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "textColor", required: false }] }], $backgroundColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "backgroundColor", required: false }] }], $borderColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderColor", required: false }] }], $borderSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderSize", required: false }] }], $fontSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontSize", required: false }] }], $align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], $withBackground: [{ type: i0.Input, args: [{ isSignal: true, alias: "withBackground", required: false }] }] } });
-
-class ColorSchemeComponent {
-    $mode = input('normal', { ...(ngDevMode ? { debugName: "$mode" } : /* istanbul ignore next */ {}), alias: 'mode' });
-    $style = computed(() => `<style>:root { color-scheme: ${this.$mode()}; supported-color-schemes: ${this.$mode()}; }</style>`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$style" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ColorSchemeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: ColorSchemeComponent, isStandalone: true, selector: "ng-email-color-scheme", inputs: { $mode: { classPropertyName: "$mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let mode = $mode();\n\n<meta\n  name=\"color-scheme\"\n  [content]=\"mode\"\n/>\n<meta\n  name=\"supported-color-schemes\"\n  [content]=\"mode\"\n/>\n\n<noscript [attr.data-html]=\"$style()\"></noscript>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ColorSchemeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-color-scheme', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let mode = $mode();\n\n<meta\n  name=\"color-scheme\"\n  [content]=\"mode\"\n/>\n<meta\n  name=\"supported-color-schemes\"\n  [content]=\"mode\"\n/>\n\n<noscript [attr.data-html]=\"$style()\"></noscript>\n" }]
-        }], propDecorators: { $mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }] } });
-
-class ColumnComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $bgImage = input(undefined, { ...(ngDevMode ? { debugName: "$bgImage" } : /* istanbul ignore next */ {}), alias: 'bgImage' });
-    $bgColor = input(undefined, { ...(ngDevMode ? { debugName: "$bgColor" } : /* istanbul ignore next */ {}), alias: 'bgColor' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: ColumnComponent, isStandalone: true, selector: "ng-email-column", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $bgImage: { classPropertyName: "$bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, $bgColor: { classPropertyName: "$bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<td\n  [attr.background]=\"$bgImage()\"\n  [attr.bgcolor]=\"$bgColor()\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n  role=\"presentation\"\n>\n  <ng-content />\n</td>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ColumnComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-column', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<td\n  [attr.background]=\"$bgImage()\"\n  [attr.bgcolor]=\"$bgColor()\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n  role=\"presentation\"\n>\n  <ng-content />\n</td>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $bgImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgImage", required: false }] }], $bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }] } });
-
-class ConditionalComponent {
-    $expression = input(undefined, { ...(ngDevMode ? { debugName: "$expression" } : /* istanbul ignore next */ {}), alias: 'expression' });
-    $mso = input(undefined, { ...(ngDevMode ? { debugName: "$mso" } : /* istanbul ignore next */ {}), alias: 'mso' });
-    noMsoInnerHtmlPre = '&lt;!--[if !mso]&gt;&lt;!--&gt;';
-    noMsoInnerHtmlPost = '&lt;!--&lt;![endif]--&gt;';
-    $msoInnerHtmlPre = computed(() => `&lt;!--[if ${this.$expression() ?? 'mso'}]&gt;`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$msoInnerHtmlPre" }] : /* istanbul ignore next */ []));
-    msoInnerHtmlPost = '&lt;![endif]--&gt;';
-    constructor() {
-        effect(() => {
-            if (typeof this.$expression() === 'undefined' && typeof this.$mso() === 'undefined')
-                throw new RangeError('angular-email: Conditional expects the `expression` or `mso` prop to be defined');
-            if (typeof this.$expression() !== 'undefined' && typeof this.$mso() !== 'undefined')
-                throw new RangeError('angular-email: Conditional expects the `expression` or `mso` prop to be defined, not both');
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ConditionalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: ConditionalComponent, isStandalone: true, selector: "ng-email-conditional", inputs: { $expression: { classPropertyName: "$expression", publicName: "expression", isSignal: true, isRequired: false, transformFunction: null }, $mso: { classPropertyName: "$mso", publicName: "mso", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let mso = $mso();\n\n@if (!mso) {\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPre\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPost\"></noscript>\n} @else {\n  <noscript [attr.data-html]=\"$msoInnerHtmlPre()\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"msoInnerHtmlPost\"></noscript>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ConditionalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-conditional', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "@let mso = $mso();\n\n@if (!mso) {\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPre\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPost\"></noscript>\n} @else {\n  <noscript [attr.data-html]=\"$msoInnerHtmlPre()\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"msoInnerHtmlPost\"></noscript>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n" }]
-        }], ctorParameters: () => [], propDecorators: { $expression: [{ type: i0.Input, args: [{ isSignal: true, alias: "expression", required: false }] }], $mso: [{ type: i0.Input, args: [{ isSignal: true, alias: "mso", required: false }] }] } });
-
-class ContainerComponent {
-    random = Math.random();
-    document = inject(DOCUMENT);
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $alignment = input('center', { ...(ngDevMode ? { debugName: "$alignment" } : /* istanbul ignore next */ {}), alias: 'alignment' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    $containerWidth = input(600, { ...(ngDevMode ? { debugName: "$containerWidth" } : /* istanbul ignore next */ {}), alias: 'containerWidth' });
-    $containerStyle = computed(() => ({
-        ...(this.$disableDefaultStyle() ? {} : { maxWidth: `${this.$containerWidth()}px` }),
-        ...this.$style(),
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$containerStyle" }] : /* istanbul ignore next */ []));
-    $trStyle = computed(() => ({
-        ...(this.$disableDefaultStyle() ? {} : { width: '100%' }),
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$trStyle" }] : /* istanbul ignore next */ []));
-    $innerHtmlPre = computed(() => `<!--[if mso]><table align="${this.$alignment()}" width="${this.$containerWidth()}" style="border-spacing: 0; width:${this.$containerWidth()}px;" role="presentation"><tr><td><![endif]-->`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$innerHtmlPre" }] : /* istanbul ignore next */ []));
-    $innerHtmlPost = computed(() => `<!--[if mso]></td></tr></table><![endif]-->`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$innerHtmlPost" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: ContainerComponent, isStandalone: true, selector: "ng-email-container", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $alignment: { classPropertyName: "$alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null }, $containerWidth: { classPropertyName: "$containerWidth", publicName: "containerWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let containerWidth = $containerWidth();\n@let alignment = $alignment();\n\n<div [style]=\"{ tableLayout: 'fixed', width: '100%' }\">\n  <div [style]=\"{ margin: '0 auto', maxWidth: containerWidth }\">\n    <noscript [attr.data-html]=\"$innerHtmlPre()\"></noscript>\n    <table\n      [align]=\"alignment\"\n      [width]=\"'100%'\"\n      role=\"presentation\"\n      [cellSpacing]=\"0\"\n      [cellPadding]=\"0\"\n      [border]=\"0\"\n      [style]=\"$containerStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <tbody>\n        <tr [style]=\"$trStyle()\">\n          <td [align]=\"alignment\">\n            <ng-content></ng-content>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <noscript [attr.data-html]=\"$innerHtmlPost()\"></noscript>\n  </div>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ContainerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-container', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "@let containerWidth = $containerWidth();\n@let alignment = $alignment();\n\n<div [style]=\"{ tableLayout: 'fixed', width: '100%' }\">\n  <div [style]=\"{ margin: '0 auto', maxWidth: containerWidth }\">\n    <noscript [attr.data-html]=\"$innerHtmlPre()\"></noscript>\n    <table\n      [align]=\"alignment\"\n      [width]=\"'100%'\"\n      role=\"presentation\"\n      [cellSpacing]=\"0\"\n      [cellPadding]=\"0\"\n      [border]=\"0\"\n      [style]=\"$containerStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <tbody>\n        <tr [style]=\"$trStyle()\">\n          <td [align]=\"alignment\">\n            <ng-content></ng-content>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <noscript [attr.data-html]=\"$innerHtmlPost()\"></noscript>\n  </div>\n</div>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }], $containerWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerWidth", required: false }] }] } });
-
-class HeadComponent {
-    $enableFormatDetection = input(false, { ...(ngDevMode ? { debugName: "$enableFormatDetection" } : /* istanbul ignore next */ {}), alias: 'enableFormatDetection' });
-    xml = `\n<xml><o:OfficeDocumentSettings><o:AllowPNG /><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml>\n`;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: HeadComponent, isStandalone: true, selector: "ng-email-head", inputs: { $enableFormatDetection: { classPropertyName: "$enableFormatDetection", publicName: "enableFormatDetection", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let enableFormatDetection = $enableFormatDetection();\n\n<head>\n  <meta\n    http-equiv=\"content-type\"\n    content=\"text/html; charset=UTF-8\"\n  />\n  <meta\n    name=\"viewport\"\n    content=\"width=device-width, initial-scale=1, user-scalable=yes\"\n  />\n  <meta name=\"x-apple-disable-message-reformatting\" />\n  @if (!enableFormatDetection) {\n    <meta\n      name=\"format-detection\"\n      content=\"telephone=no, date=no, address=no, email=no, url=no\"\n    />\n  }\n  <ng-content></ng-content>\n  <ng-email-conditional [mso]=\"true\">\n    <noscript [attr.data-html]=\"xml\"></noscript>\n  </ng-email-conditional>\n</head>\n", dependencies: [{ kind: "component", type: ConditionalComponent, selector: "ng-email-conditional", inputs: ["expression", "mso"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HeadComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-head', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ConditionalComponent], schemas: [NO_ERRORS_SCHEMA], template: "@let enableFormatDetection = $enableFormatDetection();\n\n<head>\n  <meta\n    http-equiv=\"content-type\"\n    content=\"text/html; charset=UTF-8\"\n  />\n  <meta\n    name=\"viewport\"\n    content=\"width=device-width, initial-scale=1, user-scalable=yes\"\n  />\n  <meta name=\"x-apple-disable-message-reformatting\" />\n  @if (!enableFormatDetection) {\n    <meta\n      name=\"format-detection\"\n      content=\"telephone=no, date=no, address=no, email=no, url=no\"\n    />\n  }\n  <ng-content></ng-content>\n  <ng-email-conditional [mso]=\"true\">\n    <noscript [attr.data-html]=\"xml\"></noscript>\n  </ng-email-conditional>\n</head>\n" }]
-        }], propDecorators: { $enableFormatDetection: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableFormatDetection", required: false }] }] } });
-
+	}, ...ngDevMode ? [{ debugName: "$noBgInnerHtml" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ButtonComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: ButtonComponent,
+		isStandalone: true,
+		selector: "ng-email-button",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$href: {
+				classPropertyName: "$href",
+				publicName: "href",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$textContent: {
+				classPropertyName: "$textContent",
+				publicName: "textContent",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			$width: {
+				classPropertyName: "$width",
+				publicName: "width",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$height: {
+				classPropertyName: "$height",
+				publicName: "height",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$borderRadius: {
+				classPropertyName: "$borderRadius",
+				publicName: "borderRadius",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$textColor: {
+				classPropertyName: "$textColor",
+				publicName: "textColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$backgroundColor: {
+				classPropertyName: "$backgroundColor",
+				publicName: "backgroundColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$borderColor: {
+				classPropertyName: "$borderColor",
+				publicName: "borderColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$borderSize: {
+				classPropertyName: "$borderSize",
+				publicName: "borderSize",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$fontSize: {
+				classPropertyName: "$fontSize",
+				publicName: "fontSize",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$align: {
+				classPropertyName: "$align",
+				publicName: "align",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$withBackground: {
+				classPropertyName: "$withBackground",
+				publicName: "withBackground",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let withBackground = $withBackground();\n@let align = $align();\n@let href = $href();\n@let height = $height();\n@let width = $width();\n@let borderRadius = $borderRadius();\n\n<ng-template #child><ng-content></ng-content></ng-template>\n\n<table\n  [width]=\"'100%'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  style=\"border-collapse: collapse\"\n  role=\"presentation\"\n>\n  <tr>\n    <td [align]=\"align\">\n      @if (withBackground) {\n        <table\n          [align]=\"align\"\n          [width]=\"width\"\n          [border]=\"0\"\n          [cellPadding]=\"0\"\n          [cellSpacing]=\"0\"\n          role=\"presentation\"\n          [style]=\"{\n            border: $borderSize() + 'px solid ' + ($borderColor() ?? 'inherit'),\n            borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n                height: height ? height + 'px' : undefined,\n                width: width ? width + 'px' : undefined,\n                maxWidth: width ? width + 'px' : undefined,\n                textAlign: 'center',\n              }\"\n            >\n              <a\n                [href]=\"href\"\n                [class]=\"$styleClass()\"\n                [style]=\"$withBackgroundStyle()\"\n              >\n                <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n              </a>\n            </td>\n          </tr>\n        </table>\n      } @else {\n        <noscript [attr.data-html]=\"$noBgInnerHtml()\"></noscript>\n        <a\n          [href]=\"href\"\n          [class]=\"$styleClass()\"\n          [style]=\"$withoutBackgroundStyle()\"\n        >\n          <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n        </a>\n      }\n    </td>\n  </tr>\n</table>\n",
+		dependencies: [{
+			kind: "directive",
+			type: NgTemplateOutlet,
+			selector: "[ngTemplateOutlet]",
+			inputs: [
+				"ngTemplateOutletContext",
+				"ngTemplateOutlet",
+				"ngTemplateOutletInjector"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ButtonComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-button",
+			imports: [NgTemplateOutlet],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "@let withBackground = $withBackground();\n@let align = $align();\n@let href = $href();\n@let height = $height();\n@let width = $width();\n@let borderRadius = $borderRadius();\n\n<ng-template #child><ng-content></ng-content></ng-template>\n\n<table\n  [width]=\"'100%'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  style=\"border-collapse: collapse\"\n  role=\"presentation\"\n>\n  <tr>\n    <td [align]=\"align\">\n      @if (withBackground) {\n        <table\n          [align]=\"align\"\n          [width]=\"width\"\n          [border]=\"0\"\n          [cellPadding]=\"0\"\n          [cellSpacing]=\"0\"\n          role=\"presentation\"\n          [style]=\"{\n            border: $borderSize() + 'px solid ' + ($borderColor() ?? 'inherit'),\n            borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius: borderRadius ? borderRadius + 'px' : undefined,\n                height: height ? height + 'px' : undefined,\n                width: width ? width + 'px' : undefined,\n                maxWidth: width ? width + 'px' : undefined,\n                textAlign: 'center',\n              }\"\n            >\n              <a\n                [href]=\"href\"\n                [class]=\"$styleClass()\"\n                [style]=\"$withBackgroundStyle()\"\n              >\n                <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n              </a>\n            </td>\n          </tr>\n        </table>\n      } @else {\n        <noscript [attr.data-html]=\"$noBgInnerHtml()\"></noscript>\n        <a\n          [href]=\"href\"\n          [class]=\"$styleClass()\"\n          [style]=\"$withoutBackgroundStyle()\"\n        >\n          <ng-container [ngTemplateOutlet]=\"child\"></ng-container>\n        </a>\n      }\n    </td>\n  </tr>\n</table>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$href: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "href",
+				required: false
+			}]
+		}],
+		$textContent: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "textContent",
+				required: true
+			}]
+		}],
+		$width: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "width",
+				required: false
+			}]
+		}],
+		$height: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "height",
+				required: false
+			}]
+		}],
+		$borderRadius: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "borderRadius",
+				required: false
+			}]
+		}],
+		$textColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "textColor",
+				required: false
+			}]
+		}],
+		$backgroundColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "backgroundColor",
+				required: false
+			}]
+		}],
+		$borderColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "borderColor",
+				required: false
+			}]
+		}],
+		$borderSize: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "borderSize",
+				required: false
+			}]
+		}],
+		$fontSize: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fontSize",
+				required: false
+			}]
+		}],
+		$align: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "align",
+				required: false
+			}]
+		}],
+		$withBackground: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "withBackground",
+				required: false
+			}]
+		}]
+	}
+});
+var ColorSchemeComponent = class ColorSchemeComponent {
+	$mode = input("normal", {
+		...ngDevMode ? { debugName: "$mode" } : /* istanbul ignore next */ {},
+		alias: "mode"
+	});
+	$style = computed(() => `<style>:root { color-scheme: ${this.$mode()}; supported-color-schemes: ${this.$mode()}; }</style>`, ...ngDevMode ? [{ debugName: "$style" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ColorSchemeComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: ColorSchemeComponent,
+		isStandalone: true,
+		selector: "ng-email-color-scheme",
+		inputs: { $mode: {
+			classPropertyName: "$mode",
+			publicName: "mode",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: "@let mode = $mode();\n\n<meta\n  name=\"color-scheme\"\n  [content]=\"mode\"\n/>\n<meta\n  name=\"supported-color-schemes\"\n  [content]=\"mode\"\n/>\n\n<noscript [attr.data-html]=\"$style()\"></noscript>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ColorSchemeComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-color-scheme",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "@let mode = $mode();\n\n<meta\n  name=\"color-scheme\"\n  [content]=\"mode\"\n/>\n<meta\n  name=\"supported-color-schemes\"\n  [content]=\"mode\"\n/>\n\n<noscript [attr.data-html]=\"$style()\"></noscript>\n"
+		}]
+	}],
+	propDecorators: { $mode: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "mode",
+			required: false
+		}]
+	}] }
+});
+var ColumnComponent = class ColumnComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$bgImage = input(void 0, {
+		...ngDevMode ? { debugName: "$bgImage" } : /* istanbul ignore next */ {},
+		alias: "bgImage"
+	});
+	$bgColor = input(void 0, {
+		...ngDevMode ? { debugName: "$bgColor" } : /* istanbul ignore next */ {},
+		alias: "bgColor"
+	});
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ColumnComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: ColumnComponent,
+		isStandalone: true,
+		selector: "ng-email-column",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$bgImage: {
+				classPropertyName: "$bgImage",
+				publicName: "bgImage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$bgColor: {
+				classPropertyName: "$bgColor",
+				publicName: "bgColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<td\n  [attr.background]=\"$bgImage()\"\n  [attr.bgcolor]=\"$bgColor()\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n  role=\"presentation\"\n>\n  <ng-content />\n</td>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ColumnComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-column",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [],
+			template: "<td\n  [attr.background]=\"$bgImage()\"\n  [attr.bgcolor]=\"$bgColor()\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n  role=\"presentation\"\n>\n  <ng-content />\n</td>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$bgImage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "bgImage",
+				required: false
+			}]
+		}],
+		$bgColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "bgColor",
+				required: false
+			}]
+		}]
+	}
+});
+var ConditionalComponent = class ConditionalComponent {
+	$expression = input(void 0, {
+		...ngDevMode ? { debugName: "$expression" } : /* istanbul ignore next */ {},
+		alias: "expression"
+	});
+	$mso = input(void 0, {
+		...ngDevMode ? { debugName: "$mso" } : /* istanbul ignore next */ {},
+		alias: "mso"
+	});
+	noMsoInnerHtmlPre = "&lt;!--[if !mso]&gt;&lt;!--&gt;";
+	noMsoInnerHtmlPost = "&lt;!--&lt;![endif]--&gt;";
+	$msoInnerHtmlPre = computed(() => `&lt;!--[if ${this.$expression() ?? "mso"}]&gt;`, ...ngDevMode ? [{ debugName: "$msoInnerHtmlPre" }] : /* istanbul ignore next */ []);
+	msoInnerHtmlPost = "&lt;![endif]--&gt;";
+	constructor() {
+		effect(() => {
+			if (typeof this.$expression() === "undefined" && typeof this.$mso() === "undefined") throw new RangeError("angular-email: Conditional expects the `expression` or `mso` prop to be defined");
+			if (typeof this.$expression() !== "undefined" && typeof this.$mso() !== "undefined") throw new RangeError("angular-email: Conditional expects the `expression` or `mso` prop to be defined, not both");
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ConditionalComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: ConditionalComponent,
+		isStandalone: true,
+		selector: "ng-email-conditional",
+		inputs: {
+			$expression: {
+				classPropertyName: "$expression",
+				publicName: "expression",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$mso: {
+				classPropertyName: "$mso",
+				publicName: "mso",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let mso = $mso();\n\n@if (!mso) {\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPre\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPost\"></noscript>\n} @else {\n  <noscript [attr.data-html]=\"$msoInnerHtmlPre()\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"msoInnerHtmlPost\"></noscript>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n",
+		dependencies: [{
+			kind: "directive",
+			type: NgTemplateOutlet,
+			selector: "[ngTemplateOutlet]",
+			inputs: [
+				"ngTemplateOutletContext",
+				"ngTemplateOutlet",
+				"ngTemplateOutletInjector"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ConditionalComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-conditional",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [NgTemplateOutlet],
+			schemas: [CUSTOM_ELEMENTS_SCHEMA],
+			template: "@let mso = $mso();\n\n@if (!mso) {\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPre\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"noMsoInnerHtmlPost\"></noscript>\n} @else {\n  <noscript [attr.data-html]=\"$msoInnerHtmlPre()\"></noscript>\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  <noscript [attr.data-html]=\"msoInnerHtmlPost\"></noscript>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n"
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		$expression: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "expression",
+				required: false
+			}]
+		}],
+		$mso: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mso",
+				required: false
+			}]
+		}]
+	}
+});
+var ContainerComponent = class ContainerComponent {
+	random = Math.random();
+	document = inject(DOCUMENT);
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$alignment = input("center", {
+		...ngDevMode ? { debugName: "$alignment" } : /* istanbul ignore next */ {},
+		alias: "alignment"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	$containerWidth = input(600, {
+		...ngDevMode ? { debugName: "$containerWidth" } : /* istanbul ignore next */ {},
+		alias: "containerWidth"
+	});
+	$containerStyle = computed(() => ({
+		...this.$disableDefaultStyle() ? {} : { maxWidth: `${this.$containerWidth()}px` },
+		...this.$style()
+	}), ...ngDevMode ? [{ debugName: "$containerStyle" }] : /* istanbul ignore next */ []);
+	$trStyle = computed(() => ({ ...this.$disableDefaultStyle() ? {} : { width: "100%" } }), ...ngDevMode ? [{ debugName: "$trStyle" }] : /* istanbul ignore next */ []);
+	$innerHtmlPre = computed(() => `<!--[if mso]><table align="${this.$alignment()}" width="${this.$containerWidth()}" style="border-spacing: 0; width:${this.$containerWidth()}px;" role="presentation"><tr><td><![endif]-->`, ...ngDevMode ? [{ debugName: "$innerHtmlPre" }] : /* istanbul ignore next */ []);
+	$innerHtmlPost = computed(() => `<!--[if mso]></td></tr></table><![endif]-->`, ...ngDevMode ? [{ debugName: "$innerHtmlPost" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ContainerComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: ContainerComponent,
+		isStandalone: true,
+		selector: "ng-email-container",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$alignment: {
+				classPropertyName: "$alignment",
+				publicName: "alignment",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$containerWidth: {
+				classPropertyName: "$containerWidth",
+				publicName: "containerWidth",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let containerWidth = $containerWidth();\n@let alignment = $alignment();\n@let disableDefaultStyle = $disableDefaultStyle();\n\n<div [style]=\"{ tableLayout: 'fixed', width: '100%' }\">\n  <div [style]=\"{ margin: '0 auto', maxWidth: disableDefaultStyle ? undefined : containerWidth + 'px' }\">\n    <noscript [attr.data-html]=\"$innerHtmlPre()\"></noscript>\n    <table\n      [align]=\"alignment\"\n      [width]=\"'100%'\"\n      role=\"presentation\"\n      [cellSpacing]=\"0\"\n      [cellPadding]=\"0\"\n      [border]=\"0\"\n      [style]=\"$containerStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <tbody>\n        <tr [style]=\"$trStyle()\">\n          <td [align]=\"alignment\">\n            <ng-content></ng-content>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <noscript [attr.data-html]=\"$innerHtmlPost()\"></noscript>\n  </div>\n</div>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ContainerComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-container",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [],
+			template: "@let containerWidth = $containerWidth();\n@let alignment = $alignment();\n@let disableDefaultStyle = $disableDefaultStyle();\n\n<div [style]=\"{ tableLayout: 'fixed', width: '100%' }\">\n  <div [style]=\"{ margin: '0 auto', maxWidth: disableDefaultStyle ? undefined : containerWidth + 'px' }\">\n    <noscript [attr.data-html]=\"$innerHtmlPre()\"></noscript>\n    <table\n      [align]=\"alignment\"\n      [width]=\"'100%'\"\n      role=\"presentation\"\n      [cellSpacing]=\"0\"\n      [cellPadding]=\"0\"\n      [border]=\"0\"\n      [style]=\"$containerStyle()\"\n      [class]=\"$styleClass()\"\n    >\n      <tbody>\n        <tr [style]=\"$trStyle()\">\n          <td [align]=\"alignment\">\n            <ng-content></ng-content>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <noscript [attr.data-html]=\"$innerHtmlPost()\"></noscript>\n  </div>\n</div>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$alignment: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "alignment",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}],
+		$containerWidth: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "containerWidth",
+				required: false
+			}]
+		}]
+	}
+});
+var HeadComponent = class HeadComponent {
+	$enableFormatDetection = input(false, {
+		...ngDevMode ? { debugName: "$enableFormatDetection" } : /* istanbul ignore next */ {},
+		alias: "enableFormatDetection"
+	});
+	xml = `\n<xml><o:OfficeDocumentSettings><o:AllowPNG /><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml>\n`;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: HeadComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: HeadComponent,
+		isStandalone: true,
+		selector: "ng-email-head",
+		inputs: { $enableFormatDetection: {
+			classPropertyName: "$enableFormatDetection",
+			publicName: "enableFormatDetection",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: "@let enableFormatDetection = $enableFormatDetection();\n\n<head>\n  <meta\n    http-equiv=\"content-type\"\n    content=\"text/html; charset=UTF-8\"\n  />\n  <meta\n    name=\"viewport\"\n    content=\"width=device-width, initial-scale=1, user-scalable=yes\"\n  />\n  <meta name=\"x-apple-disable-message-reformatting\" />\n  @if (!enableFormatDetection) {\n    <meta\n      name=\"format-detection\"\n      content=\"telephone=no, date=no, address=no, email=no, url=no\"\n    />\n  }\n  <ng-content></ng-content>\n  <ng-email-conditional [mso]=\"true\">\n    <noscript [attr.data-html]=\"xml\"></noscript>\n  </ng-email-conditional>\n</head>\n",
+		dependencies: [{
+			kind: "component",
+			type: ConditionalComponent,
+			selector: "ng-email-conditional",
+			inputs: ["expression", "mso"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: HeadComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-head",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [ConditionalComponent],
+			schemas: [NO_ERRORS_SCHEMA],
+			template: "@let enableFormatDetection = $enableFormatDetection();\n\n<head>\n  <meta\n    http-equiv=\"content-type\"\n    content=\"text/html; charset=UTF-8\"\n  />\n  <meta\n    name=\"viewport\"\n    content=\"width=device-width, initial-scale=1, user-scalable=yes\"\n  />\n  <meta name=\"x-apple-disable-message-reformatting\" />\n  @if (!enableFormatDetection) {\n    <meta\n      name=\"format-detection\"\n      content=\"telephone=no, date=no, address=no, email=no, url=no\"\n    />\n  }\n  <ng-content></ng-content>\n  <ng-email-conditional [mso]=\"true\">\n    <noscript [attr.data-html]=\"xml\"></noscript>\n  </ng-email-conditional>\n</head>\n"
+		}]
+	}],
+	propDecorators: { $enableFormatDetection: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "enableFormatDetection",
+			required: false
+		}]
+	}] }
+});
 const copyTextToClipboard = async (text) => {
-    try {
-        await navigator.clipboard.writeText(text);
-    }
-    catch {
-        throw new Error('Not able to copy');
-    }
-};
-const pxToPt = (px) => (isNaN(Number(px)) ? null : (parseInt(px, 10) * 3) / 4);
+	try {
+		await navigator.clipboard.writeText(text);
+	} catch {
+		throw new Error("Not able to copy");
+	}
+};
+const pxToPt = (px) => isNaN(Number(px)) ? null : parseInt(px, 10) * 3 / 4;
 const withMargin = (props) => [
-    withSpace(props.m, ['margin']),
-    withSpace(props.mx, ['marginLeft', 'marginRight']),
-    withSpace(props.my, ['marginTop', 'marginBottom']),
-    withSpace(props.mt, ['marginTop']),
-    withSpace(props.mr, ['marginRight']),
-    withSpace(props.mb, ['marginBottom']),
-    withSpace(props.ml, ['marginLeft']),
+	withSpace(props.m, ["margin"]),
+	withSpace(props.mx, ["marginLeft", "marginRight"]),
+	withSpace(props.my, ["marginTop", "marginBottom"]),
+	withSpace(props.mt, ["marginTop"]),
+	withSpace(props.mr, ["marginRight"]),
+	withSpace(props.mb, ["marginBottom"]),
+	withSpace(props.ml, ["marginLeft"])
 ].filter((s) => Object.keys(s).length)[0];
 const withSpace = (value, properties) => {
-    return properties.reduce((styles, property) => {
-        if (value) {
-            return { ...styles, [property]: `${value}px` };
-        }
-        return styles;
-    }, {});
-};
-// https://stackoverflow.com/a/61410824
+	return properties.reduce((styles, property) => {
+		if (value) return {
+			...styles,
+			[property]: `${value}px`
+		};
+		return styles;
+	}, {});
+};
 const styleToString = (style) => {
-    if (!style)
-        return '';
-    return Object.keys(style).reduce((acc, key) => acc +
-        key
-            .split(/(?=[A-Z])/)
-            .join('-')
-            .toLowerCase() +
-        ':' +
-        style[key] +
-        ';', '');
-};
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	if (!style) return "";
+	return Object.keys(style).reduce((acc, key) => acc + key.split(/(?=[A-Z])/).join("-").toLowerCase() + ":" + style[key] + ";", "");
+};
 const classToString = (style) => {
-    if (!style)
-        return '';
-    if (typeof style === 'string')
-        return style;
-    if (Array.isArray(style))
-        return style.join(' ');
-    return Object.keys(style).reduce((acc, key) => acc +
-        key
-            .split(/(?=[A-Z])/)
-            .join('-')
-            .toLowerCase() +
-        ':' +
-        style[key] +
-        ';', '');
+	if (!style) return "";
+	if (typeof style === "string") return style;
+	if (Array.isArray(style)) return style.join(" ");
+	return Object.keys(style).reduce((acc, key) => acc + key.split(/(?=[A-Z])/).join("-").toLowerCase() + ":" + style[key] + ";", "");
 };
 const unreachable = (condition, message = `Entered unreachable code. Received '${condition}'.`) => {
-    throw new TypeError(message);
+	throw new TypeError(message);
 };
 const HTMLElements = [
-    '!DOCTYPE',
-    'a',
-    'abbr',
-    'abbr',
-    //"acronym", // NOT HTML5
-    'address',
-    //"applet", // NOT HTML5 (NOT MAJORLY SUPPORTED)
-    'area',
-    'article',
-    'aside',
-    'audio',
-    'b',
-    'base',
-    //"basefont", // NOT HTML5
-    'bdi',
-    'bdo',
-    //"big", // NOT HTML5
-    'blockquote',
-    'body',
-    'br',
-    'button',
-    'canvas',
-    'caption',
-    //"center", // NOT HTML5
-    'cite',
-    'code',
-    'col',
-    'colgroup',
-    'data',
-    'datalist',
-    'dd',
-    'del',
-    'details',
-    'dfn',
-    'dialog',
-    //"dir", NOT HTML5 (use "ul" instead)
-    'div',
-    'dl',
-    'dt',
-    'em',
-    'embed',
-    'fieldset',
-    'figcaption',
-    'figure',
-    //"font", // NOT HTML5 (use CSS)
-    'footer',
-    'form',
-    //"frame", // NOT HTML5
-    //"frameset", // NOT HTML5
-    'h1',
-    'h2',
-    'h3',
-    'h4',
-    'h5',
-    'h6',
-    'head',
-    'header',
-    'hr',
-    'html',
-    'i',
-    'iframe',
-    'img',
-    'input',
-    'ins',
-    'kbd',
-    'label',
-    'legend',
-    'li',
-    'link',
-    'main',
-    'map',
-    'mark',
-    'meta',
-    'meter',
-    'nav',
-    //"noframes", // NOT HTML5
-    'noscript',
-    'object',
-    'ol',
-    'optgroup',
-    'option',
-    'output',
-    'p',
-    'param',
-    'picture',
-    'pre',
-    'progress',
-    'q',
-    'rp',
-    'rt',
-    'ruby',
-    's',
-    'samp',
-    'script',
-    'section',
-    'select',
-    'small',
-    'source',
-    'span',
-    //"strike", NOT HTML5 (Use <del> or <s> instead)
-    'strong',
-    'style',
-    'sub',
-    'summary',
-    'sup',
-    'svg',
-    'table',
-    'tbody',
-    'td',
-    'template',
-    'textarea',
-    'tfoot',
-    'th',
-    'thead',
-    'time',
-    'title',
-    'tr',
-    'track',
-    //"tt", // NOT HTML5 (Use CSS)
-    'u',
-    'ul',
-    'var',
-    'video',
-    'wbr',
-    // xml
-    'xml',
-    'o:OfficeDocumentSettings',
-    'o:AllowPNG',
-    'o:PixelsPerInch',
-    'angular-email-raw',
+	"!DOCTYPE",
+	"a",
+	"abbr",
+	"abbr",
+	"address",
+	"area",
+	"article",
+	"aside",
+	"audio",
+	"b",
+	"base",
+	"bdi",
+	"bdo",
+	"blockquote",
+	"body",
+	"br",
+	"button",
+	"canvas",
+	"caption",
+	"cite",
+	"code",
+	"col",
+	"colgroup",
+	"data",
+	"datalist",
+	"dd",
+	"del",
+	"details",
+	"dfn",
+	"dialog",
+	"div",
+	"dl",
+	"dt",
+	"em",
+	"embed",
+	"fieldset",
+	"figcaption",
+	"figure",
+	"footer",
+	"form",
+	"h1",
+	"h2",
+	"h3",
+	"h4",
+	"h5",
+	"h6",
+	"head",
+	"header",
+	"hr",
+	"html",
+	"i",
+	"iframe",
+	"img",
+	"input",
+	"ins",
+	"kbd",
+	"label",
+	"legend",
+	"li",
+	"link",
+	"main",
+	"map",
+	"mark",
+	"meta",
+	"meter",
+	"nav",
+	"noscript",
+	"object",
+	"ol",
+	"optgroup",
+	"option",
+	"output",
+	"p",
+	"param",
+	"picture",
+	"pre",
+	"progress",
+	"q",
+	"rp",
+	"rt",
+	"ruby",
+	"s",
+	"samp",
+	"script",
+	"section",
+	"select",
+	"small",
+	"source",
+	"span",
+	"strong",
+	"style",
+	"sub",
+	"summary",
+	"sup",
+	"svg",
+	"table",
+	"tbody",
+	"td",
+	"template",
+	"textarea",
+	"tfoot",
+	"th",
+	"thead",
+	"time",
+	"title",
+	"tr",
+	"track",
+	"u",
+	"ul",
+	"var",
+	"video",
+	"wbr",
+	"xml",
+	"o:OfficeDocumentSettings",
+	"o:AllowPNG",
+	"o:PixelsPerInch",
+	"angular-email-raw"
 ];
-const START_TAG = '__COMMENT_START';
-const END_TAG = '__COMMENT_END';
+const START_TAG = "__COMMENT_START";
+const END_TAG = "__COMMENT_END";
 function escapeForRawComponent(input) {
-    // escape comment sequences
-    return input.replace(/<!--/g, START_TAG).replace(/-->/g, END_TAG);
+	return input.replace(/<!--/g, START_TAG).replace(/-->/g, END_TAG);
 }
 function unescapeForRawComponent(input) {
-    return input.replace(new RegExp(START_TAG, 'g'), '<!--').replace(new RegExp(END_TAG, 'g'), '-->');
-}
-
-class HeadingComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $as = input('h1', { ...(ngDevMode ? { debugName: "$as" } : /* istanbul ignore next */ {}), alias: 'as' });
-    $m = input(undefined, { ...(ngDevMode ? { debugName: "$m" } : /* istanbul ignore next */ {}), alias: 'm' });
-    $mx = input(undefined, { ...(ngDevMode ? { debugName: "$mx" } : /* istanbul ignore next */ {}), alias: 'mx' });
-    $my = input(undefined, { ...(ngDevMode ? { debugName: "$my" } : /* istanbul ignore next */ {}), alias: 'my' });
-    $mt = input(undefined, { ...(ngDevMode ? { debugName: "$mt" } : /* istanbul ignore next */ {}), alias: 'mt' });
-    $mr = input(undefined, { ...(ngDevMode ? { debugName: "$mr" } : /* istanbul ignore next */ {}), alias: 'mr' });
-    $mb = input(undefined, { ...(ngDevMode ? { debugName: "$mb" } : /* istanbul ignore next */ {}), alias: 'mb' });
-    $ml = input(undefined, { ...(ngDevMode ? { debugName: "$ml" } : /* istanbul ignore next */ {}), alias: 'ml' });
-    $headingStyle = computed(() => {
-        return styleToString({
-            ...withMargin({
-                m: this.$m(),
-                mx: this.$mx(),
-                my: this.$my(),
-                mt: this.$mt(),
-                mr: this.$mr(),
-                mb: this.$mb(),
-                ml: this.$ml(),
-            }),
-            ...(this.$style() ?? {}),
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$headingStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: HeadingComponent, isStandalone: true, selector: "ng-email-heading", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $as: { classPropertyName: "$as", publicName: "as", isSignal: true, isRequired: false, transformFunction: null }, $m: { classPropertyName: "$m", publicName: "m", isSignal: true, isRequired: false, transformFunction: null }, $mx: { classPropertyName: "$mx", publicName: "mx", isSignal: true, isRequired: false, transformFunction: null }, $my: { classPropertyName: "$my", publicName: "my", isSignal: true, isRequired: false, transformFunction: null }, $mt: { classPropertyName: "$mt", publicName: "mt", isSignal: true, isRequired: false, transformFunction: null }, $mr: { classPropertyName: "$mr", publicName: "mr", isSignal: true, isRequired: false, transformFunction: null }, $mb: { classPropertyName: "$mb", publicName: "mb", isSignal: true, isRequired: false, transformFunction: null }, $ml: { classPropertyName: "$ml", publicName: "ml", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let heading = $as();\n@let style = $headingStyle();\n@let styleClass = $styleClass();\n@if (heading === 'h1') {\n  <h1\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h1>\n} @else if (heading === 'h2') {\n  <h2\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h2>\n} @else if (heading === 'h3') {\n  <h3\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h3>\n} @else if (heading === 'h4') {\n  <h4\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h4>\n} @else if (heading === 'h5') {\n  <h5\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h5>\n} @else if (heading === 'h6') {\n  <h6\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h6>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HeadingComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-heading', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let heading = $as();\n@let style = $headingStyle();\n@let styleClass = $styleClass();\n@if (heading === 'h1') {\n  <h1\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h1>\n} @else if (heading === 'h2') {\n  <h2\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h2>\n} @else if (heading === 'h3') {\n  <h3\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h3>\n} @else if (heading === 'h4') {\n  <h4\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h4>\n} @else if (heading === 'h5') {\n  <h5\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h5>\n} @else if (heading === 'h6') {\n  <h6\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h6>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $as: [{ type: i0.Input, args: [{ isSignal: true, alias: "as", required: false }] }], $m: [{ type: i0.Input, args: [{ isSignal: true, alias: "m", required: false }] }], $mx: [{ type: i0.Input, args: [{ isSignal: true, alias: "mx", required: false }] }], $my: [{ type: i0.Input, args: [{ isSignal: true, alias: "my", required: false }] }], $mt: [{ type: i0.Input, args: [{ isSignal: true, alias: "mt", required: false }] }], $mr: [{ type: i0.Input, args: [{ isSignal: true, alias: "mr", required: false }] }], $mb: [{ type: i0.Input, args: [{ isSignal: true, alias: "mb", required: false }] }], $ml: [{ type: i0.Input, args: [{ isSignal: true, alias: "ml", required: false }] }] } });
-
-class HrComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    $hrStyle = computed(() => {
-        return {
-            ...(this.$disableDefaultStyle()
-                ? {}
-                : {
-                    width: '100%',
-                    border: 'none',
-                    borderTop: '1px solid #eaeaea',
-                }),
-            ...(this.$style() ?? {}),
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$hrStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HrComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: HrComponent, isStandalone: true, selector: "ng-email-hr", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<hr\n  [style]=\"$hrStyle()\"\n  [class]=\"$styleClass()\"\n/>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HrComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-hr', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<hr\n  [style]=\"$hrStyle()\"\n  [class]=\"$styleClass()\"\n/>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }] } });
-
-class HtmlComponent {
-    $lang = input('en', { ...(ngDevMode ? { debugName: "$lang" } : /* istanbul ignore next */ {}), alias: 'lang' });
-    $dir = input('ltr', { ...(ngDevMode ? { debugName: "$dir" } : /* istanbul ignore next */ {}), alias: 'dir' });
-    $enableVML = input(true, { ...(ngDevMode ? { debugName: "$enableVML" } : /* istanbul ignore next */ {}), alias: 'enableVML' });
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HtmlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: HtmlComponent, isStandalone: true, selector: "ng-email-html", inputs: { $lang: { classPropertyName: "$lang", publicName: "lang", isSignal: true, isRequired: false, transformFunction: null }, $dir: { classPropertyName: "$dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, $enableVML: { classPropertyName: "$enableVML", publicName: "enableVML", isSignal: true, isRequired: false, transformFunction: null }, $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let enableVML = $enableVML();\n@let lang = $lang();\n@let dir = $dir();\n\n<html\n  id=\"__angular-email\"\n  [lang]=\"lang\"\n  [dir]=\"dir\"\n  [attr.xmlns:o]=\"enableVML ? 'urn:schemas-microsoft-com:office:office' : undefined\"\n  [attr.xmlns:v]=\"enableVML ? 'urn:schemas-microsoft-com:vml' : undefined\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</html>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: HtmlComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-html', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let enableVML = $enableVML();\n@let lang = $lang();\n@let dir = $dir();\n\n<html\n  id=\"__angular-email\"\n  [lang]=\"lang\"\n  [dir]=\"dir\"\n  [attr.xmlns:o]=\"enableVML ? 'urn:schemas-microsoft-com:office:office' : undefined\"\n  [attr.xmlns:v]=\"enableVML ? 'urn:schemas-microsoft-com:vml' : undefined\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</html>\n" }]
-        }], propDecorators: { $lang: [{ type: i0.Input, args: [{ isSignal: true, alias: "lang", required: false }] }], $dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], $enableVML: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableVML", required: false }] }], $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }] } });
-
-class ImgComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    $alt = input('', { ...(ngDevMode ? { debugName: "$alt" } : /* istanbul ignore next */ {}), alias: 'alt' });
-    $src = input('', { ...(ngDevMode ? { debugName: "$src" } : /* istanbul ignore next */ {}), alias: 'src' });
-    $width = input('0', { ...(ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {}), alias: 'width' });
-    $height = input('0', { ...(ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {}), alias: 'height' });
-    $imageStyle = computed(() => {
-        return {
-            ...(this.$disableDefaultStyle()
-                ? {}
-                : {
-                    display: 'block',
-                    outline: 'none',
-                    border: 'none',
-                    textDecoration: 'none',
-                }),
-            ...(this.$style() ?? {}),
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$imageStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ImgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: ImgComponent, isStandalone: true, selector: "ng-email-img", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null }, $alt: { classPropertyName: "$alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, $src: { classPropertyName: "$src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, $width: { classPropertyName: "$width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<img\n  [style]=\"$imageStyle()\"\n  [class]=\"$styleClass()\"\n  [alt]=\"$alt()\"\n  [src]=\"$src()\"\n  [width]=\"$width()\"\n  [height]=\"$height()\"\n/>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+	return input.replace(new RegExp(START_TAG, "g"), "<!--").replace(new RegExp(END_TAG, "g"), "-->");
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ImgComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-img', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<img\n  [style]=\"$imageStyle()\"\n  [class]=\"$styleClass()\"\n  [alt]=\"$alt()\"\n  [src]=\"$src()\"\n  [width]=\"$width()\"\n  [height]=\"$height()\"\n/>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }], $alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], $src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], $width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], $height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }] } });
-
-class LinkComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    $href = input('', { ...(ngDevMode ? { debugName: "$href" } : /* istanbul ignore next */ {}), alias: 'href' });
-    $target = input('_blank', { ...(ngDevMode ? { debugName: "$target" } : /* istanbul ignore next */ {}), alias: 'target' });
-    $linkStyle = computed(() => {
-        return {
-            ...(this.$disableDefaultStyle()
-                ? {}
-                : {
-                    color: '#067df7',
-                    textDecoration: 'none',
-                }),
-            ...(this.$style() ?? {}),
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$linkStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: LinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: LinkComponent, isStandalone: true, selector: "ng-email-link", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null }, $href: { classPropertyName: "$href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, $target: { classPropertyName: "$target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<a\n  [style]=\"$linkStyle()\"\n  [class]=\"$styleClass()\"\n  [href]=\"$href()\"\n  [target]=\"$target()\"\n  ><ng-content></ng-content\n></a>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: LinkComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-link', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<a\n  [style]=\"$linkStyle()\"\n  [class]=\"$styleClass()\"\n  [href]=\"$href()\"\n  [target]=\"$target()\"\n  ><ng-content></ng-content\n></a>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }], $href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], $target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }] } });
-
-class RawComponent {
-    $disablePlainTextOutput = input(false, { ...(ngDevMode ? { debugName: "$disablePlainTextOutput" } : /* istanbul ignore next */ {}), alias: 'disablePlainTextOutput' });
-    $content = input('', { ...(ngDevMode ? { debugName: "$content" } : /* istanbul ignore next */ {}), alias: 'content' });
-    $escapingContent = computed(() => `<!--${escapeForRawComponent(this.$content())}-->`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$escapingContent" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: RawComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: RawComponent, isStandalone: true, selector: "ng-email-raw", inputs: { $disablePlainTextOutput: { classPropertyName: "$disablePlainTextOutput", publicName: "disablePlainTextOutput", isSignal: true, isRequired: false, transformFunction: null }, $content: { classPropertyName: "$content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<angular-email-raw [attr.data-skip]=\"$disablePlainTextOutput()\">\n  <noscript [attr.data-html]=\"$escapingContent()\"></noscript>\n</angular-email-raw>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: RawComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-raw', changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<angular-email-raw [attr.data-skip]=\"$disablePlainTextOutput()\">\n  <noscript [attr.data-html]=\"$escapingContent()\"></noscript>\n</angular-email-raw>\n" }]
-        }], propDecorators: { $disablePlainTextOutput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disablePlainTextOutput", required: false }] }], $content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }] } });
-
-class PreviewComponent {
-    $preview = input('', { ...(ngDevMode ? { debugName: "$preview" } : /* istanbul ignore next */ {}), alias: 'preview' });
-    maxLength = 150;
-    $text = computed(() => {
-        const preview = this.$preview();
-        if (preview.length >= this.maxLength)
-            return null;
-        const whiteSpaceCodes = '&nbsp;&#x200c;&#x200b;&#x200d;&#x200e;&#x200f;&#xfeff;';
-        return whiteSpaceCodes.repeat(this.maxLength - preview.length);
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$text" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: PreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: PreviewComponent, isStandalone: true, selector: "ng-email-preview", inputs: { $preview: { classPropertyName: "$preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let text = $text();\n\n<div\n  id=\"__angular-email-preview\"\n  style=\"display: none; overflow: hidden; line-height: 1px; opacity: 0; max-height: 0; max-width: 0\"\n>\n  {{ $preview() }}\n  @if (text) {\n    <ng-email-raw\n      [content]=\"text\"\n      [disablePlainTextOutput]=\"false\"\n    ></ng-email-raw>\n  }\n</div>\n", dependencies: [{ kind: "component", type: RawComponent, selector: "ng-email-raw", inputs: ["disablePlainTextOutput", "content"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: PreviewComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-preview', changeDetection: ChangeDetectionStrategy.OnPush, imports: [RawComponent], template: "@let text = $text();\n\n<div\n  id=\"__angular-email-preview\"\n  style=\"display: none; overflow: hidden; line-height: 1px; opacity: 0; max-height: 0; max-width: 0\"\n>\n  {{ $preview() }}\n  @if (text) {\n    <ng-email-raw\n      [content]=\"text\"\n      [disablePlainTextOutput]=\"false\"\n    ></ng-email-raw>\n  }\n</div>\n" }]
-        }], propDecorators: { $preview: [{ type: i0.Input, args: [{ isSignal: true, alias: "preview", required: false }] }] } });
-
-class RowComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: RowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: RowComponent, isStandalone: true, selector: "ng-email-row", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table\n  align=\"center\"\n  width=\"100%\"\n  [class]=\"$styleClass()\"\n  [style]=\"$style()\"\n  role=\"presentation\"\n  cellSpacing=\"0\"\n  cellPadding=\"0\"\n  border=\"0\"\n>\n  <tbody [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n    <tr [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n      <ng-content />\n    </tr>\n  </tbody>\n</table>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: RowComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-row', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<table\n  align=\"center\"\n  width=\"100%\"\n  [class]=\"$styleClass()\"\n  [style]=\"$style()\"\n  role=\"presentation\"\n  cellSpacing=\"0\"\n  cellPadding=\"0\"\n  border=\"0\"\n>\n  <tbody [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n    <tr [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n      <ng-content />\n    </tr>\n  </tbody>\n</table>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }] } });
-
-class SectionComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $sectionStyle = computed(() => {
-        return styleToString({
-            width: '100%',
-            ...(this.$style() ?? {}),
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$sectionStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: SectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: SectionComponent, isStandalone: true, selector: "ng-email-section", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table\n  [align]=\"'center'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  width=\"100%\"\n  role=\"presentation\"\n  [style]=\"$sectionStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <tbody>\n    <tr>\n      <td>\n        <ng-content />\n      </td>\n    </tr>\n  </tbody>\n</table>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: SectionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-section', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<table\n  [align]=\"'center'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  width=\"100%\"\n  role=\"presentation\"\n  [style]=\"$sectionStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <tbody>\n    <tr>\n      <td>\n        <ng-content />\n      </td>\n    </tr>\n  </tbody>\n</table>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }] } });
-
-class TextComponent {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    $style = input(null, { ...(ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {}), alias: 'style' });
-    $styleClass = input(undefined, { ...(ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {}), alias: 'styleClass' });
-    $disableDefaultStyle = input(false, { ...(ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {}), alias: 'disableDefaultStyle' });
-    $textStyle = computed(() => {
-        return {
-            ...(this.$disableDefaultStyle()
-                ? {}
-                : {
-                    fontSize: '14px',
-                    lineHeight: '24px',
-                    margin: '16px 0',
-                }),
-            ...(this.$style() ?? {}),
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "$textStyle" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: TextComponent, isStandalone: true, selector: "ng-email-text", inputs: { $style: { classPropertyName: "$style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, $styleClass: { classPropertyName: "$styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, $disableDefaultStyle: { classPropertyName: "$disableDefaultStyle", publicName: "disableDefaultStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p\n  [style]=\"$textStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content></ng-content>\n</p>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TextComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ng-email-text', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p\n  [style]=\"$textStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content></ng-content>\n</p>\n" }]
-        }], propDecorators: { $style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], $styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], $disableDefaultStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableDefaultStyle", required: false }] }] } });
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/**
- * Renders an Angular component to HTML and applies transformations.
- *
- * @param component - The Angular component to render.
- * @param selector - The Component selector.
- * @param options - Optional rendering options.
- *
- * @returns {Promise<string>} The rendered HTML or plain text.
- */
-const render = async ({ component, selector, props, options, }) => {
-    const __originalConsoleLog = console.log;
-    console.log = ((log) => (...args) => {
-        if (args[0] !== 'Angular is running in development mode.')
-            log(...args);
-    })(console.log);
-    try {
-        const { style, html: normalizedHtml } = await renderNgComponent(component, selector, props, options?.signalInputsPrefix);
-        const html = applyHtmlTransformations(normalizedHtml);
-        if (options?.plainText) {
-            return renderAsPlainText(html);
-        }
-        const cssProcessor = options?.cssProcessor;
-        const css = await parseStyles(style, html, cssProcessor);
-        const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
-        const markup = await inlineCss(html, css, !!options?.pretty);
-        const document = `${doctype}${markup}`;
-        return document;
-    }
-    finally {
-        console.log = __originalConsoleLog;
-    }
-};
-/**
- * Converts the given markup string to plain text while skipping certain elements.
- *
- * @param markup - The HTML markup string to be converted to plain text.
- * @returns The plain text representation of the given markup.
- *
- * The conversion skips the following elements:
- * - `<img>` tags
- * - Elements with the ID `__angular-email-preview`
- */
+var HeadingComponent = class HeadingComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$as = input("h1", {
+		...ngDevMode ? { debugName: "$as" } : /* istanbul ignore next */ {},
+		alias: "as"
+	});
+	$m = input(void 0, {
+		...ngDevMode ? { debugName: "$m" } : /* istanbul ignore next */ {},
+		alias: "m"
+	});
+	$mx = input(void 0, {
+		...ngDevMode ? { debugName: "$mx" } : /* istanbul ignore next */ {},
+		alias: "mx"
+	});
+	$my = input(void 0, {
+		...ngDevMode ? { debugName: "$my" } : /* istanbul ignore next */ {},
+		alias: "my"
+	});
+	$mt = input(void 0, {
+		...ngDevMode ? { debugName: "$mt" } : /* istanbul ignore next */ {},
+		alias: "mt"
+	});
+	$mr = input(void 0, {
+		...ngDevMode ? { debugName: "$mr" } : /* istanbul ignore next */ {},
+		alias: "mr"
+	});
+	$mb = input(void 0, {
+		...ngDevMode ? { debugName: "$mb" } : /* istanbul ignore next */ {},
+		alias: "mb"
+	});
+	$ml = input(void 0, {
+		...ngDevMode ? { debugName: "$ml" } : /* istanbul ignore next */ {},
+		alias: "ml"
+	});
+	$headingStyle = computed(() => {
+		return styleToString({
+			...withMargin({
+				m: this.$m(),
+				mx: this.$mx(),
+				my: this.$my(),
+				mt: this.$mt(),
+				mr: this.$mr(),
+				mb: this.$mb(),
+				ml: this.$ml()
+			}),
+			...this.$style() ?? {}
+		});
+	}, ...ngDevMode ? [{ debugName: "$headingStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: HeadingComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: HeadingComponent,
+		isStandalone: true,
+		selector: "ng-email-heading",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$as: {
+				classPropertyName: "$as",
+				publicName: "as",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$m: {
+				classPropertyName: "$m",
+				publicName: "m",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$mx: {
+				classPropertyName: "$mx",
+				publicName: "mx",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$my: {
+				classPropertyName: "$my",
+				publicName: "my",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$mt: {
+				classPropertyName: "$mt",
+				publicName: "mt",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$mr: {
+				classPropertyName: "$mr",
+				publicName: "mr",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$mb: {
+				classPropertyName: "$mb",
+				publicName: "mb",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$ml: {
+				classPropertyName: "$ml",
+				publicName: "ml",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let heading = $as();\n@let style = $headingStyle();\n@let styleClass = $styleClass();\n@if (heading === 'h1') {\n  <h1\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h1>\n} @else if (heading === 'h2') {\n  <h2\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h2>\n} @else if (heading === 'h3') {\n  <h3\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h3>\n} @else if (heading === 'h4') {\n  <h4\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h4>\n} @else if (heading === 'h5') {\n  <h5\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h5>\n} @else if (heading === 'h6') {\n  <h6\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h6>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n",
+		dependencies: [{
+			kind: "directive",
+			type: NgTemplateOutlet,
+			selector: "[ngTemplateOutlet]",
+			inputs: [
+				"ngTemplateOutletContext",
+				"ngTemplateOutlet",
+				"ngTemplateOutletInjector"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: HeadingComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-heading",
+			imports: [NgTemplateOutlet],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "@let heading = $as();\n@let style = $headingStyle();\n@let styleClass = $styleClass();\n@if (heading === 'h1') {\n  <h1\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h1>\n} @else if (heading === 'h2') {\n  <h2\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h2>\n} @else if (heading === 'h3') {\n  <h3\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h3>\n} @else if (heading === 'h4') {\n  <h4\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h4>\n} @else if (heading === 'h5') {\n  <h5\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h5>\n} @else if (heading === 'h6') {\n  <h6\n    [style]=\"style\"\n    [class]=\"styleClass\"\n  >\n    <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n  </h6>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$as: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "as",
+				required: false
+			}]
+		}],
+		$m: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "m",
+				required: false
+			}]
+		}],
+		$mx: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mx",
+				required: false
+			}]
+		}],
+		$my: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "my",
+				required: false
+			}]
+		}],
+		$mt: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mt",
+				required: false
+			}]
+		}],
+		$mr: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mr",
+				required: false
+			}]
+		}],
+		$mb: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mb",
+				required: false
+			}]
+		}],
+		$ml: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ml",
+				required: false
+			}]
+		}]
+	}
+});
+var HrComponent = class HrComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	$hrStyle = computed(() => {
+		return {
+			...this.$disableDefaultStyle() ? {} : {
+				width: "100%",
+				border: "none",
+				borderTop: "1px solid #eaeaea"
+			},
+			...this.$style() ?? {}
+		};
+	}, ...ngDevMode ? [{ debugName: "$hrStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: HrComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: HrComponent,
+		isStandalone: true,
+		selector: "ng-email-hr",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<hr\n  [style]=\"$hrStyle()\"\n  [class]=\"$styleClass()\"\n/>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: HrComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-hr",
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<hr\n  [style]=\"$hrStyle()\"\n  [class]=\"$styleClass()\"\n/>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}]
+	}
+});
+var HtmlComponent = class HtmlComponent {
+	$lang = input("en", {
+		...ngDevMode ? { debugName: "$lang" } : /* istanbul ignore next */ {},
+		alias: "lang"
+	});
+	$dir = input("ltr", {
+		...ngDevMode ? { debugName: "$dir" } : /* istanbul ignore next */ {},
+		alias: "dir"
+	});
+	$enableVML = input(true, {
+		...ngDevMode ? { debugName: "$enableVML" } : /* istanbul ignore next */ {},
+		alias: "enableVML"
+	});
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: HtmlComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: HtmlComponent,
+		isStandalone: true,
+		selector: "ng-email-html",
+		inputs: {
+			$lang: {
+				classPropertyName: "$lang",
+				publicName: "lang",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$dir: {
+				classPropertyName: "$dir",
+				publicName: "dir",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$enableVML: {
+				classPropertyName: "$enableVML",
+				publicName: "enableVML",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "@let enableVML = $enableVML();\n@let lang = $lang();\n@let dir = $dir();\n\n<html\n  id=\"__angular-email\"\n  [lang]=\"lang\"\n  [dir]=\"dir\"\n  [attr.xmlns:o]=\"enableVML ? 'urn:schemas-microsoft-com:office:office' : undefined\"\n  [attr.xmlns:v]=\"enableVML ? 'urn:schemas-microsoft-com:vml' : undefined\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</html>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: HtmlComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-html",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "@let enableVML = $enableVML();\n@let lang = $lang();\n@let dir = $dir();\n\n<html\n  id=\"__angular-email\"\n  [lang]=\"lang\"\n  [dir]=\"dir\"\n  [attr.xmlns:o]=\"enableVML ? 'urn:schemas-microsoft-com:office:office' : undefined\"\n  [attr.xmlns:v]=\"enableVML ? 'urn:schemas-microsoft-com:vml' : undefined\"\n  [style]=\"$style()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content />\n</html>\n"
+		}]
+	}],
+	propDecorators: {
+		$lang: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "lang",
+				required: false
+			}]
+		}],
+		$dir: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dir",
+				required: false
+			}]
+		}],
+		$enableVML: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "enableVML",
+				required: false
+			}]
+		}],
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}]
+	}
+});
+var ImgComponent = class ImgComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	$alt = input("", {
+		...ngDevMode ? { debugName: "$alt" } : /* istanbul ignore next */ {},
+		alias: "alt"
+	});
+	$src = input("", {
+		...ngDevMode ? { debugName: "$src" } : /* istanbul ignore next */ {},
+		alias: "src"
+	});
+	$width = input(void 0, {
+		...ngDevMode ? { debugName: "$width" } : /* istanbul ignore next */ {},
+		alias: "width"
+	});
+	$height = input(void 0, {
+		...ngDevMode ? { debugName: "$height" } : /* istanbul ignore next */ {},
+		alias: "height"
+	});
+	$imageStyle = computed(() => {
+		return {
+			...this.$disableDefaultStyle() ? {} : {
+				display: "block",
+				outline: "none",
+				border: "none",
+				textDecoration: "none"
+			},
+			...this.$style() ?? {}
+		};
+	}, ...ngDevMode ? [{ debugName: "$imageStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImgComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: ImgComponent,
+		isStandalone: true,
+		selector: "ng-email-img",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$alt: {
+				classPropertyName: "$alt",
+				publicName: "alt",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$src: {
+				classPropertyName: "$src",
+				publicName: "src",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$width: {
+				classPropertyName: "$width",
+				publicName: "width",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$height: {
+				classPropertyName: "$height",
+				publicName: "height",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<img\n  [style]=\"$imageStyle()\"\n  [class]=\"$styleClass()\"\n  [alt]=\"$alt()\"\n  [src]=\"$src()\"\n  [attr.width]=\"$width()\"\n  [attr.height]=\"$height()\"\n/>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ImgComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-img",
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<img\n  [style]=\"$imageStyle()\"\n  [class]=\"$styleClass()\"\n  [alt]=\"$alt()\"\n  [src]=\"$src()\"\n  [attr.width]=\"$width()\"\n  [attr.height]=\"$height()\"\n/>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}],
+		$alt: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "alt",
+				required: false
+			}]
+		}],
+		$src: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "src",
+				required: false
+			}]
+		}],
+		$width: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "width",
+				required: false
+			}]
+		}],
+		$height: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "height",
+				required: false
+			}]
+		}]
+	}
+});
+var LinkComponent = class LinkComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	$href = input("", {
+		...ngDevMode ? { debugName: "$href" } : /* istanbul ignore next */ {},
+		alias: "href"
+	});
+	$target = input("_blank", {
+		...ngDevMode ? { debugName: "$target" } : /* istanbul ignore next */ {},
+		alias: "target"
+	});
+	$linkStyle = computed(() => {
+		return {
+			...this.$disableDefaultStyle() ? {} : {
+				color: "#067df7",
+				textDecoration: "none"
+			},
+			...this.$style() ?? {}
+		};
+	}, ...ngDevMode ? [{ debugName: "$linkStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: LinkComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: LinkComponent,
+		isStandalone: true,
+		selector: "ng-email-link",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$href: {
+				classPropertyName: "$href",
+				publicName: "href",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$target: {
+				classPropertyName: "$target",
+				publicName: "target",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<a\n  [style]=\"$linkStyle()\"\n  [class]=\"$styleClass()\"\n  [href]=\"$href()\"\n  [target]=\"$target()\"\n  ><ng-content></ng-content\n></a>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: LinkComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-link",
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<a\n  [style]=\"$linkStyle()\"\n  [class]=\"$styleClass()\"\n  [href]=\"$href()\"\n  [target]=\"$target()\"\n  ><ng-content></ng-content\n></a>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}],
+		$href: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "href",
+				required: false
+			}]
+		}],
+		$target: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "target",
+				required: false
+			}]
+		}]
+	}
+});
+var RawComponent = class RawComponent {
+	$disablePlainTextOutput = input(false, {
+		...ngDevMode ? { debugName: "$disablePlainTextOutput" } : /* istanbul ignore next */ {},
+		alias: "disablePlainTextOutput"
+	});
+	$content = input("", {
+		...ngDevMode ? { debugName: "$content" } : /* istanbul ignore next */ {},
+		alias: "content"
+	});
+	$escapingContent = computed(() => `<!--${escapeForRawComponent(this.$content())}-->`, ...ngDevMode ? [{ debugName: "$escapingContent" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RawComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: RawComponent,
+		isStandalone: true,
+		selector: "ng-email-raw",
+		inputs: {
+			$disablePlainTextOutput: {
+				classPropertyName: "$disablePlainTextOutput",
+				publicName: "disablePlainTextOutput",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$content: {
+				classPropertyName: "$content",
+				publicName: "content",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<angular-email-raw [attr.data-skip]=\"$disablePlainTextOutput()\">\n  <noscript [attr.data-html]=\"$escapingContent()\"></noscript>\n</angular-email-raw>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: RawComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-raw",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			schemas: [CUSTOM_ELEMENTS_SCHEMA],
+			template: "<angular-email-raw [attr.data-skip]=\"$disablePlainTextOutput()\">\n  <noscript [attr.data-html]=\"$escapingContent()\"></noscript>\n</angular-email-raw>\n"
+		}]
+	}],
+	propDecorators: {
+		$disablePlainTextOutput: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disablePlainTextOutput",
+				required: false
+			}]
+		}],
+		$content: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "content",
+				required: false
+			}]
+		}]
+	}
+});
+var PreviewComponent = class PreviewComponent {
+	$preview = input("", {
+		...ngDevMode ? { debugName: "$preview" } : /* istanbul ignore next */ {},
+		alias: "preview"
+	});
+	maxLength = 150;
+	$text = computed(() => {
+		const preview = this.$preview();
+		if (preview.length >= this.maxLength) return null;
+		return "&nbsp;&#x200c;&#x200b;&#x200d;&#x200e;&#x200f;&#xfeff;".repeat(this.maxLength - preview.length);
+	}, ...ngDevMode ? [{ debugName: "$text" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: PreviewComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: PreviewComponent,
+		isStandalone: true,
+		selector: "ng-email-preview",
+		inputs: { $preview: {
+			classPropertyName: "$preview",
+			publicName: "preview",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: "@let text = $text();\n\n<div\n  id=\"__angular-email-preview\"\n  style=\"display: none; overflow: hidden; line-height: 1px; opacity: 0; max-height: 0; max-width: 0\"\n>\n  {{ $preview() }}\n  @if (text) {\n    <ng-email-raw\n      [content]=\"text\"\n      [disablePlainTextOutput]=\"false\"\n    ></ng-email-raw>\n  }\n</div>\n",
+		dependencies: [{
+			kind: "component",
+			type: RawComponent,
+			selector: "ng-email-raw",
+			inputs: ["disablePlainTextOutput", "content"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: PreviewComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-preview",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [RawComponent],
+			template: "@let text = $text();\n\n<div\n  id=\"__angular-email-preview\"\n  style=\"display: none; overflow: hidden; line-height: 1px; opacity: 0; max-height: 0; max-width: 0\"\n>\n  {{ $preview() }}\n  @if (text) {\n    <ng-email-raw\n      [content]=\"text\"\n      [disablePlainTextOutput]=\"false\"\n    ></ng-email-raw>\n  }\n</div>\n"
+		}]
+	}],
+	propDecorators: { $preview: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "preview",
+			required: false
+		}]
+	}] }
+});
+var RowComponent = class RowComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RowComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: RowComponent,
+		isStandalone: true,
+		selector: "ng-email-row",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<table\n  align=\"center\"\n  width=\"100%\"\n  [class]=\"$styleClass()\"\n  [style]=\"$style()\"\n  role=\"presentation\"\n  cellSpacing=\"0\"\n  cellPadding=\"0\"\n  border=\"0\"\n>\n  <tbody [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n    <tr [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n      <ng-content />\n    </tr>\n  </tbody>\n</table>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: RowComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-row",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [],
+			template: "<table\n  align=\"center\"\n  width=\"100%\"\n  [class]=\"$styleClass()\"\n  [style]=\"$style()\"\n  role=\"presentation\"\n  cellSpacing=\"0\"\n  cellPadding=\"0\"\n  border=\"0\"\n>\n  <tbody [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n    <tr [style]=\"$disableDefaultStyle() ? {} : { width: '100%' }\">\n      <ng-content />\n    </tr>\n  </tbody>\n</table>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}]
+	}
+});
+var SectionComponent = class SectionComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$sectionStyle = computed(() => {
+		return styleToString({
+			width: "100%",
+			...this.$style() ?? {}
+		});
+	}, ...ngDevMode ? [{ debugName: "$sectionStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: SectionComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: SectionComponent,
+		isStandalone: true,
+		selector: "ng-email-section",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<table\n  [align]=\"'center'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  width=\"100%\"\n  role=\"presentation\"\n  [style]=\"$sectionStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <tbody>\n    <tr>\n      <td>\n        <ng-content />\n      </td>\n    </tr>\n  </tbody>\n</table>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: SectionComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-section",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [],
+			template: "<table\n  [align]=\"'center'\"\n  [border]=\"0\"\n  [cellPadding]=\"0\"\n  [cellSpacing]=\"0\"\n  width=\"100%\"\n  role=\"presentation\"\n  [style]=\"$sectionStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <tbody>\n    <tr>\n      <td>\n        <ng-content />\n      </td>\n    </tr>\n  </tbody>\n</table>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}]
+	}
+});
+var TextComponent = class TextComponent {
+	$style = input(null, {
+		...ngDevMode ? { debugName: "$style" } : /* istanbul ignore next */ {},
+		alias: "style"
+	});
+	$styleClass = input(void 0, {
+		...ngDevMode ? { debugName: "$styleClass" } : /* istanbul ignore next */ {},
+		alias: "styleClass"
+	});
+	$disableDefaultStyle = input(false, {
+		...ngDevMode ? { debugName: "$disableDefaultStyle" } : /* istanbul ignore next */ {},
+		alias: "disableDefaultStyle"
+	});
+	$textStyle = computed(() => {
+		return {
+			...this.$disableDefaultStyle() ? {} : {
+				fontSize: "14px",
+				lineHeight: "24px",
+				margin: "16px 0"
+			},
+			...this.$style() ?? {}
+		};
+	}, ...ngDevMode ? [{ debugName: "$textStyle" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: TextComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: TextComponent,
+		isStandalone: true,
+		selector: "ng-email-text",
+		inputs: {
+			$style: {
+				classPropertyName: "$style",
+				publicName: "style",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$styleClass: {
+				classPropertyName: "$styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			$disableDefaultStyle: {
+				classPropertyName: "$disableDefaultStyle",
+				publicName: "disableDefaultStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<p\n  [style]=\"$textStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content></ng-content>\n</p>\n",
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: TextComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ng-email-text",
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<p\n  [style]=\"$textStyle()\"\n  [class]=\"$styleClass()\"\n>\n  <ng-content></ng-content>\n</p>\n"
+		}]
+	}],
+	propDecorators: {
+		$style: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "style",
+				required: false
+			}]
+		}],
+		$styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		$disableDefaultStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disableDefaultStyle",
+				required: false
+			}]
+		}]
+	}
+});
+const render = async ({ component, selector, props, options }) => {
+	const __originalConsoleLog = console.log;
+	console.log = ((log) => (...args) => {
+		if (args[0] !== "Angular is running in development mode.") log(...args);
+	})(console.log);
+	try {
+		const { style, html: normalizedHtml } = await renderNgComponent(component, selector, props, options?.signalInputsPrefix);
+		const html = applyHtmlTransformations(normalizedHtml);
+		if (options?.plainText) return renderAsPlainText(html);
+		const cssProcessor = options?.cssProcessor;
+		const css = await parseStyles(style, html, cssProcessor);
+		return `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">${await inlineCss(html, css, !!options?.pretty)}`;
+	} finally {
+		console.log = __originalConsoleLog;
+	}
+};
 const renderAsPlainText = (markup) => {
-    return convert(markup, {
-        decodeEntities: true,
-        formatters: {
-            raw: (elem, _walk, builder) => {
-                if (elem.children.length && elem.children[0].type === 'comment') {
-                    builder.addInline(unescapeForRawComponent(elem.children[0].data.trim()));
-                }
-            },
-        },
-        selectors: [
-            { selector: '[data-skip="true"]', format: 'skip' },
-            { selector: 'img', format: 'skip' },
-            { selector: '#__angular-email-preview', format: 'skip' },
-            {
-                format: 'raw',
-                options: {},
-                selector: 'angular-email-raw',
-            },
-            { selector: 'h1', format: 'heading', options: { leadingLineBreaks: 3, trailingLineBreaks: 2, uppercase: false } },
-            { selector: 'h2', format: 'heading', options: { leadingLineBreaks: 3, trailingLineBreaks: 2, uppercase: false } },
-            { selector: 'h3', format: 'heading', options: { leadingLineBreaks: 3, trailingLineBreaks: 2, uppercase: false } },
-            { selector: 'h4', format: 'heading', options: { leadingLineBreaks: 2, trailingLineBreaks: 2, uppercase: false } },
-            { selector: 'h5', format: 'heading', options: { leadingLineBreaks: 2, trailingLineBreaks: 2, uppercase: false } },
-            { selector: 'h6', format: 'heading', options: { leadingLineBreaks: 2, trailingLineBreaks: 2, uppercase: false } },
-        ],
-    });
-};
-/**
- * Renders an Angular component to html.
- *
- * @param component - The Angular component to render.
- * @param selector - The CSS selector for the component.
- * @returns A promise that resolves to the rendered HTML string.
- */
+	return convert(markup, {
+		decodeEntities: true,
+		formatters: { raw: (elem, _walk, builder) => {
+			if (elem.children.length && elem.children[0].type === "comment") builder.addInline(unescapeForRawComponent(elem.children[0].data.trim()));
+		} },
+		selectors: [
+			{
+				selector: "[data-skip=\"true\"]",
+				format: "skip"
+			},
+			{
+				selector: "img",
+				format: "skip"
+			},
+			{
+				selector: "#__angular-email-preview",
+				format: "skip"
+			},
+			{
+				format: "raw",
+				options: {},
+				selector: "angular-email-raw"
+			},
+			{
+				selector: "h1",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 3,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			},
+			{
+				selector: "h2",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 3,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			},
+			{
+				selector: "h3",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 3,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			},
+			{
+				selector: "h4",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 2,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			},
+			{
+				selector: "h5",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 2,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			},
+			{
+				selector: "h6",
+				format: "heading",
+				options: {
+					leadingLineBreaks: 2,
+					trailingLineBreaks: 2,
+					uppercase: false
+				}
+			}
+		]
+	});
+};
 const renderNgComponent = async (component, selector, props, signalInputsPrefix) => {
-    const bootstrap = async (context) => {
-        const appRef = await bootstrapApplication(component, {
-            providers: [provideZonelessChangeDetection(), provideServerRendering()],
-        }, context);
-        appRef.components.forEach((componentRef) => {
-            Object.entries(props ?? {}).forEach(([key, value]) => {
-                if (key in componentRef.instance || `${signalInputsPrefix ?? ''}${key}` in componentRef.instance) {
-                    componentRef.setInput(key, value);
-                }
-            });
-            componentRef.changeDetectorRef.detectChanges();
-        });
-        return appRef;
-    };
-    const ngHtml = await renderApplication(bootstrap, {
-        document: `<${selector}></${selector}>`,
-    });
-    const $ = cheerio.load(ngHtml, {
-        xml: { lowerCaseAttributeNames: false, lowerCaseTags: false },
-    });
-    let style = '';
-    $('style').each(function () {
-        const content = $(this).html();
-        if (content) {
-            style += `\n${content}`;
-        }
-    });
-    const html = normalizeNgHtml(ngHtml, selector);
-    return { style, html };
-};
-/**
- * Normalizes the provided HTML string by extracting the content within the specified selector
- * and removing any non-standard HTML elements.
- *
- * @param html - The HTML string to be normalized.
- * @param selector - The CSS selector used to identify the content to be extracted.
- * @returns The normalized HTML string with the content of the specified selector and without non-standard HTML elements.
- */
+	const bootstrap = async (context) => {
+		const appRef = await bootstrapApplication(component, { providers: [provideZonelessChangeDetection(), provideServerRendering()] }, context);
+		appRef.components.forEach((componentRef) => {
+			Object.entries(props ?? {}).forEach(([key, value]) => {
+				if (key in componentRef.instance || `${signalInputsPrefix ?? ""}${key}` in componentRef.instance) componentRef.setInput(key, value);
+			});
+			componentRef.changeDetectorRef.detectChanges();
+		});
+		return appRef;
+	};
+	const ngHtml = await renderApplication(bootstrap, { document: `<${selector}></${selector}>` });
+	const $ = cheerio.load(ngHtml, { xml: {
+		lowerCaseAttributeNames: false,
+		lowerCaseTags: false
+	} });
+	let style = "";
+	$("style").each(function() {
+		const content = $(this).html();
+		if (content) style += `\n${content}`;
+	});
+	const html = normalizeNgHtml(ngHtml, selector);
+	return {
+		style,
+		html
+	};
+};
 const normalizeNgHtml = (html, selector) => {
-    const nsHtmlRegex = new RegExp(`<(?!(\\/?(${HTMLElements.join('|')})(?![-\\w])))[^>]+>`, 'gm');
-    return html
-        .replace(new RegExp(`[\\s\\S]*?<${selector}[\\s\\S]*?>([\\s\\S]*?)<\\/${selector}>[\\s\\S]*?.+`, 'gm'), '$1')
-        .replace(nsHtmlRegex, '');
-};
-/**
- * Applies HTML transformations to the provided HTML string.
- *
- * This function uses Cheerio to load the HTML and perform transformations such as
- * replacing placeholders and applying styles from the provided CSS file paths.
- * It also ensures that certain HTML entities are replaced with their corresponding
- * characters.
- *
- * @param html - The HTML string to transform.
- * @param cssFilePaths - An optional array of CSS file paths to apply styles from.
- * @returns The transformed HTML string.
- */
+	const nsHtmlRegex = new RegExp(`<(?!(\\/?(${HTMLElements.join("|")})(?![-\\w])))[^>]+>`, "gm");
+	return html.replace(new RegExp(`[\\s\\S]*?<${selector}[\\s\\S]*?>([\\s\\S]*?)<\\/${selector}>[\\s\\S]*?.+`, "gm"), "$1").replace(nsHtmlRegex, "");
+};
 const applyHtmlTransformations = (html) => {
-    const $ = cheerio.load(html);
-    replacePlaceholders($);
-    return resolveCssVarNamespace($.html()
-        .replace(/\s+/g, ' ')
-        .replace(/>\s+</g, '><')
-        .replaceAll('&lt;', '<')
-        .replaceAll('&gt;', '>')
-        .replaceAll('&#x24;', '$'));
-};
-/**
- * Resolves the CSS variable namespace placeholder emitted by the Angular compiler.
- *
- * Since Angular 22.1 every custom property declared in a component stylesheet
- * (or bound in a template) is compiled to `--%NS%name`. The placeholder is meant
- * to be resolved by the DOM renderer, which replaces it with the namespace opted
- * in through `provideCssVarNamespacing()` or with an empty string when unused.
- * That only happens with `@angular/platform-browser` >= 22.1: with an older
- * renderer the placeholder leaks into the rendered markup and produces invalid
- * custom properties, breaking every `var()` and theme lookup downstream.
- *
- * @param input the rendered css or html
- * @returns the input with any leftover placeholder removed
- */
+	const $ = cheerio.load(html);
+	replacePlaceholders($);
+	return resolveCssVarNamespace($.html().replace(/\s+/g, " ").replace(/>\s+</g, "><").replaceAll("&lt;", "<").replaceAll("&gt;", ">").replaceAll("&#x24;", "$"));
+};
 const resolveCssVarNamespace = (input) => {
-    return input.replaceAll('--%NS%', '--');
-};
-/**
- * Replaces elements with the `data-html` attribute with their corresponding HTML content.
- *
- * This function iterates over all elements that have the `data-html` attribute,
- * retrieves the value of the attribute, and replaces the element with the HTML content
- * specified in the attribute.
- *
- * @param $ - The Cheerio API instance used to manipulate the HTML.
- */
+	return input.replaceAll("--%NS%", "--");
+};
 const replacePlaceholders = ($) => {
-    $('[data-html]').each(function () {
-        const content = $(this).attr('data-html');
-        if (content) {
-            $(this).replaceWith(`${content}`);
-        }
-    });
-};
-/**
- * Applies the styles from the specified CSS file paths to the HTML document.
- *
- * @param style - The raw content of <style> tags
- * @param cssProcessor - Optional hook for manipulate the css extracted.
- * Useful for postcss processing
- *
- */
+	$("[data-html]").each(function() {
+		const content = $(this).attr("data-html");
+		if (content) $(this).replaceWith(`${content}`);
+	});
+};
 const parseStyles = async (style, html, cssProcessor) => {
-    const normalized = normalizeCssInput(style);
-    if (!cssProcessor)
-        return normalized;
-    const processed = await cssProcessor(normalized, html);
-    return processed;
-};
-/**
- * Normalize css
- *
- * @param input css to normalize
- * @returns normalized css
- */
+	const normalized = normalizeCssInput(style);
+	if (!cssProcessor) return normalized;
+	return await cssProcessor(normalized, html);
+};
 const normalizeCssInput = (input) => {
-    return resolveCssVarNamespace(input
-        .replace(/\s+/g, ' ')
-        .replace(/>\s+</g, '><')
-        .replaceAll('&lt;', '<')
-        .replaceAll('&gt;', '>')
-        .replaceAll('&#x24;', '$')
-        .replaceAll('&quot;', '"')
-        .replaceAll('&amp;', '&'));
-};
-/**
- * Inlines CSS into the provided HTML string using Maizzle and Tailwind CSS.
- *
- * @param html - The HTML string to process.
- * @param css - The CSS to inline.
- * @param pretty - Whether to prettify the output HTML. Defaults to `false`.
- * @returns A promise that resolves to the processed HTML string with inlined CSS.
- */
+	return resolveCssVarNamespace(input.replace(/\s+/g, " ").replace(/>\s+</g, "><").replaceAll("&lt;", "<").replaceAll("&gt;", ">").replaceAll("&#x24;", "$").replaceAll("&quot;", "\"").replaceAll("&amp;", "&"));
+};
 const inlineCss = async (html, css, pretty = false) => {
-    juice.styleToAttribute = {};
-    juice.excludedProperties.push(...[]);
-    juice.widthElements = ['img', 'video'].map((i) => i.toUpperCase());
-    juice.heightElements = ['img', 'video'].map((i) => i.toUpperCase());
-    const inlined = unescapeForRawComponent(juice
-        .inlineContent(html, css, {
-        applyWidthAttributes: true,
-        applyHeightAttributes: true,
-        removeStyleTags: false,
-        resolveCSSVariables: true,
-    })
-        .replace(/\s+/g, ' ')
-        .replace(/>\s+</g, '><')
-        .replaceAll('&#x24;', '$')
-        .replace(/<angular-email-raw[\s\S]*?><!--(.*?)--><\/angular-email-raw>/gm, `$1`));
-    if (pretty)
-        return prettyPrint(inlined);
-    return inlined;
+	juice.styleToAttribute = {};
+	juice.excludedProperties.push(...[]);
+	juice.widthElements = ["img", "video"].map((i) => i.toUpperCase());
+	juice.heightElements = ["img", "video"].map((i) => i.toUpperCase());
+	const inlined = unescapeForRawComponent(juice.inlineContent(html, css, {
+		applyWidthAttributes: true,
+		applyHeightAttributes: true,
+		removeStyleTags: false,
+		resolveCSSVariables: true
+	}).replace(/\s+/g, " ").replace(/>\s+</g, "><").replaceAll("&#x24;", "$").replace(/<angular-email-raw[\s\S]*?><!--(.*?)--><\/angular-email-raw>/gm, `$1`));
+	if (pretty) return prettyPrint(inlined);
+	return inlined;
 };
-
-/*
- * Public API Surface of angular-email
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
 export { BackgroundComponent, BodyComponent, ButtonComponent, ColorSchemeComponent, ColumnComponent, ConditionalComponent, ContainerComponent, HTMLElements, HeadComponent, HeadingComponent, HrComponent, HtmlComponent, ImgComponent, LinkComponent, PreviewComponent, RawComponent, RowComponent, SectionComponent, TextComponent, classToString, copyTextToClipboard, escapeForRawComponent, pxToPt, render, styleToString, unescapeForRawComponent, unreachable, withMargin };
-//# sourceMappingURL=keycloakify-angular-email.mjs.map
+
+//# sourceMappingURL=keycloakify-angular-email.mjs.map