@useinsider/guido 1.0.0-beta.f2786f4 → 1.0.0-beta.f2fcf4d
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 +89 -166
- package/dist/@types/generic.d.ts +4 -1
- package/dist/components/Guido.vue.d.ts +0 -2
- package/dist/components/Guido.vue.js +7 -7
- package/dist/components/Guido.vue2.js +11 -18
- package/dist/components/organisms/top-bar/HeaderMiddleSlot.vue.js +8 -8
- package/dist/components/organisms/top-bar/HeaderMiddleSlot.vue2.js +6 -14
- package/dist/components/organisms/top-bar/HeaderRightSlot.vue.d.ts +1 -1
- package/dist/components/organisms/top-bar/HeaderRightSlot.vue.js +9 -9
- package/dist/components/organisms/top-bar/HeaderRightSlot.vue2.js +9 -7
- package/dist/composables/useStripo.d.ts +1 -1
- package/dist/composables/useStripo.js +24 -37
- package/dist/composables/useTemplates.d.ts +1 -1
- package/dist/enums/defaults.enum.d.ts +18 -0
- package/dist/guido.css +1 -1
- package/dist/library.d.ts +0 -1
- package/dist/stores/counter.d.ts +12 -0
- package/package.json +1 -1
- package/dist/components/organisms/top-bar/HeaderViewOptions.vue.d.ts +0 -2
- package/dist/components/organisms/top-bar/HeaderViewOptions.vue.js +0 -18
- package/dist/components/organisms/top-bar/HeaderViewOptions.vue2.js +0 -15
- package/dist/composables/useTranslations.js +0 -20
- package/dist/enums/defaults.d.ts +0 -2
- package/dist/enums/defaults.js +0 -6
- package/dist/guido.png +0 -0
- package/dist/node_modules/lodash-es/_Hash.js +0 -20
- package/dist/node_modules/lodash-es/_ListCache.js +0 -20
- package/dist/node_modules/lodash-es/_Map.js +0 -6
- package/dist/node_modules/lodash-es/_MapCache.js +0 -20
- package/dist/node_modules/lodash-es/_Symbol.js +0 -5
- package/dist/node_modules/lodash-es/_assocIndexOf.js +0 -10
- package/dist/node_modules/lodash-es/_baseGetTag.js +0 -10
- package/dist/node_modules/lodash-es/_baseIsNative.js +0 -16
- package/dist/node_modules/lodash-es/_coreJsData.js +0 -5
- package/dist/node_modules/lodash-es/_freeGlobal.js +0 -4
- package/dist/node_modules/lodash-es/_getMapData.js +0 -8
- package/dist/node_modules/lodash-es/_getNative.js +0 -9
- package/dist/node_modules/lodash-es/_getRawTag.js +0 -15
- package/dist/node_modules/lodash-es/_getValue.js +0 -6
- package/dist/node_modules/lodash-es/_hashClear.js +0 -7
- package/dist/node_modules/lodash-es/_hashDelete.js +0 -7
- package/dist/node_modules/lodash-es/_hashGet.js +0 -13
- package/dist/node_modules/lodash-es/_hashHas.js +0 -9
- package/dist/node_modules/lodash-es/_hashSet.js +0 -9
- package/dist/node_modules/lodash-es/_isKeyable.js +0 -7
- package/dist/node_modules/lodash-es/_isMasked.js +0 -11
- package/dist/node_modules/lodash-es/_listCacheClear.js +0 -6
- package/dist/node_modules/lodash-es/_listCacheDelete.js +0 -12
- package/dist/node_modules/lodash-es/_listCacheGet.js +0 -8
- package/dist/node_modules/lodash-es/_listCacheHas.js +0 -7
- package/dist/node_modules/lodash-es/_listCacheSet.js +0 -8
- package/dist/node_modules/lodash-es/_mapCacheClear.js +0 -13
- package/dist/node_modules/lodash-es/_mapCacheDelete.js +0 -8
- package/dist/node_modules/lodash-es/_mapCacheGet.js +0 -7
- package/dist/node_modules/lodash-es/_mapCacheHas.js +0 -7
- package/dist/node_modules/lodash-es/_mapCacheSet.js +0 -8
- package/dist/node_modules/lodash-es/_nativeCreate.js +0 -5
- package/dist/node_modules/lodash-es/_objectToString.js +0 -7
- package/dist/node_modules/lodash-es/_root.js +0 -5
- package/dist/node_modules/lodash-es/_toSource.js +0 -17
- package/dist/node_modules/lodash-es/eq.js +0 -6
- package/dist/node_modules/lodash-es/isFunction.js +0 -12
- package/dist/node_modules/lodash-es/isObject.js +0 -7
- package/dist/node_modules/lodash-es/memoize.js +0 -18
- package/dist/node_modules/pinia/dist/pinia.js +0 -314
- package/dist/node_modules/pinia/node_modules/vue-demi/lib/index.js +0 -11
- package/dist/stores/editor.d.ts +0 -4
- package/dist/stores/editor.js +0 -10
package/README.md
CHANGED
|
@@ -1,32 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
<a href="https://www.youtube.com/shorts/Y0RwBeMezL4" target="_blank" rel="noopener noreferrer">
|
|
3
|
-
<img width="180" src="./public/guido.png" alt="Guido logo">
|
|
4
|
-
</a>
|
|
5
|
-
</p>
|
|
1
|
+
# @useinsider/guido-plugin
|
|
6
2
|
|
|
7
|
-
|
|
8
|
-
# @useinsider/guido
|
|
9
|
-
|
|
10
|
-
Guido is a Vue 2 + TypeScript wrapper for the Stripo Email Editor plugin. Easily embed the professional email editor in your Vue applications with a clean, customizable interface.
|
|
3
|
+
Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.
|
|
11
4
|
|
|
12
5
|
## 📦 Install
|
|
13
|
-
|
|
14
6
|
```bash
|
|
15
7
|
npm install @useinsider/guido
|
|
16
8
|
```
|
|
17
9
|
|
|
18
|
-
## 🚀 Usage
|
|
19
|
-
|
|
20
|
-
### Basic Usage
|
|
21
|
-
|
|
22
|
-
```html
|
|
10
|
+
## 🚀 Usage (Vue 2)
|
|
11
|
+
```vue
|
|
23
12
|
<template>
|
|
24
|
-
<
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
13
|
+
<Guido
|
|
14
|
+
email-id="abc123"
|
|
15
|
+
:api="apiEndpoints"
|
|
16
|
+
:extensions="extensions"
|
|
17
|
+
:insider-stripo-config="insiderStripoConfig"
|
|
18
|
+
@save="handleSave"
|
|
19
|
+
@export:requested="onExportRequested"
|
|
20
|
+
@export:ready="handleHtml"
|
|
21
|
+
@close="onClose"
|
|
22
|
+
/>
|
|
30
23
|
</template>
|
|
31
24
|
|
|
32
25
|
<script lang="ts">
|
|
@@ -38,169 +31,99 @@ export default {
|
|
|
38
31
|
},
|
|
39
32
|
data() {
|
|
40
33
|
return {
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
34
|
+
apiEndpoints: {
|
|
35
|
+
dynamicContent: '/api/dynamic-content',
|
|
36
|
+
unsubPages: '/api/unsub-pages',
|
|
37
|
+
header: '/api/header',
|
|
38
|
+
footer: '/api/footer',
|
|
39
|
+
productName: '/api/product-name',
|
|
40
|
+
productVersion: '/api/product-version',
|
|
41
|
+
token: '/api/stripo-token'
|
|
42
|
+
},
|
|
43
|
+
extensions: {
|
|
44
|
+
dynamicContent: true,
|
|
45
|
+
unsubPages: true,
|
|
46
|
+
header: false,
|
|
47
|
+
footer: false
|
|
44
48
|
}
|
|
45
49
|
};
|
|
50
|
+
},
|
|
51
|
+
methods: {
|
|
52
|
+
handleSave(data: any) {
|
|
53
|
+
console.log('Saved:', data);
|
|
54
|
+
},
|
|
55
|
+
handleHtml({ html }: { html: string }) {
|
|
56
|
+
console.log('HTML ready:', html);
|
|
57
|
+
},
|
|
58
|
+
onExportRequested() {
|
|
59
|
+
console.log('Export started');
|
|
60
|
+
},
|
|
61
|
+
onClose() {
|
|
62
|
+
console.log('Closed');
|
|
63
|
+
}
|
|
46
64
|
}
|
|
47
65
|
};
|
|
48
66
|
</script>
|
|
49
67
|
```
|
|
50
68
|
|
|
51
69
|
## 📚 API
|
|
70
|
+
### `<StripoEditor />` Props
|
|
71
|
+
| Prop | Type | Required | Description |
|
|
72
|
+
|-------------|----------|----------|----------------------------|
|
|
73
|
+
| emailId | string | ✅ | Stripo email draft ID |
|
|
74
|
+
| iframeId | string | ❌ | Custom iframe ID |
|
|
75
|
+
| api | object | ❌ | Custom API endpoints |
|
|
76
|
+
| extensions | object | ❌ | Enable/disable extensions |
|
|
77
|
+
| insiderStripoConfig | object | ❌ | Insider Stripo configuration |
|
|
78
|
+
|
|
79
|
+
### Extensions
|
|
80
|
+
| Extension | Type | Default | Description |
|
|
81
|
+
|----------------|-----------|---------|--------------------------------|
|
|
82
|
+
| dynamicContent | boolean | true | Dynamic content functionality |
|
|
83
|
+
| unsubPages | boolean | true | Unsubscribe pages feature |
|
|
84
|
+
| header | boolean | true | Header customization |
|
|
85
|
+
| footer | boolean | true | Footer customization |
|
|
86
|
+
|
|
87
|
+
### Insider Stripo Configuration
|
|
88
|
+
| Property | Type | Default | Description |
|
|
89
|
+
|-------------------|----------|---------|--------------------------------|
|
|
90
|
+
| translationsPath | string | 'window.trans.en | JS Path to translations file |
|
|
91
|
+
|
|
92
|
+
### API Endpoints
|
|
93
|
+
| Endpoint | Default Path | Description |
|
|
94
|
+
|-------------------|------------------------|--------------------------------|
|
|
95
|
+
| dynamicContent | /api/dynamic-content | Dynamic content endpoint |
|
|
96
|
+
| unsubPages | /api/unsub-pages | Unsubscribe pages endpoint |
|
|
97
|
+
| header | /api/header | Header endpoint |
|
|
98
|
+
| footer | /api/footer | Footer endpoint |
|
|
99
|
+
| productName | /api/product-name | Product name endpoint |
|
|
100
|
+
| productVersion | /api/product-version | Product version endpoint |
|
|
101
|
+
| token | /api/stripo-token | Authentication token endpoint |
|
|
102
|
+
|
|
103
|
+
### Events
|
|
104
|
+
| Event | Payload | Description |
|
|
105
|
+
|-------------------|------------------------|--------------------------------|
|
|
106
|
+
| `save` | any | Triggered on save |
|
|
107
|
+
| `export:requested`| void | Triggered when export starts |
|
|
108
|
+
| `export:ready` | { html: string } | Triggered when HTML is ready |
|
|
109
|
+
| `close` | void | Triggered when editor closes |
|
|
52
110
|
|
|
53
|
-
### Guido Component Props
|
|
54
|
-
|
|
55
|
-
| Prop | Type | Required | Default | Description |
|
|
56
|
-
|------|------|----------|---------|-------------|
|
|
57
|
-
| `emailId` | `string` | ✅ | - | Unique identifier for the email draft |
|
|
58
|
-
| `guidoConfig` | `GuidoConfig` | ✅ | - | Configuration object for the editor |
|
|
59
|
-
|
|
60
|
-
### GuidoConfig Interface
|
|
61
|
-
|
|
62
|
-
```typescript
|
|
63
|
-
interface GuidoConfig {
|
|
64
|
-
translationsPath: string;
|
|
65
|
-
}
|
|
66
|
-
```
|
|
67
|
-
|
|
68
|
-
| Property | Type | Default | Description |
|
|
69
|
-
|----------|------|---------|-------------|
|
|
70
|
-
| `translationsPath` | `string` | `'window.trans.en'` | JavaScript path to the translations object |
|
|
71
|
-
|
|
72
|
-
### TypeScript Types
|
|
73
|
-
|
|
74
|
-
The library exports the following TypeScript types:
|
|
75
|
-
|
|
76
|
-
```typescript
|
|
77
|
-
// Main component
|
|
78
|
-
import { Guido } from '@useinsider/guido';
|
|
79
|
-
|
|
80
|
-
// Types
|
|
81
|
-
import type { GuidoConfig } from '@useinsider/guido';
|
|
82
|
-
import type { StripoEventType } from '@useinsider/guido';
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
### StripoEventType
|
|
86
|
-
|
|
87
|
-
```typescript
|
|
88
|
-
type StripoEventType =
|
|
89
|
-
| 'save'
|
|
90
|
-
| 'export'
|
|
91
|
-
| 'close'
|
|
92
|
-
| 'autosave'
|
|
93
|
-
| 'publish'
|
|
94
|
-
| 'export:requested'
|
|
95
|
-
| 'export:ready';
|
|
96
|
-
```
|
|
97
111
|
|
|
98
112
|
---
|
|
99
113
|
|
|
100
|
-
##
|
|
101
|
-
|
|
102
|
-
### Prerequisites
|
|
103
|
-
|
|
104
|
-
- 🧄 `Bun` (strongly recommended)
|
|
105
|
-
or
|
|
106
|
-
- NodeJS 18+ & `npm`
|
|
107
|
-
|
|
108
|
-
### Setup
|
|
109
|
-
|
|
114
|
+
## 🛠 Development
|
|
110
115
|
```bash
|
|
111
|
-
# Install dependencies
|
|
112
116
|
bun install
|
|
113
|
-
|
|
114
|
-
# Start development server
|
|
115
117
|
bun start
|
|
116
|
-
|
|
117
|
-
# Build for production
|
|
118
|
-
bun run build
|
|
119
|
-
|
|
120
|
-
# Type checking
|
|
121
|
-
bun run type-check
|
|
122
|
-
|
|
123
|
-
# Linting
|
|
124
|
-
bun run lint
|
|
125
|
-
```
|
|
126
|
-
|
|
127
|
-
### Environment Variables
|
|
128
|
-
|
|
129
|
-
Create a `.env` file with the following variables: (You can get env variables from your senior)
|
|
130
|
-
|
|
131
|
-
```env
|
|
132
|
-
VITE_STRIPO_PLUGIN_ID=your_plugin_id
|
|
133
|
-
VITE_STRIPO_SECRET_KEY=your_secret_key
|
|
134
|
-
VITE_STRIPO_ROLE=your_role
|
|
135
|
-
```
|
|
136
|
-
|
|
137
|
-
### Project Structure
|
|
138
|
-
|
|
139
118
|
```
|
|
140
|
-
src/
|
|
141
|
-
├── components/
|
|
142
|
-
│ ├── Guido.vue # Main component
|
|
143
|
-
│ └── organisms/
|
|
144
|
-
│ └── top-bar/ # Header components
|
|
145
|
-
...
|
|
146
|
-
├── composables/
|
|
147
|
-
│ ├── useStripo.ts # Stripo integration
|
|
148
|
-
│ └── useTranslations.ts # Translation management
|
|
149
|
-
├── @types/
|
|
150
|
-
│ ├── generic.ts # Generic types
|
|
151
|
-
│ ├── stripo.d.ts # Stripo-specific types
|
|
152
|
-
│ └── events.ts # Event types
|
|
153
|
-
├── static/
|
|
154
|
-
│ ├── editor.css # Custom editor styles
|
|
155
|
-
│ └── templates/
|
|
156
|
-
│ └── default/ # Default email template
|
|
157
|
-
└── library.ts # Main export for library
|
|
158
|
-
```
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
## 📦 Build Output
|
|
162
119
|
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
- **CSS**: `dist/guido.css` (custom styles)
|
|
167
|
-
|
|
168
|
-
### Package Exports
|
|
169
|
-
|
|
170
|
-
```json
|
|
171
|
-
{
|
|
172
|
-
"exports": {
|
|
173
|
-
".": {
|
|
174
|
-
"import": "./dist/library.js",
|
|
175
|
-
"types": "./dist/components/Guido.vue.d.ts",
|
|
176
|
-
"require": "./dist/components/Guido.vue.js"
|
|
177
|
-
},
|
|
178
|
-
"./style": "./dist/guido.css"
|
|
179
|
-
}
|
|
180
|
-
}
|
|
120
|
+
Build & types:
|
|
121
|
+
```bash
|
|
122
|
+
bun run build
|
|
181
123
|
```
|
|
182
124
|
|
|
183
|
-
|
|
184
|
-
## 🤝 Contributing
|
|
185
|
-
- PR Titles should be structured like `TASK-ID | 🔥 | Some Clear Task Descriptions`
|
|
186
|
-
- PR Labels should be filled.
|
|
187
|
-
- PR Assignee required.
|
|
188
|
-
- Tests should be covered.
|
|
189
|
-
- All required checks should be passed before sending review request.
|
|
190
|
-
|
|
191
|
-
## 📄 License
|
|
192
|
-
|
|
193
|
-
ISC License
|
|
194
|
-
|
|
195
125
|
---
|
|
196
126
|
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
-
|
|
200
|
-
- [@useinsider/design-system-vue](https://github.com/useinsider/design-system-vue) - Insider's Vue design system
|
|
201
|
-
|
|
202
|
-
## 🎯 TODO:
|
|
203
|
-
- [editor.css](src/static/editor.css) should be optimized with variables & `sass-loader`.
|
|
204
|
-
- Master Version Generator should be fixed.
|
|
205
|
-
- Playwright integration
|
|
206
|
-
- Commitlint & Precommit Hooks integration
|
|
127
|
+
TODO:
|
|
128
|
+
[ ] - Default Template @edugencioglu
|
|
129
|
+
[ ] - Using CSS variables into [editor.css](./src/static/editor.css) @berkansezer-useinsider
|
package/dist/@types/generic.d.ts
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import type { GuidoConfig } from '@@/Types/generic';
|
|
2
1
|
type __VLS_Props = {
|
|
3
2
|
emailId: string;
|
|
4
|
-
guidoConfig: GuidoConfig;
|
|
5
3
|
};
|
|
6
4
|
declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__VLS_Props>, {}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<__VLS_Props>>>, {}>;
|
|
7
5
|
export default _default;
|
|
@@ -2,17 +2,17 @@ import o from "./Guido.vue2.js";
|
|
|
2
2
|
/* empty css */
|
|
3
3
|
import i from "../_virtual/_plugin-vue2_normalizer.js";
|
|
4
4
|
var s = function() {
|
|
5
|
-
var
|
|
6
|
-
return r("div", { staticClass: "guido-
|
|
7
|
-
},
|
|
5
|
+
var t = this, r = t._self._c, e = t._self._setupProxy;
|
|
6
|
+
return r("div", { staticClass: "guido-editor-wrapper" }, [r(e.Header), r("div", { staticClass: "guido-editor-container", attrs: { id: "guido-editor" } })], 1);
|
|
7
|
+
}, a = [], n = /* @__PURE__ */ i(
|
|
8
8
|
o,
|
|
9
9
|
s,
|
|
10
|
-
|
|
10
|
+
a,
|
|
11
11
|
!1,
|
|
12
12
|
null,
|
|
13
|
-
"
|
|
13
|
+
"c14163ad"
|
|
14
14
|
);
|
|
15
|
-
const
|
|
15
|
+
const f = n.exports;
|
|
16
16
|
export {
|
|
17
|
-
|
|
17
|
+
f as default
|
|
18
18
|
};
|
|
@@ -1,31 +1,24 @@
|
|
|
1
|
-
import { defineComponent as
|
|
1
|
+
import { defineComponent as a, onMounted as n } from "vue";
|
|
2
2
|
import { useStripo as m } from "../composables/useStripo.js";
|
|
3
3
|
import { useTemplates as p } from "../composables/useTemplates.js";
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
const _ = /* @__PURE__ */ n({
|
|
4
|
+
import s from "./organisms/top-bar/Header.vue.js";
|
|
5
|
+
const f = /* @__PURE__ */ a({
|
|
7
6
|
__name: "Guido",
|
|
8
7
|
props: {
|
|
9
|
-
emailId: null
|
|
10
|
-
guidoConfig: null
|
|
8
|
+
emailId: null
|
|
11
9
|
},
|
|
12
|
-
setup(
|
|
13
|
-
const o = r;
|
|
14
|
-
|
|
15
|
-
...u,
|
|
16
|
-
...o.guidoConfig
|
|
17
|
-
};
|
|
18
|
-
const { initPlugin: i } = m(o.emailId), { getDefaultTemplate: e } = p();
|
|
19
|
-
return a(async () => {
|
|
10
|
+
setup(i) {
|
|
11
|
+
const e = i, { initPlugin: o } = m(e.emailId), { getDefaultTemplate: r } = p();
|
|
12
|
+
return n(async () => {
|
|
20
13
|
try {
|
|
21
|
-
const t = await
|
|
22
|
-
await
|
|
14
|
+
const t = await r();
|
|
15
|
+
await o(t);
|
|
23
16
|
} catch (t) {
|
|
24
17
|
console.error("Failed to initialize Stripo editor:", t);
|
|
25
18
|
}
|
|
26
|
-
}), { __sfc: !0, props:
|
|
19
|
+
}), { __sfc: !0, props: e, initPlugin: o, getDefaultTemplate: r, Header: s };
|
|
27
20
|
}
|
|
28
21
|
});
|
|
29
22
|
export {
|
|
30
|
-
|
|
23
|
+
f as default
|
|
31
24
|
};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import
|
|
1
|
+
import o from "./HeaderMiddleSlot.vue2.js";
|
|
2
2
|
import s from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
return
|
|
6
|
-
},
|
|
7
|
-
|
|
8
|
-
i,
|
|
3
|
+
var l = function() {
|
|
4
|
+
var n = this, t = n._self._c, e = n._self._setupProxy;
|
|
5
|
+
return t("div", { staticClass: "d-f" }, [t(e.InButtonV2, { attrs: { id: "guido__undo-button", "left-icon": "line-undo", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__redo-button", "left-icon": "line-redo", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__code-button", "left-icon": "line-code", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__preview-button", "left-icon": "line-show-on", styling: "ghost", type: "secondary", "label-text-status": !1 } })], 1);
|
|
6
|
+
}, a = [], i = /* @__PURE__ */ s(
|
|
7
|
+
o,
|
|
9
8
|
l,
|
|
9
|
+
a,
|
|
10
10
|
!1,
|
|
11
11
|
null,
|
|
12
12
|
null
|
|
13
13
|
);
|
|
14
|
-
const _ =
|
|
14
|
+
const _ = i.exports;
|
|
15
15
|
export {
|
|
16
16
|
_ as default
|
|
17
17
|
};
|
|
@@ -1,19 +1,11 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
import { useTranslations as r } from "../../../composables/useTranslations.js";
|
|
5
|
-
const l = /* @__PURE__ */ i({
|
|
1
|
+
import { defineComponent as e } from "vue";
|
|
2
|
+
import { InButtonV2 as t } from "@useinsider/design-system-vue";
|
|
3
|
+
const _ = /* @__PURE__ */ e({
|
|
6
4
|
__name: "HeaderMiddleSlot",
|
|
7
|
-
setup(
|
|
8
|
-
|
|
9
|
-
return { __sfc: !0, editorStore: t, trans: o, getTooltipOptions: (e) => ({
|
|
10
|
-
id: `${e}-tooltip`,
|
|
11
|
-
dynamicPosition: !1,
|
|
12
|
-
staticPosition: "bottom center",
|
|
13
|
-
iconStatus: !1
|
|
14
|
-
}), InButtonV2: s };
|
|
5
|
+
setup(o) {
|
|
6
|
+
return { __sfc: !0, InButtonV2: t };
|
|
15
7
|
}
|
|
16
8
|
});
|
|
17
9
|
export {
|
|
18
|
-
|
|
10
|
+
_ as default
|
|
19
11
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
|
|
2
2
|
export default _default;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import
|
|
1
|
+
import n from "./HeaderRightSlot.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
|
-
import
|
|
4
|
-
var
|
|
3
|
+
import o from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
4
|
+
var a = function() {
|
|
5
5
|
var s = this, t = s._self._c, e = s._self._setupProxy;
|
|
6
|
-
return t("div", { staticClass: "d-f header-right-slot" }, [t("div", { staticClass: "d-f" }, [t(e.
|
|
7
|
-
}, i = [],
|
|
8
|
-
o,
|
|
6
|
+
return t("div", { staticClass: "d-f header-right-slot" }, [t("div", { staticClass: "d-f" }, [t(e.InSegments, { attrs: { id: "preview-platform-selection", "with-icon": "", selected: "desktop", "segment-list": e.segmentList } })], 1), t("div", { staticClass: "d-f" }, [t(e.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "label-text-status": !1 } }), t(e.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "label-text-status": !1 } })], 1), t(e.InButtonV2, { attrs: { id: "guido__save-button", "label-text": "Save" } })], 1);
|
|
7
|
+
}, i = [], l = /* @__PURE__ */ o(
|
|
9
8
|
n,
|
|
9
|
+
a,
|
|
10
10
|
i,
|
|
11
11
|
!1,
|
|
12
12
|
null,
|
|
13
|
-
"
|
|
13
|
+
"9d879f6f"
|
|
14
14
|
);
|
|
15
|
-
const
|
|
15
|
+
const u = l.exports;
|
|
16
16
|
export {
|
|
17
|
-
|
|
17
|
+
u as default
|
|
18
18
|
};
|
|
@@ -1,12 +1,14 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { InButtonV2 as
|
|
3
|
-
|
|
4
|
-
const i = /* @__PURE__ */ t({
|
|
1
|
+
import { defineComponent as e } from "vue";
|
|
2
|
+
import { InSegments as t, InButtonV2 as n } from "@useinsider/design-system-vue";
|
|
3
|
+
const p = /* @__PURE__ */ e({
|
|
5
4
|
__name: "HeaderRightSlot",
|
|
6
|
-
setup(
|
|
7
|
-
return { __sfc: !0,
|
|
5
|
+
setup(o) {
|
|
6
|
+
return { __sfc: !0, segmentList: [
|
|
7
|
+
{ text: "", icon: "line-desktop", value: "desktop" },
|
|
8
|
+
{ text: "", icon: "line-menu-mobileapp", value: "mobile" }
|
|
9
|
+
], InButtonV2: n, InSegments: t };
|
|
8
10
|
}
|
|
9
11
|
});
|
|
10
12
|
export {
|
|
11
|
-
|
|
13
|
+
p as default
|
|
12
14
|
};
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import { useCustomInterfaceAppearance as
|
|
2
|
-
|
|
3
|
-
const g = (s) => {
|
|
1
|
+
import { useCustomInterfaceAppearance as d } from "./useCustomInterfaceAppearance.js";
|
|
2
|
+
const u = (s) => {
|
|
4
3
|
const c = () => {
|
|
5
4
|
const t = new Headers();
|
|
6
5
|
t.append("Content-Type", "application/json");
|
|
7
|
-
const
|
|
6
|
+
const o = JSON.stringify({
|
|
8
7
|
pluginId: void 0,
|
|
9
8
|
secretKey: void 0,
|
|
10
9
|
role: void 0,
|
|
@@ -13,11 +12,11 @@ const g = (s) => {
|
|
|
13
12
|
return fetch("/v2/stripo/get-token", {
|
|
14
13
|
method: "POST",
|
|
15
14
|
headers: t,
|
|
16
|
-
body:
|
|
15
|
+
body: o,
|
|
17
16
|
redirect: "follow"
|
|
18
|
-
}).then((
|
|
19
|
-
},
|
|
20
|
-
const
|
|
17
|
+
}).then((e) => e.json());
|
|
18
|
+
}, i = (t) => {
|
|
19
|
+
const o = t.html, n = t.css;
|
|
21
20
|
window.UIEditor.initEditor(
|
|
22
21
|
document.querySelector("#guido-editor"),
|
|
23
22
|
{
|
|
@@ -27,55 +26,43 @@ const g = (s) => {
|
|
|
27
26
|
username: "Plugin Demo User"
|
|
28
27
|
},
|
|
29
28
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
30
|
-
html:
|
|
29
|
+
html: o,
|
|
31
30
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
32
|
-
css:
|
|
31
|
+
css: n,
|
|
33
32
|
locale: "en",
|
|
34
|
-
undoButtonSelector: "#guido__undo-button",
|
|
35
|
-
redoButtonSelector: "#guido__redo-button",
|
|
36
|
-
mobileViewButtonSelector: ".guido__view-option-selection-mobile",
|
|
37
|
-
desktopViewButtonSelector: ".guido__view-option-selection-desktop",
|
|
38
|
-
versionHistoryButtonSelector: "#guido__history-button",
|
|
39
|
-
codeEditorButtonSelector: "#guido__code-button",
|
|
40
33
|
async onTokenRefreshRequest(e) {
|
|
41
34
|
try {
|
|
42
|
-
const
|
|
43
|
-
e(
|
|
44
|
-
} catch (
|
|
45
|
-
console.error("Failed to refresh token:",
|
|
35
|
+
const r = await c();
|
|
36
|
+
e(r.token);
|
|
37
|
+
} catch (r) {
|
|
38
|
+
console.error("Failed to refresh token:", r);
|
|
46
39
|
}
|
|
47
40
|
},
|
|
48
41
|
onTemplateLoaded() {
|
|
49
42
|
try {
|
|
50
|
-
const { importCss: e } =
|
|
43
|
+
const { importCss: e } = d();
|
|
51
44
|
e();
|
|
52
45
|
} catch (e) {
|
|
53
46
|
console.error("Failed to load custom interface appearance:", e);
|
|
54
47
|
}
|
|
55
|
-
},
|
|
56
|
-
onCodeEditorVisibilityChanged(e) {
|
|
57
|
-
r.isCodeEditorOpen = e;
|
|
58
|
-
},
|
|
59
|
-
onEditorVisualModeChanged(e) {
|
|
60
|
-
r.editorVisualMode = e.toLowerCase();
|
|
61
48
|
}
|
|
62
49
|
}
|
|
63
50
|
);
|
|
64
51
|
};
|
|
65
|
-
return { initPlugin: (t) => new Promise((
|
|
52
|
+
return { initPlugin: (t) => new Promise((o, n) => {
|
|
66
53
|
if (document.getElementById("UiEditorScript")) {
|
|
67
|
-
|
|
54
|
+
i(t), o();
|
|
68
55
|
return;
|
|
69
56
|
}
|
|
70
|
-
const
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
},
|
|
74
|
-
const
|
|
75
|
-
n(
|
|
76
|
-
}, document.body.appendChild(
|
|
57
|
+
const e = document.createElement("script");
|
|
58
|
+
e.id = "UiEditorScript", e.type = "module", e.src = "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js", e.onload = () => {
|
|
59
|
+
i(t), o();
|
|
60
|
+
}, e.onerror = () => {
|
|
61
|
+
const r = new Error("Failed to load Stripo UIEditor script");
|
|
62
|
+
n(r);
|
|
63
|
+
}, document.body.appendChild(e);
|
|
77
64
|
}) };
|
|
78
65
|
};
|
|
79
66
|
export {
|
|
80
|
-
|
|
67
|
+
u as useStripo
|
|
81
68
|
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export declare const DefaultApiEndpoints: {
|
|
2
|
+
dynamicContent: string;
|
|
3
|
+
unsubPages: string;
|
|
4
|
+
header: string;
|
|
5
|
+
footer: string;
|
|
6
|
+
productName: string;
|
|
7
|
+
productVersion: string;
|
|
8
|
+
token: string;
|
|
9
|
+
};
|
|
10
|
+
export declare const DefaultExtensions: {
|
|
11
|
+
dynamicContent: boolean;
|
|
12
|
+
unsubPages: boolean;
|
|
13
|
+
header: boolean;
|
|
14
|
+
footer: boolean;
|
|
15
|
+
};
|
|
16
|
+
export declare const DefaultConfig: {
|
|
17
|
+
translationsPath: string;
|
|
18
|
+
};
|
package/dist/guido.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-v-
|
|
1
|
+
.header-right-slot[data-v-9d879f6f]{gap:16px}[data-v-9d879f6f] .preview-platform-selection-desktop svg,[data-v-9d879f6f] .preview-platform-selection-mobile svg{margin:0 0 0 2px}.guido-editor-wrapper[data-v-c14163ad],.guido-editor-container[data-v-c14163ad]{width:100%;height:100vh}
|
package/dist/library.d.ts
CHANGED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export declare const useCounterStore: import("pinia").StoreDefinition<"counter", {
|
|
2
|
+
count: number;
|
|
3
|
+
}, {
|
|
4
|
+
doubleCount: (state: {
|
|
5
|
+
count: number;
|
|
6
|
+
} & import("pinia").PiniaCustomStateProperties<{
|
|
7
|
+
count: number;
|
|
8
|
+
}>) => number;
|
|
9
|
+
}, {
|
|
10
|
+
increment(): void;
|
|
11
|
+
decrement(): void;
|
|
12
|
+
}>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.f2fcf4d",
|
|
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",
|