@ydesign/react-editor 0.0.2

package/CHANGELOG.md

@@ -0,0 +1,106 @@
+# @ydesign/react-editor
+
+## 0.3.3
+
+### Patch Changes
+
+- fix object position on manual update
+- Updated dependencies
+  - @layerhub-io/core@0.3.3
+
+## 0.3.2
+
+### Patch Changes
+
+- fix video loading
+- Updated dependencies
+  - @layerhub-io/core@0.3.2
+
+## 0.3.1
+
+### Patch Changes
+
+- fix background image on added to editor
+- Updated dependencies
+  - @layerhub-io/core@0.3.1
+
+## 0.3.0
+
+### Minor Changes
+
+- Add background image support
+
+### Patch Changes
+
+- Updated dependencies
+  - @layerhub-io/core@0.3.0
+
+## 0.2.6
+
+### Patch Changes
+
+- Push history on load template from json
+- Updated dependencies
+  - @layerhub-io/core@0.2.6
+
+## 0.2.5
+
+### Patch Changes
+
+- Add debug option
+- Updated dependencies
+  - @layerhub-io/core@0.2.5
+
+## 0.2.4
+
+### Patch Changes
+
+- fix updated being updated twice
+- Updated dependencies
+  - @layerhub-io/core@0.2.4
+
+## 0.2.3
+
+### Patch Changes
+
+- update shadow apply
+- Updated dependencies
+  - @layerhub-io/core@0.2.3
+
+## 0.2.2
+
+### Patch Changes
+
+- make dynamic canvas background
+- Updated dependencies
+  - @layerhub-io/core@0.2.2
+
+## 0.2.1
+
+### Patch Changes
+
+- make frame selectable
+- Updated dependencies
+  - @layerhub-io/core@0.2.1
+
+## 0.2.0
+
+### Minor Changes
+
+- 5fbb000: rename design to scene
+
+### Patch Changes
+
+- Updated dependencies [5fbb000]
+  - @layerhub-io/core@0.2.0
+
+## 0.1.0
+
+### Minor Changes
+
+- cfd5294: create initial release
+
+### Patch Changes
+
+- Updated dependencies [cfd5294]
+  - @layerhub-io/core@0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 junhaoliao
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,129 @@
+# @ydesign/react-editor
+
+> 基于React框架的编辑器
+
+## 基础功能
+
+- [ ] 历史记录（撤销、重做）
+- [ ] 快捷键
+- [ ] 右键菜单
+- [ ] 导入PSD
+- [ ] 导入AI文件
+- [ ] 导入PDF
+- [ ] 导入JSON数据
+- [ ] 导出文件（SVG、jpg、png、PDF）
+  - [ ] 整个画布导出
+  - [ ] 指定元素导出
+- [ ] 图层管理
+- [ ] mock数据加载设置
+
+## 画布编辑
+
+- [ ] 背景设置（纯色、渐变、图片）
+- [ ] 画布尺寸调整控件（画布外框的控件）
+- [ ] 标尺
+- [x] 画布缩放
+- [ ] 画布移动（注意面板变化时的改动）
+- [ ] 多画布编辑（待设计）
+
+## 元素基础编辑
+
+- [x] 元素删除
+- [x] 元素复制
+- [x] 元素锁定
+- [ ] 元素添加
+- [ ] 多元素批量编辑（多文字设置的时候）
+- [ ] 元素透明度
+- [ ] 元素吸附对齐（移动和缩放）
+- [ ] 元素层级顺序调整
+- [ ] 元素对齐
+- [ ] 元素位置
+
+## 文字编辑
+
+- [ ] 文本编辑（颜色、高亮、字体、字号、加粗、斜体、下划线、删除线、对齐方式）
+- [ ] 行高
+- [ ] 字间距
+- [ ] 段间距
+- [ ] 填充色
+- [ ] 阴影
+- [ ] 字体切换
+- [ ] 文本边框（内边框，外边框）
+- [ ] 边框样式（）
+
+## 图片编辑
+
+- [ ] 滤镜
+- [ ] 着色（蒙版）
+- [ ] 翻转
+- [ ] 边框
+- [ ] 阴影
+- [ ] 裁切
+- [ ] 图片涂抹
+- [ ] 图片适配到背景
+
+## 形状编辑
+
+- [ ] 填充色
+- [ ] 边框
+- [ ] 阴影
+- [ ] 翻转
+- [ ] 编辑文字
+
+## 组编辑
+
+- [ ] 打组
+- [ ] 解组
+- [ ] 组内选择（待定）
+- [ ] 组内文本编辑
+
+## 其他工具
+
+- [ ] 二维码工具
+- [ ] 条形码工具
+- [ ] 头像工具
+- [ ] 表格工具
+- [ ] cmyk
+
+## 左侧面板（跟数据相关）
+
+- [ ] 模板列表
+- [ ] 素材列表
+- [ ] 背景列表
+- [ ] 图层管理
+- [ ] 文字列表
+- [ ] 图形列表
+- [ ] 我的上传
+
+## AI工具
+
+- [ ] 抠图
+- [ ] 美颜美白
+- [ ] 图片修复
+- [ ] 图像风格化
+- [ ] 生图
+- [ ] 改图
+
+## 移动端的支持
+
+- [ ] 双指缩放
+- [ ] 双指旋转
+- [ ] 文本编辑（移动端键盘会影响画布）
+
+## 脚手架支持 - @ydesign/cli
+
+- [ ] 图片编辑器
+- [ ] 全画布编辑器
+- [ ] 书籍编辑器
+- [ ] 图形编辑器
+- [ ] 签名打印编辑器
+- [ ] ...
+
+## 技术文档
+
+- [ ] 体验demo
+- [ ] 各组件功能示例
+- [ ] iframe 接入示例
+- [ ] 自定义布局示例
+- [ ] 自定义样式
+- [ ] 自定义logo

package/dist/app.css

@@ -0,0 +1,2 @@
+@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-gray-200: oklch(92.8% .006 264.531);--color-gray-500: oklch(55.1% .027 264.364);--color-gray-800: oklch(27.8% .033 256.848);--color-white: #fff;--spacing: .25rem;--text-xs: .75rem;--text-xs--line-height: calc(1 / .75);--text-sm: .875rem;--text-sm--line-height: calc(1.25 / .875);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono)}}@layer base{*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings, normal);font-variation-settings:var(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings, normal);font-variation-settings:var(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::placeholder{color:currentcolor;@supports (color: color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.container{width:100%;@media(width>=40rem){max-width:40rem}@media(width>=48rem){max-width:48rem}@media(width>=64rem){max-width:64rem}@media(width>=80rem){max-width:80rem}@media(width>=96rem){max-width:96rem}}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-3{height:calc(var(--spacing) * 3)}.h-full{height:100%}.w-3{width:calc(var(--spacing) * 3)}.w-80{width:calc(var(--spacing) * 80)}.w-\[70px\]{width:70px}.w-full{width:100%}.flex-shrink-0{flex-shrink:0}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.items-center{align-items:center}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing) * 2)}.self-center{align-self:center}.overflow-hidden{overflow:hidden}.border-r-1{border-right-style:var(--tw-border-style);border-right-width:1px}.border-gray-200{border-color:var(--color-gray-200)}.bg-\[\#ecf0f1\]{background-color:#ecf0f1}.fill-white{fill:var(--color-white)}.stroke-gray-200{stroke:var(--color-gray-200)}.py-1{padding-block:calc(var(--spacing) * 1)}.text-left{text-align:left}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading, var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading, var(--text-xs--line-height))}.text-gray-500{color:var(--color-gray-500)}.italic{font-style:italic}.underline{text-decoration-line:underline}.shadow{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-inner{--tw-shadow: inset 0 2px 4px 0 var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.dark\:border-gray-800{@media(prefers-color-scheme:dark){border-color:var(--color-gray-800)}}.dark\:bg-\[\#92969d\]{@media(prefers-color-scheme:dark){background-color:#92969d}}.dark\:fill-\[\#0b0809\]{@media(prefers-color-scheme:dark){fill:#0b0809}}.dark\:stroke-\[\#0b0809\]{@media(prefers-color-scheme:dark){stroke:#0b0809}}.dark\:text-white{@media(prefers-color-scheme:dark){color:var(--color-white)}}}@property --tw-rotate-x{syntax: "*"; inherits: false;}@property --tw-rotate-y{syntax: "*"; inherits: false;}@property --tw-rotate-z{syntax: "*"; inherits: false;}@property --tw-skew-x{syntax: "*"; inherits: false;}@property --tw-skew-y{syntax: "*"; inherits: false;}@property --tw-border-style{syntax: "*"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: "*"; inherits: false;}@property --tw-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: "*"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: "*"; inherits: false;}@property --tw-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: "*"; inherits: false;}@property --tw-inset-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: "*"; inherits: false;}@property --tw-ring-offset-width{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: "*"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-blur{syntax: "*"; inherits: false;}@property --tw-brightness{syntax: "*"; inherits: false;}@property --tw-contrast{syntax: "*"; inherits: false;}@property --tw-grayscale{syntax: "*"; inherits: false;}@property --tw-hue-rotate{syntax: "*"; inherits: false;}@property --tw-invert{syntax: "*"; inherits: false;}@property --tw-opacity{syntax: "*"; inherits: false;}@property --tw-saturate{syntax: "*"; inherits: false;}@property --tw-sepia{syntax: "*"; inherits: false;}@property --tw-drop-shadow{syntax: "*"; inherits: false;}@property --tw-drop-shadow-color{syntax: "*"; inherits: false;}@property --tw-drop-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-drop-shadow-size{syntax: "*"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x: initial;--tw-rotate-y: initial;--tw-rotate-z: initial;--tw-skew-x: initial;--tw-skew-y: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-blur: initial;--tw-brightness: initial;--tw-contrast: initial;--tw-grayscale: initial;--tw-hue-rotate: initial;--tw-invert: initial;--tw-opacity: initial;--tw-saturate: initial;--tw-sepia: initial;--tw-drop-shadow: initial;--tw-drop-shadow-color: initial;--tw-drop-shadow-alpha: 100%;--tw-drop-shadow-size: initial}}}
+/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */

package/dist/app.d.ts

@@ -0,0 +1,13 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as node_modules_styled_components_dist_types from 'node_modules/styled-components/dist/types';
+import * as styled_components from 'styled-components';
+import * as react from 'react';
+
+declare const DesignEditorContainer: node_modules_styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const SidePanelWrap: node_modules_styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const WorkspaceWrap: node_modules_styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const DesignEditorApp: () => react_jsx_runtime.JSX.Element;
+declare const createDesignEditorApp: () => void;
+declare const createDemoApp: () => void;
+
+export { DesignEditorApp, DesignEditorContainer, SidePanelWrap, WorkspaceWrap, createDemoApp, createDesignEditorApp };

package/dist/app.js

@@ -0,0 +1,17 @@
+import"./chunk-O2XFH626.js";import t from"styled-components";import{jsx as r}from"react/jsx-runtime";var e=t.div`
+  display: flex;
+  height: 100%;
+  width: 100%;
+  max-height: 100vh;
+`,l=t.div`
+  height: 100%;
+  width: auto;
+  max-height: 100vh;
+`,d=t.div`
+  display: flex;
+  height: 100%;
+  width: 100%;
+  flex: 1;
+  flex-direction: column;
+  position: relative;
+`,p=()=>r(e,{children:"1231232"}),i=()=>{console.log("createDesignEditorApp")},w=i;export{p as DesignEditorApp,e as DesignEditorContainer,l as SidePanelWrap,d as WorkspaceWrap,w as createDemoApp,i as createDesignEditorApp};

package/dist/canvas/context-menu/context-menu.d.ts

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

package/dist/canvas/hotkeys.d.ts

@@ -0,0 +1,3 @@
+declare const handleHotkeys: () => void;
+
+export { handleHotkeys };

package/dist/canvas/hotkeys.js

@@ -0,0 +1 @@
+import"../chunk-O2XFH626.js";var o=()=>{console.log("handleHotkeys")};export{o as handleHotkeys};

package/dist/canvas/workspace-canvas.d.ts

@@ -0,0 +1,15 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StoreType } from '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+type WorkspaceProps = {
+    store: StoreType;
+    components?: any;
+};
+declare const WorkspaceCanvas: ({ store }: WorkspaceProps) => react_jsx_runtime.JSX.Element;
+declare const _default: (({ store }: WorkspaceProps) => react_jsx_runtime.JSX.Element) & {
+    displayName: string;
+};
+
+export { WorkspaceCanvas, type WorkspaceProps, _default as default };

package/dist/canvas/workspace-canvas.js

@@ -0,0 +1 @@
+import{a,b}from"../chunk-PBQY5UTI.js";import"../chunk-O2XFH626.js";export{a as WorkspaceCanvas,b as default};

package/dist/canvas/workspace.d.ts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { WorkspaceProps } from './workspace-canvas.js';
+import '../model/store.js';
+import 'mobx-state-tree';
+import '@ydesign/core';
+
+declare const Workspace: ({ components, ...restProps }: WorkspaceProps) => react_jsx_runtime.JSX.Element;
+
+export { Workspace, Workspace as default };

package/dist/canvas/workspace.js

@@ -0,0 +1 @@
+import{a as o}from"../chunk-PBQY5UTI.js";import"../chunk-O2XFH626.js";import{jsx as s}from"react/jsx-runtime";var a=({components:p={},...r})=>s(o,{...r,components:p}),c=a;export{a as Workspace,c as default};

package/dist/chunk-2AWYWIIK.js

@@ -0,0 +1 @@
+import{Button as e}from"antd";import{Eraser as r}from"lucide-react";import{jsx as t}from"react/jsx-runtime";var s=()=>t(e,{type:"text",icon:t(r,{size:16,style:{display:"flex"}}),styles:{root:{padding:"0 10px"}},children:"Eraser pen"});export{s as a};

package/dist/chunk-3HQUN5MA.js

@@ -0,0 +1,14 @@
+import{c as u}from"./chunk-JWQ2DUXA.js";import{useState as m,useRef as d,useLayoutEffect as p}from"react";import b from"styled-components";import{OverflowList as v}from"react-overflow-list";import{Ellipsis as h}from"lucide-react";import{Popover as w,Button as y}from"antd";import{jsx as s}from"react/jsx-runtime";var g=b.div`
+  display: flex;
+  height: 50px;
+  align-items: center;
+  float: left;
+  overflow: hidden;
+  max-width: 100%;
+  box-sizing: border-box;
+  user-select: auto;
+
+  ${u(`
+     width: auto !important;
+  `)}
+`,W=({type:a,usedItems:l,components:i})=>{let c=[];return Object.keys(i).forEach(e=>{e.toLowerCase().indexOf(a)===0&&e.toLowerCase()!==a&&(i[e]?l.includes(e)||c.push(e):console.error(`error: Toolbar has invalid React component "${e}"`))}),l.filter(e=>!!e).concat(c)},z=({items:a,itemRender:l})=>{let[i,c]=m(null),e=d(null),f=()=>{if(e.current===null)return;let t=e.current.parentElement;if(!t)return;let r=0;Array.from(t?.children||[]).forEach(o=>{o!==e.current&&(r+=o.offsetWidth)});let n=Math.max(20,t.offsetWidth-r-10);c(o=>o!==n?n:o)};return p(()=>{f();let t=e.current?.parentElement,r=t?.parentElement;if(window.ResizeObserver){let n=new ResizeObserver(f);t&&n.observe(t),r&&n.observe(r);let o=new MutationObserver(f);return t&&o.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style","class"]}),()=>{n.disconnect(),o.disconnect()}}else{let n=setInterval(f,100);return()=>clearInterval(n)}},[]),s(g,{ref:e,style:{width:i??"auto"},className:"bp5-navbar-group bp5-align-left overflow-hidden flex-shrink-0",children:i!==null&&s(v,{className:"gap-2 items-center w-full",collapseFrom:"end",items:a,minVisibleItems:0,itemRenderer:l,overflowRenderer:t=>s(w,{content:s("div",{style:{display:"flex",gap:6},children:t.map(r=>l(r))}),trigger:"click",placement:"bottom",children:s(y,{type:"text",size:"small",onMouseDownCapture:r=>{r.preventDefault()},children:s(h,{})})})},i)})};export{W as a,z as b};

package/dist/chunk-55FJG4FK.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";var p=({store:e})=>(console.log("ShapesPanel",e),o("div",{children:"\u5F62\u72B6"}));export{p as a};

package/dist/chunk-5MWZMSER.js

@@ -0,0 +1 @@
+import{a as f}from"./chunk-2AWYWIIK.js";import{a as u}from"./chunk-U7HIFGXC.js";import{a as c,b as y}from"./chunk-3HQUN5MA.js";import{a as d}from"./chunk-V5RJX32O.js";import{a as I}from"./chunk-GMISU6MD.js";import{a as g,b as l}from"./chunk-EMAFC3HG.js";import{observer as s}from"mobx-react-lite";import{Button as i,Tooltip as k}from"antd";import{Crop as C}from"lucide-react";import{jsx as t}from"react/jsx-runtime";var x={root:{padding:"0 6px"}},F=({element:n,store:e})=>t(i,{type:"text",styles:x,onClick:async()=>{let o=e.width+2*e.bleed,m=e.height+2*e.bleed;console.log("w, h ---> ",o,m);let p=await g(n.getSrc()),r=l({width:o,height:m},p);console.log("cropImg",r)},children:"Fit to page"}),T=s(()=>t(k,{title:"Crop",children:t(i,{type:"text",styles:{root:{padding:"0 7px"}},children:t(C,{size:16})})})),B=s(()=>t(i,{type:"text",styles:x,children:"Apply mask"})),b={ImageFlip:I,ImageFilters:d,ImageFitToBackground:F,ImageCrop:T,ImageClip:B,ImageRemoveBackground:u,ImageEraserPen:f},h=s(({store:n,components:e})=>{let o=n.selectedElements,p=c({type:"text",usedItems:["ImageFlip","ImageFilters","ImageFitToBackground","ImageClip","ImageCrop","ImageRemoveBackground","ImageEraserPen"],components:e});return t(y,{items:p,itemRender:r=>{let a=e[r]||b[r];return a&&t(a,{elements:o,element:o[0],store:n},r)}})}),O=h;export{F as a,T as b,B as c,h as d,O as e};

package/dist/chunk-6LFGFFHI.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";var t=({store:e})=>(console.log("TextPanel",e),o("div",{children:"\u6587\u672C\u9762\u677F"}));export{t as a};

package/dist/chunk-75WC3GVB.js

@@ -0,0 +1 @@
+import{useCallback as l}from"react";var k=({store:e})=>{let c=e.selectedShapes.length>0,o=e.selectedShapes[0]?.locked;return{disabled:!c,lock:l(()=>{e.editor?.lockHandler.lock()},[o,e]),unlock:l(()=>{e.editor?.lockHandler.unlock()},[o,e]),locked:o}};export{k as a};

package/dist/chunk-7LU5UGIG.js

@@ -0,0 +1,16 @@
+import{a as k}from"./chunk-R6Z6F447.js";import{c as h}from"./chunk-TE6HYOIP.js";import{d as E}from"./chunk-5MWZMSER.js";import{a as C}from"./chunk-GYDTKPW5.js";import{a as H}from"./chunk-XRRO2RT7.js";import{a as B}from"./chunk-JW76IC3E.js";import{a as x}from"./chunk-MNACXCF5.js";import{a as v}from"./chunk-XZAP76LL.js";import{b}from"./chunk-B35ZYWID.js";import{a as g}from"./chunk-H67HTXU4.js";import{a as T}from"./chunk-V6ZZKUTN.js";import u from"styled-components";import{useRef as q}from"react";import{Tooltip as N,Button as R}from"antd";import{Undo2 as A,Redo2 as U}from"lucide-react";import{observer as F}from"mobx-react-lite";import{useEffect as M}from"react";import{jsx as n,jsxs as _}from"react/jsx-runtime";var w=F(({store:o})=>(M(()=>{},[o._updateHistory]),_(c,{style:{float:"left",paddingRight:10},children:[n(N,{title:"\u64A4\u9500",placement:"bottom",children:n(R,{type:"text",disabled:!o.editor?.historyHandler.canUndo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.undo()},children:n(A,{size:16})})}),n(N,{title:"\u91CD\u505A",placement:"bottom",children:n(R,{type:"text",disabled:!o.editor?.historyHandler.canRedo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.redo()},children:n(U,{size:16})})})]})));import{observer as J}from"mobx-react-lite";import{Divider as K}from"antd";import{Fragment as X,jsx as e,jsxs as d}from"react/jsx-runtime";var Q=u.div`
+  white-space: nowrap;
+
+  height: 50px;
+  padding: 0 15px;
+  position: relative;
+  width: 100%;
+  z-index: 10;
+`,V=u.div`
+  width: 100%;
+  height: 100%;
+`,c=u.div`
+  align-items: center;
+  display: flex;
+  height: 50px;
+`,s={textbox:h,image:E,many:H};function xo(o,a){s[o]=a}var W=J(({store:o,downloadButtonEnabled:a,components:i={}})=>{let G=new Set(o.selectedElements.map(r=>r?.type)).size===1,P=o.selectedElements.length===1,m=o.selectedElements[0],y=o.selectedElements.length&&o.selectedElements.every(r=>r?.locked),l=P&&s[m?.type];G?l=s[m?.type]:o.selectedElements.length>1&&(l=s.many);let p=q(i);(Object.keys(i).some(r=>i[r]!==p.current[r])||Object.keys(p.current).some(r=>!(r in i)))&&(p.current=Object.assign({},i));let t=p.current,f=t?.ActionControls||(a?b:null),D=t?.Position||x,O=t?.Opacity||B,S=t?.Lock||C,z=t?.Duplicate||g,L=t?.Remove||k,I=t?.History||w,j=t?.Group||T;return e(Q,{className:"bp5-navbar design-toolbar",children:d(V,{children:[e(I,{store:o}),!m&&e(v,{store:o,components:t}),l&&!y&&e(l,{store:o,components:t}),d(c,{style:{float:"right"},children:[e(j,{store:o}),e(D,{store:o}),!y&&e(O,{store:o}),e(S,{store:o}),e(z,{store:o}),e(L,{store:o}),f&&d(X,{children:[e(K,{orientation:"vertical",style:{margin:"0 15px"}}),e(f,{store:o})]})]})]})})}),Bo=W;export{c as a,xo as b,W as c,Bo as d,w as e};

package/dist/chunk-B35ZYWID.js

@@ -0,0 +1 @@
+import{Download as s}from"lucide-react";import{useState as l}from"react";import{Button as d,Popover as g,Slider as m,Select as n}from"antd";import{jsx as t,jsxs as e}from"react/jsx-runtime";var u=({store:i})=>{let[a,r]=l("png"),[p,v]=l(1),[o,c]=l(1);return t(g,{content:e("div",{className:"w-80",children:[e("div",{className:"mb-4",children:[t("div",{style:{marginBottom:"8px"},className:"text-gray-500",children:"File type"}),e(n,{value:a,onChange:r,style:{width:"100%"},children:[t(n.Option,{value:"png",children:"PNG"}),t(n.Option,{value:"jpeg",children:"JPEG"})]})]}),e("div",{className:"mb-4",children:[t("div",{style:{marginBottom:"8px"},className:"text-gray-500",children:"Quality"}),t("div",{style:{padding:"0 15px"},children:t(m,{min:.2,max:1,value:p,step:.2,onChange:v,marks:{.2:"20%",.4:"40%",.6:"60%",.8:"80%",1:"100%"}})})]}),e("div",{className:"mb-4",children:[t("div",{style:{marginBottom:"8px"},className:"text-gray-500",children:"Multiplier"}),t("div",{style:{padding:"0 15px"},children:t(m,{min:.5,max:3,value:o,step:.5,onChange:c,marks:{.5:.5,1:1,1.5:1.5,2:2,2.5:2.5,3:3}})}),e("div",{className:"text-sm text-gray-500 py-1",children:["size\uFF1A",Math.round(i.width*o)," x ",Math.round(i.height*o)," px"]})]}),t("div",{children:e(d,{type:"primary",block:!0,onClick:async()=>{let y=i.toJSON();console.log("\u5BFC\u51FAjson",y),i.saveAsImage({format:a,quality:p,multiplier:o})},icon:t(s,{size:16}),children:["Download ",a.toUpperCase()]})})]}),trigger:"click",children:t(d,{type:"primary",icon:t(s,{size:16}),style:{width:155},children:"Download"})})},w=u;export{u as a,w as b};

package/dist/chunk-DBQHEZPG.js

@@ -0,0 +1 @@
+import{jsx as l}from"react/jsx-runtime";var e=({store:o})=>(console.log("UploadPanel",o),l("div",{children:"\u4E0A\u4F20\u56FE\u7247"})),p=e;export{e as a,p as b};

package/dist/chunk-DJBTBRPS.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";var t=({store:o})=>(console.log("PhotosPanel",o),e("div",{children:"\u56FE\u7247\u9762\u677F"}));export{t as a};

package/dist/chunk-E7ZSWHPU.js

@@ -0,0 +1 @@
+var s=t=>{if(t){if(typeof t=="string")return t;if(typeof t=="object"&&"colorStops"in t&&Array.isArray(t.colorStops))return t.colorStops.map(o=>({color:o.color,percent:o.offset*100}))}},i=()=>{let t="0123456789ABCDEF",o="#";for(let r=0;r<6;r++)o+=t[Math.floor(Math.random()*16)];return o},n=t=>{let o=[];for(let r of t){if(r.type==="group"){let e=n(r.objects);o.push(...e)}r.type==="textbox"&&(o.some(e=>e===r.fontFamily)||o.push(r.fontFamily))}return o},c=new Set(["ellipse","polygon","triangle","rect","line","circle","polyline","path"]);function p(t){return!!t&&c.has(t.type)}export{s as a,i as b,n as c,p as d};

package/dist/chunk-EMAFC3HG.js

@@ -0,0 +1 @@
+function p(o){return new Promise((t,s)=>{let h=new Image;h.onload=()=>{t({width:h.width,height:h.height})},h.onerror=()=>{s(new Error("\u56FE\u7247\u52A0\u8F7D\u5931\u8D25"))},h.src=o,h.crossOrigin="anonymous"})}function e(o,t){console.log(o),console.log(t);let{width:s,height:h}=o,w=s/h,c,r;w>=t.width/t.height?(c=t.width,r=t.width/w):(c=t.height*w,r=t.height);let d=(t.width-c)/2,n=(t.height-r)/2;return{cropX:d/t.width,cropY:n/t.height,cropWidth:c/t.width,cropHeight:r/t.height}}export{p as a,e as b};

package/dist/chunk-FIAIYSJ7.js

@@ -0,0 +1 @@
+import{observer as o}from"mobx-react-lite";import{Popover as e,Button as r}from"antd";import{Pencil as i}from"lucide-react";import{jsx as t}from"react/jsx-runtime";var s=o(()=>t(e,{trigger:"click",content:t("div",{children:"AI write"}),children:t(r,{type:"text",icon:t(i,{size:16,style:{display:"flex"}}),styles:{root:{padding:"0 10px"}},children:"AI write"})}));export{s as a};

package/dist/chunk-GMISU6MD.js

@@ -0,0 +1 @@
+import{Popover as a,Button as p}from"antd";import{Rotate3d as c,FlipHorizontal as n,FlipVertical as y}from"lucide-react";import{useState as d,useEffect as u,useCallback as r}from"react";import{jsx as i,jsxs as b}from"react/jsx-runtime";var X=({element:l,store:e})=>{let[t,o]=d({flipX:!1,flipY:!1}),f=r(()=>{e.editor?.objectsHandler.update({flipX:!t.flipX}),o({...t,flipX:!t.flipX})},[e.editor,t]),s=r(()=>{e.editor?.objectsHandler.update({flipY:!t.flipY}),o({...t,flipY:!t.flipY})},[e.editor,t]);return u(()=>{l&&o({flipX:l.flipX,flipY:l.flipY})},[l]),i(a,{trigger:"click",content:b("div",{style:{width:165},children:[i(p,{type:"text",block:!0,style:{justifyContent:"start"},icon:i(n,{size:16,style:{display:"flex"}}),onClick:f,children:"Flip horizontally"}),i(p,{type:"text",block:!0,style:{justifyContent:"start"},icon:i(y,{size:16,style:{display:"flex"}}),onClick:s,children:"Flip vertically"})]}),children:i(p,{type:"text",icon:i(c,{size:16,style:{display:"flex"}}),styles:{root:{padding:"0 10px"}},children:"Flip"})})};export{X as a};

package/dist/chunk-GYDTKPW5.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk-75WC3GVB.js";import{LockKeyholeOpen as i,LockKeyhole as n}from"lucide-react";import{Tooltip as m,Button as s}from"antd";import{observer as k}from"mobx-react-lite";import{jsx as o}from"react/jsx-runtime";var b=k(({store:r})=>{let{disabled:p,locked:t,lock:c,unlock:l}=e({store:r});return o(m,{title:"Lock",placement:"bottom",children:o(s,{type:"text",styles:{root:{padding:"0 7px"}},disabled:p,onClick:()=>{t?l():c()},children:o(t?n:i,{size:16})})})});export{b as a};

package/dist/chunk-H67HTXU4.js

@@ -0,0 +1 @@
+import{a as o}from"./chunk-JMIN2XMC.js";import{Copy as i}from"lucide-react";import{Tooltip as l,Button as m}from"antd";import{observer as n}from"mobx-react-lite";import{jsx as t}from"react/jsx-runtime";var d=n(({store:e})=>{let{disabled:p,duplicate:r}=o({store:e});return t(l,{title:"Duplicate",placement:"bottom",children:t(m,{type:"text",styles:{root:{padding:"0 7px"}},disabled:p,onClick:()=>{r()},children:t(i,{size:16})})})});export{d as a};

package/dist/chunk-IUFYYEGO.js

@@ -0,0 +1 @@
+import{useCallback as r}from"react";var n=({store:e})=>{let t=e.selectedElements.filter(o=>!o?.locked),l=r(()=>{e.deleteElements(t.map(o=>o.id))},[e,t]);return{disabled:!t.length,remove:l}};export{n as a};

package/dist/chunk-JMIN2XMC.js

@@ -0,0 +1 @@
+import{useCallback as s}from"react";var m=({store:e})=>{let t=e.selectedElements.length>0,l=e.selectedElements.every(n=>n?.locked===!0),c=!t||l,o=s(()=>{e.clone()},[e]);return{disabled:c,duplicate:o}};export{m as a};

package/dist/chunk-JW76IC3E.js

@@ -0,0 +1 @@
+import{Blend as s}from"lucide-react";import{Popover as d,Tooltip as m,Button as c,InputNumber as v,Slider as u}from"antd";import{observer as y}from"mobx-react-lite";import{jsx as t,jsxs as r}from"react/jsx-runtime";var x=y(({store:e})=>{let a=e.selectedShapes.length>0,o=e.selectedShapes[0],i=Math.round(100*o?.opacity),n=p=>{let l=Math.max(0,Math.min(p,100));e.editor?.objectsHandler.update({opacity:l/100})};return t(m,{title:"Opacity",placement:"bottom",children:t(d,{content:r("div",{children:[t("div",{style:{textAlign:"center",marginBottom:10},children:"Transparency"}),r("div",{style:{display:"flex"},children:[t("div",{style:{width:170,paddingRight:20},children:t(u,{min:0,max:100,onChange:n,value:i})}),t(v,{min:0,max:100,value:i,onChange:n,size:"small",styles:{root:{width:65}}})]})]}),trigger:"click",children:t(c,{type:"text",disabled:!a,styles:{root:{padding:"0 7px"}},children:t(s,{size:16})})})})});export{x as a};

package/dist/chunk-JWQ2DUXA.js

@@ -0,0 +1,8 @@
+import{useState as s,useEffect as r}from"react";var o=768,i=()=>window.innerWidth<=o,l=e=>`
+@media (max-width: ${o}px) {
+  ${e}
+  .zhihui-editor-mobile & {
+    ${e}
+  }
+}
+`,a=()=>{let[e,n]=s(i());return r(()=>{let t=()=>{n(i())};return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),e};export{o as a,i as b,l as c,a as d};

package/dist/chunk-LW2W4B2N.js

@@ -0,0 +1,22 @@
+import r from"styled-components";import{jsx as e,jsxs as c}from"react/jsx-runtime";var d=r.div`
+  width: 100%;
+  height: 72px;
+  padding-top: 15px;
+  padding-left: 5px;
+  padding-right: 5px;
+  text-align: center;
+  font-size: 12px;
+  cursor: pointer;
+  white-space: pre;
+
+  .bp5-dark &:hover,
+  .bp5-dark &.active {
+    color: #48aff0 !important;
+  }
+
+  // 这个看到时候可不可以用 变量来实现，需要让用户能配置
+  &:hover,
+  &.active {
+    background-color: oklch(0.488 0.243 264.376 / 20%);
+  }
+`,l=({children:i,name:n,iconSize:o,onClick:t,active:a})=>c(d,{className:`design-side-panel-tab ${a?"active":""}`,onClick:t,children:[e("div",{style:{fontSize:o||14},children:i}),e("div",{style:{paddingTop:3,userSelect:"none"},children:n})]});export{l as a};

package/dist/chunk-M33EDDXB.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";var r=({store:e})=>(console.log("LayersPanel",e),o("div",{children:"\u56FE\u5C42"}));export{r as a};

package/dist/chunk-MNACXCF5.js

@@ -0,0 +1 @@
+import{Layers as x}from"lucide-react";import{Popover as m,Button as n,Divider as o}from"antd";import{observer as r}from"mobx-react-lite";import{ChevronUp as v,ChevronsUp as g,ChevronDown as y,ChevronsDown as k,AlignStartVertical as w,AlignCenterVertical as f,AlignEndVertical as z,AlignStartHorizontal as b,AlignCenterHorizontal as u,AlignEndHorizontal as B,AlignVerticalSpaceAround as C,AlignHorizontalSpaceAround as h}from"lucide-react";import{Fragment as a,jsx as t,jsxs as l}from"react/jsx-runtime";var D=r(({store:e})=>{let d=e.selectedElements.length>0,i=e.selectedElementsIds,s=e.selectedElements.every(p=>p?.locked),c=!s&&e.selectedElements.length>1;return t(m,{styles:{container:{padding:"10px 5px"}},content:l("div",{style:{width:280},children:[t(o,{size:"small",children:"layering"}),l("div",{style:{display:"flex"},children:[l("div",{style:{width:"50%"},children:[t(n,{type:"text",block:!0,icon:t(v,{size:16}),disabled:!e.canMoveElementsUp(i),onClick:()=>{e.moveElementsUp(i)},children:t("span",{className:"w-[70px] text-left text-xs",children:"Forward"})}),t(n,{type:"text",block:!0,icon:t(g,{size:16}),disabled:!e.canMoveElementsTop(i),onClick:()=>{e.moveElementsTop(i)},children:t("span",{className:"w-[70px] text-left text-xs",children:"To Front"})})]}),l("div",{style:{width:"50%"},children:[t(n,{type:"text",block:!0,icon:t(y,{size:16}),disabled:!e.canMoveElementsDown(i),onClick:()=>{e.moveElementsDown(i)},children:t("span",{className:"w-[70px] text-left text-xs",children:"Backward"})}),t(n,{type:"text",block:!0,icon:t(k,{size:16}),disabled:!e.canMoveElementsBottom(i),onClick:()=>{e.moveElementsBottom(i)},children:t("span",{className:"w-[70px] text-left text-xs",children:"To Back"})})]})]}),!s&&l(a,{children:[t(o,{size:"small",children:"Position"}),l("div",{style:{display:"flex"},children:[l("div",{style:{width:"50%"},children:[t(n,{type:"text",block:!0,icon:t(w,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignLeft()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align left"})}),t(n,{type:"text",block:!0,icon:t(f,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignCenter()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align center"})}),t(n,{type:"text",block:!0,icon:t(z,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignRight()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align right"})})]}),l("div",{style:{width:"50%"},children:[t(n,{type:"text",block:!0,icon:t(b,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignTop()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align top"})}),t(n,{type:"text",block:!0,icon:t(u,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignMiddle()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align middle"})}),t(n,{type:"text",block:!0,icon:t(B,{size:16}),onClick:()=>{e.editor?.alignmentHandler.alignBottom()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Align bottom"})})]})]})]}),c&&l(a,{children:[t(o,{size:"small",children:"Space evenly"}),l("div",{style:{display:"flex"},children:[t("div",{style:{width:"50%"},children:t(n,{type:"text",block:!0,icon:t(C,{size:16}),onClick:()=>{e.editor?.alignmentHandler.yequation()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Vertically"})})}),t("div",{style:{width:"50%"},children:t(n,{type:"text",block:!0,icon:t(h,{size:16}),onClick:()=>{e.editor?.alignmentHandler.xequation()},children:t("span",{className:"w-[70px] text-left text-xs",children:"Horizontally"})})})]})]})]}),trigger:"click",placement:"bottom",children:l(n,{type:"text",disabled:!d,styles:{root:{padding:"0 7px"}},children:[t(x,{size:16})," Position"]})})});export{D as a};

package/dist/chunk-O2XFH626.js

@@ -0,0 +1 @@
+var d=Object.defineProperty;var e=(b,a,c)=>a in b?d(b,a,{enumerable:!0,configurable:!0,writable:!0,value:c}):b[a]=c;var f=(b,a,c)=>e(b,typeof a!="symbol"?a+"":a,c);export{f as a};

package/dist/chunk-OQ6HU62L.js

@@ -0,0 +1 @@
+async function l(n){return new Promise((o,r)=>{let e=new FileReader;e.readAsDataURL(n),e.onload=()=>o(e.result),e.onerror=a=>r(a)})}export{l as a};

package/dist/chunk-P5I43V7X.js

@@ -0,0 +1 @@
+async function c(n,t){let e=document.createElement("a"),o=URL.createObjectURL(n);e.href=o,e.download=t,document.body.appendChild(e),e.click(),setTimeout(function(){document.body.removeChild(e),window.URL.revokeObjectURL(o)},0)}export{c as a};

package/dist/chunk-PBQY5UTI.js

@@ -0,0 +1 @@
+import c,{useEffect as r}from"react";import{Editor as d}from"@ydesign/core";import{observer as l}from"mobx-react-lite";import{jsx as o,jsxs as v}from"react/jsx-runtime";var p=({store:e})=>{let i=c.useRef(null);return r(()=>{let s=i.current,{clientHeight:n,clientWidth:a}=s,t=new d({id:"canvas",config:{size:{width:a,height:n},workareaConfig:{width:e.width,height:e.height,background:"rgba(255,255,255,1)"}},container:s,state:{editor:e.editor,activeObject:e.selectedElements,objects:e.objects,zoomRatio:e.scale,setEditor:e._setEditor,setActiveObject:e.selectElements,setObjects:e.setObjects,setZoomRatio:e.setScale}});return e._setEditor(t),e.setupEditorListeners(),window._c=t,()=>{console.log("\u66F4\u65B0 canvas"),t.destroy()}},[]),v("div",{id:"canvas_container",ref:i,style:{flex:1,position:"relative",overflow:"hidden"},className:"bg-[#ecf0f1] dark:bg-[#92969d]",children:[o("div",{className:"inside-shadow w-full h-full shadow-inner",style:{position:"absolute",zIndex:2,pointerEvents:"none"}}),o("div",{style:{position:"absolute",height:"100%",width:"100%"},children:o("canvas",{id:"canvas"})})]})},b=l(p);export{p as a,b};

package/dist/chunk-QJBRJELT.js

@@ -0,0 +1 @@
+import{Button as o}from"antd";import{jsx as l,jsxs as i}from"react/jsx-runtime";var a=({store:t})=>i("div",{onClick:()=>{console.log("TemplatesPanel",t)},style:{display:"flex",flexDirection:"column",gap:10},children:["\u6A21\u677F\u4E2D\u5FC3",l(o,{onClick:()=>{},children:"\u6DFB\u52A0\u6587\u5B57"}),l(o,{onClick:()=>{let e=t.editor?.customCanvas.canvas.getActiveObject();if(e){let{selectionStart:n,selectionEnd:c}=e;n!==c?(console.log("\u6709\u5C40\u90E8\u6587\u5B57\u9009\u4E2D"),e.setSelectionStyles({fill:"red"},n,c)):e.set({fill:"red"}),t.editor?.customCanvas.canvas.requestRenderAll()}},children:"\u8BBE\u7F6E\u5C40\u90E8\u6587\u5B57\u4E3A\u7EA2\u8272"}),l(o,{children:"\u6DFB\u52A0\u56FE\u7247"})]});export{a};

package/dist/chunk-R6Z6F447.js

@@ -0,0 +1 @@
+import{a as t}from"./chunk-IUFYYEGO.js";import{Trash2 as p}from"lucide-react";import{Tooltip as i,Button as s}from"antd";import{observer as l}from"mobx-react-lite";import{jsx as o}from"react/jsx-runtime";var T=l(({store:e})=>{let{disabled:r,remove:m}=t({store:e});return o(i,{title:"Remove",placement:"bottom",children:o(s,{type:"text",styles:{root:{padding:"0 7px"}},disabled:r,onClick:()=>{m()},children:o(p,{size:16})})})});export{T as a};

package/dist/chunk-TE6HYOIP.js

@@ -0,0 +1,7 @@
+import{a as j}from"./chunk-FIAIYSJ7.js";import{a as I,b as H}from"./chunk-3HQUN5MA.js";import{a as B}from"./chunk-V5RJX32O.js";import{a as w,c as z}from"./chunk-E7ZSWHPU.js";import{a as v}from"./chunk-WJT6VPDR.js";import{observer as f}from"mobx-react-lite";import{useEffect as u,useState as y,useCallback as N}from"react";import{ColorPicker as M,Popover as L,Button as m,Input as W,InputNumber as b,Space as G,Slider as A,Tooltip as x}from"antd";import{cssGradient2FabricGradient as O}from"@ydesign/core";import{ChevronDown as E,TextAlignStart as V,TextAlignCenter as _,TextAlignEnd as R,TextAlignJustify as U,Bold as D,Italic as J,Underline as K,Strikethrough as $,ListChevronsUpDown as q,TextWrap as Q}from"lucide-react";import{FixedSizeList as X}from"react-window";import Y from"styled-components";import{jsx as t,jsxs as h}from"react/jsx-runtime";var Z=Y.img`
+  height: 20px;
+
+  .bp5-dark & {
+    filter: invert(1);
+  }
+`,{Search:tt}=W,et=({fontFamily:i,handleClick:n,modifiers:e,store:s,isCustom:c})=>{let[o,d]=y(!c);if(console.log(d,Z),u(()=>{o||s.loadFont(i)},[i,o]),i==="_divider")return t("div",{style:{width:"100%",height:1,background:"#e8e8e8"}});let l=i;return t(m,{type:e.active?"primary":"text",block:!0,style:{justifyContent:"start"},onClick:()=>n(i),disabled:e.disabled,styles:{root:{fontFamily:'"'+i+'"'},content:{textOverflow:"ellipsis",overflow:"hidden",whiteSpace:"nowrap"}},children:l})},nt=({onChange:i,defaultValue:n})=>t(tt,{placeholder:n,allowClear:!0,onChange:e=>{i(e.target.value)},style:{width:210}}),ot=({store:i,fonts:n,activeFont:e,activeFontLabel:s,onFontSelect:c})=>{let[o,d]=y(""),l=n.filter(r=>r.toLowerCase().includes(o.toLowerCase()));return t(L,{content:h("div",{children:[t(nt,{defaultValue:"\u641C\u7D22\u5B57\u4F53",onChange:r=>d(r??"")}),t("div",{style:{paddingTop:5},children:t(X,{itemCount:l.length,itemSize:28,width:210,height:Math.min(400,28*l.length)+10,children:({index:r,style:p})=>{let a=l[r];return t("div",{style:{...p,display:"flex",alignItems:"center",justifyContent:"center"},children:t(et,{fontFamily:a,modifiers:{active:e===a},handleClick:()=>c(a),store:i,isCustom:i.fonts.find(g=>g.fontFamily===a)||v.find(g=>g.fontFamily===a)},a)})}})})]}),trigger:"click",children:t(m,{type:"text",style:{marginRight:5,fontFamily:'"'+e+'"',overflow:"hidden",whiteSpace:"nowrap",maxHeight:30,padding:"0 10px"},icon:t(E,{size:16,style:{display:"flex"}}),iconPlacement:"end",children:s})})},S=["left","center","right","justify"],it=f(({elements:i,store:n})=>{let e=n.fonts.concat(v).map(d=>d.fontFamily),s=i[0].fontFamily;s.length>15&&(s=s.slice(0,15)+"...");let c=z(n.objects),o=[...new Set(c.concat("_divider").concat(e))];return t(ot,{fonts:o,activeFont:i[0].fontFamily,activeFontLabel:s,store:n,onFontSelect:d=>{n.editor?.objectsHandler.setTextStyle({fontFamily:d})}})}),lt=f(({elements:i,store:n})=>{let e=i[0],[s,c]=y(e.fill),o=N(()=>{let{selectionStart:l,selectionEnd:r}=e;if(l!==r&&l!==void 0){let p=e.getSelectionStyles(l,l+1);if(p.length>0&&p[0].fill!==void 0)return p[0].fill}return e.fill},[e]);u(()=>{let l=n.editor?.customCanvas?.canvas;if(!l)return;let r=()=>{c(o())};return l.on("text:selection:changed",r),l.on("text:editing:entered",r),l.on("text:editing:exited",r),c(o()),()=>{l.off("text:selection:changed",r),l.off("text:editing:entered",r),l.off("text:editing:exited",r)}},[n.editor?.customCanvas?.canvas,o]),u(()=>{c(o())},[e,o]);let d=w(s);return t(M,{value:d,allowClear:!0,mode:["single","gradient"],onChangeComplete:l=>{let r=l.toCssString();if(r.includes("gradient")){let p=O(r);n.editor?.objectsHandler.setTextStyle({fill:p})}else n.editor?.objectsHandler.setTextStyle({fill:r});c(o())}})}),rt=f(({elements:i,store:n})=>{let[e,s]=y(i[0].fontSize);u(()=>{s(i[0].fontSize)},[i[0]?.fontSize,n._updateFontSize]);let c=o=>{Number.isNaN(o)||(n.editor?.objectsHandler.setTextStyle({fontSize:Number(o)}),s(Number(o)))};return t(b,{min:5,max:4*n.height,value:Math.round(e),onChange:c,style:{width:70}})}),st=f(({elements:i,store:n})=>{let e=i[0],[s,c]=y(e.textAlign),[o,d]=y(e.fontWeight),[l,r]=y(e.fontStyle),[p,a]=y(e.underline),[g,C]=y(e.linethrough),[T,P]=y(e.splitByGrapheme);return u(()=>{c(e.textAlign),d(e.fontWeight),r(e.fontStyle),a(e.underline),C(e.linethrough),P(e.splitByGrapheme)},[e]),h(G.Compact,{children:[t(x,{placement:"bottom",title:`Text align ${s}`,children:t(m,{type:"text",icon:s==="left"?t(V,{size:16,style:{display:"flex"}}):s==="center"?t(_,{size:16,style:{display:"flex"}}):s==="right"?t(R,{size:16,style:{display:"flex"}}):t(U,{size:16,style:{display:"flex"}}),onClick:()=>{let F=(S.indexOf(s)+1+S.length)%S.length,k=S[F];n.editor?.objectsHandler.setTextStyle({textAlign:k}),c(k)}})}),t(x,{placement:"bottom",title:"Bold",children:t(m,{type:o==="bold"||o==="700"?"primary":"text",icon:t(D,{size:16,style:{display:"flex"}}),onClick:()=>{o==="bold"||o==="700"?(n.editor?.objectsHandler.setTextStyle({fontWeight:"normal"}),d("normal")):(n.editor?.objectsHandler.setTextStyle({fontWeight:"bold"}),d("bold"))}})}),t(x,{placement:"bottom",title:"Italic",children:t(m,{type:l==="italic"?"primary":"text",icon:t(J,{size:16,style:{display:"flex"}}),onClick:()=>{l==="italic"?(n.editor?.objectsHandler.setTextStyle({fontStyle:"normal"}),r("normal")):(n.editor?.objectsHandler.setTextStyle({fontStyle:"italic"}),r("italic"))}})}),t(x,{placement:"bottom",title:"Underline",children:t(m,{type:p?"primary":"text",icon:t(K,{size:16,style:{display:"flex"}}),onClick:()=>{n.editor?.objectsHandler.setTextStyle({underline:!p}),a(!p)}})}),t(x,{placement:"bottom",title:"Strikethrough",children:t(m,{type:g?"primary":"text",icon:t($,{size:16,style:{display:"flex"}}),onClick:()=>{n.editor?.objectsHandler.setTextStyle({linethrough:!g}),C(!g)}})}),t(x,{placement:"bottom",title:"Split by grapheme",children:t(m,{type:T?"primary":"text",icon:t(Q,{size:16,style:{display:"flex"}}),onClick:()=>{n.editor?.objectsHandler.setTextStyle({splitByGrapheme:!T}),P(!T)}})})]})}),at=f(({elements:i,store:n})=>{let e=i[0],s={display:"flex",alignItems:"center",justifyContent:"space-between",paddingTop:"5px",paddingBottom:"5px"},c=typeof e.lineHeight=="number"?100*e.lineHeight:120,[o,d]=y(c),[l,r]=y(e.charSpacing),p=a=>{n.editor?.objectsHandler.setTextStyle(a)};return t(L,{trigger:"click",content:h("div",{style:{padding:"0 6px",width:"230px"},children:[h("div",{style:s,children:[t("div",{children:"Line height"}),t("div",{children:t(b,{min:50,max:250,value:Math.round(o),style:{width:80},onChange:a=>{p({lineHeight:a/100}),d(a)}})})]}),t(A,{value:Math.round(o),min:50,max:250,step:1,onChange:a=>{p({lineHeight:a/100}),d(a)}}),h("div",{style:s,children:[t("div",{children:"Letter spacing"}),t("div",{children:t(b,{min:-50,max:250,value:Math.round(l/10),style:{width:80},onChange:a=>{p({charSpacing:(a??0)*10}),r((a??0)*10)}})})]}),t(A,{value:Math.round(l/10),min:-50,max:250,step:1,onChange:a=>{p({charSpacing:(a??0)*10}),r((a??0)*10)}})]}),children:t(m,{type:"text",icon:t(q,{size:16,style:{display:"flex"}})})})}),ct={TextFill:lt,TextFontFamily:it,TextFontSize:rt,TextFontVariant:st,TextSpacing:at,TextFilters:B,TextAiWrite:j},dt=f(({store:i,components:n})=>{let e=i.selectedElements,c=I({type:"text",usedItems:["TextFill","TextFontFamily","TextFontSize","TextFontVariant","TextSpacing","TextFilters","TextAiWrite"],components:n});return t(H,{items:c,itemRender:o=>{let d=n[o]||ct[o];return d&&t(d,{elements:e,element:e[0],store:i},o)}})}),Ct=dt;export{S as a,dt as b,Ct as c};

package/dist/chunk-TX4BNXQC.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";var r=({store:o})=>(console.log("BackgroundPanel",o),e("div",{children:"\u80CC\u666F"}));export{r as a};

package/dist/chunk-U7HIFGXC.js

@@ -0,0 +1 @@
+import{Button as o}from"antd";import{jsx as t}from"react/jsx-runtime";var n=()=>t(o,{type:"text",styles:{root:{padding:"0 6px"}},children:"Remove background"});export{n as a};

package/dist/chunk-V5RJX32O.js

@@ -0,0 +1 @@
+import{d as $}from"./chunk-E7ZSWHPU.js";import{Popover as pe,Button as ye,Switch as z,Slider as k,InputNumber as h,ColorPicker as ee}from"antd";import{observer as xe}from"mobx-react-lite";import{Sparkles as Ce}from"lucide-react";import{useEffect as He,useState as r}from"react";import{Fragment as W,jsx as a,jsxs as l}from"react/jsx-runtime";var f=(u,c,g)=>Math.max(c,Math.min(g,u)),te={display:"inline-flex",justifyContent:"space-between",width:"100%",padding:6},E={display:"flex",alignItems:"center",justifyContent:"space-between",padding:6},d=({label:u,enabled:c,visible:g=!0,onEnabledChange:M,numberValue:n,min:t,max:v,onNumberValueChange:s,step:F})=>g?l(W,{children:[l("div",{style:{display:"inline-flex",justifyContent:"space-between",width:"100%",padding:"6px"},children:[a("span",{children:u}),a(z,{checked:c,onChange:m=>{M(m)}})]}),c?l("div",{style:{display:"flex",width:"100%",justifyContent:"space-between",marginTop:10,marginBottom:10},children:[a("div",{style:{flex:1},children:a(k,{value:n,onChange:m=>{s(m)},min:t,max:v,step:F})}),a(h,{size:"small",style:{width:60,marginLeft:10},value:n,step:F,onChange:m=>{s(f(m,t,v))}})]}):null]}):null,Ie=xe(({element:u,store:c,elements:g})=>{let n=(g||[u])[0],t=c.editor,v=n?.type==="textbox",s=n?.type==="image",F=$(n);console.log("isImageOrShape ---> ",s||F);let p=t?.imageFiltersHandler.getFilter("blur"),y=t?.imageFiltersHandler.getFilter("brightness"),x=t?.imageFiltersHandler.getFilter("contrast"),C=t?.imageFiltersHandler.getFilter("saturation"),H=t?.imageFiltersHandler.getFilter("vibrance"),V=t?.imageFiltersHandler.getFilter("hueRotation"),w=t?.imageFiltersHandler.getFilter("noise"),S=t?.imageFiltersHandler.getFilter("pixelate"),[ae,I]=r(!!p),[ne,L]=r(p?.blur||.5),[ie,_]=r(!!y),[re,q]=r(y?.brightness||.05),[le,N]=r(!!x),[se,D]=r(x?.contrast||.25),[oe,R]=r(!!C),[be,G]=r(C?.saturation||1),[de,B]=r(!!H),[ce,J]=r(H?.vibrance||1),[me,O]=r(!!V),[ue,K]=r(V?.rotation||-.5),[ge,j]=r(!!w),[he,Q]=r(w?.noise||30),[fe,A]=r(!!S),[ve,U]=r(S?.blocksize||30),[Fe,P]=r(n?.stroke),[X,Y]=r(n?.strokeWidth),[o,Z]=r({enabled:!!n?.shadow,offsetX:n?.shadow?.offsetX||15,offsetY:n?.shadow?.offsetY||15,blur:n?.shadow?.blur||25,color:n?.shadow?.color||"rgba(0,0,0,0.45)",affectStroke:!1,nonScaling:!1,type:"shadow"});He(()=>{P(n?.stroke),Y(n?.strokeWidth),Z({enabled:!!n?.shadow,offsetX:n?.shadow?.offsetX||15,offsetY:n?.shadow?.offsetY||15,blur:n?.shadow?.blur||25,color:n?.shadow?.color||"rgba(0,0,0,0.45)",affectStroke:!1,nonScaling:!1,type:"shadow"}),I(!!p),L(p?.blur||.5),_(!!y),q(y?.brightness||.05),N(!!x),D(x?.contrast||.25),R(!!C),G(C?.saturation||1),B(!!H),J(H?.vibrance||1),O(!!V),K(V?.rotation||-.5),j(!!w),Q(w?.noise||30),A(!!S),U(S?.blocksize||30)},[n]);let T=e=>{t?.objectsHandler.setTextStyle(e)},b=(e,i)=>{Z({...o,[e]:i}),t&&t.objectsHandler.setShadow({...o,[e]:i})};return a(pe,{trigger:"click",content:l("div",{style:{width:"280px",maxHeight:"calc(100vh - 150px)",overflow:"auto"},children:[a(d,{label:"Blur",visible:s,enabled:ae,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"blur",{blur:.5}),I(!0)):(t?.imageFiltersHandler._removeFilter(i,"blur"),I(!1))},min:0,max:1,step:.1,numberValue:ne,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("blur","blur",e),L(e)}}),a(d,{label:"Brightness",visible:s,enabled:ie,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"brightness",{brightness:.05}),_(!0)):(t?.imageFiltersHandler._removeFilter(i,"brightness"),_(!1))},min:-1,max:1,step:.01,numberValue:re,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("brightness","brightness",e),q(e)}}),a(d,{label:"Contrast",visible:s,enabled:le,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"contrast",{contrast:.25}),N(!0)):(t?.imageFiltersHandler._removeFilter(i,"contrast"),N(!1))},min:-1,max:1,step:.01,numberValue:se,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("contrast","contrast",e),D(e)}}),a(d,{label:"Saturation",visible:s,enabled:oe,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"saturation",{saturation:1}),R(!0)):(t?.imageFiltersHandler._removeFilter(i,"saturation"),R(!1))},min:-1,max:1,step:.01,numberValue:be,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("saturation","saturation",e),G(e)}}),a(d,{label:"Vibrance",visible:s,enabled:de,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"vibrance",{vibrance:1}),B(!0)):(t?.imageFiltersHandler._removeFilter(i,"vibrance"),B(!1))},min:-1,max:1,step:.01,numberValue:ce,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("vibrance","vibrance",e),J(e)}}),a(d,{label:"HueRotation",visible:s,enabled:me,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"hueRotation",{rotation:-.5}),O(!0)):(t?.imageFiltersHandler._removeFilter(i,"hueRotation"),O(!1))},min:-1,max:1,step:.01,numberValue:ue,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("hueRotation","rotation",e),K(e)}}),a(d,{label:"Noise",visible:s,enabled:ge,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"noise",{noise:30}),j(!0)):(t?.imageFiltersHandler._removeFilter(i,"noise"),j(!1))},min:0,max:1e3,step:1,numberValue:he,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("noise","noise",e),Q(e)}}),a(d,{label:"Pixelate",visible:s,enabled:fe,onEnabledChange:e=>{let i=n;e?(t?.imageFiltersHandler._createFilter(i,"pixelate",{blocksize:10}),A(!0)):(t?.imageFiltersHandler._removeFilter(i,"pixelate"),A(!1))},min:.01,max:100,step:.01,numberValue:ve,onNumberValueChange:e=>{t?.imageFiltersHandler._changeAttr("pixelate","blocksize",e),U(e)}}),v&&l(W,{children:[l("div",{style:te,children:[a("span",{children:"Text Stroke"}),a(z,{checked:!!X,onChange:e=>{T({strokeWidth:e?10:0,stroke:e?"red":null}),Y(e?10:0),P(e?"red":null)}})]}),!!X&&l("div",{style:{display:"flex",justifyContent:"space-between",padding:"6px"},children:[a(ee,{value:Fe,onChange:e=>{let i=e.toCssString();T({stroke:i}),P(i)}}),a(h,{value:X,onChange:e=>{T({strokeWidth:f(e,1,30)}),Y(f(e,1,30))},style:{width:60},min:1,max:Math.round(n.fontSize/2)})]})]}),l("div",{style:te,children:[a("span",{children:"Shadow"}),a(z,{checked:!!o.enabled,onChange:e=>{b("enabled",e)}})]}),o.enabled&&l(W,{children:[l("div",{style:E,children:[a("div",{children:"Blur"}),a("div",{children:a(h,{value:o.blur,style:{width:60},min:0,max:50,onChange:e=>{b("blur",e)}})})]}),a(k,{value:o.blur,onChange:e=>b("blur",e),min:0,max:50}),l("div",{style:E,children:[a("div",{children:"Offset X"}),a("div",{children:a(h,{value:o.offsetX,style:{width:60},min:-50,max:50,onChange:e=>{b("offsetX",f(e,-50,50))}})})]}),a(k,{value:o.offsetX,onChange:e=>b("offsetX",e),min:-50,max:50}),l("div",{style:E,children:[a("div",{children:"Offset Y"}),a("div",{children:a(h,{value:o.offsetY,style:{width:60},min:-50,max:50,onChange:e=>{b("offsetY",f(e,-50,50))}})})]}),a(k,{value:o.offsetY,onChange:e=>b("offsetY",e),min:-50,max:50}),l("div",{style:E,children:[a("div",{children:"Color"}),a(ee,{defaultFormat:"rgb",value:o.color,onChange:e=>{b("color",e.toRgbString())}})]})]})]}),children:a(ye,{type:"text",icon:a(Ce,{size:16,style:{display:"flex"}}),styles:{root:{padding:"0 10px"}},children:"Effects"})})});export{Ie as a};

package/dist/chunk-V6ZZKUTN.js

@@ -0,0 +1 @@
+import{Button as e}from"antd";import{observer as p}from"mobx-react-lite";import{Fragment as l,jsx as o,jsxs as s}from"react/jsx-runtime";var c=p(({store:t})=>{let n=t.selectedElements.length>1,r=t.selectedElements.length===1&&t.selectedElements[0]?.type==="group";return s(l,{children:[n&&o(e,{type:"text",onClick:()=>{},children:"Group"}),r&&o(e,{type:"text",onClick:()=>{},children:"Ungroup"})]})});export{c as a};

package/dist/chunk-WIM26GEM.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";var r=({store:e})=>(console.log("SizePanel",e),o("div",{children:"\u5C3A\u5BF8\u8C03\u6574"}));export{r as a};