@cmmd-center/forge 0.13.87 → 0.13.88
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.
- package/dist/bin.cjs +13 -2
- package/dist/bin.mjs +13 -2
- package/dist/client/assets/{CanvasPanel-Dyho_JDo.js → CanvasPanel-D9NzolmF.js} +3 -3
- package/dist/client/assets/{CompositeItem-DeDhuBZB.js → CompositeItem-DU4kdAw6.js} +2 -2
- package/dist/client/assets/{DiffPanel-LdZieNJf.js → DiffPanel-CYNKb6rV.js} +3 -3
- package/dist/client/assets/{DiffPanel.logic-CU1JloJt.js → DiffPanel.logic-C2oTg0F3.js} +2 -2
- package/dist/client/assets/{DiffWorkerPoolProvider-BMlqcnLd.js → DiffWorkerPoolProvider-D2jrFGJ8.js} +12 -12
- package/dist/client/assets/{PullRequestCodePanel-DUSNwNQ9.js → PullRequestCodePanel-V2Hpw_yq.js} +3 -3
- package/dist/client/assets/{Virtualizer-DZvTW6Dy.js → Virtualizer-CRqhCU4I.js} +2 -2
- package/dist/client/assets/WorkerPoolContext-BwqlIoS2.js +2540 -0
- package/dist/client/assets/{canvasStateStore-DJ_OzrrC.js → canvasStateStore-CBQkAlnK.js} +2 -2
- package/dist/client/assets/{cmmdAuthRedirect-Bqx90tp9.js → cmmdAuthRedirect-CCwq2L-I.js} +2 -2
- package/dist/client/assets/index-BdKqG5iV.js +153 -0
- package/dist/client/assets/index-BvseDV5h.css +1 -0
- package/dist/client/assets/{popover-D20eY2oM.js → popover-DJpPSHsy.js} +2 -2
- package/dist/client/assets/{src-CoTxmdk3.js → src-CF8xm6xH.js} +2 -2
- package/dist/client/assets/{toggle-AqC0QUc1.js → toggle-Bv2GfLGu.js} +2 -2
- package/dist/client/index.html +11 -11
- package/dist/forge-build.json +1 -1
- package/package.json +1 -1
- package/dist/client/assets/WorkerPoolContext-Cqf93ctM.js +0 -2537
- package/dist/client/assets/index-C-3BZaMd.css +0 -1
- package/dist/client/assets/index-CUQ9jU7z.js +0 -153
package/dist/bin.cjs
CHANGED
|
@@ -22535,6 +22535,16 @@ const TerminalFontSize = require_Schema$1.Int.check(require_Schema$1.isGreaterTh
|
|
|
22535
22535
|
const FontFamilyPreference = require_Schema$1.String.check(require_Schema$1.isMaxLength(200));
|
|
22536
22536
|
const AutoSettleAfterDays = require_Schema$1.NullOr(require_Schema$1.Int.check(require_Schema$1.isGreaterThanOrEqualTo(1)).check(require_Schema$1.isLessThanOrEqualTo(90)));
|
|
22537
22537
|
const GlassOpacity = require_Schema$1.Int.check(require_Schema$1.isGreaterThanOrEqualTo(40)).check(require_Schema$1.isLessThanOrEqualTo(100));
|
|
22538
|
+
/**
|
|
22539
|
+
* Interface contrast, in percent of the shipped look. 100 disables mixing;
|
|
22540
|
+
* above it the `--contrast-*` axis in `apps/web/src/index.css` raises text
|
|
22541
|
+
* and border contrast from the semantic roles, below it softens them.
|
|
22542
|
+
* Upstream's axis and bounds, adopted by the token union.
|
|
22543
|
+
*/
|
|
22544
|
+
const AppearanceContrast = require_Schema$1.Int.check(require_Schema$1.isBetween({
|
|
22545
|
+
minimum: 50,
|
|
22546
|
+
maximum: 200
|
|
22547
|
+
}));
|
|
22538
22548
|
const ClientSettingsSchema = require_Schema$1.Struct({
|
|
22539
22549
|
theme: ThemePreference.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed("system"))),
|
|
22540
22550
|
themeId: ThemeId,
|
|
@@ -22550,6 +22560,7 @@ const ClientSettingsSchema = require_Schema$1.Struct({
|
|
|
22550
22560
|
fontSmoothing: require_Schema$1.Boolean.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(true))),
|
|
22551
22561
|
sidebarAutoSettleAfterDays: AutoSettleAfterDays.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(3))),
|
|
22552
22562
|
glassOpacity: GlassOpacity.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(80))),
|
|
22563
|
+
appearanceContrast: AppearanceContrast.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(100))),
|
|
22553
22564
|
confirmThreadArchive: require_Schema$1.Boolean.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(true))),
|
|
22554
22565
|
confirmThreadDelete: require_Schema$1.Boolean.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(true))),
|
|
22555
22566
|
showInteractionModeToggle: require_Schema$1.Boolean.pipe(require_Schema$1.withDecodingDefault(require_Schema$1.succeed(false))),
|
|
@@ -66285,7 +66296,7 @@ function normalizeNumberish(value) {
|
|
|
66285
66296
|
}
|
|
66286
66297
|
//#endregion
|
|
66287
66298
|
//#region package.json
|
|
66288
|
-
var version$1 = "0.13.
|
|
66299
|
+
var version$1 = "0.13.88";
|
|
66289
66300
|
//#endregion
|
|
66290
66301
|
//#region src/sentry.ts
|
|
66291
66302
|
const SERVER_APP_NAME = "forge-server";
|
|
@@ -299352,7 +299363,7 @@ function resolveBuildCommitFromEnv(env) {
|
|
|
299352
299363
|
* environment descriptor down instead of reporting an honest "unknown".
|
|
299353
299364
|
*/
|
|
299354
299365
|
function readBakedBuildCommit() {
|
|
299355
|
-
return "
|
|
299366
|
+
return "60b0a6baf90436ed3291c93ac0273567a58cd02e";
|
|
299356
299367
|
}
|
|
299357
299368
|
async function resolveServerBuildCommit(input) {
|
|
299358
299369
|
if (isFullCommitSha(input.baked)) return input.baked;
|
package/dist/bin.mjs
CHANGED
|
@@ -22352,6 +22352,16 @@ const TerminalFontSize = Int$1.check(isGreaterThanOrEqualTo(8)).check(isLessThan
|
|
|
22352
22352
|
const FontFamilyPreference = String$1.check(isMaxLength(200));
|
|
22353
22353
|
const AutoSettleAfterDays = NullOr(Int$1.check(isGreaterThanOrEqualTo(1)).check(isLessThanOrEqualTo(90)));
|
|
22354
22354
|
const GlassOpacity = Int$1.check(isGreaterThanOrEqualTo(40)).check(isLessThanOrEqualTo(100));
|
|
22355
|
+
/**
|
|
22356
|
+
* Interface contrast, in percent of the shipped look. 100 disables mixing;
|
|
22357
|
+
* above it the `--contrast-*` axis in `apps/web/src/index.css` raises text
|
|
22358
|
+
* and border contrast from the semantic roles, below it softens them.
|
|
22359
|
+
* Upstream's axis and bounds, adopted by the token union.
|
|
22360
|
+
*/
|
|
22361
|
+
const AppearanceContrast = Int$1.check(isBetween({
|
|
22362
|
+
minimum: 50,
|
|
22363
|
+
maximum: 200
|
|
22364
|
+
}));
|
|
22355
22365
|
const DEFAULT_CLIENT_SETTINGS = decodeSync(Struct({
|
|
22356
22366
|
theme: ThemePreference.pipe(withDecodingDefault(succeed("system"))),
|
|
22357
22367
|
themeId: ThemeId,
|
|
@@ -22367,6 +22377,7 @@ const DEFAULT_CLIENT_SETTINGS = decodeSync(Struct({
|
|
|
22367
22377
|
fontSmoothing: Boolean$1.pipe(withDecodingDefault(succeed(true))),
|
|
22368
22378
|
sidebarAutoSettleAfterDays: AutoSettleAfterDays.pipe(withDecodingDefault(succeed(3))),
|
|
22369
22379
|
glassOpacity: GlassOpacity.pipe(withDecodingDefault(succeed(80))),
|
|
22380
|
+
appearanceContrast: AppearanceContrast.pipe(withDecodingDefault(succeed(100))),
|
|
22370
22381
|
confirmThreadArchive: Boolean$1.pipe(withDecodingDefault(succeed(true))),
|
|
22371
22382
|
confirmThreadDelete: Boolean$1.pipe(withDecodingDefault(succeed(true))),
|
|
22372
22383
|
showInteractionModeToggle: Boolean$1.pipe(withDecodingDefault(succeed(false))),
|
|
@@ -65994,7 +66005,7 @@ function normalizeNumberish(value) {
|
|
|
65994
66005
|
}
|
|
65995
66006
|
//#endregion
|
|
65996
66007
|
//#region package.json
|
|
65997
|
-
var version$1 = "0.13.
|
|
66008
|
+
var version$1 = "0.13.88";
|
|
65998
66009
|
//#endregion
|
|
65999
66010
|
//#region src/sentry.ts
|
|
66000
66011
|
const SERVER_APP_NAME = "forge-server";
|
|
@@ -298802,7 +298813,7 @@ function resolveBuildCommitFromEnv(env) {
|
|
|
298802
298813
|
* environment descriptor down instead of reporting an honest "unknown".
|
|
298803
298814
|
*/
|
|
298804
298815
|
function readBakedBuildCommit() {
|
|
298805
|
-
return "
|
|
298816
|
+
return "60b0a6baf90436ed3291c93ac0273567a58cd02e";
|
|
298806
298817
|
}
|
|
298807
298818
|
async function resolveServerBuildCommit(input) {
|
|
298808
298819
|
if (isFullCommitSha(input.baked)) return input.baked;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/jspdf.es.min-Hx4pHu4X.js","assets/rolldown-runtime-hePW80VL.js","assets/preload-helper-Czpn1I53.js","assets/typeof-B5XbjTb1.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{r as e}from"./rolldown-runtime-hePW80VL.js";import{Ha as t,Ua as n,Wa as r}from"./Stream-mUTFnSY9.js";import{Ht as i,Ut as a,Wt as o,d as s,f as c,m as l,n as u,r as d,t as f}from"./popover-D20eY2oM.js";import{on as p,sn as m}from"./CompositeItem-DeDhuBZB.js";import{t as h}from"./preload-helper-Czpn1I53.js";import{_ as g,a as _,c as v,d as y,f as b,g as x,h as S,i as C,l as w,m as T,n as E,o as D,p as O,r as k,s as A,t as j,u as M,v as N,y as P}from"./canvasStateStore-DJ_OzrrC.js";import{t as F}from"./toggle-AqC0QUc1.js";var I=p(`file-code`,[[`path`,{d:`M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z`,key:`1oefj6`}],[`path`,{d:`M14 2v5a1 1 0 0 0 1 1h5`,key:`wfsgrz`}],[`path`,{d:`M10 12.5 8 15l2 2.5`,key:`1tg20x`}],[`path`,{d:`m14 12.5 2 2.5-2 2.5`,key:`yinavb`}]]),ee=p(`folder-open`,[[`path`,{d:`m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2`,key:`usdka0`}]]),L=p(`hexagon`,[[`path`,{d:`M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z`,key:`yt0hxn`}]]),te=p(`image-plus`,[[`path`,{d:`M16 5h6`,key:`1vod17`}],[`path`,{d:`M19 2v6`,key:`4bpg5p`}],[`path`,{d:`M21 11.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7.5`,key:`1ue2ih`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}]]),R=p(`image`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`,key:`1m3agn`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}]]),z=p(`layout-template`,[[`rect`,{width:`18`,height:`7`,x:`3`,y:`3`,rx:`1`,key:`f1a2em`}],[`rect`,{width:`9`,height:`7`,x:`3`,y:`14`,rx:`1`,key:`jqznyg`}],[`rect`,{width:`5`,height:`7`,x:`16`,y:`14`,rx:`1`,key:`q5h2i8`}]]),ne=p(`maximize`,[[`path`,{d:`M8 3H5a2 2 0 0 0-2 2v3`,key:`1dcmit`}],[`path`,{d:`M21 8V5a2 2 0 0 0-2-2h-3`,key:`1e4gt3`}],[`path`,{d:`M3 16v3a2 2 0 0 0 2 2h3`,key:`wsl5sc`}],[`path`,{d:`M16 21h3a2 2 0 0 0 2-2v-3`,key:`18trek`}]]),re=p(`mouse-pointer-2`,[[`path`,{d:`M4.037 4.688a.495.495 0 0 1 .651-.651l16 6.5a.5.5 0 0 1-.063.947l-6.124 1.58a2 2 0 0 0-1.438 1.435l-1.579 6.126a.5.5 0 0 1-.947.063z`,key:`edeuup`}]]),ie=p(`mouse-pointer`,[[`path`,{d:`M12.586 12.586 19 19`,key:`ea5xo7`}],[`path`,{d:`M3.688 3.037a.497.497 0 0 0-.651.651l6.5 15.999a.501.501 0 0 0 .947-.062l1.569-6.083a2 2 0 0 1 1.448-1.479l6.124-1.579a.5.5 0 0 0 .063-.947z`,key:`277e5u`}]]),ae=p(`pen`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}]]),oe=p(`redo-2`,[[`path`,{d:`m15 14 5-5-5-5`,key:`12vg1m`}],[`path`,{d:`M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13`,key:`6uklza`}]]),se=p(`trash`,[[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`,key:`miytrc`}],[`path`,{d:`M3 6h18`,key:`d0wm0j`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`,key:`e791ji`}]]),ce=p(`wand`,[[`path`,{d:`M15 4V2`,key:`z1p9b7`}],[`path`,{d:`M15 16v-2`,key:`px0unx`}],[`path`,{d:`M8 9h2`,key:`1g203m`}],[`path`,{d:`M20 9h2`,key:`19tzq7`}],[`path`,{d:`M17.8 11.8 19 13`,key:`yihg8r`}],[`path`,{d:`M15 9h.01`,key:`x1ddxp`}],[`path`,{d:`M17.8 6.2 19 5`,key:`fd4us0`}],[`path`,{d:`m3 21 9-9`,key:`1jfql5`}],[`path`,{d:`M12.2 6.2 11 5`,key:`i3da3b`}]]),le=p(`zoom-in`,[[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}],[`line`,{x1:`21`,x2:`16.65`,y1:`21`,y2:`16.65`,key:`13gj7c`}],[`line`,{x1:`11`,x2:`11`,y1:`8`,y2:`14`,key:`1vmskp`}],[`line`,{x1:`8`,x2:`14`,y1:`11`,y2:`11`,key:`durymu`}]]),ue=p(`zoom-out`,[[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}],[`line`,{x1:`21`,x2:`16.65`,y1:`21`,y2:`16.65`,key:`13gj7c`}],[`line`,{x1:`8`,x2:`14`,y1:`11`,y2:`11`,key:`durymu`}]]),B=e(r(),1),de=[{id:`instagram-post`,label:`Instagram Post`,category:`Social Media`,width:1080,height:1080},{id:`instagram-story`,label:`Instagram Story`,category:`Social Media`,width:1080,height:1920},{id:`facebook-cover`,label:`Facebook Cover`,category:`Social Media`,width:820,height:312},{id:`linkedin-banner`,label:`LinkedIn Banner`,category:`Social Media`,width:1584,height:396},{id:`twitter-post`,label:`Twitter/X Post`,category:`Social Media`,width:1200,height:675},{id:`youtube-thumbnail`,label:`YouTube Thumbnail`,category:`Social Media`,width:1280,height:720},{id:`presentation`,label:`Presentation 16:9`,category:`Presentation`,width:1920,height:1080},{id:`a4`,label:`A4`,category:`Print`,width:2480,height:3508},{id:`us-letter`,label:`US Letter`,category:`Print`,width:2550,height:3300},{id:`business-card`,label:`Business Card`,category:`Print`,width:1050,height:600},{id:`invoice`,label:`Invoice`,category:`Documents`,width:2480,height:3508}],fe=new Map(de.map(e=>[e.id,e]));[...new Set(de.map(e=>e.category))];function pe(){let e=new Map;for(let t of de){let n=e.get(t.category)??[];n.push(t),e.set(t.category,n)}return e}function me(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)}function he(e,t){let n=URL.createObjectURL(e);me(n,t),URL.revokeObjectURL(n)}function ge(e,t,n,r,i=40){let a=n-i*2,o=r-i*2,s=Math.min(a/e,o/t,1),c=e*s,l=t*s;return{scale:s,offsetX:(n-c)/2,offsetY:(r-l)/2}}function _e(e){return Math.min(e*1.25,5)}function ve(e){return Math.max(e/1.25,.1)}function ye(e,t){return{rect:`Rectangle`,circle:`Circle`,line:`Line`,polygon:`Polygon`,textbox:`Text`,"i-text":`Text`,image:`Image`,path:`Drawing`,group:`Group`}[e]??`Object ${t+1}`}var be=Object.defineProperty,xe=(e,t)=>{let n={};for(var r in e)be(n,r,{get:e[r],enumerable:!0});return t||be(n,Symbol.toStringTag,{value:`Module`}),n};function Se(e){return Se=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},Se(e)}function Ce(e){var t=function(e,t){if(Se(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(Se(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}(e,`string`);return Se(t)==`symbol`?t:t+``}function V(e,t,n){return(t=Ce(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var we=class{constructor(){V(this,`browserShadowBlurConstant`,1),V(this,`DPI`,96),V(this,`devicePixelRatio`,typeof window<`u`?window.devicePixelRatio:1),V(this,`perfLimitSizeTotal`,2097152),V(this,`maxCacheSideLimit`,4096),V(this,`minCacheSideLimit`,256),V(this,`disableStyleCopyPaste`,!1),V(this,`enableGLFiltering`,!0),V(this,`textureSize`,4096),V(this,`forceGLPutImageData`,!1),V(this,`cachesBoundsOfCurve`,!1),V(this,`fontPaths`,{}),V(this,`NUM_FRACTION_DIGITS`,4)}},H=new class extends we{constructor(e){super(),this.configure(e)}configure(e={}){Object.assign(this,e)}addFonts(e={}){this.fontPaths={...this.fontPaths,...e}}removeFonts(e=[]){e.forEach(e=>{delete this.fontPaths[e]})}clearFonts(){this.fontPaths={}}restoreDefaults(e){let t=new we,n=e?.reduce((e,n)=>(e[n]=t[n],e),{})||t;this.configure(n)}},Te=(e,...t)=>console[e](`fabric`,...t),Ee=class extends Error{constructor(e,t){super(`fabric: ${e}`,t)}},De=class extends Ee{constructor(e){super(`${e} 'options.signal' is in 'aborted' state`)}},Oe=class{},ke=class extends Oe{testPrecision(e,t){let n=`precision ${t} float;\nvoid main(){}`,r=e.createShader(e.FRAGMENT_SHADER);return!!r&&(e.shaderSource(r,n),e.compileShader(r),!!e.getShaderParameter(r,e.COMPILE_STATUS))}queryWebGL(e){let t=e.getContext(`webgl`);t&&(this.maxTextureSize=t.getParameter(t.MAX_TEXTURE_SIZE),this.GLPrecision=[`highp`,`mediump`,`lowp`].find(e=>this.testPrecision(t,e)),t.getExtension(`WEBGL_lose_context`).loseContext(),Te(`log`,`WebGL: max texture size ${this.maxTextureSize}`))}isSupported(e){return!!this.maxTextureSize&&this.maxTextureSize>=e}},Ae={},je,Me=()=>je||={document,window,isTouchSupported:`ontouchstart`in window||`ontouchstart`in document||window&&window.navigator&&window.navigator.maxTouchPoints>0,WebGLProbe:new ke,dispose(){},copyPasteData:Ae},Ne=()=>Me().document,Pe=()=>Me().window,Fe=()=>Math.max(H.devicePixelRatio??Pe().devicePixelRatio,1),Ie=new class{constructor(){V(this,`boundsOfCurveCache`,{}),this.charWidthsCache=new Map}getFontCache({fontFamily:e,fontStyle:t,fontWeight:n}){e=e.toLowerCase();let r=this.charWidthsCache;r.has(e)||r.set(e,new Map);let i=r.get(e),a=`${t.toLowerCase()}_${(n+``).toLowerCase()}`;return i.has(a)||i.set(a,new Map),i.get(a)}clearFontCache(e){e?this.charWidthsCache.delete((e||``).toLowerCase()):this.charWidthsCache=new Map}limitDimsByArea(e){let{perfLimitSizeTotal:t}=H,n=Math.sqrt(t*e);return[Math.floor(n),Math.floor(t/n)]}},Le=`7.4.0`;function Re(){}var ze=Math.PI/2,Be=Math.PI/4,Ve=2*Math.PI,He=Math.PI/180,Ue=Object.freeze([1,0,0,1,0,0]),U=`center`,W=`left`,We=`bottom`,Ge=`right`,Ke=`none`,qe=/\r?\n/,Je=`moving`,Ye=`scaling`,Xe=`rotating`,Ze=`rotate`,Qe=`skewing`,$e=`resizing`,et=`modifyPoly`,tt=`changed`,nt=`scale`,rt=`scaleX`,it=`scaleY`,at=`skewX`,ot=`skewY`,st=`fill`,ct=`stroke`,lt=`modified`,ut=`normal`,dt=`json`,G=new class{constructor(){this[dt]=new Map,this.svg=new Map}has(e){return this[dt].has(e)}getClass(e){let t=this[dt].get(e);if(!t)throw new Ee(`No class registered for ${e}`);return t}setClass(e,t){t?this[dt].set(t,e):(this[dt].set(e.type,e),this[dt].set(e.type.toLowerCase(),e))}getSVGClass(e){return this.svg.get(e)}setSVGClass(e,t){this.svg.set(t??e.type.toLowerCase(),e)}},ft=new class extends Array{remove(e){let t=this.indexOf(e);t>-1&&this.splice(t,1)}cancelAll(){let e=this.splice(0);return e.forEach(e=>e.abort()),e}cancelByCanvas(e){if(!e)return[];let t=this.filter(t=>t.target===e||typeof t.target==`object`&&t.target?.canvas===e);return t.forEach(e=>e.abort()),t}cancelByTarget(e){if(!e)return[];let t=this.filter(t=>t.target===e);return t.forEach(e=>e.abort()),t}},pt=class{constructor(){V(this,`__eventListeners`,{})}on(e,t){if(this.__eventListeners||={},typeof e==`object`)return Object.entries(e).forEach(([e,t])=>{this.on(e,t)}),()=>this.off(e);if(t){let n=e;return this.__eventListeners[n]||(this.__eventListeners[n]=[]),this.__eventListeners[n].push(t),()=>this.off(n,t)}return()=>!1}once(e,t){if(typeof e==`object`){let t=[];return Object.entries(e).forEach(([e,n])=>{t.push(this.once(e,n))}),()=>t.forEach(e=>e())}if(t){let n=this.on(e,function(...e){t.call(this,...e),n()});return n}return()=>!1}_removeEventListener(e,t){if(this.__eventListeners[e])if(t){let n=this.__eventListeners[e],r=n.indexOf(t);r>-1&&n.splice(r,1)}else this.__eventListeners[e]=[]}off(e,t){if(this.__eventListeners)if(e===void 0)for(let e in this.__eventListeners)this._removeEventListener(e);else typeof e==`object`?Object.entries(e).forEach(([e,t])=>{this._removeEventListener(e,t)}):this._removeEventListener(e,t)}fire(e,t){if(!this.__eventListeners)return;let n=this.__eventListeners[e]?.concat();if(n)for(let e=0;e<n.length;e++)n[e].call(this,t||{})}},mt=(e,t)=>{let n=e.indexOf(t);return n!==-1&&e.splice(n,1),e},ht=e=>{if(e===0)return 1;switch(Math.abs(e)/ze){case 1:case 3:return 0;case 2:return-1}return Math.cos(e)},gt=e=>{if(e===0)return 0;let t=e/ze,n=Math.sign(e);switch(t){case 1:return n;case 2:return 0;case 3:return-n}return Math.sin(e)},K=class e{constructor(e=0,t=0){typeof e==`object`?(this.x=e.x,this.y=e.y):(this.x=e,this.y=t)}add(t){return new e(this.x+t.x,this.y+t.y)}addEquals(e){return this.x+=e.x,this.y+=e.y,this}scalarAdd(t){return new e(this.x+t,this.y+t)}scalarAddEquals(e){return this.x+=e,this.y+=e,this}subtract(t){return new e(this.x-t.x,this.y-t.y)}subtractEquals(e){return this.x-=e.x,this.y-=e.y,this}scalarSubtract(t){return new e(this.x-t,this.y-t)}scalarSubtractEquals(e){return this.x-=e,this.y-=e,this}multiply(t){return new e(this.x*t.x,this.y*t.y)}scalarMultiply(t){return new e(this.x*t,this.y*t)}scalarMultiplyEquals(e){return this.x*=e,this.y*=e,this}divide(t){return new e(this.x/t.x,this.y/t.y)}scalarDivide(t){return new e(this.x/t,this.y/t)}scalarDivideEquals(e){return this.x/=e,this.y/=e,this}eq(e){return this.x===e.x&&this.y===e.y}lt(e){return this.x<e.x&&this.y<e.y}lte(e){return this.x<=e.x&&this.y<=e.y}gt(e){return this.x>e.x&&this.y>e.y}gte(e){return this.x>=e.x&&this.y>=e.y}lerp(t,n=.5){return n=Math.max(Math.min(1,n),0),new e(this.x+(t.x-this.x)*n,this.y+(t.y-this.y)*n)}distanceFrom(e){let t=this.x-e.x,n=this.y-e.y;return Math.sqrt(t*t+n*n)}midPointFrom(e){return this.lerp(e)}min(t){return new e(Math.min(this.x,t.x),Math.min(this.y,t.y))}max(t){return new e(Math.max(this.x,t.x),Math.max(this.y,t.y))}toString(){return`${this.x},${this.y}`}setXY(e,t){return this.x=e,this.y=t,this}setX(e){return this.x=e,this}setY(e){return this.y=e,this}setFromPoint(e){return this.x=e.x,this.y=e.y,this}swap(e){let t=this.x,n=this.y;this.x=e.x,this.y=e.y,e.x=t,e.y=n}clone(){return new e(this.x,this.y)}rotate(t,n=_t){let r=gt(t),i=ht(t),a=this.subtract(n);return new e(a.x*i-a.y*r,a.x*r+a.y*i).add(n)}transform(t,n=!1){return new e(t[0]*this.x+t[2]*this.y+(n?0:t[4]),t[1]*this.x+t[3]*this.y+(n?0:t[5]))}},_t=new K(0,0),vt=e=>!!e&&Array.isArray(e._objects);function yt(e){class t extends e{constructor(...e){super(...e),V(this,`_objects`,[])}_onObjectAdded(e){}_onObjectRemoved(e){}_onStackOrderChanged(e){}add(...e){let t=this._objects.push(...e);return e.forEach(e=>this._onObjectAdded(e)),t}insertAt(e,...t){return this._objects.splice(e,0,...t),t.forEach(e=>this._onObjectAdded(e)),this._objects.length}remove(...e){let t=this._objects,n=[];return e.forEach(e=>{let r=t.indexOf(e);r!==-1&&(t.splice(r,1),n.push(e),this._onObjectRemoved(e))}),n}forEachObject(e){this.getObjects().forEach((t,n,r)=>e(t,n,r))}getObjects(...e){return e.length===0?[...this._objects]:this._objects.filter(t=>t.isType(...e))}item(e){return this._objects[e]}isEmpty(){return this._objects.length===0}size(){return this._objects.length}contains(e,n){return!!this._objects.includes(e)||!!n&&this._objects.some(n=>n instanceof t&&n.contains(e,!0))}complexity(){return this._objects.reduce((e,t)=>e+=t.complexity?t.complexity():0,0)}sendObjectToBack(e){return!(!e||e===this._objects[0])&&(mt(this._objects,e),this._objects.unshift(e),this._onStackOrderChanged(e),!0)}bringObjectToFront(e){return!(!e||e===this._objects[this._objects.length-1])&&(mt(this._objects,e),this._objects.push(e),this._onStackOrderChanged(e),!0)}sendObjectBackwards(e,t){if(!e)return!1;let n=this._objects.indexOf(e);if(n!==0){let r=this.findNewLowerIndex(e,n,t);return mt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}bringObjectForward(e,t){if(!e)return!1;let n=this._objects.indexOf(e);if(n!==this._objects.length-1){let r=this.findNewUpperIndex(e,n,t);return mt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}moveObjectTo(e,t){return e!==this._objects[t]&&(mt(this._objects,e),this._objects.splice(t,0,e),this._onStackOrderChanged(e),!0)}findNewLowerIndex(e,t,n){let r;if(n){r=t;for(let n=t-1;n>=0;--n)if(e.isOverlapping(this._objects[n])){r=n;break}}else r=t-1;return r}findNewUpperIndex(e,t,n){let r;if(n){r=t;for(let n=t+1;n<this._objects.length;++n)if(e.isOverlapping(this._objects[n])){r=n;break}}else r=t+1;return r}collectObjects({left:e,top:t,width:n,height:r},{includeIntersecting:i=!0}={}){let a=[],o=new K(e,t),s=o.add(new K(n,r));for(let e=this._objects.length-1;e>=0;e--){let t=this._objects[e];t.selectable&&t.visible&&(i&&t.intersectsWithRect(o,s)||t.isContainedWithinRect(o,s)||i&&t.containsPoint(o)||i&&t.containsPoint(s))&&a.push(t)}return a}}return t}var bt=class extends pt{_setOptions(e={}){for(let t in e)this.set(t,e[t])}_setObject(e){for(let t in e)this._set(t,e[t])}set(e,t){return typeof e==`object`?this._setObject(e):this._set(e,t),this}_set(e,t){this[e]=t}toggle(e){let t=this.get(e);return typeof t==`boolean`&&this.set(e,!t),this}get(e){return this[e]}};function xt(e){return Pe().requestAnimationFrame(e)}function St(e){return Pe().cancelAnimationFrame(e)}var Ct=0,wt=()=>Ct++,Tt=()=>{let e=Ne().createElement(`canvas`);if(!e||e.getContext===void 0)throw new Ee("Failed to create `canvas` element");return e},Et=()=>Ne().createElement(`img`),Dt=e=>{var t;let n=Ot(e);return(t=n.getContext(`2d`))==null||t.drawImage(e,0,0),n},Ot=e=>{let t=Tt();return t.width=e.width,t.height=e.height,t},kt=(e,t,n)=>e.toDataURL(`image/${t}`,n),At=(e,t,n)=>new Promise((r,i)=>{e.toBlob(r,`image/${t}`,n)}),q=e=>e*He,jt=e=>e/He,Mt=e=>e.every((e,t)=>e===Ue[t]),J=(e,t,n)=>new K(e).transform(t,n),Nt=e=>{let t=1/(e[0]*e[3]-e[1]*e[2]),n=[t*e[3],-t*e[1],-t*e[2],t*e[0],0,0],{x:r,y:i}=new K(e[4],e[5]).transform(n,!0);return n[4]=-r,n[5]=-i,n},Y=(e,t,n)=>[e[0]*t[0]+e[2]*t[1],e[1]*t[0]+e[3]*t[1],e[0]*t[2]+e[2]*t[3],e[1]*t[2]+e[3]*t[3],n?0:e[0]*t[4]+e[2]*t[5]+e[4],n?0:e[1]*t[4]+e[3]*t[5]+e[5]],Pt=(e,t)=>e.reduceRight((e,n)=>n&&e?Y(n,e,t):n||e,void 0)||Ue.concat(),Ft=([e,t])=>Math.atan2(t,e),It=([e,t])=>Math.sqrt(e*e+t*t),Lt=([,,e,t])=>Math.sqrt(e*e+t*t),Rt=e=>{let t=Ft(e),n=e[0]**2+e[1]**2,r=Math.sqrt(n),i=(e[0]*e[3]-e[2]*e[1])/r,a=Math.atan2(e[0]*e[2]+e[1]*e[3],n);return{angle:jt(t),scaleX:r,scaleY:i,skewX:jt(a),skewY:0,translateX:e[4]||0,translateY:e[5]||0}},zt=(e,t=0)=>[1,0,0,1,e,t];function Bt({angle:e=0}={},{x:t=0,y:n=0}={}){let r=q(e),i=ht(r),a=gt(r);return[i,a,-a,i,t?t-(i*t-a*n):0,n?n-(a*t+i*n):0]}var Vt=(e,t=e)=>[e,0,0,t,0,0],Ht=e=>Math.tan(q(e)),Ut=e=>[1,0,Ht(e),1,0,0],Wt=e=>[1,Ht(e),0,1,0,0],Gt=({scaleX:e=1,scaleY:t=1,flipX:n=!1,flipY:r=!1,skewX:i=0,skewY:a=0})=>{let o=Vt(n?-e:e,r?-t:t);return i&&(o=Y(o,Ut(i),!0)),a&&(o=Y(o,Wt(a),!0)),o},Kt=e=>{let{translateX:t=0,translateY:n=0,angle:r=0}=e,i=zt(t,n);r&&(i=Y(i,Bt({angle:r})));let a=Gt(e);return Mt(a)||(i=Y(i,a)),i},qt=(e,{signal:t,crossOrigin:n=null}={})=>new Promise(function(r,i){if(t&&t.aborted)return i(new De(`loadImage`));let a=Et(),o;t&&(o=function(e){a.src=``,i(e)},t.addEventListener(`abort`,o,{once:!0}));let s=function(){a.onload=a.onerror=null,o&&t?.removeEventListener(`abort`,o),r(a)};e?(a.onload=s,a.onerror=function(){o&&t?.removeEventListener(`abort`,o),i(new Ee(`Error loading ${a.src}`))},n&&(a.crossOrigin=n),a.src=e):s()}),Jt=(e,{signal:t,reviver:n=Re}={})=>new Promise((r,i)=>{let a=[];t&&t.addEventListener(`abort`,i,{once:!0}),Promise.allSettled(e.map(e=>G.getClass(e.type).fromObject(e,{signal:t}))).then(async t=>{for(let[r,i]of t.entries())if(i.status===`fulfilled`&&(await n(e[r],i.value),a.push(i.value)),i.status===`rejected`){let t=await n(e[r],void 0,i.reason);t&&a.push(t)}r(a)}).catch(e=>{a.forEach(e=>{e.dispose&&e.dispose()}),i(e)}).finally(()=>{t&&t.removeEventListener(`abort`,i)})}),Yt=(e,{signal:t}={})=>new Promise((n,r)=>{let i=[];t&&t.addEventListener(`abort`,r,{once:!0});let a=Object.values(e).map(e=>e&&e.type&&G.has(e.type)?Jt([e],{signal:t}).then(([e])=>(i.push(e),e)):e),o=Object.keys(e);Promise.all(a).then(e=>e.reduce((e,t,n)=>(e[o[n]]=t,e),{})).then(n).catch(e=>{i.forEach(e=>{e.dispose&&e.dispose()}),r(e)}).finally(()=>{t&&t.removeEventListener(`abort`,r)})}),Xt=(e,t=[])=>t.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{}),Zt=(e,t)=>Object.keys(e).reduce((n,r)=>(t(e[r],r,e)&&(n[r]=e[r]),n),{}),X=(e,t)=>parseFloat(Number(e).toFixed(t)),Qt=e=>`matrix(`+e.map(e=>X(e,H.NUM_FRACTION_DIGITS)).join(` `)+`)`,$t=e=>!!e&&e.toLive!==void 0,en=e=>!!e&&typeof e.toObject==`function`,tn=e=>!!e&&e.offsetX!==void 0&&`source`in e,nn=e=>!!e&&`multiSelectionStacking`in e;function rn(e){let t=e&&an(e),n=0,r=0;if(!e||!t)return{left:n,top:r};let i=e,a=t.documentElement,o=t.body||{scrollLeft:0,scrollTop:0};for(;i&&(i.parentNode||i.host)&&(i=i.parentNode||i.host,i===t?(n=o.scrollLeft||a.scrollLeft||0,r=o.scrollTop||a.scrollTop||0):(n+=i.scrollLeft||0,r+=i.scrollTop||0),i.nodeType!==1||i.style.position!==`fixed`););return{left:n,top:r}}var an=e=>e.ownerDocument||null,on=e=>e.ownerDocument?.defaultView||null,sn=(e,t,{width:n,height:r},i=1)=>{e.width=n,e.height=r,i>1&&(e.setAttribute(`width`,(n*i).toString()),e.setAttribute(`height`,(r*i).toString()),t.scale(i,i))},cn=(e,{width:t,height:n})=>{t&&(e.style.width=typeof t==`number`?`${t}px`:t),n&&(e.style.height=typeof n==`number`?`${n}px`:n)};function ln(e){return e.onselectstart!==void 0&&(e.onselectstart=()=>!1),e.style.userSelect=Ke,e}var un=class{constructor(e){V(this,`_originalCanvasStyle`,void 0),V(this,`lower`,void 0);let t=this.createLowerCanvas(e);this.lower={el:t,ctx:t.getContext(`2d`)}}createLowerCanvas(e){let t=(n=e)&&n.getContext!==void 0?e:e&&Ne().getElementById(e)||Tt();var n;if(t.hasAttribute(`data-fabric`))throw new Ee(`Trying to initialize a canvas that has already been initialized. Did you forget to dispose the canvas?`);return this._originalCanvasStyle=t.style.cssText,t.setAttribute(`data-fabric`,`main`),t.classList.add(`lower-canvas`),t}cleanupDOM({width:e,height:t}){let{el:n}=this.lower;n.classList.remove(`lower-canvas`),n.removeAttribute(`data-fabric`),n.setAttribute(`width`,`${e}`),n.setAttribute(`height`,`${t}`),n.style.cssText=this._originalCanvasStyle||``,this._originalCanvasStyle=void 0}setDimensions(e,t){let{el:n,ctx:r}=this.lower;sn(n,r,e,t)}setCSSDimensions(e){cn(this.lower.el,e)}calcOffset(){return function(e){let t=e&&an(e),n={left:0,top:0};if(!t)return n;let r=on(e)?.getComputedStyle(e,null)||{};n.left+=parseInt(r.borderLeftWidth,10)||0,n.top+=parseInt(r.borderTopWidth,10)||0,n.left+=parseInt(r.paddingLeft,10)||0,n.top+=parseInt(r.paddingTop,10)||0;let i={left:0,top:0},a=t.documentElement;e.getBoundingClientRect!==void 0&&(i=e.getBoundingClientRect());let o=rn(e);return{left:i.left+o.left-(a.clientLeft||0)+n.left,top:i.top+o.top-(a.clientTop||0)+n.top}}(this.lower.el)}dispose(){Me().dispose(this.lower.el),delete this.lower}},dn={backgroundVpt:!0,backgroundColor:``,overlayVpt:!0,overlayColor:``,includeDefaultValues:!0,svgViewportTransformation:!0,renderOnAddRemove:!0,skipOffscreen:!0,enableRetinaScaling:!0,imageSmoothingEnabled:!0,controlsAboveOverlay:!1,allowTouchScrolling:!1,viewportTransform:[...Ue],patternQuality:`best`},fn=xe({capitalize:()=>pn,escapeXml:()=>Z,graphemeSplit:()=>hn}),pn=(e,t=!1)=>`${e.charAt(0).toUpperCase()}${t?e.slice(1):e.slice(1).toLowerCase()}`,Z=e=>e.toString().replace(/&/g,`&`).replace(/"/g,`"`).replace(/'/g,`'`).replace(/</g,`<`).replace(/>/g,`>`),mn,hn=e=>{if(mn||mn||(mn=`Intl`in Pe()&&`Segmenter`in Intl&&new Intl.Segmenter(void 0,{granularity:`grapheme`})),mn){let t=mn.segment(e);return Array.from(t).map(({segment:e})=>e)}return gn(e)},gn=e=>{let t=[];for(let n,r=0;r<e.length;r++)!1!==(n=_n(e,r))&&t.push(n);return t},_n=(e,t)=>{let n=e.charCodeAt(t);if(isNaN(n))return``;if(n<55296||n>57343)return e.charAt(t);if(55296<=n&&n<=56319){if(e.length<=t+1)throw`High surrogate without following low surrogate`;let n=e.charCodeAt(t+1);if(56320>n||n>57343)throw`High surrogate without following low surrogate`;return e.charAt(t)+e.charAt(t+1)}if(t===0)throw`Low surrogate without preceding high surrogate`;let r=e.charCodeAt(t-1);if(55296>r||r>56319)throw`Low surrogate without preceding high surrogate`;return!1},vn=class e extends yt(bt){get lowerCanvasEl(){return this.elements.lower?.el}get contextContainer(){return this.elements.lower?.ctx}static getDefaults(){return e.ownDefaults}constructor(e,t={}){super(),Object.assign(this,this.constructor.getDefaults()),this.set(t),this.initElements(e),this._setDimensionsImpl({width:this.width||this.elements.lower.el.width||0,height:this.height||this.elements.lower.el.height||0}),this.skipControlsDrawing=!1,this.viewportTransform=[...this.viewportTransform],this.calcViewportBoundaries()}initElements(e){this.elements=new un(e)}add(...e){let t=super.add(...e);return e.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}insertAt(e,...t){let n=super.insertAt(e,...t);return t.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),n}remove(...e){let t=super.remove(...e);return t.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}_onObjectAdded(e){e.canvas&&e.canvas!==this&&(Te(`warn`,`Canvas is trying to add an object that belongs to a different canvas.
|
|
2
|
+
import{r as e}from"./rolldown-runtime-hePW80VL.js";import{Ha as t,Ua as n,Wa as r}from"./Stream-mUTFnSY9.js";import{Gt as i,Ut as a,Wt as o,f as s,h as c,i as l,p as u,r as d,t as f}from"./popover-DJpPSHsy.js";import{on as p,sn as m}from"./CompositeItem-DU4kdAw6.js";import{t as h}from"./preload-helper-Czpn1I53.js";import{_ as g,a as _,c as v,d as y,f as b,g as x,h as S,i as C,l as w,m as T,n as E,o as D,p as O,r as k,s as A,t as j,u as M,v as N,y as P}from"./canvasStateStore-CBQkAlnK.js";import{t as F}from"./toggle-Bv2GfLGu.js";var I=p(`file-code`,[[`path`,{d:`M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z`,key:`1oefj6`}],[`path`,{d:`M14 2v5a1 1 0 0 0 1 1h5`,key:`wfsgrz`}],[`path`,{d:`M10 12.5 8 15l2 2.5`,key:`1tg20x`}],[`path`,{d:`m14 12.5 2 2.5-2 2.5`,key:`yinavb`}]]),ee=p(`folder-open`,[[`path`,{d:`m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2`,key:`usdka0`}]]),L=p(`hexagon`,[[`path`,{d:`M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z`,key:`yt0hxn`}]]),te=p(`image-plus`,[[`path`,{d:`M16 5h6`,key:`1vod17`}],[`path`,{d:`M19 2v6`,key:`4bpg5p`}],[`path`,{d:`M21 11.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7.5`,key:`1ue2ih`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}]]),R=p(`image`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`,key:`1m3agn`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}]]),z=p(`layout-template`,[[`rect`,{width:`18`,height:`7`,x:`3`,y:`3`,rx:`1`,key:`f1a2em`}],[`rect`,{width:`9`,height:`7`,x:`3`,y:`14`,rx:`1`,key:`jqznyg`}],[`rect`,{width:`5`,height:`7`,x:`16`,y:`14`,rx:`1`,key:`q5h2i8`}]]),ne=p(`maximize`,[[`path`,{d:`M8 3H5a2 2 0 0 0-2 2v3`,key:`1dcmit`}],[`path`,{d:`M21 8V5a2 2 0 0 0-2-2h-3`,key:`1e4gt3`}],[`path`,{d:`M3 16v3a2 2 0 0 0 2 2h3`,key:`wsl5sc`}],[`path`,{d:`M16 21h3a2 2 0 0 0 2-2v-3`,key:`18trek`}]]),re=p(`mouse-pointer-2`,[[`path`,{d:`M4.037 4.688a.495.495 0 0 1 .651-.651l16 6.5a.5.5 0 0 1-.063.947l-6.124 1.58a2 2 0 0 0-1.438 1.435l-1.579 6.126a.5.5 0 0 1-.947.063z`,key:`edeuup`}]]),ie=p(`mouse-pointer`,[[`path`,{d:`M12.586 12.586 19 19`,key:`ea5xo7`}],[`path`,{d:`M3.688 3.037a.497.497 0 0 0-.651.651l6.5 15.999a.501.501 0 0 0 .947-.062l1.569-6.083a2 2 0 0 1 1.448-1.479l6.124-1.579a.5.5 0 0 0 .063-.947z`,key:`277e5u`}]]),ae=p(`pen`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}]]),oe=p(`redo-2`,[[`path`,{d:`m15 14 5-5-5-5`,key:`12vg1m`}],[`path`,{d:`M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13`,key:`6uklza`}]]),se=p(`trash`,[[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`,key:`miytrc`}],[`path`,{d:`M3 6h18`,key:`d0wm0j`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`,key:`e791ji`}]]),ce=p(`wand`,[[`path`,{d:`M15 4V2`,key:`z1p9b7`}],[`path`,{d:`M15 16v-2`,key:`px0unx`}],[`path`,{d:`M8 9h2`,key:`1g203m`}],[`path`,{d:`M20 9h2`,key:`19tzq7`}],[`path`,{d:`M17.8 11.8 19 13`,key:`yihg8r`}],[`path`,{d:`M15 9h.01`,key:`x1ddxp`}],[`path`,{d:`M17.8 6.2 19 5`,key:`fd4us0`}],[`path`,{d:`m3 21 9-9`,key:`1jfql5`}],[`path`,{d:`M12.2 6.2 11 5`,key:`i3da3b`}]]),le=p(`zoom-in`,[[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}],[`line`,{x1:`21`,x2:`16.65`,y1:`21`,y2:`16.65`,key:`13gj7c`}],[`line`,{x1:`11`,x2:`11`,y1:`8`,y2:`14`,key:`1vmskp`}],[`line`,{x1:`8`,x2:`14`,y1:`11`,y2:`11`,key:`durymu`}]]),ue=p(`zoom-out`,[[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}],[`line`,{x1:`21`,x2:`16.65`,y1:`21`,y2:`16.65`,key:`13gj7c`}],[`line`,{x1:`8`,x2:`14`,y1:`11`,y2:`11`,key:`durymu`}]]),B=e(r(),1),de=[{id:`instagram-post`,label:`Instagram Post`,category:`Social Media`,width:1080,height:1080},{id:`instagram-story`,label:`Instagram Story`,category:`Social Media`,width:1080,height:1920},{id:`facebook-cover`,label:`Facebook Cover`,category:`Social Media`,width:820,height:312},{id:`linkedin-banner`,label:`LinkedIn Banner`,category:`Social Media`,width:1584,height:396},{id:`twitter-post`,label:`Twitter/X Post`,category:`Social Media`,width:1200,height:675},{id:`youtube-thumbnail`,label:`YouTube Thumbnail`,category:`Social Media`,width:1280,height:720},{id:`presentation`,label:`Presentation 16:9`,category:`Presentation`,width:1920,height:1080},{id:`a4`,label:`A4`,category:`Print`,width:2480,height:3508},{id:`us-letter`,label:`US Letter`,category:`Print`,width:2550,height:3300},{id:`business-card`,label:`Business Card`,category:`Print`,width:1050,height:600},{id:`invoice`,label:`Invoice`,category:`Documents`,width:2480,height:3508}],fe=new Map(de.map(e=>[e.id,e]));[...new Set(de.map(e=>e.category))];function pe(){let e=new Map;for(let t of de){let n=e.get(t.category)??[];n.push(t),e.set(t.category,n)}return e}function me(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)}function he(e,t){let n=URL.createObjectURL(e);me(n,t),URL.revokeObjectURL(n)}function ge(e,t,n,r,i=40){let a=n-i*2,o=r-i*2,s=Math.min(a/e,o/t,1),c=e*s,l=t*s;return{scale:s,offsetX:(n-c)/2,offsetY:(r-l)/2}}function _e(e){return Math.min(e*1.25,5)}function ve(e){return Math.max(e/1.25,.1)}function ye(e,t){return{rect:`Rectangle`,circle:`Circle`,line:`Line`,polygon:`Polygon`,textbox:`Text`,"i-text":`Text`,image:`Image`,path:`Drawing`,group:`Group`}[e]??`Object ${t+1}`}var be=Object.defineProperty,xe=(e,t)=>{let n={};for(var r in e)be(n,r,{get:e[r],enumerable:!0});return t||be(n,Symbol.toStringTag,{value:`Module`}),n};function Se(e){return Se=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},Se(e)}function Ce(e){var t=function(e,t){if(Se(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(Se(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}(e,`string`);return Se(t)==`symbol`?t:t+``}function V(e,t,n){return(t=Ce(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var we=class{constructor(){V(this,`browserShadowBlurConstant`,1),V(this,`DPI`,96),V(this,`devicePixelRatio`,typeof window<`u`?window.devicePixelRatio:1),V(this,`perfLimitSizeTotal`,2097152),V(this,`maxCacheSideLimit`,4096),V(this,`minCacheSideLimit`,256),V(this,`disableStyleCopyPaste`,!1),V(this,`enableGLFiltering`,!0),V(this,`textureSize`,4096),V(this,`forceGLPutImageData`,!1),V(this,`cachesBoundsOfCurve`,!1),V(this,`fontPaths`,{}),V(this,`NUM_FRACTION_DIGITS`,4)}},H=new class extends we{constructor(e){super(),this.configure(e)}configure(e={}){Object.assign(this,e)}addFonts(e={}){this.fontPaths={...this.fontPaths,...e}}removeFonts(e=[]){e.forEach(e=>{delete this.fontPaths[e]})}clearFonts(){this.fontPaths={}}restoreDefaults(e){let t=new we,n=e?.reduce((e,n)=>(e[n]=t[n],e),{})||t;this.configure(n)}},Te=(e,...t)=>console[e](`fabric`,...t),Ee=class extends Error{constructor(e,t){super(`fabric: ${e}`,t)}},De=class extends Ee{constructor(e){super(`${e} 'options.signal' is in 'aborted' state`)}},Oe=class{},ke=class extends Oe{testPrecision(e,t){let n=`precision ${t} float;\nvoid main(){}`,r=e.createShader(e.FRAGMENT_SHADER);return!!r&&(e.shaderSource(r,n),e.compileShader(r),!!e.getShaderParameter(r,e.COMPILE_STATUS))}queryWebGL(e){let t=e.getContext(`webgl`);t&&(this.maxTextureSize=t.getParameter(t.MAX_TEXTURE_SIZE),this.GLPrecision=[`highp`,`mediump`,`lowp`].find(e=>this.testPrecision(t,e)),t.getExtension(`WEBGL_lose_context`).loseContext(),Te(`log`,`WebGL: max texture size ${this.maxTextureSize}`))}isSupported(e){return!!this.maxTextureSize&&this.maxTextureSize>=e}},Ae={},je,Me=()=>je||={document,window,isTouchSupported:`ontouchstart`in window||`ontouchstart`in document||window&&window.navigator&&window.navigator.maxTouchPoints>0,WebGLProbe:new ke,dispose(){},copyPasteData:Ae},Ne=()=>Me().document,Pe=()=>Me().window,Fe=()=>Math.max(H.devicePixelRatio??Pe().devicePixelRatio,1),Ie=new class{constructor(){V(this,`boundsOfCurveCache`,{}),this.charWidthsCache=new Map}getFontCache({fontFamily:e,fontStyle:t,fontWeight:n}){e=e.toLowerCase();let r=this.charWidthsCache;r.has(e)||r.set(e,new Map);let i=r.get(e),a=`${t.toLowerCase()}_${(n+``).toLowerCase()}`;return i.has(a)||i.set(a,new Map),i.get(a)}clearFontCache(e){e?this.charWidthsCache.delete((e||``).toLowerCase()):this.charWidthsCache=new Map}limitDimsByArea(e){let{perfLimitSizeTotal:t}=H,n=Math.sqrt(t*e);return[Math.floor(n),Math.floor(t/n)]}},Le=`7.4.0`;function Re(){}var ze=Math.PI/2,Be=Math.PI/4,Ve=2*Math.PI,He=Math.PI/180,Ue=Object.freeze([1,0,0,1,0,0]),U=`center`,W=`left`,We=`bottom`,Ge=`right`,Ke=`none`,qe=/\r?\n/,Je=`moving`,Ye=`scaling`,Xe=`rotating`,Ze=`rotate`,Qe=`skewing`,$e=`resizing`,et=`modifyPoly`,tt=`changed`,nt=`scale`,rt=`scaleX`,it=`scaleY`,at=`skewX`,ot=`skewY`,st=`fill`,ct=`stroke`,lt=`modified`,ut=`normal`,dt=`json`,G=new class{constructor(){this[dt]=new Map,this.svg=new Map}has(e){return this[dt].has(e)}getClass(e){let t=this[dt].get(e);if(!t)throw new Ee(`No class registered for ${e}`);return t}setClass(e,t){t?this[dt].set(t,e):(this[dt].set(e.type,e),this[dt].set(e.type.toLowerCase(),e))}getSVGClass(e){return this.svg.get(e)}setSVGClass(e,t){this.svg.set(t??e.type.toLowerCase(),e)}},ft=new class extends Array{remove(e){let t=this.indexOf(e);t>-1&&this.splice(t,1)}cancelAll(){let e=this.splice(0);return e.forEach(e=>e.abort()),e}cancelByCanvas(e){if(!e)return[];let t=this.filter(t=>t.target===e||typeof t.target==`object`&&t.target?.canvas===e);return t.forEach(e=>e.abort()),t}cancelByTarget(e){if(!e)return[];let t=this.filter(t=>t.target===e);return t.forEach(e=>e.abort()),t}},pt=class{constructor(){V(this,`__eventListeners`,{})}on(e,t){if(this.__eventListeners||={},typeof e==`object`)return Object.entries(e).forEach(([e,t])=>{this.on(e,t)}),()=>this.off(e);if(t){let n=e;return this.__eventListeners[n]||(this.__eventListeners[n]=[]),this.__eventListeners[n].push(t),()=>this.off(n,t)}return()=>!1}once(e,t){if(typeof e==`object`){let t=[];return Object.entries(e).forEach(([e,n])=>{t.push(this.once(e,n))}),()=>t.forEach(e=>e())}if(t){let n=this.on(e,function(...e){t.call(this,...e),n()});return n}return()=>!1}_removeEventListener(e,t){if(this.__eventListeners[e])if(t){let n=this.__eventListeners[e],r=n.indexOf(t);r>-1&&n.splice(r,1)}else this.__eventListeners[e]=[]}off(e,t){if(this.__eventListeners)if(e===void 0)for(let e in this.__eventListeners)this._removeEventListener(e);else typeof e==`object`?Object.entries(e).forEach(([e,t])=>{this._removeEventListener(e,t)}):this._removeEventListener(e,t)}fire(e,t){if(!this.__eventListeners)return;let n=this.__eventListeners[e]?.concat();if(n)for(let e=0;e<n.length;e++)n[e].call(this,t||{})}},mt=(e,t)=>{let n=e.indexOf(t);return n!==-1&&e.splice(n,1),e},ht=e=>{if(e===0)return 1;switch(Math.abs(e)/ze){case 1:case 3:return 0;case 2:return-1}return Math.cos(e)},gt=e=>{if(e===0)return 0;let t=e/ze,n=Math.sign(e);switch(t){case 1:return n;case 2:return 0;case 3:return-n}return Math.sin(e)},K=class e{constructor(e=0,t=0){typeof e==`object`?(this.x=e.x,this.y=e.y):(this.x=e,this.y=t)}add(t){return new e(this.x+t.x,this.y+t.y)}addEquals(e){return this.x+=e.x,this.y+=e.y,this}scalarAdd(t){return new e(this.x+t,this.y+t)}scalarAddEquals(e){return this.x+=e,this.y+=e,this}subtract(t){return new e(this.x-t.x,this.y-t.y)}subtractEquals(e){return this.x-=e.x,this.y-=e.y,this}scalarSubtract(t){return new e(this.x-t,this.y-t)}scalarSubtractEquals(e){return this.x-=e,this.y-=e,this}multiply(t){return new e(this.x*t.x,this.y*t.y)}scalarMultiply(t){return new e(this.x*t,this.y*t)}scalarMultiplyEquals(e){return this.x*=e,this.y*=e,this}divide(t){return new e(this.x/t.x,this.y/t.y)}scalarDivide(t){return new e(this.x/t,this.y/t)}scalarDivideEquals(e){return this.x/=e,this.y/=e,this}eq(e){return this.x===e.x&&this.y===e.y}lt(e){return this.x<e.x&&this.y<e.y}lte(e){return this.x<=e.x&&this.y<=e.y}gt(e){return this.x>e.x&&this.y>e.y}gte(e){return this.x>=e.x&&this.y>=e.y}lerp(t,n=.5){return n=Math.max(Math.min(1,n),0),new e(this.x+(t.x-this.x)*n,this.y+(t.y-this.y)*n)}distanceFrom(e){let t=this.x-e.x,n=this.y-e.y;return Math.sqrt(t*t+n*n)}midPointFrom(e){return this.lerp(e)}min(t){return new e(Math.min(this.x,t.x),Math.min(this.y,t.y))}max(t){return new e(Math.max(this.x,t.x),Math.max(this.y,t.y))}toString(){return`${this.x},${this.y}`}setXY(e,t){return this.x=e,this.y=t,this}setX(e){return this.x=e,this}setY(e){return this.y=e,this}setFromPoint(e){return this.x=e.x,this.y=e.y,this}swap(e){let t=this.x,n=this.y;this.x=e.x,this.y=e.y,e.x=t,e.y=n}clone(){return new e(this.x,this.y)}rotate(t,n=_t){let r=gt(t),i=ht(t),a=this.subtract(n);return new e(a.x*i-a.y*r,a.x*r+a.y*i).add(n)}transform(t,n=!1){return new e(t[0]*this.x+t[2]*this.y+(n?0:t[4]),t[1]*this.x+t[3]*this.y+(n?0:t[5]))}},_t=new K(0,0),vt=e=>!!e&&Array.isArray(e._objects);function yt(e){class t extends e{constructor(...e){super(...e),V(this,`_objects`,[])}_onObjectAdded(e){}_onObjectRemoved(e){}_onStackOrderChanged(e){}add(...e){let t=this._objects.push(...e);return e.forEach(e=>this._onObjectAdded(e)),t}insertAt(e,...t){return this._objects.splice(e,0,...t),t.forEach(e=>this._onObjectAdded(e)),this._objects.length}remove(...e){let t=this._objects,n=[];return e.forEach(e=>{let r=t.indexOf(e);r!==-1&&(t.splice(r,1),n.push(e),this._onObjectRemoved(e))}),n}forEachObject(e){this.getObjects().forEach((t,n,r)=>e(t,n,r))}getObjects(...e){return e.length===0?[...this._objects]:this._objects.filter(t=>t.isType(...e))}item(e){return this._objects[e]}isEmpty(){return this._objects.length===0}size(){return this._objects.length}contains(e,n){return!!this._objects.includes(e)||!!n&&this._objects.some(n=>n instanceof t&&n.contains(e,!0))}complexity(){return this._objects.reduce((e,t)=>e+=t.complexity?t.complexity():0,0)}sendObjectToBack(e){return!(!e||e===this._objects[0])&&(mt(this._objects,e),this._objects.unshift(e),this._onStackOrderChanged(e),!0)}bringObjectToFront(e){return!(!e||e===this._objects[this._objects.length-1])&&(mt(this._objects,e),this._objects.push(e),this._onStackOrderChanged(e),!0)}sendObjectBackwards(e,t){if(!e)return!1;let n=this._objects.indexOf(e);if(n!==0){let r=this.findNewLowerIndex(e,n,t);return mt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}bringObjectForward(e,t){if(!e)return!1;let n=this._objects.indexOf(e);if(n!==this._objects.length-1){let r=this.findNewUpperIndex(e,n,t);return mt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}moveObjectTo(e,t){return e!==this._objects[t]&&(mt(this._objects,e),this._objects.splice(t,0,e),this._onStackOrderChanged(e),!0)}findNewLowerIndex(e,t,n){let r;if(n){r=t;for(let n=t-1;n>=0;--n)if(e.isOverlapping(this._objects[n])){r=n;break}}else r=t-1;return r}findNewUpperIndex(e,t,n){let r;if(n){r=t;for(let n=t+1;n<this._objects.length;++n)if(e.isOverlapping(this._objects[n])){r=n;break}}else r=t+1;return r}collectObjects({left:e,top:t,width:n,height:r},{includeIntersecting:i=!0}={}){let a=[],o=new K(e,t),s=o.add(new K(n,r));for(let e=this._objects.length-1;e>=0;e--){let t=this._objects[e];t.selectable&&t.visible&&(i&&t.intersectsWithRect(o,s)||t.isContainedWithinRect(o,s)||i&&t.containsPoint(o)||i&&t.containsPoint(s))&&a.push(t)}return a}}return t}var bt=class extends pt{_setOptions(e={}){for(let t in e)this.set(t,e[t])}_setObject(e){for(let t in e)this._set(t,e[t])}set(e,t){return typeof e==`object`?this._setObject(e):this._set(e,t),this}_set(e,t){this[e]=t}toggle(e){let t=this.get(e);return typeof t==`boolean`&&this.set(e,!t),this}get(e){return this[e]}};function xt(e){return Pe().requestAnimationFrame(e)}function St(e){return Pe().cancelAnimationFrame(e)}var Ct=0,wt=()=>Ct++,Tt=()=>{let e=Ne().createElement(`canvas`);if(!e||e.getContext===void 0)throw new Ee("Failed to create `canvas` element");return e},Et=()=>Ne().createElement(`img`),Dt=e=>{var t;let n=Ot(e);return(t=n.getContext(`2d`))==null||t.drawImage(e,0,0),n},Ot=e=>{let t=Tt();return t.width=e.width,t.height=e.height,t},kt=(e,t,n)=>e.toDataURL(`image/${t}`,n),At=(e,t,n)=>new Promise((r,i)=>{e.toBlob(r,`image/${t}`,n)}),q=e=>e*He,jt=e=>e/He,Mt=e=>e.every((e,t)=>e===Ue[t]),J=(e,t,n)=>new K(e).transform(t,n),Nt=e=>{let t=1/(e[0]*e[3]-e[1]*e[2]),n=[t*e[3],-t*e[1],-t*e[2],t*e[0],0,0],{x:r,y:i}=new K(e[4],e[5]).transform(n,!0);return n[4]=-r,n[5]=-i,n},Y=(e,t,n)=>[e[0]*t[0]+e[2]*t[1],e[1]*t[0]+e[3]*t[1],e[0]*t[2]+e[2]*t[3],e[1]*t[2]+e[3]*t[3],n?0:e[0]*t[4]+e[2]*t[5]+e[4],n?0:e[1]*t[4]+e[3]*t[5]+e[5]],Pt=(e,t)=>e.reduceRight((e,n)=>n&&e?Y(n,e,t):n||e,void 0)||Ue.concat(),Ft=([e,t])=>Math.atan2(t,e),It=([e,t])=>Math.sqrt(e*e+t*t),Lt=([,,e,t])=>Math.sqrt(e*e+t*t),Rt=e=>{let t=Ft(e),n=e[0]**2+e[1]**2,r=Math.sqrt(n),i=(e[0]*e[3]-e[2]*e[1])/r,a=Math.atan2(e[0]*e[2]+e[1]*e[3],n);return{angle:jt(t),scaleX:r,scaleY:i,skewX:jt(a),skewY:0,translateX:e[4]||0,translateY:e[5]||0}},zt=(e,t=0)=>[1,0,0,1,e,t];function Bt({angle:e=0}={},{x:t=0,y:n=0}={}){let r=q(e),i=ht(r),a=gt(r);return[i,a,-a,i,t?t-(i*t-a*n):0,n?n-(a*t+i*n):0]}var Vt=(e,t=e)=>[e,0,0,t,0,0],Ht=e=>Math.tan(q(e)),Ut=e=>[1,0,Ht(e),1,0,0],Wt=e=>[1,Ht(e),0,1,0,0],Gt=({scaleX:e=1,scaleY:t=1,flipX:n=!1,flipY:r=!1,skewX:i=0,skewY:a=0})=>{let o=Vt(n?-e:e,r?-t:t);return i&&(o=Y(o,Ut(i),!0)),a&&(o=Y(o,Wt(a),!0)),o},Kt=e=>{let{translateX:t=0,translateY:n=0,angle:r=0}=e,i=zt(t,n);r&&(i=Y(i,Bt({angle:r})));let a=Gt(e);return Mt(a)||(i=Y(i,a)),i},qt=(e,{signal:t,crossOrigin:n=null}={})=>new Promise(function(r,i){if(t&&t.aborted)return i(new De(`loadImage`));let a=Et(),o;t&&(o=function(e){a.src=``,i(e)},t.addEventListener(`abort`,o,{once:!0}));let s=function(){a.onload=a.onerror=null,o&&t?.removeEventListener(`abort`,o),r(a)};e?(a.onload=s,a.onerror=function(){o&&t?.removeEventListener(`abort`,o),i(new Ee(`Error loading ${a.src}`))},n&&(a.crossOrigin=n),a.src=e):s()}),Jt=(e,{signal:t,reviver:n=Re}={})=>new Promise((r,i)=>{let a=[];t&&t.addEventListener(`abort`,i,{once:!0}),Promise.allSettled(e.map(e=>G.getClass(e.type).fromObject(e,{signal:t}))).then(async t=>{for(let[r,i]of t.entries())if(i.status===`fulfilled`&&(await n(e[r],i.value),a.push(i.value)),i.status===`rejected`){let t=await n(e[r],void 0,i.reason);t&&a.push(t)}r(a)}).catch(e=>{a.forEach(e=>{e.dispose&&e.dispose()}),i(e)}).finally(()=>{t&&t.removeEventListener(`abort`,i)})}),Yt=(e,{signal:t}={})=>new Promise((n,r)=>{let i=[];t&&t.addEventListener(`abort`,r,{once:!0});let a=Object.values(e).map(e=>e&&e.type&&G.has(e.type)?Jt([e],{signal:t}).then(([e])=>(i.push(e),e)):e),o=Object.keys(e);Promise.all(a).then(e=>e.reduce((e,t,n)=>(e[o[n]]=t,e),{})).then(n).catch(e=>{i.forEach(e=>{e.dispose&&e.dispose()}),r(e)}).finally(()=>{t&&t.removeEventListener(`abort`,r)})}),Xt=(e,t=[])=>t.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{}),Zt=(e,t)=>Object.keys(e).reduce((n,r)=>(t(e[r],r,e)&&(n[r]=e[r]),n),{}),X=(e,t)=>parseFloat(Number(e).toFixed(t)),Qt=e=>`matrix(`+e.map(e=>X(e,H.NUM_FRACTION_DIGITS)).join(` `)+`)`,$t=e=>!!e&&e.toLive!==void 0,en=e=>!!e&&typeof e.toObject==`function`,tn=e=>!!e&&e.offsetX!==void 0&&`source`in e,nn=e=>!!e&&`multiSelectionStacking`in e;function rn(e){let t=e&&an(e),n=0,r=0;if(!e||!t)return{left:n,top:r};let i=e,a=t.documentElement,o=t.body||{scrollLeft:0,scrollTop:0};for(;i&&(i.parentNode||i.host)&&(i=i.parentNode||i.host,i===t?(n=o.scrollLeft||a.scrollLeft||0,r=o.scrollTop||a.scrollTop||0):(n+=i.scrollLeft||0,r+=i.scrollTop||0),i.nodeType!==1||i.style.position!==`fixed`););return{left:n,top:r}}var an=e=>e.ownerDocument||null,on=e=>e.ownerDocument?.defaultView||null,sn=(e,t,{width:n,height:r},i=1)=>{e.width=n,e.height=r,i>1&&(e.setAttribute(`width`,(n*i).toString()),e.setAttribute(`height`,(r*i).toString()),t.scale(i,i))},cn=(e,{width:t,height:n})=>{t&&(e.style.width=typeof t==`number`?`${t}px`:t),n&&(e.style.height=typeof n==`number`?`${n}px`:n)};function ln(e){return e.onselectstart!==void 0&&(e.onselectstart=()=>!1),e.style.userSelect=Ke,e}var un=class{constructor(e){V(this,`_originalCanvasStyle`,void 0),V(this,`lower`,void 0);let t=this.createLowerCanvas(e);this.lower={el:t,ctx:t.getContext(`2d`)}}createLowerCanvas(e){let t=(n=e)&&n.getContext!==void 0?e:e&&Ne().getElementById(e)||Tt();var n;if(t.hasAttribute(`data-fabric`))throw new Ee(`Trying to initialize a canvas that has already been initialized. Did you forget to dispose the canvas?`);return this._originalCanvasStyle=t.style.cssText,t.setAttribute(`data-fabric`,`main`),t.classList.add(`lower-canvas`),t}cleanupDOM({width:e,height:t}){let{el:n}=this.lower;n.classList.remove(`lower-canvas`),n.removeAttribute(`data-fabric`),n.setAttribute(`width`,`${e}`),n.setAttribute(`height`,`${t}`),n.style.cssText=this._originalCanvasStyle||``,this._originalCanvasStyle=void 0}setDimensions(e,t){let{el:n,ctx:r}=this.lower;sn(n,r,e,t)}setCSSDimensions(e){cn(this.lower.el,e)}calcOffset(){return function(e){let t=e&&an(e),n={left:0,top:0};if(!t)return n;let r=on(e)?.getComputedStyle(e,null)||{};n.left+=parseInt(r.borderLeftWidth,10)||0,n.top+=parseInt(r.borderTopWidth,10)||0,n.left+=parseInt(r.paddingLeft,10)||0,n.top+=parseInt(r.paddingTop,10)||0;let i={left:0,top:0},a=t.documentElement;e.getBoundingClientRect!==void 0&&(i=e.getBoundingClientRect());let o=rn(e);return{left:i.left+o.left-(a.clientLeft||0)+n.left,top:i.top+o.top-(a.clientTop||0)+n.top}}(this.lower.el)}dispose(){Me().dispose(this.lower.el),delete this.lower}},dn={backgroundVpt:!0,backgroundColor:``,overlayVpt:!0,overlayColor:``,includeDefaultValues:!0,svgViewportTransformation:!0,renderOnAddRemove:!0,skipOffscreen:!0,enableRetinaScaling:!0,imageSmoothingEnabled:!0,controlsAboveOverlay:!1,allowTouchScrolling:!1,viewportTransform:[...Ue],patternQuality:`best`},fn=xe({capitalize:()=>pn,escapeXml:()=>Z,graphemeSplit:()=>hn}),pn=(e,t=!1)=>`${e.charAt(0).toUpperCase()}${t?e.slice(1):e.slice(1).toLowerCase()}`,Z=e=>e.toString().replace(/&/g,`&`).replace(/"/g,`"`).replace(/'/g,`'`).replace(/</g,`<`).replace(/>/g,`>`),mn,hn=e=>{if(mn||mn||(mn=`Intl`in Pe()&&`Segmenter`in Intl&&new Intl.Segmenter(void 0,{granularity:`grapheme`})),mn){let t=mn.segment(e);return Array.from(t).map(({segment:e})=>e)}return gn(e)},gn=e=>{let t=[];for(let n,r=0;r<e.length;r++)!1!==(n=_n(e,r))&&t.push(n);return t},_n=(e,t)=>{let n=e.charCodeAt(t);if(isNaN(n))return``;if(n<55296||n>57343)return e.charAt(t);if(55296<=n&&n<=56319){if(e.length<=t+1)throw`High surrogate without following low surrogate`;let n=e.charCodeAt(t+1);if(56320>n||n>57343)throw`High surrogate without following low surrogate`;return e.charAt(t)+e.charAt(t+1)}if(t===0)throw`Low surrogate without preceding high surrogate`;let r=e.charCodeAt(t-1);if(55296>r||r>56319)throw`Low surrogate without preceding high surrogate`;return!1},vn=class e extends yt(bt){get lowerCanvasEl(){return this.elements.lower?.el}get contextContainer(){return this.elements.lower?.ctx}static getDefaults(){return e.ownDefaults}constructor(e,t={}){super(),Object.assign(this,this.constructor.getDefaults()),this.set(t),this.initElements(e),this._setDimensionsImpl({width:this.width||this.elements.lower.el.width||0,height:this.height||this.elements.lower.el.height||0}),this.skipControlsDrawing=!1,this.viewportTransform=[...this.viewportTransform],this.calcViewportBoundaries()}initElements(e){this.elements=new un(e)}add(...e){let t=super.add(...e);return e.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}insertAt(e,...t){let n=super.insertAt(e,...t);return t.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),n}remove(...e){let t=super.remove(...e);return t.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}_onObjectAdded(e){e.canvas&&e.canvas!==this&&(Te(`warn`,`Canvas is trying to add an object that belongs to a different canvas.
|
|
3
3
|
Resulting to default behavior: removing object from previous canvas and adding to new canvas`),e.canvas.remove(e)),e._set(`canvas`,this),e.setCoords(),this.fire(`object:added`,{target:e}),e.fire(`added`,{target:this})}_onObjectRemoved(e){e._set(`canvas`,void 0),this.fire(`object:removed`,{target:e}),e.fire(`removed`,{target:this})}_onStackOrderChanged(){this.renderOnAddRemove&&this.requestRenderAll()}getRetinaScaling(){return this.enableRetinaScaling?Fe():1}calcOffset(){return this._offset=this.elements.calcOffset()}getWidth(){return this.width}getHeight(){return this.height}_setDimensionsImpl(e,{cssOnly:t=!1,backstoreOnly:n=!1}={}){if(!t){let t={width:this.width,height:this.height,...e};this.elements.setDimensions(t,this.getRetinaScaling()),this.hasLostContext=!0,this.width=t.width,this.height=t.height}n||this.elements.setCSSDimensions(e),this.calcOffset()}setDimensions(e,t){this._setDimensionsImpl(e,t),t&&t.cssOnly||this.requestRenderAll()}getZoom(){return It(this.viewportTransform)}setViewportTransform(e){this.viewportTransform=e,this.calcViewportBoundaries(),this.renderOnAddRemove&&this.requestRenderAll()}zoomToPoint(e,t){let n=e,r=[...this.viewportTransform],i=J(e,Nt(r));r[0]=t,r[3]=t;let a=J(i,r);r[4]+=n.x-a.x,r[5]+=n.y-a.y,this.setViewportTransform(r)}setZoom(e){this.zoomToPoint(new K(0,0),e)}absolutePan(e){let t=[...this.viewportTransform];return t[4]=-e.x,t[5]=-e.y,this.setViewportTransform(t)}relativePan(e){return this.absolutePan(new K(-e.x-this.viewportTransform[4],-e.y-this.viewportTransform[5]))}getElement(){return this.elements.lower.el}clearContext(e){e.clearRect(0,0,this.width,this.height)}getContext(){return this.elements.lower.ctx}clear(){this.remove(...this.getObjects()),this.backgroundImage=void 0,this.overlayImage=void 0,this.backgroundColor=``,this.overlayColor=``,this.clearContext(this.getContext()),this.fire(`canvas:cleared`),this.renderOnAddRemove&&this.requestRenderAll()}renderAll(){this.cancelRequestedRender(),this.destroyed||this.renderCanvas(this.getContext(),this._objects)}renderAndReset(){this.nextRenderHandle=0,this.renderAll()}requestRenderAll(){this.nextRenderHandle||this.disposed||this.destroyed||(this.nextRenderHandle=xt(()=>this.renderAndReset()))}calcViewportBoundaries(){let e=this.width,t=this.height,n=Nt(this.viewportTransform),r=J({x:0,y:0},n),i=J({x:e,y:t},n),a=r.min(i),o=r.max(i);return this.vptCoords={tl:a,tr:new K(o.x,a.y),bl:new K(a.x,o.y),br:o}}cancelRequestedRender(){this.nextRenderHandle&&=(St(this.nextRenderHandle),0)}drawControls(e){}renderCanvas(e,t){if(this.destroyed)return;let n=this.viewportTransform,r=this.clipPath;this.calcViewportBoundaries(),this.clearContext(e),e.imageSmoothingEnabled=this.imageSmoothingEnabled,e.patternQuality=this.patternQuality,this.fire(`before:render`,{ctx:e}),this._renderBackground(e),e.save(),e.transform(n[0],n[1],n[2],n[3],n[4],n[5]),this._renderObjects(e,t),e.restore(),this.controlsAboveOverlay||this.skipControlsDrawing||this.drawControls(e),r&&(r._set(`canvas`,this),r.shouldCache(),r._transformDone=!0,r.renderCache({forClipping:!0}),this.drawClipPathOnCanvas(e,r)),this._renderOverlay(e),this.controlsAboveOverlay&&!this.skipControlsDrawing&&this.drawControls(e),this.fire(`after:render`,{ctx:e}),this.__cleanupTask&&=(this.__cleanupTask(),void 0)}drawClipPathOnCanvas(e,t){let n=this.viewportTransform;e.save(),e.transform(...n),e.globalCompositeOperation=`destination-in`,t.transform(e),e.scale(1/t.zoomX,1/t.zoomY),e.drawImage(t._cacheCanvas,-t.cacheTranslationX,-t.cacheTranslationY),e.restore()}_renderObjects(e,t){for(let n=0,r=t.length;n<r;++n)t[n]&&t[n].render(e)}_renderBackgroundOrOverlay(e,t){let n=this[`${t}Color`],r=this[`${t}Image`],i=this.viewportTransform,a=this[`${t}Vpt`];if(!n&&!r)return;let o=$t(n);if(n){if(e.save(),e.beginPath(),e.moveTo(0,0),e.lineTo(this.width,0),e.lineTo(this.width,this.height),e.lineTo(0,this.height),e.closePath(),e.fillStyle=o?n.toLive(e):n,a&&e.transform(...i),o){e.transform(1,0,0,1,n.offsetX||0,n.offsetY||0);let t=n.gradientTransform||n.patternTransform;t&&e.transform(...t)}e.fill(),e.restore()}if(r){e.save();let{skipOffscreen:t}=this;this.skipOffscreen=a,a&&e.transform(...i),r.render(e),this.skipOffscreen=t,e.restore()}}_renderBackground(e){this._renderBackgroundOrOverlay(e,`background`)}_renderOverlay(e){this._renderBackgroundOrOverlay(e,`overlay`)}getCenterPoint(){return new K(this.width/2,this.height/2)}centerObjectH(e){return this._centerObject(e,new K(this.getCenterPoint().x,e.getCenterPoint().y))}centerObjectV(e){return this._centerObject(e,new K(e.getCenterPoint().x,this.getCenterPoint().y))}centerObject(e){return this._centerObject(e,this.getCenterPoint())}viewportCenterObject(e){return this._centerObject(e,this.getVpCenter())}viewportCenterObjectH(e){return this._centerObject(e,new K(this.getVpCenter().x,e.getCenterPoint().y))}viewportCenterObjectV(e){return this._centerObject(e,new K(e.getCenterPoint().x,this.getVpCenter().y))}getVpCenter(){return J(this.getCenterPoint(),Nt(this.viewportTransform))}_centerObject(e,t){e.setXY(t,U,U),e.setCoords(),this.renderOnAddRemove&&this.requestRenderAll()}toDatalessJSON(e){return this.toDatalessObject(e)}toObject(e){return this._toObjectMethod(`toObject`,e)}toJSON(){return this.toObject()}toDatalessObject(e){return this._toObjectMethod(`toDatalessObject`,e)}_toObjectMethod(e,t){let n=this.clipPath,r=n&&!n.excludeFromExport?this._toObject(n,e,t):null;return{version:Le,...Xt(this,t),objects:this._objects.filter(e=>!e.excludeFromExport).map(n=>this._toObject(n,e,t)),...this.__serializeBgOverlay(e,t),...r?{clipPath:r}:null}}_toObject(e,t,n){let r;this.includeDefaultValues||(r=e.includeDefaultValues,e.includeDefaultValues=!1);let i=e[t](n);return this.includeDefaultValues||(e.includeDefaultValues=!!r),i}__serializeBgOverlay(e,t){let n={},r=this.backgroundImage,i=this.overlayImage,a=this.backgroundColor,o=this.overlayColor;return $t(a)?a.excludeFromExport||(n.background=a.toObject(t)):a&&(n.background=a),$t(o)?o.excludeFromExport||(n.overlay=o.toObject(t)):o&&(n.overlay=o),r&&!r.excludeFromExport&&(n.backgroundImage=this._toObject(r,e,t)),i&&!i.excludeFromExport&&(n.overlayImage=this._toObject(i,e,t)),n}toSVG(e={},t){e.reviver=t;let n=[];return this._setSVGPreamble(n,e),this._setSVGHeader(n,e),this.clipPath&&n.push(`<g clip-path="url(#${Z(this.clipPath.clipPathId??``)})" >\n`),this._setSVGBgOverlayColor(n,`background`),this._setSVGBgOverlayImage(n,`backgroundImage`,t),this._setSVGObjects(n,t),this.clipPath&&n.push(`</g>
|
|
4
4
|
`),this._setSVGBgOverlayColor(n,`overlay`),this._setSVGBgOverlayImage(n,`overlayImage`,t),n.push(`</svg>`),n.join(``)}_setSVGPreamble(e,t){t.suppressPreamble||e.push(`<?xml version="1.0" encoding="`,t.encoding||`UTF-8`,`" standalone="no" ?>
|
|
5
5
|
`,`<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" `,`"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
@@ -437,5 +437,5 @@ void main() {
|
|
|
437
437
|
color.b += max != color.b ? (max - color.b) * amt : 0.00;
|
|
438
438
|
gl_FragColor = color;
|
|
439
439
|
}
|
|
440
|
-
`}applyTo2d({imageData:{data:e}}){let t=-this.vibrance;for(let n=0;n<e.length;n+=4){let r=e[n],i=e[n+1],a=e[n+2],o=Math.max(r,i,a),s=(r+i+a)/3,c=2*Math.abs(o-s)/255*t;e[n]+=o===r?0:(o-r)*c,e[n+1]+=o===i?0:(o-i)*c,e[n+2]+=o===a?0:(o-a)*c}}sendUniformData(e,t){e.uniform1f(t.uVibrance,-this.vibrance)}isNeutralState(){return this.vibrance===0}};V(il,`type`,`Vibrance`),V(il,`defaults`,{vibrance:0}),V(il,`uniformLocations`,[`uVibrance`]),G.setClass(il),xe({BaseFilter:()=>Q,BlackWhite:()=>Vc,BlendColor:()=>Dc,BlendImage:()=>kc,Blur:()=>Ac,Brightness:()=>jc,Brownie:()=>Fc,ColorMatrix:()=>Nc,Composed:()=>Hc,Contrast:()=>Uc,Convolute:()=>Gc,Gamma:()=>qc,Grayscale:()=>Yc,HueRotation:()=>Zc,Invert:()=>Qc,Kodachrome:()=>Lc,Noise:()=>$c,Pixelate:()=>el,Polaroid:()=>zc,RemoveColor:()=>tl,Resize:()=>nl,Saturation:()=>rl,Sepia:()=>Bc,Technicolor:()=>Rc,Vibrance:()=>il,Vintage:()=>Ic});function al(e){let t=e instanceof uc||e instanceof lc;return{id:e.customId??e.toString(),type:e.type??`object`,left:Math.round(e.left??0),top:Math.round(e.top??0),width:Math.round((e.width??0)*(e.scaleX??1)),height:Math.round((e.height??0)*(e.scaleY??1)),angle:Math.round(e.angle??0),opacity:e.opacity??1,fill:typeof e.fill==`string`?e.fill:null,stroke:typeof e.stroke==`string`?e.stroke:null,strokeWidth:e.strokeWidth??0,...t?{fontFamily:e.fontFamily,fontSize:e.fontSize,fontWeight:e.fontWeight,textAlign:e.textAlign}:{}}}function ol(e){return e.getObjects().filter(e=>e.customId!==`__artboard__`).map((e,t)=>({id:e.customId??`obj-${t}`,type:e.type??`object`,name:e.customName??ye(e.type??`object`,t),visible:e.visible!==!1,locked:!e.selectable}))}function sl(e){let t={left:e.left,top:e.top,selectable:e.selectable!==!1};switch(e.fill!==void 0&&(t.fill=e.fill),e.stroke!==void 0&&(t.stroke=e.stroke),e.strokeWidth!==void 0&&(t.strokeWidth=e.strokeWidth),e.opacity!==void 0&&(t.opacity=e.opacity),e.angle!==void 0&&(t.angle=e.angle),e.scaleX!==void 0&&(t.scaleX=e.scaleX),e.scaleY!==void 0&&(t.scaleY=e.scaleY),e.type){case`rect`:{let n={...t};return e.width!==void 0&&(n.width=e.width),e.height!==void 0&&(n.height=e.height),e.rx!==void 0&&(n.rx=e.rx),e.ry!==void 0&&(n.ry=e.ry),new $a(n)}case`ellipse`:return new Bs({...t,rx:e.rx??(e.width?e.width/2:50),ry:e.ry??(e.height?e.height/2:50)});case`textbox`:{let n={...t};return e.width!==void 0&&(n.width=e.width),e.fontSize!==void 0&&(n.fontSize=e.fontSize),e.fontFamily!==void 0&&(n.fontFamily=e.fontFamily),e.fontWeight!==void 0&&(n.fontWeight=e.fontWeight),e.textAlign!==void 0&&(n.textAlign=e.textAlign),new uc(e.text??``,n)}case`line`:return new Ls([e.left,e.top,e.left+(e.width??100),e.top+(e.height??0)],t);case`path`:return new $a({...t,width:e.width??50,height:e.height??50});default:return new $a({...t,width:e.width??50,height:e.height??50})}}var cl=0;function ll(e){let t=e;return t.customId||=`obj-${++cl}`,t.customId}function ul(e,t){switch(e){case`rect`:return new $a({left:t.x,top:t.y,width:0,height:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1});case`circle`:return new Bs({left:t.x,top:t.y,rx:0,ry:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1});case`line`:return new Ls([t.x,t.y,t.x,t.y],{stroke:`#000000`,strokeWidth:2});case`polygon`:return new $a({left:t.x,top:t.y,width:0,height:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1,rx:8,ry:8});default:return null}}function dl(e){let{activeTool:t,object:n,start:r,pointer:i}=e;return t===`line`&&n instanceof Ls?(n.set({x2:i.x,y2:i.y}),!0):t===`circle`&&n instanceof Bs?(n.set({rx:Math.abs(i.x-r.x)/2,ry:Math.abs(i.y-r.y)/2,left:Math.min(r.x,i.x),top:Math.min(r.y,i.y)}),!0):(n.set({left:Math.min(r.x,i.x),top:Math.min(r.y,i.y),width:Math.abs(i.x-r.x),height:Math.abs(i.y-r.y)}),!0)}function fl(e){return e===`draw`?{isDrawingMode:!0,selection:!0,defaultCursor:`default`,hoverCursor:`move`,pencilBrush:{color:`#000000`,width:3}}:e===`select`?{isDrawingMode:!1,selection:!0,defaultCursor:`default`,hoverCursor:`move`,pencilBrush:null}:{isDrawingMode:!1,selection:!1,defaultCursor:`crosshair`,hoverCursor:`crosshair`,pencilBrush:null}}var $=n(),pl=(0,B.forwardRef)(function({artboardWidth:e,artboardHeight:t,activeTool:n,onSelectionChange:r,onCanvasModified:i,onLayersChange:a,onZoomChange:o},s){let c=(0,B.useRef)(null),l=(0,B.useRef)(null),u=(0,B.useRef)(null),d=(0,B.useRef)(null),f=(0,B.useCallback)(()=>{let e=l.current;e&&a(ol(e))},[a]),p=(0,B.useCallback)(()=>{let e=l.current;if(!e)return;let t=e.getActiveObject();if(!t){r([],null);return}r([ll(t)],al(t))},[r]),m=(0,B.useCallback)(()=>{p(),i(),f()},[p,i,f]),h=(0,B.useCallback)(()=>{let n=l.current,r=u.current;if(!n||!r)return;let{width:i,height:a}=r.getBoundingClientRect(),{scale:s,offsetX:c,offsetY:d}=ge(e,t,i,a);n.setDimensions({width:i,height:a});let f=n.viewportTransform;f[0]=s,f[3]=s,f[4]=c,f[5]=d,n.setViewportTransform(f),o(s),n.requestRenderAll()},[e,t,o]);return(0,B.useEffect)(()=>{let n=c.current;if(!n)return;let i=new hs(n,{backgroundColor:`transparent`,preserveObjectStacking:!0,selection:!0});l.current=i;let a=new $a({width:e,height:t,fill:`#ffffff`,selectable:!1,evented:!1,left:0,top:0,shadow:new Lr({color:`rgba(0,0,0,0.3)`,blur:20,offsetX:0,offsetY:4})});return a.customId=`__artboard__`,i.add(a),d.current=a,i.on(`selection:created`,p),i.on(`selection:updated`,p),i.on(`selection:cleared`,()=>r([],null)),i.on(`object:modified`,m),i.on(`object:added`,f),i.on(`object:removed`,f),requestAnimationFrame(()=>h()),()=>{i.dispose(),l.current=null,d.current=null}},[]),(0,B.useEffect)(()=>{let n=d.current;n&&(n.set({width:e,height:t}),h())},[e,t,h]),(0,B.useEffect)(()=>{let e=u.current;if(!e)return;let t=new ResizeObserver(()=>{requestAnimationFrame(()=>h())});return t.observe(e),()=>t.disconnect()},[h]),(0,B.useEffect)(()=>{let e=l.current;if(!e)return;let t=fl(n);e.isDrawingMode=t.isDrawingMode,e.selection=t.selection,e.defaultCursor=t.defaultCursor,e.hoverCursor=t.hoverCursor,t.pencilBrush&&(e.freeDrawingBrush=new Ns(e),e.freeDrawingBrush.color=t.pencilBrush.color,e.freeDrawingBrush.width=t.pencilBrush.width),e.requestRenderAll()},[n]),(0,B.useEffect)(()=>{let e=l.current;if(!e||n===`select`||n===`draw`||n===`image`)return;let t=!1,r=0,a=0,o=null,s=s=>{let c=s.scenePoint;if(t=!0,r=c.x,a=c.y,n===`text`){let n=new uc(`Type here`,{left:c.x,top:c.y,width:200,fontSize:24,fontFamily:`Inter, sans-serif`,fill:`#000000`});ll(n),e.add(n),e.setActiveObject(n),n.enterEditing(),i(),t=!1;return}o=ul(n,c),o&&(ll(o),e.add(o))},c=i=>{if(!t||!o)return;let s=i.scenePoint;dl({activeTool:n,object:o,start:{x:r,y:a},pointer:s}),e.requestRenderAll()},u=()=>{t&&(t=!1,o&&(e.setActiveObject(o),i()),o=null)};return e.on(`mouse:down`,s),e.on(`mouse:move`,c),e.on(`mouse:up`,u),()=>{e.off(`mouse:down`,s),e.off(`mouse:move`,c),e.off(`mouse:up`,u)}},[n,i]),(0,B.useImperativeHandle)(s,()=>({toJSON:()=>{let e=l.current;return e?JSON.stringify(e.toObject([`customId`,`customName`])):`{}`},loadJSON:async e=>{let t=l.current;t&&(await t.loadFromJSON(e),t.requestRenderAll(),f())},exportPNG:(n=1)=>{let r=l.current,i=d.current;return!r||!i?``:r.toDataURL({format:`png`,multiplier:n,left:i.left,top:i.top,width:e,height:t})},exportSVG:()=>{let e=l.current;return e?e.toSVG():``},getCanvas:()=>l.current,addObject:e=>{let t=l.current;t&&(ll(e),t.add(e),t.setActiveObject(e),i())},fitToView:h,applyGeneratedLayout:e=>{let t=l.current;if(!t)return;let n=t.getObjects();for(let e of n)e.customId!==`__artboard__`&&t.remove(e);for(let n of e){let e=sl(n),r=e;n.customId&&(r.customId=n.customId),n.customName&&(r.customName=n.customName),ll(e),t.add(e)}t.discardActiveObject(),t.requestRenderAll(),i(),f()}})),(0,$.jsx)(`div`,{ref:u,className:`relative flex-1 overflow-hidden bg-muted/35 dark:bg-background`,children:(0,$.jsx)(`canvas`,{ref:c})})}),ml=t(),hl=[{id:`rect`,icon:A,label:`Rectangle`},{id:`circle`,icon:S,label:`Circle`},{id:`line`,icon:M,label:`Line`},{id:`polygon`,icon:L,label:`Rounded Rectangle`}],gl=(0,B.memo)(function(e){let t=(0,ml.c)(17),{activeTool:n,onToolChange:r}=e,[i,a]=(0,B.useState)(!1),s=hl.some(e=>e.id===n),c;t[0]===n?c=t[1]:(c=hl.find(e=>e.id===n),t[0]=n,t[1]=c);let l=c?.icon??A,p=`inline-flex h-7 items-center gap-0.5 rounded-md px-1.5 text-muted-foreground hover:bg-accent hover:text-foreground ${s?`bg-accent text-foreground`:``}`,m;t[2]===l?m=t[3]:(m=(0,$.jsx)(l,{className:`size-3.5`}),t[2]=l,t[3]=m);let h;t[4]===Symbol.for(`react.memo_cache_sentinel`)?(h=(0,$.jsx)(o,{className:`size-2.5`}),t[4]=h):h=t[4];let g;t[5]!==p||t[6]!==m?(g=(0,$.jsxs)(d,{className:p,"aria-label":`Shape tools`,children:[m,h]}),t[5]=p,t[6]=m,t[7]=g):g=t[7];let _;t[8]!==n||t[9]!==r?(_=hl.map(e=>{let t=e.icon;return(0,$.jsxs)(`button`,{onClick:()=>{r(e.id),a(!1)},className:`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-xs hover:bg-accent ${n===e.id?`bg-accent text-foreground`:`text-muted-foreground`}`,children:[(0,$.jsx)(t,{className:`size-3.5`}),e.label]},e.id)}),t[8]=n,t[9]=r,t[10]=_):_=t[10];let v;t[11]===_?v=t[12]:(v=(0,$.jsx)(u,{side:`top`,className:`w-36 p-1`,children:_}),t[11]=_,t[12]=v);let y;return t[13]!==i||t[14]!==g||t[15]!==v?(y=(0,$.jsxs)(f,{open:i,onOpenChange:a,children:[g,v]}),t[13]=i,t[14]=g,t[15]=v,t[16]=y):y=t[16],y}),_l=(0,B.memo)(function(e){let t=(0,ml.c)(77),{activeTool:n,onToolChange:r,canUndo:i,canRedo:o,onUndo:u,onRedo:d,zoomLevel:f,onZoomIn:p,onZoomOut:m,onFitToView:h,canvasRef:g,onCanvasModified:_}=e,v=(0,B.useRef)(null),y;t[0]===Symbol.for(`react.memo_cache_sentinel`)?(y=()=>{v.current?.click()},t[0]=y):y=t[0];let b=y,x;t[1]!==g||t[2]!==_?(x=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.addEventListener(`load`,async()=>{let e=n.result,t=await xc.fromURL(e);t.scaleToWidth(300),g.current?.addObject(t),_()}),n.readAsDataURL(t),e.target.value=``},t[1]=g,t[2]=_,t[3]=x):x=t[3];let S=x,C;t[4]===Symbol.for(`react.memo_cache_sentinel`)?(C={id:`select`,icon:(0,$.jsx)(ie,{className:`size-3.5`}),label:`Select (V)`},t[4]=C):C=t[4];let w;t[5]===Symbol.for(`react.memo_cache_sentinel`)?(w=[C,{id:`text`,icon:(0,$.jsx)(a,{className:`size-3.5`}),label:`Text (T)`}],t[5]=w):w=t[5];let T=w,E,O;t[6]!==n||t[7]!==r?(E=T.map(e=>(0,$.jsxs)(s,{children:[(0,$.jsx)(l,{render:(0,$.jsx)(F,{pressed:n===e.id,onPressedChange:()=>r(e.id),"aria-label":e.label,size:`xs`,variant:`default`,children:e.icon})}),(0,$.jsx)(c,{side:`top`,children:e.label})]},e.id)),O=(0,$.jsx)(gl,{activeTool:n,onToolChange:r}),t[6]=n,t[7]=r,t[8]=E,t[9]=O):(E=t[8],O=t[9]);let k=n===`image`,A;t[10]===Symbol.for(`react.memo_cache_sentinel`)?(A=(0,$.jsx)(te,{className:`size-3.5`}),t[10]=A):A=t[10];let j;t[11]===k?j=t[12]:(j=(0,$.jsx)(l,{render:(0,$.jsx)(F,{pressed:k,onPressedChange:b,"aria-label":`Image`,size:`xs`,variant:`default`,children:A})}),t[11]=k,t[12]=j);let M;t[13]===Symbol.for(`react.memo_cache_sentinel`)?(M=(0,$.jsx)(c,{side:`top`,children:`Upload Image`}),t[13]=M):M=t[13];let N;t[14]===j?N=t[15]:(N=(0,$.jsxs)(s,{children:[j,M]}),t[14]=j,t[15]=N);let P=n===`draw`,I;t[16]===r?I=t[17]:(I=()=>r(`draw`),t[16]=r,t[17]=I);let ee;t[18]===Symbol.for(`react.memo_cache_sentinel`)?(ee=(0,$.jsx)(ae,{className:`size-3.5`}),t[18]=ee):ee=t[18];let L;t[19]!==P||t[20]!==I?(L=(0,$.jsx)(l,{render:(0,$.jsx)(F,{pressed:P,onPressedChange:I,"aria-label":`Draw`,size:`xs`,variant:`default`,children:ee})}),t[19]=P,t[20]=I,t[21]=L):L=t[21];let R;t[22]===Symbol.for(`react.memo_cache_sentinel`)?(R=(0,$.jsx)(c,{side:`top`,children:`Freehand Draw (D)`}),t[22]=R):R=t[22];let z;t[23]===L?z=t[24]:(z=(0,$.jsxs)(s,{children:[L,R]}),t[23]=L,t[24]=z);let re;t[25]===Symbol.for(`react.memo_cache_sentinel`)?(re=(0,$.jsx)(`div`,{className:`mx-1 h-4 w-px bg-border`}),t[25]=re):re=t[25];let se=!i,ce;t[26]===Symbol.for(`react.memo_cache_sentinel`)?(ce=(0,$.jsx)(D,{className:`size-3.5`}),t[26]=ce):ce=t[26];let de;t[27]!==u||t[28]!==se?(de=(0,$.jsx)(l,{render:(0,$.jsx)(`button`,{onClick:u,disabled:se,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-30 disabled:hover:bg-transparent`,"aria-label":`Undo`,children:ce})}),t[27]=u,t[28]=se,t[29]=de):de=t[29];let fe;t[30]===Symbol.for(`react.memo_cache_sentinel`)?(fe=(0,$.jsx)(c,{side:`top`,children:`Undo (Ctrl+Z)`}),t[30]=fe):fe=t[30];let pe;t[31]===de?pe=t[32]:(pe=(0,$.jsxs)(s,{children:[de,fe]}),t[31]=de,t[32]=pe);let me=!o,he;t[33]===Symbol.for(`react.memo_cache_sentinel`)?(he=(0,$.jsx)(oe,{className:`size-3.5`}),t[33]=he):he=t[33];let ge;t[34]!==d||t[35]!==me?(ge=(0,$.jsx)(l,{render:(0,$.jsx)(`button`,{onClick:d,disabled:me,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-30 disabled:hover:bg-transparent`,"aria-label":`Redo`,children:he})}),t[34]=d,t[35]=me,t[36]=ge):ge=t[36];let _e;t[37]===Symbol.for(`react.memo_cache_sentinel`)?(_e=(0,$.jsx)(c,{side:`top`,children:`Redo (Ctrl+Shift+Z)`}),t[37]=_e):_e=t[37];let ve;t[38]===ge?ve=t[39]:(ve=(0,$.jsxs)(s,{children:[ge,_e]}),t[38]=ge,t[39]=ve);let ye;t[40]===Symbol.for(`react.memo_cache_sentinel`)?(ye=(0,$.jsx)(`div`,{className:`flex-1`}),t[40]=ye):ye=t[40];let be;t[41]===Symbol.for(`react.memo_cache_sentinel`)?(be=(0,$.jsx)(ue,{className:`size-3.5`}),t[41]=be):be=t[41];let xe;t[42]===m?xe=t[43]:(xe=(0,$.jsx)(l,{render:(0,$.jsx)(`button`,{onClick:m,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Zoom out`,children:be})}),t[42]=m,t[43]=xe);let Se;t[44]===Symbol.for(`react.memo_cache_sentinel`)?(Se=(0,$.jsx)(c,{side:`top`,children:`Zoom Out`}),t[44]=Se):Se=t[44];let Ce;t[45]===xe?Ce=t[46]:(Ce=(0,$.jsxs)(s,{children:[xe,Se]}),t[45]=xe,t[46]=Ce);let V;t[47]===f?V=t[48]:(V=Math.round(f*100),t[47]=f,t[48]=V);let we;t[49]===V?we=t[50]:(we=(0,$.jsxs)(`span`,{className:`min-w-[3rem] text-center text-xs tabular-nums text-muted-foreground`,children:[V,`%`]}),t[49]=V,t[50]=we);let H;t[51]===Symbol.for(`react.memo_cache_sentinel`)?(H=(0,$.jsx)(le,{className:`size-3.5`}),t[51]=H):H=t[51];let Te;t[52]===p?Te=t[53]:(Te=(0,$.jsx)(l,{render:(0,$.jsx)(`button`,{onClick:p,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Zoom in`,children:H})}),t[52]=p,t[53]=Te);let Ee;t[54]===Symbol.for(`react.memo_cache_sentinel`)?(Ee=(0,$.jsx)(c,{side:`top`,children:`Zoom In`}),t[54]=Ee):Ee=t[54];let De;t[55]===Te?De=t[56]:(De=(0,$.jsxs)(s,{children:[Te,Ee]}),t[55]=Te,t[56]=De);let Oe;t[57]===Symbol.for(`react.memo_cache_sentinel`)?(Oe=(0,$.jsx)(ne,{className:`size-3.5`}),t[57]=Oe):Oe=t[57];let ke;t[58]===h?ke=t[59]:(ke=(0,$.jsx)(l,{render:(0,$.jsx)(`button`,{onClick:h,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Fit to view`,children:Oe})}),t[58]=h,t[59]=ke);let Ae;t[60]===Symbol.for(`react.memo_cache_sentinel`)?(Ae=(0,$.jsx)(c,{side:`top`,children:`Fit to View`}),t[60]=Ae):Ae=t[60];let je;t[61]===ke?je=t[62]:(je=(0,$.jsxs)(s,{children:[ke,Ae]}),t[61]=ke,t[62]=je);let Me;t[63]===S?Me=t[64]:(Me=(0,$.jsx)(`input`,{ref:v,type:`file`,accept:`image/*`,className:`hidden`,onChange:S}),t[63]=S,t[64]=Me);let Ne;return t[65]!==N||t[66]!==z||t[67]!==pe||t[68]!==ve||t[69]!==Ce||t[70]!==we||t[71]!==De||t[72]!==je||t[73]!==Me||t[74]!==E||t[75]!==O?(Ne=(0,$.jsxs)(`div`,{className:`flex items-center gap-1 border-t border-border bg-card px-2 py-1.5`,children:[E,O,N,z,re,pe,ve,ye,Ce,we,De,je,Me]}),t[65]=N,t[66]=z,t[67]=pe,t[68]=ve,t[69]=Ce,t[70]=we,t[71]=De,t[72]=je,t[73]=Me,t[74]=E,t[75]=O,t[76]=Ne):Ne=t[76],Ne});function vl(e){switch(e){case`textbox`:case`i-text`:return a;case`rect`:return A;case`circle`:case`ellipse`:return S;case`image`:return R;case`path`:return ae;default:return A}}var yl=(0,B.memo)(function(e){let t=(0,ml.c)(12),{layers:n,selectedObjectIds:r,onLayerSelect:i,onLayerVisibilityToggle:a}=e;if(n.length===0){let e;return t[0]===Symbol.for(`react.memo_cache_sentinel`)?(e=(0,$.jsx)(`p`,{className:`text-[10px] text-muted-foreground`,children:`No objects on canvas`}),t[0]=e):e=t[0],e}let o;if(t[1]!==n||t[2]!==i||t[3]!==a||t[4]!==r){let e;t[6]!==i||t[7]!==a||t[8]!==r?(e=e=>{let t=vl(e.type),n=r.includes(e.id);return(0,$.jsxs)(`div`,{onClick:()=>i(e.id),className:`flex cursor-pointer items-center gap-1.5 rounded px-1.5 py-1 text-[10px] ${n?`bg-primary/10 text-primary`:`text-muted-foreground hover:bg-accent hover:text-foreground`}`,children:[(0,$.jsx)(`button`,{onClick:t=>{t.stopPropagation(),a(e.id)},className:`inline-flex size-4 items-center justify-center rounded hover:bg-accent`,children:e.visible?(0,$.jsx)(b,{className:`size-2.5`}):(0,$.jsx)(O,{className:`size-2.5 opacity-40`})}),(0,$.jsx)(t,{className:`size-3 shrink-0`}),(0,$.jsx)(`span`,{className:`min-w-0 truncate`,children:e.name})]},e.id)},t[6]=i,t[7]=a,t[8]=r,t[9]=e):e=t[9],o=[...n].toReversed().map(e),t[1]=n,t[2]=i,t[3]=a,t[4]=r,t[5]=o}else o=t[5];let s;return t[10]===o?s=t[11]:(s=(0,$.jsx)(`div`,{className:`flex flex-col gap-0.5`,children:o}),t[10]=o,t[11]=s),s}),bl=(0,B.memo)(function(e){let t=(0,ml.c)(29),{open:n,properties:r,layers:a,onClose:o,onPropertyChange:s,onLayerSelect:c,onLayerVisibilityToggle:l,onMoveUp:u,onMoveDown:d,onBringToFront:f,onSendToBack:p}=e,m;t[0]===s?m=t[1]:(m=(e,t)=>{let n=Number.parseFloat(t);Number.isNaN(n)||s(e,n)},t[0]=s,t[1]=m);let h=m;if(!n)return null;let _=r?.type===`textbox`||r?.type===`i-text`,v;t[2]===Symbol.for(`react.memo_cache_sentinel`)?(v=(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Properties`}),t[2]=v):v=t[2];let y;t[3]===Symbol.for(`react.memo_cache_sentinel`)?(y=(0,$.jsx)(i,{className:`size-3`}),t[3]=y):y=t[3];let b;t[4]===o?b=t[5]:(b=(0,$.jsxs)(`div`,{className:`flex items-center justify-between border-b border-border px-3 py-2`,children:[v,(0,$.jsx)(`button`,{onClick:o,className:`inline-flex size-5 items-center justify-center rounded text-muted-foreground hover:text-foreground`,children:y})]}),t[4]=o,t[5]=b);let S;t[6]!==h||t[7]!==_||t[8]!==f||t[9]!==d||t[10]!==u||t[11]!==s||t[12]!==p||t[13]!==r?(S=r?(0,$.jsxs)(`div`,{className:`space-y-3 p-3`,children:[(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Transform`}),(0,$.jsxs)(`div`,{className:`grid grid-cols-2 gap-2`,children:[(0,$.jsx)(xl,{label:`X`,value:r.left,onChange:e=>h(`left`,e)}),(0,$.jsx)(xl,{label:`Y`,value:r.top,onChange:e=>h(`top`,e)}),(0,$.jsx)(xl,{label:`W`,value:r.width,onChange:e=>h(`scaleWidth`,e)}),(0,$.jsx)(xl,{label:`H`,value:r.height,onChange:e=>h(`scaleHeight`,e)}),(0,$.jsx)(xl,{label:`R`,value:r.angle,onChange:e=>h(`angle`,e)})]})]}),(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Appearance`}),(0,$.jsxs)(`div`,{className:`space-y-2`,children:[(0,$.jsx)(Sl,{label:`Fill`,value:r.fill??``,onChange:e=>s(`fill`,e)}),(0,$.jsx)(Sl,{label:`Stroke`,value:r.stroke??``,onChange:e=>s(`stroke`,e)}),(0,$.jsx)(xl,{label:`Stroke W`,value:r.strokeWidth,onChange:e=>h(`strokeWidth`,e)}),(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Opacity`}),(0,$.jsx)(`input`,{type:`range`,min:0,max:1,step:.01,value:r.opacity,onChange:e=>s(`opacity`,Number.parseFloat(e.target.value)),className:`h-1 flex-1 appearance-none rounded-full bg-border accent-primary`}),(0,$.jsxs)(`span`,{className:`w-8 text-right text-[10px] tabular-nums text-muted-foreground`,children:[Math.round(r.opacity*100),`%`]})]})]})]}),_&&(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Text`}),(0,$.jsxs)(`div`,{className:`space-y-2`,children:[(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Font`}),(0,$.jsx)(`input`,{type:`text`,value:r.fontFamily??`Inter`,onChange:e=>s(`fontFamily`,e.target.value),className:`h-6 flex-1 rounded border border-border bg-background px-1.5 text-[10px] text-foreground`})]}),(0,$.jsx)(xl,{label:`Size`,value:r.fontSize??16,onChange:e=>h(`fontSize`,e)}),(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Align`}),(0,$.jsx)(`div`,{className:`flex gap-1`,children:[`left`,`center`,`right`].map(e=>(0,$.jsx)(`button`,{onClick:()=>s(`textAlign`,e),className:`rounded px-1.5 py-0.5 text-[10px] ${r.textAlign===e?`bg-primary text-primary-foreground`:`bg-background text-muted-foreground hover:text-foreground`}`,children:e.charAt(0).toUpperCase()+e.slice(1)},e))})]})]})]}),(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Order`}),(0,$.jsxs)(`div`,{className:`flex gap-1`,children:[(0,$.jsx)(Cl,{icon:(0,$.jsx)(x,{className:`size-3`}),label:`Bring to front`,onClick:f}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(N,{className:`size-3`}),label:`Move up`,onClick:u}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(P,{className:`size-3`}),label:`Move down`,onClick:d}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(g,{className:`size-3`}),label:`Send to back`,onClick:p})]})]})]}):null,t[6]=h,t[7]=_,t[8]=f,t[9]=d,t[10]=u,t[11]=s,t[12]=p,t[13]=r,t[14]=S):S=t[14];let C;t[15]===Symbol.for(`react.memo_cache_sentinel`)?(C=(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Layers`}),t[15]=C):C=t[15];let w;t[16]===r?w=t[17]:(w=r?[r.id]:[],t[16]=r,t[17]=w);let T;t[18]!==a||t[19]!==c||t[20]!==l||t[21]!==w?(T=(0,$.jsxs)(`div`,{className:`border-t border-border p-3`,children:[C,(0,$.jsx)(yl,{layers:a,selectedObjectIds:w,onLayerSelect:c,onLayerVisibilityToggle:l})]}),t[18]=a,t[19]=c,t[20]=l,t[21]=w,t[22]=T):T=t[22];let E;t[23]!==S||t[24]!==T?(E=(0,$.jsxs)(`div`,{className:`flex-1 overflow-y-auto`,children:[S,T]}),t[23]=S,t[24]=T,t[25]=E):E=t[25];let D;return t[26]!==b||t[27]!==E?(D=(0,$.jsxs)(`div`,{className:`absolute right-0 top-0 z-10 flex h-full w-56 flex-col border-l border-border bg-card`,children:[b,E]}),t[26]=b,t[27]=E,t[28]=D):D=t[28],D});function xl(e){let t=(0,ml.c)(12),{label:n,value:r,onChange:i}=e,a;t[0]===n?a=t[1]:(a=(0,$.jsx)(`label`,{className:`w-5 text-[10px] text-muted-foreground`,children:n}),t[0]=n,t[1]=a);let o;t[2]===r?o=t[3]:(o=Math.round(r),t[2]=r,t[3]=o);let s;t[4]===i?s=t[5]:(s=e=>i(e.target.value),t[4]=i,t[5]=s);let c;t[6]!==o||t[7]!==s?(c=(0,$.jsx)(`input`,{type:`number`,value:o,onChange:s,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px] tabular-nums text-foreground`}),t[6]=o,t[7]=s,t[8]=c):c=t[8];let l;return t[9]!==a||t[10]!==c?(l=(0,$.jsxs)(`div`,{className:`flex items-center gap-1`,children:[a,c]}),t[9]=a,t[10]=c,t[11]=l):l=t[11],l}function Sl(e){let t=(0,ml.c)(15),{label:n,value:r,onChange:i}=e,a;t[0]===n?a=t[1]:(a=(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:n}),t[0]=n,t[1]=a);let o=r||`#000000`,s;t[2]===i?s=t[3]:(s=e=>i(e.target.value),t[2]=i,t[3]=s);let c;t[4]!==o||t[5]!==s?(c=(0,$.jsx)(`input`,{type:`color`,value:o,onChange:s,className:`size-5 cursor-pointer rounded border border-border`}),t[4]=o,t[5]=s,t[6]=c):c=t[6];let l=r||`none`,u;t[7]===l?u=t[8]:(u=(0,$.jsx)(`span`,{className:`text-[10px] tabular-nums text-muted-foreground`,children:l}),t[7]=l,t[8]=u);let d;t[9]!==c||t[10]!==u?(d=(0,$.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[c,u]}),t[9]=c,t[10]=u,t[11]=d):d=t[11];let f;return t[12]!==a||t[13]!==d?(f=(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[a,d]}),t[12]=a,t[13]=d,t[14]=f):f=t[14],f}function Cl(e){let t=(0,ml.c)(4),{icon:n,label:r,onClick:i}=e,a;return t[0]!==n||t[1]!==r||t[2]!==i?(a=(0,$.jsx)(`button`,{onClick:i,className:`inline-flex size-7 items-center justify-center rounded border border-border bg-background text-muted-foreground hover:text-foreground`,title:r,children:n}),t[0]=n,t[1]=r,t[2]=i,t[3]=a):a=t[3],a}var wl=(0,B.memo)(function(e){let t=(0,ml.c)(67),{artboardPresetId:n,artboardWidth:r,artboardHeight:i,onSelectPreset:a,onCustomSize:s}=e,[c,l]=(0,B.useState)(!1),[p,m]=(0,B.useState)(String(r)),[h,g]=(0,B.useState)(String(i)),_;t[0]===n?_=t[1]:(_=n?fe.get(n):null,t[0]=n,t[1]=_);let v=_,y=v?v.label:`${r} x ${i}`,b,x,S,C,w,T,E,D,O,k,A;if(t[2]!==i||t[3]!==r||t[4]!==h||t[5]!==p||t[6]!==y||t[7]!==s||t[8]!==c){let e=pe(),n;t[20]!==h||t[21]!==p||t[22]!==s?(n=()=>{let e=Number.parseInt(p,10),t=Number.parseInt(h,10);e>0&&t>0&&(s(e,t),l(!1))},t[20]=h,t[21]=p,t[22]=s,t[23]=n):n=t[23],S=n,x=f,O=c,k=l;let a;t[24]===y?a=t[25]:(a=(0,$.jsx)(`span`,{className:`max-w-[140px] truncate`,children:y}),t[24]=y,t[25]=a);let m;t[26]!==i||t[27]!==r?(m=(0,$.jsxs)(`span`,{className:`tabular-nums opacity-60`,children:[r,`x`,i]}),t[26]=i,t[27]=r,t[28]=m):m=t[28];let g;t[29]===Symbol.for(`react.memo_cache_sentinel`)?(g=(0,$.jsx)(o,{className:`size-3`}),t[29]=g):g=t[29],t[30]!==a||t[31]!==m?(A=(0,$.jsxs)(d,{className:`inline-flex items-center gap-1 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[a,m,g]}),t[30]=a,t[31]=m,t[32]=A):A=t[32],b=u,T=`bottom`,E=`start`,D=`w-64 p-0`,w=`max-h-72 overflow-y-auto p-1`,C=[...e.entries()],t[2]=i,t[3]=r,t[4]=h,t[5]=p,t[6]=y,t[7]=s,t[8]=c,t[9]=b,t[10]=x,t[11]=S,t[12]=C,t[13]=w,t[14]=T,t[15]=E,t[16]=D,t[17]=O,t[18]=k,t[19]=A}else b=t[9],x=t[10],S=t[11],C=t[12],w=t[13],T=t[14],E=t[15],D=t[16],O=t[17],k=t[18],A=t[19];let j;t[33]!==n||t[34]!==a||t[35]!==C?(j=C.map(e=>{let[t,r]=e;return(0,$.jsxs)(`div`,{children:[(0,$.jsx)(`div`,{className:`px-2 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:t}),r.map(e=>(0,$.jsxs)(`button`,{onClick:()=>{a(e),l(!1)},className:`flex w-full items-center justify-between rounded-md px-2 py-1.5 text-xs hover:bg-accent ${n===e.id?`bg-accent text-foreground`:`text-muted-foreground`}`,children:[(0,$.jsx)(`span`,{children:e.label}),(0,$.jsxs)(`span`,{className:`tabular-nums opacity-60`,children:[e.width,`x`,e.height]})]},e.id))]},t)}),t[33]=n,t[34]=a,t[35]=C,t[36]=j):j=t[36];let M;t[37]!==j||t[38]!==w?(M=(0,$.jsx)(`div`,{className:w,children:j}),t[37]=j,t[38]=w,t[39]=M):M=t[39];let N;t[40]===Symbol.for(`react.memo_cache_sentinel`)?(N=(0,$.jsx)(`div`,{className:`mb-1.5 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Custom Size`}),t[40]=N):N=t[40];let P;t[41]===Symbol.for(`react.memo_cache_sentinel`)?(P=e=>m(e.target.value),t[41]=P):P=t[41];let F;t[42]===p?F=t[43]:(F=(0,$.jsx)(`input`,{type:`number`,value:p,onChange:P,placeholder:`Width`,className:`h-6 w-20 rounded border border-border bg-background px-1.5 text-[10px] tabular-nums`}),t[42]=p,t[43]=F);let I;t[44]===Symbol.for(`react.memo_cache_sentinel`)?(I=(0,$.jsx)(`span`,{className:`text-[10px] text-muted-foreground`,children:`x`}),t[44]=I):I=t[44];let ee;t[45]===Symbol.for(`react.memo_cache_sentinel`)?(ee=e=>g(e.target.value),t[45]=ee):ee=t[45];let L;t[46]===h?L=t[47]:(L=(0,$.jsx)(`input`,{type:`number`,value:h,onChange:ee,placeholder:`Height`,className:`h-6 w-20 rounded border border-border bg-background px-1.5 text-[10px] tabular-nums`}),t[46]=h,t[47]=L);let te;t[48]===S?te=t[49]:(te=(0,$.jsx)(`button`,{onClick:S,className:`h-6 rounded bg-primary px-2 text-[10px] font-medium text-primary-foreground hover:bg-primary/90`,children:`Apply`}),t[48]=S,t[49]=te);let R;t[50]!==F||t[51]!==L||t[52]!==te?(R=(0,$.jsxs)(`div`,{className:`border-t border-border p-2`,children:[N,(0,$.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[F,I,L,te]})]}),t[50]=F,t[51]=L,t[52]=te,t[53]=R):R=t[53];let z;t[54]!==b||t[55]!==M||t[56]!==R||t[57]!==T||t[58]!==E||t[59]!==D?(z=(0,$.jsxs)(b,{side:T,align:E,className:D,children:[M,R]}),t[54]=b,t[55]=M,t[56]=R,t[57]=T,t[58]=E,t[59]=D,t[60]=z):z=t[60];let ne;return t[61]!==x||t[62]!==z||t[63]!==O||t[64]!==k||t[65]!==A?(ne=(0,$.jsxs)(x,{open:O,onOpenChange:k,children:[A,z]}),t[61]=x,t[62]=z,t[63]=O,t[64]=k,t[65]=A,t[66]=ne):ne=t[66],ne}),Tl=(0,B.memo)(function({canvasRef:e,artboardWidth:t,artboardHeight:n,savedDesigns:r,onSaveDesign:i,onLoadDesign:a,onDeleteDesign:o}){let[s,c]=(0,B.useState)(!1),[l,p]=(0,B.useState)(!1),m=t=>{let n=e.current?.exportPNG(t);n&&me(n,`design-${Date.now()}.png`),c(!1)},g=()=>{let t=e.current?.exportSVG();t&&he(new Blob([t],{type:`image/svg+xml`}),`design-${Date.now()}.svg`),c(!1)},_=async()=>{let r=e.current?.exportPNG(2);if(!r)return;let{jsPDF:i}=await h(async()=>{let{jsPDF:e}=await import(`./jspdf.es.min-Hx4pHu4X.js`);return{jsPDF:e}},__vite__mapDeps([0,1,2,3])),a=new i({orientation:t>n?`landscape`:`portrait`,unit:`px`,format:[t,n]});a.addImage(r,`PNG`,0,0,t,n),a.save(`design-${Date.now()}.pdf`),c(!1)},b=()=>{let t=e.current?.toJSON();t&&(i(`design-${Date.now()}`,`Design ${new Date().toLocaleString()}`,t),c(!1))},x=e=>{a(e),c(!1),p(!1)},S=Object.entries(r).toSorted(([,e],[,t])=>new Date(t.updatedAt).getTime()-new Date(e.updatedAt).getTime());return(0,$.jsxs)(f,{open:s,onOpenChange:e=>{c(e),e||p(!1)},children:[(0,$.jsxs)(d,{className:`inline-flex items-center gap-1.5 rounded-md bg-success px-2.5 py-1 text-xs font-medium text-white hover:bg-success`,children:[(0,$.jsx)(T,{className:`size-3`}),`Export`]}),(0,$.jsx)(u,{side:`bottom`,align:`end`,className:`w-52 p-1`,children:l?(0,$.jsxs)(`div`,{children:[(0,$.jsx)(`button`,{onClick:()=>p(!1),className:`mb-1 w-full rounded px-2 py-1 text-left text-[10px] text-muted-foreground hover:bg-accent`,children:`← Back`}),S.map(([e,t])=>(0,$.jsxs)(`div`,{className:`flex items-center gap-1 rounded px-1 py-0.5 hover:bg-accent`,children:[(0,$.jsx)(`button`,{onClick:()=>x(t.json),className:`flex-1 truncate px-1 py-1 text-left text-xs text-foreground`,children:t.name}),(0,$.jsx)(`button`,{onClick:()=>o(e),className:`inline-flex size-5 items-center justify-center rounded text-muted-foreground hover:text-destructive`,children:(0,$.jsx)(se,{className:`size-3`})})]},e))]}):(0,$.jsxs)($.Fragment,{children:[(0,$.jsxs)(El,{label:`Export`,children:[(0,$.jsx)(Dl,{icon:(0,$.jsx)(R,{className:`size-3.5`}),label:`PNG (1x)`,onClick:()=>m(1)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(R,{className:`size-3.5`}),label:`PNG (2x)`,onClick:()=>m(2)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(I,{className:`size-3.5`}),label:`SVG`,onClick:g}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(y,{className:`size-3.5`}),label:`PDF`,onClick:()=>void _()})]}),(0,$.jsx)(`div`,{className:`my-1 h-px bg-border`}),(0,$.jsxs)(El,{label:`Design`,children:[(0,$.jsx)(Dl,{icon:(0,$.jsx)(v,{className:`size-3.5`}),label:`Save Design`,onClick:b}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(ee,{className:`size-3.5`}),label:`Load Design (${S.length})`,onClick:()=>p(!0),disabled:S.length===0})]})]})})]})});function El(e){let t=(0,ml.c)(5),{label:n,children:r}=e,i;t[0]===n?i=t[1]:(i=(0,$.jsx)(`div`,{className:`px-2 py-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:n}),t[0]=n,t[1]=i);let a;return t[2]!==r||t[3]!==i?(a=(0,$.jsxs)(`div`,{children:[i,r]}),t[2]=r,t[3]=i,t[4]=a):a=t[4],a}function Dl(e){let t=(0,ml.c)(5),{icon:n,label:r,onClick:i,disabled:a}=e,o;return t[0]!==a||t[1]!==n||t[2]!==r||t[3]!==i?(o=(0,$.jsxs)(`button`,{onClick:i,disabled:a,className:`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-xs text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-40`,children:[n,r]}),t[0]=a,t[1]=n,t[2]=r,t[3]=i,t[4]=o):o=t[4],o}var Ol=(0,B.memo)(function(e){let t=(0,ml.c)(26),{canvasRef:n,artboardWidth:r,artboardHeight:i,brandKit:a,onCanvasModified:o}=e,[s,c]=(0,B.useState)(!1),[l,p]=(0,B.useState)(``),m;t[0]!==i||t[1]!==r||t[2]!==a||t[3]!==n||t[4]!==o||t[5]!==l?(m=()=>{let e=l.trim();if(!e)return;let t=C(e,r,i,a);n.current?.applyGeneratedLayout(t.objects),o(),p(``),c(!1)},t[0]=i,t[1]=r,t[2]=a,t[3]=n,t[4]=o,t[5]=l,t[6]=m):m=t[6];let h=m,g;t[7]===h?g=t[8]:(g=e=>{e.key===`Enter`&&!e.shiftKey&&(e.preventDefault(),h())},t[7]=h,t[8]=g);let _=g,v;t[9]===Symbol.for(`react.memo_cache_sentinel`)?(v=(0,$.jsxs)(d,{className:`inline-flex items-center gap-1.5 rounded-md bg-primary/10 px-2.5 py-1 text-xs font-medium text-primary hover:bg-primary/20`,children:[(0,$.jsx)(ce,{className:`size-3`}),`Quick Create`]}),t[9]=v):v=t[9];let y,b;t[10]===Symbol.for(`react.memo_cache_sentinel`)?(y=(0,$.jsx)(`div`,{className:`mb-2 text-xs font-semibold text-foreground`,children:`Generate Design`}),b=(0,$.jsx)(`p`,{className:`mb-3 text-[10px] text-muted-foreground`,children:`Describe what you want and we'll generate a canvas layout for you.`}),t[10]=y,t[11]=b):(y=t[10],b=t[11]);let x;t[12]===Symbol.for(`react.memo_cache_sentinel`)?(x=e=>p(e.target.value),t[12]=x):x=t[12];let S;t[13]!==_||t[14]!==l?(S=(0,$.jsx)(`textarea`,{value:l,onChange:x,onKeyDown:_,placeholder:`e.g. Bold sale announcement for Instagram...`,rows:3,className:`mb-2 w-full resize-none rounded-md border border-border bg-background px-2.5 py-2 text-xs placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-primary`,autoFocus:!0}),t[13]=_,t[14]=l,t[15]=S):S=t[15];let w;t[16]===Symbol.for(`react.memo_cache_sentinel`)?(w=(0,$.jsx)(`span`,{className:`text-[10px] text-muted-foreground`,children:`Press Enter to generate`}),t[16]=w):w=t[16];let T=!l.trim(),E;t[17]!==h||t[18]!==T?(E=(0,$.jsxs)(`div`,{className:`flex items-center justify-between`,children:[w,(0,$.jsx)(`button`,{onClick:h,disabled:T,className:`rounded-md bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground hover:bg-primary/90 disabled:opacity-40`,children:`Generate`})]}),t[17]=h,t[18]=T,t[19]=E):E=t[19];let D;t[20]!==E||t[21]!==S?(D=(0,$.jsxs)(u,{side:`bottom`,align:`start`,className:`w-80 p-3`,children:[y,b,S,E]}),t[20]=E,t[21]=S,t[22]=D):D=t[22];let O;return t[23]!==s||t[24]!==D?(O=(0,$.jsxs)(f,{open:s,onOpenChange:c,children:[v,D]}),t[23]=s,t[24]=D,t[25]=O):O=t[25],O}),kl={social:`Social Media`,business:`Business`,marketing:`Marketing`,presentation:`Presentations`},Al=(0,B.memo)(function(e){let t=(0,ml.c)(50),{canvasRef:n,brandKit:r,onCanvasModified:i,onSelectPreset:a}=e,[o,s]=(0,B.useState)(!1),[c,l]=(0,B.useState)(null),p,m,h,g,v,y,b,x,S,w,T;if(t[0]!==c||t[1]!==r||t[2]!==n||t[3]!==i||t[4]!==a||t[5]!==o){let e=_(),D=[...e.keys()],O=c?e.get(c)??[]:E,k;t[17]!==r||t[18]!==n||t[19]!==i||t[20]!==a?(k=e=>{let t=fe.get(e.presetId);t&&a(t);let o=t?.width??1080,c=t?.height??1080,l=C(e.previewPrompt,o,c,r);requestAnimationFrame(()=>{n.current?.applyGeneratedLayout(l.objects),i()}),s(!1)},t[17]=r,t[18]=n,t[19]=i,t[20]=a,t[21]=k):k=t[21];let A=k;m=f,S=o,w=s,t[22]===Symbol.for(`react.memo_cache_sentinel`)?(T=(0,$.jsxs)(d,{className:`inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[(0,$.jsx)(z,{className:`size-3`}),`Templates`]}),t[22]=T):T=t[22],p=u,v=`bottom`,y=`start`,b=`w-80 p-0`;let j;t[23]===Symbol.for(`react.memo_cache_sentinel`)?(j=()=>l(null),t[23]=j):j=t[23];let M=`rounded-md px-2 py-1 text-[10px] font-medium ${c===null?`bg-primary/10 text-primary`:`text-muted-foreground hover:text-foreground`}`,N;t[24]===M?N=t[25]:(N=(0,$.jsx)(`button`,{onClick:j,className:M,children:`All`}),t[24]=M,t[25]=N);let P;t[26]!==c||t[27]!==D?(P=D.map(e=>(0,$.jsx)(`button`,{onClick:()=>l(e),className:`rounded-md px-2 py-1 text-[10px] font-medium ${c===e?`bg-primary/10 text-primary`:`text-muted-foreground hover:text-foreground`}`,children:kl[e]??e},e)),t[26]=c,t[27]=D,t[28]=P):P=t[28],t[29]!==N||t[30]!==P?(x=(0,$.jsxs)(`div`,{className:`flex gap-1 border-b border-border px-2 py-1.5`,children:[N,P]}),t[29]=N,t[30]=P,t[31]=x):x=t[31],h=`grid max-h-64 grid-cols-2 gap-1.5 overflow-y-auto p-2`;let F;t[32]===A?F=t[33]:(F=e=>{let t=fe.get(e.presetId);return(0,$.jsxs)(`button`,{onClick:()=>A(e),className:`group flex flex-col rounded-lg border border-border p-2 text-left hover:border-primary/50 hover:bg-accent/50`,children:[(0,$.jsx)(`div`,{className:`mb-1.5 h-12 w-full rounded-md`,style:{background:e.style===`bold`?`linear-gradient(135deg, #1f2937, #374151)`:e.style===`gradient`?`linear-gradient(135deg, #4f46e5, #818cf8)`:e.style===`centered`?`linear-gradient(135deg, #fef3c7, #fde68a)`:e.style===`split`?`linear-gradient(90deg, #0ea5e9 45%, #f8fafc 45%)`:`#f8fafc`}}),(0,$.jsx)(`span`,{className:`text-[10px] font-medium text-foreground group-hover:text-primary`,children:e.name}),(0,$.jsx)(`span`,{className:`text-[9px] text-muted-foreground`,children:t?.label??e.presetId})]},e.id)},t[32]=A,t[33]=F),g=O.map(F),t[0]=c,t[1]=r,t[2]=n,t[3]=i,t[4]=a,t[5]=o,t[6]=p,t[7]=m,t[8]=h,t[9]=g,t[10]=v,t[11]=y,t[12]=b,t[13]=x,t[14]=S,t[15]=w,t[16]=T}else p=t[6],m=t[7],h=t[8],g=t[9],v=t[10],y=t[11],b=t[12],x=t[13],S=t[14],w=t[15],T=t[16];let D;t[34]!==h||t[35]!==g?(D=(0,$.jsx)(`div`,{className:h,children:g}),t[34]=h,t[35]=g,t[36]=D):D=t[36];let O;t[37]!==p||t[38]!==D||t[39]!==v||t[40]!==y||t[41]!==b||t[42]!==x?(O=(0,$.jsxs)(p,{side:v,align:y,className:b,children:[x,D]}),t[37]=p,t[38]=D,t[39]=v,t[40]=y,t[41]=b,t[42]=x,t[43]=O):O=t[43];let k;return t[44]!==m||t[45]!==O||t[46]!==S||t[47]!==w||t[48]!==T?(k=(0,$.jsxs)(m,{open:S,onOpenChange:w,children:[T,O]}),t[44]=m,t[45]=O,t[46]=S,t[47]=w,t[48]=T,t[49]=k):k=t[49],k});function jl(e){let t=(0,ml.c)(13),{label:n,value:r,onChange:i}=e,a;t[0]===i?a=t[1]:(a=e=>i(e.target.value),t[0]=i,t[1]=a);let o;t[2]!==a||t[3]!==r?(o=(0,$.jsx)(`input`,{type:`color`,value:r,onChange:a,className:`size-5 cursor-pointer rounded border border-border`}),t[2]=a,t[3]=r,t[4]=o):o=t[4];let s;t[5]===n?s=t[6]:(s=(0,$.jsx)(`span`,{className:`flex-1 text-[10px] text-muted-foreground`,children:n}),t[5]=n,t[6]=s);let c;t[7]===r?c=t[8]:(c=(0,$.jsx)(`span`,{className:`font-mono text-[9px] text-muted-foreground/60`,children:r}),t[7]=r,t[8]=c);let l;return t[9]!==o||t[10]!==s||t[11]!==c?(l=(0,$.jsxs)(`label`,{className:`flex items-center gap-2`,children:[o,s,c]}),t[9]=o,t[10]=s,t[11]=c,t[12]=l):l=t[12],l}var Ml=[`Inter, sans-serif`,`Georgia, serif`,`Menlo, monospace`,`system-ui, sans-serif`,`Helvetica, Arial, sans-serif`,`Times New Roman, serif`],Nl=(0,B.memo)(function(e){let t=(0,ml.c)(70),{brandKit:n,onUpdate:r,onReset:i}=e,[a,o]=(0,B.useState)(!1),s;t[0]===r?s=t[1]:(s=(e,t)=>{r({[e]:t})},t[0]=r,t[1]=s);let c=s,l;t[2]===Symbol.for(`react.memo_cache_sentinel`)?(l=(0,$.jsxs)(d,{className:`inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[(0,$.jsx)(w,{className:`size-3`}),`Brand`]}),t[2]=l):l=t[2];let p;t[3]===Symbol.for(`react.memo_cache_sentinel`)?(p=(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Brand Kit`}),t[3]=p):p=t[3];let m;t[4]===i?m=t[5]:(m=(0,$.jsxs)(`div`,{className:`mb-2 flex items-center justify-between`,children:[p,(0,$.jsx)(`button`,{onClick:i,className:`text-[10px] text-muted-foreground hover:text-foreground`,children:`Reset`})]}),t[4]=i,t[5]=m);let h;t[6]===Symbol.for(`react.memo_cache_sentinel`)?(h=(0,$.jsx)(`div`,{className:`text-[10px] font-medium uppercase tracking-wider text-muted-foreground`,children:`Colors`}),t[6]=h):h=t[6];let g;t[7]===c?g=t[8]:(g=e=>c(`primaryColor`,e),t[7]=c,t[8]=g);let _;t[9]!==n.primaryColor||t[10]!==g?(_=(0,$.jsx)(jl,{label:`Primary`,value:n.primaryColor,onChange:g}),t[9]=n.primaryColor,t[10]=g,t[11]=_):_=t[11];let v;t[12]===c?v=t[13]:(v=e=>c(`secondaryColor`,e),t[12]=c,t[13]=v);let y;t[14]!==n.secondaryColor||t[15]!==v?(y=(0,$.jsx)(jl,{label:`Secondary`,value:n.secondaryColor,onChange:v}),t[14]=n.secondaryColor,t[15]=v,t[16]=y):y=t[16];let b;t[17]===c?b=t[18]:(b=e=>c(`accentColor`,e),t[17]=c,t[18]=b);let x;t[19]!==n.accentColor||t[20]!==b?(x=(0,$.jsx)(jl,{label:`Accent`,value:n.accentColor,onChange:b}),t[19]=n.accentColor,t[20]=b,t[21]=x):x=t[21];let S;t[22]===c?S=t[23]:(S=e=>c(`backgroundColor`,e),t[22]=c,t[23]=S);let C;t[24]!==n.backgroundColor||t[25]!==S?(C=(0,$.jsx)(jl,{label:`Background`,value:n.backgroundColor,onChange:S}),t[24]=n.backgroundColor,t[25]=S,t[26]=C):C=t[26];let T;t[27]===c?T=t[28]:(T=e=>c(`textColor`,e),t[27]=c,t[28]=T);let E;t[29]!==n.textColor||t[30]!==T?(E=(0,$.jsx)(jl,{label:`Text`,value:n.textColor,onChange:T}),t[29]=n.textColor,t[30]=T,t[31]=E):E=t[31];let D;t[32]!==x||t[33]!==C||t[34]!==E||t[35]!==_||t[36]!==y?(D=(0,$.jsxs)(`div`,{className:`space-y-2`,children:[h,_,y,x,C,E]}),t[32]=x,t[33]=C,t[34]=E,t[35]=_,t[36]=y,t[37]=D):D=t[37];let O;t[38]===Symbol.for(`react.memo_cache_sentinel`)?(O=(0,$.jsx)(`div`,{className:`text-[10px] font-medium uppercase tracking-wider text-muted-foreground`,children:`Fonts`}),t[38]=O):O=t[38];let k;t[39]===Symbol.for(`react.memo_cache_sentinel`)?(k=(0,$.jsx)(`span`,{className:`mb-1 block text-[10px] text-muted-foreground`,children:`Body Font`}),t[39]=k):k=t[39];let A=n.fontFamily,j;t[40]===r?j=t[41]:(j=e=>r({fontFamily:e.target.value}),t[40]=r,t[41]=j);let M;t[42]===Symbol.for(`react.memo_cache_sentinel`)?(M=Ml.map(Pl),t[42]=M):M=t[42];let N;t[43]!==n.fontFamily||t[44]!==j?(N=(0,$.jsxs)(`label`,{className:`block`,children:[k,(0,$.jsx)(`select`,{value:A,onChange:j,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px]`,children:M})]}),t[43]=n.fontFamily,t[44]=j,t[45]=N):N=t[45];let P;t[46]===Symbol.for(`react.memo_cache_sentinel`)?(P=(0,$.jsx)(`span`,{className:`mb-1 block text-[10px] text-muted-foreground`,children:`Heading Font`}),t[46]=P):P=t[46];let F=n.headingFontFamily,I;t[47]===r?I=t[48]:(I=e=>r({headingFontFamily:e.target.value}),t[47]=r,t[48]=I);let ee;t[49]===Symbol.for(`react.memo_cache_sentinel`)?(ee=Ml.map(Fl),t[49]=ee):ee=t[49];let L;t[50]!==n.headingFontFamily||t[51]!==I?(L=(0,$.jsxs)(`label`,{className:`block`,children:[P,(0,$.jsx)(`select`,{value:F,onChange:I,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px]`,children:ee})]}),t[50]=n.headingFontFamily,t[51]=I,t[52]=L):L=t[52];let te;t[53]!==N||t[54]!==L?(te=(0,$.jsxs)(`div`,{className:`mt-3 space-y-2`,children:[O,N,L]}),t[53]=N,t[54]=L,t[55]=te):te=t[55];let R;t[56]!==n.accentColor||t[57]!==n.backgroundColor||t[58]!==n.primaryColor||t[59]!==n.secondaryColor||t[60]!==n.textColor?(R=(0,$.jsx)(`div`,{className:`mt-3 flex gap-1 rounded-md border border-border p-1.5`,children:[n.primaryColor,n.secondaryColor,n.accentColor,n.backgroundColor,n.textColor].map(Il)}),t[56]=n.accentColor,t[57]=n.backgroundColor,t[58]=n.primaryColor,t[59]=n.secondaryColor,t[60]=n.textColor,t[61]=R):R=t[61];let z;t[62]!==D||t[63]!==te||t[64]!==R||t[65]!==m?(z=(0,$.jsxs)(u,{side:`bottom`,align:`end`,className:`w-64 p-3`,children:[m,D,te,R]}),t[62]=D,t[63]=te,t[64]=R,t[65]=m,t[66]=z):z=t[66];let ne;return t[67]!==a||t[68]!==z?(ne=(0,$.jsxs)(f,{open:a,onOpenChange:o,children:[l,z]}),t[67]=a,t[68]=z,t[69]=ne):ne=t[69],ne});function Pl(e){return(0,$.jsx)(`option`,{value:e,children:e.split(`,`)[0]},e)}function Fl(e){return(0,$.jsx)(`option`,{value:e,children:e.split(`,`)[0]},e)}function Il(e){return(0,$.jsx)(`div`,{className:`h-4 flex-1 rounded-sm`,style:{backgroundColor:e}},e)}var Ll=(0,B.memo)(function({onClose:e}){let t=(0,B.useRef)(null),n=(0,B.useRef)(new m(()=>{let e=t.current?.toJSON();e&&j.getState().pushHistorySnapshot(e)},{wait:500}));(0,B.useEffect)(()=>{let e=n.current;return()=>{e.cancel()}},[]);let{activeTool:r,artboardPresetId:a,artboardWidth:o,artboardHeight:s,selectedObjectProperties:c,propertiesPanelOpen:l,historyIndex:u,historyStack:d,layers:f,zoomLevel:p,savedDesigns:h,brandKit:g,setActiveTool:_,setArtboard:v,setSelectedObjects:y,clearSelection:b,setPropertiesPanelOpen:x,setLayers:S,setZoomLevel:w,undo:T,redo:E,resetHistory:D,saveDesign:O,deleteDesign:A,updateBrandKit:M,setBrandKit:N}=j();(0,B.useEffect)(()=>{let e=setTimeout(()=>{let e=t.current?.toJSON();e&&j.getState().pushHistorySnapshot(e)},100);return()=>clearTimeout(e)},[]),(0,B.useEffect)(()=>{let e=j.subscribe((e,n)=>{if(e.pendingGeneratePrompt&&e.pendingGeneratePrompt!==n.pendingGeneratePrompt){let e=j.getState().consumePendingGenerate();if(e&&t.current){let n=C(e,o,s,g);t.current.applyGeneratedLayout(n.objects)}}}),n=j.getState().consumePendingGenerate();return n&&t.current&&requestAnimationFrame(()=>{let e=C(n,o,s,g);t.current?.applyGeneratedLayout(e.objects)}),e},[o,s,g]);let P=(0,B.useCallback)(()=>{n.current.maybeExecute()},[]),F=(0,B.useCallback)(e=>{_(e)},[_]),I=(0,B.useCallback)(e=>{v(e.id,e.width,e.height),D()},[v,D]),ee=(0,B.useCallback)((e,t)=>{v(null,e,t),D()},[v,D]),L=(0,B.useCallback)(()=>{let e=T();e&&t.current?.loadJSON(e)},[T]),te=(0,B.useCallback)(()=>{let e=E();e&&t.current?.loadJSON(e)},[E]),R=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=_e(p),r=e.viewportTransform;r[0]=n,r[3]=n,e.setViewportTransform(r),w(n),e.requestRenderAll()},[p,w]),z=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=ve(p),r=e.viewportTransform;r[0]=n,r[3]=n,e.setViewportTransform(r),w(n),e.requestRenderAll()},[p,w]),ne=(0,B.useCallback)(()=>{t.current?.fitToView()},[]),ie=(0,B.useCallback)((e,n)=>{let r=t.current?.getCanvas();if(!r)return;let i=r.getActiveObject();if(!i)return;if(e===`scaleWidth`){let e=i.width??1;i.set(`scaleX`,n/e)}else if(e===`scaleHeight`){let e=i.height??1;i.set(`scaleY`,n/e)}else i.set(e,n);i.setCoords(),r.requestRenderAll(),P();let a=j.getState().selectedObjectProperties;if(a){let t={...a,[e===`scaleWidth`?`width`:e===`scaleHeight`?`height`:e]:n};y([a.id],t)}},[P,y]),ae=(0,B.useCallback)(e=>{let n=t.current?.getCanvas();if(!n)return;let r=n.getObjects().find(t=>t.customId===e);r&&(n.setActiveObject(r),n.requestRenderAll())},[]),oe=(0,B.useCallback)(e=>{let n=t.current?.getCanvas();if(!n)return;let r=n.getObjects().find(t=>t.customId===e);if(r){r.visible=!r.visible,n.requestRenderAll();let t=f.map(t=>t.id===e?{...t,visible:!t.visible}:t);S(t)}},[f,S]),se=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.bringObjectForward(n),e.requestRenderAll(),P())},[P]),ce=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.sendObjectBackwards(n),e.requestRenderAll(),P())},[P]),le=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.bringObjectToFront(n),e.requestRenderAll(),P())},[P]),ue=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();if(n){let t=e.getObjects().findIndex(e=>e.customId===`__artboard__`);e.moveObjectTo(n,t+1),e.requestRenderAll(),P()}},[P]),de=(0,B.useCallback)(async e=>{await t.current?.loadJSON(e),D();let n=t.current?.toJSON();n&&j.getState().pushHistorySnapshot(n)},[D]),fe=(0,B.useCallback)((e,t,n)=>{O(e,t,n)},[O]);(0,B.useEffect)(()=>{let e=e=>{if(!(e.target instanceof HTMLInputElement||e.target instanceof HTMLTextAreaElement)){if(!e.metaKey&&!e.ctrlKey)switch(e.key.toLowerCase()){case`v`:_(`select`);return;case`t`:_(`text`);return;case`r`:_(`rect`);return;case`d`:_(`draw`);return}if((e.metaKey||e.ctrlKey)&&e.key===`z`&&(e.preventDefault(),e.shiftKey?te():L()),e.key===`Delete`||e.key===`Backspace`){let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&n.customId!==`__artboard__`&&(e.remove(n),b(),P())}}};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[_,L,te,b,P]);let pe=u>0,me=u<d.length-1;return(0,$.jsxs)(`div`,{className:`flex h-full flex-col`,children:[(0,$.jsxs)(`div`,{className:`flex items-center gap-2 border-b border-border px-3 py-1.5`,children:[(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Canvas`}),(0,$.jsx)(`div`,{className:`mx-1 h-4 w-px bg-border`}),(0,$.jsx)(Ol,{canvasRef:t,artboardWidth:o,artboardHeight:s,brandKit:g,onCanvasModified:P}),(0,$.jsx)(Al,{canvasRef:t,brandKit:g,onCanvasModified:P,onSelectPreset:I}),(0,$.jsx)(Nl,{brandKit:g,onUpdate:M,onReset:()=>N(k)}),(0,$.jsx)(`div`,{className:`flex-1`}),(0,$.jsx)(wl,{artboardPresetId:a,artboardWidth:o,artboardHeight:s,onSelectPreset:I,onCustomSize:ee}),(0,$.jsx)(Tl,{canvasRef:t,artboardWidth:o,artboardHeight:s,savedDesigns:h,onSaveDesign:fe,onLoadDesign:e=>void de(e),onDeleteDesign:A}),e?(0,$.jsx)(`button`,{onClick:e,className:`inline-flex size-6 items-center justify-center rounded text-muted-foreground hover:text-foreground`,children:(0,$.jsx)(i,{className:`size-3.5`})}):null]}),(0,$.jsxs)(`div`,{className:`relative flex min-h-0 flex-1`,children:[f.length===0&&(0,$.jsxs)(`div`,{"aria-hidden":`true`,className:`pointer-events-none absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 text-center`,children:[(0,$.jsx)(re,{className:`size-7 text-muted-foreground/20`}),(0,$.jsx)(`p`,{className:`text-[12px] text-muted-foreground/35`,children:`Use Quick Create or Templates to start designing.`})]}),(0,$.jsx)(pl,{ref:t,artboardWidth:o,artboardHeight:s,activeTool:r,onSelectionChange:y,onCanvasModified:P,onLayersChange:S,onZoomChange:w}),(0,$.jsx)(bl,{open:l,properties:c,layers:f,onClose:()=>x(!1),onPropertyChange:ie,onLayerSelect:ae,onLayerVisibilityToggle:oe,onMoveUp:se,onMoveDown:ce,onBringToFront:le,onSendToBack:ue})]}),(0,$.jsx)(_l,{activeTool:r,onToolChange:F,canUndo:pe,canRedo:me,onUndo:L,onRedo:te,zoomLevel:p,onZoomIn:R,onZoomOut:z,onFitToView:ne,canvasRef:t,onCanvasModified:P})]})});export{Ll as CanvasPanel,Ll as default};
|
|
441
|
-
//# sourceMappingURL=CanvasPanel-
|
|
440
|
+
`}applyTo2d({imageData:{data:e}}){let t=-this.vibrance;for(let n=0;n<e.length;n+=4){let r=e[n],i=e[n+1],a=e[n+2],o=Math.max(r,i,a),s=(r+i+a)/3,c=2*Math.abs(o-s)/255*t;e[n]+=o===r?0:(o-r)*c,e[n+1]+=o===i?0:(o-i)*c,e[n+2]+=o===a?0:(o-a)*c}}sendUniformData(e,t){e.uniform1f(t.uVibrance,-this.vibrance)}isNeutralState(){return this.vibrance===0}};V(il,`type`,`Vibrance`),V(il,`defaults`,{vibrance:0}),V(il,`uniformLocations`,[`uVibrance`]),G.setClass(il),xe({BaseFilter:()=>Q,BlackWhite:()=>Vc,BlendColor:()=>Dc,BlendImage:()=>kc,Blur:()=>Ac,Brightness:()=>jc,Brownie:()=>Fc,ColorMatrix:()=>Nc,Composed:()=>Hc,Contrast:()=>Uc,Convolute:()=>Gc,Gamma:()=>qc,Grayscale:()=>Yc,HueRotation:()=>Zc,Invert:()=>Qc,Kodachrome:()=>Lc,Noise:()=>$c,Pixelate:()=>el,Polaroid:()=>zc,RemoveColor:()=>tl,Resize:()=>nl,Saturation:()=>rl,Sepia:()=>Bc,Technicolor:()=>Rc,Vibrance:()=>il,Vintage:()=>Ic});function al(e){let t=e instanceof uc||e instanceof lc;return{id:e.customId??e.toString(),type:e.type??`object`,left:Math.round(e.left??0),top:Math.round(e.top??0),width:Math.round((e.width??0)*(e.scaleX??1)),height:Math.round((e.height??0)*(e.scaleY??1)),angle:Math.round(e.angle??0),opacity:e.opacity??1,fill:typeof e.fill==`string`?e.fill:null,stroke:typeof e.stroke==`string`?e.stroke:null,strokeWidth:e.strokeWidth??0,...t?{fontFamily:e.fontFamily,fontSize:e.fontSize,fontWeight:e.fontWeight,textAlign:e.textAlign}:{}}}function ol(e){return e.getObjects().filter(e=>e.customId!==`__artboard__`).map((e,t)=>({id:e.customId??`obj-${t}`,type:e.type??`object`,name:e.customName??ye(e.type??`object`,t),visible:e.visible!==!1,locked:!e.selectable}))}function sl(e){let t={left:e.left,top:e.top,selectable:e.selectable!==!1};switch(e.fill!==void 0&&(t.fill=e.fill),e.stroke!==void 0&&(t.stroke=e.stroke),e.strokeWidth!==void 0&&(t.strokeWidth=e.strokeWidth),e.opacity!==void 0&&(t.opacity=e.opacity),e.angle!==void 0&&(t.angle=e.angle),e.scaleX!==void 0&&(t.scaleX=e.scaleX),e.scaleY!==void 0&&(t.scaleY=e.scaleY),e.type){case`rect`:{let n={...t};return e.width!==void 0&&(n.width=e.width),e.height!==void 0&&(n.height=e.height),e.rx!==void 0&&(n.rx=e.rx),e.ry!==void 0&&(n.ry=e.ry),new $a(n)}case`ellipse`:return new Bs({...t,rx:e.rx??(e.width?e.width/2:50),ry:e.ry??(e.height?e.height/2:50)});case`textbox`:{let n={...t};return e.width!==void 0&&(n.width=e.width),e.fontSize!==void 0&&(n.fontSize=e.fontSize),e.fontFamily!==void 0&&(n.fontFamily=e.fontFamily),e.fontWeight!==void 0&&(n.fontWeight=e.fontWeight),e.textAlign!==void 0&&(n.textAlign=e.textAlign),new uc(e.text??``,n)}case`line`:return new Ls([e.left,e.top,e.left+(e.width??100),e.top+(e.height??0)],t);case`path`:return new $a({...t,width:e.width??50,height:e.height??50});default:return new $a({...t,width:e.width??50,height:e.height??50})}}var cl=0;function ll(e){let t=e;return t.customId||=`obj-${++cl}`,t.customId}function ul(e,t){switch(e){case`rect`:return new $a({left:t.x,top:t.y,width:0,height:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1});case`circle`:return new Bs({left:t.x,top:t.y,rx:0,ry:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1});case`line`:return new Ls([t.x,t.y,t.x,t.y],{stroke:`#000000`,strokeWidth:2});case`polygon`:return new $a({left:t.x,top:t.y,width:0,height:0,fill:`#6366f1`,stroke:`#4f46e5`,strokeWidth:1,rx:8,ry:8});default:return null}}function dl(e){let{activeTool:t,object:n,start:r,pointer:i}=e;return t===`line`&&n instanceof Ls?(n.set({x2:i.x,y2:i.y}),!0):t===`circle`&&n instanceof Bs?(n.set({rx:Math.abs(i.x-r.x)/2,ry:Math.abs(i.y-r.y)/2,left:Math.min(r.x,i.x),top:Math.min(r.y,i.y)}),!0):(n.set({left:Math.min(r.x,i.x),top:Math.min(r.y,i.y),width:Math.abs(i.x-r.x),height:Math.abs(i.y-r.y)}),!0)}function fl(e){return e===`draw`?{isDrawingMode:!0,selection:!0,defaultCursor:`default`,hoverCursor:`move`,pencilBrush:{color:`#000000`,width:3}}:e===`select`?{isDrawingMode:!1,selection:!0,defaultCursor:`default`,hoverCursor:`move`,pencilBrush:null}:{isDrawingMode:!1,selection:!1,defaultCursor:`crosshair`,hoverCursor:`crosshair`,pencilBrush:null}}var $=n(),pl=(0,B.forwardRef)(function({artboardWidth:e,artboardHeight:t,activeTool:n,onSelectionChange:r,onCanvasModified:i,onLayersChange:a,onZoomChange:o},s){let c=(0,B.useRef)(null),l=(0,B.useRef)(null),u=(0,B.useRef)(null),d=(0,B.useRef)(null),f=(0,B.useCallback)(()=>{let e=l.current;e&&a(ol(e))},[a]),p=(0,B.useCallback)(()=>{let e=l.current;if(!e)return;let t=e.getActiveObject();if(!t){r([],null);return}r([ll(t)],al(t))},[r]),m=(0,B.useCallback)(()=>{p(),i(),f()},[p,i,f]),h=(0,B.useCallback)(()=>{let n=l.current,r=u.current;if(!n||!r)return;let{width:i,height:a}=r.getBoundingClientRect(),{scale:s,offsetX:c,offsetY:d}=ge(e,t,i,a);n.setDimensions({width:i,height:a});let f=n.viewportTransform;f[0]=s,f[3]=s,f[4]=c,f[5]=d,n.setViewportTransform(f),o(s),n.requestRenderAll()},[e,t,o]);return(0,B.useEffect)(()=>{let n=c.current;if(!n)return;let i=new hs(n,{backgroundColor:`transparent`,preserveObjectStacking:!0,selection:!0});l.current=i;let a=new $a({width:e,height:t,fill:`#ffffff`,selectable:!1,evented:!1,left:0,top:0,shadow:new Lr({color:`rgba(0,0,0,0.3)`,blur:20,offsetX:0,offsetY:4})});return a.customId=`__artboard__`,i.add(a),d.current=a,i.on(`selection:created`,p),i.on(`selection:updated`,p),i.on(`selection:cleared`,()=>r([],null)),i.on(`object:modified`,m),i.on(`object:added`,f),i.on(`object:removed`,f),requestAnimationFrame(()=>h()),()=>{i.dispose(),l.current=null,d.current=null}},[]),(0,B.useEffect)(()=>{let n=d.current;n&&(n.set({width:e,height:t}),h())},[e,t,h]),(0,B.useEffect)(()=>{let e=u.current;if(!e)return;let t=new ResizeObserver(()=>{requestAnimationFrame(()=>h())});return t.observe(e),()=>t.disconnect()},[h]),(0,B.useEffect)(()=>{let e=l.current;if(!e)return;let t=fl(n);e.isDrawingMode=t.isDrawingMode,e.selection=t.selection,e.defaultCursor=t.defaultCursor,e.hoverCursor=t.hoverCursor,t.pencilBrush&&(e.freeDrawingBrush=new Ns(e),e.freeDrawingBrush.color=t.pencilBrush.color,e.freeDrawingBrush.width=t.pencilBrush.width),e.requestRenderAll()},[n]),(0,B.useEffect)(()=>{let e=l.current;if(!e||n===`select`||n===`draw`||n===`image`)return;let t=!1,r=0,a=0,o=null,s=s=>{let c=s.scenePoint;if(t=!0,r=c.x,a=c.y,n===`text`){let n=new uc(`Type here`,{left:c.x,top:c.y,width:200,fontSize:24,fontFamily:`Inter, sans-serif`,fill:`#000000`});ll(n),e.add(n),e.setActiveObject(n),n.enterEditing(),i(),t=!1;return}o=ul(n,c),o&&(ll(o),e.add(o))},c=i=>{if(!t||!o)return;let s=i.scenePoint;dl({activeTool:n,object:o,start:{x:r,y:a},pointer:s}),e.requestRenderAll()},u=()=>{t&&(t=!1,o&&(e.setActiveObject(o),i()),o=null)};return e.on(`mouse:down`,s),e.on(`mouse:move`,c),e.on(`mouse:up`,u),()=>{e.off(`mouse:down`,s),e.off(`mouse:move`,c),e.off(`mouse:up`,u)}},[n,i]),(0,B.useImperativeHandle)(s,()=>({toJSON:()=>{let e=l.current;return e?JSON.stringify(e.toObject([`customId`,`customName`])):`{}`},loadJSON:async e=>{let t=l.current;t&&(await t.loadFromJSON(e),t.requestRenderAll(),f())},exportPNG:(n=1)=>{let r=l.current,i=d.current;return!r||!i?``:r.toDataURL({format:`png`,multiplier:n,left:i.left,top:i.top,width:e,height:t})},exportSVG:()=>{let e=l.current;return e?e.toSVG():``},getCanvas:()=>l.current,addObject:e=>{let t=l.current;t&&(ll(e),t.add(e),t.setActiveObject(e),i())},fitToView:h,applyGeneratedLayout:e=>{let t=l.current;if(!t)return;let n=t.getObjects();for(let e of n)e.customId!==`__artboard__`&&t.remove(e);for(let n of e){let e=sl(n),r=e;n.customId&&(r.customId=n.customId),n.customName&&(r.customName=n.customName),ll(e),t.add(e)}t.discardActiveObject(),t.requestRenderAll(),i(),f()}})),(0,$.jsx)(`div`,{ref:u,className:`relative flex-1 overflow-hidden bg-muted/35 dark:bg-background`,children:(0,$.jsx)(`canvas`,{ref:c})})}),ml=t(),hl=[{id:`rect`,icon:A,label:`Rectangle`},{id:`circle`,icon:S,label:`Circle`},{id:`line`,icon:M,label:`Line`},{id:`polygon`,icon:L,label:`Rounded Rectangle`}],gl=(0,B.memo)(function(e){let t=(0,ml.c)(17),{activeTool:n,onToolChange:r}=e,[a,o]=(0,B.useState)(!1),s=hl.some(e=>e.id===n),c;t[0]===n?c=t[1]:(c=hl.find(e=>e.id===n),t[0]=n,t[1]=c);let u=c?.icon??A,p=`inline-flex h-7 items-center gap-0.5 rounded-md px-1.5 text-muted-foreground hover:bg-accent hover:text-foreground ${s?`bg-accent text-foreground`:``}`,m;t[2]===u?m=t[3]:(m=(0,$.jsx)(u,{className:`size-3.5`}),t[2]=u,t[3]=m);let h;t[4]===Symbol.for(`react.memo_cache_sentinel`)?(h=(0,$.jsx)(i,{className:`size-2.5`}),t[4]=h):h=t[4];let g;t[5]!==p||t[6]!==m?(g=(0,$.jsxs)(l,{className:p,"aria-label":`Shape tools`,children:[m,h]}),t[5]=p,t[6]=m,t[7]=g):g=t[7];let _;t[8]!==n||t[9]!==r?(_=hl.map(e=>{let t=e.icon;return(0,$.jsxs)(`button`,{onClick:()=>{r(e.id),o(!1)},className:`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-xs hover:bg-accent ${n===e.id?`bg-accent text-foreground`:`text-muted-foreground`}`,children:[(0,$.jsx)(t,{className:`size-3.5`}),e.label]},e.id)}),t[8]=n,t[9]=r,t[10]=_):_=t[10];let v;t[11]===_?v=t[12]:(v=(0,$.jsx)(d,{side:`top`,className:`w-36 p-1`,children:_}),t[11]=_,t[12]=v);let y;return t[13]!==a||t[14]!==g||t[15]!==v?(y=(0,$.jsxs)(f,{open:a,onOpenChange:o,children:[g,v]}),t[13]=a,t[14]=g,t[15]=v,t[16]=y):y=t[16],y}),_l=(0,B.memo)(function(e){let t=(0,ml.c)(77),{activeTool:n,onToolChange:r,canUndo:i,canRedo:a,onUndo:l,onRedo:d,zoomLevel:f,onZoomIn:p,onZoomOut:m,onFitToView:h,canvasRef:g,onCanvasModified:_}=e,v=(0,B.useRef)(null),y;t[0]===Symbol.for(`react.memo_cache_sentinel`)?(y=()=>{v.current?.click()},t[0]=y):y=t[0];let b=y,x;t[1]!==g||t[2]!==_?(x=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.addEventListener(`load`,async()=>{let e=n.result,t=await xc.fromURL(e);t.scaleToWidth(300),g.current?.addObject(t),_()}),n.readAsDataURL(t),e.target.value=``},t[1]=g,t[2]=_,t[3]=x):x=t[3];let S=x,C;t[4]===Symbol.for(`react.memo_cache_sentinel`)?(C={id:`select`,icon:(0,$.jsx)(ie,{className:`size-3.5`}),label:`Select (V)`},t[4]=C):C=t[4];let w;t[5]===Symbol.for(`react.memo_cache_sentinel`)?(w=[C,{id:`text`,icon:(0,$.jsx)(o,{className:`size-3.5`}),label:`Text (T)`}],t[5]=w):w=t[5];let T=w,E,O;t[6]!==n||t[7]!==r?(E=T.map(e=>(0,$.jsxs)(s,{children:[(0,$.jsx)(c,{render:(0,$.jsx)(F,{pressed:n===e.id,onPressedChange:()=>r(e.id),"aria-label":e.label,size:`xs`,variant:`default`,children:e.icon})}),(0,$.jsx)(u,{side:`top`,children:e.label})]},e.id)),O=(0,$.jsx)(gl,{activeTool:n,onToolChange:r}),t[6]=n,t[7]=r,t[8]=E,t[9]=O):(E=t[8],O=t[9]);let k=n===`image`,A;t[10]===Symbol.for(`react.memo_cache_sentinel`)?(A=(0,$.jsx)(te,{className:`size-3.5`}),t[10]=A):A=t[10];let j;t[11]===k?j=t[12]:(j=(0,$.jsx)(c,{render:(0,$.jsx)(F,{pressed:k,onPressedChange:b,"aria-label":`Image`,size:`xs`,variant:`default`,children:A})}),t[11]=k,t[12]=j);let M;t[13]===Symbol.for(`react.memo_cache_sentinel`)?(M=(0,$.jsx)(u,{side:`top`,children:`Upload Image`}),t[13]=M):M=t[13];let N;t[14]===j?N=t[15]:(N=(0,$.jsxs)(s,{children:[j,M]}),t[14]=j,t[15]=N);let P=n===`draw`,I;t[16]===r?I=t[17]:(I=()=>r(`draw`),t[16]=r,t[17]=I);let ee;t[18]===Symbol.for(`react.memo_cache_sentinel`)?(ee=(0,$.jsx)(ae,{className:`size-3.5`}),t[18]=ee):ee=t[18];let L;t[19]!==P||t[20]!==I?(L=(0,$.jsx)(c,{render:(0,$.jsx)(F,{pressed:P,onPressedChange:I,"aria-label":`Draw`,size:`xs`,variant:`default`,children:ee})}),t[19]=P,t[20]=I,t[21]=L):L=t[21];let R;t[22]===Symbol.for(`react.memo_cache_sentinel`)?(R=(0,$.jsx)(u,{side:`top`,children:`Freehand Draw (D)`}),t[22]=R):R=t[22];let z;t[23]===L?z=t[24]:(z=(0,$.jsxs)(s,{children:[L,R]}),t[23]=L,t[24]=z);let re;t[25]===Symbol.for(`react.memo_cache_sentinel`)?(re=(0,$.jsx)(`div`,{className:`mx-1 h-4 w-px bg-border`}),t[25]=re):re=t[25];let se=!i,ce;t[26]===Symbol.for(`react.memo_cache_sentinel`)?(ce=(0,$.jsx)(D,{className:`size-3.5`}),t[26]=ce):ce=t[26];let de;t[27]!==l||t[28]!==se?(de=(0,$.jsx)(c,{render:(0,$.jsx)(`button`,{onClick:l,disabled:se,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-30 disabled:hover:bg-transparent`,"aria-label":`Undo`,children:ce})}),t[27]=l,t[28]=se,t[29]=de):de=t[29];let fe;t[30]===Symbol.for(`react.memo_cache_sentinel`)?(fe=(0,$.jsx)(u,{side:`top`,children:`Undo (Ctrl+Z)`}),t[30]=fe):fe=t[30];let pe;t[31]===de?pe=t[32]:(pe=(0,$.jsxs)(s,{children:[de,fe]}),t[31]=de,t[32]=pe);let me=!a,he;t[33]===Symbol.for(`react.memo_cache_sentinel`)?(he=(0,$.jsx)(oe,{className:`size-3.5`}),t[33]=he):he=t[33];let ge;t[34]!==d||t[35]!==me?(ge=(0,$.jsx)(c,{render:(0,$.jsx)(`button`,{onClick:d,disabled:me,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-30 disabled:hover:bg-transparent`,"aria-label":`Redo`,children:he})}),t[34]=d,t[35]=me,t[36]=ge):ge=t[36];let _e;t[37]===Symbol.for(`react.memo_cache_sentinel`)?(_e=(0,$.jsx)(u,{side:`top`,children:`Redo (Ctrl+Shift+Z)`}),t[37]=_e):_e=t[37];let ve;t[38]===ge?ve=t[39]:(ve=(0,$.jsxs)(s,{children:[ge,_e]}),t[38]=ge,t[39]=ve);let ye;t[40]===Symbol.for(`react.memo_cache_sentinel`)?(ye=(0,$.jsx)(`div`,{className:`flex-1`}),t[40]=ye):ye=t[40];let be;t[41]===Symbol.for(`react.memo_cache_sentinel`)?(be=(0,$.jsx)(ue,{className:`size-3.5`}),t[41]=be):be=t[41];let xe;t[42]===m?xe=t[43]:(xe=(0,$.jsx)(c,{render:(0,$.jsx)(`button`,{onClick:m,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Zoom out`,children:be})}),t[42]=m,t[43]=xe);let Se;t[44]===Symbol.for(`react.memo_cache_sentinel`)?(Se=(0,$.jsx)(u,{side:`top`,children:`Zoom Out`}),t[44]=Se):Se=t[44];let Ce;t[45]===xe?Ce=t[46]:(Ce=(0,$.jsxs)(s,{children:[xe,Se]}),t[45]=xe,t[46]=Ce);let V;t[47]===f?V=t[48]:(V=Math.round(f*100),t[47]=f,t[48]=V);let we;t[49]===V?we=t[50]:(we=(0,$.jsxs)(`span`,{className:`min-w-[3rem] text-center text-xs tabular-nums text-muted-foreground`,children:[V,`%`]}),t[49]=V,t[50]=we);let H;t[51]===Symbol.for(`react.memo_cache_sentinel`)?(H=(0,$.jsx)(le,{className:`size-3.5`}),t[51]=H):H=t[51];let Te;t[52]===p?Te=t[53]:(Te=(0,$.jsx)(c,{render:(0,$.jsx)(`button`,{onClick:p,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Zoom in`,children:H})}),t[52]=p,t[53]=Te);let Ee;t[54]===Symbol.for(`react.memo_cache_sentinel`)?(Ee=(0,$.jsx)(u,{side:`top`,children:`Zoom In`}),t[54]=Ee):Ee=t[54];let De;t[55]===Te?De=t[56]:(De=(0,$.jsxs)(s,{children:[Te,Ee]}),t[55]=Te,t[56]=De);let Oe;t[57]===Symbol.for(`react.memo_cache_sentinel`)?(Oe=(0,$.jsx)(ne,{className:`size-3.5`}),t[57]=Oe):Oe=t[57];let ke;t[58]===h?ke=t[59]:(ke=(0,$.jsx)(c,{render:(0,$.jsx)(`button`,{onClick:h,className:`inline-flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground`,"aria-label":`Fit to view`,children:Oe})}),t[58]=h,t[59]=ke);let Ae;t[60]===Symbol.for(`react.memo_cache_sentinel`)?(Ae=(0,$.jsx)(u,{side:`top`,children:`Fit to View`}),t[60]=Ae):Ae=t[60];let je;t[61]===ke?je=t[62]:(je=(0,$.jsxs)(s,{children:[ke,Ae]}),t[61]=ke,t[62]=je);let Me;t[63]===S?Me=t[64]:(Me=(0,$.jsx)(`input`,{ref:v,type:`file`,accept:`image/*`,className:`hidden`,onChange:S}),t[63]=S,t[64]=Me);let Ne;return t[65]!==N||t[66]!==z||t[67]!==pe||t[68]!==ve||t[69]!==Ce||t[70]!==we||t[71]!==De||t[72]!==je||t[73]!==Me||t[74]!==E||t[75]!==O?(Ne=(0,$.jsxs)(`div`,{className:`flex items-center gap-1 border-t border-border bg-card px-2 py-1.5`,children:[E,O,N,z,re,pe,ve,ye,Ce,we,De,je,Me]}),t[65]=N,t[66]=z,t[67]=pe,t[68]=ve,t[69]=Ce,t[70]=we,t[71]=De,t[72]=je,t[73]=Me,t[74]=E,t[75]=O,t[76]=Ne):Ne=t[76],Ne});function vl(e){switch(e){case`textbox`:case`i-text`:return o;case`rect`:return A;case`circle`:case`ellipse`:return S;case`image`:return R;case`path`:return ae;default:return A}}var yl=(0,B.memo)(function(e){let t=(0,ml.c)(12),{layers:n,selectedObjectIds:r,onLayerSelect:i,onLayerVisibilityToggle:a}=e;if(n.length===0){let e;return t[0]===Symbol.for(`react.memo_cache_sentinel`)?(e=(0,$.jsx)(`p`,{className:`text-[10px] text-muted-foreground`,children:`No objects on canvas`}),t[0]=e):e=t[0],e}let o;if(t[1]!==n||t[2]!==i||t[3]!==a||t[4]!==r){let e;t[6]!==i||t[7]!==a||t[8]!==r?(e=e=>{let t=vl(e.type),n=r.includes(e.id);return(0,$.jsxs)(`div`,{onClick:()=>i(e.id),className:`flex cursor-pointer items-center gap-1.5 rounded px-1.5 py-1 text-[10px] ${n?`bg-primary/10 text-primary`:`text-muted-foreground hover:bg-accent hover:text-foreground`}`,children:[(0,$.jsx)(`button`,{onClick:t=>{t.stopPropagation(),a(e.id)},className:`inline-flex size-4 items-center justify-center rounded hover:bg-accent`,children:e.visible?(0,$.jsx)(b,{className:`size-2.5`}):(0,$.jsx)(O,{className:`size-2.5 opacity-40`})}),(0,$.jsx)(t,{className:`size-3 shrink-0`}),(0,$.jsx)(`span`,{className:`min-w-0 truncate`,children:e.name})]},e.id)},t[6]=i,t[7]=a,t[8]=r,t[9]=e):e=t[9],o=[...n].toReversed().map(e),t[1]=n,t[2]=i,t[3]=a,t[4]=r,t[5]=o}else o=t[5];let s;return t[10]===o?s=t[11]:(s=(0,$.jsx)(`div`,{className:`flex flex-col gap-0.5`,children:o}),t[10]=o,t[11]=s),s}),bl=(0,B.memo)(function(e){let t=(0,ml.c)(29),{open:n,properties:r,layers:i,onClose:o,onPropertyChange:s,onLayerSelect:c,onLayerVisibilityToggle:l,onMoveUp:u,onMoveDown:d,onBringToFront:f,onSendToBack:p}=e,m;t[0]===s?m=t[1]:(m=(e,t)=>{let n=Number.parseFloat(t);Number.isNaN(n)||s(e,n)},t[0]=s,t[1]=m);let h=m;if(!n)return null;let _=r?.type===`textbox`||r?.type===`i-text`,v;t[2]===Symbol.for(`react.memo_cache_sentinel`)?(v=(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Properties`}),t[2]=v):v=t[2];let y;t[3]===Symbol.for(`react.memo_cache_sentinel`)?(y=(0,$.jsx)(a,{className:`size-3`}),t[3]=y):y=t[3];let b;t[4]===o?b=t[5]:(b=(0,$.jsxs)(`div`,{className:`flex items-center justify-between border-b border-border px-3 py-2`,children:[v,(0,$.jsx)(`button`,{onClick:o,className:`inline-flex size-5 items-center justify-center rounded text-muted-foreground hover:text-foreground`,children:y})]}),t[4]=o,t[5]=b);let S;t[6]!==h||t[7]!==_||t[8]!==f||t[9]!==d||t[10]!==u||t[11]!==s||t[12]!==p||t[13]!==r?(S=r?(0,$.jsxs)(`div`,{className:`space-y-3 p-3`,children:[(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Transform`}),(0,$.jsxs)(`div`,{className:`grid grid-cols-2 gap-2`,children:[(0,$.jsx)(xl,{label:`X`,value:r.left,onChange:e=>h(`left`,e)}),(0,$.jsx)(xl,{label:`Y`,value:r.top,onChange:e=>h(`top`,e)}),(0,$.jsx)(xl,{label:`W`,value:r.width,onChange:e=>h(`scaleWidth`,e)}),(0,$.jsx)(xl,{label:`H`,value:r.height,onChange:e=>h(`scaleHeight`,e)}),(0,$.jsx)(xl,{label:`R`,value:r.angle,onChange:e=>h(`angle`,e)})]})]}),(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Appearance`}),(0,$.jsxs)(`div`,{className:`space-y-2`,children:[(0,$.jsx)(Sl,{label:`Fill`,value:r.fill??``,onChange:e=>s(`fill`,e)}),(0,$.jsx)(Sl,{label:`Stroke`,value:r.stroke??``,onChange:e=>s(`stroke`,e)}),(0,$.jsx)(xl,{label:`Stroke W`,value:r.strokeWidth,onChange:e=>h(`strokeWidth`,e)}),(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Opacity`}),(0,$.jsx)(`input`,{type:`range`,min:0,max:1,step:.01,value:r.opacity,onChange:e=>s(`opacity`,Number.parseFloat(e.target.value)),className:`h-1 flex-1 appearance-none rounded-full bg-border accent-primary`}),(0,$.jsxs)(`span`,{className:`w-8 text-right text-[10px] tabular-nums text-muted-foreground`,children:[Math.round(r.opacity*100),`%`]})]})]})]}),_&&(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Text`}),(0,$.jsxs)(`div`,{className:`space-y-2`,children:[(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Font`}),(0,$.jsx)(`input`,{type:`text`,value:r.fontFamily??`Inter`,onChange:e=>s(`fontFamily`,e.target.value),className:`h-6 flex-1 rounded border border-border bg-background px-1.5 text-[10px] text-foreground`})]}),(0,$.jsx)(xl,{label:`Size`,value:r.fontSize??16,onChange:e=>h(`fontSize`,e)}),(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:`Align`}),(0,$.jsx)(`div`,{className:`flex gap-1`,children:[`left`,`center`,`right`].map(e=>(0,$.jsx)(`button`,{onClick:()=>s(`textAlign`,e),className:`rounded px-1.5 py-0.5 text-[10px] ${r.textAlign===e?`bg-primary text-primary-foreground`:`bg-background text-muted-foreground hover:text-foreground`}`,children:e.charAt(0).toUpperCase()+e.slice(1)},e))})]})]})]}),(0,$.jsxs)(`section`,{children:[(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Order`}),(0,$.jsxs)(`div`,{className:`flex gap-1`,children:[(0,$.jsx)(Cl,{icon:(0,$.jsx)(x,{className:`size-3`}),label:`Bring to front`,onClick:f}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(N,{className:`size-3`}),label:`Move up`,onClick:u}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(P,{className:`size-3`}),label:`Move down`,onClick:d}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(g,{className:`size-3`}),label:`Send to back`,onClick:p})]})]})]}):null,t[6]=h,t[7]=_,t[8]=f,t[9]=d,t[10]=u,t[11]=s,t[12]=p,t[13]=r,t[14]=S):S=t[14];let C;t[15]===Symbol.for(`react.memo_cache_sentinel`)?(C=(0,$.jsx)(`h4`,{className:`mb-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Layers`}),t[15]=C):C=t[15];let w;t[16]===r?w=t[17]:(w=r?[r.id]:[],t[16]=r,t[17]=w);let T;t[18]!==i||t[19]!==c||t[20]!==l||t[21]!==w?(T=(0,$.jsxs)(`div`,{className:`border-t border-border p-3`,children:[C,(0,$.jsx)(yl,{layers:i,selectedObjectIds:w,onLayerSelect:c,onLayerVisibilityToggle:l})]}),t[18]=i,t[19]=c,t[20]=l,t[21]=w,t[22]=T):T=t[22];let E;t[23]!==S||t[24]!==T?(E=(0,$.jsxs)(`div`,{className:`flex-1 overflow-y-auto`,children:[S,T]}),t[23]=S,t[24]=T,t[25]=E):E=t[25];let D;return t[26]!==b||t[27]!==E?(D=(0,$.jsxs)(`div`,{className:`absolute right-0 top-0 z-10 flex h-full w-56 flex-col border-l border-border bg-card`,children:[b,E]}),t[26]=b,t[27]=E,t[28]=D):D=t[28],D});function xl(e){let t=(0,ml.c)(12),{label:n,value:r,onChange:i}=e,a;t[0]===n?a=t[1]:(a=(0,$.jsx)(`label`,{className:`w-5 text-[10px] text-muted-foreground`,children:n}),t[0]=n,t[1]=a);let o;t[2]===r?o=t[3]:(o=Math.round(r),t[2]=r,t[3]=o);let s;t[4]===i?s=t[5]:(s=e=>i(e.target.value),t[4]=i,t[5]=s);let c;t[6]!==o||t[7]!==s?(c=(0,$.jsx)(`input`,{type:`number`,value:o,onChange:s,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px] tabular-nums text-foreground`}),t[6]=o,t[7]=s,t[8]=c):c=t[8];let l;return t[9]!==a||t[10]!==c?(l=(0,$.jsxs)(`div`,{className:`flex items-center gap-1`,children:[a,c]}),t[9]=a,t[10]=c,t[11]=l):l=t[11],l}function Sl(e){let t=(0,ml.c)(15),{label:n,value:r,onChange:i}=e,a;t[0]===n?a=t[1]:(a=(0,$.jsx)(`label`,{className:`w-12 text-[10px] text-muted-foreground`,children:n}),t[0]=n,t[1]=a);let o=r||`#000000`,s;t[2]===i?s=t[3]:(s=e=>i(e.target.value),t[2]=i,t[3]=s);let c;t[4]!==o||t[5]!==s?(c=(0,$.jsx)(`input`,{type:`color`,value:o,onChange:s,className:`size-5 cursor-pointer rounded border border-border`}),t[4]=o,t[5]=s,t[6]=c):c=t[6];let l=r||`none`,u;t[7]===l?u=t[8]:(u=(0,$.jsx)(`span`,{className:`text-[10px] tabular-nums text-muted-foreground`,children:l}),t[7]=l,t[8]=u);let d;t[9]!==c||t[10]!==u?(d=(0,$.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[c,u]}),t[9]=c,t[10]=u,t[11]=d):d=t[11];let f;return t[12]!==a||t[13]!==d?(f=(0,$.jsxs)(`div`,{className:`flex items-center gap-2`,children:[a,d]}),t[12]=a,t[13]=d,t[14]=f):f=t[14],f}function Cl(e){let t=(0,ml.c)(4),{icon:n,label:r,onClick:i}=e,a;return t[0]!==n||t[1]!==r||t[2]!==i?(a=(0,$.jsx)(`button`,{onClick:i,className:`inline-flex size-7 items-center justify-center rounded border border-border bg-background text-muted-foreground hover:text-foreground`,title:r,children:n}),t[0]=n,t[1]=r,t[2]=i,t[3]=a):a=t[3],a}var wl=(0,B.memo)(function(e){let t=(0,ml.c)(67),{artboardPresetId:n,artboardWidth:r,artboardHeight:a,onSelectPreset:o,onCustomSize:s}=e,[c,u]=(0,B.useState)(!1),[p,m]=(0,B.useState)(String(r)),[h,g]=(0,B.useState)(String(a)),_;t[0]===n?_=t[1]:(_=n?fe.get(n):null,t[0]=n,t[1]=_);let v=_,y=v?v.label:`${r} x ${a}`,b,x,S,C,w,T,E,D,O,k,A;if(t[2]!==a||t[3]!==r||t[4]!==h||t[5]!==p||t[6]!==y||t[7]!==s||t[8]!==c){let e=pe(),n;t[20]!==h||t[21]!==p||t[22]!==s?(n=()=>{let e=Number.parseInt(p,10),t=Number.parseInt(h,10);e>0&&t>0&&(s(e,t),u(!1))},t[20]=h,t[21]=p,t[22]=s,t[23]=n):n=t[23],S=n,x=f,O=c,k=u;let o;t[24]===y?o=t[25]:(o=(0,$.jsx)(`span`,{className:`max-w-[140px] truncate`,children:y}),t[24]=y,t[25]=o);let m;t[26]!==a||t[27]!==r?(m=(0,$.jsxs)(`span`,{className:`tabular-nums opacity-60`,children:[r,`x`,a]}),t[26]=a,t[27]=r,t[28]=m):m=t[28];let g;t[29]===Symbol.for(`react.memo_cache_sentinel`)?(g=(0,$.jsx)(i,{className:`size-3`}),t[29]=g):g=t[29],t[30]!==o||t[31]!==m?(A=(0,$.jsxs)(l,{className:`inline-flex items-center gap-1 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[o,m,g]}),t[30]=o,t[31]=m,t[32]=A):A=t[32],b=d,T=`bottom`,E=`start`,D=`w-64 p-0`,w=`max-h-72 overflow-y-auto p-1`,C=[...e.entries()],t[2]=a,t[3]=r,t[4]=h,t[5]=p,t[6]=y,t[7]=s,t[8]=c,t[9]=b,t[10]=x,t[11]=S,t[12]=C,t[13]=w,t[14]=T,t[15]=E,t[16]=D,t[17]=O,t[18]=k,t[19]=A}else b=t[9],x=t[10],S=t[11],C=t[12],w=t[13],T=t[14],E=t[15],D=t[16],O=t[17],k=t[18],A=t[19];let j;t[33]!==n||t[34]!==o||t[35]!==C?(j=C.map(e=>{let[t,r]=e;return(0,$.jsxs)(`div`,{children:[(0,$.jsx)(`div`,{className:`px-2 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:t}),r.map(e=>(0,$.jsxs)(`button`,{onClick:()=>{o(e),u(!1)},className:`flex w-full items-center justify-between rounded-md px-2 py-1.5 text-xs hover:bg-accent ${n===e.id?`bg-accent text-foreground`:`text-muted-foreground`}`,children:[(0,$.jsx)(`span`,{children:e.label}),(0,$.jsxs)(`span`,{className:`tabular-nums opacity-60`,children:[e.width,`x`,e.height]})]},e.id))]},t)}),t[33]=n,t[34]=o,t[35]=C,t[36]=j):j=t[36];let M;t[37]!==j||t[38]!==w?(M=(0,$.jsx)(`div`,{className:w,children:j}),t[37]=j,t[38]=w,t[39]=M):M=t[39];let N;t[40]===Symbol.for(`react.memo_cache_sentinel`)?(N=(0,$.jsx)(`div`,{className:`mb-1.5 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:`Custom Size`}),t[40]=N):N=t[40];let P;t[41]===Symbol.for(`react.memo_cache_sentinel`)?(P=e=>m(e.target.value),t[41]=P):P=t[41];let F;t[42]===p?F=t[43]:(F=(0,$.jsx)(`input`,{type:`number`,value:p,onChange:P,placeholder:`Width`,className:`h-6 w-20 rounded border border-border bg-background px-1.5 text-[10px] tabular-nums`}),t[42]=p,t[43]=F);let I;t[44]===Symbol.for(`react.memo_cache_sentinel`)?(I=(0,$.jsx)(`span`,{className:`text-[10px] text-muted-foreground`,children:`x`}),t[44]=I):I=t[44];let ee;t[45]===Symbol.for(`react.memo_cache_sentinel`)?(ee=e=>g(e.target.value),t[45]=ee):ee=t[45];let L;t[46]===h?L=t[47]:(L=(0,$.jsx)(`input`,{type:`number`,value:h,onChange:ee,placeholder:`Height`,className:`h-6 w-20 rounded border border-border bg-background px-1.5 text-[10px] tabular-nums`}),t[46]=h,t[47]=L);let te;t[48]===S?te=t[49]:(te=(0,$.jsx)(`button`,{onClick:S,className:`h-6 rounded bg-primary px-2 text-[10px] font-medium text-primary-foreground hover:bg-primary/90`,children:`Apply`}),t[48]=S,t[49]=te);let R;t[50]!==F||t[51]!==L||t[52]!==te?(R=(0,$.jsxs)(`div`,{className:`border-t border-border p-2`,children:[N,(0,$.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[F,I,L,te]})]}),t[50]=F,t[51]=L,t[52]=te,t[53]=R):R=t[53];let z;t[54]!==b||t[55]!==M||t[56]!==R||t[57]!==T||t[58]!==E||t[59]!==D?(z=(0,$.jsxs)(b,{side:T,align:E,className:D,children:[M,R]}),t[54]=b,t[55]=M,t[56]=R,t[57]=T,t[58]=E,t[59]=D,t[60]=z):z=t[60];let ne;return t[61]!==x||t[62]!==z||t[63]!==O||t[64]!==k||t[65]!==A?(ne=(0,$.jsxs)(x,{open:O,onOpenChange:k,children:[A,z]}),t[61]=x,t[62]=z,t[63]=O,t[64]=k,t[65]=A,t[66]=ne):ne=t[66],ne}),Tl=(0,B.memo)(function({canvasRef:e,artboardWidth:t,artboardHeight:n,savedDesigns:r,onSaveDesign:i,onLoadDesign:a,onDeleteDesign:o}){let[s,c]=(0,B.useState)(!1),[u,p]=(0,B.useState)(!1),m=t=>{let n=e.current?.exportPNG(t);n&&me(n,`design-${Date.now()}.png`),c(!1)},g=()=>{let t=e.current?.exportSVG();t&&he(new Blob([t],{type:`image/svg+xml`}),`design-${Date.now()}.svg`),c(!1)},_=async()=>{let r=e.current?.exportPNG(2);if(!r)return;let{jsPDF:i}=await h(async()=>{let{jsPDF:e}=await import(`./jspdf.es.min-Hx4pHu4X.js`);return{jsPDF:e}},__vite__mapDeps([0,1,2,3])),a=new i({orientation:t>n?`landscape`:`portrait`,unit:`px`,format:[t,n]});a.addImage(r,`PNG`,0,0,t,n),a.save(`design-${Date.now()}.pdf`),c(!1)},b=()=>{let t=e.current?.toJSON();t&&(i(`design-${Date.now()}`,`Design ${new Date().toLocaleString()}`,t),c(!1))},x=e=>{a(e),c(!1),p(!1)},S=Object.entries(r).toSorted(([,e],[,t])=>new Date(t.updatedAt).getTime()-new Date(e.updatedAt).getTime());return(0,$.jsxs)(f,{open:s,onOpenChange:e=>{c(e),e||p(!1)},children:[(0,$.jsxs)(l,{className:`inline-flex items-center gap-1.5 rounded-md bg-success px-2.5 py-1 text-xs font-medium text-white hover:bg-success`,children:[(0,$.jsx)(T,{className:`size-3`}),`Export`]}),(0,$.jsx)(d,{side:`bottom`,align:`end`,className:`w-52 p-1`,children:u?(0,$.jsxs)(`div`,{children:[(0,$.jsx)(`button`,{onClick:()=>p(!1),className:`mb-1 w-full rounded px-2 py-1 text-left text-[10px] text-muted-foreground hover:bg-accent`,children:`← Back`}),S.map(([e,t])=>(0,$.jsxs)(`div`,{className:`flex items-center gap-1 rounded px-1 py-0.5 hover:bg-accent`,children:[(0,$.jsx)(`button`,{onClick:()=>x(t.json),className:`flex-1 truncate px-1 py-1 text-left text-xs text-foreground`,children:t.name}),(0,$.jsx)(`button`,{onClick:()=>o(e),className:`inline-flex size-5 items-center justify-center rounded text-muted-foreground hover:text-destructive`,children:(0,$.jsx)(se,{className:`size-3`})})]},e))]}):(0,$.jsxs)($.Fragment,{children:[(0,$.jsxs)(El,{label:`Export`,children:[(0,$.jsx)(Dl,{icon:(0,$.jsx)(R,{className:`size-3.5`}),label:`PNG (1x)`,onClick:()=>m(1)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(R,{className:`size-3.5`}),label:`PNG (2x)`,onClick:()=>m(2)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(I,{className:`size-3.5`}),label:`SVG`,onClick:g}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(y,{className:`size-3.5`}),label:`PDF`,onClick:()=>void _()})]}),(0,$.jsx)(`div`,{className:`my-1 h-px bg-border`}),(0,$.jsxs)(El,{label:`Design`,children:[(0,$.jsx)(Dl,{icon:(0,$.jsx)(v,{className:`size-3.5`}),label:`Save Design`,onClick:b}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(ee,{className:`size-3.5`}),label:`Load Design (${S.length})`,onClick:()=>p(!0),disabled:S.length===0})]})]})})]})});function El(e){let t=(0,ml.c)(5),{label:n,children:r}=e,i;t[0]===n?i=t[1]:(i=(0,$.jsx)(`div`,{className:`px-2 py-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground`,children:n}),t[0]=n,t[1]=i);let a;return t[2]!==r||t[3]!==i?(a=(0,$.jsxs)(`div`,{children:[i,r]}),t[2]=r,t[3]=i,t[4]=a):a=t[4],a}function Dl(e){let t=(0,ml.c)(5),{icon:n,label:r,onClick:i,disabled:a}=e,o;return t[0]!==a||t[1]!==n||t[2]!==r||t[3]!==i?(o=(0,$.jsxs)(`button`,{onClick:i,disabled:a,className:`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-xs text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-40`,children:[n,r]}),t[0]=a,t[1]=n,t[2]=r,t[3]=i,t[4]=o):o=t[4],o}var Ol=(0,B.memo)(function(e){let t=(0,ml.c)(26),{canvasRef:n,artboardWidth:r,artboardHeight:i,brandKit:a,onCanvasModified:o}=e,[s,c]=(0,B.useState)(!1),[u,p]=(0,B.useState)(``),m;t[0]!==i||t[1]!==r||t[2]!==a||t[3]!==n||t[4]!==o||t[5]!==u?(m=()=>{let e=u.trim();if(!e)return;let t=C(e,r,i,a);n.current?.applyGeneratedLayout(t.objects),o(),p(``),c(!1)},t[0]=i,t[1]=r,t[2]=a,t[3]=n,t[4]=o,t[5]=u,t[6]=m):m=t[6];let h=m,g;t[7]===h?g=t[8]:(g=e=>{e.key===`Enter`&&!e.shiftKey&&(e.preventDefault(),h())},t[7]=h,t[8]=g);let _=g,v;t[9]===Symbol.for(`react.memo_cache_sentinel`)?(v=(0,$.jsxs)(l,{className:`inline-flex items-center gap-1.5 rounded-md bg-primary/10 px-2.5 py-1 text-xs font-medium text-primary hover:bg-primary/20`,children:[(0,$.jsx)(ce,{className:`size-3`}),`Quick Create`]}),t[9]=v):v=t[9];let y,b;t[10]===Symbol.for(`react.memo_cache_sentinel`)?(y=(0,$.jsx)(`div`,{className:`mb-2 text-xs font-semibold text-foreground`,children:`Generate Design`}),b=(0,$.jsx)(`p`,{className:`mb-3 text-[10px] text-muted-foreground`,children:`Describe what you want and we'll generate a canvas layout for you.`}),t[10]=y,t[11]=b):(y=t[10],b=t[11]);let x;t[12]===Symbol.for(`react.memo_cache_sentinel`)?(x=e=>p(e.target.value),t[12]=x):x=t[12];let S;t[13]!==_||t[14]!==u?(S=(0,$.jsx)(`textarea`,{value:u,onChange:x,onKeyDown:_,placeholder:`e.g. Bold sale announcement for Instagram...`,rows:3,className:`mb-2 w-full resize-none rounded-md border border-border bg-background px-2.5 py-2 text-xs placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-primary`,autoFocus:!0}),t[13]=_,t[14]=u,t[15]=S):S=t[15];let w;t[16]===Symbol.for(`react.memo_cache_sentinel`)?(w=(0,$.jsx)(`span`,{className:`text-[10px] text-muted-foreground`,children:`Press Enter to generate`}),t[16]=w):w=t[16];let T=!u.trim(),E;t[17]!==h||t[18]!==T?(E=(0,$.jsxs)(`div`,{className:`flex items-center justify-between`,children:[w,(0,$.jsx)(`button`,{onClick:h,disabled:T,className:`rounded-md bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground hover:bg-primary/90 disabled:opacity-40`,children:`Generate`})]}),t[17]=h,t[18]=T,t[19]=E):E=t[19];let D;t[20]!==E||t[21]!==S?(D=(0,$.jsxs)(d,{side:`bottom`,align:`start`,className:`w-80 p-3`,children:[y,b,S,E]}),t[20]=E,t[21]=S,t[22]=D):D=t[22];let O;return t[23]!==s||t[24]!==D?(O=(0,$.jsxs)(f,{open:s,onOpenChange:c,children:[v,D]}),t[23]=s,t[24]=D,t[25]=O):O=t[25],O}),kl={social:`Social Media`,business:`Business`,marketing:`Marketing`,presentation:`Presentations`},Al=(0,B.memo)(function(e){let t=(0,ml.c)(50),{canvasRef:n,brandKit:r,onCanvasModified:i,onSelectPreset:a}=e,[o,s]=(0,B.useState)(!1),[c,u]=(0,B.useState)(null),p,m,h,g,v,y,b,x,S,w,T;if(t[0]!==c||t[1]!==r||t[2]!==n||t[3]!==i||t[4]!==a||t[5]!==o){let e=_(),D=[...e.keys()],O=c?e.get(c)??[]:E,k;t[17]!==r||t[18]!==n||t[19]!==i||t[20]!==a?(k=e=>{let t=fe.get(e.presetId);t&&a(t);let o=t?.width??1080,c=t?.height??1080,l=C(e.previewPrompt,o,c,r);requestAnimationFrame(()=>{n.current?.applyGeneratedLayout(l.objects),i()}),s(!1)},t[17]=r,t[18]=n,t[19]=i,t[20]=a,t[21]=k):k=t[21];let A=k;m=f,S=o,w=s,t[22]===Symbol.for(`react.memo_cache_sentinel`)?(T=(0,$.jsxs)(l,{className:`inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[(0,$.jsx)(z,{className:`size-3`}),`Templates`]}),t[22]=T):T=t[22],p=d,v=`bottom`,y=`start`,b=`w-80 p-0`;let j;t[23]===Symbol.for(`react.memo_cache_sentinel`)?(j=()=>u(null),t[23]=j):j=t[23];let M=`rounded-md px-2 py-1 text-[10px] font-medium ${c===null?`bg-primary/10 text-primary`:`text-muted-foreground hover:text-foreground`}`,N;t[24]===M?N=t[25]:(N=(0,$.jsx)(`button`,{onClick:j,className:M,children:`All`}),t[24]=M,t[25]=N);let P;t[26]!==c||t[27]!==D?(P=D.map(e=>(0,$.jsx)(`button`,{onClick:()=>u(e),className:`rounded-md px-2 py-1 text-[10px] font-medium ${c===e?`bg-primary/10 text-primary`:`text-muted-foreground hover:text-foreground`}`,children:kl[e]??e},e)),t[26]=c,t[27]=D,t[28]=P):P=t[28],t[29]!==N||t[30]!==P?(x=(0,$.jsxs)(`div`,{className:`flex gap-1 border-b border-border px-2 py-1.5`,children:[N,P]}),t[29]=N,t[30]=P,t[31]=x):x=t[31],h=`grid max-h-64 grid-cols-2 gap-1.5 overflow-y-auto p-2`;let F;t[32]===A?F=t[33]:(F=e=>{let t=fe.get(e.presetId);return(0,$.jsxs)(`button`,{onClick:()=>A(e),className:`group flex flex-col rounded-lg border border-border p-2 text-left hover:border-primary/50 hover:bg-accent/50`,children:[(0,$.jsx)(`div`,{className:`mb-1.5 h-12 w-full rounded-md`,style:{background:e.style===`bold`?`linear-gradient(135deg, #1f2937, #374151)`:e.style===`gradient`?`linear-gradient(135deg, #4f46e5, #818cf8)`:e.style===`centered`?`linear-gradient(135deg, #fef3c7, #fde68a)`:e.style===`split`?`linear-gradient(90deg, #0ea5e9 45%, #f8fafc 45%)`:`#f8fafc`}}),(0,$.jsx)(`span`,{className:`text-[10px] font-medium text-foreground group-hover:text-primary`,children:e.name}),(0,$.jsx)(`span`,{className:`text-[9px] text-muted-foreground`,children:t?.label??e.presetId})]},e.id)},t[32]=A,t[33]=F),g=O.map(F),t[0]=c,t[1]=r,t[2]=n,t[3]=i,t[4]=a,t[5]=o,t[6]=p,t[7]=m,t[8]=h,t[9]=g,t[10]=v,t[11]=y,t[12]=b,t[13]=x,t[14]=S,t[15]=w,t[16]=T}else p=t[6],m=t[7],h=t[8],g=t[9],v=t[10],y=t[11],b=t[12],x=t[13],S=t[14],w=t[15],T=t[16];let D;t[34]!==h||t[35]!==g?(D=(0,$.jsx)(`div`,{className:h,children:g}),t[34]=h,t[35]=g,t[36]=D):D=t[36];let O;t[37]!==p||t[38]!==D||t[39]!==v||t[40]!==y||t[41]!==b||t[42]!==x?(O=(0,$.jsxs)(p,{side:v,align:y,className:b,children:[x,D]}),t[37]=p,t[38]=D,t[39]=v,t[40]=y,t[41]=b,t[42]=x,t[43]=O):O=t[43];let k;return t[44]!==m||t[45]!==O||t[46]!==S||t[47]!==w||t[48]!==T?(k=(0,$.jsxs)(m,{open:S,onOpenChange:w,children:[T,O]}),t[44]=m,t[45]=O,t[46]=S,t[47]=w,t[48]=T,t[49]=k):k=t[49],k});function jl(e){let t=(0,ml.c)(13),{label:n,value:r,onChange:i}=e,a;t[0]===i?a=t[1]:(a=e=>i(e.target.value),t[0]=i,t[1]=a);let o;t[2]!==a||t[3]!==r?(o=(0,$.jsx)(`input`,{type:`color`,value:r,onChange:a,className:`size-5 cursor-pointer rounded border border-border`}),t[2]=a,t[3]=r,t[4]=o):o=t[4];let s;t[5]===n?s=t[6]:(s=(0,$.jsx)(`span`,{className:`flex-1 text-[10px] text-muted-foreground`,children:n}),t[5]=n,t[6]=s);let c;t[7]===r?c=t[8]:(c=(0,$.jsx)(`span`,{className:`font-mono text-[9px] text-muted-foreground/60`,children:r}),t[7]=r,t[8]=c);let l;return t[9]!==o||t[10]!==s||t[11]!==c?(l=(0,$.jsxs)(`label`,{className:`flex items-center gap-2`,children:[o,s,c]}),t[9]=o,t[10]=s,t[11]=c,t[12]=l):l=t[12],l}var Ml=[`Inter, sans-serif`,`Georgia, serif`,`Menlo, monospace`,`system-ui, sans-serif`,`Helvetica, Arial, sans-serif`,`Times New Roman, serif`],Nl=(0,B.memo)(function(e){let t=(0,ml.c)(70),{brandKit:n,onUpdate:r,onReset:i}=e,[a,o]=(0,B.useState)(!1),s;t[0]===r?s=t[1]:(s=(e,t)=>{r({[e]:t})},t[0]=r,t[1]=s);let c=s,u;t[2]===Symbol.for(`react.memo_cache_sentinel`)?(u=(0,$.jsxs)(l,{className:`inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-xs text-muted-foreground hover:bg-accent hover:text-foreground`,children:[(0,$.jsx)(w,{className:`size-3`}),`Brand`]}),t[2]=u):u=t[2];let p;t[3]===Symbol.for(`react.memo_cache_sentinel`)?(p=(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Brand Kit`}),t[3]=p):p=t[3];let m;t[4]===i?m=t[5]:(m=(0,$.jsxs)(`div`,{className:`mb-2 flex items-center justify-between`,children:[p,(0,$.jsx)(`button`,{onClick:i,className:`text-[10px] text-muted-foreground hover:text-foreground`,children:`Reset`})]}),t[4]=i,t[5]=m);let h;t[6]===Symbol.for(`react.memo_cache_sentinel`)?(h=(0,$.jsx)(`div`,{className:`text-[10px] font-medium uppercase tracking-wider text-muted-foreground`,children:`Colors`}),t[6]=h):h=t[6];let g;t[7]===c?g=t[8]:(g=e=>c(`primaryColor`,e),t[7]=c,t[8]=g);let _;t[9]!==n.primaryColor||t[10]!==g?(_=(0,$.jsx)(jl,{label:`Primary`,value:n.primaryColor,onChange:g}),t[9]=n.primaryColor,t[10]=g,t[11]=_):_=t[11];let v;t[12]===c?v=t[13]:(v=e=>c(`secondaryColor`,e),t[12]=c,t[13]=v);let y;t[14]!==n.secondaryColor||t[15]!==v?(y=(0,$.jsx)(jl,{label:`Secondary`,value:n.secondaryColor,onChange:v}),t[14]=n.secondaryColor,t[15]=v,t[16]=y):y=t[16];let b;t[17]===c?b=t[18]:(b=e=>c(`accentColor`,e),t[17]=c,t[18]=b);let x;t[19]!==n.accentColor||t[20]!==b?(x=(0,$.jsx)(jl,{label:`Accent`,value:n.accentColor,onChange:b}),t[19]=n.accentColor,t[20]=b,t[21]=x):x=t[21];let S;t[22]===c?S=t[23]:(S=e=>c(`backgroundColor`,e),t[22]=c,t[23]=S);let C;t[24]!==n.backgroundColor||t[25]!==S?(C=(0,$.jsx)(jl,{label:`Background`,value:n.backgroundColor,onChange:S}),t[24]=n.backgroundColor,t[25]=S,t[26]=C):C=t[26];let T;t[27]===c?T=t[28]:(T=e=>c(`textColor`,e),t[27]=c,t[28]=T);let E;t[29]!==n.textColor||t[30]!==T?(E=(0,$.jsx)(jl,{label:`Text`,value:n.textColor,onChange:T}),t[29]=n.textColor,t[30]=T,t[31]=E):E=t[31];let D;t[32]!==x||t[33]!==C||t[34]!==E||t[35]!==_||t[36]!==y?(D=(0,$.jsxs)(`div`,{className:`space-y-2`,children:[h,_,y,x,C,E]}),t[32]=x,t[33]=C,t[34]=E,t[35]=_,t[36]=y,t[37]=D):D=t[37];let O;t[38]===Symbol.for(`react.memo_cache_sentinel`)?(O=(0,$.jsx)(`div`,{className:`text-[10px] font-medium uppercase tracking-wider text-muted-foreground`,children:`Fonts`}),t[38]=O):O=t[38];let k;t[39]===Symbol.for(`react.memo_cache_sentinel`)?(k=(0,$.jsx)(`span`,{className:`mb-1 block text-[10px] text-muted-foreground`,children:`Body Font`}),t[39]=k):k=t[39];let A=n.fontFamily,j;t[40]===r?j=t[41]:(j=e=>r({fontFamily:e.target.value}),t[40]=r,t[41]=j);let M;t[42]===Symbol.for(`react.memo_cache_sentinel`)?(M=Ml.map(Pl),t[42]=M):M=t[42];let N;t[43]!==n.fontFamily||t[44]!==j?(N=(0,$.jsxs)(`label`,{className:`block`,children:[k,(0,$.jsx)(`select`,{value:A,onChange:j,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px]`,children:M})]}),t[43]=n.fontFamily,t[44]=j,t[45]=N):N=t[45];let P;t[46]===Symbol.for(`react.memo_cache_sentinel`)?(P=(0,$.jsx)(`span`,{className:`mb-1 block text-[10px] text-muted-foreground`,children:`Heading Font`}),t[46]=P):P=t[46];let F=n.headingFontFamily,I;t[47]===r?I=t[48]:(I=e=>r({headingFontFamily:e.target.value}),t[47]=r,t[48]=I);let ee;t[49]===Symbol.for(`react.memo_cache_sentinel`)?(ee=Ml.map(Fl),t[49]=ee):ee=t[49];let L;t[50]!==n.headingFontFamily||t[51]!==I?(L=(0,$.jsxs)(`label`,{className:`block`,children:[P,(0,$.jsx)(`select`,{value:F,onChange:I,className:`h-6 w-full rounded border border-border bg-background px-1.5 text-[10px]`,children:ee})]}),t[50]=n.headingFontFamily,t[51]=I,t[52]=L):L=t[52];let te;t[53]!==N||t[54]!==L?(te=(0,$.jsxs)(`div`,{className:`mt-3 space-y-2`,children:[O,N,L]}),t[53]=N,t[54]=L,t[55]=te):te=t[55];let R;t[56]!==n.accentColor||t[57]!==n.backgroundColor||t[58]!==n.primaryColor||t[59]!==n.secondaryColor||t[60]!==n.textColor?(R=(0,$.jsx)(`div`,{className:`mt-3 flex gap-1 rounded-md border border-border p-1.5`,children:[n.primaryColor,n.secondaryColor,n.accentColor,n.backgroundColor,n.textColor].map(Il)}),t[56]=n.accentColor,t[57]=n.backgroundColor,t[58]=n.primaryColor,t[59]=n.secondaryColor,t[60]=n.textColor,t[61]=R):R=t[61];let z;t[62]!==D||t[63]!==te||t[64]!==R||t[65]!==m?(z=(0,$.jsxs)(d,{side:`bottom`,align:`end`,className:`w-64 p-3`,children:[m,D,te,R]}),t[62]=D,t[63]=te,t[64]=R,t[65]=m,t[66]=z):z=t[66];let ne;return t[67]!==a||t[68]!==z?(ne=(0,$.jsxs)(f,{open:a,onOpenChange:o,children:[u,z]}),t[67]=a,t[68]=z,t[69]=ne):ne=t[69],ne});function Pl(e){return(0,$.jsx)(`option`,{value:e,children:e.split(`,`)[0]},e)}function Fl(e){return(0,$.jsx)(`option`,{value:e,children:e.split(`,`)[0]},e)}function Il(e){return(0,$.jsx)(`div`,{className:`h-4 flex-1 rounded-sm`,style:{backgroundColor:e}},e)}var Ll=(0,B.memo)(function({onClose:e}){let t=(0,B.useRef)(null),n=(0,B.useRef)(new m(()=>{let e=t.current?.toJSON();e&&j.getState().pushHistorySnapshot(e)},{wait:500}));(0,B.useEffect)(()=>{let e=n.current;return()=>{e.cancel()}},[]);let{activeTool:r,artboardPresetId:i,artboardWidth:o,artboardHeight:s,selectedObjectProperties:c,propertiesPanelOpen:l,historyIndex:u,historyStack:d,layers:f,zoomLevel:p,savedDesigns:h,brandKit:g,setActiveTool:_,setArtboard:v,setSelectedObjects:y,clearSelection:b,setPropertiesPanelOpen:x,setLayers:S,setZoomLevel:w,undo:T,redo:E,resetHistory:D,saveDesign:O,deleteDesign:A,updateBrandKit:M,setBrandKit:N}=j();(0,B.useEffect)(()=>{let e=setTimeout(()=>{let e=t.current?.toJSON();e&&j.getState().pushHistorySnapshot(e)},100);return()=>clearTimeout(e)},[]),(0,B.useEffect)(()=>{let e=j.subscribe((e,n)=>{if(e.pendingGeneratePrompt&&e.pendingGeneratePrompt!==n.pendingGeneratePrompt){let e=j.getState().consumePendingGenerate();if(e&&t.current){let n=C(e,o,s,g);t.current.applyGeneratedLayout(n.objects)}}}),n=j.getState().consumePendingGenerate();return n&&t.current&&requestAnimationFrame(()=>{let e=C(n,o,s,g);t.current?.applyGeneratedLayout(e.objects)}),e},[o,s,g]);let P=(0,B.useCallback)(()=>{n.current.maybeExecute()},[]),F=(0,B.useCallback)(e=>{_(e)},[_]),I=(0,B.useCallback)(e=>{v(e.id,e.width,e.height),D()},[v,D]),ee=(0,B.useCallback)((e,t)=>{v(null,e,t),D()},[v,D]),L=(0,B.useCallback)(()=>{let e=T();e&&t.current?.loadJSON(e)},[T]),te=(0,B.useCallback)(()=>{let e=E();e&&t.current?.loadJSON(e)},[E]),R=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=_e(p),r=e.viewportTransform;r[0]=n,r[3]=n,e.setViewportTransform(r),w(n),e.requestRenderAll()},[p,w]),z=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=ve(p),r=e.viewportTransform;r[0]=n,r[3]=n,e.setViewportTransform(r),w(n),e.requestRenderAll()},[p,w]),ne=(0,B.useCallback)(()=>{t.current?.fitToView()},[]),ie=(0,B.useCallback)((e,n)=>{let r=t.current?.getCanvas();if(!r)return;let i=r.getActiveObject();if(!i)return;if(e===`scaleWidth`){let e=i.width??1;i.set(`scaleX`,n/e)}else if(e===`scaleHeight`){let e=i.height??1;i.set(`scaleY`,n/e)}else i.set(e,n);i.setCoords(),r.requestRenderAll(),P();let a=j.getState().selectedObjectProperties;if(a){let t={...a,[e===`scaleWidth`?`width`:e===`scaleHeight`?`height`:e]:n};y([a.id],t)}},[P,y]),ae=(0,B.useCallback)(e=>{let n=t.current?.getCanvas();if(!n)return;let r=n.getObjects().find(t=>t.customId===e);r&&(n.setActiveObject(r),n.requestRenderAll())},[]),oe=(0,B.useCallback)(e=>{let n=t.current?.getCanvas();if(!n)return;let r=n.getObjects().find(t=>t.customId===e);if(r){r.visible=!r.visible,n.requestRenderAll();let t=f.map(t=>t.id===e?{...t,visible:!t.visible}:t);S(t)}},[f,S]),se=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.bringObjectForward(n),e.requestRenderAll(),P())},[P]),ce=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.sendObjectBackwards(n),e.requestRenderAll(),P())},[P]),le=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.bringObjectToFront(n),e.requestRenderAll(),P())},[P]),ue=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();if(n){let t=e.getObjects().findIndex(e=>e.customId===`__artboard__`);e.moveObjectTo(n,t+1),e.requestRenderAll(),P()}},[P]),de=(0,B.useCallback)(async e=>{await t.current?.loadJSON(e),D();let n=t.current?.toJSON();n&&j.getState().pushHistorySnapshot(n)},[D]),fe=(0,B.useCallback)((e,t,n)=>{O(e,t,n)},[O]);(0,B.useEffect)(()=>{let e=e=>{if(!(e.target instanceof HTMLInputElement||e.target instanceof HTMLTextAreaElement)){if(!e.metaKey&&!e.ctrlKey)switch(e.key.toLowerCase()){case`v`:_(`select`);return;case`t`:_(`text`);return;case`r`:_(`rect`);return;case`d`:_(`draw`);return}if((e.metaKey||e.ctrlKey)&&e.key===`z`&&(e.preventDefault(),e.shiftKey?te():L()),e.key===`Delete`||e.key===`Backspace`){let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&n.customId!==`__artboard__`&&(e.remove(n),b(),P())}}};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[_,L,te,b,P]);let pe=u>0,me=u<d.length-1;return(0,$.jsxs)(`div`,{className:`flex h-full flex-col`,children:[(0,$.jsxs)(`div`,{className:`flex items-center gap-2 border-b border-border px-3 py-1.5`,children:[(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Canvas`}),(0,$.jsx)(`div`,{className:`mx-1 h-4 w-px bg-border`}),(0,$.jsx)(Ol,{canvasRef:t,artboardWidth:o,artboardHeight:s,brandKit:g,onCanvasModified:P}),(0,$.jsx)(Al,{canvasRef:t,brandKit:g,onCanvasModified:P,onSelectPreset:I}),(0,$.jsx)(Nl,{brandKit:g,onUpdate:M,onReset:()=>N(k)}),(0,$.jsx)(`div`,{className:`flex-1`}),(0,$.jsx)(wl,{artboardPresetId:i,artboardWidth:o,artboardHeight:s,onSelectPreset:I,onCustomSize:ee}),(0,$.jsx)(Tl,{canvasRef:t,artboardWidth:o,artboardHeight:s,savedDesigns:h,onSaveDesign:fe,onLoadDesign:e=>void de(e),onDeleteDesign:A}),e?(0,$.jsx)(`button`,{onClick:e,className:`inline-flex size-6 items-center justify-center rounded text-muted-foreground hover:text-foreground`,children:(0,$.jsx)(a,{className:`size-3.5`})}):null]}),(0,$.jsxs)(`div`,{className:`relative flex min-h-0 flex-1`,children:[f.length===0&&(0,$.jsxs)(`div`,{"aria-hidden":`true`,className:`pointer-events-none absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 text-center`,children:[(0,$.jsx)(re,{className:`size-7 text-muted-foreground/20`}),(0,$.jsx)(`p`,{className:`text-[12px] text-muted-foreground/35`,children:`Use Quick Create or Templates to start designing.`})]}),(0,$.jsx)(pl,{ref:t,artboardWidth:o,artboardHeight:s,activeTool:r,onSelectionChange:y,onCanvasModified:P,onLayersChange:S,onZoomChange:w}),(0,$.jsx)(bl,{open:l,properties:c,layers:f,onClose:()=>x(!1),onPropertyChange:ie,onLayerSelect:ae,onLayerVisibilityToggle:oe,onMoveUp:se,onMoveDown:ce,onBringToFront:le,onSendToBack:ue})]}),(0,$.jsx)(_l,{activeTool:r,onToolChange:F,canUndo:pe,canRedo:me,onUndo:L,onRedo:te,zoomLevel:p,onZoomIn:R,onZoomOut:z,onFitToView:ne,canvasRef:t,onCanvasModified:P})]})});export{Ll as CanvasPanel,Ll as default};
|
|
441
|
+
//# sourceMappingURL=CanvasPanel-D9NzolmF.js.map
|