@keycloakify/angular-email 0.0.1-rc.10

package/fesm2022/keycloakify-angular-email.mjs

@@ -0,0 +1,829 @@
+import * as i0 from '@angular/core';
+import { input, computed, Component, ChangeDetectionStrategy, effect, CUSTOM_ELEMENTS_SCHEMA, inject, NO_ERRORS_SCHEMA, provideExperimentalZonelessChangeDetection } from '@angular/core';
+import { NgTemplateOutlet, DOCUMENT } from '@angular/common';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { provideServerRendering, renderApplication } from '@angular/platform-server';
+import { render as render$1 } from '@maizzle/framework';
+import * as cheerio from 'cheerio/slim';
+import { convert } from 'html-to-text';
+import prettyPrint from 'pretty';
+
+class BackgroundComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $width = input(0, { alias: 'width' });
+    $height = input(0, { alias: 'height' });
+    $src = input(undefined, { alias: 'src' });
+    $bgRepeat = input('no-repeat', { alias: 'bgRepeat' });
+    $bgColor = input(undefined, { alias: 'bgColor' });
+    $bgStyle = computed(() => ({ backgroundRepeat: this.$bgRepeat(), ...(this.$style() ?? {}) }));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: BackgroundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class BodyComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: BodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class ButtonComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(null, { alias: 'styleClass' });
+    $href = input(undefined, { alias: 'href' });
+    $textContent = input.required({ alias: 'textContent' });
+    $width = input(undefined, { alias: 'width' });
+    $height = input(undefined, { alias: 'height' });
+    $borderRadius = input(0, { alias: 'borderRadius' });
+    $textColor = input(undefined, { alias: 'textColor' });
+    $backgroundColor = input(undefined, { alias: 'backgroundColor' });
+    $borderColor = input(undefined, { alias: 'borderColor' });
+    $borderSize = input(1, { alias: 'borderSize' });
+    $fontSize = input(16, { alias: 'fontSize' });
+    $align = input('left', { alias: 'align' });
+    $withBackground = input(false, { alias: 'withBackground' });
+    $arcsize = computed(() => Math.floor((this.$borderRadius() / (this.$height() ?? 1)) * 100));
+    $lineHeight = computed(() => this.$borderSize() ? (this.$height() ?? 0) - 2 * this.$borderSize() : (this.$height() ?? 0));
+    $baseStyle = computed(() => ({
+        '-webkit-text-size-adjust': 'none',
+        borderRadius: this.$borderRadius(),
+        display: 'inline-block',
+        fontSize: this.$fontSize(),
+        lineHeight: `${this.$lineHeight()}px`,
+        maxWidth: this.$width(),
+        textAlign: 'center',
+        textDecoration: 'none',
+        width: '100%',
+    }));
+    $borderStyles = computed(() => ({
+        border: `${this.$borderSize()}px solid ${this.$borderColor()}`,
+        msoBorderAlt: 'none',
+    }));
+    $propStyles = computed(() => ({
+        // border styles
+        ...(this.$borderColor() ? this.$borderStyles() : {}),
+        // background styles
+        ...(this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {}),
+        // text styles
+        ...(this.$textColor() ? { color: this.$textColor() } : {}),
+    }));
+    $withBackgroundStyle = computed(() => ({
+        ...this.$baseStyle(),
+        // background styles
+        ...(this.$backgroundColor() ? { backgroundColor: this.$backgroundColor() } : {}),
+        // text styles
+        ...(this.$textColor() ? { color: this.$textColor() } : {}),
+        ...(this.$style() ?? {}),
+        ...(this.$withBackground() ? {} : { msoHide: 'all' }),
+    }));
+    $withoutBackgroundStyle = computed(() => ({
+        ...this.$baseStyle(),
+        // background styles
+        ...this.$propStyles(),
+        ...(this.$style() ?? {}),
+        ...(this.$withBackground() ? {} : { msoHide: 'all' }),
+    }));
+    $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"`}>
+            <w:anchorlock/>
+            <center style="font-size:${fontSize}px;${textColor ? `color:${textColor};` : ''}">
+            ${textContent}
+            </center></v:roundrect>
+            <![endif]-->`;
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.6", 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,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius,\n                height,\n                width,\n                maxWidth: width,\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: "19.1.6", 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,\n          }\"\n        >\n          <tr>\n            <td\n              [attr.bgcolor]=\"$backgroundColor()\"\n              [width]=\"width\"\n              [height]=\"height\"\n              [style]=\"{\n                borderRadius,\n                height,\n                width,\n                maxWidth: width,\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" }]
+        }] });
+
+class ColorSchemeComponent {
+    $mode = input('normal', { alias: 'mode' });
+    $style = computed(() => `<style>:root { color-scheme: ${this.$mode()}; supported-color-schemes: ${this.$mode()}; }</style>`);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: ColorSchemeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class ColumnComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $bgImage = input(undefined, { alias: 'bgImage' });
+    $bgColor = input(undefined, { alias: 'bgColor' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: ColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class ConditionalComponent {
+    $expression = input(undefined, { alias: 'expression' });
+    $mso = input(undefined, { alias: 'mso' });
+    noMsoInnerHtmlPre = '&lt;!--[if !mso]&gt;&lt;!--&gt;';
+    noMsoInnerHtmlPost = '&lt;!--&lt;![endif]--&gt;';
+    $msoInnerHtmlPre = computed(() => `&lt;!--[if ${this.$expression() ?? 'mso'}]&gt;`);
+    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: "19.1.6", ngImport: i0, type: ConditionalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.6", 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: "19.1.6", 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: () => [] });
+
+class ContainerComponent {
+    random = Math.random();
+    document = inject(DOCUMENT);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $alignment = input('center', { alias: 'alignment' });
+    $disableDefaultStyle = input(false, { alias: 'disableDefaultStyle' });
+    $containerWidth = input(600, { alias: 'containerWidth' });
+    $containerStyle = computed(() => ({
+        ...(this.$disableDefaultStyle() ? {} : { maxWidth: `${this.$containerWidth()}px` }),
+        ...this.$style(),
+    }));
+    $trStyle = computed(() => ({
+        ...(this.$disableDefaultStyle() ? {} : { width: '100%' }),
+    }));
+    $innerHtmlPre = computed(() => `<!--[if mso]><table align="${this.$alignment()}" width="${this.$containerWidth()}" style="border-spacing: 0; width:${this.$containerWidth()}px;" role="presentation"><tr><td><![endif]-->`);
+    $innerHtmlPost = computed(() => `<!--[if mso]></td></tr></table><![endif]-->`);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: ContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class HeadComponent {
+    $enableFormatDetection = input(false, { 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: "19.1.6", ngImport: i0, type: HeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+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);
+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']),
+].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
+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
+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] +
+        ';', '');
+};
+const unreachable = (condition, message = `Entered unreachable code. Received '${condition}'.`) => {
+    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',
+];
+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);
+}
+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, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $as = input('h1', { alias: 'as' });
+    $m = input(undefined, { alias: 'm' });
+    $mx = input(undefined, { alias: 'mx' });
+    $my = input(undefined, { alias: 'my' });
+    $mt = input(undefined, { alias: 'mt' });
+    $mr = input(undefined, { alias: 'mr' });
+    $mb = input(undefined, { alias: 'mb' });
+    $ml = input(undefined, { 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() ?? {}),
+        });
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: HeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class HrComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $disableDefaultStyle = input(false, { alias: 'disableDefaultStyle' });
+    $hrStyle = computed(() => {
+        return {
+            ...(this.$disableDefaultStyle()
+                ? {}
+                : {
+                    width: '100%',
+                    border: 'none',
+                    borderTop: '1px solid #eaeaea',
+                }),
+            ...(this.$style() ?? {}),
+        };
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: HrComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class HtmlComponent {
+    $lang = input('en', { alias: 'lang' });
+    $dir = input('ltr', { alias: 'dir' });
+    $enableVML = input(true, { alias: 'enableVML' });
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: HtmlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class ImgComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $disableDefaultStyle = input(false, { alias: 'disableDefaultStyle' });
+    $alt = input('', { alias: 'alt' });
+    $src = input('', { alias: 'src' });
+    $width = input('0', { alias: 'width' });
+    $height = input('0', { alias: 'height' });
+    $imageStyle = computed(() => {
+        return {
+            ...(this.$disableDefaultStyle()
+                ? {}
+                : {
+                    display: 'block',
+                    outline: 'none',
+                    border: 'none',
+                    textDecoration: 'none',
+                }),
+            ...(this.$style() ?? {}),
+        };
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: ImgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.6", 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" }]
+        }] });
+
+class LinkComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $disableDefaultStyle = input(false, { alias: 'disableDefaultStyle' });
+    $href = input('', { alias: 'href' });
+    $target = input('_blank', { alias: 'target' });
+    $linkStyle = computed(() => {
+        return {
+            ...(this.$disableDefaultStyle()
+                ? {}
+                : {
+                    color: '#067df7',
+                    textDecoration: 'none',
+                }),
+            ...(this.$style() ?? {}),
+        };
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: LinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class RawComponent {
+    $disablePlainTextOutput = input(false, { alias: 'disablePlainTextOutput' });
+    $content = input('', { alias: 'content' });
+    $escapingContent = computed(() => `<!--${escapeForRawComponent(this.$content())}-->`);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: RawComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class PreviewComponent {
+    $preview = input('', { 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);
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: PreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class SectionComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $sectionStyle = computed(() => {
+        return styleToString({
+            width: '100%',
+            ...(this.$style() ?? {}),
+        });
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: SectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+class TextComponent {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    $style = input(null, { alias: 'style' });
+    $styleClass = input(undefined, { alias: 'styleClass' });
+    $disableDefaultStyle = input(false, { alias: 'disableDefaultStyle' });
+    $textStyle = computed(() => {
+        return {
+            ...(this.$disableDefaultStyle()
+                ? {}
+                : {
+                    fontSize: '14px',
+                    lineHeight: '24px',
+                    margin: '16px 0',
+                }),
+            ...(this.$style() ?? {}),
+        };
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.6", ngImport: i0, type: TextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.6", 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: "19.1.6", 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" }]
+        }] });
+
+/* 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 { styles, html: normalizedHtml } = await renderNgComponent(component, selector, props, options?.signalInputsPrefix);
+    const html = applyHtmlTransformations(normalizedHtml, styles);
+    if (options?.plainText) {
+        return renderAsPlainText(html);
+    }
+    const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+    const tailwindConfig = options?.tailwindConfig;
+    const markup = await inlineCss(html, !!options?.pretty, tailwindConfig);
+    const document = `${doctype}${markup}`;
+    return document;
+};
+/**
+ * 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`
+ */
+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',
+            },
+        ],
+    });
+};
+/**
+ * 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.
+ */
+const renderNgComponent = async (component, selector, props, signalInputsPrefix) => {
+    const bootstrap = async () => {
+        const appRef = await bootstrapApplication(component, {
+            providers: [provideExperimentalZonelessChangeDetection(), provideServerRendering()],
+        });
+        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 },
+    });
+    const styles = [];
+    $('style').each(function () {
+        const content = $(this).html();
+        if (content) {
+            styles.push(content);
+        }
+    });
+    const html = normalizeNgHtml(ngHtml, selector);
+    return { styles, 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 normalizeNgHtml = (html, selector) => {
+    const nsHtmlRegex = new RegExp(`<(?!(\\/?(${HTMLElements.join('|')})))[^>]+>`, '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 applyHtmlTransformations = (html, styles) => {
+    const $ = cheerio.load(html, {
+        xml: { lowerCaseAttributeNames: false, lowerCaseTags: false },
+    });
+    replacePlaceholders($);
+    applyStyles($, styles);
+    return $.html()
+        .replaceAll('\n', '')
+        .replace(/\s+/g, ' ')
+        .replaceAll('&lt;', '<')
+        .replaceAll('&gt;', '>')
+        .replaceAll('&#x24;', '$');
+};
+/**
+ * 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.
+ */
+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 $ - The Cheerio API instance used to manipulate the HTML document.
+ * @param cssFilePaths - An array of file paths to the CSS files to be applied.
+ */
+const applyStyles = ($, styles) => {
+    styles.forEach((style) => {
+        $('head').append(`<style>${style}</style>`);
+    });
+};
+/**
+ * Inlines CSS into the provided HTML string using Maizzle and Tailwind CSS.
+ *
+ * @param html - The HTML string to process.
+ * @param pretty - Whether to prettify the output HTML. Defaults to `false`.
+ * @param tailwindConfig - Optional Tailwind CSS configuration to use. If not provided, the `tailwindcss-preset-email` preset will be used.
+ * @returns A promise that resolves to the processed HTML string with inlined CSS.
+ */
+const inlineCss = async (html, pretty = false, tailwindConfig) => {
+    //@ts-expect-error: missing exports
+    const tailwindcssPresetEmail = (await import('tailwindcss-preset-email')).default;
+    return (await render$1(html, {
+        afterTransformers: ({ html }) => {
+            const renderedHtml = unescapeForRawComponent(html
+                .replaceAll('\n', '')
+                .replace(/\s+/g, ' ')
+                .replaceAll('&#x24;', '$')
+                .replace(/<angular-email-raw[\s\S]*?><!--(.*?)--><\/angular-email-raw>/gm, `$1`));
+            if (pretty)
+                return prettyPrint(renderedHtml);
+            return renderedHtml;
+        },
+        css: {
+            shorthand: true,
+            inline: {
+                applyWidthAttributes: true,
+                applyHeightAttributes: true,
+            },
+            purge: {
+                doNotRemoveHTMLCommentsWhoseOpeningTagContains: ['[if', '[endif', '<#if', '</#if', '<#else', '<#elseif'],
+                removeHTMLComments: false,
+            },
+            tailwind: {
+                presets: tailwindConfig ? [tailwindConfig] : [tailwindcssPresetEmail],
+                content: [
+                    {
+                        raw: html,
+                        extension: 'html',
+                    },
+                ],
+            },
+        },
+        prettify: false,
+        minify: true,
+    })).html;
+};
+
+/*
+ * 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, SectionComponent, TextComponent, classToString, copyTextToClipboard, escapeForRawComponent, pxToPt, render, styleToString, unescapeForRawComponent, unreachable, withMargin };
+//# sourceMappingURL=keycloakify-angular-email.mjs.map