geoiq-frontend-ui-kit 2.0.3 → 2.0.4

package/dist/index.es141.js

@@ -0,0 +1,77 @@
+import { Spline as r, CornerUpLeft as c, Check as m, X as p } from "lucide-react";
+import e from "react";
+function u({ ui: a, engine: t }) {
+  if (!a.poly?.active) return null;
+  const { pointCount: n, canFinish: l, canClose: i } = a.poly;
+  return /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: "pointer-events-none absolute inset-x-0 bottom-3 z-20 flex justify-center px-3",
+      role: "toolbar",
+      "aria-label": "Multi-point line controls"
+    },
+    /* @__PURE__ */ e.createElement("div", { className: "pointer-events-auto flex max-w-full items-center gap-1 overflow-x-auto rounded-xl bg-dark-2/95 p-1.5 shadow-lg backdrop-blur" }, /* @__PURE__ */ e.createElement("span", { className: "flex shrink-0 items-center gap-1.5 px-2 text-xs font-medium text-white/70" }, /* @__PURE__ */ e.createElement(r, { className: "h-3.5 w-3.5" }), n, " ", n === 1 ? "point" : "points"), /* @__PURE__ */ e.createElement("span", { className: "h-6 w-px shrink-0 bg-white/15" }), /* @__PURE__ */ e.createElement(
+      o,
+      {
+        onClick: t.undoLinePoint,
+        icon: /* @__PURE__ */ e.createElement(c, { className: "h-4 w-4" }),
+        label: "Undo point"
+      }
+    ), /* @__PURE__ */ e.createElement(
+      o,
+      {
+        onClick: t.closeLine,
+        icon: /* @__PURE__ */ e.createElement(r, { className: "h-4 w-4" }),
+        label: "Close shape",
+        disabled: !i
+      }
+    ), /* @__PURE__ */ e.createElement(
+      o,
+      {
+        onClick: t.finishLine,
+        icon: /* @__PURE__ */ e.createElement(m, { className: "h-4 w-4" }),
+        label: "Done",
+        disabled: !l,
+        primary: !0
+      }
+    ), /* @__PURE__ */ e.createElement(
+      o,
+      {
+        onClick: t.cancelLine,
+        icon: /* @__PURE__ */ e.createElement(p, { className: "h-4 w-4" }),
+        label: "Cancel"
+      }
+    ))
+  );
+}
+function o({
+  onClick: a,
+  icon: t,
+  label: n,
+  disabled: l,
+  primary: i
+}) {
+  return /* @__PURE__ */ e.createElement(
+    "button",
+    {
+      type: "button",
+      onPointerDown: (s) => s.stopPropagation(),
+      onClick: (s) => {
+        s.stopPropagation(), a();
+      },
+      disabled: l,
+      "aria-label": n,
+      className: [
+        "flex min-h-9 shrink-0 items-center gap-1.5 rounded-lg px-2.5 text-xs font-medium transition-colors",
+        "disabled:pointer-events-none disabled:opacity-40",
+        i ? "bg-rest-p1 text-white hover:bg-hover-p1" : "text-white/85 hover:bg-white/10"
+      ].join(" ")
+    },
+    t,
+    /* @__PURE__ */ e.createElement("span", { className: "hidden sm:inline" }, n)
+  );
+}
+export {
+  u as LineSessionBar
+};
+//# sourceMappingURL=index.es141.js.map

package/dist/index.es141.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es141.js","sources":["../src/components/organisms/image-editor/components/line-session-bar.tsx"],"sourcesContent":["import { Check, CornerUpLeft, Spline, X } from 'lucide-react'\nimport React from 'react'\n\nimport { ImageEditorEngine, ImageEditorUiState } from '../image-editor.types'\n\ninterface LineSessionBarProps {\n  ui: ImageEditorUiState\n  engine: ImageEditorEngine\n}\n\n/**\n * On-screen controls for a live multi-point line.\n *\n * Touch has no Shift, Backspace, Enter or Escape, double-tap is unreliable\n * (and often zooms), and there is no hover to preview with -- so on a phone\n * these buttons are the *only* way to undo a corner or finish a line. They\n * show on every device rather than only small screens, because the same\n * ambiguity (\"how do I stop drawing?\") exists with a mouse.\n *\n * Rendered over the stage, bottom-centre, clear of the toolbar and panel.\n */\nexport function LineSessionBar({ ui, engine }: LineSessionBarProps) {\n  if (!ui.poly?.active) return null\n  const { pointCount, canFinish, canClose } = ui.poly\n\n  return (\n    <div\n      className=\"pointer-events-none absolute inset-x-0 bottom-3 z-20 flex justify-center px-3\"\n      role=\"toolbar\"\n      aria-label=\"Multi-point line controls\"\n    >\n      <div className=\"pointer-events-auto flex max-w-full items-center gap-1 overflow-x-auto rounded-xl bg-dark-2/95 p-1.5 shadow-lg backdrop-blur\">\n        <span className=\"flex shrink-0 items-center gap-1.5 px-2 text-xs font-medium text-white/70\">\n          <Spline className=\"h-3.5 w-3.5\" />\n          {pointCount} {pointCount === 1 ? 'point' : 'points'}\n        </span>\n\n        <span className=\"h-6 w-px shrink-0 bg-white/15\" />\n\n        <SessionButton\n          onClick={engine.undoLinePoint}\n          icon={<CornerUpLeft className=\"h-4 w-4\" />}\n          label=\"Undo point\"\n        />\n        <SessionButton\n          onClick={engine.closeLine}\n          icon={<Spline className=\"h-4 w-4\" />}\n          label=\"Close shape\"\n          disabled={!canClose}\n        />\n        <SessionButton\n          onClick={engine.finishLine}\n          icon={<Check className=\"h-4 w-4\" />}\n          label=\"Done\"\n          disabled={!canFinish}\n          primary\n        />\n        <SessionButton\n          onClick={engine.cancelLine}\n          icon={<X className=\"h-4 w-4\" />}\n          label=\"Cancel\"\n        />\n      </div>\n    </div>\n  )\n}\n\ninterface SessionButtonProps {\n  onClick: () => void\n  icon: React.ReactNode\n  label: string\n  disabled?: boolean\n  primary?: boolean\n}\n\nfunction SessionButton({\n  onClick,\n  icon,\n  label,\n  disabled,\n  primary,\n}: SessionButtonProps) {\n  return (\n    <button\n      type=\"button\"\n      // Pointer events would reach the canvas underneath and place a stray\n      // point, so the press is stopped here before it can bubble to the stage.\n      onPointerDown={(e) => e.stopPropagation()}\n      onClick={(e) => {\n        e.stopPropagation()\n        onClick()\n      }}\n      disabled={disabled}\n      aria-label={label}\n      className={[\n        'flex min-h-9 shrink-0 items-center gap-1.5 rounded-lg px-2.5 text-xs font-medium transition-colors',\n        'disabled:pointer-events-none disabled:opacity-40',\n        primary\n          ? 'bg-rest-p1 text-white hover:bg-hover-p1'\n          : 'text-white/85 hover:bg-white/10',\n      ].join(' ')}\n    >\n      {icon}\n      <span className=\"hidden sm:inline\">{label}</span>\n    </button>\n  )\n}\n"],"names":["LineSessionBar","ui","engine","pointCount","canFinish","canClose","React","Spline","SessionButton","CornerUpLeft","Check","X","onClick","icon","label","disabled","primary","e"],"mappings":";;AAqBO,SAASA,EAAe,EAAE,IAAAC,GAAI,QAAAC,KAA+B;AAClE,MAAI,CAACD,EAAG,MAAM,OAAQ,QAAO;AAC7B,QAAM,EAAE,YAAAE,GAAY,WAAAC,GAAW,UAAAC,EAAA,IAAaJ,EAAG;AAE/C,SACEK,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,cAAW;AAAA,IAAA;AAAA,IAEXA,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,+HAAA,GACbA,gBAAAA,EAAA,cAAC,UAAK,WAAU,4EAAA,GACdA,gBAAAA,EAAA,cAACC,GAAA,EAAO,WAAU,cAAA,CAAc,GAC/BJ,GAAW,KAAEA,MAAe,IAAI,UAAU,QAC7C,GAEAG,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,gCAAA,CAAgC,GAEhDA,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAASN,EAAO;AAAA,QAChB,MAAMI,gBAAAA,EAAA,cAACG,GAAA,EAAa,WAAU,WAAU;AAAA,QACxC,OAAM;AAAA,MAAA;AAAA,IAAA,GAERH,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAASN,EAAO;AAAA,QAChB,MAAMI,gBAAAA,EAAA,cAACC,GAAA,EAAO,WAAU,WAAU;AAAA,QAClC,OAAM;AAAA,QACN,UAAU,CAACF;AAAA,MAAA;AAAA,IAAA,GAEbC,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAASN,EAAO;AAAA,QAChB,MAAMI,gBAAAA,EAAA,cAACI,GAAA,EAAM,WAAU,WAAU;AAAA,QACjC,OAAM;AAAA,QACN,UAAU,CAACN;AAAA,QACX,SAAO;AAAA,MAAA;AAAA,IAAA,GAETE,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAASN,EAAO;AAAA,QAChB,MAAMI,gBAAAA,EAAA,cAACK,GAAA,EAAE,WAAU,WAAU;AAAA,QAC7B,OAAM;AAAA,MAAA;AAAA,IAAA,CAEV;AAAA,EAAA;AAGN;AAUA,SAASH,EAAc;AAAA,EACrB,SAAAI;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AACF,GAAuB;AACrB,SACEV,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MAGL,eAAe,CAACW,MAAMA,EAAE,gBAAA;AAAA,MACxB,SAAS,CAACA,MAAM;AACd,QAAAA,EAAE,gBAAA,GACFL,EAAA;AAAA,MACF;AAAA,MACA,UAAAG;AAAA,MACA,cAAYD;AAAA,MACZ,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACAE,IACI,4CACA;AAAA,MAAA,EACJ,KAAK,GAAG;AAAA,IAAA;AAAA,IAETH;AAAA,IACDP,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,mBAAA,GAAoBQ,CAAM;AAAA,EAAA;AAGhD;"}

package/dist/{index147.es.js → index.es142.js}

@@ -5,4 +5,4 @@ function r({ ui: t }) {
 export {
   r as StatusBar
 };
-//# sourceMappingURL=index147.es.js.map
+//# sourceMappingURL=index.es142.js.map

package/dist/{index147.es.js.map → index.es142.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index147.es.js","sources":["../src/components/organisms/image-editor/components/status-bar.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ImageEditorUiState } from '../image-editor.types'\n\nexport function StatusBar({ ui }: { ui: ImageEditorUiState }) {\n  return (\n    <div className=\"flex h-[30px] shrink-0 items-center gap-4 border-t border-neutral-1 bg-light-3 px-4 text-xs text-light-4\">\n      <span className=\"flex items-center gap-1.5\">\n        <span className=\"inline-block h-1.5 w-1.5 rounded-full bg-rest-p1\" />\n        {ui.statusText}\n      </span>\n      <span>{ui.dims}</span>\n    </div>\n  )\n}\n"],"names":["StatusBar","ui","React"],"mappings":";AAIO,SAASA,EAAU,EAAE,IAAAC,KAAkC;AAC5D,SACEC,gBAAAA,EAAA,cAAC,SAAI,WAAU,2GAAA,mCACZ,QAAA,EAAK,WAAU,+BACdA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,mDAAA,CAAmD,GAClED,EAAG,UACN,mCACC,QAAA,MAAMA,EAAG,IAAK,CACjB;AAEJ;"}
+{"version":3,"file":"index.es142.js","sources":["../src/components/organisms/image-editor/components/status-bar.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ImageEditorUiState } from '../image-editor.types'\n\nexport function StatusBar({ ui }: { ui: ImageEditorUiState }) {\n  return (\n    <div className=\"flex h-[30px] shrink-0 items-center gap-4 border-t border-neutral-1 bg-light-3 px-4 text-xs text-light-4\">\n      <span className=\"flex items-center gap-1.5\">\n        <span className=\"inline-block h-1.5 w-1.5 rounded-full bg-rest-p1\" />\n        {ui.statusText}\n      </span>\n      <span>{ui.dims}</span>\n    </div>\n  )\n}\n"],"names":["StatusBar","ui","React"],"mappings":";AAIO,SAASA,EAAU,EAAE,IAAAC,KAAkC;AAC5D,SACEC,gBAAAA,EAAA,cAAC,SAAI,WAAU,2GAAA,mCACZ,QAAA,EAAK,WAAU,+BACdA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,mDAAA,CAAmD,GAClED,EAAG,UACN,mCACC,QAAA,MAAMA,EAAG,IAAK,CACjB;AAEJ;"}

package/dist/{index148.es.js → index.es143.js}

@@ -56,4 +56,4 @@ export {
   n as SWATCHES,
   e as VERSION
 };
-//# sourceMappingURL=index148.es.js.map
+//# sourceMappingURL=index.es143.js.map

package/dist/{index148.es.js.map → index.es143.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index148.es.js","sources":["../src/components/organisms/image-editor/engine/constants.js"],"sourcesContent":["export const VERSION = '1.0.0'\n\nexport const FILTERS = [\n  { id: 'none', name: 'Original' },\n  { id: 'grayscale', name: 'B & W' },\n  { id: 'vivid', name: 'Vivid' },\n  { id: 'cool', name: 'Cool' },\n  { id: 'warm', name: 'Warm' },\n  { id: 'vintage', name: 'Vintage' },\n  { id: 'fade', name: 'Fade' },\n  { id: 'noir', name: 'Noir' },\n]\nexport const FILTER_CSS = {\n  none: '',\n  grayscale: 'grayscale(1) contrast(1.05)',\n  vivid: 'saturate(1.7) contrast(1.15)',\n  cool: 'hue-rotate(200deg) saturate(1.2)',\n  warm: 'sepia(.35) saturate(1.3) brightness(1.05)',\n  vintage: 'sepia(.5) contrast(.9) brightness(1.05) saturate(1.2)',\n  fade: 'contrast(.82) brightness(1.12) saturate(.85)',\n  noir: 'grayscale(1) contrast(1.4) brightness(.92)',\n}\nexport const SWATCHES = [\n  '#d24b2f',\n  '#2f5fd2',\n  '#e8b423',\n  '#2fa84f',\n  '#111111',\n  '#ffffff',\n  '#8e44ad',\n  '#ff5da2',\n]\nexport const SHAPES = [\n  { id: 'rect', name: 'Rectangle' },\n  { id: 'ellipse', name: 'Ellipse' },\n  { id: 'circle', name: 'Circle' },\n  { id: 'line', name: 'Line' },\n  { id: 'dashedLine', name: 'Dashed line' },\n  { id: 'arrow', name: 'Arrow' },\n  { id: 'dashedArrow', name: 'Dashed arrow' },\n  { id: 'doubleArrow', name: 'Double arrow' },\n  { id: 'dashedDoubleArrow', name: 'Dashed double arrow' },\n]\nexport const FONTS = [\n  { label: 'Serif', value: 'Iowan Old Style, Georgia, serif' },\n  { label: 'Sans', value: 'Avenir Next, Segoe UI, sans-serif' },\n  { label: 'Mono', value: 'Courier New, monospace' },\n  { label: 'Impact', value: 'Impact, sans-serif' },\n]\nexport const CROP_RATIOS = [\n  { label: 'Freeform', value: 'free' },\n  { label: 'Square 1:1', value: '1' },\n  { label: '4:3', value: '1.3333' },\n  { label: '16:9', value: '1.7777' },\n  { label: '3:4 portrait', value: '0.75' },\n]\n"],"names":["VERSION","FILTERS","FILTER_CSS","SWATCHES","SHAPES","FONTS","CROP_RATIOS"],"mappings":"AAAY,MAACA,IAAU,SAEVC,IAAU;AAAA,EACrB,EAAE,IAAI,QAAQ,MAAM,WAAU;AAAA,EAC9B,EAAE,IAAI,aAAa,MAAM,QAAO;AAAA,EAChC,EAAE,IAAI,SAAS,MAAM,QAAO;AAAA,EAC5B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,WAAW,MAAM,UAAS;AAAA,EAChC,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAC5B,GACaC,IAAa;AAAA,EACxB,MAAM;AAAA,EACN,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AAAA,EACN,MAAM;AACR,GACaC,IAAW;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACaC,IAAS;AAAA,EACpB,EAAE,IAAI,QAAQ,MAAM,YAAW;AAAA,EAC/B,EAAE,IAAI,WAAW,MAAM,UAAS;AAAA,EAChC,EAAE,IAAI,UAAU,MAAM,SAAQ;AAAA,EAC9B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,cAAc,MAAM,cAAa;AAAA,EACvC,EAAE,IAAI,SAAS,MAAM,QAAO;AAAA,EAC5B,EAAE,IAAI,eAAe,MAAM,eAAc;AAAA,EACzC,EAAE,IAAI,eAAe,MAAM,eAAc;AAAA,EACzC,EAAE,IAAI,qBAAqB,MAAM,sBAAqB;AACxD,GACaC,IAAQ;AAAA,EACnB,EAAE,OAAO,SAAS,OAAO,kCAAiC;AAAA,EAC1D,EAAE,OAAO,QAAQ,OAAO,oCAAmC;AAAA,EAC3D,EAAE,OAAO,QAAQ,OAAO,yBAAwB;AAAA,EAChD,EAAE,OAAO,UAAU,OAAO,qBAAoB;AAChD,GACaC,IAAc;AAAA,EACzB,EAAE,OAAO,YAAY,OAAO,OAAM;AAAA,EAClC,EAAE,OAAO,cAAc,OAAO,IAAG;AAAA,EACjC,EAAE,OAAO,OAAO,OAAO,SAAQ;AAAA,EAC/B,EAAE,OAAO,QAAQ,OAAO,SAAQ;AAAA,EAChC,EAAE,OAAO,gBAAgB,OAAO,OAAM;AACxC;"}
+{"version":3,"file":"index.es143.js","sources":["../src/components/organisms/image-editor/engine/constants.js"],"sourcesContent":["export const VERSION = '1.0.0'\n\nexport const FILTERS = [\n  { id: 'none', name: 'Original' },\n  { id: 'grayscale', name: 'B & W' },\n  { id: 'vivid', name: 'Vivid' },\n  { id: 'cool', name: 'Cool' },\n  { id: 'warm', name: 'Warm' },\n  { id: 'vintage', name: 'Vintage' },\n  { id: 'fade', name: 'Fade' },\n  { id: 'noir', name: 'Noir' },\n]\nexport const FILTER_CSS = {\n  none: '',\n  grayscale: 'grayscale(1) contrast(1.05)',\n  vivid: 'saturate(1.7) contrast(1.15)',\n  cool: 'hue-rotate(200deg) saturate(1.2)',\n  warm: 'sepia(.35) saturate(1.3) brightness(1.05)',\n  vintage: 'sepia(.5) contrast(.9) brightness(1.05) saturate(1.2)',\n  fade: 'contrast(.82) brightness(1.12) saturate(.85)',\n  noir: 'grayscale(1) contrast(1.4) brightness(.92)',\n}\nexport const SWATCHES = [\n  '#d24b2f',\n  '#2f5fd2',\n  '#e8b423',\n  '#2fa84f',\n  '#111111',\n  '#ffffff',\n  '#8e44ad',\n  '#ff5da2',\n]\nexport const SHAPES = [\n  { id: 'rect', name: 'Rectangle' },\n  { id: 'ellipse', name: 'Ellipse' },\n  { id: 'circle', name: 'Circle' },\n  { id: 'line', name: 'Line' },\n  { id: 'dashedLine', name: 'Dashed line' },\n  { id: 'arrow', name: 'Arrow' },\n  { id: 'dashedArrow', name: 'Dashed arrow' },\n  { id: 'doubleArrow', name: 'Double arrow' },\n  { id: 'dashedDoubleArrow', name: 'Dashed double arrow' },\n]\nexport const FONTS = [\n  { label: 'Serif', value: 'Iowan Old Style, Georgia, serif' },\n  { label: 'Sans', value: 'Avenir Next, Segoe UI, sans-serif' },\n  { label: 'Mono', value: 'Courier New, monospace' },\n  { label: 'Impact', value: 'Impact, sans-serif' },\n]\nexport const CROP_RATIOS = [\n  { label: 'Freeform', value: 'free' },\n  { label: 'Square 1:1', value: '1' },\n  { label: '4:3', value: '1.3333' },\n  { label: '16:9', value: '1.7777' },\n  { label: '3:4 portrait', value: '0.75' },\n]\n"],"names":["VERSION","FILTERS","FILTER_CSS","SWATCHES","SHAPES","FONTS","CROP_RATIOS"],"mappings":"AAAY,MAACA,IAAU,SAEVC,IAAU;AAAA,EACrB,EAAE,IAAI,QAAQ,MAAM,WAAU;AAAA,EAC9B,EAAE,IAAI,aAAa,MAAM,QAAO;AAAA,EAChC,EAAE,IAAI,SAAS,MAAM,QAAO;AAAA,EAC5B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,WAAW,MAAM,UAAS;AAAA,EAChC,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAC5B,GACaC,IAAa;AAAA,EACxB,MAAM;AAAA,EACN,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AAAA,EACN,MAAM;AACR,GACaC,IAAW;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACaC,IAAS;AAAA,EACpB,EAAE,IAAI,QAAQ,MAAM,YAAW;AAAA,EAC/B,EAAE,IAAI,WAAW,MAAM,UAAS;AAAA,EAChC,EAAE,IAAI,UAAU,MAAM,SAAQ;AAAA,EAC9B,EAAE,IAAI,QAAQ,MAAM,OAAM;AAAA,EAC1B,EAAE,IAAI,cAAc,MAAM,cAAa;AAAA,EACvC,EAAE,IAAI,SAAS,MAAM,QAAO;AAAA,EAC5B,EAAE,IAAI,eAAe,MAAM,eAAc;AAAA,EACzC,EAAE,IAAI,eAAe,MAAM,eAAc;AAAA,EACzC,EAAE,IAAI,qBAAqB,MAAM,sBAAqB;AACxD,GACaC,IAAQ;AAAA,EACnB,EAAE,OAAO,SAAS,OAAO,kCAAiC;AAAA,EAC1D,EAAE,OAAO,QAAQ,OAAO,oCAAmC;AAAA,EAC3D,EAAE,OAAO,QAAQ,OAAO,yBAAwB;AAAA,EAChD,EAAE,OAAO,UAAU,OAAO,qBAAoB;AAChD,GACaC,IAAc;AAAA,EACzB,EAAE,OAAO,YAAY,OAAO,OAAM;AAAA,EAClC,EAAE,OAAO,cAAc,OAAO,IAAG;AAAA,EACjC,EAAE,OAAO,OAAO,OAAO,SAAQ;AAAA,EAC/B,EAAE,OAAO,QAAQ,OAAO,SAAQ;AAAA,EAChC,EAAE,OAAO,gBAAgB,OAAO,OAAM;AACxC;"}

package/dist/{index149.es.js → index.es144.js}

@@ -1,4 +1,4 @@
-import { FONTS as a, VERSION as i } from "./index148.es.js";
+import { FONTS as a, VERSION as i } from "./index.es143.js";
 const d = 30;
 function o() {
   const e = document.createElement("canvas");
@@ -8,6 +8,7 @@ function g(e) {
   return {
     config: e,
     stickers: e.stickers || [],
+    savedLayers: [],
     listeners: { open: [], close: [], save: [], change: [], load: [] },
     notify: () => {
     },
@@ -23,6 +24,7 @@ function g(e) {
     zoom: 1,
     fitScale: 1,
     selectedShapeType: "rect",
+    multiPointMode: !1,
     shapeFill: "stroke",
     shapeWidth: 6,
     brushSize: 8,
@@ -67,6 +69,7 @@ function g(e) {
     activePointerId: null,
     pendingShape: null,
     pendingStroke: null,
+    pendingPoly: null,
     cropRect: null,
     cropStart: null,
     isOpenFlag: !1
@@ -82,12 +85,12 @@ function s(e, n, l) {
   });
 }
 function h(e) {
-  s(e, "change", { state: u(e) }), e.notify();
+  e.listeners.change.length && s(e, "change", { state: u(e) }), e.notify();
 }
-function S(e) {
+function f(e) {
   return e.selectedId != null ? e.layers.find((n) => n.id === e.selectedId) : null;
 }
-function f(e) {
+function S(e) {
   e.adj.brightness = 100, e.adj.contrast = 100, e.adj.saturate = 100, e.adj.sepia = 0, e.adj.blur = 0, e.adj.hue = 0, e.adj.filter = "none";
 }
 function u(e) {
@@ -113,8 +116,8 @@ export {
   s as emit,
   h as emitChange,
   o as emptySourceCanvas,
-  S as getSel,
+  f as getSel,
   u as getState,
-  f as resetAdjValues
+  S as resetAdjValues
 };
-//# sourceMappingURL=index149.es.js.map
+//# sourceMappingURL=index.es144.js.map

package/dist/index.es144.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es144.js","sources":["../src/components/organisms/image-editor/engine/state.js"],"sourcesContent":["import { FONTS, VERSION } from './constants.js'\n\nexport const MAX_HISTORY = 30\n\nexport function emptySourceCanvas() {\n  const c = document.createElement('canvas')\n  c.width = 0\n  c.height = 0\n  return c\n}\n\nexport function createState(config) {\n  return {\n    config,\n    stickers: config.stickers || [],\n    savedLayers: [],\n    listeners: { open: [], close: [], save: [], change: [], load: [] },\n    notify: () => {},\n\n    sourceCanvas: emptySourceCanvas(),\n    originalCanvas: null,\n    layers: [],\n    selectedId: null,\n    nextId: 1,\n    undoStack: [],\n    redoStack: [],\n\n    mode: 'select',\n    viewScale: 1,\n    zoom: 1,\n    fitScale: 1,\n    selectedShapeType: 'rect',\n    multiPointMode: false,\n    shapeFill: 'stroke',\n    shapeWidth: 6,\n    brushSize: 8,\n    brushStyle: 'round',\n    textFont: FONTS[0].value,\n    textSize: 64,\n    textColor: '#111111',\n    shapeColor: '#111111',\n    drawColor: '#111111',\n    cropRatio: 'free',\n    isSaving: false,\n    isLoadingImage: false,\n    statusText: 'Ready',\n    adj: {\n      brightness: 100,\n      contrast: 100,\n      saturate: 100,\n      sepia: 0,\n      blur: 0,\n      hue: 0,\n      filter: 'none',\n    },\n    stickerImageCache: new Map(),\n\n    canvasEl: null,\n    overlayEl: null,\n    textEditorEl: null,\n    stageEl: null,\n    ctx: null,\n    octx: null,\n    mounted: false,\n\n    editingLayer: null,\n    editingSelectAll: false,\n\n    dragMode: null,\n    dragStart: null,\n    dragOrig: null,\n    dragRect: null,\n    resizeCorner: null,\n    resizeAnchor: null,\n    resizeCenter: null,\n    resizeAnchorWorld: null,\n    rotateStart: null,\n    activePointerId: null,\n    pendingShape: null,\n    pendingStroke: null,\n    pendingPoly: null,\n    cropRect: null,\n    cropStart: null,\n\n    isOpenFlag: false,\n  }\n}\n\nexport function emit(state, ev, payload) {\n  ;(state.listeners[ev] || []).forEach((fn) => {\n    try {\n      fn(payload)\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.error(e)\n    }\n  })\n}\n\nexport function emitChange(state) {\n  if (state.listeners.change.length) {\n    emit(state, 'change', { state: getState(state) })\n  }\n  state.notify()\n}\n\nexport function getSel(state) {\n  return state.selectedId != null\n    ? state.layers.find((l) => l.id === state.selectedId)\n    : null\n}\n\nexport function resetAdjValues(state) {\n  state.adj.brightness = 100\n  state.adj.contrast = 100\n  state.adj.saturate = 100\n  state.adj.sepia = 0\n  state.adj.blur = 0\n  state.adj.hue = 0\n  state.adj.filter = 'none'\n}\n\nexport function getState(state) {\n  if (!state.sourceCanvas.width) return null\n  return {\n    version: VERSION,\n    image: state.sourceCanvas.toDataURL('image/png'),\n    width: state.sourceCanvas.width,\n    height: state.sourceCanvas.height,\n    adjustments: { ...state.adj },\n    layers: JSON.parse(\n      JSON.stringify(\n        state.layers.map((L) => {\n          const c = { ...L }\n          delete c._editing\n          return c\n        })\n      )\n    ),\n  }\n}\n"],"names":["MAX_HISTORY","emptySourceCanvas","c","createState","config","FONTS","emit","state","ev","payload","fn","e","emitChange","getState","getSel","l","resetAdjValues","VERSION","L"],"mappings":";AAEY,MAACA,IAAc;AAEpB,SAASC,IAAoB;AAClC,QAAMC,IAAI,SAAS,cAAc,QAAQ;AACzC,SAAAA,EAAE,QAAQ,GACVA,EAAE,SAAS,GACJA;AACT;AAEO,SAASC,EAAYC,GAAQ;AAClC,SAAO;AAAA,IACL,QAAAA;AAAA,IACA,UAAUA,EAAO,YAAY,CAAA;AAAA,IAC7B,aAAa,CAAA;AAAA,IACb,WAAW,EAAE,MAAM,CAAA,GAAI,OAAO,CAAA,GAAI,MAAM,CAAA,GAAI,QAAQ,IAAI,MAAM,CAAA,EAAE;AAAA,IAChE,QAAQ,MAAM;AAAA,IAAC;AAAA,IAEf,cAAcH,EAAiB;AAAA,IAC/B,gBAAgB;AAAA,IAChB,QAAQ,CAAA;AAAA,IACR,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,WAAW,CAAA;AAAA,IACX,WAAW,CAAA;AAAA,IAEX,MAAM;AAAA,IACN,WAAW;AAAA,IACX,MAAM;AAAA,IACN,UAAU;AAAA,IACV,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,UAAUI,EAAM,CAAC,EAAE;AAAA,IACnB,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,KAAK;AAAA,MACH,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO;AAAA,MACP,MAAM;AAAA,MACN,KAAK;AAAA,MACL,QAAQ;AAAA,IACd;AAAA,IACI,mBAAmB,oBAAI,IAAG;AAAA,IAE1B,UAAU;AAAA,IACV,WAAW;AAAA,IACX,cAAc;AAAA,IACd,SAAS;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IAET,cAAc;AAAA,IACd,kBAAkB;AAAA,IAElB,UAAU;AAAA,IACV,WAAW;AAAA,IACX,UAAU;AAAA,IACV,UAAU;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,aAAa;AAAA,IACb,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd,eAAe;AAAA,IACf,aAAa;AAAA,IACb,UAAU;AAAA,IACV,WAAW;AAAA,IAEX,YAAY;AAAA,EAChB;AACA;AAEO,SAASC,EAAKC,GAAOC,GAAIC,GAAS;AACtC,GAACF,EAAM,UAAUC,CAAE,KAAK,CAAA,GAAI,QAAQ,CAACE,MAAO;AAC3C,QAAI;AACF,MAAAA,EAAGD,CAAO;AAAA,IACZ,SAASE,GAAG;AAEV,cAAQ,MAAMA,CAAC;AAAA,IACjB;AAAA,EACF,CAAC;AACH;AAEO,SAASC,EAAWL,GAAO;AAChC,EAAIA,EAAM,UAAU,OAAO,UACzBD,EAAKC,GAAO,UAAU,EAAE,OAAOM,EAASN,CAAK,EAAC,CAAE,GAElDA,EAAM,OAAM;AACd;AAEO,SAASO,EAAOP,GAAO;AAC5B,SAAOA,EAAM,cAAc,OACvBA,EAAM,OAAO,KAAK,CAACQ,MAAMA,EAAE,OAAOR,EAAM,UAAU,IAClD;AACN;AAEO,SAASS,EAAeT,GAAO;AACpC,EAAAA,EAAM,IAAI,aAAa,KACvBA,EAAM,IAAI,WAAW,KACrBA,EAAM,IAAI,WAAW,KACrBA,EAAM,IAAI,QAAQ,GAClBA,EAAM,IAAI,OAAO,GACjBA,EAAM,IAAI,MAAM,GAChBA,EAAM,IAAI,SAAS;AACrB;AAEO,SAASM,EAASN,GAAO;AAC9B,SAAKA,EAAM,aAAa,QACjB;AAAA,IACL,SAASU;AAAA,IACT,OAAOV,EAAM,aAAa,UAAU,WAAW;AAAA,IAC/C,OAAOA,EAAM,aAAa;AAAA,IAC1B,QAAQA,EAAM,aAAa;AAAA,IAC3B,aAAa,EAAE,GAAGA,EAAM,IAAG;AAAA,IAC3B,QAAQ,KAAK;AAAA,MACX,KAAK;AAAA,QACHA,EAAM,OAAO,IAAI,CAACW,MAAM;AACtB,gBAAMhB,IAAI,EAAE,GAAGgB,EAAC;AAChB,wBAAOhB,EAAE,UACFA;AAAA,QACT,CAAC;AAAA,MACT;AAAA,IACA;AAAA,EACA,IAhBwC;AAiBxC;"}

package/dist/index.es145.js

@@ -0,0 +1,408 @@
+import { supportsContextFilter as H } from "./index.es165.js";
+import { FILTER_CSS as _ } from "./index.es143.js";
+function O(t) {
+  const { adj: e } = t;
+  let n = `brightness(${e.brightness}%) contrast(${e.contrast}%) saturate(${e.saturate}%) sepia(${e.sepia}%) blur(${e.blur}px) hue-rotate(${e.hue}deg)`;
+  return e.filter !== "none" && (n += " " + _[e.filter]), n.trim();
+}
+const W = 0.25, $ = 4, E = 1.25;
+function I(t) {
+  const n = Math.min(
+    (t.stageEl.clientWidth - 48) / t.sourceCanvas.width,
+    (t.stageEl.clientHeight - 48) / t.sourceCanvas.height,
+    1
+  );
+  t.fitScale = n;
+  const o = n * t.zoom;
+  t.viewScale = o;
+  const r = Math.round(t.sourceCanvas.width * o), a = Math.round(t.sourceCanvas.height * o);
+  t.canvasEl.style.width = t.overlayEl.style.width = r + "px", t.canvasEl.style.height = t.overlayEl.style.height = a + "px";
+}
+function g(t, e) {
+  if (t.zoom = Math.min($, Math.max(W, e)), !t.mounted || !t.sourceCanvas.width) {
+    t.notify();
+    return;
+  }
+  I(t), C(t), t.notify();
+}
+function oe(t) {
+  g(t, t.zoom * E);
+}
+function ie(t) {
+  g(t, t.zoom / E);
+}
+function ae(t) {
+  g(t, 1);
+}
+function le(t) {
+  t.canvasEl.width = t.overlayEl.width = t.sourceCanvas.width, t.canvasEl.height = t.overlayEl.height = t.sourceCanvas.height, I(t);
+}
+function B(t) {
+  const { ctx: e, canvasEl: n, sourceCanvas: o } = t;
+  e.clearRect(0, 0, n.width, n.height);
+  const r = O(t);
+  if (H()) {
+    n.style.filter = "", e.filter = r, e.drawImage(o, 0, 0), e.filter = "none";
+    return;
+  }
+  n.style.filter = r, e.drawImage(o, 0, 0);
+}
+function re(t) {
+  !t.mounted || !t.sourceCanvas.width || (B(t), C(t));
+}
+const m = 1.1;
+function P(t, e) {
+  t.octx.font = `${e.size}px ${e.font}`;
+  const n = Math.max(e.boxWidth, 1), o = [];
+  return e.text.split(`
+`).forEach((r) => {
+    const a = r.split(" ");
+    let i = "";
+    a.forEach((l) => {
+      const s = i ? i + " " + l : l;
+      i && t.octx.measureText(s).width > n ? (o.push(i), i = l) : i = s;
+    }), o.push(i);
+  }), o;
+}
+function y(t, e) {
+  if (e.type === "text") {
+    const n = P(t, e);
+    return {
+      x: e.x,
+      y: e.y,
+      w: e.boxWidth,
+      h: n.length * e.size * m
+    };
+  }
+  if (e.type === "shape" && G(e)) {
+    let n = 1 / 0, o = 1 / 0, r = -1 / 0, a = -1 / 0;
+    e.points.forEach((l) => {
+      n = Math.min(n, l.x), o = Math.min(o, l.y), r = Math.max(r, l.x), a = Math.max(a, l.y);
+    });
+    const i = (e.width || 6) / 2;
+    return { x: n - i, y: o - i, w: r - n + i * 2, h: a - o + i * 2 };
+  }
+  if (e.type === "shape" || e.type === "sticker")
+    return {
+      x: Math.min(e.x, e.x + e.w),
+      y: Math.min(e.y, e.y + e.h),
+      w: Math.abs(e.w),
+      h: Math.abs(e.h)
+    };
+  if (e.type === "stroke") {
+    let n = 1 / 0, o = 1 / 0, r = -1 / 0, a = -1 / 0;
+    e.points.forEach((l) => {
+      n = Math.min(n, l.x), o = Math.min(o, l.y), r = Math.max(r, l.x), a = Math.max(a, l.y);
+    });
+    const i = e.width / 2;
+    return { x: n - i, y: o - i, w: r - n + i * 2, h: a - o + i * 2 };
+  }
+  return { x: 0, y: 0, w: 0, h: 0 };
+}
+function se(t, e) {
+  if (e.type !== "text") return;
+  const n = t.sourceCanvas.height - e.y;
+  for (; e.size > 10 && y(t, e).h > n && n > 0; )
+    e.size -= 1;
+}
+function he(t, e) {
+  if (e.type !== "text") return;
+  const n = t.sourceCanvas.width - e.x;
+  e.boxWidth = Math.round(Math.max(20, Math.min(e.boxWidth, n)));
+}
+function A(t) {
+  return [
+    { corner: "tl", x: t.x, y: t.y },
+    { corner: "tr", x: t.x + t.w, y: t.y },
+    { corner: "bl", x: t.x, y: t.y + t.h },
+    { corner: "br", x: t.x + t.w, y: t.y + t.h }
+  ];
+}
+const b = [
+  "line",
+  "dashedLine",
+  "arrow",
+  "dashedArrow",
+  "doubleArrow",
+  "dashedDoubleArrow"
+], N = ["dashedLine", "dashedArrow", "dashedDoubleArrow"], fe = ["line", "dashedLine"], F = {
+  arrow: ["end"],
+  dashedArrow: ["end"],
+  doubleArrow: ["end", "start"],
+  dashedDoubleArrow: ["end", "start"]
+}, U = 10, T = 42;
+function Z(t) {
+  return t.points && t.points.length >= 2 ? t.points : [
+    { x: t.x, y: t.y },
+    { x: t.x + t.w, y: t.y + t.h }
+  ];
+}
+function G(t) {
+  return !!(t.points && t.points.length >= 2);
+}
+function q(t, e, n) {
+  const o = e && t.length > 2 ? t.concat([t[0]]) : t;
+  let r = 0;
+  const a = [];
+  for (let l = 0; l < o.length - 1; l++) {
+    const s = Math.hypot(o[l + 1].x - o[l].x, o[l + 1].y - o[l].y);
+    a.push(s), r += s;
+  }
+  if (!r) return { x: o[0].x, y: o[0].y, angle: 0 };
+  let i = r * Math.min(Math.max(n, 0), 1);
+  for (let l = 0; l < a.length; l++) {
+    if (i <= a[l] || l === a.length - 1) {
+      const s = a[l] ? i / a[l] : 0;
+      return {
+        x: o[l].x + (o[l + 1].x - o[l].x) * s,
+        y: o[l].y + (o[l + 1].y - o[l].y) * s,
+        angle: Math.atan2(o[l + 1].y - o[l].y, o[l + 1].x - o[l].x)
+      };
+    }
+    i -= a[l];
+  }
+  return { x: o[0].x, y: o[0].y, angle: 0 };
+}
+function J(t, e, n) {
+  if (!e.label) return;
+  const o = e.labelSize || T, r = q(n, e.closed, e.labelPos ?? 0.5), a = e.labelRotate !== !1, i = e.labelSide === "below" ? -1 : 1, l = e.labelOffset ?? U, s = (e.width || 6) / 2 + l;
+  let h = a ? r.angle : 0, c = !1;
+  a && (h > Math.PI / 2 || h < -Math.PI / 2) && (h += Math.PI, c = !0);
+  const f = i * (c ? -1 : 1), d = Math.sin(r.angle) * s * f, u = -Math.cos(r.angle) * s * f;
+  t.save(), t.translate(r.x + d, r.y + u), t.rotate(h), t.font = `${o}px ${e.labelFont || "Avenir Next, Segoe UI, sans-serif"}`, t.fillStyle = e.labelColor || e.color, t.textAlign = "center", t.textBaseline = i === 1 ? "bottom" : "top", t.setLineDash([]), t.shadowColor = "rgba(0,0,0,.25)", t.shadowBlur = o * 0.08, t.fillText(e.label, 0, 0), t.restore();
+}
+function V(t) {
+  const e = Math.max(1, t || 1);
+  return [Math.max(6, e * 2.5), Math.max(4, e * 1.75)];
+}
+function v(t, e, n, o, r) {
+  t.beginPath(), t.moveTo(e, n), t.lineTo(
+    e - r * Math.cos(o - Math.PI / 6),
+    n - r * Math.sin(o - Math.PI / 6)
+  ), t.moveTo(e, n), t.lineTo(
+    e - r * Math.cos(o + Math.PI / 6),
+    n - r * Math.sin(o + Math.PI / 6)
+  ), t.stroke();
+}
+function p(t, e, n) {
+  if (!e.label) return;
+  const o = e.labelSize || T;
+  t.save(), t.font = `${o}px ${e.labelFont || "Avenir Next, Segoe UI, sans-serif"}`, t.fillStyle = e.labelColor || j(e), t.textAlign = "center", t.textBaseline = "middle", t.setLineDash([]);
+  const r = Math.max(20, Math.abs(n.w) - o * 0.6), a = [];
+  let i = "";
+  e.label.split(/\s+/).forEach((c) => {
+    const f = i ? i + " " + c : c;
+    t.measureText(f).width > r && i ? (a.push(i), i = c) : i = f;
+  }), i && a.push(i);
+  const l = o * m, s = n.x + n.w / 2 + (e.labelDx || 0), h = n.y + n.h / 2 + (e.labelDy || 0) - (a.length - 1) * l / 2;
+  a.forEach((c, f) => t.fillText(c, s, h + f * l)), t.restore();
+}
+function j(t) {
+  if (t.fill !== "fill") return t.color;
+  const e = (t.color || "#111111").replace("#", "");
+  if (e.length < 6) return "#ffffff";
+  const n = parseInt(e.slice(0, 2), 16), o = parseInt(e.slice(2, 4), 16), r = parseInt(e.slice(4, 6), 16);
+  return 0.299 * n + 0.587 * o + 0.114 * r > 150 ? "#111111" : "#ffffff";
+}
+const K = 26, Q = 6;
+function x(t, e) {
+  const n = y(t, e);
+  return { x: n.x + n.w / 2, y: n.y + n.h / 2 };
+}
+function M(t, e, n) {
+  if (!n) return { x: t.x, y: t.y };
+  const o = n * Math.PI / 180, r = Math.cos(o), a = Math.sin(o), i = t.x - e.x, l = t.y - e.y;
+  return { x: e.x + i * r - l * a, y: e.y + i * a + l * r };
+}
+function ce(t, e, n, o) {
+  const r = e.rotation || 0;
+  if (!r) {
+    o();
+    return;
+  }
+  const a = M(n, x(t, e), r);
+  o();
+  const i = M(n, x(t, e), r);
+  e.x += a.x - i.x, e.y += a.y - i.y;
+}
+function X(t, e, n) {
+  return M(n, x(t, e), -(e.rotation || 0));
+}
+function k(t, e) {
+  const n = y(t, e);
+  return {
+    x: n.x + n.w / 2,
+    y: n.y + n.h + K / t.viewScale
+  };
+}
+function Y(t, e) {
+  const n = k(t, e);
+  return M(n, x(t, e), e.rotation || 0);
+}
+function ye(t, e, n) {
+  const o = Y(t, n);
+  return Math.hypot(e.x - o.x, e.y - o.y) <= 14 / t.viewScale;
+}
+function xe(t, e, n) {
+  if (n.type === "stroke") return null;
+  const o = 12 / t.viewScale, r = X(t, n, e);
+  if (n.type === "shape" && b.includes(n.shape)) {
+    const s = [
+      { corner: "start", x: n.x, y: n.y },
+      { corner: "end", x: n.x + n.w, y: n.y + n.h }
+    ].find(
+      (h) => Math.abs(r.x - h.x) < o && Math.abs(r.y - h.y) < o
+    );
+    return s ? s.corner : null;
+  }
+  const a = y(t, n), i = A(a).find(
+    (l) => Math.abs(r.x - l.x) < o && Math.abs(r.y - l.y) < o
+  );
+  return i ? i.corner : null;
+}
+function S(t, e, n) {
+  if (!n._editing) {
+    if (e.save(), n.type !== "stroke" || n.rotation) {
+      const o = y(t, n), r = o.x + o.w / 2, a = o.y + o.h / 2;
+      e.translate(r, a), n.rotation && e.rotate(n.rotation * Math.PI / 180), (n.flipH || n.flipV) && e.scale(n.flipH ? -1 : 1, n.flipV ? -1 : 1), e.translate(-r, -a);
+    }
+    if (n.type === "text") {
+      e.font = `${n.size}px ${n.font}`, e.fillStyle = n.color, e.textBaseline = "top", e.shadowColor = "rgba(0,0,0,.22)", e.shadowBlur = n.size * 0.05, e.shadowOffsetY = n.size * 0.02;
+      const o = n.size * m;
+      P(t, n).forEach((r, a) => {
+        e.fillText(r, n.x, n.y + a * o);
+      });
+    } else if (n.type === "shape") {
+      e.strokeStyle = n.color, e.fillStyle = n.color, e.lineWidth = n.width, e.lineCap = "round", e.lineJoin = "round";
+      const o = n.x, r = n.y, a = n.w, i = n.h, l = { x: o, y: r, w: a, h: i };
+      if (n.shape === "rect")
+        n.fill === "fill" ? e.fillRect(o, r, a, i) : e.strokeRect(o, r, a, i), p(e, n, l);
+      else if (n.shape === "ellipse")
+        e.beginPath(), e.ellipse(
+          o + a / 2,
+          r + i / 2,
+          Math.abs(a / 2),
+          Math.abs(i / 2),
+          0,
+          0,
+          Math.PI * 2
+        ), n.fill === "fill" ? e.fill() : e.stroke(), p(e, n, l);
+      else if (n.shape === "circle") {
+        const s = Math.min(Math.abs(a), Math.abs(i)) / 2;
+        e.beginPath(), e.arc(o + a / 2, r + i / 2, s, 0, Math.PI * 2), n.fill === "fill" ? e.fill() : e.stroke(), p(e, n, {
+          x: o + a / 2 - s,
+          y: r + i / 2 - s,
+          w: s * 2,
+          h: s * 2
+        });
+      } else if (b.includes(n.shape)) {
+        const s = Z(n), h = N.includes(n.shape);
+        if (h && (e.lineCap = "butt", e.setLineDash(V(n.width))), e.beginPath(), s.forEach(
+          (c, f) => f === 0 ? e.moveTo(c.x, c.y) : e.lineTo(c.x, c.y)
+        ), n.closed && s.length > 2 && e.closePath(), n.closed && s.length > 2 && n.fill === "fill" && (e.setLineDash([]), e.fill()), e.stroke(), h && (e.setLineDash([]), e.lineCap = "round"), !n.closed) {
+          const c = Math.max(14, n.width * 3), f = s[0], d = s[1], u = s[s.length - 2], w = s[s.length - 1], R = Math.atan2(w.y - u.y, w.x - u.x), z = Math.atan2(f.y - d.y, f.x - d.x);
+          (F[n.shape] || []).forEach((D) => {
+            D === "end" ? v(e, w.x, w.y, R, c) : v(e, f.x, f.y, z, c);
+          });
+        }
+        n.closed && s.length > 2 ? p(e, n, y(t, n)) : J(e, n, s);
+      }
+    } else if (n.type === "stroke")
+      e.strokeStyle = n.color, e.lineWidth = n.width, e.lineCap = "round", e.lineJoin = "round", e.globalAlpha = n.style === "highlight" ? 0.35 : 1, e.beginPath(), n.points.forEach(
+        (o, r) => r === 0 ? e.moveTo(o.x, o.y) : e.lineTo(o.x, o.y)
+      ), n.points.length === 1 && e.lineTo(n.points[0].x + 0.1, n.points[0].y + 0.1), e.stroke();
+    else if (n.type === "sticker") {
+      const o = t.stickerImageCache.get(n.src);
+      o && o.complete && o.naturalWidth && e.drawImage(o, n.x, n.y, n.w, n.h);
+    }
+    e.restore();
+  }
+}
+function L(t) {
+  return {
+    x: Math.min(t.x, t.x + t.w),
+    y: Math.min(t.y, t.y + t.h),
+    w: Math.abs(t.w),
+    h: Math.abs(t.h)
+  };
+}
+function ee(t) {
+  const { cropRect: e, overlayEl: n, octx: o, sourceCanvas: r } = t;
+  if (!e) return;
+  const a = L(e), i = n.width, l = n.height;
+  o.save(), o.fillStyle = "rgba(0,0,0,.45)", o.fillRect(0, 0, i, Math.max(0, a.y)), o.fillRect(0, Math.min(l, a.y + a.h), i, Math.max(0, l - (a.y + a.h))), o.fillRect(0, a.y, Math.max(0, a.x), a.h), o.fillRect(Math.min(i, a.x + a.w), a.y, Math.max(0, i - (a.x + a.w)), a.h), o.strokeStyle = "#fff", o.lineWidth = Math.max(1, r.width / 500), o.setLineDash([8, 6]), o.strokeRect(a.x, a.y, a.w, a.h), o.restore();
+}
+function C(t) {
+  const { octx: e, overlayEl: n, layers: o, mode: r, selectedId: a } = t;
+  if (e.clearRect(0, 0, n.width, n.height), o.forEach((i) => {
+    try {
+      S(t, e, i);
+    } catch (l) {
+      console.error("[image-editor] failed to paint layer", i.id, i.type, l);
+    }
+  }), r === "select" && a != null) {
+    const i = o.find((l) => l.id === a);
+    if (i) {
+      const l = y(t, i);
+      if (e.save(), i.rotation) {
+        const h = x(t, i);
+        e.translate(h.x, h.y), e.rotate(i.rotation * Math.PI / 180), e.translate(-h.x, -h.y);
+      }
+      if (e.strokeStyle = "#2f5fd2", e.lineWidth = Math.max(1.2, 1.5 / t.viewScale), e.setLineDash([6 / t.viewScale, 4 / t.viewScale]), e.strokeRect(l.x - 4, l.y - 4, l.w + 8, l.h + 8), e.setLineDash([]), i.type !== "stroke") {
+        const h = 9 / t.viewScale;
+        e.fillStyle = "#fff", e.strokeStyle = "#2f5fd2", (i.type === "shape" && b.includes(i.shape) ? [
+          { x: i.x, y: i.y },
+          { x: i.x + i.w, y: i.y + i.h }
+        ] : A(l)).forEach((f) => {
+          e.fillRect(f.x - h / 2, f.y - h / 2, h, h), e.strokeRect(f.x - h / 2, f.y - h / 2, h, h);
+        });
+      }
+      const s = k(t, i);
+      e.strokeStyle = "#2f5fd2", e.fillStyle = "#fff", e.beginPath(), e.moveTo(s.x, l.y + l.h + 4), e.lineTo(s.x, s.y), e.stroke(), e.beginPath(), e.arc(
+        s.x,
+        s.y,
+        Q / t.viewScale,
+        0,
+        Math.PI * 2
+      ), e.fill(), e.stroke(), e.restore();
+    }
+  }
+  t.pendingShape && S(t, e, t.pendingShape), r === "crop" && t.cropRect && ee(t);
+}
+export {
+  T as DEFAULT_LABEL_SIZE,
+  b as DIRECTIONAL_SHAPES,
+  U as LABEL_GAP,
+  fe as MULTI_POINT_SHAPES,
+  m as TEXT_LINE_HEIGHT,
+  $ as ZOOM_MAX,
+  W as ZOOM_MIN,
+  g as applyZoom,
+  O as baseFilter,
+  he as clampBoxWidth,
+  se as clampTextSize,
+  A as cornerPoints,
+  Z as directionalPoints,
+  ee as drawCropOverlay,
+  I as fitStage,
+  G as isMultiPoint,
+  ce as keepingFixed,
+  y as layerBounds,
+  x as layerCenter,
+  L as normRect,
+  xe as onResizeHandle,
+  ye as onRotateHandle,
+  S as paintLayer,
+  q as pathPointAt,
+  re as render,
+  B as renderBase,
+  C as renderOverlay,
+  M as rotatePoint,
+  le as syncCanvasSize,
+  X as toLayerSpace,
+  P as wrapTextLines,
+  oe as zoomIn,
+  ie as zoomOut,
+  ae as zoomToFit
+};
+//# sourceMappingURL=index.es145.js.map