@useinsider/guido 1.0.2-beta.86f7e79 → 1.0.2-beta.93e2012

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/README.md +31 -1
  2. package/dist/@types/generic.d.ts +4 -0
  3. package/dist/components/Guido.vue.d.ts +3 -1
  4. package/dist/components/Guido.vue.js +5 -5
  5. package/dist/components/Guido.vue2.js +76 -65
  6. package/dist/components/organisms/LoadingWrapper.vue.js +1 -1
  7. package/dist/components/organisms/email-preview/amp/AmpToggle.vue.js +3 -2
  8. package/dist/components/organisms/header/HeaderWrapper.vue.d.ts +3 -1
  9. package/dist/components/organisms/header/HeaderWrapper.vue.js +6 -6
  10. package/dist/components/organisms/header/HeaderWrapper.vue2.js +15 -9
  11. package/dist/components/organisms/header/RightSlot.vue.d.ts +3 -1
  12. package/dist/components/organisms/header/RightSlot.vue.js +5 -3
  13. package/dist/components/organisms/header/RightSlot.vue2.js +26 -27
  14. package/dist/components/organisms/onboarding/AMPOnboarding.vue2.js +11 -11
  15. package/dist/components/organisms/onboarding/GenericOnboarding.vue.js +1 -1
  16. package/dist/components/organisms/onboarding/GenericOnboarding.vue2.js +8 -8
  17. package/dist/components/organisms/onboarding/TextBlockOnboarding.vue.js +1 -1
  18. package/dist/components/organisms/onboarding/TextBlockOnboarding.vue2.js +40 -28
  19. package/dist/components/organisms/onboarding/VersionHistoryOnboarding.vue2.js +6 -6
  20. package/dist/composables/useCustomInterfaceAppearance.js +22 -18
  21. package/dist/composables/useHtmlCompiler.js +17 -9
  22. package/dist/composables/useHtmlValidator.d.ts +3 -0
  23. package/dist/composables/useHtmlValidator.js +120 -0
  24. package/dist/composables/useRecommendation.d.ts +19 -0
  25. package/dist/composables/useRecommendation.js +27 -0
  26. package/dist/composables/useSave.d.ts +4 -0
  27. package/dist/composables/useSave.js +15 -0
  28. package/dist/composables/useStripo.js +27 -25
  29. package/dist/composables/useToaster.js +17 -17
  30. package/dist/config/compiler/outlookCompilerRules.d.ts +2 -0
  31. package/dist/config/compiler/outlookCompilerRules.js +36 -0
  32. package/dist/config/compiler/recommendationCompilerRules.d.ts +2 -0
  33. package/dist/config/compiler/recommendationCompilerRules.js +83 -0
  34. package/dist/config/compiler/socialCompilerRules.d.ts +2 -0
  35. package/dist/config/compiler/socialCompilerRules.js +21 -0
  36. package/dist/config/compiler/unsubscribeCompilerRules.d.ts +2 -0
  37. package/dist/config/compiler/unsubscribeCompilerRules.js +64 -0
  38. package/dist/enums/defaults.d.ts +5 -1
  39. package/dist/enums/defaults.js +14 -10
  40. package/dist/enums/html-validator.d.ts +6 -0
  41. package/dist/enums/html-validator.js +7 -0
  42. package/dist/enums/recommendation.d.ts +54 -0
  43. package/dist/enums/recommendation.js +56 -0
  44. package/dist/enums/unsubscribe.d.ts +15 -0
  45. package/dist/enums/unsubscribe.js +17 -0
  46. package/dist/guido.css +1 -1
  47. package/dist/mock/api/validator.d.ts +2 -0
  48. package/dist/static/styles/components/alert-message.css.js +32 -2
  49. package/dist/static/styles/components/button.css.js +32 -2
  50. package/dist/static/styles/components/notification.css.js +55 -0
  51. package/dist/static/styles/components/popup.css.js +68 -0
  52. package/dist/static/styles/components/wide-panel.css.js +5 -1
  53. package/dist/static/styles/customEditorStyle.css.js +6 -0
  54. package/dist/static/styles/variables.css.js +10 -0
  55. package/dist/stores/dynamic-content.d.ts +12 -0
  56. package/dist/stores/dynamic-content.js +7 -6
  57. package/dist/stores/recommendation.d.ts +10 -0
  58. package/dist/stores/recommendation.js +9 -0
  59. package/dist/stores/unsubscribe.d.ts +8 -0
  60. package/dist/stores/unsubscribe.js +9 -0
  61. package/dist/utils/genericUtil.js +9 -6
  62. package/dist/utils/templatePreparation.js +21 -14
  63. package/package.json +1 -1
@@ -12,10 +12,20 @@ const o = `:host {
12
12
  --guido-color-neutral-800: #222938;
13
13
  --guido-color-neutral-200: #DCDFE6;
14
14
  --guido-color-neutral-100: #EFF2F4;
15
+ --guido-color-danger-300: #e84342;
15
16
  --guido-color-danger-500: #DC2A2A;
16
17
  --guido-box-shadow: 0 4px 12px 0 rgba(44,53,70,0.15);
17
18
  --guido-color-background-onpage-message-info: #D3EEF8;
18
19
  --guido-color-border-onpage-message-info: #258DDE;
20
+ --guido-color-background-onpage-message-warn: #FCEFE5;
21
+ --guido-color-border-onpage-message-warn: #D37400;
22
+ --guido-color-background-onpage-message-success: #E9F9EB;
23
+ --guido-color-border-onpage-message-success: #128745;
24
+ --guido-color-background-onpage-message-error: #FCECEC;
25
+ --guido-color-border-onpage-message-error: var(--guido-color-danger-500);
26
+ --guido-color-background-toaster-success: #128745;
27
+ --guido-color-background-toaster-error: var(--guido-color-danger-500);
28
+ --guido-color-background-toaster-warn: #D37400;
19
29
  }
20
30
  `;
21
31
  export {
@@ -8,11 +8,19 @@ export declare const useDynamicContentStore: import("pinia").StoreDefinition<"dy
8
8
  value: string;
9
9
  text: string;
10
10
  fallback?: string | undefined;
11
+ format?: {
12
+ key: string;
13
+ value: string;
14
+ } | undefined;
11
15
  };
12
16
  selectedDynamicContentList: {
13
17
  value: string;
14
18
  text: string;
15
19
  fallback?: string | undefined;
20
+ format?: {
21
+ key: string;
22
+ value: string;
23
+ } | undefined;
16
24
  }[];
17
25
  } & import("pinia").PiniaCustomStateProperties<{
18
26
  selectedDynamicContent: DynamicContent;
@@ -21,6 +29,10 @@ export declare const useDynamicContentStore: import("pinia").StoreDefinition<"dy
21
29
  text: string;
22
30
  value: string;
23
31
  fallback: string | undefined;
32
+ format: {
33
+ key: string;
34
+ value: string;
35
+ } | undefined;
24
36
  }[];
25
37
  }, {
26
38
  setSelectedDynamicContent(dynamicContent: DynamicContent): void;
@@ -6,15 +6,16 @@ const s = a("dynamicContent", {
6
6
  selectedDynamicContentList: []
7
7
  }),
8
8
  actions: {
9
- setSelectedDynamicContent(e) {
10
- this.selectedDynamicContent = e, this.selectedDynamicContentList.push(e);
9
+ setSelectedDynamicContent(t) {
10
+ this.selectedDynamicContent = t, this.selectedDynamicContentList.push(t);
11
11
  }
12
12
  },
13
13
  getters: {
14
- getSelectedDynamicContentList: (e) => n(e.selectedDynamicContentList).map((t) => ({
15
- text: t.text,
16
- value: t.value,
17
- fallback: t.fallback
14
+ getSelectedDynamicContentList: (t) => n(t.selectedDynamicContentList).map((e) => ({
15
+ text: e.text,
16
+ value: e.value,
17
+ fallback: e.fallback,
18
+ format: e.format
18
19
  })) || []
19
20
  }
20
21
  });
@@ -0,0 +1,10 @@
1
+ type RecommendationConfig = {
2
+ filters: {
3
+ value: string;
4
+ }[];
5
+ };
6
+ interface StoreState {
7
+ recommendationConfigs: RecommendationConfig[];
8
+ }
9
+ export declare const useRecommendationStore: import("pinia").StoreDefinition<"recommendation", StoreState, {}, {}>;
10
+ export {};
@@ -0,0 +1,9 @@
1
+ import { defineStore as e } from "pinia";
2
+ const t = () => ({
3
+ recommendationConfigs: []
4
+ }), n = e("recommendation", {
5
+ state: () => t()
6
+ });
7
+ export {
8
+ n as useRecommendationStore
9
+ };
@@ -0,0 +1,8 @@
1
+ type UnsubscribePage = {
2
+ type: number;
3
+ };
4
+ interface StoreState {
5
+ selectedUnsubscribePages: UnsubscribePage[];
6
+ }
7
+ export declare const useUnsubscribeStore: import("pinia").StoreDefinition<"unsubscribe", StoreState, {}, {}>;
8
+ export {};
@@ -0,0 +1,9 @@
1
+ import { defineStore as e } from "pinia";
2
+ const t = () => ({
3
+ selectedUnsubscribePages: []
4
+ }), r = e("unsubscribe", {
5
+ state: () => t()
6
+ });
7
+ export {
8
+ r as useUnsubscribeStore
9
+ };
@@ -1,11 +1,14 @@
1
- const l = (e) => e.map((a) => ({
1
+ const e = (l) => l.map((a) => a.format ? {
2
+ label: `${a.text} | ${a.format.key}=${a.format.value}`,
3
+ value: `{{${a.value}|${a.format.key}=${a.format.value}}}`
4
+ } : {
2
5
  label: a.fallback ? `${a.text} | ${a.fallback}` : a.text,
3
6
  value: a.fallback ? `{{${a.value}|${a.fallback}}}` : `{{${a.value}}}`
4
- })), t = () => {
5
- var e;
6
- return ((e = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : e.getAttribute("content")) ?? "";
7
+ }), r = () => {
8
+ var l;
9
+ return ((l = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : l.getAttribute("content")) ?? "";
7
10
  };
8
11
  export {
9
- l as dynamicContentToMergeTags,
10
- t as getCsrfToken
12
+ e as dynamicContentToMergeTags,
13
+ r as getCsrfToken
11
14
  };
@@ -1,21 +1,28 @@
1
- import { useActionsApi as c } from "../composables/useActionsApi.js";
2
- import { useDynamicContentStore as l } from "../stores/dynamic-content.js";
3
- const y = () => {
4
- const t = l(), { getCompiledEmail: e, getTemplateData: a } = c();
1
+ import { useActionsApi as g } from "../composables/useActionsApi.js";
2
+ import { useHtmlCompiler as S } from "../composables/useHtmlCompiler.js";
3
+ import { useDynamicContentStore as f } from "../stores/dynamic-content.js";
4
+ const H = () => {
5
+ const t = f(), { getCompiledEmail: i, getTemplateData: o } = g(), { compileHtml: n } = S();
5
6
  return {
6
7
  prepareTemplateDetails: async () => {
7
- const { html: n, ampHtml: s = "", ampErrors: o = [] } = await e({
8
+ const { html: a, ampHtml: s = "", ampErrors: m = [] } = await i({
8
9
  minimize: !0,
9
10
  resetDataSavedFlag: !1
10
- }), { html: m, css: i, syncModulesIds: r = [] } = await a();
11
- return {
12
- dynamicContentList: t.getSelectedDynamicContentList,
13
- compiledHtml: n,
14
- rawHtml: m,
15
- css: i,
11
+ }), { html: r, css: c, syncModulesIds: l = [] } = await o(), { compiledHtml: p, stats: e, appliedRules: d } = n(a), u = t.getSelectedDynamicContentList;
12
+ return console.debug("HTML Compilation Stats:", {
13
+ originalSize: e.originalSize,
14
+ compiledSize: e.compiledSize,
15
+ reduction: `${e.reductionPercentage.toFixed(2)}%`,
16
+ appliedRules: d,
17
+ executionTime: `${e.executionTime.toFixed(2)}ms`
18
+ }), {
19
+ dynamicContentList: u,
20
+ compiledHtml: p,
21
+ rawHtml: r,
22
+ css: c,
16
23
  ampHtml: s,
17
- ampErrors: o,
18
- modules: r,
24
+ ampErrors: m,
25
+ modules: l,
19
26
  recommendation: {
20
27
  campaignUrls: {},
21
28
  configs: {}
@@ -29,5 +36,5 @@ const y = () => {
29
36
  };
30
37
  };
31
38
  export {
32
- y as useTemplatePreparation
39
+ H as useTemplatePreparation
33
40
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "1.0.2-beta.86f7e79",
3
+ "version": "1.0.2-beta.93e2012",
4
4
  "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
5
5
  "main": "./dist/guido.umd.cjs",
6
6
  "module": "./dist/library.js",