@ydesign/react-editor 0.1.2 → 0.1.4

package/README.md

@@ -1,129 +1,30 @@
-# @ydesign/react-editor
+# Ydesign
 
-> 基于React框架的编辑器
+https://ydesign.com/
 
-## 基础功能
+JS framework for making your own canva-like design editors.
 
-- [ ] 历史记录（撤销、重做）
-- [ ] 快捷键
-- [ ] 右键菜单
-- [ ] 导入PSD
-- [ ] 导入AI文件
-- [ ] 导入PDF
-- [ ] 导入JSON数据
-- [ ] 导出文件（SVG、jpg、png、PDF）
-  - [ ] 整个画布导出
-  - [ ] 指定元素导出
-- [ ] 图层管理
-- [ ] mock数据加载设置
+## Install
 
-## 画布编辑
+```bash
+npm install @ydesign/react-editor
+```
 
-- [ ] 背景设置（纯色、渐变、图片）
-- [ ] 画布尺寸调整控件（画布外框的控件）
-- [ ] 标尺
-- [x] 画布缩放
-- [ ] 画布移动（注意面板变化时的改动）
-- [ ] 多画布编辑（待设计）
+## Demo app
 
-## 元素基础编辑
+```js
+import { createDemoApp } from '@ydesign/react-editor/ydesign-app';
 
-- [x] 元素删除
-- [x] 元素复制
-- [x] 元素锁定
-- [ ] 元素添加
-- [ ] 多元素批量编辑（多文字设置的时候）
-- [ ] 元素透明度
-- [ ] 元素吸附对齐（移动和缩放）
-- [ ] 元素层级顺序调整
-- [ ] 元素对齐
-- [ ] 元素位置
+const { store } = createDemoApp({
+  container: document.getElementById('root'),
+  key: 'YOUR_API_KEY', // you can create it here: https://ydesign.com/cabinet/
+});
+```
 
-## 文字编辑
+## License
 
-- [ ] 文本编辑（颜色、高亮、字体、字号、加粗、斜体、下划线、删除线、对齐方式）
-- [ ] 行高
-- [ ] 字间距
-- [ ] 段间距
-- [ ] 填充色
-- [ ] 阴影
-- [ ] 字体切换
-- [ ] 文本边框（内边框，外边框）
-- [ ] 边框样式（）
+1. You can use this package for free for non-commercial products and local development process.
+2. For commercial usage you have to buy a licence here: https://ydesign.com/
+3. Please respect the copyright.
 
-## 图片编辑
-
-- [ ] 滤镜
-- [ ] 着色（蒙版）
-- [ ] 翻转
-- [ ] 边框
-- [ ] 阴影
-- [ ] 裁切
-- [ ] 图片涂抹
-- [ ] 图片适配到背景
-
-## 形状编辑
-
-- [ ] 填充色
-- [ ] 边框
-- [ ] 阴影
-- [ ] 翻转
-- [ ] 编辑文字
-
-## 组编辑
-
-- [ ] 打组
-- [ ] 解组
-- [ ] 组内选择（待定）
-- [ ] 组内文本编辑
-
-## 其他工具
-
-- [ ] 二维码工具
-- [ ] 条形码工具
-- [ ] 头像工具
-- [ ] 表格工具
-- [ ] cmyk
-
-## 左侧面板（跟数据相关）
-
-- [ ] 模板列表
-- [ ] 素材列表
-- [ ] 背景列表
-- [ ] 图层管理
-- [ ] 文字列表
-- [ ] 图形列表
-- [ ] 我的上传
-
-## AI工具
-
-- [ ] 抠图
-- [ ] 美颜美白
-- [ ] 图片修复
-- [ ] 图像风格化
-- [ ] 生图
-- [ ] 改图
-
-## 移动端的支持
-
-- [ ] 双指缩放
-- [ ] 双指旋转
-- [ ] 文本编辑（移动端键盘会影响画布）
-
-## 脚手架支持 - @ydesign/cli
-
-- [ ] 图片编辑器
-- [ ] 全画布编辑器
-- [ ] 书籍编辑器
-- [ ] 图形编辑器
-- [ ] 签名打印编辑器
-- [ ] ...
-
-## 技术文档
-
-- [ ] 体验demo
-- [ ] 各组件功能示例
-- [ ] iframe 接入示例
-- [ ] 自定义布局示例
-- [ ] 自定义样式
-- [ ] 自定义logo
+For more information take a look into [LICENSE.md](/LICENSE.md).

package/dist/canvas/workspace.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { S as StoreType } from '../store-DfmY1m2j.js';
+import { S as StoreType } from '../store-CgxwnT-h.js';
 import 'fabric';
 import 'mobx-state-tree/dist/internal';
 import 'mobx-state-tree';

package/dist/chunk-3PMUQSBH.js

@@ -0,0 +1 @@
+var o="http://219.151.185.37:9003",a=`${o}/api`,e=()=>o+"/api",r={fontList:()=>({url:`${e()}/fonts`}),templateList:()=>({url:`${e()}/templates/list`}),templateDetail:t=>({url:`${e()}/templates/detail/${t}`}),uploadImage:()=>({url:`${e()}/images/upload`}),psdParse:()=>({url:`${e()}/psd/parser`}),createRecord:t=>({method:"POST",url:`${e()}/record`,data:t}),updateRecord:(t,s)=>({method:"PATCH",url:`${e()}/record/${t}`,data:s}),recordDetail:t=>({url:`${e()}/record/${t}`}),resourcesDetail:t=>({method:"POST",url:`${e()}/resources/detail`,data:{type:"template",id:t}})};var n=()=>r.uploadImage(),l=()=>r.psdParse(),p=t=>r.resourcesDetail(t),c=t=>r.recordDetail(t),i=t=>r.createRecord(t),d=(t,s)=>r.updateRecord(t,s),u=(t,s)=>{r[t]=s};export{n as a,l as b,p as c,c as d,i as e,d as f,u as g};

package/dist/{chunk-RBRSKAZL.js → chunk-AMEXYVS6.js}

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