@ydesign/react-editor 0.0.2

package/dist/chunk-WJT6VPDR.js

@@ -0,0 +1,9 @@
+import*as A from"mobx";var u=A.observable([]);function S(t){u.push(t)}function I(t){let e=u.findIndex(n=>n.fontFamily===t);e!==-1&&u.splice(e,1)}function O(t){u.replace(t)}var E="Some test text;?#D-\u041F\u0420\u0418\u0412\u0415\u0422!1230o9u8i7y6t5r4e3w2q1",g=null;function i(t,e="Arial",n="normal",s="normal"){g||(g=document.createElement("canvas"));let o=g.getContext("2d");return o.font=`${n} ${s} 40px '${t}', ${e}`,o.measureText(E).width}var c={Arial:!0},N=t=>!!c[t],v=6e3,p=60,y=()=>{},R=t=>{y=t},$=()=>v,W=t=>{$=t};async function M(t,e="normal",n="normal"){if(c[t])return;let s=!!document.fonts?.load,o=i("Arial","Arial",e,n);if(s)try{if(await document.fonts.load(`${n} ${e} 16px '${t}'`),i(t,"Arial",e,n)!==o){c[t]=!0;return}}catch{}let l=i("Times","Times",e,n),a=i(t,"Arial",e,n),d=Math.min(v,$())/p;for(let m=0;m<d;m++){let x=i(t,"Arial",e,n),C=i(t,"Times",e,n);if(x!==a||x!==o||C!==l){await T(p),c[t]=!0;return}await T(p)}let f=`Timeout for loading font "${t}". Is it a correct font family?`;console.warn(f),y(f)}function T(t){return new Promise(e=>setTimeout(e,t))}var F={},r=null;function w(){return r||(r=document.getElementById("custom-font-style"),r||(r=document.createElement("style"),r.id="custom-font-style",document.head.appendChild(r))),r.sheet}function P(t){let{fontFamily:e,url:n,styles:s}=t;if(F[e]||!n&&!s)return;let o=s||(n?[{src:`url("${n}")`}]:[]),l=w();o.forEach(a=>{let d=`
+      @font-face {
+        font-family: '${e}';
+        src: ${a.src};
+        font-style: ${a.fontStyle||"normal"};
+        font-weight: ${a.fontWeight||"normal"};
+        font-display: swap;
+      }
+    `;l.insertRule(d,l.cssRules.length)}),F[e]=!0}var b={},h="400,400italic,700,700italic";function j(t){h=t}function V(){return h}function L(t){return`https://fonts.googleapis.com/css?family=${t.replace(/ /g,"+")}:${h}`}function k(t){if(b[t])return;let e=document.createElement("link");e.rel="stylesheet",e.type="text/css",e.href=L(t),document.head.appendChild(e),b[t]=!0}export{u as a,S as b,I as c,O as d,N as e,R as f,W as g,M as h,P as i,j,V as k,L as l,k as m};

package/dist/chunk-XDLFQXMN.js

@@ -0,0 +1,54 @@
+import{c as s,d as S}from"./chunk-JWQ2DUXA.js";import{a as x}from"./chunk-WIM26GEM.js";import{a as o}from"./chunk-LW2W4B2N.js";import{a as P}from"./chunk-QJBRJELT.js";import{a as u}from"./chunk-6LFGFFHI.js";import{a as h}from"./chunk-DBQHEZPG.js";import{a as m}from"./chunk-TX4BNXQC.js";import{a as y}from"./chunk-M33EDDXB.js";import{a as f}from"./chunk-DJBTBRPS.js";import{a as T}from"./chunk-55FJG4FK.js";import a from"styled-components";import{useRef as g,useLayoutEffect as C}from"react";import{observer as i}from"mobx-react-lite";import{LayoutTemplate as z,TypeOutline as L,Image as N,Shapes as M,Upload as B,Wallpaper as H,Layers as I,ImageUpscale as E}from"lucide-react";import{clsx as R}from"clsx";import{jsx as n,jsxs as p}from"react/jsx-runtime";var U=a.div`
+  display: flex;
+  height: 100% !important;
+  padding: 0px !important;
+  position: relative;
+
+  &.bp5-navbar {
+    box-shadow: none;
+  }
+`,$=a.div`
+  @media screen and (min-width: 501px) {
+    overflow-y: auto;
+    overflow-x: hidden;
+    min-width: 72px;
+  }
+`,D=a.div`
+  display: flex;
+  flex-direction: column;
+`,F=a.div`
+  padding: 10px 10px 0px 10px !important;
+  height: 100% !important;
+
+  &.bp5-navbar {
+    width: 350px;
+  }
+
+  &.bp5-navbar.collapsed {
+    width: 0px;
+  }
+`,O=a.div`
+  display: none;
+  ${s(`
+    position: absolute;
+    bottom: 72px;
+    display: block;
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba(0, 0, 0, 0.05);
+  `)}
+`,W=a.div`
+  position: absolute;
+  right: 1px;
+  top: 50%;
+  height: 96px;
+  width: 15px;
+  fill: white;
+  cursor: pointer;
+  z-index: 10;
+  transform: translate(100%, -50%);
+
+  ${s(`
+    display: none;
+  `)}
+`,A=({onClick:e})=>n(W,{onClick:e,children:n("div",{children:p("button",{className:"grid relative justify-center arrow",children:[p("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 13 96",width:"13",height:"96",fill:"none",children:[n("path",{d:"M0,0 h1 c0,20,12,12,12,32 v32 c0,20,-12,12,-12,32 H0 z",className:"fill-white dark:fill-[#0b0809]"}),n("path",{d:"M0.5,0 c0,20,12,12,12,32 v32 c0,20,-12,12,-12,32",className:"fill-white stroke-gray-200 dark:fill-[#0b0809] dark:stroke-[#0b0809]"})]}),n("div",{className:"absolute self-center",children:n("span",{className:"w-3 h-3 text-block inline-flex items-center box-border dark:text-white",children:n("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"12",viewBox:"0 0 12 12",children:n("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeWidth:"1.25",d:"M7 3.17 4.88 5.3a1 1 0 0 0 0 1.42L7 8.83"})})})})]})})}),_={name:"templates",Tab:i(e=>n(o,{name:"templates",...e,children:n(z,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(P,{store:e})},j={name:"text",Tab:i(e=>n(o,{name:"text",...e,children:n(L,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(u,{store:e})},q={name:"photos",Tab:i(e=>n(o,{name:"photos",...e,children:n(N,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(f,{store:e})},G={name:"shapes",Tab:i(e=>n(o,{name:"shapes",...e,children:n(M,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(T,{store:e})},J={name:"upload",Tab:i(e=>n(o,{name:"upload",...e,children:n(B,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(h,{store:e})},K={name:"background",Tab:i(e=>n(o,{name:"background",...e,children:n(H,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(m,{store:e})},Q={name:"layers",Tab:i(e=>n(o,{name:"layers",...e,children:n(I,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(y,{store:e})},V={name:"size",Tab:i(e=>n(o,{name:"size",...e,children:n(E,{style:{display:"inline-block"},size:20})})),Panel:({store:e})=>n(x,{store:e})},X=[_,j,q,G,J,K,Q,V],Y=i(({store:e,sections:v,defaultSection:c="templates"})=>{(()=>{let t=g(!0);t.current&&(t.current=!1,e.openSidePanel(c))})();let r=S();C(()=>{r?e.openSidePanel(""):e.openSidePanel(c)},[r]);let d=[...v||X].filter(t=>t.visibleInList!==!1),b=d.find(t=>t.name===e.openedSidePanel)?.Panel,k=g(null);return p(U,{className:`bp5-navbar design-side-panel ${e.openedSidePanel?"":"collapsed"}`,children:[n($,{className:"design-side-tabs-container border-r-1 border-gray-200 dark:border-gray-800",ref:k,children:n(D,{className:"design-side-tabs-inner",children:d.map(({name:t,Tab:l})=>n(l,{name:t,onClick:()=>{t===e.openedSidePanel?e.openSidePanel(""):e.openSidePanel(t)},active:e.openedSidePanel===t},t))})}),b&&n(F,{className:R("bp5-navbar design-panel-container","border-r-1 border-gray-200 dark:border-gray-800"),onClick:t=>{let l=t.target.closest(".design-close-panel"),w=t.target.closest(".design-mobile");l&&(r||w)&&e.openSidePanel("")},children:n(b,{store:e})}),e.openedSidePanel&&n(O,{onClick:()=>e.openSidePanel("")}),e.openedSidePanel&&n(A,{onClick:()=>e.openSidePanel("")})]})}),Pe=Y;export{_ as a,j as b,q as c,G as d,J as e,K as f,Q as g,V as h,X as i,Y as j,Pe as k};

package/dist/chunk-XRRO2RT7.js

@@ -0,0 +1 @@
+import{jsx as d}from"react/jsx-runtime";var o=()=>d("div",{}),r=o;export{o as a,r as b};

package/dist/chunk-XZAP76LL.js

@@ -0,0 +1 @@
+import{a as u,b as m}from"./chunk-3HQUN5MA.js";import{a as s}from"./chunk-OQ6HU62L.js";import{a as c,b as p}from"./chunk-E7ZSWHPU.js";import{ColorPicker as y,Tooltip as k,Button as f}from"antd";import{CirclePlus as g}from"lucide-react";import{cssGradient2FabricGradient as T}from"@ydesign/core";import{jsx as t,jsxs as d}from"react/jsx-runtime";var C=async e=>s(e),x=({store:e})=>{let i=e.editor?.workareaHandler.workarea?.fill,o=c(i);return t(k,{title:"\u80CC\u666F\u989C\u8272",children:t("div",{style:{height:32},children:t(y,{value:o,allowClear:!0,mode:["single","gradient"],onChangeComplete:r=>{let n=r.toCssString();if(n.includes("gradient")){let a=T(n);e.editor?.workareaHandler.setWorkareaBgColor(a)}else e.editor?.workareaHandler.setWorkareaBgColor(n)}})})})},P=({store:e})=>t("div",{children:d("label",{htmlFor:"input-file",children:[d(f,{type:"text",styles:{root:{padding:"0 8px"}},onClick:()=>{document.querySelector("#input-file")?.click()},children:[t(g,{size:16})," add image"]}),t("input",{type:"file",id:"input-file",style:{display:"none"},onChange:async i=>{let{target:o}=i;if(!(!o.files||o.files.length===0)){for(let r of o.files){let a={type:"image",src:await C(r)};e.editor?.objectsHandler.add(a)}o.value=""}},multiple:!0,accept:"image/*"})]})}),v=({store:e})=>t("div",{children:d(f,{type:"text",styles:{root:{padding:"0 8px"}},onClick:()=>{e.editor?.objectsHandler.add({originX:"left",originY:"top",fontSize:100,textAlign:"left",fill:p(),text:"Hello World",type:"textbox"})},children:[t(g,{size:16}),"add text"]})}),b={DefaultBackgroundPicker:x,DefaultAddImage:P,DefaultAddText:v},h=({store:e,components:l})=>{let o=u({type:"text",usedItems:["DefaultBackgroundPicker","DefaultAddImage","DefaultAddText"],components:l});return t(m,{items:o,itemRender:r=>{let n=l[r]||b[r];return n&&t(n,{store:e},r)}})},I=h;export{h as a,I as b};

package/dist/config.d.ts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/hooks/use-duplicate-element.d.ts

@@ -0,0 +1,12 @@
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const useDuplicateElement: ({ store }: {
+    store: StoreType;
+}) => {
+    disabled: boolean;
+    duplicate: () => void;
+};
+
+export { useDuplicateElement };

package/dist/hooks/use-duplicate-element.js

@@ -0,0 +1 @@
+import{a}from"../chunk-JMIN2XMC.js";import"../chunk-O2XFH626.js";export{a as useDuplicateElement};

package/dist/hooks/use-lock.d.ts

@@ -0,0 +1,14 @@
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const useLock: ({ store }: {
+    store: StoreType;
+}) => {
+    disabled: boolean;
+    lock: () => void;
+    unlock: () => void;
+    locked: boolean | undefined;
+};
+
+export { useLock };

package/dist/hooks/use-lock.js

@@ -0,0 +1 @@
+import{a}from"../chunk-75WC3GVB.js";import"../chunk-O2XFH626.js";export{a as useLock};

package/dist/hooks/use-remove-element.d.ts

@@ -0,0 +1,12 @@
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const useRemoveElement: ({ store }: {
+    store: StoreType;
+}) => {
+    disabled: boolean;
+    remove: () => void;
+};
+
+export { useRemoveElement };

package/dist/hooks/use-remove-element.js

@@ -0,0 +1 @@
+import{a}from"../chunk-IUFYYEGO.js";import"../chunk-O2XFH626.js";export{a as useRemoveElement};

package/dist/lib/utils.d.ts

@@ -0,0 +1,5 @@
+import { ClassValue } from 'clsx';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+export { cn };

package/dist/lib/utils.js

@@ -0,0 +1 @@
+import"../chunk-O2XFH626.js";import{clsx as e}from"clsx";import{twMerge as t}from"tailwind-merge";function s(...r){return t(e(r))}export{s as cn};

package/dist/model/store.d.ts

@@ -0,0 +1,307 @@
+import * as mobx_state_tree from 'mobx-state-tree';
+import { Instance } from 'mobx-state-tree';
+import { Editor } from '@ydesign/core';
+
+interface ExportOptions {
+    multiplier: number;
+    format?: 'jpeg' | 'png' | 'webp';
+    quality?: number;
+    enableRetinaScaling?: boolean;
+    left?: number;
+    top?: number;
+    width?: number;
+    height?: number;
+    filter?: (object: any) => boolean;
+}
+interface BaseElement {
+    id: string;
+    type: string;
+    locked?: boolean;
+    [key: string]: any;
+}
+type ElementType = (BaseElement & {
+    type: 'textbox';
+    text: string;
+}) | (BaseElement & {
+    type: 'image';
+    src: string;
+}) | (BaseElement & {
+    type: 'group';
+    objects: ElementsArray;
+}) | BaseElement;
+type ElementsArray = ElementType[];
+declare const forEveryChild: (e: any, callback: (e: ElementType) => boolean | void) => void;
+declare const Font: mobx_state_tree.IModelType<{
+    fontFamily: mobx_state_tree.ISimpleType<string>;
+    name: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+    url: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+    img: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+    styles: mobx_state_tree.IType<any, any, any>;
+}, {}, mobx_state_tree.ModelCreationType<{
+    fontFamily: string;
+    name: string | undefined;
+    url: string | undefined;
+    img: string | undefined;
+    styles: any;
+}>, mobx_state_tree._NotCustomized>;
+/**
+ * 三个对象要搞清楚关系
+ *  1. selectedElementsIds: 选中的元素id数组
+ *  2. selectedElements: 会根据ids返回元素实例
+ *  3. selectElements: 设置 ids 的
+ *  4. selectedShapes:
+ */
+declare const Store: mobx_state_tree.IModelType<{
+    name: mobx_state_tree.IType<string | undefined, string, string>;
+    width: mobx_state_tree.IType<number | undefined, number, number>;
+    height: mobx_state_tree.IType<number | undefined, number, number>;
+    scale: mobx_state_tree.IType<number | undefined, number, number>;
+    scaleToFit: mobx_state_tree.IType<number | undefined, number, number>;
+    unit: mobx_state_tree.IType<string | undefined, string, string>;
+    dpi: mobx_state_tree.IType<number | undefined, number, number>;
+    bleed: mobx_state_tree.IType<number | undefined, number, number>;
+    bleedVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    rulesVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    openedSidePanel: mobx_state_tree.IType<string | undefined, string, string>;
+    selectedElementsIds: mobx_state_tree.IArrayType<mobx_state_tree.ISimpleType<string>>;
+    fonts: mobx_state_tree.IArrayType<mobx_state_tree.IModelType<{
+        fontFamily: mobx_state_tree.ISimpleType<string>;
+        name: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        url: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        img: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        styles: mobx_state_tree.IType<any, any, any>;
+    }, {}, mobx_state_tree.ModelCreationType<{
+        fontFamily: string;
+        name: string | undefined;
+        url: string | undefined;
+        img: string | undefined;
+        styles: any;
+    }>, mobx_state_tree._NotCustomized>>;
+    editor: mobx_state_tree.IType<Editor | null | undefined, Editor | null, Editor | null>;
+    custom: mobx_state_tree.IType<any, any, any>;
+    objects: mobx_state_tree.IType<any, any, any>;
+    _key: mobx_state_tree.IType<string | undefined, string, string>;
+    _updateTrigger: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateHistory: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateFontSize: mobx_state_tree.IType<number | undefined, number, number>;
+}, {
+    readonly selectedElements: ElementType[];
+} & {
+    readonly selectedShapes: ElementType[];
+} & {
+    _setEditor(editor: Editor): void;
+    _triggerUpdate(): void;
+    _historyUpdate(): void;
+    _fontSizeUpdate(): void;
+} & {
+    setObjects(objects: any): void;
+    selectElements(ids: string[]): void;
+    openSidePanel(t: string): void;
+    deleteElements(ids: string[]): void;
+    setScale(scale: number): void;
+    clone(): void;
+    addElement(): void;
+    setupEditorListeners(): void;
+} & {
+    _forEachElementUp(ids: Array<string>, callback: Function): void;
+    _forEachElementDown(ids: Array<string>, callback: Function): false | undefined;
+} & {
+    canMoveElementsUp(ids: Array<string>): false;
+    moveElementsUp(ids: Array<string>): void;
+    canMoveElementsTop(ids: Array<string>): false;
+    moveElementsTop(ids: Array<string>): void;
+    canMoveElementsDown(ids: Array<string>): false;
+    moveElementsDown(ids: Array<string>): void;
+    canMoveElementsBottom(ids: Array<string>): false;
+    moveElementsBottom(ids: Array<string>): void;
+    setElementZIndex(): void;
+} & {
+    toDataURL(options?: ExportOptions): Promise<string | null | undefined>;
+    toBlob(options?: ExportOptions): Promise<Blob | null | undefined>;
+    saveAsImage(options?: ExportOptions & {
+        fileName?: string;
+    }): Promise<void>;
+    toJSON(): any;
+    toObject(): any;
+    loadJSON: (data: any) => Promise<void>;
+    clear(): void;
+} & {
+    addFont(): void;
+    removeFont(): void;
+    /**
+     * 加载字体（注入 CSS 并等待字体可用）
+     * @param fontFamily - 字体名称
+     */
+    loadFont(fontFamily: string): Promise<void[]>;
+}, mobx_state_tree._NotCustomized, mobx_state_tree._NotCustomized>;
+type StoreType = Instance<typeof Store>;
+interface StoreProps {
+    key: string;
+}
+declare function createStore({ key }: StoreProps): mobx_state_tree.ModelInstanceTypeProps<{
+    name: mobx_state_tree.IType<string | undefined, string, string>;
+    width: mobx_state_tree.IType<number | undefined, number, number>;
+    height: mobx_state_tree.IType<number | undefined, number, number>;
+    scale: mobx_state_tree.IType<number | undefined, number, number>;
+    scaleToFit: mobx_state_tree.IType<number | undefined, number, number>;
+    unit: mobx_state_tree.IType<string | undefined, string, string>;
+    dpi: mobx_state_tree.IType<number | undefined, number, number>;
+    bleed: mobx_state_tree.IType<number | undefined, number, number>;
+    bleedVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    rulesVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    openedSidePanel: mobx_state_tree.IType<string | undefined, string, string>;
+    selectedElementsIds: mobx_state_tree.IArrayType<mobx_state_tree.ISimpleType<string>>;
+    fonts: mobx_state_tree.IArrayType<mobx_state_tree.IModelType<{
+        fontFamily: mobx_state_tree.ISimpleType<string>;
+        name: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        url: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        img: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        styles: mobx_state_tree.IType<any, any, any>;
+    }, {}, mobx_state_tree.ModelCreationType<{
+        fontFamily: string;
+        name: string | undefined;
+        url: string | undefined;
+        img: string | undefined;
+        styles: any;
+    }>, mobx_state_tree._NotCustomized>>;
+    editor: mobx_state_tree.IType<Editor | null | undefined, Editor | null, Editor | null>;
+    custom: mobx_state_tree.IType<any, any, any>;
+    objects: mobx_state_tree.IType<any, any, any>;
+    _key: mobx_state_tree.IType<string | undefined, string, string>;
+    _updateTrigger: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateHistory: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateFontSize: mobx_state_tree.IType<number | undefined, number, number>;
+}> & {
+    readonly selectedElements: ElementType[];
+} & {
+    readonly selectedShapes: ElementType[];
+} & {
+    _setEditor(editor: Editor): void;
+    _triggerUpdate(): void;
+    _historyUpdate(): void;
+    _fontSizeUpdate(): void;
+} & {
+    setObjects(objects: any): void;
+    selectElements(ids: string[]): void;
+    openSidePanel(t: string): void;
+    deleteElements(ids: string[]): void;
+    setScale(scale: number): void;
+    clone(): void;
+    addElement(): void;
+    setupEditorListeners(): void;
+} & {
+    _forEachElementUp(ids: Array<string>, callback: Function): void;
+    _forEachElementDown(ids: Array<string>, callback: Function): false | undefined;
+} & {
+    canMoveElementsUp(ids: Array<string>): false;
+    moveElementsUp(ids: Array<string>): void;
+    canMoveElementsTop(ids: Array<string>): false;
+    moveElementsTop(ids: Array<string>): void;
+    canMoveElementsDown(ids: Array<string>): false;
+    moveElementsDown(ids: Array<string>): void;
+    canMoveElementsBottom(ids: Array<string>): false;
+    moveElementsBottom(ids: Array<string>): void;
+    setElementZIndex(): void;
+} & {
+    toDataURL(options?: ExportOptions): Promise<string | null | undefined>;
+    toBlob(options?: ExportOptions): Promise<Blob | null | undefined>;
+    saveAsImage(options?: ExportOptions & {
+        fileName?: string;
+    }): Promise<void>;
+    toJSON(): any;
+    toObject(): any;
+    loadJSON: (data: any) => Promise<void>;
+    clear(): void;
+} & {
+    addFont(): void;
+    removeFont(): void;
+    /**
+     * 加载字体（注入 CSS 并等待字体可用）
+     * @param fontFamily - 字体名称
+     */
+    loadFont(fontFamily: string): Promise<void[]>;
+} & mobx_state_tree.IStateTreeNode<mobx_state_tree.IModelType<{
+    name: mobx_state_tree.IType<string | undefined, string, string>;
+    width: mobx_state_tree.IType<number | undefined, number, number>;
+    height: mobx_state_tree.IType<number | undefined, number, number>;
+    scale: mobx_state_tree.IType<number | undefined, number, number>;
+    scaleToFit: mobx_state_tree.IType<number | undefined, number, number>;
+    unit: mobx_state_tree.IType<string | undefined, string, string>;
+    dpi: mobx_state_tree.IType<number | undefined, number, number>;
+    bleed: mobx_state_tree.IType<number | undefined, number, number>;
+    bleedVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    rulesVisible: mobx_state_tree.IType<boolean | undefined, boolean, boolean>;
+    openedSidePanel: mobx_state_tree.IType<string | undefined, string, string>;
+    selectedElementsIds: mobx_state_tree.IArrayType<mobx_state_tree.ISimpleType<string>>;
+    fonts: mobx_state_tree.IArrayType<mobx_state_tree.IModelType<{
+        fontFamily: mobx_state_tree.ISimpleType<string>;
+        name: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        url: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        img: mobx_state_tree.IOptionalIType<mobx_state_tree.ISimpleType<string>, [undefined]>;
+        styles: mobx_state_tree.IType<any, any, any>;
+    }, {}, mobx_state_tree.ModelCreationType<{
+        fontFamily: string;
+        name: string | undefined;
+        url: string | undefined;
+        img: string | undefined;
+        styles: any;
+    }>, mobx_state_tree._NotCustomized>>;
+    editor: mobx_state_tree.IType<Editor | null | undefined, Editor | null, Editor | null>;
+    custom: mobx_state_tree.IType<any, any, any>;
+    objects: mobx_state_tree.IType<any, any, any>;
+    _key: mobx_state_tree.IType<string | undefined, string, string>;
+    _updateTrigger: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateHistory: mobx_state_tree.IType<number | undefined, number, number>;
+    _updateFontSize: mobx_state_tree.IType<number | undefined, number, number>;
+}, {
+    readonly selectedElements: ElementType[];
+} & {
+    readonly selectedShapes: ElementType[];
+} & {
+    _setEditor(editor: Editor): void;
+    _triggerUpdate(): void;
+    _historyUpdate(): void;
+    _fontSizeUpdate(): void;
+} & {
+    setObjects(objects: any): void;
+    selectElements(ids: string[]): void;
+    openSidePanel(t: string): void;
+    deleteElements(ids: string[]): void;
+    setScale(scale: number): void;
+    clone(): void;
+    addElement(): void;
+    setupEditorListeners(): void;
+} & {
+    _forEachElementUp(ids: Array<string>, callback: Function): void;
+    _forEachElementDown(ids: Array<string>, callback: Function): false | undefined;
+} & {
+    canMoveElementsUp(ids: Array<string>): false;
+    moveElementsUp(ids: Array<string>): void;
+    canMoveElementsTop(ids: Array<string>): false;
+    moveElementsTop(ids: Array<string>): void;
+    canMoveElementsDown(ids: Array<string>): false;
+    moveElementsDown(ids: Array<string>): void;
+    canMoveElementsBottom(ids: Array<string>): false;
+    moveElementsBottom(ids: Array<string>): void;
+    setElementZIndex(): void;
+} & {
+    toDataURL(options?: ExportOptions): Promise<string | null | undefined>;
+    toBlob(options?: ExportOptions): Promise<Blob | null | undefined>;
+    saveAsImage(options?: ExportOptions & {
+        fileName?: string;
+    }): Promise<void>;
+    toJSON(): any;
+    toObject(): any;
+    loadJSON: (data: any) => Promise<void>;
+    clear(): void;
+} & {
+    addFont(): void;
+    removeFont(): void;
+    /**
+     * 加载字体（注入 CSS 并等待字体可用）
+     * @param fontFamily - 字体名称
+     */
+    loadFont(fontFamily: string): Promise<void[]>;
+}, mobx_state_tree._NotCustomized, mobx_state_tree._NotCustomized>>;
+
+export { type BaseElement, type ElementType, type ElementsArray, type ExportOptions, Font, Store, type StoreProps, type StoreType, createStore, createStore as default, forEveryChild };

package/dist/model/store.js

@@ -0,0 +1 @@
+import{a as g}from"../chunk-P5I43V7X.js";import{a as l,h as c,i as p,m}from"../chunk-WJT6VPDR.js";import"../chunk-O2XFH626.js";import{types as i,cast as u,flow as f}from"mobx-state-tree";var y=(e,t)=>{if(e?.objects)for(let n of e.objects){if(t(n)===!0)break;y(n,t)}},E=i.model("Font",{fontFamily:i.string,name:i.optional(i.string,""),url:i.optional(i.string,""),img:i.optional(i.string,""),styles:i.frozen()}).preProcessSnapshot(e=>Object.assign(Object.assign({},e),{fontFamily:e.fontFamily||e.name})),b=i.model("Store",{name:"yitu-design",width:1080,height:1080,scale:1,scaleToFit:1,unit:"px",dpi:72,bleed:0,bleedVisible:!1,rulesVisible:!1,openedSidePanel:"",selectedElementsIds:i.array(i.string),fonts:i.array(E),editor:i.frozen(null),custom:i.frozen(),objects:i.frozen(),_key:"",_updateTrigger:0,_updateHistory:0,_updateFontSize:0}).views(e=>({get selectedElements(){let t=e._updateTrigger;return console.log("_trigger\u90FD\u53D8\u5316\u662F\u89E6\u53D1\u805A\u7126\u5143\u7D20\u7684\u5237\u65B0 ---> ",t),e.selectedElementsIds.map(n=>e.editor?.objectsHandler.findOneById(n))}})).views(e=>({get selectedShapes(){let t=[];return y({objects:e.selectedElements},n=>{n?.type!=="group"&&t.push(n)}),t}})).actions(e=>({_setEditor(t){e.editor=t},_triggerUpdate(){e._updateTrigger=e._updateTrigger+1},_historyUpdate(){e._updateHistory=e._updateHistory+1},_fontSizeUpdate(){e._updateFontSize=e._updateFontSize+1}})).actions(e=>({setObjects(t){e.objects=t},selectElements(t){e.selectedElementsIds=u(t)},openSidePanel(t){e.openedSidePanel!==t&&(e.openedSidePanel=t)},deleteElements(t){t.forEach(n=>{e.editor?.objectsHandler.remove(n)})},setScale(t){e.scale=t},clone(){e.editor?.objectsHandler.clone()},addElement(){},setupEditorListeners(){e.editor&&(e.editor.on("object:modified",()=>{console.log("\u805A\u7126\u5BF9\u8C61\u5C5E\u6027\u53D8\u5316: ---> "),e._triggerUpdate()}),e.editor.on("history:change",()=>{console.log("\u5386\u53F2\u8BB0\u5F55\u53D8\u5316: ---> "),e._historyUpdate()}),e.editor.on("textbox:modified",()=>{e._fontSizeUpdate()}))}})).actions(e=>({_forEachElementUp(t,n){if(!e.editor)return;let a=e.editor.layerHandler.getEffectiveLayers(),o=t.map(r=>({id:r,index:a.findIndex(d=>d.id===r)}));o.sort((r,d)=>d.index-r.index);for(let{index:r}of o){if(r==-1)continue;let d=r<a.length-1&&a[r+1],s=t.indexOf(d?.id)>=0;r===a.length-1||s||n(r)}},_forEachElementDown(t,n){if(!e.editor)return;let a=e.editor.layerHandler.getEffectiveLayers(),o=t.map(r=>({id:r,index:a.findIndex(d=>d.id===r)}));o.sort((r,d)=>d.index-r.index);for(let{index:r}of o){if(r==-1)continue;let d=r>0&&a[r-1],s=t.indexOf(d?.id)>=0;r===0||s||n(r)}return!1}})).actions(e=>({canMoveElementsUp(t){let n=!1;return e._forEachElementUp(t,()=>{n=!0}),n},moveElementsUp(t){if(!e.editor)return;let n=e.editor.layerHandler.getEffectiveLayers();[...t].map(o=>({id:o,index:n.findIndex(r=>r.id===o)})).filter(o=>o.index!==-1).sort((o,r)=>r.index-o.index).map(o=>o.id).forEach(o=>{e.editor?.layerHandler.bringForward(o)}),e._triggerUpdate()},canMoveElementsTop(t){return this.canMoveElementsUp(t)},moveElementsTop(t){e.editor&&(t.forEach(n=>{e.editor?.layerHandler.bringToFront(n)}),e._triggerUpdate())},canMoveElementsDown(t){let n=!1;return e._forEachElementDown(t,()=>{n=!0}),n},moveElementsDown(t){if(!e.editor)return;let n=e.editor.layerHandler.getEffectiveLayers();[...t].map(o=>({id:o,index:n.findIndex(r=>r.id===o)})).filter(o=>o.index!==-1).sort((o,r)=>o.index-r.index).map(o=>o.id).forEach(o=>{e.editor?.layerHandler.sendBackwards(o)}),e._triggerUpdate()},canMoveElementsBottom(t){return this.canMoveElementsDown(t)},moveElementsBottom(t){e.editor&&(t.forEach(n=>{e.editor?.layerHandler.sendToBack(n)}),e._triggerUpdate())},setElementZIndex(){}})).actions(e=>({async toDataURL(t){return e.editor?.rendererHandler.toDataURL(t)},async toBlob(t){return e.editor?.rendererHandler.toBlob(t)},async saveAsImage(t){if(!e.editor)return;let{fileName:n,...a}=t||{multiplier:1},o=await e.editor.rendererHandler.toBlob(a);o&&g(o,n||"yitu."+a.format)},toJSON(){return e.editor?.rendererHandler.toJSON()},toObject(){return e.editor?.rendererHandler.toObject()},loadJSON:f(function*(t){if(!e.editor)return;let n=yield e.editor.sceneHandler.importFromJSON(t);n&&(e.width=n.width,e.height=n.height)}),clear(){}})).actions(e=>({addFont(){},removeFont(){},async loadFont(t){let n=e.fonts.find(r=>r.fontFamily===t)||l.find(r=>r.fontFamily===t),o=[{fontStyle:"normal",fontWeight:"normal"},{fontStyle:"normal",fontWeight:"bold"}];return n?(n.styles&&(o=n.styles.map(r=>({fontStyle:r.fontStyle||"normal",fontWeight:r.fontWeight||"normal"}))),p(n)):m(t),Promise.all(o.map(r=>c(t,r.fontStyle,r.fontWeight)))}}));function x({key:e}){return b.create({_key:e})}var j=x;export{E as Font,b as Store,x as createStore,j as default,y as forEveryChild};

package/dist/project.d.ts

@@ -0,0 +1,21 @@
+import * as react from 'react';
+import { StoreType } from './model/store.js';
+import { FONT } from './utils/fonts.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+import 'mobx';
+
+interface ProjectOptions {
+    store: StoreType;
+}
+declare class Project {
+    store: StoreType;
+    constructor({ store }: ProjectOptions);
+    firstLoad(data?: any): Promise<void>;
+    getGlobalFont(fonts?: FONT[]): Promise<FONT[]>;
+}
+declare const ProjectContext: react.Context<Project | null>;
+declare const useProject: () => Project;
+declare const createProject: (options: ProjectOptions) => Project;
+
+export { ProjectContext, createProject, createProject as default, useProject };

package/dist/project.js

@@ -0,0 +1 @@
+import{d as s}from"./chunk-WJT6VPDR.js";import{a as r}from"./chunk-O2XFH626.js";import*as c from"mobx";import{createContext as n,useContext as i}from"react";var o=class{constructor({store:t}){r(this,"store");c.makeAutoObservable(this),this.store=t}async firstLoad(t){this.store.loadJSON(t)}async getGlobalFont(t){return t?.length?(s(t),t):[]}},a=n(null),j=()=>{let e=i(a);if(!e)throw new Error("useProject must be used within a ProjectProvider");return e},p=e=>new o(e),P=p;export{a as ProjectContext,p as createProject,P as default,j as useProject};

package/dist/side-panel/background-panel.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const BackgroundPanel: ({ store }: {
+    store: StoreType;
+}) => react_jsx_runtime.JSX.Element;
+
+export { BackgroundPanel };

package/dist/side-panel/background-panel.js

@@ -0,0 +1 @@
+import{a}from"../chunk-TX4BNXQC.js";import"../chunk-O2XFH626.js";export{a as BackgroundPanel};

package/dist/side-panel/index.d.ts

@@ -0,0 +1,6 @@
+export { BackgroundSection, DEFAULT_SECTIONS, LayersSection, PhotosSection, Section, ShapesSection, default as SidePanel, SizeSection, TemplatesSection, TextSection, UploadSection } from './side-panel.js';
+export { SectionTab } from './tab-button.js';
+import '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+import 'react/jsx-runtime';

package/dist/side-panel/index.js

@@ -0,0 +1 @@
+import{a as r,b as e,c as f,d as m,e as p,f as t,g as x,h as a,i as b,j as c}from"../chunk-XDLFQXMN.js";import"../chunk-JWQ2DUXA.js";import"../chunk-WIM26GEM.js";import{a as o}from"../chunk-LW2W4B2N.js";import"../chunk-QJBRJELT.js";import"../chunk-6LFGFFHI.js";import"../chunk-DBQHEZPG.js";import"../chunk-TX4BNXQC.js";import"../chunk-M33EDDXB.js";import"../chunk-DJBTBRPS.js";import"../chunk-55FJG4FK.js";import"../chunk-O2XFH626.js";export{t as BackgroundSection,b as DEFAULT_SECTIONS,x as LayersSection,f as PhotosSection,o as SectionTab,m as ShapesSection,c as SidePanel,a as SizeSection,r as TemplatesSection,e as TextSection,p as UploadSection};

package/dist/side-panel/layers-panel.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const LayersPanel: ({ store }: {
+    store: StoreType;
+}) => react_jsx_runtime.JSX.Element;
+
+export { LayersPanel };

package/dist/side-panel/layers-panel.js

@@ -0,0 +1 @@
+import{a}from"../chunk-M33EDDXB.js";import"../chunk-O2XFH626.js";export{a as LayersPanel};

package/dist/side-panel/photos-panel.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const PhotosPanel: ({ store }: {
+    store: StoreType;
+}) => react_jsx_runtime.JSX.Element;
+
+export { PhotosPanel };

package/dist/side-panel/photos-panel.js

@@ -0,0 +1 @@
+import{a}from"../chunk-DJBTBRPS.js";import"../chunk-O2XFH626.js";export{a as PhotosPanel};

package/dist/side-panel/shapes-panel.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const ShapesPanel: ({ store }: {
+    store: StoreType;
+}) => react_jsx_runtime.JSX.Element;
+
+export { ShapesPanel };

package/dist/side-panel/shapes-panel.js

@@ -0,0 +1 @@
+import{a}from"../chunk-55FJG4FK.js";import"../chunk-O2XFH626.js";export{a as ShapesPanel};

package/dist/side-panel/side-panel.d.ts

@@ -0,0 +1,35 @@
+import { StoreType } from '../model/store.js';
+export { SectionTab } from './tab-button.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+import 'react/jsx-runtime';
+
+interface SectionTabProps {
+    onClick: any;
+    active: boolean;
+}
+type Section = {
+    name: string;
+    Tab: React.ComponentType<SectionTabProps>;
+    Panel: React.ComponentType<{
+        store: StoreType;
+    }>;
+    visibleInList?: boolean;
+};
+interface SidePanelProps {
+    store: StoreType;
+    sections?: Section[];
+    defaultSection?: string;
+}
+declare const TemplatesSection: Section;
+declare const TextSection: Section;
+declare const PhotosSection: Section;
+declare const ShapesSection: Section;
+declare const UploadSection: Section;
+declare const BackgroundSection: Section;
+declare const LayersSection: Section;
+declare const SizeSection: Section;
+declare const DEFAULT_SECTIONS: Section[];
+declare const SidePanel: React.FC<SidePanelProps>;
+
+export { BackgroundSection, DEFAULT_SECTIONS, LayersSection, PhotosSection, type Section, ShapesSection, SidePanel, SizeSection, TemplatesSection, TextSection, UploadSection, SidePanel as default };

package/dist/side-panel/side-panel.js

@@ -0,0 +1 @@
+import{a as b,b as c,c as d,d as e,e as f,f as g,g as h,h as i,i as j,j as k,k as l}from"../chunk-XDLFQXMN.js";import"../chunk-JWQ2DUXA.js";import"../chunk-WIM26GEM.js";import{a}from"../chunk-LW2W4B2N.js";import"../chunk-QJBRJELT.js";import"../chunk-6LFGFFHI.js";import"../chunk-DBQHEZPG.js";import"../chunk-TX4BNXQC.js";import"../chunk-M33EDDXB.js";import"../chunk-DJBTBRPS.js";import"../chunk-55FJG4FK.js";import"../chunk-O2XFH626.js";export{g as BackgroundSection,j as DEFAULT_SECTIONS,h as LayersSection,d as PhotosSection,a as SectionTab,e as ShapesSection,k as SidePanel,i as SizeSection,b as TemplatesSection,c as TextSection,f as UploadSection,l as default};

package/dist/side-panel/size-panel.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const SizePanel: ({ store }: {
+    store: StoreType;
+}) => react_jsx_runtime.JSX.Element;
+
+export { SizePanel };

package/dist/side-panel/size-panel.js

@@ -0,0 +1 @@
+import{a}from"../chunk-WIM26GEM.js";import"../chunk-O2XFH626.js";export{a as SizePanel};

package/dist/side-panel/tab-button.d.ts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface SectionTabProps {
+    children: any;
+    name: string;
+    onClick: any;
+    active: boolean;
+    iconSize?: number;
+}
+declare const SectionTab: ({ children, name, iconSize, onClick, active }: SectionTabProps) => react_jsx_runtime.JSX.Element;
+
+export { SectionTab };

package/dist/side-panel/tab-button.js

@@ -0,0 +1 @@
+import{a}from"../chunk-LW2W4B2N.js";import"../chunk-O2XFH626.js";export{a as SectionTab};