@topol.io/editor-vue 0.0.0-beta.1 → 0.0.0-beta.10

package/LICENSE

@@ -0,0 +1,13 @@
+Copyright 2022 Ecomail s.r.o.
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

package/README.md

@@ -28,7 +28,6 @@ For more options see the docs for [TopolOptions configuration](https://topol.io/
 ```js 
 import { TopolEditor } from '@topol.io/editor-vue';
 
-
 const customOptions = {
   authorize: {
     apiKey: "YOUR_API_TOKEN",
@@ -56,25 +55,24 @@ TopolPlugin.save();
 
 | Action | Description |
 | --- | ----------- |
-| TopolPlugin.save() | Saves the content of the editor [more info](https://topol.io/docs#plugin-configuration) |
-| TopolPlugin.load(template) | Loads the provided template [more info](https://topol.io/docs#save-and-load-options) |
-| TopolPlugin.togglePreview() | Toggles editor preview [more info](https://topol.io/docs#preview-mode-on-desktop-and-mobile)|
-| TopolPlugin.togglePreviewSize() | Toggles editor preview size |
-| TopolPlugin.undo() | Undo change in editor [more info](https://topol.io/docs#redo-and-undo)|
-| TopolPlugin.redo() | Redo change in editor [more info](https://topol.io/docs#redo-and-undo)|
-| TopolPlugin.setSavedBlocks(savedblock: ISavedBlock[]) | Sets the saved blocks [more info](https://topol.io/docs#saved-blocks) |
-| TopolPlugin.createNotification(notification: INotification) | Creates editor's notification [more info](https://topol.io/docs#show-custom-notification-in-editor) |
-| TopolPlugin.changeEmailToMobile() | Change email to mobile view [more info](https://topol.io/docs#mobile-first-email-template)|
-| TopolPlugin.changeEmailToDesktop() | Change email to desktop view [more info](https://topol.io/docs#mobile-first-email-template)|
-| TopolPlugin.toggleBlocksAndStructuresVisibility() | Toggle hidden structures visibility for blocks and structures [more info](https://topol.io/docs#mobile-first-email-template)|
-| TopolPlugin.destroy() | Destroys the editor initialization [more info](https://topol.io/docs#working-with-js-frameworks) |
-
-
+| `TopolPlugin.save()` | Saves the content of the editor [more info](https://topol.io/docs#plugin-configuration) |
+| `TopolPlugin.load(template`) | Loads the provided template [more info](https://topol.io/docs#save-and-load-options) |
+| `TopolPlugin.togglePreview()` | Toggles editor preview [more info](https://topol.io/docs#preview-mode-on-desktop-and-mobile)|
+| `TopolPlugin.togglePreviewSize()` | Toggles editor preview size |
+| `TopolPlugin.undo()` | Undo change in editor [more info](https://topol.io/docs#redo-and-undo)|
+| `TopolPlugin.redo()` | Redo change in editor [more info](https://topol.io/docs#redo-and-undo)|
+| `TopolPlugin.setSavedBlocks(savedblock: ISavedBlock[])` | Sets the saved blocks [more info](https://topol.io/docs#saved-blocks) |
+| `TopolPlugin.createNotification(notification: INotification)` | Creates editor's notification [more info](https://topol.io/docs#show-custom-notification-in-editor) |
+| `TopolPlugin.changeEmailToMobile()` | Change email to mobile view [more info](https://topol.io/docs#mobile-first-email-template)|
+| `TopolPlugin.changeEmailToDesktop()` | Change email to desktop view [more info](https://topol.io/docs#mobile-first-email-template)|
+| `TopolPlugin.toggleBlocksAndStructuresVisibility()` | Toggle hidden structures visibility for blocks and structures [more info](https://topol.io/docs#mobile-first-email-template)|
+| `TopolPlugin.destroy()` | Destroys the editor initialization [more info](https://topol.io/docs#working-with-js-frameworks) |
+
+<br>
 ## Editor Events
 
 The callbacks from editor are received as component events.
 
-
 ```html
 <TopolEditor :options="customOptions" @onSave="handleOnSave"></TopolEditor>
 ```
@@ -83,20 +81,21 @@ The callbacks from editor are received as component events.
 
 | Event | Description |
 | --- | ----------- |
-| @onSave | Returns object which contains html and json of the template} [more info](https://topol.io/docs#onsave-and-onsaveandclose) |
-| @onSaveAndClose | Returns object which contains html and json of the template [more info](https://topol.io/docs#onsave-and-onsaveandclose) |
-| @onTestSend | Returns object which contains email, html and json of the template [more info](https://topol.io/docs#on-test-send) |
-| @onOpenFileManager | When user clicks file manager open [more info](https://topol.io/docs#custom-file-manager)|
-| @onLoaded | When editor is fully loaded |
-| @onInit | When editor inits [more info](https://topol.io/docs#custom-file-manager) |
-| @onBlockSave | When user saves block in editor, returns object of type ISavedBlock [more info](https://topol.io/docs#saved-blocks) |
-| @onBlockRemove | When user removes saved block, returns id of saved block to be removed [more info](https://topol.io/docs#saved-blocks) |
-| @onBlockEdit | When user edits saved block, returns id of saved block to be updated [more info](https://topol.io/docs#saved-blocks) |
-| @onUndoChange | When user clicks undo button, retunrs number of steps user undone [more info](https://topol.io/docs#redo-and-undo) |
-| @unRedoChange | When user clicks redo button, retunrs number of steps user redone [more info](https://topol.io/docs#redo-and-undo) |
-| @onPreview | When user switches to preview |
-| @onAlert | When alert appears in editor [more info](https://topol.io/docs#show-custom-notification-in-editor)|
-
+| `@onSave` | Returns object which contains html and json of the template} [more info](https://topol.io/docs#onsave-and-onsaveandclose) |
+| `@onSaveAndClose` | Returns object which contains html and json of the template [more info](https://topol.io/docs#onsave-and-onsaveandclose) |
+| `@onTestSend` | Returns object which contains email, html and json of the template [more info](https://topol.io/docs#on-test-send) |
+| `@onOpenFileManager` | When user clicks file manager open [more info](https://topol.io/docs#custom-file-manager)|
+| `@onLoaded` | When editor is fully loaded |
+| `@onInit` | When editor inits [more info](https://topol.io/docs#custom-file-manager) |
+| `@onBlockSave` | When user saves block in editor, returns object of type ISavedBlock [more info](https://topol.io/docs#saved-blocks) |
+| `@onBlockRemove` | When user removes saved block, returns id of saved block to be removed [more info](https://topol.io/docs#saved-blocks) |
+| `@onBlockEdit` | When user edits saved block, returns id of saved block to be updated [more info](https://topol.io/docs#saved-blocks) |
+| `@onUndoChange` | When user clicks undo button, retunrs number of steps user undone [more info](https://topol.io/docs#redo-and-undo) |
+| `@unRedoChange` | When user clicks redo button, retunrs number of steps user redone [more info](https://topol.io/docs#redo-and-undo) |
+| `@onPreview` | When user switches to preview |
+| `@onAlert` | When alert appears in editor [more info](https://topol.io/docs#show-custom-notification-in-editor)|
+
+<br>
 ## TypeScript
 
 Topol Editor provides full TypeScript integration and exports all necessary types.

package/dist/topol-editor-vue.es.js

@@ -17,12 +17,13 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { defineComponent, onMounted, openBlock, createElementBlock } from "vue";
+import { defineComponent, onMounted, onBeforeUnmount, openBlock, createElementBlock } from "vue";
 import TopolPlugin from "@topol.io/editor";
 export { default as TopolPlugin } from "@topol.io/editor";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
-    options: null
+    options: null,
+    dev: { type: Boolean, default: false }
   },
   emits: ["onSave", "onSaveAndClose", "onTestSend", "onOpenFileManager", "onLoaded", "onBlockSave", "onBlockRemove", "onBlockEdit", "onInit", "onUndoChange", "onRedoChange", "onPreview", "onAlert"],
   setup(__props, { emit }) {
@@ -74,7 +75,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     onMounted(async () => {
       const mergedTopolOptinos = mergeOptions();
-      await TopolPlugin.init(mergedTopolOptinos);
+      await TopolPlugin.init(mergedTopolOptinos, { dev: props.dev });
+    });
+    onBeforeUnmount(() => {
+      TopolPlugin.destroy();
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {

package/dist/topol-editor-vue.umd.js

@@ -1 +1 @@
-var T=Object.defineProperty,B=Object.defineProperties;var _=Object.getOwnPropertyDescriptors;var s=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,o,d)=>o in e?T(e,o,{enumerable:!0,configurable:!0,writable:!0,value:d}):e[o]=d,r=(e,o)=>{for(var d in o||(o={}))C.call(o,d)&&p(e,d,o[d]);if(s)for(var d of s(o))y.call(o,d)&&p(e,d,o[d]);return e},f=(e,o)=>B(e,_(o));(function(e,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue"),require("@topol.io/editor")):typeof define=="function"&&define.amd?define(["exports","vue","@topol.io/editor"],o):(e=typeof globalThis!="undefined"?globalThis:e||self,o(e["topol-editor-vue"]={},e.Vue,e.TopolPlugin))})(this,function(e,o,d){"use strict";function v(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var c=v(d);const g=o.defineComponent({props:{options:null},emits:["onSave","onSaveAndClose","onTestSend","onOpenFileManager","onLoaded","onBlockSave","onBlockRemove","onBlockEdit","onInit","onUndoChange","onRedoChange","onPreview","onAlert"],setup(l,{emit:t}){const h=l,u="topol-editor-id",S=()=>{const a={onSave(n,i){t("onSave",{json:n,html:i})},onSaveAndClose(n,i){t("onSaveAndClose",{json:n,html:i})},onTestSend(n,i,k){t("onTestSend",{email:n,json:i,html:k})},onOpenFileManager(){t("onOpenFileManager")},onLoaded(){t("onLoaded")},onBlockSave(n){t("onBlockSave",n)},onBlockRemove(n){t("onBlockRemove",n)},onBlockEdit(n){t("onBlockEdit",n)},onInit(){t("onInit")},onUndoChange(n){t("onUndoChange",n)},onRedoChange(n){t("onRedoChange",n)},onPreview(n){t("onPreview",n)},onAlert(n){t("onAlert",n)}};return f(r({id:"#"+u},h.options),{callbacks:r({},a)})};return o.onMounted(async()=>{const a=S();await c.default.init(a)}),(a,n)=>(o.openBlock(),o.createElementBlock("div",{id:u,style:{position:"absolute",width:"100%",height:"100vh"}}))}});Object.defineProperty(e,"TopolPlugin",{enumerable:!0,get:function(){return c.default}}),e.TopolEditor=g,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"});
+var B=Object.defineProperty,T=Object.defineProperties;var y=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var _=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var f=(e,o,d)=>o in e?B(e,o,{enumerable:!0,configurable:!0,writable:!0,value:d}):e[o]=d,u=(e,o)=>{for(var d in o||(o={}))_.call(o,d)&&f(e,d,o[d]);if(p)for(var d of p(o))C.call(o,d)&&f(e,d,o[d]);return e},v=(e,o)=>T(e,y(o));(function(e,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue"),require("@topol.io/editor")):typeof define=="function"&&define.amd?define(["exports","vue","@topol.io/editor"],o):(e=typeof globalThis!="undefined"?globalThis:e||self,o(e["topol-editor-vue"]={},e.Vue,e.TopolPlugin))})(this,function(e,o,d){"use strict";function g(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var r=g(d);const h=o.defineComponent({props:{options:null,dev:{type:Boolean,default:!1}},emits:["onSave","onSaveAndClose","onTestSend","onOpenFileManager","onLoaded","onBlockSave","onBlockRemove","onBlockEdit","onInit","onUndoChange","onRedoChange","onPreview","onAlert"],setup(l,{emit:t}){const c=l,s="topol-editor-id",S=()=>{const a={onSave(n,i){t("onSave",{json:n,html:i})},onSaveAndClose(n,i){t("onSaveAndClose",{json:n,html:i})},onTestSend(n,i,k){t("onTestSend",{email:n,json:i,html:k})},onOpenFileManager(){t("onOpenFileManager")},onLoaded(){t("onLoaded")},onBlockSave(n){t("onBlockSave",n)},onBlockRemove(n){t("onBlockRemove",n)},onBlockEdit(n){t("onBlockEdit",n)},onInit(){t("onInit")},onUndoChange(n){t("onUndoChange",n)},onRedoChange(n){t("onRedoChange",n)},onPreview(n){t("onPreview",n)},onAlert(n){t("onAlert",n)}};return v(u({id:"#"+s},c.options),{callbacks:u({},a)})};return o.onMounted(async()=>{const a=S();await r.default.init(a,{dev:c.dev})}),o.onBeforeUnmount(()=>{r.default.destroy()}),(a,n)=>(o.openBlock(),o.createElementBlock("div",{id:s,style:{position:"absolute",width:"100%",height:"100vh"}}))}});Object.defineProperty(e,"TopolPlugin",{enumerable:!0,get:function(){return r.default}}),e.TopolEditor=h,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"});

package/dist/types/src/entry.d.ts

@@ -1,6 +1,6 @@
 import type IVueTopolOptions from '../types/IVueTopolOptions';
-import type INotification from '../types/Notification/INotification';
-import type ISavedBlock from '../types/SavedBlock/ISavedBlock';
+import type { INotification } from '@topol.io/editor';
+import type { ISavedBlock } from '@topol.io/editor';
 export { default as TopolEditor } from './TopolEditor.vue';
 export { default as TopolPlugin } from '@topol.io/editor';
 export { IVueTopolOptions as ITopolOptions };

package/dist/types/types/IVueTopolOptions.d.ts

@@ -1,10 +1,4 @@
-import { IAPI } from "./API/API";
-import ISavedBlock from "./SavedBlock/ISavedBlock";
-import IMergeTagGroup from "./MergeTag/IMergeTagGroup";
-import IContentBlockOptions from "./ContentBlock/IContentBlockOptions";
-import ITheme from "./Theme/ITheme";
-import IAuthHeaderConfig from "./AuthHeaderConfig/IAuthHeaderConfig";
-import IFont from "./Font/IFont";
+import { ISavedBlock, IMergeTagGroup, IContentBlockOptions, ITheme, IAuthHeaderConfig, IFont, IAPI } from "@topol.io/editor";
 export default interface IVueOptions {
     authorize: {
         apiKey: string;

package/package.json

@@ -1,17 +1,20 @@
 {
   "name": "@topol.io/editor-vue",
-  "description": "Vue.js integration for Topol Editor.",
+  "description": "Official Vue.js package for Topol Editor.",
   "keywords": [
     "plugin",
     "editor",
     "email",
     "topol",
-    "topol.io"
+    "topol.io",
+    "topol-vue",
+    "email-vue",
+    "email templates"
   ],
   "author": "Topol.io",
-  "homepage": "https://topol.io/",
+  "homepage": "https://topol.io",
   "license": "Apache-2.0",
-  "version": "0.0.0-beta.1",
+  "version": "0.0.0-beta.10",
   "files": [
     "dist"
   ],
@@ -28,21 +31,21 @@
     "dev": "vite",
     "build": "vite build && yarn run build:types",
     "preview": "vite preview",
-    "build:types": "vue-tsc"
+    "build:types": "vue-tsc -p tsconfig.prod.json"
   },
   "dependencies": {
-    "@topol.io/editor": "^0.0.0-alfa.5"
+    "@topol.io/editor": "^0.0.0-alfa.14"
   },
   "peerDependencies": {
     "vue": "^3.2.25"
   },
   "devDependencies": {
-    "@types/node": "^17.0.13",
+    "@types/node": "^17.0.15",
     "@vitejs/plugin-vue": "^2.0.0",
     "typescript": "^4.4.4",
     "vite": "^2.7.2",
-    "vue": "^3.2.25",
-    "vue-tsc": "^0.31.1"
+    "vue": "^3.2.30",
+    "vue-tsc": "^0.31.2"
   },
   "publishConfig": {
     "access": "public"

package/dist/types/src/TopolEditor.vue.d.ts

@@ -1,78 +0,0 @@
-import IVueOptions from "../types/IVueTopolOptions";
-import ISavedBlock from "../types/SavedBlock/ISavedBlock";
-import INotification from "../types/Notification/INotification";
-declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
-    options: IVueOptions;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    onSave: (payload_0: {
-        json: unknown;
-        html: unknown;
-    }) => void;
-} & {
-    onSaveAndClose: (payload_0: {
-        json: unknown;
-        html: unknown;
-    }) => void;
-} & {
-    onTestSend: (payload_0: {
-        email: string;
-        json: unknown;
-        html: unknown;
-    }) => void;
-} & {
-    onOpenFileManager: () => void;
-} & {
-    onLoaded: () => void;
-} & {
-    onBlockSave: (block: ISavedBlock) => void;
-} & {
-    onBlockRemove: (blockId: number) => void;
-} & {
-    onBlockEdit: (blockId: number) => void;
-} & {
-    onInit: () => void;
-} & {
-    onUndoChange: (count: number) => void;
-} & {
-    onRedoChange: (count: number) => void;
-} & {
-    onPreview: (html: unknown) => void;
-} & {
-    onAlert: (notification: INotification) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
-    options: IVueOptions;
-}>>> & {
-    onOnSave?: ((args_0: {
-        json: unknown;
-        html: unknown;
-    }) => any) | undefined;
-    onOnSaveAndClose?: ((args_0: {
-        json: unknown;
-        html: unknown;
-    }) => any) | undefined;
-    onOnTestSend?: ((args_0: {
-        email: string;
-        json: unknown;
-        html: unknown;
-    }) => any) | undefined;
-    onOnOpenFileManager?: (() => any) | undefined;
-    onOnLoaded?: (() => any) | undefined;
-    onOnBlockSave?: ((block: ISavedBlock) => any) | undefined;
-    onOnBlockRemove?: ((blockId: number) => any) | undefined;
-    onOnBlockEdit?: ((blockId: number) => any) | undefined;
-    onOnInit?: (() => any) | undefined;
-    onOnUndoChange?: ((count: number) => any) | undefined;
-    onOnRedoChange?: ((count: number) => any) | undefined;
-    onOnPreview?: ((html: unknown) => any) | undefined;
-    onOnAlert?: ((notification: INotification) => any) | undefined;
-}, {}>;
-export default _default;
-declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-declare type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/types/types/API/API.d.ts

@@ -1,21 +0,0 @@
-export interface IAPI {
-    GET_AUTOSAVE: string;
-    AUTOSAVES: string;
-    LOAD: string;
-    SAVE: string | null;
-    AUTOSAVE: string;
-    PREVIEW: string;
-    FEEDS: string;
-    PRODUCTS: string;
-    IMAGE_UPLOAD: string;
-    FOLDERS: string;
-    IMAGE_EDITOR_UPLOAD: string | null;
-    TEST_EMAIL: string;
-}
-export interface ILockedAPI {
-    GIPHY_API_KEY: string;
-    GIPHY_SEARCH: string;
-    AUTHORIZE: string;
-    GCS_SIGNED_URL: string;
-    SAVE_SERVER: string;
-}

package/dist/types/types/AuthHeaderConfig/IAuthHeaderConfig.d.ts

@@ -1,3 +0,0 @@
-export default interface AuthHeaderConfig {
-    [key: string]: string;
-}

package/dist/types/types/ContentBlock/IContentBlockOptions.d.ts

@@ -1,5 +0,0 @@
-export default interface IContentBlockOptions {
-    disabled?: boolean;
-    disabledText?: string;
-    hidden?: boolean;
-}

package/dist/types/types/Font/IFont.d.ts

@@ -1,5 +0,0 @@
-export default interface IFont {
-    label: string;
-    style: string;
-    url?: string;
-}

package/dist/types/types/MergeTag/IMergeTag.d.ts

@@ -1,5 +0,0 @@
-export default interface IMergeTag {
-    value: string;
-    text: string;
-    label: string;
-}

package/dist/types/types/MergeTag/IMergeTagGroup.d.ts

@@ -1,5 +0,0 @@
-import IMergeTag from "./IMergeTag";
-export default interface IMergeTagGroup {
-    name: string;
-    items: Array<IMergeTag | IMergeTagGroup>;
-}

package/dist/types/types/Notification/INotification.d.ts

@@ -1,7 +0,0 @@
-export default interface INotification {
-    title: string;
-    text: string;
-    expectSideEffect?: boolean;
-    persistent?: boolean;
-    type: "info" | "error" | "success";
-}

package/dist/types/types/SavedBlock/ISavedBlock.d.ts

@@ -1,5 +0,0 @@
-export default interface ISavedBlock {
-    id: number;
-    name: string;
-    definition: Array<Object>;
-}

package/dist/types/types/Theme/ITheme.d.ts

@@ -1,33 +0,0 @@
-export default interface ITheme {
-    preset: "light" | "dark";
-    borderRadius?: {
-        small?: string;
-        large?: string;
-    };
-    colors: {
-        "900"?: string;
-        "800"?: string;
-        "700"?: string;
-        "600"?: string;
-        "500"?: string;
-        "450"?: string;
-        "400"?: string;
-        "350"?: string;
-        "300"?: string;
-        "200"?: string;
-        "150"?: string;
-        "100"?: string;
-        white?: string;
-        primary?: string;
-        "primary-light"?: string;
-        "primary-dark"?: string;
-        secondary?: string;
-        "secondary-light"?: string;
-        error?: string;
-        "error-light"?: string;
-        success?: string;
-        "success-light"?: string;
-        active?: string;
-        "active-light"?: string;
-    };
-}