@useinsider/guido 1.0.3-beta.83937b4 → 1.0.3-beta.84612c7
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.
- package/README.md +3 -137
- package/dist/components/organisms/header/LeftSlot.vue.js +1 -1
- package/dist/components/organisms/header/LeftSlot.vue2.js +15 -16
- package/dist/components/organisms/header/RightSlot.vue.js +11 -11
- package/dist/composables/useStripo.js +50 -39
- package/dist/enums/defaults.js +8 -14
- package/dist/extensions/Blocks/Checkbox/extension.js +2 -2
- package/dist/extensions/Blocks/CouponBlock/extension.js +2 -2
- package/dist/extensions/Blocks/Recommendation/extension.js +4 -4
- package/dist/guido.css +1 -1
- package/dist/services/stripoApi.js +1 -1
- package/dist/src/@types/generic.d.ts +0 -9
- package/dist/src/components/wrappers/WpModal.vue.d.ts +1 -1
- package/dist/src/stores/config.d.ts +0 -6
- package/dist/static/styles/components/narrow-panel.css.js +10 -0
- package/package.json +1 -1
- package/dist/composables/useBlocksConfig.js +0 -49
- package/dist/src/composables/useBlocksConfig.d.ts +0 -11
package/README.md
CHANGED
|
@@ -80,12 +80,10 @@ export default {
|
|
|
80
80
|
translationsPath: 'window.trans.en',
|
|
81
81
|
htmlCompilerRules: [],
|
|
82
82
|
ignoreDefaultHtmlCompilerRules: false,
|
|
83
|
-
backButtonLabel?: "Back to Design",
|
|
84
83
|
features: {
|
|
85
84
|
dynamicContent: true,
|
|
86
85
|
saveAsTemplate: true,
|
|
87
|
-
versionHistory: true
|
|
88
|
-
testMessage: true
|
|
86
|
+
versionHistory: true
|
|
89
87
|
}
|
|
90
88
|
},
|
|
91
89
|
dynamicContentModalVisible: false
|
|
@@ -192,11 +190,6 @@ interface GuidoConfig {
|
|
|
192
190
|
dynamicContent: boolean;
|
|
193
191
|
saveAsTemplate: boolean;
|
|
194
192
|
versionHistory: boolean;
|
|
195
|
-
testMessage: boolean;
|
|
196
|
-
};
|
|
197
|
-
blocks?: {
|
|
198
|
-
excludeDefaults?: GuidoBlockType[];
|
|
199
|
-
includeCustoms?: GuidoCustomBlockType[];
|
|
200
193
|
};
|
|
201
194
|
}
|
|
202
195
|
```
|
|
@@ -211,9 +204,6 @@ interface GuidoConfig {
|
|
|
211
204
|
| `features.dynamicContent` | `boolean` | `true` | Enable dynamic content insertion feature |
|
|
212
205
|
| `features.saveAsTemplate` | `boolean` | `true` | Enable save as template feature |
|
|
213
206
|
| `features.versionHistory` | `boolean` | `true` | Enable version history feature |
|
|
214
|
-
| `blocks` | `BlocksConfig` | `{ excludeDefaults: [], includeCustoms: [] }` | Block configuration for excluding default blocks and including custom blocks. See [Blocks Configuration](#-blocks-configuration) section below |
|
|
215
|
-
| `blocks.excludeDefaults` | `GuidoBlockType[]` | `[]` | Array of default Stripo blocks to exclude from the editor |
|
|
216
|
-
| `blocks.includeCustoms` | `GuidoCustomBlockType[]` | `[]` | Array of custom blocks to include in the editor |
|
|
217
207
|
|
|
218
208
|
```typescript
|
|
219
209
|
interface DynamicContent {
|
|
@@ -230,128 +220,6 @@ interface DynamicContent {
|
|
|
230
220
|
| `text` | `string` | '' | Visible value of the dynamic content |
|
|
231
221
|
| `fallback?` | `string` | '' | Fallback value of the dynamic content. Optional |
|
|
232
222
|
|
|
233
|
-
## 🧱 Blocks Configuration
|
|
234
|
-
|
|
235
|
-
Guido allows you to customize which blocks are available in the editor. You can exclude default Stripo blocks and selectively include custom blocks to create tailored editing experiences for different product types.
|
|
236
|
-
|
|
237
|
-
### Block Types
|
|
238
|
-
|
|
239
|
-
#### Default Blocks (GuidoBlockType)
|
|
240
|
-
|
|
241
|
-
These are the standard Stripo email editor blocks that can be excluded:
|
|
242
|
-
|
|
243
|
-
```typescript
|
|
244
|
-
type GuidoBlockType =
|
|
245
|
-
| 'amp-accordion' // AMP accordion component
|
|
246
|
-
| 'amp-carousel' // AMP image carousel
|
|
247
|
-
| 'amp-form-controls' // AMP form elements
|
|
248
|
-
| 'banner-block' // Banner/hero section
|
|
249
|
-
| 'button-block' // Call-to-action buttons
|
|
250
|
-
| 'html-block' // Custom HTML
|
|
251
|
-
| 'image-block' // Image elements
|
|
252
|
-
| 'menu-block' // Navigation menu
|
|
253
|
-
| 'social-block' // Social media links
|
|
254
|
-
| 'spacer-block' // Vertical spacing
|
|
255
|
-
| 'text-block' // Text content
|
|
256
|
-
| 'timer-block' // Countdown timer
|
|
257
|
-
| 'video-block' // Video embeds
|
|
258
|
-
```
|
|
259
|
-
|
|
260
|
-
#### Custom Blocks (GuidoCustomBlockType)
|
|
261
|
-
|
|
262
|
-
These are custom blocks that can be selectively included:
|
|
263
|
-
|
|
264
|
-
```typescript
|
|
265
|
-
type GuidoCustomBlockType =
|
|
266
|
-
| 'dynamic-content' // Dynamic content merge tags
|
|
267
|
-
| 'checkbox-block' // Checkbox form input
|
|
268
|
-
| 'radio-button-block' // Radio button form input
|
|
269
|
-
| 'recommendation-block' // Product recommendations
|
|
270
|
-
| 'unsubscribe-block' // Unsubscribe link
|
|
271
|
-
| 'coupon-block' // Coupon/promo code
|
|
272
|
-
| 'items-block' // Cart items display
|
|
273
|
-
```
|
|
274
|
-
|
|
275
|
-
### Configuration Examples
|
|
276
|
-
|
|
277
|
-
#### Example 1: Exclude Specific Default Blocks
|
|
278
|
-
|
|
279
|
-
Disable button, image, and video blocks while keeping all custom blocks:
|
|
280
|
-
|
|
281
|
-
```typescript
|
|
282
|
-
const guidoConfig = {
|
|
283
|
-
translationsPath: 'window.trans.en',
|
|
284
|
-
features: {
|
|
285
|
-
dynamicContent: true,
|
|
286
|
-
saveAsTemplate: true,
|
|
287
|
-
versionHistory: true,
|
|
288
|
-
testMessage: true
|
|
289
|
-
},
|
|
290
|
-
blocks: {
|
|
291
|
-
excludeDefaults: ['button-block', 'image-block', 'video-block']
|
|
292
|
-
}
|
|
293
|
-
};
|
|
294
|
-
```
|
|
295
|
-
|
|
296
|
-
**Result:**
|
|
297
|
-
- Button, Image, Video blocks disabled
|
|
298
|
-
- All other default blocks enabled
|
|
299
|
-
- All custom blocks are disabled.
|
|
300
|
-
|
|
301
|
-
#### Example 2: Include Only Specific Custom Blocks
|
|
302
|
-
|
|
303
|
-
Enable only coupon and recommendation blocks:
|
|
304
|
-
|
|
305
|
-
```typescript
|
|
306
|
-
const guidoConfig = {
|
|
307
|
-
translationsPath: 'window.trans.en',
|
|
308
|
-
features: {
|
|
309
|
-
dynamicContent: true,
|
|
310
|
-
saveAsTemplate: true,
|
|
311
|
-
versionHistory: true,
|
|
312
|
-
testMessage: true
|
|
313
|
-
},
|
|
314
|
-
blocks: {
|
|
315
|
-
includeCustoms: ['coupon-block', 'recommendation-block']
|
|
316
|
-
}
|
|
317
|
-
};
|
|
318
|
-
```
|
|
319
|
-
|
|
320
|
-
**Result:**
|
|
321
|
-
- All default blocks enabled
|
|
322
|
-
- Only Coupon and Recommendation extensions enabled.
|
|
323
|
-
- Other custom blocks are disabled
|
|
324
|
-
|
|
325
|
-
### Default Behavior
|
|
326
|
-
|
|
327
|
-
When `blocks` is not provided or is `undefined`:
|
|
328
|
-
|
|
329
|
-
```typescript
|
|
330
|
-
const guidoConfig = {
|
|
331
|
-
translationsPath: 'window.trans.en',
|
|
332
|
-
features: {
|
|
333
|
-
dynamicContent: true,
|
|
334
|
-
saveAsTemplate: true,
|
|
335
|
-
versionHistory: true,
|
|
336
|
-
testMessage: true
|
|
337
|
-
},
|
|
338
|
-
// No blocks config
|
|
339
|
-
};
|
|
340
|
-
```
|
|
341
|
-
|
|
342
|
-
**Result:**
|
|
343
|
-
- All 13 default Stripo blocks enabled
|
|
344
|
-
- All custom blocks are disabled.
|
|
345
|
-
|
|
346
|
-
### Block Configuration Interface
|
|
347
|
-
|
|
348
|
-
```typescript
|
|
349
|
-
interface BlocksConfig {
|
|
350
|
-
excludeDefaults?: GuidoBlockType[];
|
|
351
|
-
includeCustoms?: GuidoCustomBlockType[];
|
|
352
|
-
}
|
|
353
|
-
```
|
|
354
|
-
|
|
355
223
|
### TypeScript Types
|
|
356
224
|
|
|
357
225
|
The library exports the following TypeScript types:
|
|
@@ -446,8 +314,7 @@ const guidoConfig = {
|
|
|
446
314
|
features: {
|
|
447
315
|
dynamicContent: true,
|
|
448
316
|
saveAsTemplate: true,
|
|
449
|
-
versionHistory: false
|
|
450
|
-
testMessage: true
|
|
317
|
+
versionHistory: false // Disable version history
|
|
451
318
|
},
|
|
452
319
|
htmlCompilerRules: [
|
|
453
320
|
{
|
|
@@ -480,8 +347,7 @@ const guidoConfig = {
|
|
|
480
347
|
features: {
|
|
481
348
|
dynamicContent: true,
|
|
482
349
|
saveAsTemplate: true,
|
|
483
|
-
versionHistory: true
|
|
484
|
-
testMessage: true
|
|
350
|
+
versionHistory: true
|
|
485
351
|
},
|
|
486
352
|
ignoreDefaultHtmlCompilerRules: true, // Skip all default rules
|
|
487
353
|
htmlCompilerRules: [
|
|
@@ -1,29 +1,28 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import { usePreviewMode as f } from "../../../composables/usePreviewMode.js";
|
|
1
|
+
import { defineComponent as s, computed as c } from "vue";
|
|
2
|
+
import { useBack as m } from "../../../composables/useGuidoActions.js";
|
|
3
|
+
import { usePreviewMode as a } from "../../../composables/usePreviewMode.js";
|
|
5
4
|
import { useTranslations as p } from "../../../composables/useTranslations.js";
|
|
6
|
-
import { useVersionHistoryApi as
|
|
7
|
-
import { useEditorStore as
|
|
8
|
-
import { InButtonV2 as
|
|
9
|
-
import
|
|
10
|
-
const
|
|
5
|
+
import { useVersionHistoryApi as u } from "../../../composables/useVersionHistoryApi.js";
|
|
6
|
+
import { useEditorStore as d } from "../../../stores/editor.js";
|
|
7
|
+
import { InButtonV2 as f } from "@useinsider/design-system-vue";
|
|
8
|
+
import l from "./version-history/RestoreButton.vue.js";
|
|
9
|
+
const O = /* @__PURE__ */ s({
|
|
11
10
|
__name: "LeftSlot",
|
|
12
|
-
setup(
|
|
13
|
-
const o =
|
|
14
|
-
return { __sfc: !0, editorStore: o, handleBack: r, closeVersionHistory:
|
|
11
|
+
setup(k) {
|
|
12
|
+
const o = d(), r = m(), { closeVersionHistory: t } = u(), { closePreviewMode: i } = a(), e = p(), n = c(() => o.isVersionHistoryOpen || o.isPreviewModeOpen ? e("email-editor.back-to-editor") : e("email-editor.back-to-design"));
|
|
13
|
+
return { __sfc: !0, editorStore: o, handleBack: r, closeVersionHistory: t, closePreviewMode: i, trans: e, backButtonLabel: n, handleBackClick: () => {
|
|
15
14
|
if (o.isVersionHistoryOpen) {
|
|
16
|
-
|
|
15
|
+
t();
|
|
17
16
|
return;
|
|
18
17
|
}
|
|
19
18
|
if (o.isPreviewModeOpen) {
|
|
20
|
-
|
|
19
|
+
i();
|
|
21
20
|
return;
|
|
22
21
|
}
|
|
23
22
|
r();
|
|
24
|
-
}, InButtonV2:
|
|
23
|
+
}, InButtonV2: f, RestoreButton: l };
|
|
25
24
|
}
|
|
26
25
|
});
|
|
27
26
|
export {
|
|
28
|
-
|
|
27
|
+
O as default
|
|
29
28
|
};
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
return e("div", { staticClass: "d-f" }, [(
|
|
1
|
+
import n from "./RightSlot.vue2.js";
|
|
2
|
+
import a from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
|
+
var l = function() {
|
|
4
|
+
var s, i;
|
|
5
|
+
var o = this, e = o._self._c, t = o._self._setupProxy;
|
|
6
|
+
return e("div", { staticClass: "d-f" }, [(s = t.config.features) != null && s.versionHistory ? e(t.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryButtonDisabled, "label-text-status": !1, "selected-status": t.editorStore.isVersionHistoryOpen, "tooltip-options": t.getTooltipOptions("guido__history-button"), "tooltip-text": t.versionHistoryTooltipText }, on: { click: t.handleVersionHistory } }) : o._e(), e(t.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isExportButtonDisabled, "label-text-status": !1, "loading-status": t.isExporting, "tooltip-options": t.getTooltipOptions("guido__export-button"), "tooltip-text": t.trans("newsletter.export") }, on: { click: t.handleExport } }), (i = t.config.features) != null && i.saveAsTemplate ? e(t.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isSaveAsButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__save-as-button"), "tooltip-text": t.trans("newsletter.save-templates") }, on: { click: t.handleSaveAs } }) : o._e(), e(t.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isTestButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__test-button"), "tooltip-text": t.trans("newsletter.test-email") } }), e(t.InButtonV2, { staticClass: "ml-3", attrs: { id: "guido__save-button", "label-text": "Save", "disabled-status": !t.isSaving && t.editorStore.isSaveButtonDisabled, "loading-status": t.isSaving }, on: { click: function(p) {
|
|
7
7
|
return t.handleSave(!1);
|
|
8
8
|
} } })], 1);
|
|
9
|
-
},
|
|
10
|
-
|
|
9
|
+
}, r = [], d = /* @__PURE__ */ a(
|
|
10
|
+
n,
|
|
11
|
+
l,
|
|
11
12
|
r,
|
|
12
|
-
u,
|
|
13
13
|
!1,
|
|
14
14
|
null,
|
|
15
15
|
null
|
|
16
16
|
);
|
|
17
|
-
const
|
|
17
|
+
const g = d.exports;
|
|
18
18
|
export {
|
|
19
|
-
|
|
19
|
+
g as default
|
|
20
20
|
};
|
|
@@ -1,24 +1,29 @@
|
|
|
1
|
-
import { useActionsApi as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
1
|
+
import { useActionsApi as f } from "./useActionsApi.js";
|
|
2
|
+
import { useCustomInterfaceAppearance as E } from "./useCustomInterfaceAppearance.js";
|
|
3
|
+
import { useStripoEventHandler as S } from "./useStripoEventHandler.js";
|
|
4
|
+
import { useToaster as C } from "./useToaster.js";
|
|
5
|
+
import { displayConditions as y } from "../enums/displayConditions.js";
|
|
6
|
+
import h from "../extensions/Blocks/Checkbox/extension.js";
|
|
7
|
+
import w from "../extensions/Blocks/CouponBlock/extension.js";
|
|
8
|
+
import b from "../extensions/Blocks/RadioButton/extension.js";
|
|
9
|
+
import V from "../extensions/Blocks/Recommendation/extension.js";
|
|
10
|
+
import _ from "../extensions/Blocks/Unsubscribe/extension.js";
|
|
11
|
+
import k from "../extensions/DynamicContent/extension.js";
|
|
7
12
|
import { useStripoApi as B } from "../services/stripoApi.js";
|
|
8
|
-
import
|
|
9
|
-
import { useEditorStore as
|
|
10
|
-
import { dynamicContentToMergeTags as
|
|
11
|
-
import
|
|
12
|
-
const
|
|
13
|
-
const { handleError:
|
|
14
|
-
const t =
|
|
13
|
+
import x from "../static/styles/customEditorStyle.css.js";
|
|
14
|
+
import { useEditorStore as F } from "../stores/editor.js";
|
|
15
|
+
import { dynamicContentToMergeTags as A } from "../utils/genericUtil.js";
|
|
16
|
+
import T from "../package.json.js";
|
|
17
|
+
const G = (a) => {
|
|
18
|
+
const { handleError: d } = C(), { getToken: u, getCustomFonts: m } = B(), { handleEvent: p } = S(), l = (r, i = []) => {
|
|
19
|
+
const t = F(), { html: n, css: c, forceRecreate: s } = r;
|
|
15
20
|
window.UIEditor.initEditor(
|
|
16
21
|
document.querySelector("#guido-editor"),
|
|
17
22
|
{
|
|
18
|
-
metadata:
|
|
23
|
+
metadata: a,
|
|
19
24
|
html: n,
|
|
20
|
-
css:
|
|
21
|
-
forceRecreate:
|
|
25
|
+
css: c,
|
|
26
|
+
forceRecreate: s,
|
|
22
27
|
locale: "en",
|
|
23
28
|
undoButtonSelector: "#guido__undo-button",
|
|
24
29
|
redoButtonSelector: "#guido__redo-button",
|
|
@@ -28,14 +33,13 @@ const L = (d) => {
|
|
|
28
33
|
customAppearanceMergetags: !0,
|
|
29
34
|
customAppearanceMergetagsBorderColor: "#f1f3fe",
|
|
30
35
|
customAppearanceMergetagsBackgroundColor: "#f1f3fe",
|
|
31
|
-
customViewStyles:
|
|
36
|
+
customViewStyles: x,
|
|
32
37
|
conditionsEnabled: !0,
|
|
33
38
|
customConditionsEnabled: !0,
|
|
34
|
-
conditionCategories:
|
|
39
|
+
conditionCategories: y,
|
|
35
40
|
enableXSSSecurity: !0,
|
|
36
41
|
messageSettingsEnabled: !1,
|
|
37
42
|
selectBlockAfterDropFromSettingsPanel: !0,
|
|
38
|
-
...e ? { baseBlocks: e } : {},
|
|
39
43
|
editorFonts: {
|
|
40
44
|
showDefaultStandardFonts: !0,
|
|
41
45
|
showDefaultNotStandardFonts: !0,
|
|
@@ -43,25 +47,25 @@ const L = (d) => {
|
|
|
43
47
|
},
|
|
44
48
|
mergeTags: [
|
|
45
49
|
{
|
|
46
|
-
entries:
|
|
50
|
+
entries: A(a.preselectedDynamicContentList)
|
|
47
51
|
}
|
|
48
52
|
],
|
|
49
53
|
async onTokenRefreshRequest(o) {
|
|
50
54
|
try {
|
|
51
|
-
const
|
|
52
|
-
o(
|
|
53
|
-
} catch (
|
|
54
|
-
|
|
55
|
+
const e = await u();
|
|
56
|
+
o(e);
|
|
57
|
+
} catch (e) {
|
|
58
|
+
d(e, "Failed to refresh token");
|
|
55
59
|
}
|
|
56
60
|
},
|
|
57
61
|
onTemplateLoaded() {
|
|
58
62
|
try {
|
|
59
|
-
const { importCss: o } =
|
|
60
|
-
o(),
|
|
63
|
+
const { importCss: o } = E(), { activateCustomViewStyles: e } = f();
|
|
64
|
+
o(), e(), a.onReady(), t.isStripoInitialized = !0, t.loadingStatus = !1, setTimeout(() => {
|
|
61
65
|
t.hasChanges = !1;
|
|
62
66
|
}, 1e3);
|
|
63
67
|
} catch (o) {
|
|
64
|
-
|
|
68
|
+
d(o, "Failed to load custom interface appearance");
|
|
65
69
|
}
|
|
66
70
|
},
|
|
67
71
|
onCodeEditorVisibilityChanged(o) {
|
|
@@ -76,35 +80,42 @@ const L = (d) => {
|
|
|
76
80
|
onDataChanged() {
|
|
77
81
|
t.hasChanges = !0;
|
|
78
82
|
},
|
|
79
|
-
onEvent:
|
|
83
|
+
onEvent: p,
|
|
80
84
|
ignoreClickOutsideSelectors: [
|
|
81
85
|
"#guido-dynamic-content-modal",
|
|
82
86
|
".in-on-board-wrapper",
|
|
83
87
|
".in-drawer__container"
|
|
84
88
|
],
|
|
85
|
-
extensions:
|
|
89
|
+
extensions: [
|
|
90
|
+
k,
|
|
91
|
+
h,
|
|
92
|
+
b,
|
|
93
|
+
V,
|
|
94
|
+
_,
|
|
95
|
+
w
|
|
96
|
+
]
|
|
86
97
|
}
|
|
87
98
|
);
|
|
88
|
-
},
|
|
89
|
-
var
|
|
99
|
+
}, g = (r) => new Promise((i, t) => {
|
|
100
|
+
var e;
|
|
90
101
|
if (document.getElementById("UiEditorScript")) {
|
|
91
102
|
r(), i();
|
|
92
103
|
return;
|
|
93
104
|
}
|
|
94
|
-
const n =
|
|
95
|
-
|
|
105
|
+
const n = T.guido, s = `https://email-static.useinsider.com/guido/${(e = n == null ? void 0 : n.stripo) == null ? void 0 : e.version}/UIEditor.js`, o = document.createElement("script");
|
|
106
|
+
o.id = "UiEditorScript", o.type = "module", o.src = s, o.onload = () => {
|
|
96
107
|
r(), i();
|
|
97
|
-
},
|
|
98
|
-
t(new Error(`Failed to load Stripo UIEditor script from S3: ${
|
|
99
|
-
}, document.body.appendChild(
|
|
108
|
+
}, o.onerror = () => {
|
|
109
|
+
t(new Error(`Failed to load Stripo UIEditor script from S3: ${s}`));
|
|
110
|
+
}, document.body.appendChild(o);
|
|
100
111
|
});
|
|
101
112
|
return { initPlugin: async (r) => {
|
|
102
|
-
await
|
|
113
|
+
await g(async () => {
|
|
103
114
|
const i = await m();
|
|
104
|
-
|
|
115
|
+
l(r, i);
|
|
105
116
|
});
|
|
106
117
|
} };
|
|
107
118
|
};
|
|
108
119
|
export {
|
|
109
|
-
|
|
120
|
+
G as useStripo
|
|
110
121
|
};
|
package/dist/enums/defaults.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const
|
|
1
|
+
const a = {
|
|
2
2
|
translationsPath: "window.trans.en",
|
|
3
3
|
emailHeader: {
|
|
4
4
|
senderName: "",
|
|
@@ -7,24 +7,18 @@ const e = {
|
|
|
7
7
|
extensions: {
|
|
8
8
|
unsubscribe: !0
|
|
9
9
|
},
|
|
10
|
-
blocks: {
|
|
11
|
-
excludeDefaults: [],
|
|
12
|
-
includeCustoms: []
|
|
13
|
-
},
|
|
14
10
|
features: {
|
|
15
11
|
dynamicContent: !0,
|
|
16
12
|
saveAsTemplate: !0,
|
|
17
|
-
versionHistory: !0
|
|
18
|
-
testMessage: !0
|
|
13
|
+
versionHistory: !0
|
|
19
14
|
},
|
|
20
15
|
useHeader: !0
|
|
21
16
|
}, t = {
|
|
22
17
|
promotional: 1,
|
|
23
18
|
transactional: 2
|
|
24
|
-
},
|
|
19
|
+
}, e = "email", o = "Guido User", n = t.promotional, s = 2, i = {
|
|
25
20
|
email: 60,
|
|
26
|
-
architect: 49
|
|
27
|
-
unsubscribePages: 97
|
|
21
|
+
architect: 49
|
|
28
22
|
}, u = [
|
|
29
23
|
"alfredtesting",
|
|
30
24
|
"electio",
|
|
@@ -58,11 +52,11 @@ const e = {
|
|
|
58
52
|
"stripoeditorlivetest"
|
|
59
53
|
];
|
|
60
54
|
export {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
55
|
+
a as DefaultGuidoConfig,
|
|
56
|
+
n as DefaultMessageType,
|
|
57
|
+
e as DefaultProductType,
|
|
64
58
|
o as DefaultUsername,
|
|
65
|
-
|
|
59
|
+
s as EditorType,
|
|
66
60
|
i as ProductIds,
|
|
67
61
|
u as TEST_PARTNER_LIST,
|
|
68
62
|
t as TemplateTypes
|
|
@@ -3,7 +3,7 @@ import { CheckboxBlock as t } from "./block.js";
|
|
|
3
3
|
import { CheckboxControl as e } from "./control.js";
|
|
4
4
|
import { CheckboxIconsRegistry as r } from "./iconsRegistry.js";
|
|
5
5
|
import { CheckboxBlockSettings as i } from "./settingsPanel.js";
|
|
6
|
-
const
|
|
6
|
+
const k = new o().addBlock(t).withSettingsPanelRegistry(i).addControl(e).withIconsRegistry(r).build();
|
|
7
7
|
export {
|
|
8
|
-
|
|
8
|
+
k as default
|
|
9
9
|
};
|
|
@@ -2,7 +2,7 @@ import { ExtensionBuilder as o } from "../../../node_modules/@stripoinc/ui-edito
|
|
|
2
2
|
import { CouponBlock as t } from "./block.js";
|
|
3
3
|
import { CouponIconsRegistry as i } from "./iconsRegistry.js";
|
|
4
4
|
import { CouponBlockSettings as n } from "./settingsPanel.js";
|
|
5
|
-
const
|
|
5
|
+
const m = new o().addBlock(t).withSettingsPanelRegistry(n).withIconsRegistry(i).build();
|
|
6
6
|
export {
|
|
7
|
-
|
|
7
|
+
m as default
|
|
8
8
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { ExtensionBuilder as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
2
|
import { RecommendationBlock as t } from "./block.js";
|
|
3
3
|
import { RecommendationBlockControl as e } from "./control.js";
|
|
4
|
-
import { RecommendationIconsRegistry as
|
|
5
|
-
import
|
|
6
|
-
import { SettingsPanel as
|
|
7
|
-
const f = new o().addBlock(t).withSettingsPanelRegistry(
|
|
4
|
+
import { RecommendationIconsRegistry as n } from "./iconsRegistry.js";
|
|
5
|
+
import i from "./recommendation.css.js";
|
|
6
|
+
import { SettingsPanel as m } from "./settingsPanel.js";
|
|
7
|
+
const f = new o().addBlock(t).withSettingsPanelRegistry(m).addControl(e).addStyles(i).withIconsRegistry(n).build();
|
|
8
8
|
export {
|
|
9
9
|
f as default
|
|
10
10
|
};
|
package/dist/guido.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.gap-16[data-v-6562e38c],.gap-16[data-v-1ccb6d4a]{gap:16px}[data-v-
|
|
1
|
+
.gap-16[data-v-6562e38c],.gap-16[data-v-1ccb6d4a]{gap:16px}[data-v-2c168944] .in-button-v2__wrapper{line-height:0}[data-v-b5997368] .in-segments-wrapper .in-tooltip-wrapper__box{text-align:left}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.guido-loading__wrapper[data-v-dced5582]{height:100%;top:75px}.guido-editor__wrapper[data-v-e8d51dec],.guido-editor__container[data-v-e8d51dec]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-e8d51dec]{height:calc(100vh - 75px)}[data-v-70835920] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-a86fc486]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-a86fc486]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-a86fc486]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-a86fc486]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-a86fc486]{object-fit:cover;transform:scale(1)}[data-v-dd57102d] .guido__verion-history-view-option-selection-desktop svg,[data-v-dd57102d] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-dd57102d] .in-segments-wrapper__button_selected,[data-v-dd57102d] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-7a09985c]{gap:16px}[data-v-c2adc57d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-2dd60b0c],[data-v-2dd60b0c] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.cropped-text[data-v-f20b3a9b]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-v-d3c52b44] .vueperslides__bullets,[data-v-a408dcea] .vueperslides__bullets{pointer-events:none!important}[data-v-a408dcea] .vueperslides__parallax-wrapper{height:110px!important}
|
|
@@ -6,19 +6,12 @@ type Features = {
|
|
|
6
6
|
dynamicContent?: boolean;
|
|
7
7
|
saveAsTemplate?: boolean;
|
|
8
8
|
versionHistory?: boolean;
|
|
9
|
-
testMessage?: boolean;
|
|
10
9
|
};
|
|
11
10
|
type Partner = {
|
|
12
11
|
partnerName: string;
|
|
13
12
|
productType: number;
|
|
14
13
|
messageType: number;
|
|
15
14
|
};
|
|
16
|
-
export type GuidoBlockType = 'amp-accordion' | 'amp-carousel' | 'amp-form-controls' | 'banner-block' | 'button-block' | 'html-block' | 'image-block' | 'menu-block' | 'social-block' | 'spacer-block' | 'text-block' | 'timer-block' | 'video-block';
|
|
17
|
-
export type GuidoCustomBlockType = 'dynamic-content' | 'checkbox-block' | 'radio-button-block' | 'recommendation-block' | 'unsubscribe-block' | 'coupon-block' | 'items-block';
|
|
18
|
-
type BlocksConfig = {
|
|
19
|
-
excludeDefaults?: GuidoBlockType[];
|
|
20
|
-
includeCustoms?: GuidoCustomBlockType[];
|
|
21
|
-
};
|
|
22
15
|
export type GuidoConfig = {
|
|
23
16
|
translationsPath: string;
|
|
24
17
|
htmlCompilerRules?: CompilerRule[];
|
|
@@ -28,8 +21,6 @@ export type GuidoConfig = {
|
|
|
28
21
|
partner?: Partner;
|
|
29
22
|
extensions?: Extensions;
|
|
30
23
|
features?: Features;
|
|
31
|
-
blocks?: BlocksConfig;
|
|
32
|
-
backButtonLabel?: string;
|
|
33
24
|
};
|
|
34
25
|
export type TemplateConfig = {
|
|
35
26
|
preselectedDynamicContentList?: DynamicContent[];
|
|
@@ -32,8 +32,8 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<
|
|
|
32
32
|
closeOnOutsideClick: boolean;
|
|
33
33
|
footerStatus: boolean;
|
|
34
34
|
}>>>, {
|
|
35
|
-
size: "small" | "medium" | "large";
|
|
36
35
|
description: string;
|
|
36
|
+
size: "small" | "medium" | "large";
|
|
37
37
|
closeOnOutsideClick: boolean;
|
|
38
38
|
footerButtonOptions: FooterButtonGroup;
|
|
39
39
|
closeButtonStatus: boolean;
|
|
@@ -76,13 +76,7 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"config", S
|
|
|
76
76
|
dynamicContent?: boolean | undefined;
|
|
77
77
|
saveAsTemplate?: boolean | undefined;
|
|
78
78
|
versionHistory?: boolean | undefined;
|
|
79
|
-
testMessage?: boolean | undefined;
|
|
80
79
|
} | undefined;
|
|
81
|
-
blocks?: {
|
|
82
|
-
excludeDefaults?: import("@@/Types/generic").GuidoBlockType[] | undefined;
|
|
83
|
-
includeCustoms?: import("@@/Types/generic").GuidoCustomBlockType[] | undefined;
|
|
84
|
-
} | undefined;
|
|
85
|
-
backButtonLabel?: string | undefined;
|
|
86
80
|
};
|
|
87
81
|
templateConfig?: {
|
|
88
82
|
preselectedDynamicContentList?: {
|
|
@@ -32,6 +32,16 @@ ue-stripe-thumb:hover:not(.disabled),
|
|
|
32
32
|
padding: 0 16px 16px;
|
|
33
33
|
grid-row-gap: 16px;
|
|
34
34
|
}
|
|
35
|
+
|
|
36
|
+
/* TODO: will be removed after we find another way to hide stripo custom modules */
|
|
37
|
+
#moduleTab_tab1,
|
|
38
|
+
button[aria-label="Default Modules"],
|
|
39
|
+
button[aria-controls="moduleTab_tab1_content"],
|
|
40
|
+
#moduleTab_tab2,
|
|
41
|
+
button[aria-label="Pre-Built AMP"],
|
|
42
|
+
button[aria-controls="moduleTab_tab2_content"] {
|
|
43
|
+
display: none !important;
|
|
44
|
+
}
|
|
35
45
|
`;
|
|
36
46
|
export {
|
|
37
47
|
o as default
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "1.0.3-beta.
|
|
3
|
+
"version": "1.0.3-beta.84612c7",
|
|
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",
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
const l = {
|
|
2
|
-
"amp-accordion": "ampAccordionEnabled",
|
|
3
|
-
"amp-carousel": "ampCarouselEnabled",
|
|
4
|
-
"amp-form-controls": "ampFormControlsEnabled",
|
|
5
|
-
"banner-block": "bannerEnabled",
|
|
6
|
-
"button-block": "buttonEnabled",
|
|
7
|
-
"html-block": "htmlEnabled",
|
|
8
|
-
"image-block": "imageEnabled",
|
|
9
|
-
"menu-block": "menuEnabled",
|
|
10
|
-
"social-block": "socialNetEnabled",
|
|
11
|
-
"spacer-block": "spacerEnabled",
|
|
12
|
-
"text-block": "textEnabled",
|
|
13
|
-
"timer-block": "timerEnabled",
|
|
14
|
-
"video-block": "videoEnabled"
|
|
15
|
-
}, c = {
|
|
16
|
-
"dynamic-content": () => import("../extensions/DynamicContent/extension.js"),
|
|
17
|
-
"checkbox-block": () => import("../extensions/Blocks/Checkbox/extension.js"),
|
|
18
|
-
"radio-button-block": () => import("../extensions/Blocks/RadioButton/extension.js"),
|
|
19
|
-
"recommendation-block": () => import("../extensions/Blocks/Recommendation/extension.js"),
|
|
20
|
-
"unsubscribe-block": () => import("../extensions/Blocks/Unsubscribe/extension.js"),
|
|
21
|
-
"coupon-block": () => import("../extensions/Blocks/CouponBlock/extension.js"),
|
|
22
|
-
"items-block": null
|
|
23
|
-
// TODO: Add ItemsBlock extension when available
|
|
24
|
-
}, a = (n) => {
|
|
25
|
-
if (!n || !n.length)
|
|
26
|
-
return {};
|
|
27
|
-
const o = {};
|
|
28
|
-
return n.forEach((e) => {
|
|
29
|
-
const t = l[e];
|
|
30
|
-
t && (o[t] = !1);
|
|
31
|
-
}), o;
|
|
32
|
-
}, r = async (n) => !n || !n.length ? [] : (await Promise.all(
|
|
33
|
-
n.map(async (e) => {
|
|
34
|
-
const t = c[e];
|
|
35
|
-
return t ? (await t()).default : null;
|
|
36
|
-
})
|
|
37
|
-
)).filter((e) => e !== null), s = () => ({
|
|
38
|
-
getStripoBlocksConfig: async () => {
|
|
39
|
-
var e;
|
|
40
|
-
const o = (e = window.GuidoConfig) == null ? void 0 : e.blocks;
|
|
41
|
-
return {
|
|
42
|
-
baseBlocks: a(o == null ? void 0 : o.excludeDefaults),
|
|
43
|
-
extensions: await r(o == null ? void 0 : o.includeCustoms)
|
|
44
|
-
};
|
|
45
|
-
}
|
|
46
|
-
});
|
|
47
|
-
export {
|
|
48
|
-
s as useBlocksConfig
|
|
49
|
-
};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Extension } from '@stripoinc/ui-editor-extensions';
|
|
2
|
-
/**
|
|
3
|
-
* Composable for managing Guido blocks configuration
|
|
4
|
-
* Converts GuidoConfig blocks settings to Stripo-compatible format
|
|
5
|
-
*/
|
|
6
|
-
export declare const useBlocksConfig: () => {
|
|
7
|
-
getStripoBlocksConfig: () => Promise<{
|
|
8
|
-
baseBlocks: Record<string, boolean>;
|
|
9
|
-
extensions: Extension[];
|
|
10
|
-
}>;
|
|
11
|
-
};
|