@topol.io/editor 0.0.0-alfa.1

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 (22) hide show
  1. package/.eslintrc.js +18 -0
  2. package/.prettierrc.json +1 -0
  3. package/.vscode/settings.json +3 -0
  4. package/README +1 -0
  5. package/example/index.html +18 -0
  6. package/example/index.ts +20 -0
  7. package/package.json +28 -0
  8. package/src/main.ts +101 -0
  9. package/src/vite-env.d.ts +1 -0
  10. package/tsconfig.json +19 -0
  11. package/types/API/API.ts +22 -0
  12. package/types/AuthHeaderConfig/IAuthHeaderConfig.ts +3 -0
  13. package/types/ContentBlock/IContentBlockOptions.ts +6 -0
  14. package/types/Font/IFont.ts +5 -0
  15. package/types/ITopolOptions.ts +58 -0
  16. package/types/ITopolPlugin.ts +20 -0
  17. package/types/MergeTag/IMergeTag.ts +5 -0
  18. package/types/MergeTag/IMergeTagGroup.ts +6 -0
  19. package/types/Notification/INotification.ts +7 -0
  20. package/types/SavedBlock/ISavedBlock.ts +5 -0
  21. package/types/Theme/ITheme.ts +34 -0
  22. package/vite.config.ts +21 -0
package/.eslintrc.js ADDED
@@ -0,0 +1,18 @@
1
+ // eslint-disable-next-line no-undef
2
+ module.exports = {
3
+ env: {
4
+ browser: true,
5
+ es2021: true,
6
+ },
7
+ extends: [
8
+ "eslint:recommended",
9
+ "plugin:@typescript-eslint/recommended",
10
+ "prettier",
11
+ ],
12
+ parser: "@typescript-eslint/parser",
13
+ parserOptions: {
14
+ ecmaVersion: "latest",
15
+ sourceType: "module",
16
+ },
17
+ plugins: ["@typescript-eslint"],
18
+ };
package/.prettierrc.json ADDED
@@ -0,0 +1 @@
1
+ {}
package/.vscode/settings.json ADDED
@@ -0,0 +1,3 @@
1
+ {
2
+ "editor.formatOnSave": true
3
+ }
package/README ADDED
@@ -0,0 +1 @@
1
+ # Topol Plugin NPM package
package/example/index.html ADDED
@@ -0,0 +1,18 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Topol Plugin Example</title>
7
+
8
+ <style>
9
+ body {
10
+ margin: 0;
11
+ }
12
+ </style>
13
+ </head>
14
+ <body>
15
+ <div id="app" style="position: absolute; width: 100%; height: 100%"></div>
16
+ <script type="module" src="./index.ts"></script>
17
+ </body>
18
+ </html>
package/example/index.ts ADDED
@@ -0,0 +1,20 @@
1
+ import createTopolPlugin from "../src/main";
2
+ import TopolOptions from "../types/ITopolOptions";
3
+
4
+ const TOPOL_OPTIONS: TopolOptions = {
5
+ id: "#app",
6
+ authorize: {
7
+ apiKey: "5vse7PL21Ec17RcFEJACDHodtclmaTDZrh3DpvHgxtuNzuJOL7ALV3UCksA6",
8
+ userId: "someId",
9
+ },
10
+ callbacks: {
11
+ onSave(json, html) {
12
+ console.log(html);
13
+ console.log(json);
14
+ },
15
+ },
16
+ };
17
+
18
+ const topolPlugin = createTopolPlugin(TOPOL_OPTIONS);
19
+
20
+ topolPlugin.init();
package/package.json ADDED
@@ -0,0 +1,28 @@
1
+ {
2
+ "name": "@topol.io/editor",
3
+ "version": "0.0.0-alfa.1",
4
+ "scripts": {
5
+ "dev": "vite",
6
+ "build": "tsc && vite build && yarn run build:types",
7
+ "lint": "eslint --config '.eslintrc.js' ./**/*.ts --fix",
8
+ "format": "prettier --write .",
9
+ "build:types": "npm-dts generate --entry ./src/main --output ./dist/topol-plugin.d.ts"
10
+ },
11
+ "devDependencies": {
12
+ "@types/node": "^17.0.12",
13
+ "@typescript-eslint/eslint-plugin": "^5.10.1",
14
+ "@typescript-eslint/parser": "^5.10.1",
15
+ "eslint": "^8.7.0",
16
+ "eslint-config-prettier": "^8.3.0",
17
+ "npm-dts": "^1.3.10",
18
+ "prettier": "2.5.1",
19
+ "typescript": "^4.4.4",
20
+ "vite": "^2.7.2"
21
+ },
22
+ "dependencies": {
23
+ "load-script": "^2.0.0"
24
+ },
25
+ "publishConfig": {
26
+ "access": "public"
27
+ }
28
+ }
package/src/main.ts ADDED
@@ -0,0 +1,101 @@
1
+ import loadScript from "load-script";
2
+ import ITopolOptions from "../types/ITopolOptions";
3
+ import ITopolPlugin from "../types/ITopolPlugin";
4
+ import INotification from "../types/Notification/INotification";
5
+ import ISavedBlock from "../types/SavedBlock/ISavedBlock";
6
+
7
+ const TOPOL_URL =
8
+ "https://d5aoblv5p04cg.cloudfront.net/editor-3/loader/build.js";
9
+
10
+ declare global {
11
+ interface Window {
12
+ TopolPlugin: ITopolPlugin;
13
+ }
14
+ }
15
+
16
+ const createTopolPlugin = (options: ITopolOptions) => {
17
+ const init = (): Promise<boolean | string> => {
18
+ return new Promise((resolve, reject) => {
19
+ loadScript(TOPOL_URL, (err) => {
20
+ if (err !== null) {
21
+ reject(err);
22
+ }
23
+
24
+ window.TopolPlugin.init(options);
25
+
26
+ resolve(true);
27
+ });
28
+ });
29
+ };
30
+
31
+ const save = () => {
32
+ window.TopolPlugin.save();
33
+ };
34
+
35
+ const load = (json: unknown) => {
36
+ window.TopolPlugin.load(json);
37
+ };
38
+
39
+ const togglePreview = () => {
40
+ window.TopolPlugin.togglePreview();
41
+ };
42
+
43
+ const togglePreviewSize = () => {
44
+ window.TopolPlugin.togglePreviewSize();
45
+ };
46
+
47
+ const chooseFile = (url: string) => {
48
+ window.TopolPlugin.chooseFile(url);
49
+ };
50
+
51
+ const undo = () => {
52
+ window.TopolPlugin.undo();
53
+ };
54
+
55
+ const redo = () => {
56
+ window.TopolPlugin.redo();
57
+ };
58
+
59
+ const setSavedBlocks = (savedBlocks: ISavedBlock[]) => {
60
+ window.TopolPlugin.setSavedBlocks(savedBlocks);
61
+ };
62
+
63
+ const createNotification = (notification: INotification) => {
64
+ window.TopolPlugin.createNotification(notification);
65
+ };
66
+
67
+ const changeEmailToMobile = () => {
68
+ window.TopolPlugin.changeEmailToMobile();
69
+ };
70
+
71
+ const changeEmailToDesktop = () => {
72
+ window.TopolPlugin.changeEmailToDesktop();
73
+ };
74
+
75
+ const toggleBlocksAndStructuresVisibility = () => {
76
+ window.TopolPlugin.toggleBlocksAndStructuresVisibility();
77
+ };
78
+
79
+ const destroy = () => {
80
+ window.TopolPlugin.destroy();
81
+ };
82
+
83
+ return {
84
+ init,
85
+ save,
86
+ load,
87
+ togglePreview,
88
+ togglePreviewSize,
89
+ chooseFile,
90
+ undo,
91
+ redo,
92
+ setSavedBlocks,
93
+ createNotification,
94
+ changeEmailToMobile,
95
+ changeEmailToDesktop,
96
+ toggleBlocksAndStructuresVisibility,
97
+ destroy,
98
+ };
99
+ };
100
+
101
+ export default createTopolPlugin;
package/src/vite-env.d.ts ADDED
@@ -0,0 +1 @@
1
+ /// <reference types="vite/client" />
package/tsconfig.json ADDED
@@ -0,0 +1,19 @@
1
+ {
2
+ "compilerOptions": {
3
+ "target": "esnext",
4
+ "useDefineForClassFields": true,
5
+ "module": "esnext",
6
+ "moduleResolution": "node",
7
+ "declaration": false,
8
+ "strict": true,
9
+ "jsx": "preserve",
10
+ "sourceMap": false,
11
+ "resolveJsonModule": true,
12
+ "declarationMap": false,
13
+ "esModuleInterop": false,
14
+ "inlineSourceMap": false,
15
+ "lib": ["esnext", "dom"],
16
+ "types": ["node"]
17
+ },
18
+ "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx"]
19
+ }
package/types/API/API.ts ADDED
@@ -0,0 +1,22 @@
1
+ export interface IAPI {
2
+ GET_AUTOSAVE: string;
3
+ AUTOSAVES: string;
4
+ LOAD: string;
5
+ SAVE: string | null;
6
+ AUTOSAVE: string;
7
+ PREVIEW: string;
8
+ FEEDS: string;
9
+ PRODUCTS: string;
10
+ IMAGE_UPLOAD: string;
11
+ FOLDERS: string;
12
+ IMAGE_EDITOR_UPLOAD: string | null;
13
+ TEST_EMAIL: string;
14
+ }
15
+
16
+ export interface ILockedAPI {
17
+ GIPHY_API_KEY: string;
18
+ GIPHY_SEARCH: string;
19
+ AUTHORIZE: string;
20
+ GCS_SIGNED_URL: string;
21
+ SAVE_SERVER: string;
22
+ }
package/types/AuthHeaderConfig/IAuthHeaderConfig.ts ADDED
@@ -0,0 +1,3 @@
1
+ export default interface AuthHeaderConfig {
2
+ [key: string]: string;
3
+ }
package/types/ContentBlock/IContentBlockOptions.ts ADDED
@@ -0,0 +1,6 @@
1
+ export default interface IContentBlockOptions {
2
+ disabled?: boolean;
3
+ disabledText?: string;
4
+ hidden?: boolean;
5
+ // customBlockName?: string
6
+ }
package/types/Font/IFont.ts ADDED
@@ -0,0 +1,5 @@
1
+ export default interface IFont {
2
+ label: string;
3
+ style: string;
4
+ url?: string;
5
+ }
package/types/ITopolOptions.ts ADDED
@@ -0,0 +1,58 @@
1
+ import { IAPI } from "./API/API";
2
+ import ISavedBlock from "./SavedBlock/ISavedBlock";
3
+ import INotification from "./Notification/INotification";
4
+ import IMergeTagGroup from "./MergeTag/IMergeTagGroup";
5
+ import IContentBlockOptions from "./ContentBlock/IContentBlockOptions";
6
+ import ITheme from "./Theme/ITheme";
7
+ import IAuthHeaderConfig from "./AuthHeaderConfig/IAuthHeaderConfig";
8
+ import IFont from "./Font/IFont";
9
+
10
+ export default interface ITopolOptions {
11
+ id: string;
12
+ authorize: {
13
+ apiKey: string;
14
+ userId: string | number;
15
+ };
16
+ templateId?: number;
17
+ title?: string;
18
+ removeTopBar?: boolean;
19
+ topBarOptions?: Array<string>;
20
+ mainMenuAlign?: "left" | "right";
21
+ disableAlerts?: boolean;
22
+ customFileManager?: boolean;
23
+ language?: string;
24
+ light?: boolean;
25
+ theme?: ITheme;
26
+ hideSettingsTab?: boolean;
27
+ imageEditor?: boolean;
28
+ premadeBlocks?: unknown | boolean;
29
+ savedBlocks?: Array<ISavedBlock> | boolean;
30
+ mergeTags?: Array<IMergeTagGroup>;
31
+ enableAutosaves?: boolean;
32
+ htmlMinified?: boolean;
33
+ apiAuthorizationHeader?: IAuthHeaderConfig | string;
34
+ contentBlocks?: IContentBlockOptions[];
35
+ callbacks: {
36
+ onSave?(json: unknown, html: unknown): void;
37
+ onSaveAndClose?(json: unknown, html: unknown): void;
38
+ onTestSend?(email: string, json: unknown, html: unknown): void;
39
+ onOpenFileManager?(): void;
40
+ onLoaded?(): void;
41
+ onBlockSave?(block: ISavedBlock): void;
42
+ onBlockRemove?(blockId: number): void;
43
+ onBlockEdit?(blockId: number): void;
44
+ onInit?(): void;
45
+ onUndoChange?(count: number): void;
46
+ onRedoChange?(count: number): void;
47
+ onPreview?(html: unknown): void;
48
+ onAlert?(notification: INotification): void;
49
+ };
50
+ api?: IAPI;
51
+ mobileFirstEnabled?: boolean;
52
+ fonts?: Array<IFont>;
53
+ tinyConfig?: unknown;
54
+ fontSizes?: Array<number>;
55
+ colors?: Array<string>;
56
+ googleApiKey?: string;
57
+ role?: "manager" | "editor" | "reader";
58
+ }
package/types/ITopolPlugin.ts ADDED
@@ -0,0 +1,20 @@
1
+ import INotification from "./Notification/INotification";
2
+ import ISavedBlock from "./SavedBlock/ISavedBlock";
3
+ import ITopolOptions from "./ITopolOptions";
4
+
5
+ export default interface ITopolPlugin {
6
+ init: (topolOptions: ITopolOptions) => void;
7
+ save: () => void;
8
+ load: (json: unknown) => void;
9
+ togglePreview: () => void;
10
+ togglePreviewSize: () => void;
11
+ chooseFile: (url: string) => void;
12
+ undo: () => void;
13
+ redo: () => void;
14
+ setSavedBlocks: (savedBlocks: ISavedBlock[]) => void;
15
+ createNotification: (notification: INotification) => void;
16
+ changeEmailToMobile: () => void;
17
+ changeEmailToDesktop: () => void;
18
+ toggleBlocksAndStructuresVisibility: () => void;
19
+ destroy: () => void;
20
+ }
package/types/MergeTag/IMergeTag.ts ADDED
@@ -0,0 +1,5 @@
1
+ export default interface IMergeTag {
2
+ value: string;
3
+ text: string;
4
+ label: string;
5
+ }
package/types/MergeTag/IMergeTagGroup.ts ADDED
@@ -0,0 +1,6 @@
1
+ import IMergeTag from "./IMergeTag";
2
+
3
+ export default interface IMergeTagGroup {
4
+ name: string;
5
+ items: Array<IMergeTag | IMergeTagGroup>;
6
+ }
package/types/Notification/INotification.ts ADDED
@@ -0,0 +1,7 @@
1
+ export default interface INotification {
2
+ title: string;
3
+ text: string;
4
+ expectSideEffect?: boolean;
5
+ persistent?: boolean;
6
+ type: "info" | "error" | "success";
7
+ }
package/types/SavedBlock/ISavedBlock.ts ADDED
@@ -0,0 +1,5 @@
1
+ export default interface ISavedBlock {
2
+ id: number;
3
+ name: string;
4
+ definition: Array<Object>;
5
+ }
package/types/Theme/ITheme.ts ADDED
@@ -0,0 +1,34 @@
1
+ export default interface ITheme {
2
+ preset: "light" | "dark";
3
+ borderRadius?: {
4
+ small?: string;
5
+ large?: string;
6
+ };
7
+ colors: {
8
+ "900"?: string;
9
+ "800"?: string;
10
+ "700"?: string;
11
+ "600"?: string;
12
+ "500"?: string;
13
+ "450"?: string;
14
+ "400"?: string;
15
+ "350"?: string;
16
+ "300"?: string;
17
+ "200"?: string;
18
+ "150"?: string; // light only
19
+ "100"?: string; // light only
20
+
21
+ white?: string;
22
+ primary?: string;
23
+ "primary-light"?: string;
24
+ "primary-dark"?: string;
25
+ secondary?: string;
26
+ "secondary-light"?: string;
27
+ error?: string;
28
+ "error-light"?: string;
29
+ success?: string;
30
+ "success-light"?: string;
31
+ active?: string;
32
+ "active-light"?: string;
33
+ };
34
+ }
package/vite.config.ts ADDED
@@ -0,0 +1,21 @@
1
+ import { defineConfig } from "vite";
2
+ import { resolve } from "path";
3
+
4
+ // https://vitejs.dev/config/
5
+ export default defineConfig(({ mode }) => {
6
+ if (mode === "development") {
7
+ return {
8
+ root: resolve(__dirname, "example"),
9
+ };
10
+ } else {
11
+ return {
12
+ build: {
13
+ lib: {
14
+ entry: resolve(__dirname, "src/main.ts"),
15
+ name: "topol-plugin",
16
+ fileName: (format) => `topol-plugin.${format}.js`,
17
+ },
18
+ },
19
+ };
20
+ }
21
+ });