@pixerate/editor-svelte 0.14.0 → 0.15.1
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/{chunk-REI5FZ7F.js → chunk-HEOI4UNF.js} +290 -65
- package/dist/chunk-HEOI4UNF.js.map +1 -0
- package/dist/image-editor/index.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +3 -3
- package/src/image-editor/ImageEditor.svelte +228 -2
- package/src/image-editor/imageEditorState.svelte.ts +12 -0
- package/dist/chunk-REI5FZ7F.js.map +0 -1
|
@@ -127,6 +127,18 @@ function createReactiveImageEditor(options = {}) {
|
|
|
127
127
|
},
|
|
128
128
|
loadJSON(data) {
|
|
129
129
|
controller.loadJSON(data);
|
|
130
|
+
},
|
|
131
|
+
renderMask(opts) {
|
|
132
|
+
return controller.renderMask(opts);
|
|
133
|
+
},
|
|
134
|
+
toMaskDataURL(opts) {
|
|
135
|
+
return controller.toMaskDataURL(opts);
|
|
136
|
+
},
|
|
137
|
+
applyInpaintedImage(newDataUrl) {
|
|
138
|
+
return controller.applyInpaintedImage(newDataUrl);
|
|
139
|
+
},
|
|
140
|
+
applyBackgroundRemovedImage(newDataUrl) {
|
|
141
|
+
return controller.applyBackgroundRemovedImage(newDataUrl);
|
|
130
142
|
}
|
|
131
143
|
};
|
|
132
144
|
}
|
|
@@ -140,7 +152,16 @@ var root_4 = $2.from_html(`<button type="button" class="text-slate-400 hover:tex
|
|
|
140
152
|
var root_5 = $2.from_html(`<div class="flex flex-col gap-3 text-xs"><span class="font-semibold text-slate-200 uppercase tracking-wider text-[11px]">Draw & Annotate</span> <div class="grid grid-cols-3 gap-1.5"></div> <div class="flex items-center gap-2 mt-2"><span class="text-slate-400">Color:</span> <input type="color" class="w-8 h-8 rounded border border-slate-700 cursor-pointer bg-transparent"/> <div class="flex-1 ml-2"><div class="flex justify-between text-slate-400 mb-0.5"><span>Width:</span> <span class="font-mono"> </span></div> <input type="range" min="1" max="20" class="w-full accent-indigo-500"/></div></div> <div class="h-px bg-slate-800 my-1"></div> <span class="font-semibold text-slate-200 uppercase tracking-wider text-[11px]">Add Text</span> <div class="flex gap-2"><input type="text" placeholder="Type watermark or label..." class="flex-1 bg-slate-950 border border-slate-700 rounded-lg px-2.5 py-1.5 text-xs text-slate-100 placeholder-slate-500 focus:outline-none focus:border-indigo-500"/> <button type="button" class="px-3 py-1.5 rounded-lg bg-indigo-600 hover:bg-indigo-500 text-white font-medium shadow">Add</button></div> <div class="flex items-center justify-between text-slate-400"><span>Font Size:</span> <span class="font-mono"> </span></div> <input type="range" min="12" max="72" class="w-full accent-indigo-500"/> <div class="h-px bg-slate-800 my-1"></div> <div class="flex items-center justify-between"><span class="text-slate-400"> </span> <!> <!></div></div>`);
|
|
141
153
|
var root_6 = $2.from_html(`<div><span class="text-slate-400 block mb-1">Mask Image URL:</span> <input type="text" placeholder="https://.../depthmap.png" class="w-full bg-slate-950 border border-slate-700 rounded-lg px-2.5 py-1.5 text-xs text-slate-100 placeholder-slate-500"/></div> <div class="flex gap-2"><button type="button">Threshold Mode</button> <button type="button">Brightness Mode</button></div> <div><div class="flex justify-between text-slate-400 mb-1"><span>Depth Start (Lower):</span> <span class="font-mono"> </span></div> <input type="range" min="0" max="255" class="w-full accent-indigo-500"/></div> <div><div class="flex justify-between text-slate-400 mb-1"><span>Depth Stop (Upper):</span> <span class="font-mono"> </span></div> <input type="range" min="0" max="255" class="w-full accent-indigo-500"/></div> <div><div class="flex justify-between text-slate-400 mb-1"><span>Softness:</span> <span class="font-mono"> </span></div> <input type="range" min="1" max="50" class="w-full accent-indigo-500"/></div> <label class="flex items-center gap-2 cursor-pointer text-slate-300 mt-1"><input type="checkbox" class="rounded accent-indigo-500"/> <span>Invert Mask</span></label>`, 1);
|
|
142
154
|
var root_7 = $2.from_html(`<div class="flex flex-col gap-3 text-xs"><div class="flex items-center justify-between"><span class="font-semibold text-slate-200 uppercase tracking-wider text-[11px]">Depth Masking</span> <button type="button" class="text-[10px] text-rose-400 hover:underline">Reset Mask</button></div> <label class="flex items-center gap-2 cursor-pointer text-slate-300"><input type="checkbox" class="rounded accent-indigo-500"/> <span>Enable Depth / Alpha Mask</span></label> <!></div>`);
|
|
143
|
-
var root_8 = $2.from_html(`<
|
|
155
|
+
var root_8 = $2.from_html(`<span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-indigo-900/60 text-indigo-300 animate-pulse">Removing...</span>`);
|
|
156
|
+
var root_9 = $2.from_html(`<div class="w-3.5 h-3.5 border-2 border-white/30 border-t-white rounded-full animate-spin"></div> Removing Background...`, 1);
|
|
157
|
+
var root_10 = $2.from_svg(`<svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"></path></svg> Remove Background`, 1);
|
|
158
|
+
var root_11 = $2.from_html(`<span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-purple-900/60 text-purple-300 animate-pulse">Inpainting...</span>`);
|
|
159
|
+
var root_12 = $2.from_html(`<div class="w-3.5 h-3.5 border-2 border-white/30 border-t-white rounded-full animate-spin"></div> Generating Inpaint...`, 1);
|
|
160
|
+
var root_13 = $2.from_svg(`<svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"></path></svg> Apply Inpainting`, 1);
|
|
161
|
+
var root_14 = $2.from_html(`<div class="p-2.5 rounded-lg bg-rose-950/60 border border-rose-800 text-rose-300 text-[11px]"> </div>`);
|
|
162
|
+
var root_15 = $2.from_html(`<div class="p-2.5 rounded-lg bg-emerald-950/60 border border-emerald-800 text-emerald-300 text-[11px]"> </div>`);
|
|
163
|
+
var root_16 = $2.from_html(`<div class="flex flex-col gap-4 text-xs"><div class="p-3 rounded-lg bg-slate-950/60 border border-slate-800 flex flex-col gap-2.5"><div class="flex items-center justify-between"><span class="font-semibold text-slate-200 uppercase tracking-wider text-[11px] flex items-center gap-1.5"><svg class="w-3.5 h-3.5 text-indigo-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 3v12M18 9a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM6 21a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"></path></svg> Background Removal</span> <!></div> <p class="text-slate-400 text-[11px] leading-relaxed">Isolate foreground subject with AI alpha transparency segmentation.</p> <button type="button" class="mt-1 px-3 py-2 rounded-lg bg-indigo-600 hover:bg-indigo-500 disabled:opacity-50 text-white font-medium shadow transition-colors flex items-center justify-center gap-2"><!></button></div> <div class="p-3 rounded-lg bg-slate-950/60 border border-slate-800 flex flex-col gap-2.5"><div class="flex items-center justify-between"><span class="font-semibold text-slate-200 uppercase tracking-wider text-[11px] flex items-center gap-1.5"><svg class="w-3.5 h-3.5 text-purple-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="m21.64 3.64-1.28-1.28a1.2 1.2 0 0 0-1.7 0l-9.72 9.72-1.94 4.86 4.86-1.94 9.72-9.72a1.2 1.2 0 0 0 .06-1.64z"></path><path d="m14 7 3 3"></path></svg> Generative Inpainting</span> <!></div> <p class="text-slate-400 text-[11px] leading-relaxed">Replace, modify, or fill selected regions using prompt-guided generative inpainting.</p> <div class="flex flex-col gap-1"><label for="ai-inpaint-prompt" class="text-slate-300 text-[11px] font-medium">Prompt</label> <textarea id="ai-inpaint-prompt" placeholder="e.g. replace sunglasses with steampunk goggles, remove person in background..." rows="3" class="w-full bg-slate-900 border border-slate-700 rounded-lg p-2 text-xs text-slate-100 placeholder-slate-500 focus:outline-none focus:border-indigo-500 resize-none"></textarea></div> <div class="flex flex-col gap-1"><span class="text-slate-300 text-[11px] font-medium">Target Mask Region</span> <div class="grid grid-cols-2 gap-1.5"><button type="button"> </button> <button type="button"> </button></div></div> <button type="button" class="mt-1 px-3 py-2 rounded-lg bg-purple-600 hover:bg-purple-500 disabled:opacity-50 text-white font-medium shadow transition-colors flex items-center justify-center gap-2"><!></button></div> <!> <!></div>`);
|
|
164
|
+
var root_17 = $2.from_html(`<div><div class="flex flex-wrap items-center justify-between px-4 py-3 bg-slate-950/80 border-b border-slate-800 gap-3"><div class="flex items-center gap-1 bg-slate-900 p-1 rounded-lg border border-slate-800 text-xs"><button type="button">Transform & Crop</button> <button type="button">Adjustments</button> <button type="button">Annotations</button> <button type="button">Depth Mask</button> <button type="button"><svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"></path></svg> AI Tools</button></div> <div class="flex items-center gap-2 text-xs"><button type="button" class="p-1.5 rounded-lg border border-slate-800 bg-slate-900 text-slate-300 disabled:opacity-40 disabled:cursor-not-allowed hover:bg-slate-800" title="Undo">\u21A9</button> <button type="button" class="p-1.5 rounded-lg border border-slate-800 bg-slate-900 text-slate-300 disabled:opacity-40 disabled:cursor-not-allowed hover:bg-slate-800" title="Redo">\u21AA</button> <button type="button" class="px-2 py-1.5 rounded-lg border border-slate-800 bg-slate-900 text-slate-400 hover:text-slate-200 hover:bg-slate-800">Reset</button> <div class="h-4 w-px bg-slate-800 mx-1"></div> <button type="button" class="p-1.5 rounded-lg border border-slate-800 bg-slate-900 text-slate-300 hover:bg-slate-800" title="Zoom Out">-</button> <span class="font-mono text-slate-400 w-10 text-center"> </span> <button type="button" class="p-1.5 rounded-lg border border-slate-800 bg-slate-900 text-slate-300 hover:bg-slate-800" title="Zoom In">+</button> <div class="h-4 w-px bg-slate-800 mx-1"></div> <button type="button" class="px-2.5 py-1.5 rounded-lg border border-slate-800 bg-slate-900 text-amber-400 hover:bg-slate-800 select-none active:bg-amber-950/40">Hold Compare</button> <button type="button" class="px-4 py-1.5 rounded-lg bg-emerald-600 hover:bg-emerald-500 text-white font-medium shadow-md shadow-emerald-900/30 transition-colors">Export Image</button></div></div> <div class="flex flex-col md:flex-row flex-1 min-h-[520px] md:h-[560px]"><div class="relative flex-1 h-[360px] md:h-full min-h-[320px] bg-slate-950 overflow-hidden select-none"><canvas class="absolute inset-0 w-full h-full block"></canvas></div> <div class="w-full md:w-80 bg-slate-900/90 border-t md:border-t-0 md:border-l border-slate-800 p-4 overflow-y-auto h-auto md:h-full md:max-h-[560px]"><!> <!> <!> <!> <!></div></div></div>`);
|
|
144
165
|
function ImageEditor($$anchor, $$props) {
|
|
145
166
|
$2.push($$props, true);
|
|
146
167
|
let src = $2.prop($$props, "src", 3, ""), className = $2.prop($$props, "class", 3, ""), style = $2.prop($$props, "style", 3, "");
|
|
@@ -150,6 +171,73 @@ function ImageEditor($$anchor, $$props) {
|
|
|
150
171
|
let containerEl = $2.state(null);
|
|
151
172
|
let activeTab = $2.state("crop");
|
|
152
173
|
let activeCropRatio = $2.state(null);
|
|
174
|
+
let inpaintPrompt = $2.state("");
|
|
175
|
+
let inpaintMaskMode = $2.state("annotations");
|
|
176
|
+
let isRemovingBg = $2.state(false);
|
|
177
|
+
let isInpainting = $2.state(false);
|
|
178
|
+
let aiError = $2.state(null);
|
|
179
|
+
let aiSuccess = $2.state(null);
|
|
180
|
+
const effectiveOnInpaint = $2.derived(() => $$props.onInpaint || $$props.aiHooks?.onInpaint);
|
|
181
|
+
const effectiveOnRemoveBg = $2.derived(() => $$props.onRemoveBackground || $$props.aiHooks?.onRemoveBackground);
|
|
182
|
+
async function handleRemoveBackground() {
|
|
183
|
+
if (!$2.get(effectiveOnRemoveBg)) {
|
|
184
|
+
$2.set(aiError, "No background removal hook is configured.");
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
$2.set(aiError, null);
|
|
188
|
+
$2.set(aiSuccess, null);
|
|
189
|
+
$2.set(isRemovingBg, true);
|
|
190
|
+
try {
|
|
191
|
+
const imageDataUrl = await $2.get(editor).toDataURL($$props.exportOptions);
|
|
192
|
+
const result = await $2.get(effectiveOnRemoveBg)({ imageDataUrl });
|
|
193
|
+
if (typeof result === "string") {
|
|
194
|
+
await $2.get(editor).applyBackgroundRemovedImage(result);
|
|
195
|
+
$2.set(aiSuccess, "Background removed successfully!");
|
|
196
|
+
} else {
|
|
197
|
+
$2.set(aiSuccess, "Background removal complete.");
|
|
198
|
+
}
|
|
199
|
+
} catch (err) {
|
|
200
|
+
$2.set(aiError, err?.message || "Failed to remove background.", true);
|
|
201
|
+
} finally {
|
|
202
|
+
$2.set(isRemovingBg, false);
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
async function handleInpaint() {
|
|
206
|
+
if (!$2.get(effectiveOnInpaint)) {
|
|
207
|
+
$2.set(aiError, "No inpainting hook is configured.");
|
|
208
|
+
return;
|
|
209
|
+
}
|
|
210
|
+
if (!$2.get(inpaintPrompt).trim()) {
|
|
211
|
+
$2.set(aiError, "Please enter an inpainting prompt.");
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
214
|
+
$2.set(aiError, null);
|
|
215
|
+
$2.set(aiSuccess, null);
|
|
216
|
+
$2.set(isInpainting, true);
|
|
217
|
+
try {
|
|
218
|
+
const imageDataUrl = await $2.get(editor).toDataURL($$props.exportOptions);
|
|
219
|
+
const maskDataUrl = await $2.get(editor).toMaskDataURL({
|
|
220
|
+
useAnnotations: $2.get(inpaintMaskMode) === "annotations",
|
|
221
|
+
useCrop: $2.get(inpaintMaskMode) === "crop"
|
|
222
|
+
});
|
|
223
|
+
const result = await $2.get(effectiveOnInpaint)({
|
|
224
|
+
prompt: $2.get(inpaintPrompt).trim(),
|
|
225
|
+
imageDataUrl,
|
|
226
|
+
maskDataUrl,
|
|
227
|
+
cropBox: $2.get(inpaintMaskMode) === "crop" ? $2.get(editor).state.crop : null
|
|
228
|
+
});
|
|
229
|
+
if (typeof result === "string") {
|
|
230
|
+
await $2.get(editor).applyInpaintedImage(result);
|
|
231
|
+
$2.set(aiSuccess, "Inpainting applied successfully!");
|
|
232
|
+
} else {
|
|
233
|
+
$2.set(aiSuccess, "Inpainting complete.");
|
|
234
|
+
}
|
|
235
|
+
} catch (err) {
|
|
236
|
+
$2.set(aiError, err?.message || "Failed to apply inpainting.", true);
|
|
237
|
+
} finally {
|
|
238
|
+
$2.set(isInpainting, false);
|
|
239
|
+
}
|
|
240
|
+
}
|
|
153
241
|
let activeColor = $2.state("#ef4444");
|
|
154
242
|
let strokeWidth = $2.state(3);
|
|
155
243
|
let fontSize = $2.state(24);
|
|
@@ -531,24 +619,25 @@ function ImageEditor($$anchor, $$props) {
|
|
|
531
619
|
link.click();
|
|
532
620
|
}
|
|
533
621
|
}
|
|
534
|
-
var div =
|
|
622
|
+
var div = root_17();
|
|
535
623
|
var div_1 = $2.child(div);
|
|
536
624
|
var div_2 = $2.child(div_1);
|
|
537
625
|
var button = $2.child(div_2);
|
|
538
626
|
var button_1 = $2.sibling(button, 2);
|
|
539
627
|
var button_2 = $2.sibling(button_1, 2);
|
|
540
628
|
var button_3 = $2.sibling(button_2, 2);
|
|
629
|
+
var button_4 = $2.sibling(button_3, 2);
|
|
541
630
|
$2.reset(div_2);
|
|
542
631
|
var div_3 = $2.sibling(div_2, 2);
|
|
543
|
-
var
|
|
544
|
-
var button_5 = $2.sibling(button_4, 2);
|
|
632
|
+
var button_5 = $2.child(div_3);
|
|
545
633
|
var button_6 = $2.sibling(button_5, 2);
|
|
546
|
-
var button_7 = $2.sibling(button_6,
|
|
547
|
-
var
|
|
634
|
+
var button_7 = $2.sibling(button_6, 2);
|
|
635
|
+
var button_8 = $2.sibling(button_7, 4);
|
|
636
|
+
var span = $2.sibling(button_8, 2);
|
|
548
637
|
var text = $2.only_child(span);
|
|
549
|
-
var
|
|
550
|
-
var
|
|
551
|
-
var
|
|
638
|
+
var button_9 = $2.sibling(span, 2);
|
|
639
|
+
var button_10 = $2.sibling(button_9, 4);
|
|
640
|
+
var button_11 = $2.sibling(button_10, 2);
|
|
552
641
|
$2.reset(div_3);
|
|
553
642
|
$2.reset(div_1);
|
|
554
643
|
var div_4 = $2.sibling(div_1, 2);
|
|
@@ -563,57 +652,57 @@ function ImageEditor($$anchor, $$props) {
|
|
|
563
652
|
var consequent = ($$anchor2) => {
|
|
564
653
|
var div_7 = root();
|
|
565
654
|
var div_8 = $2.sibling($2.child(div_7), 2);
|
|
566
|
-
var
|
|
567
|
-
var button_12 = $2.sibling(button_11, 2);
|
|
655
|
+
var button_12 = $2.child(div_8);
|
|
568
656
|
var button_13 = $2.sibling(button_12, 2);
|
|
569
657
|
var button_14 = $2.sibling(button_13, 2);
|
|
570
658
|
var button_15 = $2.sibling(button_14, 2);
|
|
571
659
|
var button_16 = $2.sibling(button_15, 2);
|
|
660
|
+
var button_17 = $2.sibling(button_16, 2);
|
|
572
661
|
$2.reset(div_8);
|
|
573
662
|
var div_9 = $2.sibling(div_8, 6);
|
|
574
|
-
var
|
|
575
|
-
var button_18 = $2.sibling(button_17, 2);
|
|
663
|
+
var button_18 = $2.child(div_9);
|
|
576
664
|
var button_19 = $2.sibling(button_18, 2);
|
|
577
665
|
var button_20 = $2.sibling(button_19, 2);
|
|
666
|
+
var button_21 = $2.sibling(button_20, 2);
|
|
578
667
|
$2.reset(div_9);
|
|
579
668
|
$2.reset(div_7);
|
|
580
669
|
$2.template_effect(() => {
|
|
581
|
-
$2.set_class(
|
|
582
|
-
$2.set_class(
|
|
583
|
-
$2.set_class(
|
|
584
|
-
$2.set_class(
|
|
585
|
-
$2.set_class(
|
|
586
|
-
$2.set_class(
|
|
587
|
-
$2.set_class(
|
|
670
|
+
$2.set_class(button_12, 1, `px-2.5 py-2 rounded-lg border font-medium ${$2.get(activeCropRatio) === null && $2.get(editor).state.crop ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 hover:bg-slate-700 text-slate-200 border-slate-700"}`);
|
|
671
|
+
$2.set_class(button_13, 1, `px-2.5 py-2 rounded-lg border font-medium ${$2.get(activeCropRatio) === 1 ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 hover:bg-slate-700 text-slate-200 border-slate-700"}`);
|
|
672
|
+
$2.set_class(button_14, 1, `px-2.5 py-2 rounded-lg border font-medium ${$2.get(activeCropRatio) === 4 / 3 ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 hover:bg-slate-700 text-slate-200 border-slate-700"}`);
|
|
673
|
+
$2.set_class(button_15, 1, `px-2.5 py-2 rounded-lg border font-medium ${$2.get(activeCropRatio) === 16 / 9 ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 hover:bg-slate-700 text-slate-200 border-slate-700"}`);
|
|
674
|
+
$2.set_class(button_16, 1, `px-2.5 py-2 rounded-lg border font-medium ${$2.get(activeCropRatio) === 3 / 2 ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 hover:bg-slate-700 text-slate-200 border-slate-700"}`);
|
|
675
|
+
$2.set_class(button_20, 1, `px-3 py-2 rounded-lg border transition-colors ${$2.get(editor).state.transform.flipH ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 border-slate-700 text-slate-200 hover:bg-slate-700"}`);
|
|
676
|
+
$2.set_class(button_21, 1, `px-3 py-2 rounded-lg border transition-colors ${$2.get(editor).state.transform.flipV ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 border-slate-700 text-slate-200 hover:bg-slate-700"}`);
|
|
588
677
|
});
|
|
589
|
-
$2.delegated("click",
|
|
678
|
+
$2.delegated("click", button_12, () => {
|
|
590
679
|
$2.set(activeCropRatio, null);
|
|
591
680
|
$2.get(editor).applyCropPreset(null);
|
|
592
681
|
});
|
|
593
|
-
$2.delegated("click",
|
|
682
|
+
$2.delegated("click", button_13, () => {
|
|
594
683
|
$2.set(activeCropRatio, 1);
|
|
595
684
|
$2.get(editor).applyCropPreset(1);
|
|
596
685
|
});
|
|
597
|
-
$2.delegated("click",
|
|
686
|
+
$2.delegated("click", button_14, () => {
|
|
598
687
|
$2.set(activeCropRatio, 4 / 3);
|
|
599
688
|
$2.get(editor).applyCropPreset(4 / 3);
|
|
600
689
|
});
|
|
601
|
-
$2.delegated("click",
|
|
690
|
+
$2.delegated("click", button_15, () => {
|
|
602
691
|
$2.set(activeCropRatio, 16 / 9);
|
|
603
692
|
$2.get(editor).applyCropPreset(16 / 9);
|
|
604
693
|
});
|
|
605
|
-
$2.delegated("click",
|
|
694
|
+
$2.delegated("click", button_16, () => {
|
|
606
695
|
$2.set(activeCropRatio, 3 / 2);
|
|
607
696
|
$2.get(editor).applyCropPreset(3 / 2);
|
|
608
697
|
});
|
|
609
|
-
$2.delegated("click",
|
|
698
|
+
$2.delegated("click", button_17, () => {
|
|
610
699
|
$2.set(activeCropRatio, null);
|
|
611
700
|
$2.get(editor).resetCrop();
|
|
612
701
|
});
|
|
613
|
-
$2.delegated("click",
|
|
614
|
-
$2.delegated("click",
|
|
615
|
-
$2.delegated("click",
|
|
616
|
-
$2.delegated("click",
|
|
702
|
+
$2.delegated("click", button_18, () => $2.get(editor).rotate(-90));
|
|
703
|
+
$2.delegated("click", button_19, () => $2.get(editor).rotate(90));
|
|
704
|
+
$2.delegated("click", button_20, () => $2.get(editor).flipHorizontal());
|
|
705
|
+
$2.delegated("click", button_21, () => $2.get(editor).flipVertical());
|
|
617
706
|
$2.append($$anchor2, div_7);
|
|
618
707
|
};
|
|
619
708
|
$2.if(node, ($$render) => {
|
|
@@ -625,7 +714,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
625
714
|
var consequent_1 = ($$anchor2) => {
|
|
626
715
|
var div_10 = root_1();
|
|
627
716
|
var div_11 = $2.child(div_10);
|
|
628
|
-
var
|
|
717
|
+
var button_22 = $2.sibling($2.child(div_11), 2);
|
|
629
718
|
$2.reset(div_11);
|
|
630
719
|
var div_12 = $2.sibling(div_11, 2);
|
|
631
720
|
var div_13 = $2.child(div_12);
|
|
@@ -705,7 +794,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
705
794
|
() => Math.round($2.get(editor).state.adjustments.opacity * 100)
|
|
706
795
|
]
|
|
707
796
|
);
|
|
708
|
-
$2.delegated("click",
|
|
797
|
+
$2.delegated("click", button_22, () => $2.get(editor).resetAdjustments());
|
|
709
798
|
$2.delegated("input", input, (e) => $2.get(editor).setAdjustments({ brightness: Number(e.target.value) }));
|
|
710
799
|
$2.delegated("input", input_1, (e) => $2.get(editor).setAdjustments({ contrast: Number(e.target.value) }));
|
|
711
800
|
$2.delegated("input", input_2, (e) => $2.get(editor).setAdjustments({ saturation: Number(e.target.value) }));
|
|
@@ -725,14 +814,14 @@ function ImageEditor($$anchor, $$props) {
|
|
|
725
814
|
var div_26 = root_5();
|
|
726
815
|
var div_27 = $2.sibling($2.child(div_26), 2);
|
|
727
816
|
$2.each(div_27, 20, () => ["pen", "rect", "circle", "arrow", "line"], $2.index, ($$anchor3, t) => {
|
|
728
|
-
var
|
|
729
|
-
var text_8 = $2.only_child(
|
|
817
|
+
var button_23 = root_2();
|
|
818
|
+
var text_8 = $2.only_child(button_23, true);
|
|
730
819
|
$2.template_effect(() => {
|
|
731
|
-
$2.set_class(
|
|
820
|
+
$2.set_class(button_23, 1, `py-1.5 px-2 rounded-lg font-medium capitalize border transition-colors ${$2.get(editor).state.activeTool === t ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 border-slate-700 text-slate-300 hover:bg-slate-700"}`);
|
|
732
821
|
$2.set_text(text_8, t);
|
|
733
822
|
});
|
|
734
|
-
$2.delegated("click",
|
|
735
|
-
$2.append($$anchor3,
|
|
823
|
+
$2.delegated("click", button_23, () => $2.get(editor).setTool(t));
|
|
824
|
+
$2.append($$anchor3, button_23);
|
|
736
825
|
});
|
|
737
826
|
$2.reset(div_27);
|
|
738
827
|
var div_28 = $2.sibling(div_27, 2);
|
|
@@ -750,7 +839,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
750
839
|
var div_31 = $2.sibling(div_28, 6);
|
|
751
840
|
var input_9 = $2.child(div_31);
|
|
752
841
|
$2.remove_input_defaults(input_9);
|
|
753
|
-
var
|
|
842
|
+
var button_24 = $2.sibling(input_9, 2);
|
|
754
843
|
$2.reset(div_31);
|
|
755
844
|
var div_32 = $2.sibling(div_31, 2);
|
|
756
845
|
var span_9 = $2.sibling($2.child(div_32), 2);
|
|
@@ -764,9 +853,9 @@ function ImageEditor($$anchor, $$props) {
|
|
|
764
853
|
var node_3 = $2.sibling(span_10, 2);
|
|
765
854
|
{
|
|
766
855
|
var consequent_2 = ($$anchor3) => {
|
|
767
|
-
var
|
|
768
|
-
$2.delegated("click",
|
|
769
|
-
$2.append($$anchor3,
|
|
856
|
+
var button_25 = root_3();
|
|
857
|
+
$2.delegated("click", button_25, () => $2.get(editor).removeAnnotation($2.get(editor).state.selectedAnnotationId));
|
|
858
|
+
$2.append($$anchor3, button_25);
|
|
770
859
|
};
|
|
771
860
|
$2.if(node_3, ($$render) => {
|
|
772
861
|
if ($2.get(editor).state.selectedAnnotationId) $$render(consequent_2);
|
|
@@ -775,9 +864,9 @@ function ImageEditor($$anchor, $$props) {
|
|
|
775
864
|
var node_4 = $2.sibling(node_3, 2);
|
|
776
865
|
{
|
|
777
866
|
var consequent_3 = ($$anchor3) => {
|
|
778
|
-
var
|
|
779
|
-
$2.delegated("click",
|
|
780
|
-
$2.append($$anchor3,
|
|
867
|
+
var button_26 = root_4();
|
|
868
|
+
$2.delegated("click", button_26, () => $2.get(editor).clearAnnotations());
|
|
869
|
+
$2.append($$anchor3, button_26);
|
|
781
870
|
};
|
|
782
871
|
$2.if(node_4, ($$render) => {
|
|
783
872
|
if ($2.get(editor).state.annotations.length > 0) $$render(consequent_3);
|
|
@@ -794,7 +883,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
794
883
|
$2.bind_value(input_8, () => $2.get(strokeWidth), ($$value) => $2.set(strokeWidth, $$value));
|
|
795
884
|
$2.delegated("keydown", input_9, (e) => e.key === "Enter" && handleAddText());
|
|
796
885
|
$2.bind_value(input_9, () => $2.get(textInput), ($$value) => $2.set(textInput, $$value));
|
|
797
|
-
$2.delegated("click",
|
|
886
|
+
$2.delegated("click", button_24, handleAddText);
|
|
798
887
|
$2.bind_value(input_10, () => $2.get(fontSize), ($$value) => $2.set(fontSize, $$value));
|
|
799
888
|
$2.append($$anchor2, div_26);
|
|
800
889
|
};
|
|
@@ -807,7 +896,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
807
896
|
var consequent_6 = ($$anchor2) => {
|
|
808
897
|
var div_34 = root_7();
|
|
809
898
|
var div_35 = $2.child(div_34);
|
|
810
|
-
var
|
|
899
|
+
var button_27 = $2.sibling($2.child(div_35), 2);
|
|
811
900
|
$2.reset(div_35);
|
|
812
901
|
var label = $2.sibling(div_35, 2);
|
|
813
902
|
var input_11 = $2.child(label);
|
|
@@ -823,8 +912,8 @@ function ImageEditor($$anchor, $$props) {
|
|
|
823
912
|
$2.remove_input_defaults(input_12);
|
|
824
913
|
$2.reset(div_36);
|
|
825
914
|
var div_37 = $2.sibling(div_36, 2);
|
|
826
|
-
var
|
|
827
|
-
var
|
|
915
|
+
var button_28 = $2.child(div_37);
|
|
916
|
+
var button_29 = $2.sibling(button_28, 2);
|
|
828
917
|
$2.reset(div_37);
|
|
829
918
|
var div_38 = $2.sibling(div_37, 2);
|
|
830
919
|
var div_39 = $2.child(div_38);
|
|
@@ -857,8 +946,8 @@ function ImageEditor($$anchor, $$props) {
|
|
|
857
946
|
$2.reset(label_1);
|
|
858
947
|
$2.template_effect(() => {
|
|
859
948
|
$2.set_value(input_12, $2.get(editor).state.depthMask.maskSource || "");
|
|
860
|
-
$2.set_class(
|
|
861
|
-
$2.set_class(
|
|
949
|
+
$2.set_class(button_28, 1, `flex-1 py-1.5 rounded-lg border text-xs font-medium ${$2.get(editor).state.depthMask.mode === "threshold" ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 border-slate-700 text-slate-300"}`);
|
|
950
|
+
$2.set_class(button_29, 1, `flex-1 py-1.5 rounded-lg border text-xs font-medium ${$2.get(editor).state.depthMask.mode === "brightness" ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-800 border-slate-700 text-slate-300"}`);
|
|
862
951
|
$2.set_text(text_12, $2.get(editor).state.depthMask.depthRange[0]);
|
|
863
952
|
$2.set_value(input_13, $2.get(editor).state.depthMask.depthRange[0]);
|
|
864
953
|
$2.set_text(text_13, $2.get(editor).state.depthMask.depthRange[1]);
|
|
@@ -868,8 +957,8 @@ function ImageEditor($$anchor, $$props) {
|
|
|
868
957
|
$2.set_checked(input_16, $2.get(editor).state.depthMask.invert);
|
|
869
958
|
});
|
|
870
959
|
$2.delegated("input", input_12, (e) => $2.get(editor).setDepthMask({ maskSource: e.target.value || null }));
|
|
871
|
-
$2.delegated("click",
|
|
872
|
-
$2.delegated("click",
|
|
960
|
+
$2.delegated("click", button_28, () => $2.get(editor).setDepthMask({ mode: "threshold" }));
|
|
961
|
+
$2.delegated("click", button_29, () => $2.get(editor).setDepthMask({ mode: "brightness" }));
|
|
873
962
|
$2.delegated("input", input_13, (e) => $2.get(editor).setDepthMask({
|
|
874
963
|
depthRange: [
|
|
875
964
|
Number(e.target.value),
|
|
@@ -892,7 +981,7 @@ function ImageEditor($$anchor, $$props) {
|
|
|
892
981
|
}
|
|
893
982
|
$2.reset(div_34);
|
|
894
983
|
$2.template_effect(() => $2.set_checked(input_11, $2.get(editor).state.depthMask.enabled));
|
|
895
|
-
$2.delegated("click",
|
|
984
|
+
$2.delegated("click", button_27, () => $2.get(editor).resetDepthMask());
|
|
896
985
|
$2.delegated("change", input_11, (e) => $2.get(editor).setDepthMask({ enabled: e.target.checked }));
|
|
897
986
|
$2.append($$anchor2, div_34);
|
|
898
987
|
};
|
|
@@ -900,6 +989,137 @@ function ImageEditor($$anchor, $$props) {
|
|
|
900
989
|
if ($2.get(activeTab) === "depth") $$render(consequent_6);
|
|
901
990
|
});
|
|
902
991
|
}
|
|
992
|
+
var node_7 = $2.sibling(node_5, 2);
|
|
993
|
+
{
|
|
994
|
+
var consequent_13 = ($$anchor2) => {
|
|
995
|
+
var div_44 = root_16();
|
|
996
|
+
var div_45 = $2.child(div_44);
|
|
997
|
+
var div_46 = $2.child(div_45);
|
|
998
|
+
var node_8 = $2.sibling($2.child(div_46), 2);
|
|
999
|
+
{
|
|
1000
|
+
var consequent_7 = ($$anchor3) => {
|
|
1001
|
+
var span_14 = root_8();
|
|
1002
|
+
$2.append($$anchor3, span_14);
|
|
1003
|
+
};
|
|
1004
|
+
$2.if(node_8, ($$render) => {
|
|
1005
|
+
if ($2.get(isRemovingBg)) $$render(consequent_7);
|
|
1006
|
+
});
|
|
1007
|
+
}
|
|
1008
|
+
$2.reset(div_46);
|
|
1009
|
+
var button_30 = $2.sibling(div_46, 4);
|
|
1010
|
+
var node_9 = $2.child(button_30);
|
|
1011
|
+
{
|
|
1012
|
+
var consequent_8 = ($$anchor3) => {
|
|
1013
|
+
var fragment_1 = root_9();
|
|
1014
|
+
$2.next();
|
|
1015
|
+
$2.append($$anchor3, fragment_1);
|
|
1016
|
+
};
|
|
1017
|
+
var alternate = ($$anchor3) => {
|
|
1018
|
+
var fragment_2 = root_10();
|
|
1019
|
+
$2.next();
|
|
1020
|
+
$2.append($$anchor3, fragment_2);
|
|
1021
|
+
};
|
|
1022
|
+
$2.if(node_9, ($$render) => {
|
|
1023
|
+
if ($2.get(isRemovingBg)) $$render(consequent_8);
|
|
1024
|
+
else $$render(alternate, -1);
|
|
1025
|
+
});
|
|
1026
|
+
}
|
|
1027
|
+
$2.reset(button_30);
|
|
1028
|
+
$2.reset(div_45);
|
|
1029
|
+
var div_47 = $2.sibling(div_45, 2);
|
|
1030
|
+
var div_48 = $2.child(div_47);
|
|
1031
|
+
var node_10 = $2.sibling($2.child(div_48), 2);
|
|
1032
|
+
{
|
|
1033
|
+
var consequent_9 = ($$anchor3) => {
|
|
1034
|
+
var span_15 = root_11();
|
|
1035
|
+
$2.append($$anchor3, span_15);
|
|
1036
|
+
};
|
|
1037
|
+
$2.if(node_10, ($$render) => {
|
|
1038
|
+
if ($2.get(isInpainting)) $$render(consequent_9);
|
|
1039
|
+
});
|
|
1040
|
+
}
|
|
1041
|
+
$2.reset(div_48);
|
|
1042
|
+
var div_49 = $2.sibling(div_48, 4);
|
|
1043
|
+
var textarea = $2.sibling($2.child(div_49), 2);
|
|
1044
|
+
$2.remove_textarea_child(textarea);
|
|
1045
|
+
$2.reset(div_49);
|
|
1046
|
+
var div_50 = $2.sibling(div_49, 2);
|
|
1047
|
+
var div_51 = $2.sibling($2.child(div_50), 2);
|
|
1048
|
+
var button_31 = $2.child(div_51);
|
|
1049
|
+
var text_15 = $2.only_child(button_31);
|
|
1050
|
+
var button_32 = $2.sibling(button_31, 2);
|
|
1051
|
+
var text_16 = $2.only_child(button_32);
|
|
1052
|
+
$2.reset(div_51);
|
|
1053
|
+
$2.reset(div_50);
|
|
1054
|
+
var button_33 = $2.sibling(div_50, 2);
|
|
1055
|
+
var node_11 = $2.child(button_33);
|
|
1056
|
+
{
|
|
1057
|
+
var consequent_10 = ($$anchor3) => {
|
|
1058
|
+
var fragment_3 = root_12();
|
|
1059
|
+
$2.next();
|
|
1060
|
+
$2.append($$anchor3, fragment_3);
|
|
1061
|
+
};
|
|
1062
|
+
var alternate_1 = ($$anchor3) => {
|
|
1063
|
+
var fragment_4 = root_13();
|
|
1064
|
+
$2.next();
|
|
1065
|
+
$2.append($$anchor3, fragment_4);
|
|
1066
|
+
};
|
|
1067
|
+
$2.if(node_11, ($$render) => {
|
|
1068
|
+
if ($2.get(isInpainting)) $$render(consequent_10);
|
|
1069
|
+
else $$render(alternate_1, -1);
|
|
1070
|
+
});
|
|
1071
|
+
}
|
|
1072
|
+
$2.reset(button_33);
|
|
1073
|
+
$2.reset(div_47);
|
|
1074
|
+
var node_12 = $2.sibling(div_47, 2);
|
|
1075
|
+
{
|
|
1076
|
+
var consequent_11 = ($$anchor3) => {
|
|
1077
|
+
var div_52 = root_14();
|
|
1078
|
+
var text_17 = $2.only_child(div_52, true);
|
|
1079
|
+
$2.template_effect(() => $2.set_text(text_17, $2.get(aiError)));
|
|
1080
|
+
$2.append($$anchor3, div_52);
|
|
1081
|
+
};
|
|
1082
|
+
$2.if(node_12, ($$render) => {
|
|
1083
|
+
if ($2.get(aiError)) $$render(consequent_11);
|
|
1084
|
+
});
|
|
1085
|
+
}
|
|
1086
|
+
var node_13 = $2.sibling(node_12, 2);
|
|
1087
|
+
{
|
|
1088
|
+
var consequent_12 = ($$anchor3) => {
|
|
1089
|
+
var div_53 = root_15();
|
|
1090
|
+
var text_18 = $2.only_child(div_53, true);
|
|
1091
|
+
$2.template_effect(() => $2.set_text(text_18, $2.get(aiSuccess)));
|
|
1092
|
+
$2.append($$anchor3, div_53);
|
|
1093
|
+
};
|
|
1094
|
+
$2.if(node_13, ($$render) => {
|
|
1095
|
+
if ($2.get(aiSuccess)) $$render(consequent_12);
|
|
1096
|
+
});
|
|
1097
|
+
}
|
|
1098
|
+
$2.reset(div_44);
|
|
1099
|
+
$2.template_effect(
|
|
1100
|
+
($0) => {
|
|
1101
|
+
button_30.disabled = $2.get(isRemovingBg) || $2.get(isInpainting);
|
|
1102
|
+
$2.set_class(button_31, 1, `px-2 py-1.5 rounded border text-[11px] font-medium text-left transition-colors ${$2.get(inpaintMaskMode) === "annotations" ? "bg-purple-600/30 border-purple-500 text-purple-200" : "bg-slate-900 border-slate-700 text-slate-400 hover:text-slate-200"}`);
|
|
1103
|
+
$2.set_text(text_15, `Drawn Shapes (${$2.get(editor).state.annotations.length ?? ""})`);
|
|
1104
|
+
$2.set_class(button_32, 1, `px-2 py-1.5 rounded border text-[11px] font-medium text-left transition-colors ${$2.get(inpaintMaskMode) === "crop" ? "bg-purple-600/30 border-purple-500 text-purple-200" : "bg-slate-900 border-slate-700 text-slate-400 hover:text-slate-200"}`);
|
|
1105
|
+
$2.set_text(text_16, `Crop Box (${$2.get(editor).state.crop ? "Selected" : "Full"})`);
|
|
1106
|
+
button_33.disabled = $0;
|
|
1107
|
+
},
|
|
1108
|
+
[
|
|
1109
|
+
() => $2.get(isInpainting) || $2.get(isRemovingBg) || !$2.get(inpaintPrompt).trim()
|
|
1110
|
+
]
|
|
1111
|
+
);
|
|
1112
|
+
$2.delegated("click", button_30, handleRemoveBackground);
|
|
1113
|
+
$2.bind_value(textarea, () => $2.get(inpaintPrompt), ($$value) => $2.set(inpaintPrompt, $$value));
|
|
1114
|
+
$2.delegated("click", button_31, () => $2.set(inpaintMaskMode, "annotations"));
|
|
1115
|
+
$2.delegated("click", button_32, () => $2.set(inpaintMaskMode, "crop"));
|
|
1116
|
+
$2.delegated("click", button_33, handleInpaint);
|
|
1117
|
+
$2.append($$anchor2, div_44);
|
|
1118
|
+
};
|
|
1119
|
+
$2.if(node_7, ($$render) => {
|
|
1120
|
+
if ($2.get(activeTab) === "ai") $$render(consequent_13);
|
|
1121
|
+
});
|
|
1122
|
+
}
|
|
903
1123
|
$2.reset(div_6);
|
|
904
1124
|
$2.reset(div_4);
|
|
905
1125
|
$2.reset(div);
|
|
@@ -911,8 +1131,9 @@ function ImageEditor($$anchor, $$props) {
|
|
|
911
1131
|
$2.set_class(button_1, 1, `px-3 py-1.5 rounded-md font-medium transition-colors ${$2.get(activeTab) === "adjust" ? "bg-indigo-600 text-white shadow" : "text-slate-400 hover:text-slate-200"}`);
|
|
912
1132
|
$2.set_class(button_2, 1, `px-3 py-1.5 rounded-md font-medium transition-colors ${$2.get(activeTab) === "annotate" ? "bg-indigo-600 text-white shadow" : "text-slate-400 hover:text-slate-200"}`);
|
|
913
1133
|
$2.set_class(button_3, 1, `px-3 py-1.5 rounded-md font-medium transition-colors ${$2.get(activeTab) === "depth" ? "bg-indigo-600 text-white shadow" : "text-slate-400 hover:text-slate-200"}`);
|
|
914
|
-
button_4.
|
|
915
|
-
button_5.disabled = !$2.get(editor).
|
|
1134
|
+
$2.set_class(button_4, 1, `px-3 py-1.5 rounded-md font-medium transition-colors flex items-center gap-1.5 ${$2.get(activeTab) === "ai" ? "bg-indigo-600 text-white shadow" : "text-slate-400 hover:text-slate-200"}`);
|
|
1135
|
+
button_5.disabled = !$2.get(editor).canUndo;
|
|
1136
|
+
button_6.disabled = !$2.get(editor).canRedo;
|
|
916
1137
|
$2.set_text(text, `${$0 ?? ""}%`);
|
|
917
1138
|
},
|
|
918
1139
|
[() => Math.round($2.get(editor).state.zoom * 100)]
|
|
@@ -933,15 +1154,19 @@ function ImageEditor($$anchor, $$props) {
|
|
|
933
1154
|
$2.set(activeTab, "depth");
|
|
934
1155
|
$2.get(editor).setTool("select");
|
|
935
1156
|
});
|
|
936
|
-
$2.delegated("click", button_4, () =>
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
$2.delegated("click",
|
|
941
|
-
$2.delegated("
|
|
942
|
-
$2.delegated("
|
|
943
|
-
$2.
|
|
944
|
-
$2.delegated("click",
|
|
1157
|
+
$2.delegated("click", button_4, () => {
|
|
1158
|
+
$2.set(activeTab, "ai");
|
|
1159
|
+
$2.get(editor).setTool("select");
|
|
1160
|
+
});
|
|
1161
|
+
$2.delegated("click", button_5, () => $2.get(editor).undo());
|
|
1162
|
+
$2.delegated("click", button_6, () => $2.get(editor).redo());
|
|
1163
|
+
$2.delegated("click", button_7, () => $2.get(editor).reset());
|
|
1164
|
+
$2.delegated("click", button_8, () => $2.get(editor).zoomOut());
|
|
1165
|
+
$2.delegated("click", button_9, () => $2.get(editor).zoomIn());
|
|
1166
|
+
$2.delegated("mousedown", button_10, () => $2.get(editor).setComparing(true));
|
|
1167
|
+
$2.delegated("mouseup", button_10, () => $2.get(editor).setComparing(false));
|
|
1168
|
+
$2.event("mouseleave", button_10, () => $2.get(editor).setComparing(false));
|
|
1169
|
+
$2.delegated("click", button_11, handleExport);
|
|
945
1170
|
$2.delegated("mousedown", canvas, handleMouseDown);
|
|
946
1171
|
$2.delegated("mousemove", canvas, handleMouseMove);
|
|
947
1172
|
$2.delegated("mouseup", canvas, handleMouseUp);
|
|
@@ -963,4 +1188,4 @@ export {
|
|
|
963
1188
|
createReactiveImageEditor,
|
|
964
1189
|
ImageEditor
|
|
965
1190
|
};
|
|
966
|
-
//# sourceMappingURL=chunk-
|
|
1191
|
+
//# sourceMappingURL=chunk-HEOI4UNF.js.map
|