@8btc/xcanvas 0.0.14-beta.2 → 0.0.14-beta.20

package/README.md

@@ -20,6 +20,8 @@ export interface XCanvasAPI {
   insertImgs: (url: string[]) => Promise<void>;
   /** 追加多张图片到画布末尾, 如果画布中存在对应图片（url相同），则不做任何操作 */
   appendImgs: (urls: string[]) => Promise<void>;
+  // 插入的图片后缀会自动带上时间戳后缀，用于解决maze跨域问题 `${url}?t=${Date.now()}`
+  appendImgsForMaze: (urls: string[]) => Promise<void>;
   /** 保存canvas数据 */
   save: () => any;
   /** 从数据中恢复canvas画布 */
@@ -39,18 +41,22 @@ export interface XCanvasAPI {
   reset: () => void;
   /**
    * 导出当前选区为图片（dataUrl）, 特殊情况：当前选区为单张外部传入图片，则直接返回外部图片url
+   *
+   * @param tryToSplit  是否尝试拆分选区内的图片元素（当选区内全是图片时生效）
+   *  如果选区内的元素都是图片，则返回选区内图片url数组
+   *  如果选区内有非图片元素，则返回选区区域的dataUrl
    * @returns dataUrl | url
    * @throws  如果没有选区，调用这个函数会抛出错误
    */
-  exportSelection: () => Promise<string>;
+  exportSelection: (tryToSplit?: boolean) => Promise<string | string[]>;
   /**
-   * 插入embeddableElement元素
+   * 在当前旁边插入embeddableElement元素
    *
    * @param data 调用 renderEmbeddable 时， 可以从 element.data 访问到这里传入的数据
    * @param positonCalculator 入参为当前选区左上角x,y 和宽高，返回值为插入元素的左上角x,y,w,h
    * @returns 如果成功插入返回元素id，否则返回undefined
    */
-  insertCustomElement: (
+  insertCustomElementBesideSelection: (
     data: {
       component: string,
       link?: string,
@@ -70,5 +76,19 @@ export interface XCanvasAPI {
           height: number,
         }
   ) => string | undefined;
+  /**
+   * 判断当前是否可以裁切图片
+   */
+  predicateCropImage: () => boolean;
+  /**
+   * 裁切图片
+   */
+  cropImage: () => void;
+  /**
+   * 删除选区里的全部元素
+   */
+  deleteSelection: () => void;
+  /** 插入多个视频 */
+  insertVideos: (urls: string[]) => Promise<void>;
 }
 ```

package/dist/index.d.ts

@@ -13,6 +13,7 @@ export declare interface XCanvasAPI {
     insertImgs: (url: string[]) => Promise<void>;
     /** 追加多张图片到画布末尾, 如果画布中存在对应图片（url相同），则不做任何操作 */
     appendImgs: (urls: string[]) => Promise<void>;
+    appendImgsForMaze: (urls: string[]) => Promise<void>;
     /** 保存canvas数据 */
     save: () => any;
     /** 从数据中恢复canvas画布 */
@@ -32,18 +33,22 @@ export declare interface XCanvasAPI {
     reset: () => void;
     /**
      * 导出当前选区为图片（dataUrl）, 特殊情况：当前选区为单张外部传入图片，则直接返回外部图片url
+     *
+     * @param tryToSplit  是否尝试拆分选区内的图片元素（当选区内全是图片时生效）
+     *  如果选区内的元素都是图片，则返回选区内图片url数组
+     *  如果选区内有非图片元素，则返回选区区域的dataUrl
      * @returns dataUrl | url
      * @throws  如果没有选区，调用这个函数会抛出错误
      */
-    exportSelection: () => Promise<string>;
+    exportSelection: (tryToSplit?: boolean) => Promise<string | string[]>;
     /**
-     * 插入embeddableElement元素
+     * 在当前旁边插入embeddableElement元素
      *
      * @param data 调用 renderEmbeddable 时， 可以从 element.data 访问到这里传入的数据
      * @param positonCalculator 入参为当前选区左上角x,y 和宽高，返回值为插入元素的左上角x,y,w,h
      * @returns 如果成功插入返回元素id，否则返回undefined
      */
-    insertCustomElement: (data: {
+    insertCustomElementBesideSelection: (data: {
         component: string;
         link?: string;
         [key: string]: any;
@@ -70,6 +75,10 @@ export declare interface XCanvasAPI {
      * 删除选区里的全部元素
      */
     deleteSelection: () => void;
+    /** 插入一个视频 */
+    insertVideo: (urls: string) => Promise<void>;
+    /** 插入一个SVG */
+    insertSvg: (urls: string) => Promise<void>;
 }
 
 export declare interface XcanvasProps extends ExcalidrawProps {