easy-email-pro-editor 0.2.0

package/lib/typings/typings/custom-types.d.ts

@@ -0,0 +1,43 @@
+import { BaseEditor, Path, NodeEntry } from "slate";
+import { ReactEditor } from "slate-react";
+import { Element, TextNode } from "easy-email-pro-core";
+import { HistoryEditor } from "slate-history";
+export interface BeacasSlateEditor {
+    splitColumns(options: {
+        path: Path;
+    }): void;
+    insertNewLine(options?: {
+        path?: Path;
+    }): void;
+    insertNewRow(options?: {
+        path?: Path;
+    }): void;
+    removeNode(options?: {
+        path?: Path;
+    }): void;
+    filterEmpty(options: {
+        path: Path;
+    }): void;
+    insertMergetag(options: {
+        path?: Path;
+        mergetag: string;
+    }): void;
+    replaceNode(options: {
+        path: Path;
+        node: Partial<Element>;
+    }): void;
+    moveNode(options: {
+        at: Path;
+        to: Path;
+    }): void;
+    getSelectionRect(): null | DOMRect;
+    getSelectedBlockElement(): null | NodeEntry<Element>;
+}
+export type CustomSlateEditor = BaseEditor & ReactEditor & HistoryEditor & BeacasSlateEditor;
+declare module "slate" {
+    interface CustomTypes {
+        Editor: CustomSlateEditor;
+        Element: Element;
+        Text: TextNode;
+    }
+}

package/lib/typings/typings/index.d.ts

@@ -0,0 +1,77 @@
+/// <reference types="react" />
+import { MergetagItem } from "../components/BeacasEditorProvider";
+import { TextFormat } from "../constants";
+import type { Element, ExtendedType, MergetagElement, PageElement } from "easy-email-pro-core";
+import { BaseSelection, Path } from "slate";
+import { EditableProps } from "slate-react/dist/components/editable";
+import { CustomSlateEditor } from "./custom-types";
+export * from "./custom-types";
+export interface CustomEditorTypes {
+    [key: string]: unknown;
+}
+export interface BasicEmailTemplate {
+    content: PageElement;
+    subject: string;
+}
+export interface BasicEditorProps extends Partial<Pick<EditableProps, "onDOMBeforeInput" | "onKeyDown">> {
+    onUpload?: (blob: Blob) => Promise<string>;
+    onSubmit: (values: EmailTemplate) => void;
+    onPageChange?: (content: EmailTemplate["content"], editor: CustomSlateEditor) => void;
+    fontList?: {
+        value: string;
+        label: string;
+    }[];
+    fontSizeList?: string[];
+    localeData?: Record<string, string>;
+    initialValues: EmailTemplate;
+    children: React.ReactNode;
+    loading?: React.ReactNode;
+    editor: CustomSlateEditor;
+    footer?: React.ReactNode;
+    ElementPlaceholder?: React.FC<{
+        element: Element;
+        isSelected: boolean;
+        isHover: boolean;
+        nodeElement: HTMLElement;
+        path: Path;
+    }>;
+    ElementHover?: React.FC<{
+        element: Element;
+        isSelected: boolean;
+        nodeElement: HTMLElement;
+        path: Path;
+    }>;
+    ElementSelected?: React.FC<{
+        element: Element;
+        isHover: boolean;
+        nodeElement: HTMLElement;
+        path: Path;
+    }>;
+    MergetagPopover?: React.FC<{
+        element: MergetagElement;
+        onSave: (val?: string) => void;
+    }>;
+    interactiveStyle?: {
+        hoverColor?: string;
+        selectedColor?: string;
+        dragColor?: string;
+    };
+    withEnhanceEditor?: (editor: CustomSlateEditor, props: EmailEditorProps) => CustomSlateEditor;
+    hoveringToolbar?: {
+        prefix?: React.ReactNode;
+        list?: (params: {
+            isCollapsed?: boolean;
+            selection: BaseSelection;
+        }) => Array<TextFormat>;
+        subfix?: React.ReactNode;
+    };
+    mergetags?: MergetagItem[];
+    mergetagsData?: Record<string, any>;
+    newLineWithBr?: boolean;
+    universalElementSetting?: {
+        elements: Record<string, Element>;
+    };
+    readOnly?: boolean;
+}
+export type EmailTemplate = ExtendedType<"EmailTemplate", BasicEmailTemplate, CustomEditorTypes>;
+export type EmailEditorProps = ExtendedType<"EmailEditorProps", BasicEditorProps, CustomEditorTypes>;

package/lib/typings/utils/Uploader.d.ts

@@ -0,0 +1,35 @@
+interface Options {
+    limit?: number;
+    accept?: string;
+    minSize?: number;
+    maxSize?: number;
+    autoUpload?: boolean;
+}
+export type UploadItem = {
+    idx: string;
+    url: string;
+    status: 'pending' | 'done' | 'error';
+};
+export type UploaderEventMap = {
+    start: (data: UploadItem[]) => void;
+    progress: (data: UploadItem[]) => void;
+    end: (data: UploadItem[]) => void;
+};
+export type UploaderServer = (file: File) => Promise<string>;
+export declare class Uploader {
+    private options;
+    private el;
+    private uploadServer;
+    private handler;
+    constructor(uploadServer: UploaderServer, options: Options);
+    private createInput;
+    uploadFiles(files: File[]): Promise<void>;
+    private uploadFile;
+    private checkFile;
+    private checkTypes;
+    private checkSize;
+    chooseFile(): void;
+    on<K extends keyof UploaderEventMap>(event: K, fn: UploaderEventMap[K]): void;
+    off<K extends keyof UploaderEventMap>(event: K, fn: UploaderEventMap[K]): void;
+}
+export {};

package/lib/typings/utils/classnames.d.ts

@@ -0,0 +1 @@
+export declare function classnames(...rest: any[]): string;

package/lib/typings/utils/conditionalTag.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare const startConditionalTag = "<!--[if mso | IE]>";
+export declare const startMsoConditionalTag = "<!--[if mso]>";
+export declare const endConditionalTag = "<![endif]-->";
+export declare const startNegationConditionalTag = "<!--[if !mso | IE]><!-->";
+export declare const startMsoNegationConditionalTag = "<!--[if !mso><!-->";
+export declare const endNegationConditionalTag = "<!--<![endif]-->";
+export default function conditionalTag(content: string, negation?: boolean): string;
+export declare function msoConditionalTag(content: React.ReactNode, negation?: boolean): JSX.Element;

package/lib/typings/utils/fonts.d.ts

@@ -0,0 +1 @@
+export declare function buildFontsTags(content: string, inlineStyle: string[], fonts?: {}): string;

package/lib/typings/utils/formatAttributes.d.ts

@@ -0,0 +1 @@
+export declare const formatAttributes: (attributes: Record<string, string>, allowedAttributes: Record<string, string>) => {};

package/lib/typings/utils/generateMediaQuery.d.ts

@@ -0,0 +1,6 @@
+export declare const generateMediaQuery: (className: string, { parsedWidth, unit }: {
+    parsedWidth: string | number;
+    unit: string;
+}) => {
+    [x: string]: string;
+};

package/lib/typings/utils/getMediaQuery.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare function getMediaQuery(className: string, { parsedWidth, unit }: {
+    parsedWidth: string | number;
+    unit: string;
+}, breakpoint: string): JSX.Element;

package/lib/typings/utils/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./isDOMElement";
+export * from "./classnames";
+export * from "./isFormatActive";
+export * from "./toggleFormat";
+export * from "./types";

package/lib/typings/utils/isDOMElement.d.ts

@@ -0,0 +1,3 @@
+export declare const isDOMElement: (value: any) => value is HTMLElement;
+export declare const isDOMNode: (value: any) => value is Node;
+export declare const getDefaultView: (value: any) => Window | null;

package/lib/typings/utils/isFormatActive.d.ts

@@ -0,0 +1,3 @@
+import { CustomSlateEditor } from "../typings";
+import { TextFormat } from "../constants";
+export declare const isFormatActive: (editor: CustomSlateEditor, format: TextFormat) => boolean;

package/lib/typings/utils/makeLowerBreakpoint.d.ts

@@ -0,0 +1 @@
+export declare function makeLowerBreakpoint(breakpoint: string): string;

package/lib/typings/utils/mediaQueries.d.ts

@@ -0,0 +1 @@
+export default function buildMediaQueriesTags(breakpoint: string, mediaQueries?: Record<string, string>): string;

package/lib/typings/utils/shorthandParser.d.ts

@@ -0,0 +1,2 @@
+export declare function shorthandParser(cssValue: string, direction: string): number;
+export declare function borderParser(border: string): number;

package/lib/typings/utils/suffixCssClasses.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (classes: string, suffix: string) => string;
+export default _default;

package/lib/typings/utils/toggleFormat.d.ts

@@ -0,0 +1,3 @@
+import { TextFormat } from "../constants";
+import { CustomSlateEditor } from "../typings";
+export declare const toggleFormat: (editor: CustomSlateEditor, format: TextFormat) => void;

package/lib/typings/utils/types/boolean.d.ts

@@ -0,0 +1,12 @@
+export declare const matcher: RegExp;
+declare const _default: () => {
+    new (boolean: any): {
+        isValid: () => boolean;
+        matchers: RegExp[];
+        value: any;
+        errorMessage?: string | undefined;
+        getErrorMessage: () => string | undefined;
+        getValue: () => any;
+    };
+};
+export default _default;

package/lib/typings/utils/types/color.d.ts

@@ -0,0 +1,12 @@
+export declare const matcher: RegExp;
+declare const _default: () => {
+    new (color: string): {
+        getValue: () => string;
+        matchers: RegExp[];
+        value: string;
+        errorMessage?: string | undefined;
+        isValid: () => boolean;
+        getErrorMessage: () => string | undefined;
+    };
+};
+export default _default;

package/lib/typings/utils/types/enum.d.ts

@@ -0,0 +1,13 @@
+export declare const matcher: RegExp;
+declare const _default: (params: string) => {
+    new (value: string): {
+        matchers: RegExp[];
+        value: string;
+        errorMessage?: string | undefined;
+        isValid: () => boolean;
+        getErrorMessage: () => string | undefined;
+        getValue: () => string;
+    };
+    errorMessage: string;
+};
+export default _default;

package/lib/typings/utils/types/helpers/colors.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string[];
+export default _default;

package/lib/typings/utils/types/index.d.ts

@@ -0,0 +1,82 @@
+declare const validation: {
+    boolean: {
+        matcher: RegExp;
+        typeConstructor: () => {
+            new (boolean: any): {
+                isValid: () => boolean;
+                matchers: RegExp[];
+                value: any;
+                errorMessage?: string | undefined;
+                getErrorMessage: () => string | undefined;
+                getValue: () => any;
+            };
+        };
+    };
+    enum: {
+        matcher: RegExp;
+        typeConstructor: (params: string) => {
+            new (value: string): {
+                matchers: RegExp[];
+                value: string;
+                errorMessage?: string | undefined;
+                isValid: () => boolean;
+                getErrorMessage: () => string | undefined;
+                getValue: () => string;
+            };
+            errorMessage: string;
+        };
+    };
+    color: {
+        matcher: RegExp;
+        typeConstructor: () => {
+            new (color: string): {
+                getValue: () => string;
+                matchers: RegExp[];
+                value: string;
+                errorMessage?: string | undefined;
+                isValid: () => boolean;
+                getErrorMessage: () => string | undefined;
+            };
+        };
+    };
+    unit: {
+        matcher: RegExp;
+        typeConstructor: (params: string) => {
+            new (value: string): {
+                errorMessage: string;
+                matchers: RegExp[];
+                value: string;
+                isValid: () => boolean;
+                getErrorMessage: () => string | undefined;
+                getValue: () => string;
+            };
+        };
+    };
+    string: {
+        matcher: RegExp;
+        typeConstructor: () => {
+            new (value: string): {
+                matchers: RegExp[];
+                value: string;
+                errorMessage?: string | undefined;
+                isValid: () => boolean;
+                getErrorMessage: () => string | undefined;
+                getValue: () => string;
+            };
+        };
+    };
+    integer: {
+        matcher: RegExp;
+        typeConstructor: () => {
+            new (value: number): {
+                matchers: RegExp[];
+                value: number;
+                errorMessage?: string | undefined;
+                isValid: () => boolean;
+                getErrorMessage: () => string | undefined;
+                getValue: () => number;
+            };
+        };
+    };
+};
+export { validation };

package/lib/typings/utils/types/integer.d.ts

@@ -0,0 +1,12 @@
+export declare const matcher: RegExp;
+declare const _default: () => {
+    new (value: number): {
+        matchers: RegExp[];
+        value: number;
+        errorMessage?: string | undefined;
+        isValid: () => boolean;
+        getErrorMessage: () => string | undefined;
+        getValue: () => number;
+    };
+};
+export default _default;

package/lib/typings/utils/types/string.d.ts

@@ -0,0 +1,12 @@
+export declare const matcher: RegExp;
+declare const _default: () => {
+    new (value: string): {
+        matchers: RegExp[];
+        value: string;
+        errorMessage?: string | undefined;
+        isValid: () => boolean;
+        getErrorMessage: () => string | undefined;
+        getValue: () => string;
+    };
+};
+export default _default;

package/lib/typings/utils/types/type.d.ts

@@ -0,0 +1,11 @@
+export declare const types: any;
+export declare const initializeType: (typeConfig: any) => any;
+export default class Type<T extends string | number | boolean> {
+    matchers: RegExp[];
+    value: T;
+    errorMessage?: string;
+    constructor(value: T);
+    isValid: () => boolean;
+    getErrorMessage: () => string | undefined;
+    getValue: () => T;
+}

package/lib/typings/utils/types/unit.d.ts

@@ -0,0 +1,12 @@
+export declare const matcher: RegExp;
+declare const _default: (params: string) => {
+    new (value: string): {
+        errorMessage: string;
+        matchers: RegExp[];
+        value: string;
+        isValid: () => boolean;
+        getErrorMessage: () => string | undefined;
+        getValue: () => string;
+    };
+};
+export default _default;

package/lib/typings/utils/widthParser.d.ts

@@ -0,0 +1,6 @@
+export declare function widthParser(width: string | number, options?: {
+    parseFloatToInt?: boolean;
+}): {
+    parsedWidth: any;
+    unit: string;
+};

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "easy-email-pro-editor",
+  "version": "0.2.0",
+  "description": "",
+  "files": [
+    "lib"
+  ],
+  "main": "lib/index.js",
+  "types": "lib/typings/index.d.ts",
+  "keywords": [],
+  "author": "",
+  "dependencies": {
+    "axios": "^1.2.2",
+    "color": "^4.2.3",
+    "he": "^1.2.0",
+    "is-hotkey": "^0.2.0",
+    "lodash": "^4.17.21",
+    "overlayscrollbars": "^1.13.2",
+    "overlayscrollbars-react": "^0.3.0",
+    "parse5": "^7.1.2",
+    "react-attr-converter": "^0.3.1"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "scripts": {
+    "build": "vite build && npm run typings",
+    "typings": "tsc --declaration --emitDeclarationOnly --project tsconfig.alias.json && tsc-alias -p tsconfig.alias.json",
+    "lint": "eslint --fix --ext .tsx,.ts src/"
+  }
+}