@frigate-nvr/image-annotator 1.0.0

package/dist/components/ImageAnnotator.js

@@ -0,0 +1,642 @@
+import { jsxs as D, Fragment as oe, jsx as i } from "react/jsx-runtime";
+import { useRef as B, useEffect as te, useMemo as ce, useState as O, Fragment as ae } from "react";
+import { Button as v } from "./Button.js";
+import { Crosshairs as se } from "./Crosshairs.js";
+import { InfoDialog as de } from "./InfoDialog.js";
+import { LabelDialog as ue } from "./LabelDialog.js";
+import { VerifyDialog as Z } from "./VerifyDialog.js";
+import { FormElement as he } from "./FormElement.js";
+import { FormElementBox as fe } from "./FormElementBox.js";
+import { BoundingBox as ee, BoundingBoxType as q } from "./BoundingBox.js";
+import { T as me, a as we } from "../index.esm-FeyXGhGs.js";
+function ge(a, y, d) {
+  var f = this, g = B(null), L = B(0), e = B(null), o = B([]), p = B(), b = B(), M = B(a), k = B(!0);
+  M.current = a;
+  var A = typeof window < "u", T = !y && y !== 0 && A;
+  if (typeof a != "function") throw new TypeError("Expected a function");
+  y = +y || 0;
+  var I = !!(d = d || {}).leading, X = !("trailing" in d) || !!d.trailing, N = "maxWait" in d, j = "debounceOnServer" in d && !!d.debounceOnServer, W = N ? Math.max(+d.maxWait || 0, y) : null;
+  te(function() {
+    return k.current = !0, function() {
+      k.current = !1;
+    };
+  }, []);
+  var V = ce(function() {
+    var F = function(u) {
+      var m = o.current, R = p.current;
+      return o.current = p.current = null, L.current = u, b.current = M.current.apply(R, m);
+    }, S = function(u, m) {
+      T && cancelAnimationFrame(e.current), e.current = T ? requestAnimationFrame(u) : setTimeout(u, m);
+    }, _ = function(u) {
+      if (!k.current) return !1;
+      var m = u - g.current;
+      return !g.current || m >= y || m < 0 || N && u - L.current >= W;
+    }, U = function(u) {
+      return e.current = null, X && o.current ? F(u) : (o.current = p.current = null, b.current);
+    }, P = function u() {
+      var m = Date.now();
+      if (_(m)) return U(m);
+      if (k.current) {
+        var R = y - (m - g.current), C = N ? Math.min(R, W - (m - L.current)) : R;
+        S(u, C);
+      }
+    }, z = function() {
+      if (A || j) {
+        var u = Date.now(), m = _(u);
+        if (o.current = [].slice.call(arguments), p.current = f, g.current = u, m) {
+          if (!e.current && k.current) return L.current = g.current, S(P, y), I ? F(g.current) : b.current;
+          if (N) return S(P, y), F(g.current);
+        }
+        return e.current || S(P, y), b.current;
+      }
+    };
+    return z.cancel = function() {
+      e.current && (T ? cancelAnimationFrame(e.current) : clearTimeout(e.current)), L.current = 0, o.current = g.current = p.current = e.current = null;
+    }, z.isPending = function() {
+      return !!e.current;
+    }, z.flush = function() {
+      return e.current ? U(Date.now()) : b.current;
+    }, z;
+  }, [I, N, y, W, X, T, A, j]);
+  return V;
+}
+const ke = (a) => {
+  var G;
+  const y = [
+    { codes: ["?"], action: "Shortcut help" },
+    { codes: ["w"], action: "Add Box" },
+    { codes: ["d"], action: "Mark Difficult" },
+    { codes: ["s"], action: "Cycle Label" },
+    { codes: ["Tab"], action: "Select Next Box" },
+    { codes: ["Del"], action: "Delete Box" },
+    { codes: ["Esc"], action: "Deselect/Cancel" },
+    { codes: ["← ↑ → ↓"], action: "Move Box" },
+    { codes: ["Shift", "← ↑ → ↓"], action: "Resize Box" },
+    { codes: ["f"], action: "Toggle Unselected Boxes" },
+    { codes: ["Spacebar"], action: "Verify and Save" }
+  ], [d, f] = O([]), [g, L] = O([]), [e, o] = O({
+    createMode: !1,
+    drawingMode: !1,
+    showBoxes: !0,
+    showLabeler: !1,
+    showHelp: !1,
+    showVerify: !1,
+    showDelete: !1,
+    showConfirmDeleteFalsePositive: !1,
+    showTutorial: a.userAnnotationCount === 0,
+    drawStartX: 0,
+    drawStartY: 0,
+    selectedLabel: a.labels[0],
+    difficult: !1,
+    width: 1,
+    height: 1
+  }), p = B(null), b = B(null), M = B(null), k = () => {
+    var w, x, H, K;
+    let t = 4;
+    const r = ((w = p.current) == null ? void 0 : w.naturalHeight) ?? 0, n = ((x = p.current) == null ? void 0 : x.naturalWidth) ?? 0, c = Math.round(r * t), l = ((H = b.current) == null ? void 0 : H.getBoundingClientRect().height) ?? 0;
+    c > l - 10 && (t = (l - 10) / r);
+    const h = Math.round(n * t), s = ((K = b.current) == null ? void 0 : K.getBoundingClientRect().width) ?? 0;
+    h > s - 10 && (t = (s - 10) / n), o({
+      ...e,
+      width: Math.round(n * t),
+      height: Math.round(r * t)
+    });
+  }, A = ge(() => {
+    k();
+  }, 200);
+  te(() => {
+    var t, r;
+    return window.addEventListener("resize", A), (r = (t = b.current) == null ? void 0 : t.parentElement) == null || r.focus(), () => {
+      window.removeEventListener("resize", A);
+    };
+  }, [A]);
+  const T = (t, r, n) => {
+    f(
+      (c) => c.map((l) => l.id === n ? {
+        ...l,
+        x: r.x / e.width,
+        y: r.y / e.height,
+        w: t.offsetWidth / e.width,
+        h: t.offsetHeight / e.height
+      } : l)
+    );
+  }, I = (t, r) => {
+    f(
+      (n) => n.map((c) => c.id === r ? {
+        ...c,
+        x: t.x / e.width,
+        y: t.y / e.height
+      } : c)
+    );
+  }, X = (t) => {
+    var r, n;
+    if (e.createMode) {
+      const c = ((r = M.current) == null ? void 0 : r.instance.transformState.scale) ?? 1, l = (n = p.current) == null ? void 0 : n.getBoundingClientRect(), h = (t.clientX - ((l == null ? void 0 : l.left) ?? 0)) / c / e.width, s = (t.clientY - ((l == null ? void 0 : l.top) ?? 0)) / c / e.height;
+      o({
+        ...e,
+        drawingMode: !0,
+        drawStartX: h,
+        drawStartY: s,
+        selectedBox: "draft"
+      }), f((w) => [
+        ...w,
+        {
+          id: "draft",
+          x: h,
+          y: s,
+          w: 0,
+          h: 0
+        }
+      ]);
+    } else
+      o({ ...e, selectedBox: void 0 });
+  }, N = (t) => {
+    if (e.drawingMode) {
+      const r = Date.now().toString();
+      o({
+        ...e,
+        drawingMode: !1,
+        createMode: !1,
+        selectedBox: r
+      }), f(
+        (n) => n.reduce((c, l) => {
+          var h, s;
+          if (l.id === "draft") {
+            const w = ((h = M.current) == null ? void 0 : h.instance.transformState.scale) ?? 1, x = (s = p.current) == null ? void 0 : s.getBoundingClientRect(), H = (t.clientX - ((x == null ? void 0 : x.left) ?? 0)) / w / e.width, K = (t.clientY - ((x == null ? void 0 : x.top) ?? 0)) / w / e.height;
+            if (Math.min(
+              Math.abs(e.drawStartX - H),
+              Math.abs(e.drawStartY - K)
+            ) > 1e-3) {
+              let Y = Math.min(e.drawStartX, H), E = Math.min(e.drawStartY, K), J = Math.abs(e.drawStartX - H), Q = Math.abs(e.drawStartY - K);
+              Y < 0 && (J -= Math.abs(Y), Y = 0), E < 0 && (Q -= Math.abs(E), E = 0), c.push({
+                ...l,
+                id: r,
+                label: e.selectedLabel,
+                difficult: !1,
+                x: Y,
+                y: E,
+                w: Math.min(1 - Y, J),
+                h: Math.min(1 - E, Q)
+              });
+            }
+          } else
+            c.push(l);
+          return c;
+        }, [])
+      );
+    }
+  }, j = (t) => {
+    e.drawingMode && f(
+      (r) => r.map((n) => {
+        var c, l;
+        if (n.id === "draft") {
+          const h = ((c = M.current) == null ? void 0 : c.instance.transformState.scale) ?? 1, s = (l = p.current) == null ? void 0 : l.getBoundingClientRect(), w = (t.pageX - ((s == null ? void 0 : s.left) ?? 0)) / h / e.width, x = (t.pageY - ((s == null ? void 0 : s.top) ?? 0)) / h / e.height;
+          return {
+            ...n,
+            x: Math.min(e.drawStartX, w),
+            y: Math.min(e.drawStartY, x),
+            w: Math.abs(e.drawStartX - w),
+            h: Math.abs(e.drawStartY - x)
+          };
+        }
+        return n;
+      })
+    );
+  }, W = () => {
+    o({ ...e, createMode: !e.createMode });
+  }, V = (t) => {
+    const r = d.find((n) => n.id === t);
+    o({
+      ...e,
+      selectedBox: t,
+      selectedLabel: (r == null ? void 0 : r.label) ?? e.selectedLabel,
+      difficult: (r == null ? void 0 : r.difficult) ?? e.difficult
+    });
+  }, F = (t, r, n) => {
+    f(
+      (c) => c.map((l) => l.id === t ? {
+        ...l,
+        x: Math.min(
+          1 - l.w,
+          Math.max(0, l.x + n / e.width)
+        ),
+        y: Math.min(
+          1 - l.h,
+          Math.max(0, l.y + r / e.height)
+        )
+      } : l)
+    );
+  }, S = (t, r, n) => {
+    f(
+      (c) => c.map((l) => l.id === t ? {
+        ...l,
+        w: Math.min(1 - l.x, l.w + n / e.width),
+        h: Math.min(1 - l.y, l.h + r / e.height)
+      } : l)
+    );
+  }, _ = (t) => {
+    f(
+      (r) => r.map((n) => n.id === t ? {
+        ...n,
+        difficult: !n.difficult
+      } : n)
+    );
+  }, U = (t, r = !1) => {
+    const n = a.labels.findIndex(
+      (s) => e.selectedLabel === s
+    ), c = a.labels.length - 1;
+    let l = 0;
+    r ? l = n === 0 ? c : n - 1 : l = n === c ? 0 : n + 1;
+    const h = a.labels[l];
+    f(
+      (s) => s.map((w) => w.id === t ? {
+        ...w,
+        label: h
+      } : w)
+    ), o({ ...e, selectedLabel: h });
+  }, P = (t) => {
+    f((r) => r.filter((n) => n.id !== t));
+  }, z = (t) => {
+    L((r) => r.filter((n) => n.id !== t));
+  }, u = (t) => {
+    var r;
+    return (r = g.find((n) => n.id === t)) == null ? void 0 : r.label;
+  }, m = (t) => d.find((r) => r.id === t), R = (t) => {
+    if (!t)
+      return d[0].id;
+    const r = d.findIndex((n) => n.id === t);
+    return r === d.length - 1 ? d[0].id : d[r + 1].id;
+  }, C = 5 / (((G = M.current) == null ? void 0 : G.instance.transformState.scale) ?? 1), ne = (t) => {
+    if (t.code === "Escape" && (e.createMode ? o({ ...e, createMode: !1 }) : o({ ...e, selectedBox: void 0 })), t.code === "KeyW" && (e.createMode ? o({ ...e, createMode: !1 }) : o({ ...e, createMode: !0, selectedBox: void 0 })), t.code === "KeyF" && o({ ...e, showBoxes: !e.showBoxes }), t.code === "KeyD" && e.selectedBox && _(e.selectedBox), t.code === "KeyS" && e.selectedBox && U(e.selectedBox, t.shiftKey), t.code === "Delete" && e.selectedBox && (P(e.selectedBox), o({ ...e, selectedBox: void 0 })), t.code === "Tab") {
+      const r = R(e.selectedBox), n = m(r);
+      o({
+        ...e,
+        selectedBox: r,
+        selectedLabel: (n == null ? void 0 : n.label) ?? e.selectedLabel
+      }), t.preventDefault();
+    }
+    t.code === "Space" && a.save(d, g.length === 0, a.labels), t.code === "Slash" && t.shiftKey && o({ ...e, showHelp: !0 }), e.selectedBox && (t.code === "ArrowLeft" && (t.shiftKey ? S(e.selectedBox, 0, -C) : F(e.selectedBox, 0, -C)), t.code === "ArrowRight" && (t.shiftKey ? S(e.selectedBox, 0, C) : F(e.selectedBox, 0, C)), t.code === "ArrowUp" && (t.shiftKey ? S(e.selectedBox, -C, 0) : F(e.selectedBox, -C, 0)), t.code === "ArrowDown" && (t.shiftKey ? S(e.selectedBox, C, 0) : F(e.selectedBox, C, 0)));
+  }, re = (t) => {
+    k(), f(
+      a.annotations.concat(a.suggestions).sort((r, n) => n.w * n.h - r.w * r.h)
+    ), L(a.falsePositives.sort((r, n) => n.w * n.h - r.w * r.h));
+  }, ie = () => {
+    o({ ...e, showLabeler: !1 }), f(
+      (t) => t.map((r) => r.id === e.selectedBox ? {
+        ...r,
+        label: e.selectedLabel,
+        difficult: e.difficult
+      } : r)
+    );
+  }, le = () => {
+    o({ ...e, showLabeler: !1 }), f((t) => t.filter((r) => r.label));
+  }, $ = e.showBoxes ? 0 : -1;
+  return /* @__PURE__ */ D(oe, { children: [
+    /* @__PURE__ */ i(me, { ref: M, disabled: e.createMode || e.drawingMode, children: ({ zoomIn: t, zoomOut: r }) => /* @__PURE__ */ D(
+      "div",
+      {
+        className: "flex h-screen min-w-[600px] flex-col overflow-hidden bg-slate-900",
+        onKeyDown: ne,
+        tabIndex: 0,
+        children: [
+          /* @__PURE__ */ D("div", { className: "flex flex-initial bg-slate-300 p-1", children: [
+            /* @__PURE__ */ i("div", { className: "flex-initial", children: /* @__PURE__ */ i("button", { type: "button", onClick: a.back, children: /* @__PURE__ */ i(v, { secondary: !0, sm: !0, children: "Back" }) }) }),
+            /* @__PURE__ */ D("div", { className: "flex flex-auto justify-center", children: [
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    r();
+                  },
+                  children: /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
+                    "svg",
+                    {
+                      xmlns: "http://www.w3.org/2000/svg",
+                      className: "h-6 w-6",
+                      fill: "none",
+                      viewBox: "0 0 24 24",
+                      stroke: "currentColor",
+                      children: /* @__PURE__ */ i(
+                        "path",
+                        {
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          strokeWidth: "2",
+                          d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM13 10H7"
+                        }
+                      )
+                    }
+                  ) })
+                }
+              ),
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    t();
+                  },
+                  children: /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
+                    "svg",
+                    {
+                      xmlns: "http://www.w3.org/2000/svg",
+                      className: "h-6 w-6",
+                      fill: "none",
+                      viewBox: "0 0 24 24",
+                      stroke: "currentColor",
+                      children: /* @__PURE__ */ i(
+                        "path",
+                        {
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          strokeWidth: "2",
+                          d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM10 7v3m0 0v3m0-3h3m-3 0H7"
+                        }
+                      )
+                    }
+                  ) })
+                }
+              ),
+              /* @__PURE__ */ i("button", { type: "button", onClick: W, children: /* @__PURE__ */ i(v, { secondary: !0, sm: !0, children: "Add (w)" }) })
+            ] }),
+            /* @__PURE__ */ D("div", { className: "flex-initial", children: [
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  onClick: () => {
+                    o({ ...e, showVerify: !0 });
+                  },
+                  children: /* @__PURE__ */ i(v, { sm: !0, children: "Verify & Save" })
+                }
+              ),
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  onClick: () => {
+                    a.save(d, g.length === 0, []);
+                  },
+                  children: /* @__PURE__ */ i(v, { green: !0, sm: !0, children: "Save" })
+                }
+              ),
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  onClick: () => {
+                    o({ ...e, showDelete: !0 });
+                  },
+                  children: /* @__PURE__ */ i(v, { red: !0, sm: !0, children: "Delete" })
+                }
+              ),
+              /* @__PURE__ */ i(
+                "button",
+                {
+                  onClick: () => {
+                    o({ ...e, showHelp: !0 });
+                  },
+                  children: /* @__PURE__ */ i(v, { sm: !0, secondary: !0, children: "?" })
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ i(
+            "div",
+            {
+              ref: b,
+              className: "grid flex-auto place-content-center",
+              children: /* @__PURE__ */ i(we, { children: /* @__PURE__ */ D(
+                "div",
+                {
+                  className: "grid place-content-center",
+                  onMouseDown: X,
+                  onMouseUp: N,
+                  onMouseMove: j,
+                  children: [
+                    /* @__PURE__ */ i(
+                      "img",
+                      {
+                        ref: p,
+                        className: "col-start-1 row-start-1 h-full w-full",
+                        alt: "annotate",
+                        src: a.imageUrl,
+                        onLoad: re,
+                        style: {
+                          width: e.width,
+                          height: e.height
+                        }
+                      }
+                    ),
+                    g.map((n) => {
+                      var c;
+                      return /* @__PURE__ */ i(
+                        ee,
+                        {
+                          type: q.falsePositive,
+                          label: n.label ?? "",
+                          zIndex: n.id === e.selectedBox ? 1 : $,
+                          x: n.x * e.width,
+                          y: n.y * e.height,
+                          w: n.w * e.width,
+                          h: n.h * e.height,
+                          initialScale: (c = M.current) == null ? void 0 : c.instance.transformState.scale,
+                          selected: n.id === e.selectedBox,
+                          onMouseDown: (l) => {
+                            e.createMode || (V(n.id), l.stopPropagation());
+                          },
+                          onClickDelete: () => {
+                            o({
+                              ...e,
+                              showConfirmDeleteFalsePositive: !0
+                            });
+                          }
+                        },
+                        n.id
+                      );
+                    }),
+                    d.map((n) => {
+                      var c;
+                      return /* @__PURE__ */ i(
+                        ee,
+                        {
+                          type: n.suggestion ? q.suggestion : q.truePositive,
+                          label: n.label ?? "",
+                          difficult: n.difficult,
+                          zIndex: n.id === e.selectedBox ? 1 : $,
+                          x: n.x * e.width,
+                          y: n.y * e.height,
+                          w: n.w * e.width,
+                          h: n.h * e.height,
+                          initialScale: (c = M.current) == null ? void 0 : c.instance.transformState.scale,
+                          selected: n.id === e.selectedBox,
+                          onMouseDown: (l) => {
+                            e.createMode || (V(n.id), l.stopPropagation());
+                          },
+                          onDragStop: (l, h) => {
+                            I(h, n.id);
+                          },
+                          onResizeStop: (l, h, s, w, x) => {
+                            T(s, x, n.id);
+                          },
+                          onClickDelete: () => {
+                            P(n.id);
+                          },
+                          onClickEdit: () => {
+                            o({ ...e, showLabeler: !0 });
+                          }
+                        },
+                        n.id
+                      );
+                    }),
+                    /* @__PURE__ */ i(
+                      se,
+                      {
+                        className: "col-start-1 row-start-1",
+                        show: e.createMode && !e.drawingMode
+                      }
+                    )
+                  ]
+                }
+              ) })
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ i(
+      ue,
+      {
+        title: "Annotate",
+        show: e.showLabeler,
+        cancelText: "Cancel",
+        button: /* @__PURE__ */ i("button", { type: "button", onClick: ie, children: /* @__PURE__ */ i(v, { sm: !0, green: !0, children: "Save" }) }),
+        handleCancel: le,
+        children: /* @__PURE__ */ D("div", { className: "my-2 grid grid-cols-1 gap-y-2", children: [
+          /* @__PURE__ */ i(he, { children: /* @__PURE__ */ i(
+            "select",
+            {
+              value: e.selectedLabel,
+              onChange: (t) => {
+                o({ ...e, selectedLabel: t.target.value });
+              },
+              children: a.labels.map((t) => /* @__PURE__ */ i("option", { value: t, children: t }, t))
+            }
+          ) }),
+          /* @__PURE__ */ i(fe, { htmlFor: "difficult", text: "Difficult?", children: /* @__PURE__ */ i(
+            "input",
+            {
+              id: "difficult",
+              type: "checkbox",
+              checked: e.difficult,
+              onChange: (t) => {
+                o({ ...e, difficult: t.target.checked });
+              }
+            }
+          ) })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ i(
+      de,
+      {
+        title: "Keyboard shortcuts",
+        show: e.showHelp,
+        handleClose: () => {
+          o({ ...e, showHelp: !1 });
+        },
+        children: /* @__PURE__ */ i("div", { className: "grid w-full grid-cols-2 place-content-center gap-2 p-5", children: y.map((t) => /* @__PURE__ */ D(ae, { children: [
+          /* @__PURE__ */ i("div", { children: t.action }),
+          /* @__PURE__ */ i("div", { className: "justify-self-end", children: t.codes.map((r) => /* @__PURE__ */ i(
+            "span",
+            {
+              className: "rounded-md bg-slate-100 p-1 font-mono text-xs shadow-inner",
+              children: r
+            },
+            r
+          )).reduce((r, n) => [r, " + ", n]) })
+        ] }, t.action)) })
+      }
+    ),
+    /* @__PURE__ */ i(
+      Z,
+      {
+        title: "Are all objects in this image labeled?",
+        description: " ",
+        handleCancel: () => {
+          o({ ...e, showVerify: !1 });
+        },
+        show: e.showVerify,
+        cancelText: "Cancel",
+        button: /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              a.save(d, g.length === 0, a.labels), o({ ...e, showVerify: !1 });
+            },
+            children: /* @__PURE__ */ i(v, { sm: !0, green: !0, children: "Yes, all objects are labeled" })
+          }
+        ),
+        children: /* @__PURE__ */ i("ul", { className: "list-inside list-disc", children: a.labels.map((t) => /* @__PURE__ */ i("li", { children: t }, t)) })
+      }
+    ),
+    /* @__PURE__ */ i(
+      Z,
+      {
+        title: "Are you sure you want to delete this image?",
+        description: "",
+        handleCancel: () => {
+          o({ ...e, showDelete: !1 });
+        },
+        show: e.showDelete,
+        cancelText: "Cancel",
+        button: /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              a.delete(), o({ ...e, showDelete: !1 });
+            },
+            children: /* @__PURE__ */ i(v, { sm: !0, red: !0, children: "Yes, permanently delete" })
+          }
+        ),
+        children: "This cannot be undone."
+      }
+    ),
+    /* @__PURE__ */ i(
+      Z,
+      {
+        title: "Are you sure you want to delete this reported false positive?",
+        description: " ",
+        maxWidthClass: "max-w-xl",
+        handleCancel: () => {
+          o({ ...e, showConfirmDeleteFalsePositive: !1 });
+        },
+        show: e.showConfirmDeleteFalsePositive,
+        cancelText: "Cancel",
+        button: /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              e.selectedBox && z(e.selectedBox), o({
+                ...e,
+                showConfirmDeleteFalsePositive: !1,
+                selectedBox: void 0
+              });
+            },
+            children: /* @__PURE__ */ D(v, { sm: !0, red: !0, children: [
+              "Do not teach my model that this is not a",
+              " ",
+              e.selectedBox ? u(e.selectedBox) : " "
+            ] })
+          }
+        ),
+        children: /* @__PURE__ */ i("p", { children: "False positives submitted from Frigate are used to improve your model and should not be deleted unless you submitted them accidentally." })
+      }
+    )
+  ] });
+};
+export {
+  ke as ImageAnnotator
+};
+//# sourceMappingURL=ImageAnnotator.js.map