@useinsider/guido 1.0.0-beta.f7c239e → 1.0.1-beta.0168eae

package/dist/stores/toaster.d.ts

@@ -0,0 +1,18 @@
+import type { ToasterState, ToasterOptions } from '@@/Types/toaster';
+export declare const useToasterStore: import("pinia").StoreDefinition<"toaster", ToasterState, {
+    shouldAutoHide: (s: {
+        status: boolean;
+        type: import("@@/Types/toaster").ToasterType;
+        text: string;
+        icon: string;
+        withIcon: boolean;
+        withoutLeftMargin: boolean;
+        actionButton?: {
+            text: string;
+            onClick: () => void;
+        } | undefined;
+    } & import("pinia").PiniaCustomStateProperties<ToasterState>) => boolean;
+}, {
+    showToaster(this: ToasterState, { type, message, actionButton }: ToasterOptions): void;
+    hideToaster(this: ToasterState): void;
+}>;

package/dist/stores/toaster.js

@@ -0,0 +1,27 @@
+import { ToasterTypeOptions as s } from "../enums/toaster.js";
+import { defineStore as i } from "pinia";
+const a = () => ({
+  status: !1,
+  type: s.Success,
+  text: "",
+  icon: "",
+  withIcon: !0,
+  withoutLeftMargin: !1,
+  actionButton: void 0
+}), u = i("toaster", {
+  state: () => a(),
+  getters: {
+    shouldAutoHide: (t) => t.status && !!t.text
+  },
+  actions: {
+    showToaster({ type: t = s.Success, message: e, actionButton: o }) {
+      this.status = !0, this.text = e, this.type = t, this.actionButton = o;
+    },
+    hideToaster() {
+      this.status = !1, this.text = "", this.actionButton = void 0;
+    }
+  }
+});
+export {
+  u as useToasterStore
+};

package/dist/utils/arrayUtil.d.ts

@@ -0,0 +1 @@
+export declare const removeDuplicatesFromArray: <T>(arr?: T[]) => T[];

package/dist/utils/arrayUtil.js

@@ -0,0 +1,10 @@
+const s = (t = []) => {
+  const e = /* @__PURE__ */ new Set();
+  return t.filter((n) => {
+    const r = JSON.stringify(n);
+    return e.has(r) ? !1 : (e.add(r), !0);
+  });
+};
+export {
+  s as removeDuplicatesFromArray
+};

package/dist/utils/base64.d.ts

@@ -0,0 +1 @@
+export declare const base64EncodeWithSpecialChars: (value: string | number | object | unknown[]) => string;

package/dist/utils/base64.js

@@ -0,0 +1,7 @@
+const r = (t) => {
+  let e;
+  return typeof t == "string" ? e = t : typeof t == "number" ? e = t.toString() : typeof t == "object" || Array.isArray(t) ? e = JSON.stringify(t) : e = String(t), btoa(unescape(encodeURIComponent(e)));
+};
+export {
+  r as base64EncodeWithSpecialChars
+};

package/dist/utils/genericUtil.d.ts

@@ -0,0 +1,3 @@
+import type { DynamicContent, MergeTag } from '@@/Types/generic';
+export declare const dynamicContentToMergeTags: (dynamicContentList: DynamicContent[]) => MergeTag[];
+export declare const getCsrfToken: () => string;

package/dist/utils/genericUtil.js

@@ -0,0 +1,11 @@
+const l = (e) => e.map((a) => ({
+  label: a.fallback ? `${a.text} | ${a.fallback}` : a.text,
+  value: a.fallback ? `{{${a.value}|${a.fallback}}}` : `{{${a.value}}}`
+})), t = () => {
+  var e;
+  return ((e = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : e.getAttribute("content")) ?? "";
+};
+export {
+  l as dynamicContentToMergeTags,
+  t as getCsrfToken
+};

package/dist/utils/htmlCompiler.d.ts

@@ -0,0 +1,12 @@
+import type { CompilerRule, CompilationResult, HtmlCompiler } from '@@/Types/html-compiler';
+export declare class HtmlCompilerEngine implements HtmlCompiler {
+    private rules;
+    constructor(rules?: CompilerRule[]);
+    compile(html: string, rules?: CompilerRule[]): CompilationResult;
+    private applyRule;
+    private applyReplaceRule;
+    private applyRegexRule;
+    private applyRemoveRule;
+    private applyCustomRule;
+}
+export declare const createHtmlCompiler: (rules?: CompilerRule[]) => HtmlCompiler;

package/dist/utils/htmlCompiler.js

@@ -0,0 +1,70 @@
+var y = Object.defineProperty;
+var g = (p, e, r) => e in p ? y(p, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : p[e] = r;
+var u = (p, e, r) => g(p, typeof e != "symbol" ? e + "" : e, r);
+import { useToaster as m } from "../composables/useToaster.js";
+class d {
+  constructor(e = []) {
+    u(this, "rules");
+    this.rules = e;
+  }
+  compile(e, r) {
+    const l = performance.now(), t = e, o = e.length;
+    let s = e;
+    const a = [];
+    (r || this.rules).sort((n, c) => n.priority - c.priority).forEach((n) => {
+      const c = s.length;
+      s = this.applyRule(s, n), s.length !== c && a.push(n.id);
+    });
+    const i = s.length, R = o > 0 ? (o - i) / o * 100 : 0;
+    return {
+      originalHtml: t,
+      compiledHtml: s,
+      appliedRules: a,
+      // TODO: We can use stats for monitoring in the future
+      stats: {
+        originalSize: o,
+        compiledSize: i,
+        reductionPercentage: R,
+        executionTime: performance.now() - l
+      }
+    };
+  }
+  applyRule(e, r) {
+    try {
+      switch (r.type) {
+        case "replace":
+          return this.applyReplaceRule(e, r);
+        case "regex":
+          return this.applyRegexRule(e, r);
+        case "remove":
+          return this.applyRemoveRule(e, r);
+        case "custom":
+          return this.applyCustomRule(e, r);
+        default:
+          return e;
+      }
+    } catch (l) {
+      const { handleError: t } = m();
+      return t(l, `Failed to apply rule ${r.id}:`), e;
+    }
+  }
+  applyReplaceRule(e, r) {
+    const { search: l, replacement: t, replaceAll: o = !0 } = r;
+    return o ? e.replaceAll(l, t) : e.replace(l, t);
+  }
+  applyRegexRule(e, r) {
+    const { pattern: l, replacement: t, flags: o = "g" } = r, s = new RegExp(l, o);
+    return e.replace(s, t);
+  }
+  applyRemoveRule(e, r) {
+    return r.targets.reduce((l, t) => t instanceof RegExp ? l.replace(t, "") : l.replaceAll(t, ""), e);
+  }
+  applyCustomRule(e, r) {
+    return r.processor(e);
+  }
+}
+const A = (p = []) => new d(p);
+export {
+  d as HtmlCompilerEngine,
+  A as createHtmlCompiler
+};

package/dist/utils/templatePreparation.d.ts

@@ -0,0 +1,4 @@
+import type { SavedTemplateDetails } from '@@/Types/stripo';
+export declare const useTemplatePreparation: () => {
+    prepareTemplateDetails: () => Promise<SavedTemplateDetails>;
+};

package/dist/utils/templatePreparation.js

@@ -0,0 +1,33 @@
+import { useActionsApi as c } from "../composables/useActionsApi.js";
+import { useDynamicContentStore as l } from "../stores/dynamic-content.js";
+const y = () => {
+  const t = l(), { getCompiledEmail: e, getTemplateData: a } = c();
+  return {
+    prepareTemplateDetails: async () => {
+      const { html: n, ampHtml: s = "", ampErrors: o = [] } = await e({
+        minimize: !0,
+        resetDataSavedFlag: !1
+      }), { html: m, css: i, syncModulesIds: r = [] } = await a();
+      return {
+        dynamicContentList: t.getSelectedDynamicContentList,
+        compiledHtml: n,
+        rawHtml: m,
+        css: i,
+        ampHtml: s,
+        ampErrors: o,
+        modules: r,
+        recommendation: {
+          campaignUrls: {},
+          configs: {}
+        },
+        unsubscribe: {
+          status: !1,
+          config: []
+        }
+      };
+    }
+  };
+};
+export {
+  y as useTemplatePreparation
+};

package/dist/utils/tooltipUtils.d.ts

@@ -0,0 +1,2 @@
+import type { TooltipOptions } from '../@types/generic';
+export declare const getTooltipOptions: (id: string, options?: Partial<Omit<TooltipOptions, "id">>) => TooltipOptions;

package/dist/utils/tooltipUtils.js

@@ -0,0 +1,11 @@
+const e = (s, t = {}) => ({
+  id: s,
+  dynamicPosition: t.dynamicPosition ?? !1,
+  staticPosition: t.staticPosition ?? "bottom center",
+  iconStatus: t.iconStatus ?? !1,
+  offset: t.offset,
+  preventXss: t.preventXss
+});
+export {
+  e as getTooltipOptions
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "1.0.0-beta.f7c239e",
+  "version": "1.0.1-beta.0168eae",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",
@@ -10,9 +10,9 @@
   ],
   "exports": {
     ".": {
-        "import": "./dist/library.js",
-        "types": "./dist/components/Guido.vue.d.ts",
-        "require": "./dist/components/Guido.vue.js"
+      "import": "./dist/library.js",
+      "types": "./dist/components/Guido.vue.d.ts",
+      "require": "./dist/components/Guido.vue.js"
     },
     "./style": "./dist/guido.css"
   },
@@ -21,7 +21,6 @@
     "start": "vite",
     "build": "vite build && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.app.json",
     "preview": "vite preview",
-    "test": "echo \"Error: no test specified\" && exit 1",
     "lint": "NODE_OPTIONS=--max-old-space-size=2048 eslint ./ && bun run type-check",
     "lint:fix": "NODE_OPTIONS=--max-old-space-size=2048 eslint --fix ./",
     "type-check": "vue-tsc --noEmit --project tsconfig.config.json && vue-tsc --noEmit --project tsconfig.app.json"
@@ -30,11 +29,12 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
+    "@stripoinc/ui-editor-extensions": "^1.0.6",
     "@useinsider/design-system-vue": "0.14.8",
-    "@vuelidate/core": "2.0.3",
-    "@vuelidate/validators": "2.0.4",
+    "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
     "pinia": "2.3.1",
+    "valibot": "1.1.0",
     "vite": "6.3.5",
     "vue": "2.7.14"
   },
@@ -42,6 +42,7 @@
     "@cspell/eslint-plugin": "8.17.5",
     "@eslint/eslintrc": "3.3.0",
     "@eslint/js": "8.57.1",
+    "@playwright/test": "^1.54.2",
     "@stylistic/eslint-plugin": "3.1.0",
     "@stylistic/eslint-plugin-migrate": "3.1.0",
     "@types/eslint": "8.56.12",

package/dist/@types/http.d.ts

@@ -1,19 +0,0 @@
-export type HttpMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
-export interface HttpOptions extends Omit<RequestInit, 'method' | 'body'> {
-    baseURL?: string;
-    timeout?: number;
-    retry?: number;
-    retryDelay?: number;
-}
-export interface HttpResponse<T = unknown> {
-    data: T;
-    status: number;
-    statusText: string;
-    headers: Headers;
-}
-export interface HttpError {
-    message: string;
-    status?: number;
-    statusText?: string;
-    response?: Response;
-}

package/dist/composables/useTemplates.d.ts

@@ -1,5 +0,0 @@
-import type { Template } from '@@/Types/stripo';
-export declare const useTemplates: () => {
-    getDefaultTemplate: () => Promise<Template>;
-    getTemplate: (templateName: string) => Promise<Template>;
-};

package/dist/composables/useTemplates.js

@@ -1,27 +0,0 @@
-const s = () => {
-  const t = async () => {
-    const [e, a] = await Promise.all([
-      // eslint-disable-next-line import/extensions
-      import("../static/templates/default/index.html.js"),
-      import("../static/templates/default/style.css.js")
-    ]);
-    return {
-      html: e.default,
-      css: a.default
-    };
-  };
-  return {
-    getDefaultTemplate: t,
-    getTemplate: async (e) => {
-      switch (e) {
-        case "default":
-          return t();
-        default:
-          return t();
-      }
-    }
-  };
-};
-export {
-  s as useTemplates
-};

package/dist/static/editor.css.js

@@ -1,232 +0,0 @@
-const n = `:host {
-    --guido-color-white: #FFFFFF;
-    --guido-color-primary-500: #0A2ECC;
-    --guido-color-primary-100: #DAE1FB;
-    --guido-color-gray-800: #292929;
-    --guido-color-gray-300: #E1E1E1;
-}
-
-.label {
-    font-size: 13px;
-    color: var(--guido-color-gray-800);
-}
-
-.stacked-panel-title {
-    padding: 16px;
-    font-size: 16px;
-    font-weight: 600;
-    color: var(--guido-color-gray-800);
-    text-align: left;
-}
-
-.stacked-panel-item {
-    border-radius: 4px;
-    border: 1px solid #dcdfe6;
-    box-shadow: 0 0 0 0 var(--guido-color-gray-300),0 15px 35px -5px rgba(0, 0, 0, .1),0 8px 10px -6px rgba(0, 0, 0, .1);
-}
-
-.container {
-    padding: 16px;
-}
-
-.container.parent-container>.container {
-    padding: 0 16px;
-}
-
-/** SEGMENT BUTTON */
-ue-switcher input {
-    border-radius: 26px;
-} 
-
-ue-switcher input:before {
-    border-radius: 22px;
-}
-
-.tabs-header {
-    padding: 0;
-    column-gap: 0;
-    background-color: transparent;
-}
-
-.tabs-header button {
-    background-color: #f7f9fa;
-    outline: none;
-    padding: 8px 16px;
-    border: 1px solid #dcdee6;
-    height: 42px;
-}
-
-.tabs-header button ue-icon-component.icon-button {
-    color: var(--guido-color-gray-800);
-}
-
-.tabs-header button:not(:last-child),
-.tabs-header button:not(:first-child) {
-    border-radius: 0;
-}
-
-.tabs-header button:first-child {
-    border-radius: 4px 0 0 4px;
-}
-
-.tabs-header button:last-child {
-    border-radius: 0 4px 4px 0;
-}
-
-.tabs-header button.checked {
-    background-color: var(--guido-color-primary-100);
-    color: var(--guido-color-primary-500);
-    border-color: var(--guido-color-primary-500);
-}
-
-.tabs-header button.checked ue-icon-component.icon-button {
-    color: var(--guido-color-primary-500);
-}
-/** SEGMENT BUTTON */
-
-/** BUTTON */
-.button:not(:disabled,.disabled):active {
-    transform: none !important;
-}
-/** BUTTON */
-
-/** BUTTON GROUP */
-.button-group {
-    padding: 0;
-    column-gap: 0;
-    border-radius: 0;
-    background-color: transparent;
-}
-
-.button-group .button {
-    background-color: #f7f9fa;
-    outline: none;
-    padding: 8px 12px;
-    border: 1px solid #dcdee6;
-    box-shadow: none;
-    height: 42px;
-}
-
-.button-group .button ue-icon-component.icon-button {
-    color: var(--guido-color-gray-800);
-}
-
-.button-group > div:first-of-type .button {
-    border-radius: 4px 0 0 4px;
-}
-
-.button-group > *:last-child .button {
-    border-radius: 0 4px 4px 0;
-}
-
-ue-check-buttons input:checked + .button,
-ue-radio-buttons input:checked + .button {
-    background-color: var(--guido-color-primary-100);
-    color: var(--guido-color-primary-500);
-    border-color: var(--guido-color-primary-500);
-}
-
-ue-check-buttons input:checked + .button ue-icon-component.icon-button,
-ue-radio-buttons input:checked + .button ue-icon-component.icon-button {
-    color: var(--guido-color-primary-500);
-}
-/** BUTTON GROUP */
-
-/** COMBOBOX */
-.control-shadow-wrapper:has(.button[role="combobox"]) {
-    border-radius: 0;
-    padding: 0;
-    background: transparent;
-}
-
-.button[role="combobox"] {
-    background-color: #f9f9f9;
-    border: 1px solid var(--guido-color-gray-300);
-    border-radius: 4px;
-    box-shadow: none;
-    min-height: 42px;
-    padding: 8px;
-    color: var(--guido-color-gray-800);
-    text-align: left;
-    outline: none;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}
-
-.button[role="combobox"].on {
-    background-color: #f9f9f9;
-    border-color: var(--guido-color-primary-500);
-    box-shadow: 0 0 0 3px #b5c1f1 !important;
-}
-/** COMBOBOX */
-
-/** BASE INPUT */
-.base-input {
-    border: 1px solid var(--guido-color-gray-300);
-    border-radius: 4px;
-    background-color: #f9f9f9;
-    align-items: center;
-    height: 40px;
-    max-height: 40px;
-    box-sizing: content-box;
-    outline: none;
-    resize: vertical;
-    padding: 8px;
-    transition: none !important;
-    color: var(--guido-color-gray-800);
-    box-shadow: none !important;
-    box-sizing: border-box !important;
-}
-
-.base-input:hover:not(:disabled) {
-    background-color: #f9f9f9;
-    border-color: #7a92f2;
-}
-
-.base-input:focus:not(:disabled) {
-    background-color: #f9f9f9;
-    border-color: #0a2ecc;
-    box-shadow: 0 0 0 3px #b5c1f1 !important;
-}
-/** BASE INPUT */
-
-/** COUNTER */
-ue-counter {
-    padding: 0 !important;
-    background-color: var(--guido-color-white) !important;
-    border: 1px solid var(--guido-color-gray-300);
-}
-
-ue-counter .button {
-    width: 40px;
-    height: 40px;
-    box-shadow: none;
-}
-
-ue-counter .button .icon-button {
-    color: var(--guido-color-primary-500);
-}
-
-ue-counter ue-button:first-child .button {
-    border-right: 1px solid var(--guido-color-gray-300);
-}
-
-ue-counter ue-button:last-child .button {
-    border-left: 1px solid var(--guido-color-gray-300);
-}
-/** COUNTER */
-
-/** COLOR */
-ue-color {
-    width: 80px;
-}
-
-ue-color .base-input {
-    width: 100%;
-}
-/** COLOR */
-`;
-export {
-  n as default
-};

package/dist/static/templates/default/index.html.js

@@ -1,5 +0,0 @@
-const t = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><meta charset="UTF-8"><meta content="width=device-width, initial-scale=1" name="viewport"><meta name="x-apple-disable-message-reformatting"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta content="telephone=no" name="format-detection"><title></title><!--[if (mso 16)]><style type="text/css">a{text-decoration:none;}</style><![endif]--><!--[if gte mso 9]><style>sup{font-size:100% !important;}</style><![endif]--><!--[if gte mso 9]><noscript><xml><o:OfficeDocumentSettings><o:AllowPNG></o:AllowPNG><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml></noscript><![endif]--><!--[if mso]><xml><w:WordDocument xmlns:w="urn:schemas-microsoft-com:office:word"><w:DontUseAdvancedTypographyReadingMail></w:DontUseAdvancedTypographyReadingMail></w:WordDocument></xml><![endif]--></head><body><div class="es-wrapper-color"> <!--[if gte mso 9]> <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t"> <v:fill type="tile" color="#f6f6f6"></v:fill> </v:background> <![endif]--><table class="es-wrapper" width="100%" cellspacing="0" cellpadding="0"><tbody><tr><td class="esd-email-paddings" valign="top"><table class="es-content esd-header-popover" cellspacing="0" cellpadding="0" align="center"><tbody><tr><td class="esd-stripe" align="center"><table class="es-content-body" width="600" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center"><tbody><tr><td class="esd-structure es-p20" align="left" bgcolor="#91949F" style="background-color: #91949f;"><table width="100%" cellspacing="0" cellpadding="0"><tbody><tr><td class="esd-container-frame" width="560" valign="top" align="center"><table width="100%" cellspacing="0" cellpadding="0"><tbody><tr><td align="center" class="esd-block-image es-p15" style="font-size: 0px;"><a target="_blank"><img class="adapt-img" src="https://web-image.useinsider.com/email-template/logo.png" alt style="display: block;" height="30"></a></td></tr><tr><td class="esd-block-text" align="center"><h2 style="color: #ffffff; font-size: 30px;"><strong>Time for great email design</strong></h2></td></tr><tr><td class="esd-block-text es-m-txt-c es-p10t" align="center"><p style="color: #ffffff;">I'm a new text block ready for your message content.</p></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table><table class="es-content" cellspacing="0" cellpadding="0" align="center"><tbody><tr><td class="esd-stripe" align="center"><table class="es-content-body" width="600" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center"><tbody><tr><td class="esd-structure es-p30t es-p20b es-p20r es-p20l" align="left" bgcolor="#F9F9F9" style="background-color: #f9f9f9;"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td width="560" class="esd-container-frame" align="center" valign="top"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="center" class="esd-block-image es-p30t es-p20r" style="font-size: 0px;"><a target="_blank"><img class="adapt-img" src="https://web-image.useinsider.com/email-template/image-placeholder.png" alt style="display: block;" width="138"></a></td></tr><tr><td align="center" class="esd-block-text es-p10t es-p40b"><p style="color: #c5c6cc;">Image Placeholder</p></td></tr></tbody></table></td></tr></tbody></table></td></tr><tr><td class="esd-structure es-p20t es-p20r es-p20l" align="left"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td width="560" class="esd-container-frame" align="center" valign="top"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="center" class="esd-block-text"><p style="font-size: 24px; color: #2c3546;"><strong>This is a sample heading</strong><br></p></td></tr><tr><td align="center" class="esd-block-text"><p style="color: #2c3546;">I'm a new text block ready for your message content.</p></td></tr><tr><td align="center" class="esd-block-text"><p style="color: #959aa3; font-size: 10px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud<br>&nbsp;exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table><table class="es-content esd-footer-popover" cellspacing="0" cellpadding="0" align="center"><tbody><tr></tr><tr><td class="esd-stripe" esd-custom-block-id="8631" align="center"><table class="es-footer-body" style="background-color: #ffffff;" width="600" cellspacing="0" cellpadding="0" align="center" bgcolor="#fff"><tbody><tr><td class="esd-structure es-p20t es-p15b es-p20r es-p20l" align="left"> <!--[if mso]><table width="560" cellpadding="0" cellspacing="0"><tr><td width="270" valign="top"><![endif]--><table cellpadding="0" cellspacing="0" class="es-left" align="left"><tbody><tr><td width="270" class="es-m-p20b esd-container-frame" align="left"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="right" class="esd-block-button"><span class="es-button-border" style="border-radius: 4px; border-color: #5d6980; background: #5d6980; border-width: 1px;"><a href class="es-button" target="_blank" style="color: #ffffff; background: #5d6980; border-color: #5d6980; border-radius: 4px; border-width: 10px 15px;"> Button </a></span></td></tr></tbody></table></td></tr></tbody></table> <!--[if mso]></td><td width="20"></td><td width="270" valign="top"><![endif]--><table cellpadding="0" cellspacing="0" class="es-right" align="right"><tbody><tr><td width="270" align="left" class="esd-container-frame"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="left" class="esd-block-button"><span class="es-button-border" style="border-radius: 4px; border-color: #5d6980; background: #ffffff; border-width: 1px;"><a href class="es-button" target="_blank" style="background: #ffffff; border-color: #ffffff; color: #5d6980; border-radius: 4px; border-width: 10px 15px;"> Button </a></span></td></tr></tbody></table></td></tr></tbody></table> <!--[if mso]></td></tr></table><![endif]--></td></tr><tr><td class="esd-structure es-p30t es-p35b es-p40r es-p40l" align="left" bgcolor="#F9F9F9" style="background-color: #f9f9f9;"> <!--[if mso]><table width="520" cellpadding="0" cellspacing="0"><tr><td width="257" valign="top"><![endif]--><table cellpadding="0" cellspacing="0" class="es-left" align="left"><tbody><tr><td width="257" class="es-m-p20b esd-container-frame" align="left"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="center" class="esd-block-image" style="font-size: 0px;"><a target="_blank"><img class="adapt-img" src="https://web-image.useinsider.com/email-template/image-placeholder.png" alt style="display: block;" width="96"></a></td></tr><tr><td align="center" class="esd-block-text"><p style="color: #c5c6cc;">Image Placeholder</p></td></tr></tbody></table></td></tr></tbody></table> <!--[if mso]></td><td width="0"></td><td width="263" valign="top"><![endif]--><table cellpadding="0" cellspacing="0" class="es-right" align="right"><tbody><tr><td width="263" align="left" class="esd-container-frame"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="center" class="esd-block-image" style="font-size: 0px;"><a target="_blank"><img class="adapt-img" src="https://web-image.useinsider.com/email-template/image-placeholder.png" alt style="display: block;" width="96"></a></td></tr><tr><td align="center" class="esd-block-text"><p style="color: #c5c6cc;">Image Placeholder</p></td></tr></tbody></table></td></tr></tbody></table> <!--[if mso]></td></tr></table><![endif]--></td></tr><tr><td class="esd-structure es-p20t es-p15b es-p20r es-p20l" align="left"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td width="560" class="esd-container-frame" align="center" valign="top"><table cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td align="left" class="esd-block-text"><p>Text</p></td></tr></tbody></table></td></tr></tbody></table></td></tr><tr><td class="esd-structure es-p20t es-p20b es-p20r es-p20l" align="left" bgcolor="#2C3546" style="background-color: #2c3546;"><table width="100%" cellspacing="0" cellpadding="0"><tbody><tr><td class="esd-container-frame" width="560" valign="top" align="center"><table width="100%" cellspacing="0" cellpadding="0"><tbody><tr><td align="center" class="esd-block-social" style="font-size:0"><table cellpadding="0" cellspacing="0" class="es-table-not-adapt es-social"><tbody><tr><td align="center" valign="top" class="es-p20r" esd-tmp-icon-type="facebook"><a target="_blank" href="https://facebook.com"><img title="Facebook" src="https://web-image.useinsider.com/email-template/facebook.png" alt="Facebook" width="24" height="24"></a></td><td align="center" valign="top" class="es-p20r" esd-tmp-icon-type="twitter"><a target="_blank" href="https://instagram.com"><img title="Instagram" src="https://web-image.useinsider.com/email-template/instagram.png" alt="Instagram" width="24" height="24"></a></td><td align="center" valign="top" esd-tmp-icon-type="instagram"><a target="_blank" href="https://twitter.com"><img title="Twitter" src="https://web-image.useinsider.com/email-template/twitter.png" alt="Twitter" width="24" height="24"></a></td></tr></tbody></table></td></tr><tr><td align="center" class="esd-block-text es-p20"><p style="font-size: 10px;">ADDRESS LINE, PROVINCE, CITY, COUNTRY - 999999</p></td></tr><tr><td align="center" class="esd-block-text"><p style="color: #959aa2; font-size: 10px;">You can <u>unsubscribe</u> from our emails, if you need to.</p></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></div></body></html>
-`;
-export {
-  t as default
-};