@ydesign/react-editor 0.0.6 → 0.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,151 @@
1
+ import{b as I,c as p}from"./chunk-5C2MNUBC.js";import{a as y}from"./chunk-MXZ6RXT3.js";import{Modal as Y,Button as ee,ColorPicker as ie,InputNumber as W,Select as te,Tooltip as ne}from"antd";import{Grid2X2 as oe,Star as se,ShoppingBag as ae,FileText as ce,Presentation as re,Share2 as le,Printer as de,ImagePlus as pe,FolderPlus as t,LockKeyholeOpen as he,LockKeyhole as me}from"lucide-react";import{useRef as xe,useState as l,useMemo as R,useCallback as h}from"react";import z from"styled-components";import{jsx as e,jsxs as a}from"react/jsx-runtime";var ge=[{key:"all",label:"\u5168\u90E8",icon:oe},{key:"common",label:"\u5E38\u7528\u5C3A\u5BF8",icon:se},{key:"ecommerce",label:"\u7535\u5546\u7269\u6599",icon:ae},{key:"office",label:"\u884C\u653F\u529E\u516C",icon:ce},{key:"presentation",label:"\u6F14\u793A\u6587\u7A3F",icon:re},{key:"social",label:"\u793E\u4EA4\u5A92\u4F53",icon:le},{key:"print",label:"\u5370\u5237\u7269\u6599",icon:de}],D=[{key:"common",label:"\u5E38\u7528\u5C3A\u5BF8",sizes:[{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"1440x1440px",width:1440,height:1440,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"800x800px",width:800,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u624B\u673A\u6D77\u62A5",desc:"1242x2208px",width:1242,height:2208,unit:"px"},{icon:e(t,{size:24}),name:"\u5C0F\u7EA2\u4E66\u5C01\u9762",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u7AD6\u7248\u89C6\u9891\u5C01\u9762",desc:"1080x1920px",width:1080,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"PPT\uFF0816:9\uFF09",desc:"1920x1080px",width:1920,height:1080,unit:"px"}]},{key:"ecommerce",label:"\u7535\u5546\u7269\u6599",sizes:[{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"1440x1440px",width:1440,height:1440,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"800x800px",width:800,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF083:4\uFF09",desc:"1440x1920px",width:1440,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF083:4\uFF09",desc:"750x1000px",width:750,height:1e3,unit:"px"},{icon:e(t,{size:24}),name:"\u76F4\u64AD\u95F4\u80CC\u666F",desc:"1242x2690px",width:1242,height:2690,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u8BE6\u60C5\u9875",desc:"750x1000px",width:750,height:1e3,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u7AD6\u7248\u6D77\u62A5",desc:"1200x1920px",width:1200,height:1920,unit:"px"}]},{key:"office",label:"\u884C\u653F\u529E\u516C",sizes:[{icon:e(t,{size:24}),name:"\u7B80\u5386",desc:"2480x3507px",width:2480,height:3507,unit:"px"},{icon:e(t,{size:24}),name:"\u5DE5\u724C\u5DE5\u4F5C\u8BC1",desc:"709x1087px",width:709,height:1087,unit:"px"},{icon:e(t,{size:24}),name:"\u5956\u72B6\u8BC1\u4E66",desc:"3437x2550px",width:3437,height:2550,unit:"px"}]},{key:"presentation",label:"\u6F14\u793A\u6587\u7A3F",sizes:[{icon:e(t,{size:24}),name:"PPT\uFF0816:9\uFF09",desc:"1920x1080px",width:1920,height:1080,unit:"px"},{icon:e(t,{size:24}),name:"PPT\uFF084:3\uFF09",desc:"1024x768px",width:1024,height:768,unit:"px"}]},{key:"social",label:"\u793E\u4EA4\u5A92\u4F53",sizes:[{icon:e(t,{size:24}),name:"\u624B\u673A\u6D77\u62A5",desc:"1242x2208px",width:1242,height:2208,unit:"px"},{icon:e(t,{size:24}),name:"\u624B\u673A\u5168\u5C4F\u6D77\u62A5",desc:"1242x2688px",width:1242,height:2688,unit:"px"},{icon:e(t,{size:24}),name:"\u7AD6\u7248\u89C6\u9891\u5C01\u9762",desc:"1080x1920px",width:1080,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"\u6A2A\u7248\u89C6\u9891\u5C01\u9762",desc:"1920x1080px",width:1920,height:1080,unit:"px"},{icon:e(t,{size:24}),name:"\u5C0F\u7EA2\u4E66\u5C01\u9762",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u6296\u97F3\u56FE\u6587\u5E26\u8D27",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u516C\u4F17\u53F7\u9996\u56FE",desc:"900x383px",width:900,height:383,unit:"px"},{icon:e(t,{size:24}),name:"\u516C\u4F17\u53F7\u6B21\u56FE",desc:"900x800px",width:900,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u957F\u56FE\u6D77\u62A5",desc:"800x2000px",width:800,height:2e3,unit:"px"}]},{key:"print",label:"\u5370\u5237\u7269\u6599",sizes:[{icon:e(t,{size:24}),name:"\u4E00\u5BF8\u8BC1\u4EF6\u7167",desc:"23x35mm",width:25,height:35,unit:"mm"},{icon:e(t,{size:24}),name:"\u4E8C\u5BF8\u8BC1\u4EF6\u7167",desc:"35x53mm",width:35,height:53,unit:"mm"},{icon:e(t,{size:24}),name:"1.8\u7C73\u5C55\u67B6",desc:"80x180cm",width:80,height:180,unit:"cm"},{icon:e(t,{size:24}),name:"2m\u6613\u62C9\u5B9D",desc:"80x200cm",width:80,height:200,unit:"cm"},{icon:e(t,{size:24}),name:"\u540D\u7247",desc:"96x60mm",width:96,height:60,unit:"mm"},{icon:e(t,{size:24}),name:"\u4F18\u60E0\u5238",desc:"186x66mm",width:186,height:66,unit:"mm"},{icon:e(t,{size:24}),name:"\u4F20\u5355",desc:"216x291cm",width:216,height:291,unit:"cm"}]}],E=z.div`
2
+ padding: 16px 24px;
3
+ height: 60px;
4
+ flex: 1;
5
+ display: flex;
6
+ cursor: pointer;
7
+ align-items: center;
8
+ border-radius: 8px;
9
+ border: 1px dashed #d0d2d6;
10
+ &:hover {
11
+ background-color: rgba(0, 31, 92, 0.06);
12
+ }
13
+ span {
14
+ margin-left: 8px;
15
+ }
16
+ `,ue=z.div`
17
+ flex: 1;
18
+ margin-left: 14px;
19
+ height: 100%;
20
+
21
+ .createrContentInner {
22
+ margin-bottom: 16px;
23
+ }
24
+
25
+ .scrollbars div:first-child {
26
+ scroll-behavior: smooth;
27
+ }
28
+
29
+ .Widget.categorySection[data-is-folded='false'] .categoryFoldBtn,
30
+ .Widget.categorySection[data-is-multi-row='false'] .categoryFoldBtn {
31
+ display: none;
32
+ }
33
+
34
+ .Widget.categorySection[data-is-folded='true'] ul {
35
+ height: 97px;
36
+ overflow: hidden;
37
+ }
38
+ `,fe=z.div`
39
+ width: 100%;
40
+ height: 100%;
41
+ position: relative;
42
+ padding-top: 16px;
43
+ overflow: hidden;
44
+
45
+ display: flex;
46
+ flex-direction: column;
47
+ align-items: center;
48
+
49
+ border-radius: 8px;
50
+ background-color: #f6f7fa;
51
+
52
+ .canvasSizeName {
53
+ color: #616366;
54
+ font-size: 12px;
55
+ font-weight: 600;
56
+ line-height: 16px;
57
+ margin-top: 8px;
58
+ }
59
+
60
+ .canvasSizeSize {
61
+ height: 14px;
62
+ overflow: hidden;
63
+ width: 100%;
64
+ margin-top: 4px;
65
+
66
+ span {
67
+ color: #abadb2;
68
+ display: block;
69
+ font-size: 20px;
70
+ font-weight: 400;
71
+ height: 200%;
72
+ line-height: 26px;
73
+ text-align: center;
74
+ -webkit-transform: scale(0.5);
75
+ transform: scale(0.5);
76
+ -webkit-transform-origin: top left;
77
+ transform-origin: top left;
78
+ width: 200%;
79
+ }
80
+ }
81
+
82
+ .canvasSizeMask {
83
+ background: rgba(0, 0, 0, 0.25);
84
+ display: none;
85
+ height: 100%;
86
+ left: 0;
87
+ position: absolute;
88
+ top: 0;
89
+ width: 100%;
90
+ }
91
+ .canvasSizeMask,
92
+ .canvasSizeMask button {
93
+ justify-content: center;
94
+ align-items: center;
95
+ }
96
+
97
+ .canvasSizeMask button {
98
+ background-color: #fff;
99
+ width: 66px;
100
+ height: 26px;
101
+ display: flex;
102
+ padding: 0 8px;
103
+ outline: none;
104
+ line-height: 16px;
105
+ font-size: 12px;
106
+ cursor: pointer;
107
+ color: #1c1d1f;
108
+ border-radius: 6px;
109
+ }
110
+ .canvasSizeMask button:active {
111
+ background-color: #f2f2f2;
112
+ }
113
+
114
+ &:hover .canvasSizeMask {
115
+ display: flex;
116
+ }
117
+ `,ye=z.div`
118
+ display: flex;
119
+ margin-top: 20px;
120
+ flex-wrap: wrap;
121
+ align-items: center;
122
+ position: relative;
123
+
124
+ .sizeWarning {
125
+ width: 100%;
126
+ margin-bottom: 8px;
127
+ padding: 4px 8px;
128
+ font-size: 12px;
129
+ color: #ff4d4f;
130
+ background-color: #fff2f0;
131
+ border: 1px solid #ffccc7;
132
+ border-radius: 4px;
133
+ }
134
+
135
+ .Widget.sizeInpueBox {
136
+ display: flex;
137
+ align-items: center;
138
+
139
+ flex: 1;
140
+ }
141
+
142
+ .Widget.sizeInpueBox .sizeInput {
143
+ flex: 1;
144
+ }
145
+ .Widget.sizeInpueBox .linkIcon {
146
+ padding: 8px;
147
+ background-color: #001f5c0f;
148
+ border-radius: 8px;
149
+ margin: 0 4px;
150
+ }
151
+ `,d=72,v=20,b=8e3,Se=({project:M,visible:F,onClose:H,onConfirm:U})=>{let[T,$]=l("all"),B=xe(null),[o,w]=l(null),[s,k]=l(null),[c,_]=l("px"),[r,j]=l(!1),[m,O]=l(1),[x,V]=l("#ffffff"),C=R(()=>o?p({unitVal:o,dpi:d,unit:c}):0,[o,c]),S=R(()=>s?p({unitVal:s,dpi:d,unit:c}):0,[s,c]),N=o!=null&&s!=null&&o>0&&s>0,g=N&&(C>b||S>b),u=N&&(C<v||S<v),P=!N||g||u,L=g?`\u8D85\u51FA\u753B\u5E03\u5C3A\u5BF8\u9650\u5236\uFF1A${b} * ${b} px`:u?`\u4F4E\u4E8E\u753B\u5E03\u5C3A\u5BF8\u9650\u5236\uFF1A${v} * ${v} px`:"",A=h(i=>{w(i),r&&i&&i>0&&k(Math.round(i/m))},[r,m]),X=h(i=>{k(i),r&&i&&i>0&&w(Math.round(i*m))},[r,m]),K=h(()=>{!r&&o&&s&&o>0&&s>0&&O(o/s),j(i=>!i)},[r,o,s]),Z=h(i=>{if(o){let n=p({unitVal:o,dpi:d,unit:c});w(Math.round(I({px:n,dpi:d,unit:i,precious:0})))}if(s){let n=p({unitVal:s,dpi:d,unit:c});k(Math.round(I({px:n,dpi:d,unit:i,precious:0})))}_(i)},[o,s,c]),q=h(()=>{if(P)return;let i=JSON.stringify({bg:{backgroundColor:x}}),n=new URLSearchParams({create:"",createEmptyPoster:"true",createInfo:i,height:String(s),unit:c,width:String(o)});console.log("params \u7684\u53C2\u6570 ---> ",n.toString()),console.log("project ",M.urls.editorUrl),window.open(`${M.urls.editorUrl}?${n.toString()}`,"_blank")},[P,x,S,C,c]),G=i=>{$(i);let n=B.current;if(!n)return;let f=n.querySelector(`[data-category-id="${i}"]`);f&&n.scrollTo({top:f.offsetTop,behavior:"smooth"})},[J,Q]=l(()=>{let i={};return D.forEach(n=>{i[n.key]=n.sizes.length>6}),i});return a(Y,{title:"\u521B\u5EFA\u8BBE\u8BA1",open:F,onCancel:H,footer:null,width:880,mask:{closable:!1},styles:{body:{display:"flex",flex:1,padding:"20px 0",height:"100%"},container:{height:550}},children:[e("div",{className:"createrSideBar",style:{width:140},children:ge.map(i=>a("div",{"data-active":i.key===T,className:y("createrSideBarItem","flex h-[40px] px-2 mb-2 cursor-pointer rounded-md items-center hover:bg-[#f2f2f2] text-[#333]",{"bg-[#1677ff4d] hover:bg-[#1677ff4d]":i.key===T}),onClick:()=>G(i.key),children:[e(i.icon,{size:16,className:"ml-2"}),e("span",{className:"ml-2",children:i.label})]},i.key))}),e(ue,{children:e("div",{className:"scrollbars",style:{position:"relative",overflow:"hidden",width:"100%",height:"100%"},children:e("div",{ref:B,style:{position:"absolute",inset:0,overflow:"scroll"},children:a("div",{className:"createrContentInner",children:[e("div",{"data-category-id":"all"}),a("div",{className:"openBtns flex",children:[a(E,{onClick:()=>{alert("\u56FE\u7247\u6A21\u5F0F\u5F00\u53D1\u4E2D...")},children:[e(pe,{style:{color:"#1677ff"}}),e("span",{children:"\u6253\u5F00\u56FE\u7247"})]}),a(E,{style:{marginLeft:12},onClick:()=>{alert("psd\u5F00\u53D1\u4E2D")},children:[e(t,{style:{color:"#1677ff"}}),e("span",{children:"\u6253\u5F00PSD"})]})]}),D.map(i=>a("div",{className:y("Widget categorySection","mt-6"),"data-category-id":i.key,"data-is-folded":J[i.key]??!1,"data-is-multi-row":i.sizes.length>6,children:[a("div",{className:y("categoryHeader","flex items-center justify-between"),children:[e("div",{className:"categoryTitle text-sm font-semibold",children:i.label}),e("div",{className:"categoryFoldBtn flex items-center cursor-pointer",onClick:()=>Q(n=>({...n,[i.key]:!1})),children:e("span",{className:"text-[#616366]",children:"\u67E5\u770B\u66F4\u591A"})})]}),i.key==="common"&&a(ye,{children:[L&&e("div",{className:"sizeWarning",children:L}),a("div",{className:"Widget sizeInpueBox",children:[e("div",{className:"sizeInput",children:e(W,{prefix:"\u5BBD",value:o,min:0,precision:0,status:g||u?"error":void 0,onChange:A,styles:{actions:{opacity:1,width:24}},style:{width:"100%"}})}),e(ne,{title:r?"\u89E3\u9501\u6BD4\u4F8B":"\u9501\u5B9A\u6BD4\u4F8B",children:e("div",{className:"linkIcon",style:{cursor:"pointer"},onClick:K,children:r?e(me,{size:16}):e(he,{size:16})})}),e("div",{className:"sizeInput",children:e(W,{prefix:"\u9AD8",value:s,min:0,precision:0,status:g||u?"error":void 0,onChange:X,styles:{actions:{opacity:1,width:24}},style:{width:"100%"}})}),e("div",{className:"sizeUnitSelect",style:{width:98,marginLeft:12},children:e(te,{value:c,style:{width:98},onChange:Z,options:[{label:"px \u50CF\u7D20",value:"px"},{label:"cm \u5398\u7C73",value:"cm"},{label:"mm \u6BEB\u7C73",value:"mm"}]})})]}),e("div",{className:"widgets-color-picker",style:{width:98,marginLeft:12},children:e(ie,{mode:"single",format:"hex",value:x,onChange:n=>V(n.toHexString()),styles:{root:{width:98},body:{width:92}}})}),e(ee,{type:"primary",disabled:P,style:{width:98,marginLeft:12},onClick:q,children:"\u521B\u5EFA"})]}),e("ul",{className:"flex mt-4 flex-wrap gap-3",children:i.sizes.map((n,f)=>e("li",{style:{width:"calc((100% - 60px) / 6)",height:97},children:a(fe,{children:[n.icon,e("div",{className:"canvasSizeName",children:n.name}),e("div",{className:"canvasSizeSize",children:e("span",{children:n.desc})}),e("div",{className:"canvasSizeMask",onClick:()=>{U({...n,bgColor:x})},children:e("button",{type:"button",children:"\u521B\u5EFA"})})]})},f))})]},i.key))]})})})})]})};export{Se as a};
@@ -1,4 +1,4 @@
1
- import{a as E}from"./chunk-QX7ZGRSR.js";import{a as R}from"./chunk-TNBL7KOG.js";import{c as k}from"./chunk-4BG4CHIB.js";import{a as x}from"./chunk-KCNKLCD5.js";import{d as S}from"./chunk-LFWKF4C4.js";import{a as N}from"./chunk-2PAJLUQH.js";import{a as w}from"./chunk-XRRO2RT7.js";import{a as H}from"./chunk-OBJ5NZSC.js";import{a as B}from"./chunk-INRJE7VS.js";import{e as n}from"./chunk-HD2T2D4D.js";import{b as h}from"./chunk-HQSM4X2M.js";import{b as C}from"./chunk-N5KI6CPA.js";import{c as u}from"./chunk-ARZMBVXU.js";import f from"styled-components";import{useRef as Q}from"react";import{Tooltip as D,Button as G}from"antd";import{Undo2 as X,Redo2 as _}from"lucide-react";import{observer as q}from"mobx-react-lite";import{useEffect as J}from"react";import{jsx as i,jsxs as K}from"react/jsx-runtime";var P=q(({store:o})=>(J(()=>{},[o._updateHistory]),K(y,{style:{float:"left",paddingRight:10},children:[i(D,{title:u("toolbar.undo"),placement:"bottom",children:i(G,{type:"text",disabled:!o.editor?.historyHandler.canUndo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.undo()},children:i(X,{size:16})})}),i(D,{title:u("toolbar.redo"),placement:"bottom",children:i(G,{type:"text",disabled:!o.editor?.historyHandler.canRedo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.redo()},children:i(_,{size:16})})})]})));import{observer as V}from"mobx-react-lite";import{Button as z,Divider as W,Space as Y}from"antd";import{Check as Z,X as $}from"lucide-react";import{Fragment as no,jsx as e,jsxs as l}from"react/jsx-runtime";var oo=f.div`
1
+ import{a as R}from"./chunk-TNBL7KOG.js";import{c as k}from"./chunk-4BG4CHIB.js";import{d as S}from"./chunk-LFWKF4C4.js";import{a as N}from"./chunk-2PAJLUQH.js";import{a as w}from"./chunk-XRRO2RT7.js";import{a as H}from"./chunk-OBJ5NZSC.js";import{a as E}from"./chunk-QX7ZGRSR.js";import{a as B}from"./chunk-INRJE7VS.js";import{e as n}from"./chunk-HD2T2D4D.js";import{a as x}from"./chunk-KCNKLCD5.js";import{b as C}from"./chunk-HQSM4X2M.js";import{b as h}from"./chunk-N5KI6CPA.js";import{c as u}from"./chunk-ARZMBVXU.js";import f from"styled-components";import{useRef as Q}from"react";import{Tooltip as D,Button as G}from"antd";import{Undo2 as X,Redo2 as _}from"lucide-react";import{observer as q}from"mobx-react-lite";import{useEffect as J}from"react";import{jsx as i,jsxs as K}from"react/jsx-runtime";var P=q(({store:o})=>(J(()=>{},[o._updateHistory]),K(y,{style:{float:"left",paddingRight:10},children:[i(D,{title:u("toolbar.undo"),placement:"bottom",children:i(G,{type:"text",disabled:!o.editor?.historyHandler.canUndo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.undo()},children:i(X,{size:16})})}),i(D,{title:u("toolbar.redo"),placement:"bottom",children:i(G,{type:"text",disabled:!o.editor?.historyHandler.canRedo(),styles:{root:{padding:"0 7px"}},onClick:()=>{o.editor?.historyHandler.redo()},children:i(_,{size:16})})})]})));import{observer as V}from"mobx-react-lite";import{Button as z,Divider as W,Space as Y}from"antd";import{Check as Z,X as $}from"lucide-react";import{Fragment as no,jsx as e,jsxs as l}from"react/jsx-runtime";var oo=f.div`
2
2
  white-space: nowrap;
3
3
 
4
4
  height: 50px;
@@ -13,4 +13,4 @@ import{a as E}from"./chunk-QX7ZGRSR.js";import{a as R}from"./chunk-TNBL7KOG.js";
13
13
  align-items: center;
14
14
  display: flex;
15
15
  height: 50px;
16
- `,eo=({store:o})=>l(Y,{style:{height:50},children:[l(z,{onClick:()=>{o.editor?.imageCropHandler.cropImg.onDeselectEvent()},children:[e(Z,{size:16}),"\u5B8C\u6210"]}),l(z,{onClick:()=>{o.editor?.imageCropHandler.cropCancel()},children:[e($,{size:16}),"\u53D6\u6D88"]})]}),c={textbox:k,image:S,path:n,rect:n,circle:n,ellipse:n,triangle:n,cropimage:eo,many:w};function Go(o,d){c[o]=d}var ro=V(({store:o,downloadButtonEnabled:d,components:p={}})=>{let O=new Set(o.selectedElements.map(r=>r?.type)).size===1,b=o.selectedElements.length===1,a=o.selectedElements[0],g=o.selectedElements.length&&o.selectedElements.every(r=>r?.locked),v=b&&a?.isCropping,s=b&&c[a?.type];O?s=c[a?.type]:o.selectedElements.length>1&&(s=c.many);let m=Q(p);(Object.keys(p).some(r=>p[r]!==m.current[r])||Object.keys(m.current).some(r=>!(r in p)))&&(m.current=Object.assign({},p));let t=m.current,T=t?.ActionControls||(d?h:null),I=t?.Position||E,L=t?.Opacity||H,j=t?.Lock||N,A=t?.Duplicate||B,F=t?.Remove||R,U=t?.History||P,M=t?.Group||x;return e(oo,{className:"bp5-navbar design-toolbar",children:l(to,{children:[!v&&e(U,{store:o}),!a&&e(C,{store:o,components:t}),s&&!g&&e(s,{store:o,components:t}),!v&&l(y,{style:{float:"right"},children:[e(M,{store:o}),e(I,{store:o}),!g&&e(L,{store:o}),e(j,{store:o}),e(A,{store:o}),e(F,{store:o}),T&&l(no,{children:[e(W,{orientation:"vertical",style:{margin:"0 15px"}}),e(T,{store:o})]})]})]})})}),Po=ro;export{y as a,Go as b,ro as c,Po as d,P as e};
16
+ `,eo=({store:o})=>l(Y,{style:{height:50},children:[l(z,{onClick:()=>{o.editor?.imageCropHandler.cropImg.onDeselectEvent()},children:[e(Z,{size:16}),"\u5B8C\u6210"]}),l(z,{onClick:()=>{o.editor?.imageCropHandler.cropCancel()},children:[e($,{size:16}),"\u53D6\u6D88"]})]}),c={textbox:k,image:S,path:n,rect:n,circle:n,ellipse:n,triangle:n,cropimage:eo,many:w};function Go(o,d){c[o]=d}var ro=V(({store:o,downloadButtonEnabled:d,components:p={}})=>{let O=new Set(o.selectedElements.map(r=>r?.type)).size===1,b=o.selectedElements.length===1,a=o.selectedElements[0],g=o.selectedElements.length&&o.selectedElements.every(r=>r?.locked),v=b&&a?.isCropping,s=b&&c[a?.type];O?s=c[a?.type]:o.selectedElements.length>1&&(s=c.many);let m=Q(p);(Object.keys(p).some(r=>p[r]!==m.current[r])||Object.keys(m.current).some(r=>!(r in p)))&&(m.current=Object.assign({},p));let t=m.current,T=t?.ActionControls||(d?C:null),I=t?.Position||E,L=t?.Opacity||H,j=t?.Lock||N,A=t?.Duplicate||B,F=t?.Remove||R,U=t?.History||P,M=t?.Group||x;return e(oo,{className:"bp5-navbar design-toolbar",children:l(to,{children:[!v&&e(U,{store:o}),!a&&e(h,{store:o,components:t}),s&&!g&&e(s,{store:o,components:t}),!v&&l(y,{style:{float:"right"},children:[e(M,{store:o}),e(I,{store:o}),!g&&e(L,{store:o}),e(j,{store:o}),e(A,{store:o}),e(F,{store:o}),T&&l(no,{children:[e(W,{orientation:"vertical",style:{margin:"0 15px"}}),e(T,{store:o})]})]})]})})}),Po=ro;export{y as a,Go as b,ro as c,Po as d,P as e};
@@ -1,4 +1,4 @@
1
- import{a as f}from"./chunk-ISNCNIFJ.js";import{b as y}from"./chunk-NQYSJ5MN.js";import{a as x}from"./chunk-YLXPQ2GI.js";import{a as T}from"./chunk-R452ARGU.js";import{a as h}from"./chunk-OFA6JIQB.js";import{a as g}from"./chunk-IPOZDTK2.js";import{a as o}from"./chunk-4HH3B3W3.js";import{a as u}from"./chunk-FGCLY24Q.js";import{b as P}from"./chunk-XXR5YN2B.js";import{c as p,d as S}from"./chunk-WCHGSVUC.js";import{c as i}from"./chunk-ARZMBVXU.js";import r from"styled-components";import{useRef as v,useLayoutEffect as z}from"react";import{observer as a}from"mobx-react-lite";import{LayoutTemplate as L,TypeOutline as N,Image as M,Shapes as B,Upload as H,Wallpaper as I,Layers as E,ImageUpscale as R}from"lucide-react";import{clsx as U}from"clsx";import{jsx as n,jsxs as c}from"react/jsx-runtime";var $=r.div`
1
+ import{a as h}from"./chunk-OFA6JIQB.js";import{a as g}from"./chunk-IPOZDTK2.js";import{a as o}from"./chunk-4HH3B3W3.js";import{a as u}from"./chunk-FGCLY24Q.js";import{a as f}from"./chunk-ISNCNIFJ.js";import{b as y}from"./chunk-NQYSJ5MN.js";import{b as P}from"./chunk-XXR5YN2B.js";import{a as x}from"./chunk-YLXPQ2GI.js";import{a as T}from"./chunk-R452ARGU.js";import{c as p,d as S}from"./chunk-WCHGSVUC.js";import{c as i}from"./chunk-ARZMBVXU.js";import r from"styled-components";import{useRef as v,useLayoutEffect as z}from"react";import{observer as a}from"mobx-react-lite";import{LayoutTemplate as L,TypeOutline as N,Image as M,Shapes as B,Upload as H,Wallpaper as I,Layers as E,ImageUpscale as R}from"lucide-react";import{clsx as U}from"clsx";import{jsx as n,jsxs as c}from"react/jsx-runtime";var $=r.div`
2
2
  display: flex;
3
3
  height: 100% !important;
4
4
  padding: 0px !important;
@@ -0,0 +1 @@
1
+ import{d as s}from"./chunk-WJT6VPDR.js";import{a as t}from"./chunk-O2XFH626.js";import*as a from"mobx";import{createContext as i,useContext as c}from"react";var l=r=>{try{return localStorage.getItem(r)}catch{return null}},g=(r,e)=>{try{localStorage.setItem(r,e)}catch{}},o=class{constructor({store:e}){t(this,"store");t(this,"id","");t(this,"name","");t(this,"user",{});t(this,"skipSaving",!1);t(this,"cloudEnabled",!1);t(this,"status","saved");t(this,"language",l("ydesign-language")||navigator.language||"en");t(this,"designsLength",0);t(this,"urls",{editorUrl:"/design"});a.makeAutoObservable(this),this.store=e}setLanguage(e){this.language=e,g("ydesign-language",e)}requestSave(){}async firstLoad(e){this.store.loadJSON(e)}async loadById(e){console.log("loadById",e)}updateUrlWithProjectId(){if(!this.id||this.id==="local"){window.history.replaceState({},"","/");return}let e=new URL(window.location.href);new URLSearchParams(e.search).set("id",this.id),window.history.replaceState({},"",`/design/${this.id}`)}async save(){}async getGlobalFont(e){return e?.length?(s(e),e):[]}},u=i(null),m=()=>{let r=c(u);if(!r)throw new Error("useProject must be used within a ProjectProvider");return r},d=r=>new o(r),h=d;export{u as a,m as b,d as c,h as d};
@@ -1 +1 @@
1
- import{a as l}from"./chunk-EN72YNS7.js";import{c as n}from"./chunk-ARZMBVXU.js";import{Dropdown as m,Button as u,Modal as d}from"antd";import{Menu as y,Plus as f,Languages as h,Check as s}from"lucide-react";import{useState as k}from"react";import{observer as b}from"mobx-react-lite";import{Fragment as C,jsx as e,jsxs as S}from"react/jsx-runtime";var{confirm:w}=d,D=b(({store:a,project:t})=>{let[g,r]=k(!1),p=[{label:n("topbar.newDesign"),key:"new_design",icon:e(f,{size:16})},{label:n("topbar.language"),key:"language",icon:e("div",{style:{height:22,display:"flex",alignItems:"center"},children:e(h,{size:16})}),children:[{key:"en",label:"English",onClick:()=>{t.setLanguage("en")},extra:t.language==="en"?e(s,{size:16}):null},{key:"zh",label:"\u4E2D\u6587",onClick:()=>{t.setLanguage("zh")},extra:t.language==="zh"?e(s,{size:16}):null}]}];return S(C,{children:[e(m,{menu:{items:p,onClick:({key:o})=>{o==="new_design"&&r(!0)}},trigger:["click"],styles:{root:{width:188}},children:e(u,{type:"text",children:e(y,{size:16})})}),e(l,{visible:g,onClose:()=>r(!1),onConfirm:o=>{w({title:"\u521B\u5EFA\u8BBE\u8BA1\u540E\uFF0C\u5C06\u65B0\u5EFA\u753B\u5E03\uFF0C\u5F53\u524D\u6D77\u62A5\u5185\u5BB9\u53EF\u5728\u4F5C\u56FE\u8BB0\u5F55\u4E2D\u67E5\u770B\u3002",okText:"\u786E\u5B9A",cancelText:"\u53D6\u6D88",onOk(){console.log("OK"),console.log("size ---> ",o);let c=JSON.stringify({bg:{backgroundColor:o.bgColor}}),i=new URLSearchParams({create:"",createEmptyPoster:"true",createInfo:c,height:String(o.height),unit:o.unit,width:String(o.width)});console.log("params \u7684\u53C2\u6570 ---> ",i.toString()),window.open(`/?${i.toString()}`,"_blank")}})},store:a})]})});export{D as a};
1
+ import{a as l}from"./chunk-7NFXXGU2.js";import{c as n}from"./chunk-ARZMBVXU.js";import{Dropdown as m,Button as u,Modal as d}from"antd";import{Menu as y,Plus as f,Languages as h,Check as s}from"lucide-react";import{useState as k}from"react";import{observer as b}from"mobx-react-lite";import{Fragment as C,jsx as e,jsxs as S}from"react/jsx-runtime";var{confirm:w}=d,D=b(({store:a,project:o})=>{let[g,r]=k(!1),c=[{label:n("topbar.newDesign"),key:"new_design",icon:e(f,{size:16})},{label:n("topbar.language"),key:"language",icon:e("div",{style:{height:22,display:"flex",alignItems:"center"},children:e(h,{size:16})}),children:[{key:"en",label:"English",onClick:()=>{o.setLanguage("en")},extra:o.language==="en"?e(s,{size:16}):null},{key:"zh",label:"\u4E2D\u6587",onClick:()=>{o.setLanguage("zh")},extra:o.language==="zh"?e(s,{size:16}):null}]}];return S(C,{children:[e(m,{menu:{items:c,onClick:({key:t})=>{t==="new_design"&&r(!0)}},trigger:["click"],styles:{root:{width:188}},children:e(u,{type:"text",children:e(y,{size:16})})}),e(l,{visible:g,onClose:()=>r(!1),onConfirm:t=>{w({title:"\u521B\u5EFA\u8BBE\u8BA1\u540E\uFF0C\u5C06\u65B0\u5EFA\u753B\u5E03\uFF0C\u5F53\u524D\u6D77\u62A5\u5185\u5BB9\u53EF\u5728\u4F5C\u56FE\u8BB0\u5F55\u4E2D\u67E5\u770B\u3002",okText:"\u786E\u5B9A",cancelText:"\u53D6\u6D88",onOk(){console.log("OK"),console.log("size ---> ",t);let p=JSON.stringify({bg:{backgroundColor:t.bgColor}}),i=new URLSearchParams({create:"",createEmptyPoster:"true",createInfo:p,height:String(t.height),unit:t.unit,width:String(t.width)});console.log("params \u7684\u53C2\u6570 ---> ",i.toString()),console.log("\u9700\u8981\u8DF3\u8F6C\u7684\u7F16\u8F91\u5668\u5730\u5740",o.urls.editorUrl),window.open(`${o.urls.editorUrl}?${i.toString()}`,"_blank")}})},store:a,project:o})]})});export{D as a};
package/dist/project.d.ts CHANGED
@@ -20,6 +20,9 @@ declare class Project {
20
20
  status: string;
21
21
  language: string;
22
22
  designsLength: number;
23
+ urls: {
24
+ editorUrl: string;
25
+ };
23
26
  constructor({ store }: ProjectOptions);
24
27
  setLanguage(lang: string): void;
25
28
  requestSave(): void;
package/dist/project.js CHANGED
@@ -1 +1 @@
1
- import{a,b,c,d}from"./chunk-ONY3GLGA.js";import"./chunk-WJT6VPDR.js";import"./chunk-O2XFH626.js";export{a as ProjectContext,c as createProject,d as default,b as useProject};
1
+ import{a,b,c,d}from"./chunk-MJ4K2UVU.js";import"./chunk-WJT6VPDR.js";import"./chunk-O2XFH626.js";export{a as ProjectContext,c as createProject,d as default,b as useProject};
@@ -1 +1 @@
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-WHYEXY5V.js";import"../chunk-ISNCNIFJ.js";import"../chunk-NQYSJ5MN.js";import"../chunk-YLXPQ2GI.js";import"../chunk-4LUZF4CB.js";import"../chunk-R452ARGU.js";import"../chunk-OFA6JIQB.js";import"../chunk-IPOZDTK2.js";import{a as o}from"../chunk-4HH3B3W3.js";import"../chunk-FGCLY24Q.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-XXR5YN2B.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-FOMWIGAQ.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.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};
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-JHZNEX6C.js";import"../chunk-OFA6JIQB.js";import"../chunk-IPOZDTK2.js";import{a as o}from"../chunk-4HH3B3W3.js";import"../chunk-FGCLY24Q.js";import"../chunk-ISNCNIFJ.js";import"../chunk-NQYSJ5MN.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-XXR5YN2B.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-YLXPQ2GI.js";import"../chunk-4LUZF4CB.js";import"../chunk-R452ARGU.js";import"../chunk-FOMWIGAQ.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.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};
@@ -1 +1 @@
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-WHYEXY5V.js";import"../chunk-ISNCNIFJ.js";import"../chunk-NQYSJ5MN.js";import"../chunk-YLXPQ2GI.js";import"../chunk-4LUZF4CB.js";import"../chunk-R452ARGU.js";import"../chunk-OFA6JIQB.js";import"../chunk-IPOZDTK2.js";import{a}from"../chunk-4HH3B3W3.js";import"../chunk-FGCLY24Q.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-XXR5YN2B.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-FOMWIGAQ.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.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};
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-JHZNEX6C.js";import"../chunk-OFA6JIQB.js";import"../chunk-IPOZDTK2.js";import{a}from"../chunk-4HH3B3W3.js";import"../chunk-FGCLY24Q.js";import"../chunk-ISNCNIFJ.js";import"../chunk-NQYSJ5MN.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-XXR5YN2B.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-YLXPQ2GI.js";import"../chunk-4LUZF4CB.js";import"../chunk-R452ARGU.js";import"../chunk-FOMWIGAQ.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.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};
@@ -1 +1 @@
1
- import{e as a}from"../chunk-OG4HUTJF.js";import"../chunk-QX7ZGRSR.js";import"../chunk-TNBL7KOG.js";import"../chunk-4BG4CHIB.js";import"../chunk-OA7Z7HNL.js";import"../chunk-KCNKLCD5.js";import"../chunk-LFWKF4C4.js";import"../chunk-TWH7TO5J.js";import"../chunk-4WITBL6X.js";import"../chunk-2PAJLUQH.js";import"../chunk-XRRO2RT7.js";import"../chunk-OBJ5NZSC.js";import"../chunk-INRJE7VS.js";import"../chunk-HD2T2D4D.js";import"../chunk-YOQ663QO.js";import"../chunk-TYHXQPZQ.js";import"../chunk-3TO57JPN.js";import"../chunk-CB23VFSC.js";import"../chunk-IUFYYEGO.js";import"../chunk-HQSM4X2M.js";import"../chunk-MXZ6RXT3.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.js";import"../chunk-WJT6VPDR.js";import"../chunk-JMIN2XMC.js";import"../chunk-75WC3GVB.js";import"../chunk-O2XFH626.js";export{a as HistoryButtons};
1
+ import{e as a}from"../chunk-E7TDNZPC.js";import"../chunk-TNBL7KOG.js";import"../chunk-4BG4CHIB.js";import"../chunk-OA7Z7HNL.js";import"../chunk-LFWKF4C4.js";import"../chunk-TWH7TO5J.js";import"../chunk-4WITBL6X.js";import"../chunk-2PAJLUQH.js";import"../chunk-XRRO2RT7.js";import"../chunk-OBJ5NZSC.js";import"../chunk-QX7ZGRSR.js";import"../chunk-INRJE7VS.js";import"../chunk-HD2T2D4D.js";import"../chunk-YOQ663QO.js";import"../chunk-TYHXQPZQ.js";import"../chunk-KCNKLCD5.js";import"../chunk-3TO57JPN.js";import"../chunk-CB23VFSC.js";import"../chunk-HQSM4X2M.js";import"../chunk-IUFYYEGO.js";import"../chunk-MXZ6RXT3.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.js";import"../chunk-WJT6VPDR.js";import"../chunk-JMIN2XMC.js";import"../chunk-75WC3GVB.js";import"../chunk-O2XFH626.js";export{a as HistoryButtons};
@@ -1 +1 @@
1
- import{a,b,c,d}from"../chunk-OG4HUTJF.js";import"../chunk-QX7ZGRSR.js";import"../chunk-TNBL7KOG.js";import"../chunk-4BG4CHIB.js";import"../chunk-OA7Z7HNL.js";import"../chunk-KCNKLCD5.js";import"../chunk-LFWKF4C4.js";import"../chunk-TWH7TO5J.js";import"../chunk-4WITBL6X.js";import"../chunk-2PAJLUQH.js";import"../chunk-XRRO2RT7.js";import"../chunk-OBJ5NZSC.js";import"../chunk-INRJE7VS.js";import"../chunk-HD2T2D4D.js";import"../chunk-YOQ663QO.js";import"../chunk-TYHXQPZQ.js";import"../chunk-3TO57JPN.js";import"../chunk-CB23VFSC.js";import"../chunk-IUFYYEGO.js";import"../chunk-HQSM4X2M.js";import"../chunk-MXZ6RXT3.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.js";import"../chunk-WJT6VPDR.js";import"../chunk-JMIN2XMC.js";import"../chunk-75WC3GVB.js";import"../chunk-O2XFH626.js";export{a as NavBarGroup,c as Toolbar,d as default,b as registerToolbarComponent};
1
+ import{a,b,c,d}from"../chunk-E7TDNZPC.js";import"../chunk-TNBL7KOG.js";import"../chunk-4BG4CHIB.js";import"../chunk-OA7Z7HNL.js";import"../chunk-LFWKF4C4.js";import"../chunk-TWH7TO5J.js";import"../chunk-4WITBL6X.js";import"../chunk-2PAJLUQH.js";import"../chunk-XRRO2RT7.js";import"../chunk-OBJ5NZSC.js";import"../chunk-QX7ZGRSR.js";import"../chunk-INRJE7VS.js";import"../chunk-HD2T2D4D.js";import"../chunk-YOQ663QO.js";import"../chunk-TYHXQPZQ.js";import"../chunk-KCNKLCD5.js";import"../chunk-3TO57JPN.js";import"../chunk-CB23VFSC.js";import"../chunk-HQSM4X2M.js";import"../chunk-IUFYYEGO.js";import"../chunk-MXZ6RXT3.js";import"../chunk-N5KI6CPA.js";import"../chunk-YRJUN267.js";import"../chunk-RVXI723F.js";import"../chunk-OQ6HU62L.js";import"../chunk-WCHGSVUC.js";import"../chunk-DCGJ6RKU.js";import"../chunk-7NNOHYKX.js";import"../chunk-ARZMBVXU.js";import"../chunk-WJT6VPDR.js";import"../chunk-JMIN2XMC.js";import"../chunk-75WC3GVB.js";import"../chunk-O2XFH626.js";export{a as NavBarGroup,c as Toolbar,d as default,b as registerToolbarComponent};
@@ -1,11 +1,13 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { StoreType } from '../model/store.js';
3
+ import { ProjectType } from '../project.js';
3
4
  import 'fabric';
4
5
  import 'mobx-state-tree/dist/internal';
5
6
  import 'mobx-state-tree';
6
7
  import '@ydesign/core';
7
8
  import '../utils/fonts.js';
8
9
  import 'mobx';
10
+ import 'react';
9
11
 
10
12
  type Size = {
11
13
  name: string;
@@ -17,11 +19,12 @@ type Size = {
17
19
  };
18
20
  interface CreateDesignProps {
19
21
  store: StoreType;
22
+ project: ProjectType;
20
23
  visible: boolean;
21
24
  onClose: () => void;
22
25
  onConfirm: (size: Size) => void;
23
26
  mode?: 'create' | 'open';
24
27
  }
25
- declare const CreateDesign: ({ visible, onClose, onConfirm }: CreateDesignProps) => react_jsx_runtime.JSX.Element;
28
+ declare const CreateDesign: ({ project, visible, onClose, onConfirm }: CreateDesignProps) => react_jsx_runtime.JSX.Element;
26
29
 
27
30
  export { CreateDesign };
@@ -1 +1 @@
1
- import{a}from"../chunk-EN72YNS7.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-O2XFH626.js";export{a as CreateDesign};
1
+ import{a}from"../chunk-7NFXXGU2.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-O2XFH626.js";export{a as CreateDesign};
@@ -1 +1 @@
1
- import{a}from"../chunk-2XCWXNZD.js";import"../chunk-EN72YNS7.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-ARZMBVXU.js";import"../chunk-O2XFH626.js";export{a as FileMenu};
1
+ import{a}from"../chunk-NSUBGMR5.js";import"../chunk-7NFXXGU2.js";import"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import"../chunk-ARZMBVXU.js";import"../chunk-O2XFH626.js";export{a as FileMenu};
@@ -1,4 +1,4 @@
1
- import{a as l}from"../chunk-HQSM4X2M.js";import{a as d}from"../chunk-2XCWXNZD.js";import"../chunk-EN72YNS7.js";import{b as r}from"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import{c as n}from"../chunk-ARZMBVXU.js";import{b as p}from"../chunk-ONY3GLGA.js";import"../chunk-WJT6VPDR.js";import"../chunk-O2XFH626.js";import o from"styled-components";import{observer as s}from"mobx-react-lite";import{Input as m,Tooltip as c,Button as f}from"antd";import{CloudUpload as g}from"lucide-react";import{jsx as t,jsxs as i}from"react/jsx-runtime";var h=o("div")`
1
+ import{a as l}from"../chunk-HQSM4X2M.js";import{a as d}from"../chunk-NSUBGMR5.js";import"../chunk-7NFXXGU2.js";import{b as r}from"../chunk-5C2MNUBC.js";import"../chunk-MXZ6RXT3.js";import{c as n}from"../chunk-ARZMBVXU.js";import{b as p}from"../chunk-MJ4K2UVU.js";import"../chunk-WJT6VPDR.js";import"../chunk-O2XFH626.js";import o from"styled-components";import{observer as s}from"mobx-react-lite";import{Input as m,Tooltip as c,Button as f}from"antd";import{CloudUpload as g}from"lucide-react";import{jsx as t,jsxs as i}from"react/jsx-runtime";var h=o("div")`
2
2
  white-space: nowrap;
3
3
  height: 50px;
4
4
  padding: 0 15px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ydesign/react-editor",
3
- "version": "0.0.6",
3
+ "version": "0.0.7",
4
4
  "description": "设计编辑器UI组件库,基于react版本",
5
5
  "main": "dist/app.js",
6
6
  "module": "dist/app.js",
@@ -1,151 +0,0 @@
1
- import{b as I,c as p}from"./chunk-5C2MNUBC.js";import{a as y}from"./chunk-MXZ6RXT3.js";import{Modal as Q,Button as Y,ColorPicker as ee,InputNumber as L,Select as ie,Tooltip as te}from"antd";import{Grid2X2 as ne,Star as oe,ShoppingBag as se,FileText as ae,Presentation as ce,Share2 as de,Printer as le,ImagePlus as re,FolderPlus as t,LockKeyholeOpen as pe,LockKeyhole as he}from"lucide-react";import{useRef as me,useState as l,useMemo as W,useCallback as h}from"react";import z from"styled-components";import{jsx as e,jsxs as a}from"react/jsx-runtime";var xe=[{key:"all",label:"\u5168\u90E8",icon:ne},{key:"common",label:"\u5E38\u7528\u5C3A\u5BF8",icon:oe},{key:"ecommerce",label:"\u7535\u5546\u7269\u6599",icon:se},{key:"office",label:"\u884C\u653F\u529E\u516C",icon:ae},{key:"presentation",label:"\u6F14\u793A\u6587\u7A3F",icon:ce},{key:"social",label:"\u793E\u4EA4\u5A92\u4F53",icon:de},{key:"print",label:"\u5370\u5237\u7269\u6599",icon:le}],R=[{key:"common",label:"\u5E38\u7528\u5C3A\u5BF8",sizes:[{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"1440x1440px",width:1440,height:1440,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"800x800px",width:800,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u624B\u673A\u6D77\u62A5",desc:"1242x2208px",width:1242,height:2208,unit:"px"},{icon:e(t,{size:24}),name:"\u5C0F\u7EA2\u4E66\u5C01\u9762",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u7AD6\u7248\u89C6\u9891\u5C01\u9762",desc:"1080x1920px",width:1080,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"PPT\uFF0816:9\uFF09",desc:"1920x1080px",width:1920,height:1080,unit:"px"}]},{key:"ecommerce",label:"\u7535\u5546\u7269\u6599",sizes:[{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"1440x1440px",width:1440,height:1440,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF081:1\uFF09",desc:"800x800px",width:800,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF083:4\uFF09",desc:"1440x1920px",width:1440,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u4E3B\u56FE\uFF083:4\uFF09",desc:"750x1000px",width:750,height:1e3,unit:"px"},{icon:e(t,{size:24}),name:"\u76F4\u64AD\u95F4\u80CC\u666F",desc:"1242x2690px",width:1242,height:2690,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u8BE6\u60C5\u9875",desc:"750x1000px",width:750,height:1e3,unit:"px"},{icon:e(t,{size:24}),name:"\u7535\u5546\u7AD6\u7248\u6D77\u62A5",desc:"1200x1920px",width:1200,height:1920,unit:"px"}]},{key:"office",label:"\u884C\u653F\u529E\u516C",sizes:[{icon:e(t,{size:24}),name:"\u7B80\u5386",desc:"2480x3507px",width:2480,height:3507,unit:"px"},{icon:e(t,{size:24}),name:"\u5DE5\u724C\u5DE5\u4F5C\u8BC1",desc:"709x1087px",width:709,height:1087,unit:"px"},{icon:e(t,{size:24}),name:"\u5956\u72B6\u8BC1\u4E66",desc:"3437x2550px",width:3437,height:2550,unit:"px"}]},{key:"presentation",label:"\u6F14\u793A\u6587\u7A3F",sizes:[{icon:e(t,{size:24}),name:"PPT\uFF0816:9\uFF09",desc:"1920x1080px",width:1920,height:1080,unit:"px"},{icon:e(t,{size:24}),name:"PPT\uFF084:3\uFF09",desc:"1024x768px",width:1024,height:768,unit:"px"}]},{key:"social",label:"\u793E\u4EA4\u5A92\u4F53",sizes:[{icon:e(t,{size:24}),name:"\u624B\u673A\u6D77\u62A5",desc:"1242x2208px",width:1242,height:2208,unit:"px"},{icon:e(t,{size:24}),name:"\u624B\u673A\u5168\u5C4F\u6D77\u62A5",desc:"1242x2688px",width:1242,height:2688,unit:"px"},{icon:e(t,{size:24}),name:"\u7AD6\u7248\u89C6\u9891\u5C01\u9762",desc:"1080x1920px",width:1080,height:1920,unit:"px"},{icon:e(t,{size:24}),name:"\u6A2A\u7248\u89C6\u9891\u5C01\u9762",desc:"1920x1080px",width:1920,height:1080,unit:"px"},{icon:e(t,{size:24}),name:"\u5C0F\u7EA2\u4E66\u5C01\u9762",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u6296\u97F3\u56FE\u6587\u5E26\u8D27",desc:"1242x1656px",width:1242,height:1656,unit:"px"},{icon:e(t,{size:24}),name:"\u516C\u4F17\u53F7\u9996\u56FE",desc:"900x383px",width:900,height:383,unit:"px"},{icon:e(t,{size:24}),name:"\u516C\u4F17\u53F7\u6B21\u56FE",desc:"900x800px",width:900,height:800,unit:"px"},{icon:e(t,{size:24}),name:"\u957F\u56FE\u6D77\u62A5",desc:"800x2000px",width:800,height:2e3,unit:"px"}]},{key:"print",label:"\u5370\u5237\u7269\u6599",sizes:[{icon:e(t,{size:24}),name:"\u4E00\u5BF8\u8BC1\u4EF6\u7167",desc:"23x35mm",width:25,height:35,unit:"mm"},{icon:e(t,{size:24}),name:"\u4E8C\u5BF8\u8BC1\u4EF6\u7167",desc:"35x53mm",width:35,height:53,unit:"mm"},{icon:e(t,{size:24}),name:"1.8\u7C73\u5C55\u67B6",desc:"80x180cm",width:80,height:180,unit:"cm"},{icon:e(t,{size:24}),name:"2m\u6613\u62C9\u5B9D",desc:"80x200cm",width:80,height:200,unit:"cm"},{icon:e(t,{size:24}),name:"\u540D\u7247",desc:"96x60mm",width:96,height:60,unit:"mm"},{icon:e(t,{size:24}),name:"\u4F18\u60E0\u5238",desc:"186x66mm",width:186,height:66,unit:"mm"},{icon:e(t,{size:24}),name:"\u4F20\u5355",desc:"216x291cm",width:216,height:291,unit:"cm"}]}],D=z.div`
2
- padding: 16px 24px;
3
- height: 60px;
4
- flex: 1;
5
- display: flex;
6
- cursor: pointer;
7
- align-items: center;
8
- border-radius: 8px;
9
- border: 1px dashed #d0d2d6;
10
- &:hover {
11
- background-color: rgba(0, 31, 92, 0.06);
12
- }
13
- span {
14
- margin-left: 8px;
15
- }
16
- `,ge=z.div`
17
- flex: 1;
18
- margin-left: 14px;
19
- height: 100%;
20
-
21
- .createrContentInner {
22
- margin-bottom: 16px;
23
- }
24
-
25
- .scrollbars div:first-child {
26
- scroll-behavior: smooth;
27
- }
28
-
29
- .Widget.categorySection[data-is-folded='false'] .categoryFoldBtn,
30
- .Widget.categorySection[data-is-multi-row='false'] .categoryFoldBtn {
31
- display: none;
32
- }
33
-
34
- .Widget.categorySection[data-is-folded='true'] ul {
35
- height: 97px;
36
- overflow: hidden;
37
- }
38
- `,ue=z.div`
39
- width: 100%;
40
- height: 100%;
41
- position: relative;
42
- padding-top: 16px;
43
- overflow: hidden;
44
-
45
- display: flex;
46
- flex-direction: column;
47
- align-items: center;
48
-
49
- border-radius: 8px;
50
- background-color: #f6f7fa;
51
-
52
- .canvasSizeName {
53
- color: #616366;
54
- font-size: 12px;
55
- font-weight: 600;
56
- line-height: 16px;
57
- margin-top: 8px;
58
- }
59
-
60
- .canvasSizeSize {
61
- height: 14px;
62
- overflow: hidden;
63
- width: 100%;
64
- margin-top: 4px;
65
-
66
- span {
67
- color: #abadb2;
68
- display: block;
69
- font-size: 20px;
70
- font-weight: 400;
71
- height: 200%;
72
- line-height: 26px;
73
- text-align: center;
74
- -webkit-transform: scale(0.5);
75
- transform: scale(0.5);
76
- -webkit-transform-origin: top left;
77
- transform-origin: top left;
78
- width: 200%;
79
- }
80
- }
81
-
82
- .canvasSizeMask {
83
- background: rgba(0, 0, 0, 0.25);
84
- display: none;
85
- height: 100%;
86
- left: 0;
87
- position: absolute;
88
- top: 0;
89
- width: 100%;
90
- }
91
- .canvasSizeMask,
92
- .canvasSizeMask button {
93
- justify-content: center;
94
- align-items: center;
95
- }
96
-
97
- .canvasSizeMask button {
98
- background-color: #fff;
99
- width: 66px;
100
- height: 26px;
101
- display: flex;
102
- padding: 0 8px;
103
- outline: none;
104
- line-height: 16px;
105
- font-size: 12px;
106
- cursor: pointer;
107
- color: #1c1d1f;
108
- border-radius: 6px;
109
- }
110
- .canvasSizeMask button:active {
111
- background-color: #f2f2f2;
112
- }
113
-
114
- &:hover .canvasSizeMask {
115
- display: flex;
116
- }
117
- `,fe=z.div`
118
- display: flex;
119
- margin-top: 20px;
120
- flex-wrap: wrap;
121
- align-items: center;
122
- position: relative;
123
-
124
- .sizeWarning {
125
- width: 100%;
126
- margin-bottom: 8px;
127
- padding: 4px 8px;
128
- font-size: 12px;
129
- color: #ff4d4f;
130
- background-color: #fff2f0;
131
- border: 1px solid #ffccc7;
132
- border-radius: 4px;
133
- }
134
-
135
- .Widget.sizeInpueBox {
136
- display: flex;
137
- align-items: center;
138
-
139
- flex: 1;
140
- }
141
-
142
- .Widget.sizeInpueBox .sizeInput {
143
- flex: 1;
144
- }
145
- .Widget.sizeInpueBox .linkIcon {
146
- padding: 8px;
147
- background-color: #001f5c0f;
148
- border-radius: 8px;
149
- margin: 0 4px;
150
- }
151
- `,r=72,v=20,b=8e3,Ce=({visible:E,onClose:F,onConfirm:H})=>{let[M,_]=l("all"),B=me(null),[o,w]=l(null),[s,k]=l(null),[c,$]=l("px"),[d,O]=l(!1),[m,U]=l(1),[x,V]=l("#ffffff"),C=W(()=>o?p({unitVal:o,dpi:r,unit:c}):0,[o,c]),S=W(()=>s?p({unitVal:s,dpi:r,unit:c}):0,[s,c]),N=o!=null&&s!=null&&o>0&&s>0,g=N&&(C>b||S>b),u=N&&(C<v||S<v),P=!N||g||u,T=g?`\u8D85\u51FA\u753B\u5E03\u5C3A\u5BF8\u9650\u5236\uFF1A${b} * ${b} px`:u?`\u4F4E\u4E8E\u753B\u5E03\u5C3A\u5BF8\u9650\u5236\uFF1A${v} * ${v} px`:"",A=h(i=>{w(i),d&&i&&i>0&&k(Math.round(i/m))},[d,m]),X=h(i=>{k(i),d&&i&&i>0&&w(Math.round(i*m))},[d,m]),K=h(()=>{!d&&o&&s&&o>0&&s>0&&U(o/s),O(i=>!i)},[d,o,s]),Z=h(i=>{if(o){let n=p({unitVal:o,dpi:r,unit:c});w(Math.round(I({px:n,dpi:r,unit:i,precious:0})))}if(s){let n=p({unitVal:s,dpi:r,unit:c});k(Math.round(I({px:n,dpi:r,unit:i,precious:0})))}$(i)},[o,s,c]),j=h(()=>{if(P)return;let i=JSON.stringify({bg:{backgroundColor:x}}),n=new URLSearchParams({create:"",createEmptyPoster:"true",createInfo:i,height:String(s),unit:c,width:String(o)});window.open(`/?${n.toString()}`,"_blank")},[P,x,S,C,c]),q=i=>{_(i);let n=B.current;if(!n)return;let f=n.querySelector(`[data-category-id="${i}"]`);f&&n.scrollTo({top:f.offsetTop,behavior:"smooth"})},[G,J]=l(()=>{let i={};return R.forEach(n=>{i[n.key]=n.sizes.length>6}),i});return a(Q,{title:"\u521B\u5EFA\u8BBE\u8BA1",open:E,onCancel:F,footer:null,width:880,mask:{closable:!1},styles:{body:{display:"flex",flex:1,padding:"20px 0",height:"100%"},container:{height:550}},children:[e("div",{className:"createrSideBar",style:{width:140},children:xe.map(i=>a("div",{"data-active":i.key===M,className:y("createrSideBarItem","flex h-[40px] px-2 mb-2 cursor-pointer rounded-md items-center hover:bg-[#f2f2f2] text-[#333]",{"bg-[#1677ff4d] hover:bg-[#1677ff4d]":i.key===M}),onClick:()=>q(i.key),children:[e(i.icon,{size:16,className:"ml-2"}),e("span",{className:"ml-2",children:i.label})]},i.key))}),e(ge,{children:e("div",{className:"scrollbars",style:{position:"relative",overflow:"hidden",width:"100%",height:"100%"},children:e("div",{ref:B,style:{position:"absolute",inset:0,overflow:"scroll"},children:a("div",{className:"createrContentInner",children:[e("div",{"data-category-id":"all"}),a("div",{className:"openBtns flex",children:[a(D,{onClick:()=>{alert("\u56FE\u7247\u6A21\u5F0F\u5F00\u53D1\u4E2D...")},children:[e(re,{style:{color:"#1677ff"}}),e("span",{children:"\u6253\u5F00\u56FE\u7247"})]}),a(D,{style:{marginLeft:12},onClick:()=>{alert("psd\u5F00\u53D1\u4E2D")},children:[e(t,{style:{color:"#1677ff"}}),e("span",{children:"\u6253\u5F00PSD"})]})]}),R.map(i=>a("div",{className:y("Widget categorySection","mt-6"),"data-category-id":i.key,"data-is-folded":G[i.key]??!1,"data-is-multi-row":i.sizes.length>6,children:[a("div",{className:y("categoryHeader","flex items-center justify-between"),children:[e("div",{className:"categoryTitle text-sm font-semibold",children:i.label}),e("div",{className:"categoryFoldBtn flex items-center cursor-pointer",onClick:()=>J(n=>({...n,[i.key]:!1})),children:e("span",{className:"text-[#616366]",children:"\u67E5\u770B\u66F4\u591A"})})]}),i.key==="common"&&a(fe,{children:[T&&e("div",{className:"sizeWarning",children:T}),a("div",{className:"Widget sizeInpueBox",children:[e("div",{className:"sizeInput",children:e(L,{prefix:"\u5BBD",value:o,min:0,precision:0,status:g||u?"error":void 0,onChange:A,styles:{actions:{opacity:1,width:24}},style:{width:"100%"}})}),e(te,{title:d?"\u89E3\u9501\u6BD4\u4F8B":"\u9501\u5B9A\u6BD4\u4F8B",children:e("div",{className:"linkIcon",style:{cursor:"pointer"},onClick:K,children:d?e(he,{size:16}):e(pe,{size:16})})}),e("div",{className:"sizeInput",children:e(L,{prefix:"\u9AD8",value:s,min:0,precision:0,status:g||u?"error":void 0,onChange:X,styles:{actions:{opacity:1,width:24}},style:{width:"100%"}})}),e("div",{className:"sizeUnitSelect",style:{width:98,marginLeft:12},children:e(ie,{value:c,style:{width:98},onChange:Z,options:[{label:"px \u50CF\u7D20",value:"px"},{label:"cm \u5398\u7C73",value:"cm"},{label:"mm \u6BEB\u7C73",value:"mm"}]})})]}),e("div",{className:"widgets-color-picker",style:{width:98,marginLeft:12},children:e(ee,{mode:"single",format:"hex",value:x,onChange:n=>V(n.toHexString()),styles:{root:{width:98},body:{width:92}}})}),e(Y,{type:"primary",disabled:P,style:{width:98,marginLeft:12},onClick:j,children:"\u521B\u5EFA"})]}),e("ul",{className:"flex mt-4 flex-wrap gap-3",children:i.sizes.map((n,f)=>e("li",{style:{width:"calc((100% - 60px) / 6)",height:97},children:a(ue,{children:[n.icon,e("div",{className:"canvasSizeName",children:n.name}),e("div",{className:"canvasSizeSize",children:e("span",{children:n.desc})}),e("div",{className:"canvasSizeMask",onClick:()=>{H({...n,bgColor:x})},children:e("button",{type:"button",children:"\u521B\u5EFA"})})]})},f))})]},i.key))]})})})})]})};export{Ce as a};
@@ -1 +0,0 @@
1
- import{d as a}from"./chunk-WJT6VPDR.js";import{a as t}from"./chunk-O2XFH626.js";import*as s from"mobx";import{createContext as i,useContext as c}from"react";var l=r=>{try{return localStorage.getItem(r)}catch{return null}},g=(r,e)=>{try{localStorage.setItem(r,e)}catch{}},o=class{constructor({store:e}){t(this,"store");t(this,"id","");t(this,"name","");t(this,"user",{});t(this,"skipSaving",!1);t(this,"cloudEnabled",!1);t(this,"status","saved");t(this,"language",l("ydesign-language")||navigator.language||"en");t(this,"designsLength",0);s.makeAutoObservable(this),this.store=e}setLanguage(e){this.language=e,g("ydesign-language",e)}requestSave(){}async firstLoad(e){this.store.loadJSON(e)}async loadById(e){console.log("loadById",e)}updateUrlWithProjectId(){if(!this.id||this.id==="local"){window.history.replaceState({},"","/");return}let e=new URL(window.location.href);new URLSearchParams(e.search).set("id",this.id),window.history.replaceState({},"",`/design/${this.id}`)}async save(){}async getGlobalFont(e){return e?.length?(a(e),e):[]}},u=i(null),m=()=>{let r=c(u);if(!r)throw new Error("useProject must be used within a ProjectProvider");return r},p=r=>new o(r),h=p;export{u as a,m as b,p as c,h as d};