easy-email-extensions 2.5.2-beta.1 → 3.0.1

package/lib/utils/awaitForElement.d.ts

@@ -1,4 +1,4 @@
-export declare function awaitForElement<T extends HTMLElement>(idx: string): {
-    cancel: () => void;
-    promise: Promise<T>;
-};
+export declare function awaitForElement<T extends HTMLElement>(idx: string): {
+    cancel: () => void;
+    promise: Promise<T>;
+};

package/lib/utils/classnames.d.ts

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

package/package.json

@@ -2,7 +2,7 @@
   "name": "easy-email-extensions",
   "license": "MIT",
   "description": "Email editor",
-  "version": "2.5.2-beta.1",
+  "version": "3.0.1",
   "author": "m-Ryan",
   "repository": {
     "type": "git",
@@ -37,7 +37,6 @@
     "@types/react": "17.0.2",
     "@types/react-dom": "^17.0.11",
     "@vitejs/plugin-react-refresh": "^1.3.6",
-    "antd": "^4.16.13",
     "cross-env": "^7.0.3",
     "lerna": "^4.0.0",
     "less": "^4.1.2",
@@ -53,7 +52,7 @@
     "vite-plugin-style-import": "^1.3.0"
   },
   "dependencies": {
-    "antd": "^4.16.13",
+    "@arco-design/web-react": "^2.25.1",
     "codemirror": "^5.63.3",
     "final-form": "^4.20.4",
     "final-form-arrays": "^3.0.2",
@@ -69,11 +68,10 @@
     "sortablejs": "^1.14.0"
   },
   "peerDependencies": {
-    "antd": "^4.16.13",
     "easy-email-core": "^2.5.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-final-form": "^6.5.7"
   },
-  "gitHead": "421534a8d92ea474bb6c55fed95ac89b61e6b13b"
+  "gitHead": "7778e47e9e49d6280326a82d976e571f4a04b2ff"
 }

package/readme.md

@@ -1,138 +1,138 @@
-# Easy-email-extensions
-
-## Introduction
-
-Provide default UI components, when they don’t meet your needs, you can refer to it and write your own
-
-## usage
-
-```sh
-$ npm install --save easy-email-extensions
-```
-
-or
-
-```sh
-$ yarn add easy-email-extensions
-```
-
-```js
-import React from 'react';
-import { BlockManager, BasicType } from 'easy-email-core';
-import { EmailEditor, EmailEditorProvider } from 'easy-email-editor';
-import { SimpleLayout } from 'easy-email-extensions';
-
-import 'easy-email-editor/lib/style.css';
-import 'easy-email-extensions/lib/style.css';
-
-const initialValues = {
-  subject: 'Welcome to Easy-email',
-  subTitle: 'Nice to meet you!',
-  content: BlockManager.getBlockByType(BasicType.PAGE)!.create({}),
-};
-
-export function App() {
-  return (
-    <EmailEditorProvider
-      data={initialValues}
-      height={'calc(100vh - 72px)'}
-      autoComplete
-      dashed={false}
-    >
-      {({ values }) => {
-        return (
-          <SimpleLayout>
-            <EmailEditor />
-          </SimpleLayout>
-        );
-      }}
-    </EmailEditorProvider>
-  );
-}
-```
-
-## Extensions
-
-- `AttributePanel`
-
-  - Basic block configuration panel
-
-  - <img src="https://assets.maocanhua.cn/3e74a61d-ab22-4cf3-afc9-d511b82e08cd-image.png" alt="AttributePanel">
-
-  - You can add or overwrite
-
-    ```tsx
-    import { BlockAttributeConfigurationManager } from "easy-email-extensions";
-
-    BlockAttributeConfigurationManager.add({
-      [BasicType.TEXT]: () => <div>will be overwrite `Text`</div>,
-    });
-    ```
-
-- `InteractivePrompt`
-
-  - block hover and focus style
-
-  - <img src="https://assets.maocanhua.cn/298d72d6-a509-4cd2-85c7-dfb915971620-image.png" alt="InteractivePrompt">
-
-  - No configuration items
-
-- `BlockLayer`
-
-  - <img src="https://assets.maocanhua.cn/de1f5211-350e-43c9-9c99-d97a2f196e04-image.png" alt="ShortcutToolbar">
-  - No configuration items
-
-- `ShortcutToolbar`
-
-  - <img src="https://assets.maocanhua.cn/f0e2ccc6-0627-472b-ad78-bc92bdb46ad1-image.png">
-  - You can add or overwrite popover's preset blocks
-
-    ```tsx
-    import { BasicType } from "easy-email-core";
-    import {
-      BlockMarketManager,
-      BlockMaskWrapper,
-    } from "easy-email-extensions";
-
-    BlockMarketManager.addCategories([
-      {
-        title: "Custom",
-        name: "custom",
-        blocks: [
-          {
-            type: BasicType.TEXT,
-            title: "Text",
-            description: "This block allows you to display text in your email.",
-            component: () => {
-              return (
-                <BlockMaskWrapper
-                  type={BasicType.TEXT}
-                  payload={{
-                    attributes: {
-                      "font-size": "20px",
-                      align: "center",
-                      padding: "0px 0px 0px 0px",
-                      color: "#4A90E2",
-                    },
-                    data: {
-                      value: {
-                        content: "20px",
-                      },
-                    },
-                  }}
-                >
-                  <div style={{ fontSize: 20, width: "100%", paddingLeft: 20 }}>
-                    20px
-                  </div>
-                </BlockMaskWrapper>
-              );
-            },
-          },
-        ],
-      },
-    ]);
-    ```
-
-- `SimpleLayout`
-
-  - All in one extension, provide basic and complete layout example. Refer to the above extension for configuration items.
+# Easy-email-extensions
+
+## Introduction
+
+Provide default UI components, when they don’t meet your needs, you can refer to it and write your own
+
+## usage
+
+```sh
+$ npm install --save easy-email-extensions
+```
+
+or
+
+```sh
+$ yarn add easy-email-extensions
+```
+
+```js
+import React from 'react';
+import { BlockManager, BasicType } from 'easy-email-core';
+import { EmailEditor, EmailEditorProvider } from 'easy-email-editor';
+import { SimpleLayout } from 'easy-email-extensions';
+
+import 'easy-email-editor/lib/style.css';
+import 'easy-email-extensions/lib/style.css';
+
+const initialValues = {
+  subject: 'Welcome to Easy-email',
+  subTitle: 'Nice to meet you!',
+  content: BlockManager.getBlockByType(BasicType.PAGE)!.create({}),
+};
+
+export function App() {
+  return (
+    <EmailEditorProvider
+      data={initialValues}
+      height={'calc(100vh - 72px)'}
+      autoComplete
+      dashed={false}
+    >
+      {({ values }) => {
+        return (
+          <SimpleLayout>
+            <EmailEditor />
+          </SimpleLayout>
+        );
+      }}
+    </EmailEditorProvider>
+  );
+}
+```
+
+## Extensions
+
+- `AttributePanel`
+
+  - Basic block configuration panel
+
+  - <img src="https://assets.maocanhua.cn/3e74a61d-ab22-4cf3-afc9-d511b82e08cd-image.png" alt="AttributePanel">
+
+  - You can add or overwrite
+
+    ```tsx
+    import { BlockAttributeConfigurationManager } from "easy-email-extensions";
+
+    BlockAttributeConfigurationManager.add({
+      [BasicType.TEXT]: () => <div>will be overwrite `Text`</div>,
+    });
+    ```
+
+- `InteractivePrompt`
+
+  - block hover and focus style
+
+  - <img src="https://assets.maocanhua.cn/298d72d6-a509-4cd2-85c7-dfb915971620-image.png" alt="InteractivePrompt">
+
+  - No configuration items
+
+- `BlockLayer`
+
+  - <img src="https://assets.maocanhua.cn/de1f5211-350e-43c9-9c99-d97a2f196e04-image.png" alt="ShortcutToolbar">
+  - No configuration items
+
+- `ShortcutToolbar`
+
+  - <img src="https://assets.maocanhua.cn/f0e2ccc6-0627-472b-ad78-bc92bdb46ad1-image.png">
+  - You can add or overwrite popover's preset blocks
+
+    ```tsx
+    import { BasicType } from "easy-email-core";
+    import {
+      BlockMarketManager,
+      BlockMaskWrapper,
+    } from "easy-email-extensions";
+
+    BlockMarketManager.addCategories([
+      {
+        title: "Custom",
+        name: "custom",
+        blocks: [
+          {
+            type: BasicType.TEXT,
+            title: "Text",
+            description: "This block allows you to display text in your email.",
+            component: () => {
+              return (
+                <BlockMaskWrapper
+                  type={BasicType.TEXT}
+                  payload={{
+                    attributes: {
+                      "font-size": "20px",
+                      align: "center",
+                      padding: "0px 0px 0px 0px",
+                      color: "#4A90E2",
+                    },
+                    data: {
+                      value: {
+                        content: "20px",
+                      },
+                    },
+                  }}
+                >
+                  <div style={{ fontSize: 20, width: "100%", paddingLeft: 20 }}>
+                    20px
+                  </div>
+                </BlockMaskWrapper>
+              );
+            },
+          },
+        ],
+      },
+    ]);
+    ```
+
+- `SimpleLayout`
+
+  - All in one extension, provide basic and complete layout example. Refer to the above extension for configuration items.

package/lib/InteractivePrompt/constants.d.ts

@@ -1,15 +0,0 @@
-export declare const DRAG_HOVER_CLASSNAME = "block-dragover";
-export declare const BLOCK_SELECTED_CLASSNAME = "block-selected";
-export declare const BLOCK_HOVER_CLASSNAME = "block-hover";
-export declare const BLOCK_HIDDEN_CLASSNAME = "block-hidden";
-export declare const styleZIndex: {
-    SELECT_INDEX: number;
-    HOVER_INDEX: number;
-    DRAG_INDEX: number;
-    SELECT_BLOCK_TOOLTIP: number;
-    HOVER_BLOCK_TOOLTIP: number;
-    DRAG_BLOCK_TOOLTIP: number;
-    SELECT_BLOCK_CHILD: number;
-    HOVER_BLOCK_CHILD: number;
-    DRAG_BLOCK_CHILD: number;
-};

package/lib/components/Form/TreeSelect.d.ts

@@ -1,16 +0,0 @@
-import { TreeSelectProps as AntdTreeSelectProps } from 'antd/lib/tree-select';
-import React from 'react';
-interface TreeSelectOption {
-    value: string;
-    label: React.ReactNode;
-    selectable?: boolean;
-    options?: TreeSelectOption[];
-}
-export interface TreeSelectProps extends AntdTreeSelectProps<string> {
-    options: TreeSelectOption[];
-    onChange?: (val: string) => void;
-    label: string;
-    title?: string;
-}
-export declare function TreeSelect(props: TreeSelectProps): JSX.Element;
-export {};