@cmmd-center/forge 0.13.109 → 0.13.110
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin.cjs +62 -8
- package/dist/bin.mjs +62 -8
- package/dist/client/assets/{CanvasPanel-i6_Wn-y3.js → CanvasPanel-Cg4D-ISF.js} +2 -2
- package/dist/client/assets/{CompositeItem-DYaCFJOM.js → CompositeItem-CYjaZm9j.js} +2 -2
- package/dist/client/assets/{DiffPanel-DOmQ7vr_.js → DiffPanel-DA0QAING.js} +2 -2
- package/dist/client/assets/{DiffPanel.logic-BfdSU3ho.js → DiffPanel.logic-Cg5xBiSE.js} +2 -2
- package/dist/client/assets/{DiffWorkerPoolProvider-CbVy3tZS.js → DiffWorkerPoolProvider-BJSpQ5VY.js} +2 -2
- package/dist/client/assets/{PullRequestCodePanel-BMLZYrRg.js → PullRequestCodePanel-C8WlU2iQ.js} +2 -2
- package/dist/client/assets/{Virtualizer-0mLnEFZs.js → Virtualizer-V8jZ5w_U.js} +2 -2
- package/dist/client/assets/{WorkerPoolContext-BU4SzNWC.js → WorkerPoolContext-CLHqIrE4.js} +3 -3
- package/dist/client/assets/{canvasStateStore-CGGNH2My.js → canvasStateStore-BejjlUiS.js} +2 -2
- package/dist/client/assets/{cmmdAuthRedirect-D9b4x37X.js → cmmdAuthRedirect-PUmt8-ZY.js} +2 -2
- package/dist/client/assets/{index-B_thTU_W.js → index-yDeHcRkt.js} +6 -6
- package/dist/client/assets/{popover-BLN6-1Lv.js → popover-kIpfozNc.js} +2 -2
- package/dist/client/assets/{src-CP7pFzq9.js → src-D27YeBpH.js} +2 -2
- package/dist/client/assets/{toggle-D5P2us-a.js → toggle-BNOwunZr.js} +2 -2
- package/dist/client/index.html +10 -10
- package/dist/forge-build.json +1 -1
- package/package.json +1 -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.
|
|
66339
|
+
var version$1 = "0.13.110";
|
|
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
|
|
98576
|
+
const classifiedFailure = classifyRetryableProviderFailure(detail);
|
|
98577
|
+
const classifiedTerminal = classifiedFailure?.kind === "terminal" && classifiedFailure.reason === "quota";
|
|
98576
98578
|
return {
|
|
98577
|
-
code:
|
|
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
|
-
...
|
|
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: {
|
|
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 "
|
|
300398
|
+
return "037bb9952083dd6c284e0ed8ab8af478c1756914";
|
|
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.
|
|
66048
|
+
var version$1 = "0.13.110";
|
|
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
|
|
98186
|
+
const classifiedFailure = classifyRetryableProviderFailure(detail);
|
|
98187
|
+
const classifiedTerminal = classifiedFailure?.kind === "terminal" && classifiedFailure.reason === "quota";
|
|
98186
98188
|
return {
|
|
98187
|
-
code:
|
|
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
|
-
...
|
|
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: {
|
|
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 "
|
|
299845
|
+
return "037bb9952083dd6c284e0ed8ab8af478c1756914";
|
|
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,`&`).replace(/"/g,`"`).replace(/'/g,`'`).replace(/</g,`<`).replace(/>/g,`>`),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,`&`).replace(/"/g,`"`).replace(/'/g,`'`).replace(/</g,`<`).replace(/>/g,`>`),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-
|
|
441
|
+
//# sourceMappingURL=CanvasPanel-Cg4D-ISF.js.map
|