@cmmd-center/forge 0.13.109 → 0.13.111

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.
Files changed (22) hide show
  1. package/dist/bin.cjs +62 -8
  2. package/dist/bin.mjs +62 -8
  3. package/dist/client/assets/{CanvasPanel-i6_Wn-y3.js → CanvasPanel-Cg4D-ISF.js} +2 -2
  4. package/dist/client/assets/{CompositeItem-DYaCFJOM.js → CompositeItem-CYjaZm9j.js} +2 -2
  5. package/dist/client/assets/{DiffPanel-DOmQ7vr_.js → DiffPanel-BFKCLOKn.js} +3 -3
  6. package/dist/client/assets/{DiffPanel.logic-BfdSU3ho.js → DiffPanel.logic-_IOHIh2y.js} +2 -2
  7. package/dist/client/assets/{DiffWorkerPoolProvider-CbVy3tZS.js → DiffWorkerPoolProvider-DCjE_-a5.js} +9 -9
  8. package/dist/client/assets/PullRequestCodePanel-BR8CzVYM.js +5 -0
  9. package/dist/client/assets/{Virtualizer-0mLnEFZs.js → Virtualizer-De-KbFuG.js} +2 -2
  10. package/dist/client/assets/{WorkerPoolContext-BU4SzNWC.js → WorkerPoolContext-BsVSztDb.js} +101 -101
  11. package/dist/client/assets/{canvasStateStore-CGGNH2My.js → canvasStateStore-BejjlUiS.js} +2 -2
  12. package/dist/client/assets/{cmmdAuthRedirect-D9b4x37X.js → cmmdAuthRedirect-PUmt8-ZY.js} +2 -2
  13. package/dist/client/assets/{index-B_thTU_W.js → index-B2cM4r8e.js} +68 -68
  14. package/dist/client/assets/index-BnbsESv5.css +1 -0
  15. package/dist/client/assets/{popover-BLN6-1Lv.js → popover-kIpfozNc.js} +2 -2
  16. package/dist/client/assets/{src-CP7pFzq9.js → src-D27YeBpH.js} +2 -2
  17. package/dist/client/assets/{toggle-D5P2us-a.js → toggle-BNOwunZr.js} +2 -2
  18. package/dist/client/index.html +11 -11
  19. package/dist/forge-build.json +1 -1
  20. package/package.json +1 -1
  21. package/dist/client/assets/PullRequestCodePanel-BMLZYrRg.js +0 -5
  22. package/dist/client/assets/index-Dq5A7gWd.css +0 -1
package/dist/bin.cjs CHANGED
@@ -21242,6 +21242,7 @@ const RuntimeErrorClass = require_Schema$1.Literals([
21242
21242
  "transport_error",
21243
21243
  "permission_error",
21244
21244
  "validation_error",
21245
+ "usage_limit",
21245
21246
  "unknown"
21246
21247
  ]);
21247
21248
  const TOOL_LIFECYCLE_ITEM_TYPES = [
@@ -66335,7 +66336,7 @@ function normalizeNumberish(value) {
66335
66336
  }
66336
66337
  //#endregion
66337
66338
  //#region package.json
66338
- var version$1 = "0.13.109";
66339
+ var version$1 = "0.13.111";
66339
66340
  //#endregion
66340
66341
  //#region src/sentry.ts
66341
66342
  const SERVER_APP_NAME = "forge-server";
@@ -98570,11 +98571,12 @@ function classifyProviderTurnStartFailureReason(detail) {
98570
98571
  * follow-up issue) that would stop Codex from retrying against that wall in
98571
98572
  * the first place.
98572
98573
  */
98573
- function classifyMidTurnFailureReason(detail) {
98574
+ function classifyMidTurnFailureReason(detail, errorClass) {
98574
98575
  const message = detail && detail.trim().length > 0 ? detail : "The runtime reported an error while this run was in progress.";
98575
- const classified = classifyRetryableProviderFailure(detail);
98576
+ const classifiedFailure = classifyRetryableProviderFailure(detail);
98577
+ const classifiedTerminal = classifiedFailure?.kind === "terminal" && classifiedFailure.reason === "quota";
98576
98578
  return {
98577
- code: classified?.kind === "terminal" && classified.reason === "quota" ? "provider_usage_limit" : "provider_turn_failed",
98579
+ code: errorClass === "usage_limit" || classifiedTerminal ? "provider_usage_limit" : "provider_turn_failed",
98578
98580
  message
98579
98581
  };
98580
98582
  }
@@ -98778,6 +98780,11 @@ function errorMessageOf(payload) {
98778
98780
  const message = payload.errorMessage;
98779
98781
  return typeof message === "string" && message.trim().length > 0 ? message : null;
98780
98782
  }
98783
+ function errorClassOf(payload) {
98784
+ if (!payload || typeof payload !== "object") return null;
98785
+ const cls = payload.errorClass;
98786
+ return typeof cls === "string" && cls.trim().length > 0 ? cls : null;
98787
+ }
98781
98788
  /**
98782
98789
  * Turns the one durable activity `Layers/CheckpointReactor.ts` records when a
98783
98790
  * turn ends into CMMD's `turn_status` terminal event (CMMD-Center/forge#3562
@@ -98797,7 +98804,7 @@ function serializeTurnTerminalStatusActivity(activity) {
98797
98804
  if (activity.kind !== "turn.terminal-status" || !activity.turnId) return null;
98798
98805
  const outcome = outcomeOf(activity.payload);
98799
98806
  if (outcome === null) return null;
98800
- const reason = outcome === "failed" ? classifyMidTurnFailureReason(errorMessageOf(activity.payload)) : null;
98807
+ const reason = outcome === "failed" ? classifyMidTurnFailureReason(errorMessageOf(activity.payload), errorClassOf(activity.payload)) : null;
98801
98808
  return {
98802
98809
  sourceSequence: null,
98803
98810
  event: {
@@ -214137,13 +214144,32 @@ const codexRealtimeMethodMappers = {
214137
214144
  function mapCodexRuntimeErrorEvent(event, canonicalThreadId, payload) {
214138
214145
  const message = asString$2(asObject$2(payload?.error)?.message) ?? event.message ?? "Provider runtime error";
214139
214146
  const willRetry = payload?.willRetry === true;
214147
+ const detail = event.payload !== void 0 ? { detail: event.payload } : {};
214148
+ if (asString$2(asObject$2(payload?.error)?.codexErrorInfo) === "usageLimitExceeded") return [{
214149
+ type: "runtime.error",
214150
+ ...runtimeEventBase(event, canonicalThreadId),
214151
+ payload: {
214152
+ message,
214153
+ class: "usage_limit",
214154
+ ...detail
214155
+ }
214156
+ }];
214157
+ if (classifyRetryableProviderFailure(message)?.kind === "terminal") return [{
214158
+ type: "runtime.error",
214159
+ ...runtimeEventBase(event, canonicalThreadId),
214160
+ payload: {
214161
+ message,
214162
+ class: "usage_limit",
214163
+ ...detail
214164
+ }
214165
+ }];
214140
214166
  return [{
214141
214167
  type: willRetry ? "runtime.warning" : "runtime.error",
214142
214168
  ...runtimeEventBase(event, canonicalThreadId),
214143
214169
  payload: {
214144
214170
  message,
214145
214171
  ...!willRetry ? { class: "provider_error" } : {},
214146
- ...event.payload !== void 0 ? { detail: event.payload } : {}
214172
+ ...detail
214147
214173
  }
214148
214174
  }];
214149
214175
  }
@@ -291440,7 +291466,10 @@ function runtimeStatusEventToActivities(event) {
291440
291466
  tone: "error",
291441
291467
  kind: "runtime.error",
291442
291468
  summary: "Runtime error",
291443
- payload: { message: truncateDetail(event.payload.message) }
291469
+ payload: {
291470
+ message: truncateDetail(event.payload.message),
291471
+ ...event.payload.class !== void 0 ? { class: event.payload.class } : {}
291472
+ }
291444
291473
  }];
291445
291474
  case "codeweb.workspace.required": return [{
291446
291475
  ...activityBase(event),
@@ -292847,6 +292876,31 @@ const make$8 = require_Schema$1.fn("make")(function* () {
292847
292876
  },
292848
292877
  createdAt: event.createdAt
292849
292878
  });
292879
+ if (activeTurnId !== null && eventTurnId !== void 0 && sameId$1(activeTurnId, eventTurnId)) {
292880
+ const activityId = turnTerminalStatusActivityId(eventTurnId);
292881
+ if (!thread.activities.some((a) => a.id === activityId)) {
292882
+ const recordedAt = (/* @__PURE__ */ new Date()).toISOString();
292883
+ yield* orchestrationEngine.dispatch({
292884
+ type: "thread.activity.append",
292885
+ commandId: providerCommandId(event, "mid-turn-terminal-status"),
292886
+ threadId: thread.id,
292887
+ activity: {
292888
+ id: EventId.make(activityId),
292889
+ tone: "error",
292890
+ kind: TURN_TERMINAL_STATUS_ACTIVITY_KIND,
292891
+ summary: "Turn failed",
292892
+ payload: {
292893
+ outcome: "failed",
292894
+ errorMessage: publicProviderRuntimeError(event.payload.message) ?? "CMMD is temporarily unavailable. Check the workspace AI connection and retry.",
292895
+ ...event.payload.class ? { errorClass: event.payload.class } : {}
292896
+ },
292897
+ turnId: eventTurnId,
292898
+ createdAt: recordedAt
292899
+ },
292900
+ createdAt: recordedAt
292901
+ });
292902
+ }
292903
+ }
292850
292904
  });
292851
292905
  const handleThreadMetadata = require_Schema$1.fn("handleThreadMetadata")(function* (event, thread) {
292852
292906
  if (event.type !== "thread.metadata.updated" || !event.payload.name) return;
@@ -300341,7 +300395,7 @@ function resolveBuildCommitFromEnv(env) {
300341
300395
  * environment descriptor down instead of reporting an honest "unknown".
300342
300396
  */
300343
300397
  function readBakedBuildCommit() {
300344
- return "86c84862638cd8f1fdc9df2af99a0a93b2aed2ec";
300398
+ return "6949376c2af354b33e35fda8938351fb26be2b69";
300345
300399
  }
300346
300400
  async function resolveServerBuildCommit(input) {
300347
300401
  if (isFullCommitSha(input.baked)) return input.baked;
package/dist/bin.mjs CHANGED
@@ -21110,6 +21110,7 @@ const RuntimeErrorClass = Literals([
21110
21110
  "transport_error",
21111
21111
  "permission_error",
21112
21112
  "validation_error",
21113
+ "usage_limit",
21113
21114
  "unknown"
21114
21115
  ]);
21115
21116
  const TOOL_LIFECYCLE_ITEM_TYPES = [
@@ -66044,7 +66045,7 @@ function normalizeNumberish(value) {
66044
66045
  }
66045
66046
  //#endregion
66046
66047
  //#region package.json
66047
- var version$1 = "0.13.109";
66048
+ var version$1 = "0.13.111";
66048
66049
  //#endregion
66049
66050
  //#region src/sentry.ts
66050
66051
  const SERVER_APP_NAME = "forge-server";
@@ -98180,11 +98181,12 @@ function classifyProviderTurnStartFailureReason(detail) {
98180
98181
  * follow-up issue) that would stop Codex from retrying against that wall in
98181
98182
  * the first place.
98182
98183
  */
98183
- function classifyMidTurnFailureReason(detail) {
98184
+ function classifyMidTurnFailureReason(detail, errorClass) {
98184
98185
  const message = detail && detail.trim().length > 0 ? detail : "The runtime reported an error while this run was in progress.";
98185
- const classified = classifyRetryableProviderFailure(detail);
98186
+ const classifiedFailure = classifyRetryableProviderFailure(detail);
98187
+ const classifiedTerminal = classifiedFailure?.kind === "terminal" && classifiedFailure.reason === "quota";
98186
98188
  return {
98187
- code: classified?.kind === "terminal" && classified.reason === "quota" ? "provider_usage_limit" : "provider_turn_failed",
98189
+ code: errorClass === "usage_limit" || classifiedTerminal ? "provider_usage_limit" : "provider_turn_failed",
98188
98190
  message
98189
98191
  };
98190
98192
  }
@@ -98388,6 +98390,11 @@ function errorMessageOf(payload) {
98388
98390
  const message = payload.errorMessage;
98389
98391
  return typeof message === "string" && message.trim().length > 0 ? message : null;
98390
98392
  }
98393
+ function errorClassOf(payload) {
98394
+ if (!payload || typeof payload !== "object") return null;
98395
+ const cls = payload.errorClass;
98396
+ return typeof cls === "string" && cls.trim().length > 0 ? cls : null;
98397
+ }
98391
98398
  /**
98392
98399
  * Turns the one durable activity `Layers/CheckpointReactor.ts` records when a
98393
98400
  * turn ends into CMMD's `turn_status` terminal event (CMMD-Center/forge#3562
@@ -98407,7 +98414,7 @@ function serializeTurnTerminalStatusActivity(activity) {
98407
98414
  if (activity.kind !== "turn.terminal-status" || !activity.turnId) return null;
98408
98415
  const outcome = outcomeOf(activity.payload);
98409
98416
  if (outcome === null) return null;
98410
- const reason = outcome === "failed" ? classifyMidTurnFailureReason(errorMessageOf(activity.payload)) : null;
98417
+ const reason = outcome === "failed" ? classifyMidTurnFailureReason(errorMessageOf(activity.payload), errorClassOf(activity.payload)) : null;
98411
98418
  return {
98412
98419
  sourceSequence: null,
98413
98420
  event: {
@@ -213712,13 +213719,32 @@ const codexRealtimeMethodMappers = {
213712
213719
  function mapCodexRuntimeErrorEvent(event, canonicalThreadId, payload) {
213713
213720
  const message = asString$2(asObject$2(payload?.error)?.message) ?? event.message ?? "Provider runtime error";
213714
213721
  const willRetry = payload?.willRetry === true;
213722
+ const detail = event.payload !== void 0 ? { detail: event.payload } : {};
213723
+ if (asString$2(asObject$2(payload?.error)?.codexErrorInfo) === "usageLimitExceeded") return [{
213724
+ type: "runtime.error",
213725
+ ...runtimeEventBase(event, canonicalThreadId),
213726
+ payload: {
213727
+ message,
213728
+ class: "usage_limit",
213729
+ ...detail
213730
+ }
213731
+ }];
213732
+ if (classifyRetryableProviderFailure(message)?.kind === "terminal") return [{
213733
+ type: "runtime.error",
213734
+ ...runtimeEventBase(event, canonicalThreadId),
213735
+ payload: {
213736
+ message,
213737
+ class: "usage_limit",
213738
+ ...detail
213739
+ }
213740
+ }];
213715
213741
  return [{
213716
213742
  type: willRetry ? "runtime.warning" : "runtime.error",
213717
213743
  ...runtimeEventBase(event, canonicalThreadId),
213718
213744
  payload: {
213719
213745
  message,
213720
213746
  ...!willRetry ? { class: "provider_error" } : {},
213721
- ...event.payload !== void 0 ? { detail: event.payload } : {}
213747
+ ...detail
213722
213748
  }
213723
213749
  }];
213724
213750
  }
@@ -290924,7 +290950,10 @@ function runtimeStatusEventToActivities(event) {
290924
290950
  tone: "error",
290925
290951
  kind: "runtime.error",
290926
290952
  summary: "Runtime error",
290927
- payload: { message: truncateDetail(event.payload.message) }
290953
+ payload: {
290954
+ message: truncateDetail(event.payload.message),
290955
+ ...event.payload.class !== void 0 ? { class: event.payload.class } : {}
290956
+ }
290928
290957
  }];
290929
290958
  case "codeweb.workspace.required": return [{
290930
290959
  ...activityBase(event),
@@ -292330,6 +292359,31 @@ const ProviderRuntimeIngestionLive = effect(ProviderRuntimeIngestionService, fn$
292330
292359
  },
292331
292360
  createdAt: event.createdAt
292332
292361
  });
292362
+ if (activeTurnId !== null && eventTurnId !== void 0 && sameId$1(activeTurnId, eventTurnId)) {
292363
+ const activityId = turnTerminalStatusActivityId(eventTurnId);
292364
+ if (!thread.activities.some((a) => a.id === activityId)) {
292365
+ const recordedAt = (/* @__PURE__ */ new Date()).toISOString();
292366
+ yield* orchestrationEngine.dispatch({
292367
+ type: "thread.activity.append",
292368
+ commandId: providerCommandId(event, "mid-turn-terminal-status"),
292369
+ threadId: thread.id,
292370
+ activity: {
292371
+ id: EventId.make(activityId),
292372
+ tone: "error",
292373
+ kind: TURN_TERMINAL_STATUS_ACTIVITY_KIND,
292374
+ summary: "Turn failed",
292375
+ payload: {
292376
+ outcome: "failed",
292377
+ errorMessage: publicProviderRuntimeError(event.payload.message) ?? "CMMD is temporarily unavailable. Check the workspace AI connection and retry.",
292378
+ ...event.payload.class ? { errorClass: event.payload.class } : {}
292379
+ },
292380
+ turnId: eventTurnId,
292381
+ createdAt: recordedAt
292382
+ },
292383
+ createdAt: recordedAt
292384
+ });
292385
+ }
292386
+ }
292333
292387
  });
292334
292388
  const handleThreadMetadata = fn$1("handleThreadMetadata")(function* (event, thread) {
292335
292389
  if (event.type !== "thread.metadata.updated" || !event.payload.name) return;
@@ -299788,7 +299842,7 @@ function resolveBuildCommitFromEnv(env) {
299788
299842
  * environment descriptor down instead of reporting an honest "unknown".
299789
299843
  */
299790
299844
  function readBakedBuildCommit() {
299791
- return "86c84862638cd8f1fdc9df2af99a0a93b2aed2ec";
299845
+ return "6949376c2af354b33e35fda8938351fb26be2b69";
299792
299846
  }
299793
299847
  async function resolveServerBuildCommit(input) {
299794
299848
  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{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-BLN6-1Lv.js";import{on as p,sn as m}from"./CompositeItem-DYaCFJOM.js";import{t as h}from"./preload-helper-Czpn1I53.js";import{_ as g,a as _,b as v,c as y,d as b,f as x,g as S,h as C,i as w,l as T,m as E,n as D,o as O,p as k,r as A,s as j,t as M,u as N,v as P,y as F}from"./canvasStateStore-CGGNH2My.js";import{t as I}from"./toggle-D5P2us-a.js";var ee=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`}]]),L=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`}]]),R=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`}]]),z=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`}]]),ne=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`}]]),re=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`}]]),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,U=()=>je||={document,window,isTouchSupported:`ontouchstart`in window||`ontouchstart`in document||window&&window.navigator&&window.navigator.maxTouchPoints>0,WebGLProbe:new ke,dispose(){},copyPasteData:Ae},Me=()=>U().document,Ne=()=>U().window,Pe=()=>Math.max(H.devicePixelRatio??Ne().devicePixelRatio,1),Fe=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)]}},Ie=`7.4.0`;function Le(){}var Re=Math.PI/2,ze=Math.PI/4,Be=2*Math.PI,Ve=Math.PI/180,He=Object.freeze([1,0,0,1,0,0]),W=`center`,G=`left`,Ue=`bottom`,We=`right`,Ge=`none`,Ke=/\r?\n/,qe=`moving`,Je=`scaling`,Ye=`rotating`,Xe=`rotate`,Ze=`skewing`,Qe=`resizing`,$e=`modifyPoly`,et=`changed`,tt=`scale`,nt=`scaleX`,rt=`scaleY`,it=`skewX`,at=`skewY`,ot=`fill`,st=`stroke`,ct=`modified`,lt=`normal`,ut=`json`,K=new class{constructor(){this[ut]=new Map,this.svg=new Map}has(e){return this[ut].has(e)}getClass(e){let t=this[ut].get(e);if(!t)throw new Ee(`No class registered for ${e}`);return t}setClass(e,t){t?this[ut].set(t,e):(this[ut].set(e.type,e),this[ut].set(e.type.toLowerCase(),e))}getSVGClass(e){return this.svg.get(e)}setSVGClass(e,t){this.svg.set(t??e.type.toLowerCase(),e)}},dt=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}},ft=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||{})}},pt=(e,t)=>{let n=e.indexOf(t);return n!==-1&&e.splice(n,1),e},mt=e=>{if(e===0)return 1;switch(Math.abs(e)/Re){case 1:case 3:return 0;case 2:return-1}return Math.cos(e)},ht=e=>{if(e===0)return 0;let t=e/Re,n=Math.sign(e);switch(t){case 1:return n;case 2:return 0;case 3:return-n}return Math.sin(e)},q=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=gt){let r=ht(t),i=mt(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]))}},gt=new q(0,0),_t=e=>!!e&&Array.isArray(e._objects);function vt(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])&&(pt(this._objects,e),this._objects.unshift(e),this._onStackOrderChanged(e),!0)}bringObjectToFront(e){return!(!e||e===this._objects[this._objects.length-1])&&(pt(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 pt(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 pt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}moveObjectTo(e,t){return e!==this._objects[t]&&(pt(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 q(e,t),s=o.add(new q(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 yt=class extends ft{_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 bt(e){return Ne().requestAnimationFrame(e)}function xt(e){return Ne().cancelAnimationFrame(e)}var St=0,Ct=()=>St++,wt=()=>{let e=Me().createElement(`canvas`);if(!e||e.getContext===void 0)throw new Ee("Failed to create `canvas` element");return e},Tt=()=>Me().createElement(`img`),Et=e=>{var t;let n=Dt(e);return(t=n.getContext(`2d`))==null||t.drawImage(e,0,0),n},Dt=e=>{let t=wt();return t.width=e.width,t.height=e.height,t},Ot=(e,t,n)=>e.toDataURL(`image/${t}`,n),kt=(e,t,n)=>new Promise((r,i)=>{e.toBlob(r,`image/${t}`,n)}),J=e=>e*Ve,At=e=>e/Ve,jt=e=>e.every((e,t)=>e===He[t]),Mt=(e,t,n)=>new q(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 q(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)||He.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:At(t),scaleX:r,scaleY:i,skewX:At(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=J(e),i=mt(r),a=ht(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(J(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 jt(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=Tt(),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=Le}={})=>new Promise((r,i)=>{let a=[];t&&t.addEventListener(`abort`,i,{once:!0}),Promise.allSettled(e.map(e=>K.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&&K.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=Ge,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&&Me().getElementById(e)||wt();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(){U().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:[...He],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,`&amp;`).replace(/"/g,`&quot;`).replace(/'/g,`&apos;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`),mn,hn=e=>{if(mn||mn||(mn=`Intl`in Ne()&&`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 vt(yt){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-kIpfozNc.js";import{on as p,sn as m}from"./CompositeItem-CYjaZm9j.js";import{t as h}from"./preload-helper-Czpn1I53.js";import{_ as g,a as _,b as v,c as y,d as b,f as x,g as S,h as C,i as w,l as T,m as E,n as D,o as O,p as k,r as A,s as j,t as M,u as N,v as P,y as F}from"./canvasStateStore-BejjlUiS.js";import{t as I}from"./toggle-BNOwunZr.js";var ee=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`}]]),L=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`}]]),R=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`}]]),z=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`}]]),ne=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`}]]),re=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`}]]),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,U=()=>je||={document,window,isTouchSupported:`ontouchstart`in window||`ontouchstart`in document||window&&window.navigator&&window.navigator.maxTouchPoints>0,WebGLProbe:new ke,dispose(){},copyPasteData:Ae},Me=()=>U().document,Ne=()=>U().window,Pe=()=>Math.max(H.devicePixelRatio??Ne().devicePixelRatio,1),Fe=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)]}},Ie=`7.4.0`;function Le(){}var Re=Math.PI/2,ze=Math.PI/4,Be=2*Math.PI,Ve=Math.PI/180,He=Object.freeze([1,0,0,1,0,0]),W=`center`,G=`left`,Ue=`bottom`,We=`right`,Ge=`none`,Ke=/\r?\n/,qe=`moving`,Je=`scaling`,Ye=`rotating`,Xe=`rotate`,Ze=`skewing`,Qe=`resizing`,$e=`modifyPoly`,et=`changed`,tt=`scale`,nt=`scaleX`,rt=`scaleY`,it=`skewX`,at=`skewY`,ot=`fill`,st=`stroke`,ct=`modified`,lt=`normal`,ut=`json`,K=new class{constructor(){this[ut]=new Map,this.svg=new Map}has(e){return this[ut].has(e)}getClass(e){let t=this[ut].get(e);if(!t)throw new Ee(`No class registered for ${e}`);return t}setClass(e,t){t?this[ut].set(t,e):(this[ut].set(e.type,e),this[ut].set(e.type.toLowerCase(),e))}getSVGClass(e){return this.svg.get(e)}setSVGClass(e,t){this.svg.set(t??e.type.toLowerCase(),e)}},dt=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}},ft=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||{})}},pt=(e,t)=>{let n=e.indexOf(t);return n!==-1&&e.splice(n,1),e},mt=e=>{if(e===0)return 1;switch(Math.abs(e)/Re){case 1:case 3:return 0;case 2:return-1}return Math.cos(e)},ht=e=>{if(e===0)return 0;let t=e/Re,n=Math.sign(e);switch(t){case 1:return n;case 2:return 0;case 3:return-n}return Math.sin(e)},q=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=gt){let r=ht(t),i=mt(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]))}},gt=new q(0,0),_t=e=>!!e&&Array.isArray(e._objects);function vt(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])&&(pt(this._objects,e),this._objects.unshift(e),this._onStackOrderChanged(e),!0)}bringObjectToFront(e){return!(!e||e===this._objects[this._objects.length-1])&&(pt(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 pt(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 pt(this._objects,e),this._objects.splice(r,0,e),this._onStackOrderChanged(e),!0}return!1}moveObjectTo(e,t){return e!==this._objects[t]&&(pt(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 q(e,t),s=o.add(new q(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 yt=class extends ft{_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 bt(e){return Ne().requestAnimationFrame(e)}function xt(e){return Ne().cancelAnimationFrame(e)}var St=0,Ct=()=>St++,wt=()=>{let e=Me().createElement(`canvas`);if(!e||e.getContext===void 0)throw new Ee("Failed to create `canvas` element");return e},Tt=()=>Me().createElement(`img`),Et=e=>{var t;let n=Dt(e);return(t=n.getContext(`2d`))==null||t.drawImage(e,0,0),n},Dt=e=>{let t=wt();return t.width=e.width,t.height=e.height,t},Ot=(e,t,n)=>e.toDataURL(`image/${t}`,n),kt=(e,t,n)=>new Promise((r,i)=>{e.toBlob(r,`image/${t}`,n)}),J=e=>e*Ve,At=e=>e/Ve,jt=e=>e.every((e,t)=>e===He[t]),Mt=(e,t,n)=>new q(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 q(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)||He.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:At(t),scaleX:r,scaleY:i,skewX:At(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=J(e),i=mt(r),a=ht(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(J(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 jt(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=Tt(),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=Le}={})=>new Promise((r,i)=>{let a=[];t&&t.addEventListener(`abort`,i,{once:!0}),Promise.allSettled(e.map(e=>K.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&&K.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=Ge,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&&Me().getElementById(e)||wt();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(){U().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:[...He],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,`&amp;`).replace(/"/g,`&quot;`).replace(/'/g,`&apos;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`),mn,hn=e=>{if(mn||mn||(mn=`Intl`in Ne()&&`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 vt(yt){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?Pe():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=Mt(e,Nt(r));r[0]=t,r[3]=t;let a=Mt(i,r);r[4]+=n.x-a.x,r[5]+=n.y-a.y,this.setViewportTransform(r)}setZoom(e){this.zoomToPoint(new q(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 q(-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=bt(()=>this.renderAndReset()))}calcViewportBoundaries(){let e=this.width,t=this.height,n=Nt(this.viewportTransform),r=Mt({x:0,y:0},n),i=Mt({x:e,y:t},n),a=r.min(i),o=r.max(i);return this.vptCoords={tl:a,tr:new q(o.x,a.y),bl:new q(a.x,o.y),br:o}}cancelRequestedRender(){this.nextRenderHandle&&=(xt(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 q(this.width/2,this.height/2)}centerObjectH(e){return this._centerObject(e,new q(this.getCenterPoint().x,e.getCenterPoint().y))}centerObjectV(e){return this._centerObject(e,new q(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 q(this.getVpCenter().x,e.getCenterPoint().y))}viewportCenterObjectV(e){return this._centerObject(e,new q(e.getCenterPoint().x,this.getVpCenter().y))}getVpCenter(){return Mt(this.getCenterPoint(),Nt(this.viewportTransform))}_centerObject(e,t){e.setXY(t,W,W),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:Ie,...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">
@@ -438,4 +438,4 @@ void main() {
438
438
  gl_FragColor = color;
439
439
  }
440
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`]),K.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:j,label:`Rectangle`},{id:`circle`,icon:S,label:`Circle`},{id:`line`,icon:b,label:`Line`},{id:`polygon`,icon:R,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??j,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,D;t[6]!==n||t[7]!==r?(E=T.map(e=>(0,$.jsxs)(s,{children:[(0,$.jsx)(c,{render:(0,$.jsx)(I,{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)),D=(0,$.jsx)(gl,{activeTool:n,onToolChange:r}),t[6]=n,t[7]=r,t[8]=E,t[9]=D):(E=t[8],D=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)(I,{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`,F;t[16]===r?F=t[17]:(F=()=>r(`draw`),t[16]=r,t[17]=F);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]!==F?(L=(0,$.jsx)(c,{render:(0,$.jsx)(I,{pressed:P,onPressedChange:F,"aria-label":`Draw`,size:`xs`,variant:`default`,children:ee})}),t[19]=P,t[20]=F,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 ne;t[25]===Symbol.for(`react.memo_cache_sentinel`)?(ne=(0,$.jsx)(`div`,{className:`mx-1 h-4 w-px bg-border`}),t[25]=ne):ne=t[25];let se=!i,ce;t[26]===Symbol.for(`react.memo_cache_sentinel`)?(ce=(0,$.jsx)(O,{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)(re,{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 U;t[63]===S?U=t[64]:(U=(0,$.jsx)(`input`,{ref:v,type:`file`,accept:`image/*`,className:`hidden`,onChange:S}),t[63]=S,t[64]=U);let Me;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]!==U||t[74]!==E||t[75]!==D?(Me=(0,$.jsxs)(`div`,{className:`flex items-center gap-1 border-t border-border bg-card px-2 py-1.5`,children:[E,D,N,z,ne,pe,ve,ye,Ce,we,De,je,U]}),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]=U,t[74]=E,t[75]=D,t[76]=Me):Me=t[76],Me});function vl(e){switch(e){case`textbox`:case`i-text`:return o;case`rect`:return j;case`circle`:case`ellipse`:return S;case`image`:return z;case`path`:return ae;default:return j}}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)(k,{className:`size-2.5`}):(0,$.jsx)(E,{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`,y;t[2]===Symbol.for(`react.memo_cache_sentinel`)?(y=(0,$.jsx)(`span`,{className:`text-xs font-semibold text-foreground`,children:`Properties`}),t[2]=y):y=t[2];let b;t[3]===Symbol.for(`react.memo_cache_sentinel`)?(b=(0,$.jsx)(a,{className:`size-3`}),t[3]=b):b=t[3];let x;t[4]===o?x=t[5]:(x=(0,$.jsxs)(`div`,{className:`flex items-center justify-between border-b border-border px-3 py-2`,children:[y,(0,$.jsx)(`button`,{onClick:o,className:`inline-flex size-5 items-center justify-center rounded text-muted-foreground hover:text-foreground`,children:b})]}),t[4]=o,t[5]=x);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)(g,{className:`size-3`}),label:`Bring to front`,onClick:f}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(F,{className:`size-3`}),label:`Move up`,onClick:u}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(v,{className:`size-3`}),label:`Move down`,onClick:d}),(0,$.jsx)(Cl,{icon:(0,$.jsx)(P,{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]!==x||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:[x,E]}),t[26]=x,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 R;t[48]===S?R=t[49]:(R=(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]=R);let te;t[50]!==F||t[51]!==L||t[52]!==R?(te=(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,R]})]}),t[50]=F,t[51]=L,t[52]=R,t[53]=te):te=t[53];let z;t[54]!==b||t[55]!==M||t[56]!==te||t[57]!==T||t[58]!==E||t[59]!==D?(z=(0,$.jsxs)(b,{side:T,align:E,className:D,children:[M,te]}),t[54]=b,t[55]=M,t[56]=te,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)},v=()=>{let t=e.current?.toJSON();t&&(i(`design-${Date.now()}`,`Design ${new Date().toLocaleString()}`,t),c(!1))},b=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)(C,{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:()=>b(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)(z,{className:`size-3.5`}),label:`PNG (1x)`,onClick:()=>m(1)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(z,{className:`size-3.5`}),label:`PNG (2x)`,onClick:()=>m(2)}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(ee,{className:`size-3.5`}),label:`SVG`,onClick:g}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(x,{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)(y,{className:`size-3.5`}),label:`Save Design`,onClick:v}),(0,$.jsx)(Dl,{icon:(0,$.jsx)(L,{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=w(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 C;t[16]===Symbol.for(`react.memo_cache_sentinel`)?(C=(0,$.jsx)(`span`,{className:`text-[10px] text-muted-foreground`,children:`Press Enter to generate`}),t[16]=C):C=t[16];let T=!u.trim(),E;t[17]!==h||t[18]!==T?(E=(0,$.jsxs)(`div`,{className:`flex items-center justify-between`,children:[C,(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,C,T;if(t[0]!==c||t[1]!==r||t[2]!==n||t[3]!==i||t[4]!==a||t[5]!==o){let e=_(),E=[...e.keys()],O=c?e.get(c)??[]:D,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=w(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,C=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)(ne,{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]!==E?(P=E.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]=E,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]=C,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],C=t[15],T=t[16];let E;t[34]!==h||t[35]!==g?(E=(0,$.jsx)(`div`,{className:h,children:g}),t[34]=h,t[35]=g,t[36]=E):E=t[36];let O;t[37]!==p||t[38]!==E||t[39]!==v||t[40]!==y||t[41]!==b||t[42]!==x?(O=(0,$.jsxs)(p,{side:v,align:y,className:b,children:[x,E]}),t[37]=p,t[38]=E,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]!==C||t[48]!==T?(k=(0,$.jsxs)(m,{open:S,onOpenChange:C,children:[T,O]}),t[44]=m,t[45]=O,t[46]=S,t[47]=C,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)(T,{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 w;t[27]===c?w=t[28]:(w=e=>c(`textColor`,e),t[27]=c,t[28]=w);let E;t[29]!==n.textColor||t[30]!==w?(E=(0,$.jsx)(jl,{label:`Text`,value:n.textColor,onChange:w}),t[29]=n.textColor,t[30]=w,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 R;t[53]!==N||t[54]!==L?(R=(0,$.jsxs)(`div`,{className:`mt-3 space-y-2`,children:[O,N,L]}),t[53]=N,t[54]=L,t[55]=R):R=t[55];let te;t[56]!==n.accentColor||t[57]!==n.backgroundColor||t[58]!==n.primaryColor||t[59]!==n.secondaryColor||t[60]!==n.textColor?(te=(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]=te):te=t[61];let z;t[62]!==D||t[63]!==R||t[64]!==te||t[65]!==m?(z=(0,$.jsxs)(d,{side:`bottom`,align:`end`,className:`w-64 p-3`,children:[m,D,R,te]}),t[62]=D,t[63]=R,t[64]=te,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&&M.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:C,undo:T,redo:E,resetHistory:D,saveDesign:O,deleteDesign:k,updateBrandKit:j,setBrandKit:P}=M();(0,B.useEffect)(()=>{let e=setTimeout(()=>{let e=t.current?.toJSON();e&&M.getState().pushHistorySnapshot(e)},100);return()=>clearTimeout(e)},[]),(0,B.useEffect)(()=>{let e=M.subscribe((e,n)=>{if(e.pendingGeneratePrompt&&e.pendingGeneratePrompt!==n.pendingGeneratePrompt){let e=M.getState().consumePendingGenerate();if(e&&t.current){let n=w(e,o,s,g);t.current.applyGeneratedLayout(n.objects)}}}),n=M.getState().consumePendingGenerate();return n&&t.current&&requestAnimationFrame(()=>{let e=w(n,o,s,g);t.current?.applyGeneratedLayout(e.objects)}),e},[o,s,g]);let F=(0,B.useCallback)(()=>{n.current.maybeExecute()},[]),I=(0,B.useCallback)(e=>{_(e)},[_]),ee=(0,B.useCallback)(e=>{v(e.id,e.width,e.height),D()},[v,D]),L=(0,B.useCallback)((e,t)=>{v(null,e,t),D()},[v,D]),R=(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]),z=(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),C(n),e.requestRenderAll()},[p,C]),ne=(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),C(n),e.requestRenderAll()},[p,C]),re=(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(),F();let a=M.getState().selectedObjectProperties;if(a){let t={...a,[e===`scaleWidth`?`width`:e===`scaleHeight`?`height`:e]:n};y([a.id],t)}},[F,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(),F())},[F]),ce=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.sendObjectBackwards(n),e.requestRenderAll(),F())},[F]),le=(0,B.useCallback)(()=>{let e=t.current?.getCanvas();if(!e)return;let n=e.getActiveObject();n&&(e.bringObjectToFront(n),e.requestRenderAll(),F())},[F]),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(),F()}},[F]),de=(0,B.useCallback)(async e=>{await t.current?.loadJSON(e),D();let n=t.current?.toJSON();n&&M.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():R()),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(),F())}}};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[_,R,te,b,F]);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:F}),(0,$.jsx)(Al,{canvasRef:t,brandKit:g,onCanvasModified:F,onSelectPreset:ee}),(0,$.jsx)(Nl,{brandKit:g,onUpdate:j,onReset:()=>P(A)}),(0,$.jsx)(`div`,{className:`flex-1`}),(0,$.jsx)(wl,{artboardPresetId:i,artboardWidth:o,artboardHeight:s,onSelectPreset:ee,onCustomSize:L}),(0,$.jsx)(Tl,{canvasRef:t,artboardWidth:o,artboardHeight:s,savedDesigns:h,onSaveDesign:fe,onLoadDesign:e=>void de(e),onDeleteDesign:k}),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)(N,{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:F,onLayersChange:S,onZoomChange:C}),(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:I,canUndo:pe,canRedo:me,onUndo:R,onRedo:te,zoomLevel:p,onZoomIn:z,onZoomOut:ne,onFitToView:re,canvasRef:t,onCanvasModified:F})]})});export{Ll as CanvasPanel,Ll as default};
441
- //# sourceMappingURL=CanvasPanel-i6_Wn-y3.js.map
441
+ //# sourceMappingURL=CanvasPanel-Cg4D-ISF.js.map