Upload folder using huggingface_hub

README.md

@@ -1,9 +1,9 @@
 
 ---
 tags: [gradio-custom-component,gradio-template-Image,bounding box,annotator,annotate,boxes]
-title: gradio_image_annotation V0.0.5
-colorFrom: gray
-colorTo: gray
+title: gradio_image_annotation V0.0.6
+colorFrom: blue
+colorTo: red
 sdk: docker
 pinned: false
 license: apache-2.0

app.py

@@ -27,12 +27,7 @@ def crop(annotations):
 
 
 def get_boxes_json(annotations):
-    return [
-        {k: box[k]
-            for k in box if k in ("xmin", "ymin", "xmax", "ymax", "label")}
-        for box in annotations["boxes"]
-    ]
-
+    return annotations["boxes"]
 
 with gr.Blocks() as demo:
     with gr.Tab("Object annotation"):

space.py

@@ -67,12 +67,7 @@ def crop(annotations):
 
 
 def get_boxes_json(annotations):
-    return [
-        {k: box[k]
-            for k in box if k in ("xmin", "ymin", "xmax", "ymax", "label")}
-        for box in annotations["boxes"]
-    ]
-
+    return annotations["boxes"]
 
 with gr.Blocks() as demo:
     with gr.Tab("Object annotation"):

src/Dockerfile

@@ -0,0 +1,12 @@
+# FROM nikolaik/python-nodejs:python3.10-nodejs20-alpine
+FROM node:20.5.0
+
+WORKDIR /app
+
+
+RUN apt-get update && \
+    apt-get install -y python3-pip
+
+RUN rm /usr/lib/python3.11/EXTERNALLY-MANAGED
+
+RUN python3 -m pip install --no-cache-dir gradio==4.27 numpy

src/README.md

@@ -42,12 +42,7 @@ def crop(annotations):
 
 
 def get_boxes_json(annotations):
-    return [
-        {k: box[k]
-            for k in box if k in ("xmin", "ymin", "xmax", "ymax", "label")}
-        for box in annotations["boxes"]
-    ]
-
+    return annotations["boxes"]
 
 with gr.Blocks() as demo:
     with gr.Tab("Object annotation"):

src/backend/gradio_image_annotation/image_annotator.py

@@ -205,19 +205,22 @@ class image_annotator(Component):
         )
 
     def preprocess_boxes(self, boxes: List[dict] | None) -> list:
-        if not boxes:
-            return []
+        parsed_boxes = []
         for box in boxes:
+            new_box = {}
+            new_box["label"] = box.get("label", "")
+            new_box["color"] = (0,0,0)
             if "color" in box:
                 match = re.match(r'rgb\((\d+), (\d+), (\d+)\)', box["color"])
                 if match:
-                    box["color"] = tuple(int(match.group(i)) for i in range(1, 4))
-            scale_factor = box["scaleFactor"] if "scaleFactor" in box else 1
-            box["xmin"] = round(box["xmin"] / scale_factor)
-            box["ymin"] = round(box["ymin"] / scale_factor)
-            box["xmax"] = round(box["xmax"] / scale_factor)
-            box["ymax"] = round(box["ymax"] / scale_factor)
-        return boxes
+                    new_box["color"] = tuple(int(match.group(i)) for i in range(1, 4))
+            scale_factor = box.get("scaleFactor", 1)
+            new_box["xmin"] = round(box["xmin"] / scale_factor)
+            new_box["ymin"] = round(box["ymin"] / scale_factor)
+            new_box["xmax"] = round(box["xmax"] / scale_factor)
+            new_box["ymax"] = round(box["ymax"] / scale_factor)
+            parsed_boxes.append(new_box)
+        return parsed_boxes
 
     def preprocess(self, payload: AnnotatedImageData | None) -> dict | None:
         """

src/backend/gradio_image_annotation/image_annotator.pyi

@@ -196,19 +196,22 @@ class image_annotator(Component):
         )
 
     def preprocess_boxes(self, boxes: List[dict] | None) -> list:
-        if not boxes:
-            return []
+        parsed_boxes = []
         for box in boxes:
+            new_box = {}
+            new_box["label"] = box.get("label", "")
+            new_box["color"] = (0,0,0)
             if "color" in box:
                 match = re.match(r'rgb\((\d+), (\d+), (\d+)\)', box["color"])
                 if match:
-                    box["color"] = tuple(int(match.group(i)) for i in range(1, 4))
-            scale_factor = box["scaleFactor"] if "scaleFactor" in box else 1
-            box["xmin"] = round(box["xmin"] / scale_factor)
-            box["ymin"] = round(box["ymin"] / scale_factor)
-            box["xmax"] = round(box["xmax"] / scale_factor)
-            box["ymax"] = round(box["ymax"] / scale_factor)
-        return boxes
+                    new_box["color"] = tuple(int(match.group(i)) for i in range(1, 4))
+            scale_factor = box.get("scaleFactor", 1)
+            new_box["xmin"] = round(box["xmin"] / scale_factor)
+            new_box["ymin"] = round(box["ymin"] / scale_factor)
+            new_box["xmax"] = round(box["xmax"] / scale_factor)
+            new_box["ymax"] = round(box["ymax"] / scale_factor)
+            parsed_boxes.append(new_box)
+        return parsed_boxes
 
     def preprocess(self, payload: AnnotatedImageData | None) -> dict | None:
         """

src/backend/gradio_image_annotation/templates/example/index.js

@@ -41,7 +41,7 @@ async function fr(e) {
 }
 const {
   SvelteComponent: hr,
-  append: Tt,
+  append: Ct,
   attr: X,
   detach: cr,
   init: mr,
@@ -58,7 +58,7 @@ function br(e) {
       t = Je("svg"), n = Je("g"), i = Je("path"), r = Je("path"), X(i, "d", "M18,6L6.087,17.913"), Z(i, "fill", "none"), Z(i, "fill-rule", "nonzero"), Z(i, "stroke-width", "2px"), X(n, "transform", "matrix(1.14096,-0.140958,-0.140958,1.14096,-0.0559523,0.0559523)"), X(r, "d", "M4.364,4.364L19.636,19.636"), Z(r, "fill", "none"), Z(r, "fill-rule", "nonzero"), Z(r, "stroke-width", "2px"), X(t, "width", "100%"), X(t, "height", "100%"), X(t, "viewBox", "0 0 24 24"), X(t, "version", "1.1"), X(t, "xmlns", "http://www.w3.org/2000/svg"), X(t, "xmlns:xlink", "http://www.w3.org/1999/xlink"), X(t, "xml:space", "preserve"), X(t, "stroke", "currentColor"), Z(t, "fill-rule", "evenodd"), Z(t, "clip-rule", "evenodd"), Z(t, "stroke-linecap", "round"), Z(t, "stroke-linejoin", "round");
     },
     m(s, u) {
-      _r(s, t, u), Tt(t, n), Tt(n, i), Tt(t, r);
+      _r(s, t, u), Ct(t, n), Ct(n, i), Ct(t, r);
     },
     p: Pt,
     i: Pt,
@@ -76,7 +76,7 @@ class gr extends hr {
 const {
   SvelteComponent: pr,
   append: vr,
-  attr: he,
+  attr: fe,
   detach: yr,
   init: Er,
   insert: wr,
@@ -88,7 +88,7 @@ function Sr(e) {
   let t, n;
   return {
     c() {
-      t = En("svg"), n = En("path"), he(n, "d", "M5 8l4 4 4-4z"), he(t, "class", "dropdown-arrow svelte-145leq6"), he(t, "xmlns", "http://www.w3.org/2000/svg"), he(t, "width", "100%"), he(t, "height", "100%"), he(t, "viewBox", "0 0 18 18");
+      t = En("svg"), n = En("path"), fe(n, "d", "M5 8l4 4 4-4z"), fe(t, "class", "dropdown-arrow svelte-145leq6"), fe(t, "xmlns", "http://www.w3.org/2000/svg"), fe(t, "width", "100%"), fe(t, "height", "100%"), fe(t, "viewBox", "0 0 18 18");
     },
     m(i, r) {
       wr(i, t, r), vr(t, n);
@@ -110,8 +110,8 @@ const {
   SvelteComponent: Ar,
   append: Br,
   attr: V,
-  detach: Cr,
-  init: Tr,
+  detach: Tr,
+  init: Cr,
   insert: Pr,
   noop: Nt,
   safe_not_equal: Ir,
@@ -130,32 +130,32 @@ function Nr(e) {
     i: Nt,
     o: Nt,
     d(i) {
-      i && Cr(t);
+      i && Tr(t);
     }
   };
 }
 class Or extends Ar {
   constructor(t) {
-    super(), Tr(this, t, null, Nr, Ir, {});
+    super(), Cr(this, t, null, Nr, Ir, {});
   }
 }
 const {
   SvelteComponent: Lr,
   append: xn,
-  attr: D,
+  attr: k,
   detach: Mr,
   init: Rr,
   insert: kr,
   noop: Ot,
   safe_not_equal: Dr,
-  set_style: ne,
+  set_style: te,
   svg_element: Lt
 } = window.__gradio__svelte__internal;
 function Ur(e) {
   let t, n, i;
   return {
     c() {
-      t = Lt("svg"), n = Lt("line"), i = Lt("line"), D(n, "x1", "4"), D(n, "y1", "12"), D(n, "x2", "20"), D(n, "y2", "12"), ne(n, "fill", "none"), ne(n, "stroke-width", "2px"), D(i, "x1", "12"), D(i, "y1", "4"), D(i, "x2", "12"), D(i, "y2", "20"), ne(i, "fill", "none"), ne(i, "stroke-width", "2px"), D(t, "width", "100%"), D(t, "height", "100%"), D(t, "viewBox", "0 0 24 24"), D(t, "version", "1.1"), D(t, "xmlns", "http://www.w3.org/2000/svg"), D(t, "xmlns:xlink", "http://www.w3.org/1999/xlink"), D(t, "xml:space", "preserve"), D(t, "stroke", "currentColor"), ne(t, "fill-rule", "evenodd"), ne(t, "clip-rule", "evenodd"), ne(t, "stroke-linecap", "round"), ne(t, "stroke-linejoin", "round");
+      t = Lt("svg"), n = Lt("line"), i = Lt("line"), k(n, "x1", "4"), k(n, "y1", "12"), k(n, "x2", "20"), k(n, "y2", "12"), te(n, "fill", "none"), te(n, "stroke-width", "2px"), k(i, "x1", "12"), k(i, "y1", "4"), k(i, "x2", "12"), k(i, "y2", "20"), te(i, "fill", "none"), te(i, "stroke-width", "2px"), k(t, "width", "100%"), k(t, "height", "100%"), k(t, "viewBox", "0 0 24 24"), k(t, "version", "1.1"), k(t, "xmlns", "http://www.w3.org/2000/svg"), k(t, "xmlns:xlink", "http://www.w3.org/1999/xlink"), k(t, "xml:space", "preserve"), k(t, "stroke", "currentColor"), te(t, "fill-rule", "evenodd"), te(t, "clip-rule", "evenodd"), te(t, "stroke-linecap", "round"), te(t, "stroke-linejoin", "round");
     },
     m(r, s) {
       kr(r, t, s), xn(t, n), xn(t, i);
@@ -270,7 +270,7 @@ const {
   set_data: bs,
   space: gs,
   text: ps,
-  toggle_class: ce,
+  toggle_class: he,
   transition_in: Le,
   transition_out: ft,
   update_slot_base: vs
@@ -348,9 +348,9 @@ function Es(e) {
   );
   return {
     c() {
-      t = ls("span"), u && u.c(), n = gs(), o && o.c(), i = us(), Sn(t, "data-testid", "block-info"), Sn(t, "class", "svelte-22c38v"), ce(t, "sr-only", !/*show_label*/
-      e[0]), ce(t, "hide", !/*show_label*/
-      e[0]), ce(
+      t = ls("span"), u && u.c(), n = gs(), o && o.c(), i = us(), Sn(t, "data-testid", "block-info"), Sn(t, "class", "svelte-22c38v"), he(t, "sr-only", !/*show_label*/
+      e[0]), he(t, "hide", !/*show_label*/
+      e[0]), he(
         t,
         "has-info",
         /*info*/
@@ -380,11 +380,11 @@ function Es(e) {
         ),
         null
       ), (!r || f & /*show_label*/
-      1) && ce(t, "sr-only", !/*show_label*/
+      1) && he(t, "sr-only", !/*show_label*/
       a[0]), (!r || f & /*show_label*/
-      1) && ce(t, "hide", !/*show_label*/
+      1) && he(t, "hide", !/*show_label*/
       a[0]), (!r || f & /*info*/
-      2) && ce(
+      2) && he(
         t,
         "has-info",
         /*info*/
@@ -735,16 +735,16 @@ const {
   SvelteComponent: Ss,
   append: Bn,
   attr: Mt,
-  bubble: Cn,
+  bubble: Tn,
   create_component: Hs,
   destroy_component: As,
   detach: ci,
-  element: Tn,
+  element: Cn,
   init: Bs,
   insert: mi,
   listen: Rt,
-  mount_component: Cs,
-  run_all: Ts,
+  mount_component: Ts,
+  run_all: Cs,
   safe_not_equal: Ps,
   set_data: Is,
   set_input_value: Pn,
@@ -795,11 +795,11 @@ function Us(e) {
     }
   }), {
     c() {
-      t = Tn("label"), Hs(n.$$.fragment), i = Ns(), r = Tn("input"), Mt(r, "type", "color"), r.disabled = /*disabled*/
+      t = Cn("label"), Hs(n.$$.fragment), i = Ns(), r = Cn("input"), Mt(r, "type", "color"), r.disabled = /*disabled*/
       e[3], Mt(r, "class", "svelte-16l8u73"), Mt(t, "class", "block");
     },
     m(a, f) {
-      mi(a, t, f), Cs(n, t, null), Bn(t, i), Bn(t, r), Pn(
+      mi(a, t, f), Ts(n, t, null), Bn(t, i), Bn(t, r), Pn(
         r,
         /*value*/
         e[0]
@@ -847,7 +847,7 @@ function Us(e) {
       Ms(n.$$.fragment, a), s = !1;
     },
     d(a) {
-      a && ci(t), As(n), u = !1, Ts(o);
+      a && ci(t), As(n), u = !1, Cs(o);
     }
   };
 }
@@ -861,10 +861,10 @@ function Gs(e, t, n) {
     n(5, r = !1);
   });
   function h(b) {
-    Cn.call(this, e, b);
+    Tn.call(this, e, b);
   }
-  function m(b) {
-    Cn.call(this, e, b);
+  function c(b) {
+    Tn.call(this, e, b);
   }
   function _() {
     i = this.value, n(0, i);
@@ -882,7 +882,7 @@ function Gs(e, t, n) {
     a,
     r,
     h,
-    m,
+    c,
     _
   ];
 }
@@ -898,7 +898,7 @@ class Fs extends Ss {
     });
   }
 }
-function xe() {
+function we() {
 }
 function zs(e) {
   return e();
@@ -916,7 +916,7 @@ function qs(e, ...t) {
   if (e == null) {
     for (const i of t)
       i(void 0);
-    return xe;
+    return we;
   }
   const n = e.subscribe(...t);
   return n.unsubscribe ? () => n.unsubscribe() : n;
@@ -934,49 +934,49 @@ function Ws(e) {
   return t * t * t + 1;
 }
 function Nn(e, { delay: t = 0, duration: n = 400, easing: i = Ws, x: r = 0, y: s = 0, opacity: u = 0 } = {}) {
-  const o = getComputedStyle(e), a = +o.opacity, f = o.transform === "none" ? "" : o.transform, l = a * (1 - u), [h, m] = In(r), [_, b] = In(s);
+  const o = getComputedStyle(e), a = +o.opacity, f = o.transform === "none" ? "" : o.transform, l = a * (1 - u), [h, c] = In(r), [_, b] = In(s);
   return {
     delay: t,
     duration: n,
     easing: i,
     css: (g, d) => `
-			transform: ${f} translate(${(1 - g) * h}${m}, ${(1 - g) * _}${b});
+			transform: ${f} translate(${(1 - g) * h}${c}, ${(1 - g) * _}${b});
 			opacity: ${a - l * d}`
   };
 }
-const me = [];
+const ce = [];
 function Ys(e, t) {
   return {
     subscribe: yt(e, t).subscribe
   };
 }
-function yt(e, t = xe) {
+function yt(e, t = we) {
   let n;
   const i = /* @__PURE__ */ new Set();
   function r(o) {
     if (Vs(e, o) && (e = o, n)) {
-      const a = !me.length;
+      const a = !ce.length;
       for (const f of i)
-        f[1](), me.push(f, e);
+        f[1](), ce.push(f, e);
       if (a) {
-        for (let f = 0; f < me.length; f += 2)
-          me[f][0](me[f + 1]);
-        me.length = 0;
+        for (let f = 0; f < ce.length; f += 2)
+          ce[f][0](ce[f + 1]);
+        ce.length = 0;
       }
     }
   }
   function s(o) {
     r(o(e));
   }
-  function u(o, a = xe) {
+  function u(o, a = we) {
     const f = [o, a];
-    return i.add(f), i.size === 1 && (n = t(r, s) || xe), o(e), () => {
+    return i.add(f), i.size === 1 && (n = t(r, s) || we), o(e), () => {
       i.delete(f), i.size === 0 && n && (n(), n = null);
     };
   }
   return { set: r, update: s, subscribe: u };
 }
-function Ce(e, t, n) {
+function Be(e, t, n) {
   const i = !Array.isArray(e), r = i ? [e] : e;
   if (!r.every(Boolean))
     throw new Error("derived() expects stores as input, got a falsy value");
@@ -984,25 +984,25 @@ function Ce(e, t, n) {
   return Ys(n, (u, o) => {
     let a = !1;
     const f = [];
-    let l = 0, h = xe;
-    const m = () => {
+    let l = 0, h = we;
+    const c = () => {
       if (l)
         return;
       h();
       const b = t(i ? f[0] : f, u, o);
-      s ? u(b) : h = Xs(b) ? b : xe;
+      s ? u(b) : h = Xs(b) ? b : we;
     }, _ = r.map(
       (b, g) => qs(
         b,
         (d) => {
-          f[g] = d, l &= ~(1 << g), a && m();
+          f[g] = d, l &= ~(1 << g), a && c();
         },
         () => {
           l |= 1 << g;
         }
       )
     );
-    return a = !0, m(), function() {
+    return a = !0, c(), function() {
       js(_), h(), a = !1;
     };
   });
@@ -1028,7 +1028,7 @@ const {
   set_style: F,
   space: pi,
   src_url_equal: _t,
-  toggle_class: Ee,
+  toggle_class: ye,
   transition_in: dt,
   transition_out: bt,
   update_slot_base: vi
@@ -1059,7 +1059,7 @@ function io(e) {
         /*elem_id*/
         e[0]
       ), t.disabled = /*disabled*/
-      e[8], Ee(t, "hidden", !/*visible*/
+      e[8], ye(t, "hidden", !/*visible*/
       e[2]), F(
         t,
         "flex-grow",
@@ -1115,7 +1115,7 @@ function io(e) {
       ), (!r || h & /*disabled*/
       256) && (t.disabled = /*disabled*/
       l[8]), (!r || h & /*size, variant, elem_classes, visible*/
-      30) && Ee(t, "hidden", !/*visible*/
+      30) && ye(t, "hidden", !/*visible*/
       l[2]), h & /*scale*/
       512 && F(
         t,
@@ -1179,8 +1179,8 @@ function ro(e) {
         "id",
         /*elem_id*/
         e[0]
-      ), Ee(t, "hidden", !/*visible*/
-      e[2]), Ee(
+      ), ye(t, "hidden", !/*visible*/
+      e[2]), ye(
         t,
         "disabled",
         /*disabled*/
@@ -1250,9 +1250,9 @@ function ro(e) {
         /*elem_id*/
         a[0]
       ), (!r || f & /*size, variant, elem_classes, visible*/
-      30) && Ee(t, "hidden", !/*visible*/
+      30) && ye(t, "hidden", !/*visible*/
       a[2]), (!r || f & /*size, variant, elem_classes, disabled*/
-      282) && Ee(
+      282) && ye(
         t,
         "disabled",
         /*disabled*/
@@ -1372,12 +1372,12 @@ function so(e) {
   };
 }
 function oo(e, t, n) {
-  let { $$slots: i = {}, $$scope: r } = t, { elem_id: s = "" } = t, { elem_classes: u = [] } = t, { visible: o = !0 } = t, { variant: a = "secondary" } = t, { size: f = "lg" } = t, { value: l = null } = t, { link: h = null } = t, { icon: m = null } = t, { disabled: _ = !1 } = t, { scale: b = null } = t, { min_width: g = void 0 } = t;
-  function d(c) {
-    Qs.call(this, e, c);
+  let { $$slots: i = {}, $$scope: r } = t, { elem_id: s = "" } = t, { elem_classes: u = [] } = t, { visible: o = !0 } = t, { variant: a = "secondary" } = t, { size: f = "lg" } = t, { value: l = null } = t, { link: h = null } = t, { icon: c = null } = t, { disabled: _ = !1 } = t, { scale: b = null } = t, { min_width: g = void 0 } = t;
+  function d(m) {
+    Qs.call(this, e, m);
   }
-  return e.$$set = (c) => {
-    "elem_id" in c && n(0, s = c.elem_id), "elem_classes" in c && n(1, u = c.elem_classes), "visible" in c && n(2, o = c.visible), "variant" in c && n(3, a = c.variant), "size" in c && n(4, f = c.size), "value" in c && n(5, l = c.value), "link" in c && n(6, h = c.link), "icon" in c && n(7, m = c.icon), "disabled" in c && n(8, _ = c.disabled), "scale" in c && n(9, b = c.scale), "min_width" in c && n(10, g = c.min_width), "$$scope" in c && n(11, r = c.$$scope);
+  return e.$$set = (m) => {
+    "elem_id" in m && n(0, s = m.elem_id), "elem_classes" in m && n(1, u = m.elem_classes), "visible" in m && n(2, o = m.visible), "variant" in m && n(3, a = m.variant), "size" in m && n(4, f = m.size), "value" in m && n(5, l = m.value), "link" in m && n(6, h = m.link), "icon" in m && n(7, c = m.icon), "disabled" in m && n(8, _ = m.disabled), "scale" in m && n(9, b = m.scale), "min_width" in m && n(10, g = m.min_width), "$$scope" in m && n(11, r = m.$$scope);
   }, [
     s,
     u,
@@ -1386,7 +1386,7 @@ function oo(e, t, n) {
     f,
     l,
     h,
-    m,
+    c,
     _,
     b,
     g,
@@ -1433,7 +1433,7 @@ function _o(e) {
   return Array.isArray(e) ? [] : {};
 }
 function ze(e, t) {
-  return t.clone !== !1 && t.isMergeableObject(e) ? Se(_o(e), e, t) : e;
+  return t.clone !== !1 && t.isMergeableObject(e) ? xe(_o(e), e, t) : e;
 }
 function bo(e, t, n) {
   return e.concat(t).map(function(i) {
@@ -1442,9 +1442,9 @@ function bo(e, t, n) {
 }
 function go(e, t) {
   if (!t.customMerge)
-    return Se;
+    return xe;
   var n = t.customMerge(e);
-  return typeof n == "function" ? n : Se;
+  return typeof n == "function" ? n : xe;
 }
 function po(e) {
   return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(e).filter(function(t) {
@@ -1472,19 +1472,19 @@ function yo(e, t, n) {
     vo(e, r) || (yi(e, r) && n.isMergeableObject(t[r]) ? i[r] = go(r, n)(e[r], t[r], n) : i[r] = ze(t[r], n));
   }), i;
 }
-function Se(e, t, n) {
+function xe(e, t, n) {
   n = n || {}, n.arrayMerge = n.arrayMerge || bo, n.isMergeableObject = n.isMergeableObject || lo, n.cloneUnlessOtherwiseSpecified = ze;
   var i = Array.isArray(t), r = Array.isArray(e), s = i === r;
   return s ? i ? n.arrayMerge(e, t, n) : yo(e, t, n) : ze(t, n);
 }
-Se.all = function(t, n) {
+xe.all = function(t, n) {
   if (!Array.isArray(t))
     throw new Error("first argument should be an array");
   return t.reduce(function(i, r) {
-    return Se(i, r, n);
+    return xe(i, r, n);
   }, {});
 };
-var Eo = Se, wo = Eo;
+var Eo = xe, wo = Eo;
 const xo = /* @__PURE__ */ ao(wo);
 var Qt = function(e, t) {
   return Qt = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(n, i) {
@@ -1503,15 +1503,15 @@ function wt(e, t) {
   }
   e.prototype = t === null ? Object.create(t) : (n.prototype = t.prototype, new n());
 }
-var A = function() {
-  return A = Object.assign || function(t) {
+var B = function() {
+  return B = Object.assign || function(t) {
     for (var n, i = 1, r = arguments.length; i < r; i++) {
       n = arguments[i];
       for (var s in n)
         Object.prototype.hasOwnProperty.call(n, s) && (t[s] = n[s]);
     }
     return t;
-  }, A.apply(this, arguments);
+  }, B.apply(this, arguments);
 };
 function kt(e, t, n) {
   if (n || arguments.length === 2)
@@ -1527,10 +1527,10 @@ var I;
 (function(e) {
   e[e.literal = 0] = "literal", e[e.argument = 1] = "argument", e[e.number = 2] = "number", e[e.date = 3] = "date", e[e.time = 4] = "time", e[e.select = 5] = "select", e[e.plural = 6] = "plural", e[e.pound = 7] = "pound", e[e.tag = 8] = "tag";
 })(I || (I = {}));
-var He;
+var Se;
 (function(e) {
   e[e.number = 0] = "number", e[e.dateTime = 1] = "dateTime";
-})(He || (He = {}));
+})(Se || (Se = {}));
 function kn(e) {
   return e.type === I.literal;
 }
@@ -1559,12 +1559,12 @@ function Ai(e) {
   return e.type === I.tag;
 }
 function Bi(e) {
-  return !!(e && typeof e == "object" && e.type === He.number);
+  return !!(e && typeof e == "object" && e.type === Se.number);
 }
 function Jt(e) {
-  return !!(e && typeof e == "object" && e.type === He.dateTime);
+  return !!(e && typeof e == "object" && e.type === Se.dateTime);
 }
-var Ci = /[ \xA0\u1680\u2000-\u200A\u202F\u205F\u3000]/, Ao = /(?:[Eec]{1,6}|G{1,5}|[Qq]{1,5}|(?:[yYur]+|U{1,5})|[ML]{1,5}|d{1,2}|D{1,3}|F{1}|[abB]{1,5}|[hkHK]{1,2}|w{1,2}|W{1}|m{1,2}|s{1,2}|[zZOvVxX]{1,4})(?=([^']*'[^']*')*[^']*$)/g;
+var Ti = /[ \xA0\u1680\u2000-\u200A\u202F\u205F\u3000]/, Ao = /(?:[Eec]{1,6}|G{1,5}|[Qq]{1,5}|(?:[yYur]+|U{1,5})|[ML]{1,5}|d{1,2}|D{1,3}|F{1}|[abB]{1,5}|[hkHK]{1,2}|w{1,2}|W{1}|m{1,2}|s{1,2}|[zZOvVxX]{1,4})(?=([^']*'[^']*')*[^']*$)/g;
 function Bo(e) {
   var t = {};
   return e.replace(Ao, function(n) {
@@ -1656,12 +1656,12 @@ function Bo(e) {
     return "";
   }), t;
 }
-var Co = /[\t-\r \x85\u200E\u200F\u2028\u2029]/i;
-function To(e) {
+var To = /[\t-\r \x85\u200E\u200F\u2028\u2029]/i;
+function Co(e) {
   if (e.length === 0)
     throw new Error("Number skeleton cannot be empty");
-  for (var t = e.split(Co).filter(function(m) {
-    return m.length > 0;
+  for (var t = e.split(To).filter(function(c) {
+    return c.length > 0;
   }), n = [], i = 0, r = t; i < r.length; i++) {
     var s = r[i], u = s.split("/");
     if (u.length === 0)
@@ -1678,10 +1678,10 @@ function To(e) {
 function Po(e) {
   return e.replace(/^(.*?)-/, "");
 }
-var Dn = /^\.(?:(0+)(\*)?|(#+)|(0+)(#+))$/g, Ti = /^(@+)?(\+|#+)?[rs]?$/g, Io = /(\*)(0+)|(#+)(0+)|(0+)/g, Pi = /^(0+)$/;
+var Dn = /^\.(?:(0+)(\*)?|(#+)|(0+)(#+))$/g, Ci = /^(@+)?(\+|#+)?[rs]?$/g, Io = /(\*)(0+)|(#+)(0+)|(0+)/g, Pi = /^(0+)$/;
 function Un(e) {
   var t = {};
-  return e[e.length - 1] === "r" ? t.roundingPriority = "morePrecision" : e[e.length - 1] === "s" && (t.roundingPriority = "lessPrecision"), e.replace(Ti, function(n, i, r) {
+  return e[e.length - 1] === "r" ? t.roundingPriority = "morePrecision" : e[e.length - 1] === "s" && (t.roundingPriority = "lessPrecision"), e.replace(Ci, function(n, i, r) {
     return typeof r != "string" ? (t.minimumSignificantDigits = i.length, t.maximumSignificantDigits = i.length) : r === "+" ? t.minimumSignificantDigits = i.length : i[0] === "#" ? t.maximumSignificantDigits = i.length : (t.minimumSignificantDigits = i.length, t.maximumSignificantDigits = i.length + (typeof r == "string" ? r.length : 0)), "";
   }), t;
 }
@@ -1778,13 +1778,13 @@ function Oo(e) {
         t.notation = "compact", t.compactDisplay = "long";
         continue;
       case "scientific":
-        t = A(A(A({}, t), { notation: "scientific" }), r.options.reduce(function(a, f) {
-          return A(A({}, a), Gn(f));
+        t = B(B(B({}, t), { notation: "scientific" }), r.options.reduce(function(a, f) {
+          return B(B({}, a), Gn(f));
         }, {}));
         continue;
       case "engineering":
-        t = A(A(A({}, t), { notation: "engineering" }), r.options.reduce(function(a, f) {
-          return A(A({}, a), Gn(f));
+        t = B(B(B({}, t), { notation: "engineering" }), r.options.reduce(function(a, f) {
+          return B(B({}, a), Gn(f));
         }, {}));
         continue;
       case "notation-simple":
@@ -1808,11 +1808,11 @@ function Oo(e) {
       case "integer-width":
         if (r.options.length > 1)
           throw new RangeError("integer-width stems only accept a single optional option");
-        r.options[0].replace(Io, function(a, f, l, h, m, _) {
+        r.options[0].replace(Io, function(a, f, l, h, c, _) {
           if (f)
             t.minimumIntegerDigits = l.length;
           else {
-            if (h && m)
+            if (h && c)
               throw new Error("We currently do not support maximum integer digits");
             if (_)
               throw new Error("We currently do not support exact integer digits");
@@ -1828,21 +1828,21 @@ function Oo(e) {
     if (Dn.test(r.stem)) {
       if (r.options.length > 1)
         throw new RangeError("Fraction-precision stems only accept a single optional option");
-      r.stem.replace(Dn, function(a, f, l, h, m, _) {
-        return l === "*" ? t.minimumFractionDigits = f.length : h && h[0] === "#" ? t.maximumFractionDigits = h.length : m && _ ? (t.minimumFractionDigits = m.length, t.maximumFractionDigits = m.length + _.length) : (t.minimumFractionDigits = f.length, t.maximumFractionDigits = f.length), "";
+      r.stem.replace(Dn, function(a, f, l, h, c, _) {
+        return l === "*" ? t.minimumFractionDigits = f.length : h && h[0] === "#" ? t.maximumFractionDigits = h.length : c && _ ? (t.minimumFractionDigits = c.length, t.maximumFractionDigits = c.length + _.length) : (t.minimumFractionDigits = f.length, t.maximumFractionDigits = f.length), "";
       });
       var s = r.options[0];
-      s === "w" ? t = A(A({}, t), { trailingZeroDisplay: "stripIfInteger" }) : s && (t = A(A({}, t), Un(s)));
+      s === "w" ? t = B(B({}, t), { trailingZeroDisplay: "stripIfInteger" }) : s && (t = B(B({}, t), Un(s)));
       continue;
     }
-    if (Ti.test(r.stem)) {
-      t = A(A({}, t), Un(r.stem));
+    if (Ci.test(r.stem)) {
+      t = B(B({}, t), Un(r.stem));
       continue;
     }
     var u = Ii(r.stem);
-    u && (t = A(A({}, t), u));
+    u && (t = B(B({}, t), u));
     var o = No(r.stem);
-    o && (t = A(A({}, t), o));
+    o && (t = B(B({}, t), o));
   }
   return t;
 }
@@ -3221,7 +3221,7 @@ function Mo(e) {
   var r = Ke[i || ""] || Ke[n || ""] || Ke["".concat(n, "-001")] || Ke["001"];
   return r[0];
 }
-var Dt, Ro = new RegExp("^".concat(Ci.source, "*")), ko = new RegExp("".concat(Ci.source, "*$"));
+var Dt, Ro = new RegExp("^".concat(Ti.source, "*")), ko = new RegExp("".concat(Ti.source, "*$"));
 function H(e, t) {
   return { start: e, end: t };
 }
@@ -3523,11 +3523,11 @@ var Zo = (
             var l = this.clonePosition(), h = this.parseSimpleArgStyleIfPossible();
             if (h.err)
               return h;
-            var m = Yo(h.val);
-            if (m.length === 0)
+            var c = Yo(h.val);
+            if (c.length === 0)
               return this.error(S.EXPECT_ARGUMENT_STYLE, H(this.clonePosition(), this.clonePosition()));
             var _ = H(l, this.clonePosition());
-            f = { style: m, styleLocation: _ };
+            f = { style: c, styleLocation: _ };
           }
           var b = this.tryParseArgumentClose(r);
           if (b.err)
@@ -3544,16 +3544,16 @@ var Zo = (
             } else {
               if (d.length === 0)
                 return this.error(S.EXPECT_DATE_TIME_SKELETON, g);
-              var c = d;
-              this.locale && (c = Lo(d, this.locale));
-              var m = {
-                type: He.dateTime,
-                pattern: c,
+              var m = d;
+              this.locale && (m = Lo(d, this.locale));
+              var c = {
+                type: Se.dateTime,
+                pattern: m,
                 location: f.styleLocation,
-                parsedOptions: this.shouldParseSkeletons ? Bo(c) : {}
+                parsedOptions: this.shouldParseSkeletons ? Bo(m) : {}
               }, y = o === "date" ? I.date : I.time;
               return {
-                val: { type: y, value: i, location: g, style: m },
+                val: { type: y, value: i, location: g, style: c },
                 err: null
               };
             }
@@ -3573,31 +3573,31 @@ var Zo = (
         case "select": {
           var p = this.clonePosition();
           if (this.bumpSpace(), !this.bumpIf(","))
-            return this.error(S.EXPECT_SELECT_ARGUMENT_OPTIONS, H(p, A({}, p)));
+            return this.error(S.EXPECT_SELECT_ARGUMENT_OPTIONS, H(p, B({}, p)));
           this.bumpSpace();
-          var B = this.parseIdentifierIfPossible(), C = 0;
-          if (o !== "select" && B.value === "offset") {
+          var T = this.parseIdentifierIfPossible(), C = 0;
+          if (o !== "select" && T.value === "offset") {
             if (!this.bumpIf(":"))
               return this.error(S.EXPECT_PLURAL_ARGUMENT_OFFSET_VALUE, H(this.clonePosition(), this.clonePosition()));
             this.bumpSpace();
             var h = this.tryParseDecimalInteger(S.EXPECT_PLURAL_ARGUMENT_OFFSET_VALUE, S.INVALID_PLURAL_ARGUMENT_OFFSET_VALUE);
             if (h.err)
               return h;
-            this.bumpSpace(), B = this.parseIdentifierIfPossible(), C = h.val;
+            this.bumpSpace(), T = this.parseIdentifierIfPossible(), C = h.val;
           }
-          var O = this.tryParsePluralOrSelectOptions(t, o, n, B);
+          var O = this.tryParsePluralOrSelectOptions(t, o, n, T);
           if (O.err)
             return O;
           var b = this.tryParseArgumentClose(r);
           if (b.err)
             return b;
-          var T = H(r, this.clonePosition());
+          var P = H(r, this.clonePosition());
           return o === "select" ? {
             val: {
               type: I.select,
               value: i,
               options: zn(O.val),
-              location: T
+              location: P
             },
             err: null
           } : {
@@ -3607,7 +3607,7 @@ var Zo = (
               options: zn(O.val),
               offset: C,
               pluralType: o === "plural" ? "cardinal" : "ordinal",
-              location: T
+              location: P
             },
             err: null
           };
@@ -3655,13 +3655,13 @@ var Zo = (
     }, e.prototype.parseNumberSkeletonFromString = function(t, n) {
       var i = [];
       try {
-        i = To(t);
+        i = Co(t);
       } catch {
         return this.error(S.INVALID_NUMBER_SKELETON, n);
       }
       return {
         val: {
-          type: He.number,
+          type: Se.number,
           tokens: i,
           location: n,
           parsedOptions: this.shouldParseSkeletons ? Oo(i) : {}
@@ -3673,9 +3673,9 @@ var Zo = (
         if (f.length === 0) {
           var h = this.clonePosition();
           if (n !== "select" && this.bumpIf("=")) {
-            var m = this.tryParseDecimalInteger(S.EXPECT_PLURAL_ARGUMENT_SELECTOR, S.INVALID_PLURAL_ARGUMENT_SELECTOR);
-            if (m.err)
-              return m;
+            var c = this.tryParseDecimalInteger(S.EXPECT_PLURAL_ARGUMENT_SELECTOR, S.INVALID_PLURAL_ARGUMENT_SELECTOR);
+            if (c.err)
+              return c;
             l = H(h, this.clonePosition()), f = this.message.slice(h.offset, this.offset());
           } else
             break;
@@ -3803,7 +3803,7 @@ function nn(e) {
   });
 }
 function $o(e, t) {
-  t === void 0 && (t = {}), t = A({ shouldParseSkeletons: !0, requiresOtherClause: !0 }, t);
+  t === void 0 && (t = {}), t = B({ shouldParseSkeletons: !0, requiresOtherClause: !0 }, t);
   var n = new Zo(e, t).parse();
   if (n.err) {
     var i = SyntaxError(S[n.err.kind]);
@@ -3861,10 +3861,10 @@ var sa = {
 }, Gt = {
   variadic: na,
   monadic: ia
-}, Ae;
+}, He;
 (function(e) {
   e.MISSING_VALUE = "MISSING_VALUE", e.INVALID_VALUE = "INVALID_VALUE", e.MISSING_INTL_API = "MISSING_INTL_API";
-})(Ae || (Ae = {}));
+})(He || (He = {}));
 var xt = (
   /** @class */
   function(e) {
@@ -3882,7 +3882,7 @@ var xt = (
   function(e) {
     wt(t, e);
     function t(n, i, r, s) {
-      return e.call(this, 'Invalid values for "'.concat(n, '": "').concat(i, '". Options are "').concat(Object.keys(r).join('", "'), '"'), Ae.INVALID_VALUE, s) || this;
+      return e.call(this, 'Invalid values for "'.concat(n, '": "').concat(i, '". Options are "').concat(Object.keys(r).join('", "'), '"'), He.INVALID_VALUE, s) || this;
     }
     return t;
   }(xt)
@@ -3891,7 +3891,7 @@ var xt = (
   function(e) {
     wt(t, e);
     function t(n, i, r) {
-      return e.call(this, 'Value for "'.concat(n, '" must be of type ').concat(i), Ae.INVALID_VALUE, r) || this;
+      return e.call(this, 'Value for "'.concat(n, '" must be of type ').concat(i), He.INVALID_VALUE, r) || this;
     }
     return t;
   }(xt)
@@ -3900,18 +3900,18 @@ var xt = (
   function(e) {
     wt(t, e);
     function t(n, i) {
-      return e.call(this, 'The intl string context variable "'.concat(n, '" was not provided to the string "').concat(i, '"'), Ae.MISSING_VALUE, i) || this;
+      return e.call(this, 'The intl string context variable "'.concat(n, '" was not provided to the string "').concat(i, '"'), He.MISSING_VALUE, i) || this;
     }
     return t;
   }(xt)
-), U;
+), D;
 (function(e) {
   e[e.literal = 0] = "literal", e[e.object = 1] = "object";
-})(U || (U = {}));
+})(D || (D = {}));
 function la(e) {
   return e.length < 2 ? e : e.reduce(function(t, n) {
     var i = t[t.length - 1];
-    return !i || i.type !== U.literal || n.type !== U.literal ? t.push(n) : i.value += n.value, t;
+    return !i || i.type !== D.literal || n.type !== D.literal ? t.push(n) : i.value += n.value, t;
   }, []);
 }
 function ua(e) {
@@ -3921,7 +3921,7 @@ function ht(e, t, n, i, r, s, u) {
   if (e.length === 1 && kn(e[0]))
     return [
       {
-        type: U.literal,
+        type: D.literal,
         value: e[0].value
       }
     ];
@@ -3929,14 +3929,14 @@ function ht(e, t, n, i, r, s, u) {
     var l = f[a];
     if (kn(l)) {
       o.push({
-        type: U.literal,
+        type: D.literal,
         value: l.value
       });
       continue;
     }
     if (Ho(l)) {
       typeof s == "number" && o.push({
-        type: U.literal,
+        type: D.literal,
         value: n.getNumberFormat(t).format(s)
       });
       continue;
@@ -3944,35 +3944,35 @@ function ht(e, t, n, i, r, s, u) {
     var h = l.value;
     if (!(r && h in r))
       throw new aa(h, u);
-    var m = r[h];
+    var c = r[h];
     if (So(l)) {
-      (!m || typeof m == "string" || typeof m == "number") && (m = typeof m == "string" || typeof m == "number" ? String(m) : ""), o.push({
-        type: typeof m == "string" ? U.literal : U.object,
-        value: m
+      (!c || typeof c == "string" || typeof c == "number") && (c = typeof c == "string" || typeof c == "number" ? String(c) : ""), o.push({
+        type: typeof c == "string" ? D.literal : D.object,
+        value: c
       });
       continue;
     }
     if (wi(l)) {
       var _ = typeof l.style == "string" ? i.date[l.style] : Jt(l.style) ? l.style.parsedOptions : void 0;
       o.push({
-        type: U.literal,
-        value: n.getDateTimeFormat(t, _).format(m)
+        type: D.literal,
+        value: n.getDateTimeFormat(t, _).format(c)
       });
       continue;
     }
     if (xi(l)) {
       var _ = typeof l.style == "string" ? i.time[l.style] : Jt(l.style) ? l.style.parsedOptions : i.time.medium;
       o.push({
-        type: U.literal,
-        value: n.getDateTimeFormat(t, _).format(m)
+        type: D.literal,
+        value: n.getDateTimeFormat(t, _).format(c)
       });
       continue;
     }
     if (Ei(l)) {
       var _ = typeof l.style == "string" ? i.number[l.style] : Bi(l.style) ? l.style.parsedOptions : void 0;
-      _ && _.scale && (m = m * (_.scale || 1)), o.push({
-        type: U.literal,
-        value: n.getNumberFormat(t, _).format(m)
+      _ && _.scale && (c = c * (_.scale || 1)), o.push({
+        type: D.literal,
+        value: n.getNumberFormat(t, _).format(c)
       });
       continue;
     }
@@ -3980,50 +3980,50 @@ function ht(e, t, n, i, r, s, u) {
       var b = l.children, g = l.value, d = r[g];
       if (!ua(d))
         throw new oa(g, "function", u);
-      var c = ht(b, t, n, i, r, s), y = d(c.map(function(C) {
+      var m = ht(b, t, n, i, r, s), y = d(m.map(function(C) {
         return C.value;
       }));
       Array.isArray(y) || (y = [y]), o.push.apply(o, y.map(function(C) {
         return {
-          type: typeof C == "string" ? U.literal : U.object,
+          type: typeof C == "string" ? D.literal : D.object,
           value: C
         };
       }));
     }
     if (Si(l)) {
-      var p = l.options[m] || l.options.other;
+      var p = l.options[c] || l.options.other;
       if (!p)
-        throw new Xn(l.value, m, Object.keys(l.options), u);
+        throw new Xn(l.value, c, Object.keys(l.options), u);
       o.push.apply(o, ht(p.value, t, n, i, r));
       continue;
     }
     if (Hi(l)) {
-      var p = l.options["=".concat(m)];
+      var p = l.options["=".concat(c)];
       if (!p) {
         if (!Intl.PluralRules)
           throw new xt(`Intl.PluralRules is not available in this environment.
 Try polyfilling it using "@formatjs/intl-pluralrules"
-`, Ae.MISSING_INTL_API, u);
-        var B = n.getPluralRules(t, { type: l.pluralType }).select(m - (l.offset || 0));
-        p = l.options[B] || l.options.other;
+`, He.MISSING_INTL_API, u);
+        var T = n.getPluralRules(t, { type: l.pluralType }).select(c - (l.offset || 0));
+        p = l.options[T] || l.options.other;
       }
       if (!p)
-        throw new Xn(l.value, m, Object.keys(l.options), u);
-      o.push.apply(o, ht(p.value, t, n, i, r, m - (l.offset || 0)));
+        throw new Xn(l.value, c, Object.keys(l.options), u);
+      o.push.apply(o, ht(p.value, t, n, i, r, c - (l.offset || 0)));
       continue;
     }
   }
   return la(o);
 }
 function fa(e, t) {
-  return t ? A(A(A({}, e || {}), t || {}), Object.keys(e).reduce(function(n, i) {
-    return n[i] = A(A({}, e[i]), t[i] || {}), n;
+  return t ? B(B(B({}, e || {}), t || {}), Object.keys(e).reduce(function(n, i) {
+    return n[i] = B(B({}, e[i]), t[i] || {}), n;
   }, {})) : e;
 }
 function ha(e, t) {
   return t ? Object.keys(e).reduce(function(n, i) {
     return n[i] = fa(e[i], t[i]), n;
-  }, A({}, e)) : e;
+  }, B({}, e)) : e;
 }
 function Ft(e) {
   return {
@@ -4085,7 +4085,7 @@ var ma = (
         if (o.length === 1)
           return o[0].value;
         var a = o.reduce(function(f, l) {
-          return !f.length || l.type !== U.literal || typeof f[f.length - 1] != "string" ? f.push(l.value) : f[f.length - 1] += l.value, f;
+          return !f.length || l.type !== D.literal || typeof f[f.length - 1] != "string" ? f.push(l.value) : f[f.length - 1] += l.value, f;
         }, []);
         return a.length <= 1 ? a[0] || "" : a;
       }, this.formatToParts = function(u) {
@@ -4200,11 +4200,11 @@ function _a(e, t) {
       i = void 0;
   return i;
 }
-const se = {}, da = (e, t, n) => n && (t in se || (se[t] = {}), e in se[t] || (se[t][e] = n), n), ki = (e, t) => {
+const re = {}, da = (e, t, n) => n && (t in re || (re[t] = {}), e in re[t] || (re[t][e] = n), n), ki = (e, t) => {
   if (t == null)
     return;
-  if (t in se && e in se[t])
-    return se[t][e];
+  if (t in re && e in re[t])
+    return re[t][e];
   const n = St(t);
   for (let i = 0; i < n.length; i++) {
     const r = n[i], s = ga(r, e);
@@ -4237,9 +4237,9 @@ function pa(e) {
   }
 }
 function va(e, ...t) {
-  delete se[e], We.update((n) => (n[e] = xo.all([n[e] || {}, ...t]), n));
+  delete re[e], We.update((n) => (n[e] = xo.all([n[e] || {}, ...t]), n));
 }
-Ce(
+Be(
   [We],
   ([e]) => Object.keys(e)
 );
@@ -4322,28 +4322,28 @@ const xa = {
   handleMissingMessage: void 0,
   ignoreTag: !0
 }, Ha = Sa;
-function Be() {
+function Ae() {
   return Ha;
 }
 const zt = yt(!1);
-var Aa = Object.defineProperty, Ba = Object.defineProperties, Ca = Object.getOwnPropertyDescriptors, Vn = Object.getOwnPropertySymbols, Ta = Object.prototype.hasOwnProperty, Pa = Object.prototype.propertyIsEnumerable, qn = (e, t, n) => t in e ? Aa(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, Ia = (e, t) => {
+var Aa = Object.defineProperty, Ba = Object.defineProperties, Ta = Object.getOwnPropertyDescriptors, Vn = Object.getOwnPropertySymbols, Ca = Object.prototype.hasOwnProperty, Pa = Object.prototype.propertyIsEnumerable, qn = (e, t, n) => t in e ? Aa(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, Ia = (e, t) => {
   for (var n in t || (t = {}))
-    Ta.call(t, n) && qn(e, n, t[n]);
+    Ca.call(t, n) && qn(e, n, t[n]);
   if (Vn)
     for (var n of Vn(t))
       Pa.call(t, n) && qn(e, n, t[n]);
   return e;
-}, Na = (e, t) => Ba(e, Ca(t));
+}, Na = (e, t) => Ba(e, Ta(t));
 let sn;
 const gt = yt(null);
 function Wn(e) {
   return e.split("-").map((t, n, i) => i.slice(0, n + 1).join("-")).reverse();
 }
-function St(e, t = Be().fallbackLocale) {
+function St(e, t = Ae().fallbackLocale) {
   const n = Wn(e);
   return t ? [.../* @__PURE__ */ new Set([...n, ...Wn(t)])] : n;
 }
-function ue() {
+function le() {
   return sn ?? void 0;
 }
 gt.subscribe((e) => {
@@ -4351,9 +4351,9 @@ gt.subscribe((e) => {
 });
 const Oa = (e) => {
   if (e && pa(e) && rn(e)) {
-    const { loadingDelay: t } = Be();
+    const { loadingDelay: t } = Ae();
     let n;
-    return typeof window < "u" && ue() != null && t ? n = window.setTimeout(
+    return typeof window < "u" && le() != null && t ? n = window.setTimeout(
       () => zt.set(!0),
       t
     ) : zt.set(!0), Gi(e).then(() => {
@@ -4389,7 +4389,7 @@ var La = Object.defineProperty, pt = Object.getOwnPropertySymbols, Fi = Object.p
   return n;
 };
 const je = (e, t) => {
-  const { formats: n } = Be();
+  const { formats: n } = Ae();
   if (e in n && t in n[e])
     return n[e][t];
   throw new Error(`[svelte-i18n] Unknown "${t}" ${e} format.`);
@@ -4418,29 +4418,29 @@ const je = (e, t) => {
   }
 ), Da = (e = {}) => {
   var t = e, {
-    locale: n = ue()
+    locale: n = le()
   } = t, i = Te(t, [
     "locale"
   ]);
   return Ma(dn({ locale: n }, i));
 }, Ua = (e = {}) => {
   var t = e, {
-    locale: n = ue()
+    locale: n = le()
   } = t, i = Te(t, [
     "locale"
   ]);
   return Ra(dn({ locale: n }, i));
 }, Ga = (e = {}) => {
   var t = e, {
-    locale: n = ue()
+    locale: n = le()
   } = t, i = Te(t, [
     "locale"
   ]);
   return ka(dn({ locale: n }, i));
 }, Fa = Ht(
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  (e, t = ue()) => new ma(e, t, Be().formats, {
-    ignoreTag: Be().ignoreTag
+  (e, t = le()) => new ma(e, t, Ae().formats, {
+    ignoreTag: Ae().ignoreTag
   })
 ), za = (e, t = {}) => {
   var n, i, r, s;
@@ -4448,7 +4448,7 @@ const je = (e, t) => {
   typeof e == "object" && (u = e, e = u.id);
   const {
     values: o,
-    locale: a = ue(),
+    locale: a = le(),
     default: f
   } = u;
   if (a == null)
@@ -4457,7 +4457,7 @@ const je = (e, t) => {
     );
   let l = ki(e, a);
   if (!l)
-    l = (s = (r = (i = (n = Be()).handleMissingMessage) == null ? void 0 : i.call(n, { locale: a, id: e, defaultValue: f })) != null ? r : f) != null ? s : e;
+    l = (s = (r = (i = (n = Ae()).handleMissingMessage) == null ? void 0 : i.call(n, { locale: a, id: e, defaultValue: f })) != null ? r : f) != null ? s : e;
   else if (typeof l != "string")
     return console.warn(
       `[svelte-i18n] Message with id "${e}" must be of type "string", found: "${typeof l}". Gettin its value through the "$format" method is deprecated; use the "json" method instead.`
@@ -4467,19 +4467,19 @@ const je = (e, t) => {
   let h = l;
   try {
     h = Fa(l, a).format(o);
-  } catch (m) {
-    m instanceof Error && console.warn(
+  } catch (c) {
+    c instanceof Error && console.warn(
       `[svelte-i18n] Message "${e}" has syntax error:`,
-      m.message
+      c.message
     );
   }
   return h;
-}, ja = (e, t) => Ga(t).format(e), Xa = (e, t) => Ua(t).format(e), Va = (e, t) => Da(t).format(e), qa = (e, t = ue()) => ki(e, t);
-Ce([Ye, We], () => za);
-Ce([Ye], () => ja);
-Ce([Ye], () => Xa);
-Ce([Ye], () => Va);
-Ce([Ye, We], () => qa);
+}, ja = (e, t) => Ga(t).format(e), Xa = (e, t) => Ua(t).format(e), Va = (e, t) => Da(t).format(e), qa = (e, t = le()) => ki(e, t);
+Be([Ye, We], () => za);
+Be([Ye], () => ja);
+Be([Ye], () => Xa);
+Be([Ye], () => Va);
+Be([Ye, We], () => qa);
 const {
   SvelteComponent: Wa,
   add_render_callback: ji,
@@ -4501,7 +4501,7 @@ const {
   run_all: el,
   safe_not_equal: tl,
   set_data: nl,
-  set_style: _e,
+  set_style: me,
   space: an,
   text: il,
   toggle_class: Q,
@@ -4524,13 +4524,13 @@ function ei(e) {
       t = vt("ul");
       for (let a = 0; a < o.length; a += 1)
         o[a].c();
-      j(t, "class", "options svelte-yuohum"), j(t, "role", "listbox"), _e(
+      j(t, "class", "options svelte-yuohum"), j(t, "role", "listbox"), me(
         t,
         "bottom",
         /*bottom*/
         e[9]
-      ), _e(t, "max-height", `calc(${/*max_height*/
-      e[10]}px - var(--window-padding))`), _e(
+      ), me(t, "max-height", `calc(${/*max_height*/
+      e[10]}px - var(--window-padding))`), me(
         t,
         "width",
         /*input_width*/
@@ -4563,15 +4563,15 @@ function ei(e) {
         o.length = u.length;
       }
       f & /*bottom*/
-      512 && _e(
+      512 && me(
         t,
         "bottom",
         /*bottom*/
         a[9]
       ), f & /*max_height*/
-      1024 && _e(t, "max-height", `calc(${/*max_height*/
+      1024 && me(t, "max-height", `calc(${/*max_height*/
       a[10]}px - var(--window-padding))`), f & /*input_width*/
-      256 && _e(
+      256 && me(
         t,
         "width",
         /*input_width*/
@@ -4766,13 +4766,13 @@ function et(e) {
   return n;
 }
 function ol(e, t, n) {
-  let { choices: i } = t, { filtered_indices: r } = t, { show_options: s = !1 } = t, { disabled: u = !1 } = t, { selected_indices: o = [] } = t, { active_index: a = null } = t, f, l, h, m, _, b, g, d, c;
+  let { choices: i } = t, { filtered_indices: r } = t, { show_options: s = !1 } = t, { disabled: u = !1 } = t, { selected_indices: o = [] } = t, { active_index: a = null } = t, f, l, h, c, _, b, g, d, m;
   function y() {
-    const { top: x, bottom: M } = _.getBoundingClientRect();
-    n(14, f = x), n(15, l = c - M);
+    const { top: x, bottom: L } = _.getBoundingClientRect();
+    n(14, f = x), n(15, l = m - L);
   }
   let p = null;
-  function B() {
+  function T() {
     s && (p !== null && clearTimeout(p), p = setTimeout(
       () => {
         y(), p = null;
@@ -4782,15 +4782,15 @@ function ol(e, t, n) {
   }
   const C = rl();
   function O() {
-    n(11, c = window.innerHeight);
+    n(11, m = window.innerHeight);
   }
-  function T(x) {
+  function P(x) {
     Zn[x ? "unshift" : "push"](() => {
       _ = x, n(6, _);
     });
   }
   const E = (x) => C("change", x);
-  function k(x) {
+  function M(x) {
     Zn[x ? "unshift" : "push"](() => {
       b = x, n(7, b);
     });
@@ -4802,8 +4802,8 @@ function ol(e, t, n) {
     114900) {
       if (s && _) {
         if (b && o.length > 0) {
-          let M = b.querySelectorAll("li");
-          for (const W of Array.from(M))
+          let L = b.querySelectorAll("li");
+          for (const W of Array.from(L))
             if (W.getAttribute("data-index") === o[0].toString()) {
               et([
                 b,
@@ -4819,13 +4819,13 @@ function ol(e, t, n) {
         const x = et([
           _,
           "access",
-          (M) => M.parentElement,
+          (L) => L.parentElement,
           "optionalAccess",
-          (M) => M.getBoundingClientRect,
+          (L) => L.getBoundingClientRect,
           "call",
-          (M) => M()
+          (L) => L()
         ]);
-        n(16, h = et([x, "optionalAccess", (M) => M.height]) || 0), n(8, m = et([x, "optionalAccess", (M) => M.width]) || 0);
+        n(16, h = et([x, "optionalAccess", (L) => L.height]) || 0), n(8, c = et([x, "optionalAccess", (L) => L.width]) || 0);
       }
       l > f ? (n(10, d = l), n(9, g = null)) : (n(9, g = `${l + h}px`), n(10, d = f - h));
     }
@@ -4838,19 +4838,19 @@ function ol(e, t, n) {
     a,
     _,
     b,
-    m,
+    c,
     g,
     d,
-    c,
-    B,
+    m,
+    T,
     C,
     f,
     l,
     h,
     O,
-    T,
+    P,
     E,
-    k
+    M
   ];
 }
 class al extends Wa {
@@ -4888,14 +4888,14 @@ function fl(e, t, n) {
 }
 const {
   SvelteComponent: hl,
-  append: oe,
+  append: se,
   attr: z,
   binding_callbacks: cl,
   check_outros: ml,
   create_component: ln,
   destroy_component: un,
   detach: bn,
-  element: be,
+  element: de,
   group_outros: _l,
   init: dl,
   insert: gn,
@@ -4907,8 +4907,8 @@ const {
   set_input_value: ii,
   space: Xt,
   text: vl,
-  toggle_class: de,
-  transition_in: ge,
+  toggle_class: _e,
+  transition_in: be,
   transition_out: Me
 } = window.__gradio__svelte__internal, { onMount: yl } = window.__gradio__svelte__internal, { createEventDispatcher: El, afterUpdate: wl } = window.__gradio__svelte__internal;
 function xl(e) {
@@ -4940,13 +4940,13 @@ function ri(e) {
   let t, n, i;
   return n = new Hr({}), {
     c() {
-      t = be("div"), ln(n.$$.fragment), z(t, "class", "icon-wrap svelte-1m1zvyj");
+      t = de("div"), ln(n.$$.fragment), z(t, "class", "icon-wrap svelte-1m1zvyj");
     },
     m(r, s) {
       gn(r, t, s), fn(n, t, null), i = !0;
     },
     i(r) {
-      i || (ge(n.$$.fragment, r), i = !0);
+      i || (be(n.$$.fragment, r), i = !0);
     },
     o(r) {
       Me(n.$$.fragment, r), i = !1;
@@ -4957,7 +4957,7 @@ function ri(e) {
   };
 }
 function Sl(e) {
-  let t, n, i, r, s, u, o, a, f, l, h, m, _, b;
+  let t, n, i, r, s, u, o, a, f, l, h, c, _, b;
   n = new hi({
     props: {
       show_label: (
@@ -5010,7 +5010,7 @@ function Sl(e) {
     e[16]
   ), {
     c() {
-      t = be("div"), ln(n.$$.fragment), i = Xt(), r = be("div"), s = be("div"), u = be("div"), o = be("input"), f = Xt(), g && g.c(), l = Xt(), ln(h.$$.fragment), z(o, "role", "listbox"), z(o, "aria-controls", "dropdown-options"), z(
+      t = de("div"), ln(n.$$.fragment), i = Xt(), r = de("div"), s = de("div"), u = de("div"), o = de("input"), f = Xt(), g && g.c(), l = Xt(), ln(h.$$.fragment), z(o, "role", "listbox"), z(o, "aria-controls", "dropdown-options"), z(
         o,
         "aria-expanded",
         /*show_options*/
@@ -5022,29 +5022,29 @@ function Sl(e) {
         e[0]
       ), z(o, "class", "border-none svelte-1m1zvyj"), o.disabled = /*disabled*/
       e[3], z(o, "autocomplete", "off"), o.readOnly = a = !/*filterable*/
-      e[7], de(o, "subdued", !/*choices_names*/
+      e[7], _e(o, "subdued", !/*choices_names*/
       e[13].includes(
         /*input_text*/
         e[9]
       ) && !/*allow_custom_value*/
-      e[6]), z(u, "class", "secondary-wrap svelte-1m1zvyj"), z(s, "class", "wrap-inner svelte-1m1zvyj"), de(
+      e[6]), z(u, "class", "secondary-wrap svelte-1m1zvyj"), z(s, "class", "wrap-inner svelte-1m1zvyj"), _e(
         s,
         "show_options",
         /*show_options*/
         e[12]
-      ), z(r, "class", "wrap svelte-1m1zvyj"), z(t, "class", "svelte-1m1zvyj"), de(
+      ), z(r, "class", "wrap svelte-1m1zvyj"), z(t, "class", "svelte-1m1zvyj"), _e(
         t,
         "container",
         /*container*/
         e[5]
       );
     },
-    m(d, c) {
-      gn(d, t, c), fn(n, t, null), oe(t, i), oe(t, r), oe(r, s), oe(s, u), oe(u, o), ii(
+    m(d, m) {
+      gn(d, t, m), fn(n, t, null), se(t, i), se(t, r), se(r, s), se(s, u), se(u, o), ii(
         o,
         /*input_text*/
         e[9]
-      ), e[29](o), oe(u, f), g && g.m(u, null), oe(r, l), fn(h, r, null), m = !0, _ || (b = [
+      ), e[29](o), se(u, f), g && g.m(u, null), se(r, l), fn(h, r, null), c = !0, _ || (b = [
         Oe(
           o,
           "input",
@@ -5077,38 +5077,38 @@ function Sl(e) {
         )
       ], _ = !0);
     },
-    p(d, c) {
+    p(d, m) {
       const y = {};
-      c[0] & /*show_label*/
+      m[0] & /*show_label*/
       16 && (y.show_label = /*show_label*/
-      d[4]), c[0] & /*info*/
+      d[4]), m[0] & /*info*/
       2 && (y.info = /*info*/
-      d[1]), c[0] & /*label*/
-      1 | c[1] & /*$$scope*/
-      4 && (y.$$scope = { dirty: c, ctx: d }), n.$set(y), (!m || c[0] & /*show_options*/
+      d[1]), m[0] & /*label*/
+      1 | m[1] & /*$$scope*/
+      4 && (y.$$scope = { dirty: m, ctx: d }), n.$set(y), (!c || m[0] & /*show_options*/
       4096) && z(
         o,
         "aria-expanded",
         /*show_options*/
         d[12]
-      ), (!m || c[0] & /*label*/
+      ), (!c || m[0] & /*label*/
       1) && z(
         o,
         "aria-label",
         /*label*/
         d[0]
-      ), (!m || c[0] & /*disabled*/
+      ), (!c || m[0] & /*disabled*/
       8) && (o.disabled = /*disabled*/
-      d[3]), (!m || c[0] & /*filterable*/
+      d[3]), (!c || m[0] & /*filterable*/
       128 && a !== (a = !/*filterable*/
-      d[7])) && (o.readOnly = a), c[0] & /*input_text*/
+      d[7])) && (o.readOnly = a), m[0] & /*input_text*/
       512 && o.value !== /*input_text*/
       d[9] && ii(
         o,
         /*input_text*/
         d[9]
-      ), (!m || c[0] & /*choices_names, input_text, allow_custom_value*/
-      8768) && de(o, "subdued", !/*choices_names*/
+      ), (!c || m[0] & /*choices_names, input_text, allow_custom_value*/
+      8768) && _e(o, "subdued", !/*choices_names*/
       d[13].includes(
         /*input_text*/
         d[9]
@@ -5116,32 +5116,32 @@ function Sl(e) {
       d[6]), /*disabled*/
       d[3] ? g && (_l(), Me(g, 1, 1, () => {
         g = null;
-      }), ml()) : g ? c[0] & /*disabled*/
-      8 && ge(g, 1) : (g = ri(), g.c(), ge(g, 1), g.m(u, null)), (!m || c[0] & /*show_options*/
-      4096) && de(
+      }), ml()) : g ? m[0] & /*disabled*/
+      8 && be(g, 1) : (g = ri(), g.c(), be(g, 1), g.m(u, null)), (!c || m[0] & /*show_options*/
+      4096) && _e(
         s,
         "show_options",
         /*show_options*/
         d[12]
       );
       const p = {};
-      c[0] & /*show_options*/
+      m[0] & /*show_options*/
       4096 && (p.show_options = /*show_options*/
-      d[12]), c[0] & /*choices*/
+      d[12]), m[0] & /*choices*/
       4 && (p.choices = /*choices*/
-      d[2]), c[0] & /*filtered_indices*/
+      d[2]), m[0] & /*filtered_indices*/
       1024 && (p.filtered_indices = /*filtered_indices*/
-      d[10]), c[0] & /*disabled*/
+      d[10]), m[0] & /*disabled*/
       8 && (p.disabled = /*disabled*/
-      d[3]), c[0] & /*selected_index*/
+      d[3]), m[0] & /*selected_index*/
       2048 && (p.selected_indices = /*selected_index*/
       d[11] === null ? [] : [
         /*selected_index*/
         d[11]
-      ]), c[0] & /*active_index*/
+      ]), m[0] & /*active_index*/
       16384 && (p.active_index = /*active_index*/
-      d[14]), h.$set(p), (!m || c[0] & /*container*/
-      32) && de(
+      d[14]), h.$set(p), (!c || m[0] & /*container*/
+      32) && _e(
         t,
         "container",
         /*container*/
@@ -5149,10 +5149,10 @@ function Sl(e) {
       );
     },
     i(d) {
-      m || (ge(n.$$.fragment, d), ge(g), ge(h.$$.fragment, d), m = !0);
+      c || (be(n.$$.fragment, d), be(g), be(h.$$.fragment, d), c = !0);
     },
     o(d) {
-      Me(n.$$.fragment, d), Me(g), Me(h.$$.fragment, d), m = !1;
+      Me(n.$$.fragment, d), Me(g), Me(h.$$.fragment, d), c = !1;
     },
     d(d) {
       d && bn(t), un(n), e[29](null), g && g.d(), un(h), _ = !1, bl(b);
@@ -5160,65 +5160,65 @@ function Sl(e) {
   };
 }
 function Hl(e, t, n) {
-  let { label: i } = t, { info: r = void 0 } = t, { value: s = [] } = t, u = [], { value_is_output: o = !1 } = t, { choices: a } = t, f, { disabled: l = !1 } = t, { show_label: h } = t, { container: m = !0 } = t, { allow_custom_value: _ = !1 } = t, { filterable: b = !0 } = t, g, d = !1, c, y, p = "", B = "", C = !1, O = [], T = null, E = null, k;
+  let { label: i } = t, { info: r = void 0 } = t, { value: s = [] } = t, u = [], { value_is_output: o = !1 } = t, { choices: a } = t, f, { disabled: l = !1 } = t, { show_label: h } = t, { container: c = !0 } = t, { allow_custom_value: _ = !1 } = t, { filterable: b = !0 } = t, g, d = !1, m, y, p = "", T = "", C = !1, O = [], P = null, E = null, M;
   const x = El();
-  s ? (k = a.map((w) => w[1]).indexOf(s), E = k, E === -1 ? (u = s, E = null) : ([p, u] = a[E], B = p), W()) : a.length > 0 && (k = 0, E = 0, [p, s] = a[E], u = s, B = p);
-  function M() {
-    n(13, c = a.map((w) => w[0])), n(24, y = a.map((w) => w[1]));
+  s ? (M = a.map((w) => w[1]).indexOf(s), E = M, E === -1 ? (u = s, E = null) : ([p, u] = a[E], T = p), W()) : a.length > 0 && (M = 0, E = 0, [p, s] = a[E], u = s, T = p);
+  function L() {
+    n(13, m = a.map((w) => w[0])), n(24, y = a.map((w) => w[1]));
   }
   function W() {
-    M(), s === void 0 || Array.isArray(s) && s.length === 0 ? (n(9, p = ""), n(11, E = null)) : y.includes(s) ? (n(9, p = c[y.indexOf(s)]), n(11, E = y.indexOf(s))) : _ ? (n(9, p = s), n(11, E = null)) : (n(9, p = ""), n(11, E = null)), n(27, k = E);
+    L(), s === void 0 || Array.isArray(s) && s.length === 0 ? (n(9, p = ""), n(11, E = null)) : y.includes(s) ? (n(9, p = m[y.indexOf(s)]), n(11, E = y.indexOf(s))) : _ ? (n(9, p = s), n(11, E = null)) : (n(9, p = ""), n(11, E = null)), n(27, M = E);
   }
   function ee(w) {
     if (n(11, E = parseInt(w.detail.target.dataset.index)), isNaN(E)) {
       n(11, E = null);
       return;
     }
-    n(12, d = !1), n(14, T = null), g.blur();
+    n(12, d = !1), n(14, P = null), g.blur();
   }
   function At(w) {
     n(10, O = a.map((yn, Ze) => Ze)), n(12, d = !0), x("focus");
   }
-  function Pe() {
-    _ ? n(20, s = p) : n(9, p = c[y.indexOf(s)]), n(12, d = !1), n(14, T = null), x("blur");
+  function Ce() {
+    _ ? n(20, s = p) : n(9, p = m[y.indexOf(s)]), n(12, d = !1), n(14, P = null), x("blur");
   }
   function Bt(w) {
-    n(12, [d, T] = fl(w, T, O), d, (n(14, T), n(2, a), n(23, f), n(6, _), n(9, p), n(10, O), n(8, g), n(25, B), n(11, E), n(27, k), n(26, C), n(24, y))), w.key === "Enter" && (T !== null ? (n(11, E = T), n(12, d = !1), g.blur(), n(14, T = null)) : c.includes(p) ? (n(11, E = c.indexOf(p)), n(12, d = !1), n(14, T = null), g.blur()) : _ && (n(20, s = p), n(11, E = null), n(12, d = !1), n(14, T = null), g.blur()), x("enter", s));
+    n(12, [d, P] = fl(w, P, O), d, (n(14, P), n(2, a), n(23, f), n(6, _), n(9, p), n(10, O), n(8, g), n(25, T), n(11, E), n(27, M), n(26, C), n(24, y))), w.key === "Enter" && (P !== null ? (n(11, E = P), n(12, d = !1), g.blur(), n(14, P = null)) : m.includes(p) ? (n(11, E = m.indexOf(p)), n(12, d = !1), n(14, P = null), g.blur()) : _ && (n(20, s = p), n(11, E = null), n(12, d = !1), n(14, P = null), g.blur()), x("enter", s));
   }
   wl(() => {
     n(21, o = !1), n(26, C = !0);
   }), yl(() => {
     g.focus();
   });
-  function Ct() {
-    p = this.value, n(9, p), n(11, E), n(27, k), n(26, C), n(2, a), n(24, y);
+  function Tt() {
+    p = this.value, n(9, p), n(11, E), n(27, M), n(26, C), n(2, a), n(24, y);
   }
-  function Ie(w) {
+  function Pe(w) {
     cl[w ? "unshift" : "push"](() => {
       g = w, n(8, g);
     });
   }
-  const fe = (w) => x("key_up", { key: w.key, input_value: p });
+  const ue = (w) => x("key_up", { key: w.key, input_value: p });
   return e.$$set = (w) => {
-    "label" in w && n(0, i = w.label), "info" in w && n(1, r = w.info), "value" in w && n(20, s = w.value), "value_is_output" in w && n(21, o = w.value_is_output), "choices" in w && n(2, a = w.choices), "disabled" in w && n(3, l = w.disabled), "show_label" in w && n(4, h = w.show_label), "container" in w && n(5, m = w.container), "allow_custom_value" in w && n(6, _ = w.allow_custom_value), "filterable" in w && n(7, b = w.filterable);
+    "label" in w && n(0, i = w.label), "info" in w && n(1, r = w.info), "value" in w && n(20, s = w.value), "value_is_output" in w && n(21, o = w.value_is_output), "choices" in w && n(2, a = w.choices), "disabled" in w && n(3, l = w.disabled), "show_label" in w && n(4, h = w.show_label), "container" in w && n(5, c = w.container), "allow_custom_value" in w && n(6, _ = w.allow_custom_value), "filterable" in w && n(7, b = w.filterable);
   }, e.$$.update = () => {
     e.$$.dirty[0] & /*selected_index, old_selected_index, initialized, choices, choices_values*/
-    218105860 && E !== k && E !== null && C && (n(9, [p, s] = a[E], p, (n(20, s), n(11, E), n(27, k), n(26, C), n(2, a), n(24, y))), n(27, k = E), x("select", {
+    218105860 && E !== M && E !== null && C && (n(9, [p, s] = a[E], p, (n(20, s), n(11, E), n(27, M), n(26, C), n(2, a), n(24, y))), n(27, M = E), x("select", {
       index: E,
       value: y[E],
       selected: !0
     })), e.$$.dirty[0] & /*value, old_value, value_is_output*/
     7340032 && s != u && (W(), ul(x, s, o), n(22, u = s)), e.$$.dirty[0] & /*choices*/
-    4 && M(), e.$$.dirty[0] & /*choices, old_choices, allow_custom_value, input_text, filtered_indices, filter_input*/
-    8390468 && a !== f && (_ || W(), n(23, f = a), n(10, O = ni(a, p)), !_ && O.length > 0 && n(14, T = O[0]), g == document.activeElement && n(12, d = !0)), e.$$.dirty[0] & /*input_text, old_input_text, choices, allow_custom_value, filtered_indices*/
-    33556036 && p !== B && (n(10, O = ni(a, p)), n(25, B = p), !_ && O.length > 0 && n(14, T = O[0]));
+    4 && L(), e.$$.dirty[0] & /*choices, old_choices, allow_custom_value, input_text, filtered_indices, filter_input*/
+    8390468 && a !== f && (_ || W(), n(23, f = a), n(10, O = ni(a, p)), !_ && O.length > 0 && n(14, P = O[0]), g == document.activeElement && n(12, d = !0)), e.$$.dirty[0] & /*input_text, old_input_text, choices, allow_custom_value, filtered_indices*/
+    33556036 && p !== T && (n(10, O = ni(a, p)), n(25, T = p), !_ && O.length > 0 && n(14, P = O[0]));
   }, [
     i,
     r,
     a,
     l,
     h,
-    m,
+    c,
     _,
     b,
     g,
@@ -5226,24 +5226,24 @@ function Hl(e, t, n) {
     O,
     E,
     d,
-    c,
-    T,
+    m,
+    P,
     x,
     ee,
     At,
-    Pe,
+    Ce,
     Bt,
     s,
     o,
     u,
     f,
     y,
-    B,
+    T,
     C,
-    k,
-    Ct,
-    Ie,
-    fe
+    M,
+    Tt,
+    Pe,
+    ue
   ];
 }
 class Al extends hl {
@@ -5278,11 +5278,11 @@ const {
   create_component: nt,
   destroy_component: it,
   detach: pn,
-  element: ae,
-  init: Cl,
+  element: oe,
+  init: Tl,
   insert: vn,
   mount_component: rt,
-  safe_not_equal: Tl,
+  safe_not_equal: Cl,
   set_style: st,
   space: Vt,
   text: Xi,
@@ -5318,7 +5318,7 @@ function Ll(e) {
   };
 }
 function Ml(e) {
-  let t, n, i, r, s, u, o, a, f, l, h, m, _, b, g;
+  let t, n, i, r, s, u, o, a, f, l, h, c, _, b, g;
   return s = new Al({
     props: {
       value: (
@@ -5375,28 +5375,28 @@ function Ml(e) {
     e[11]
   ), {
     c() {
-      t = ae("div"), n = ae("div"), i = ae("span"), r = ae("div"), nt(s.$$.fragment), u = Vt(), o = ae("div"), nt(a.$$.fragment), f = Vt(), l = ae("div"), nt(h.$$.fragment), m = Vt(), _ = ae("div"), nt(b.$$.fragment), st(r, "margin-right", "10px"), st(o, "margin-right", "40px"), st(o, "margin-bottom", "8px"), st(l, "margin-right", "8px"), tt(i, "class", "model-content svelte-hkn2q1"), tt(n, "class", "modal-container svelte-hkn2q1"), tt(t, "class", "modal svelte-hkn2q1"), tt(t, "id", "model-box-edit");
+      t = oe("div"), n = oe("div"), i = oe("span"), r = oe("div"), nt(s.$$.fragment), u = Vt(), o = oe("div"), nt(a.$$.fragment), f = Vt(), l = oe("div"), nt(h.$$.fragment), c = Vt(), _ = oe("div"), nt(b.$$.fragment), st(r, "margin-right", "10px"), st(o, "margin-right", "40px"), st(o, "margin-bottom", "8px"), st(l, "margin-right", "8px"), tt(i, "class", "model-content svelte-hkn2q1"), tt(n, "class", "modal-container svelte-hkn2q1"), tt(t, "class", "modal svelte-hkn2q1"), tt(t, "id", "model-box-edit");
     },
-    m(d, c) {
-      vn(d, t, c), $(t, n), $(n, i), $(i, r), rt(s, r, null), $(i, u), $(i, o), rt(a, o, null), $(i, f), $(i, l), rt(h, l, null), $(i, m), $(i, _), rt(b, _, null), g = !0;
+    m(d, m) {
+      vn(d, t, m), $(t, n), $(n, i), $(i, r), rt(s, r, null), $(i, u), $(i, o), rt(a, o, null), $(i, f), $(i, l), rt(h, l, null), $(i, c), $(i, _), rt(b, _, null), g = !0;
     },
-    p(d, [c]) {
+    p(d, [m]) {
       const y = {};
-      c & /*currentLabel*/
+      m & /*currentLabel*/
       1 && (y.value = /*currentLabel*/
-      d[0]), c & /*choices*/
+      d[0]), m & /*choices*/
       4 && (y.choices = /*choices*/
       d[2]), s.$set(y);
       const p = {};
-      c & /*currentColor*/
+      m & /*currentColor*/
       2 && (p.value = /*currentColor*/
       d[1]), a.$set(p);
-      const B = {};
-      c & /*$$scope*/
-      16384 && (B.$$scope = { dirty: c, ctx: d }), h.$set(B);
+      const T = {};
+      m & /*$$scope*/
+      16384 && (T.$$scope = { dirty: m, ctx: d }), h.$set(T);
       const C = {};
-      c & /*$$scope*/
-      16384 && (C.$$scope = { dirty: c, ctx: d }), b.$set(C);
+      m & /*$$scope*/
+      16384 && (C.$$scope = { dirty: m, ctx: d }), b.$set(C);
     },
     i(d) {
       g || (ot(s.$$.fragment, d), ot(a.$$.fragment, d), ot(h.$$.fragment, d), ot(b.$$.fragment, d), g = !0);
@@ -5412,27 +5412,27 @@ function Ml(e) {
 function Rl(e, t, n) {
   let { label: i = "" } = t, { currentLabel: r = "" } = t, { choices: s = [] } = t, { choicesColors: u = [] } = t, { color: o = "" } = t, { currentColor: a = "" } = t;
   const f = Pl();
-  function l(c) {
+  function l(m) {
     f("change", {
       label: r,
       color: a,
-      ok: c
+      ok: m
     });
   }
-  function h(c) {
-    const { detail: y } = c;
+  function h(m) {
+    const { detail: y } = m;
     let p = y;
     Number.isInteger(p) ? (Array.isArray(u) && p < u.length && n(1, a = u[p]), Array.isArray(s) && p < s.length && n(0, r = s[p][0])) : n(0, r = p);
   }
-  function m(c) {
-    const { detail: y } = c;
+  function c(m) {
+    const { detail: y } = m;
     n(1, a = y);
   }
-  function _(c) {
-    h(c), l(!0);
+  function _(m) {
+    h(m), l(!0);
   }
-  function b(c) {
-    switch (c.key) {
+  function b(m) {
+    switch (m.key) {
       case "Enter":
         l(!0);
         break;
@@ -5444,15 +5444,15 @@ function Rl(e, t, n) {
     document.removeEventListener("keydown", b);
   });
   const g = () => l(!1), d = () => l(!0);
-  return e.$$set = (c) => {
-    "label" in c && n(7, i = c.label), "currentLabel" in c && n(0, r = c.currentLabel), "choices" in c && n(2, s = c.choices), "choicesColors" in c && n(8, u = c.choicesColors), "color" in c && n(9, o = c.color), "currentColor" in c && n(1, a = c.currentColor);
+  return e.$$set = (m) => {
+    "label" in m && n(7, i = m.label), "currentLabel" in m && n(0, r = m.currentLabel), "choices" in m && n(2, s = m.choices), "choicesColors" in m && n(8, u = m.choicesColors), "color" in m && n(9, o = m.color), "currentColor" in m && n(1, a = m.currentColor);
   }, [
     r,
     a,
     s,
     l,
     h,
-    m,
+    c,
     _,
     i,
     u,
@@ -5463,7 +5463,7 @@ function Rl(e, t, n) {
 }
 class Vi extends Bl {
   constructor(t) {
-    super(), Cl(this, t, Rl, Ml, Tl, {
+    super(), Tl(this, t, Rl, Ml, Cl, {
       label: 7,
       currentLabel: 0,
       choices: 2,
@@ -5484,27 +5484,27 @@ function qt(e, t) {
   return `rgba(${i}, ${r}, ${s}, ${t})`;
 }
 class Wt {
-  constructor(t, n, i, r, s, u, o, a, f, l, h = "rgb(255, 255, 255)", m = 0.5, _ = 25, b = 1) {
+  constructor(t, n, i, r, s, u, o, a, f, l, h = "rgb(255, 255, 255)", c = 0.5, _ = 25, b = 1) {
     this.stopDrag = () => {
       this.isDragging = !1, document.removeEventListener("mousemove", this.handleDrag), document.removeEventListener("mouseup", this.stopDrag);
     }, this.handleDrag = (g) => {
       if (this.isDragging) {
-        let d = g.clientX - this.offsetMouseX - this.xmin, c = g.clientY - this.offsetMouseY - this.ymin;
+        let d = g.clientX - this.offsetMouseX - this.xmin, m = g.clientY - this.offsetMouseY - this.ymin;
         const y = this.canvasXmax - this.canvasXmin, p = this.canvasYmax - this.canvasYmin;
-        d = J(d, -this.xmin, y - this.xmax), c = J(c, -this.ymin, p - this.ymax), this.xmin += d, this.ymin += c, this.xmax += d, this.ymax += c, this.updateHandles(), this.renderCallBack();
+        d = J(d, -this.xmin, y - this.xmax), m = J(m, -this.ymin, p - this.ymax), this.xmin += d, this.ymin += m, this.xmax += d, this.ymax += m, this.updateHandles(), this.renderCallBack();
       }
     }, this.handleResize = (g) => {
       if (this.isResizing) {
-        const d = g.clientX, c = g.clientY, y = d - this.resizeHandles[this.resizingHandleIndex].xmin - this.offsetMouseX, p = c - this.resizeHandles[this.resizingHandleIndex].ymin - this.offsetMouseY, B = this.canvasXmax - this.canvasXmin, C = this.canvasYmax - this.canvasYmin;
+        const d = g.clientX, m = g.clientY, y = d - this.resizeHandles[this.resizingHandleIndex].xmin - this.offsetMouseX, p = m - this.resizeHandles[this.resizingHandleIndex].ymin - this.offsetMouseY, T = this.canvasXmax - this.canvasXmin, C = this.canvasYmax - this.canvasYmin;
         switch (this.resizingHandleIndex) {
           case 0:
             this.xmin += y, this.ymin += p, this.xmin = J(this.xmin, 0, this.xmax - this.minSize), this.ymin = J(this.ymin, 0, this.ymax - this.minSize);
             break;
           case 1:
-            this.xmax += y, this.ymin += p, this.xmax = J(this.xmax, this.xmin + this.minSize, B), this.ymin = J(this.ymin, 0, this.ymax - this.minSize);
+            this.xmax += y, this.ymin += p, this.xmax = J(this.xmax, this.xmin + this.minSize, T), this.ymin = J(this.ymin, 0, this.ymax - this.minSize);
             break;
           case 2:
-            this.xmax += y, this.ymax += p, this.xmax = J(this.xmax, this.xmin + this.minSize, B), this.ymax = J(this.ymax, this.ymin + this.minSize, C);
+            this.xmax += y, this.ymax += p, this.xmax = J(this.xmax, this.xmin + this.minSize, T), this.ymax = J(this.ymax, this.ymin + this.minSize, C);
             break;
           case 3:
             this.xmin += y, this.ymax += p, this.xmin = J(this.xmin, 0, this.xmax - this.minSize), this.ymax = J(this.ymax, this.ymin + this.minSize, C);
@@ -5514,7 +5514,7 @@ class Wt {
       }
     }, this.stopResize = () => {
       this.isResizing = !1, document.removeEventListener("mousemove", this.handleResize), document.removeEventListener("mouseup", this.stopResize);
-    }, this.renderCallBack = t, this.canvasXmin = n, this.canvasYmin = i, this.canvasXmax = r, this.canvasYmax = s, this.scaleFactor = b, this.label = u, this.isDragging = !1, [this.xmin, this.ymin] = this.toBoxCoordinates(o, a), [this.xmax, this.ymax] = this.toBoxCoordinates(f, l), this.isResizing = !1, this.isSelected = !1, this.offsetMouseX = 0, this.offsetMouseY = 0, this.resizeHandleSize = 8, this.updateHandles(), this.resizingHandleIndex = -1, this.minSize = _, this.color = h, this.alpha = m;
+    }, this.renderCallBack = t, this.canvasXmin = n, this.canvasYmin = i, this.canvasXmax = r, this.canvasYmax = s, this.scaleFactor = b, this.label = u, this.isDragging = !1, this.xmin = o, this.ymin = a, this.xmax = f, this.ymax = l, this.isResizing = !1, this.isSelected = !1, this.offsetMouseX = 0, this.offsetMouseY = 0, this.resizeHandleSize = 8, this.updateHandles(), this.resizingHandleIndex = -1, this.minSize = _, this.color = h, this.alpha = c;
   }
   toJSON() {
     return {
@@ -5628,20 +5628,20 @@ const K = [
 ];
 const {
   SvelteComponent: kl,
-  append: pe,
-  attr: le,
+  append: ge,
+  attr: ae,
   binding_callbacks: Dl,
   bubble: si,
   check_outros: Yt,
   create_component: De,
   destroy_component: Ue,
-  detach: ve,
-  element: we,
+  detach: pe,
+  element: Ee,
   empty: Ul,
   group_outros: Zt,
   init: Gl,
-  insert: ye,
-  listen: re,
+  insert: ve,
+  listen: ie,
   mount_component: Ge,
   noop: Fl,
   run_all: qi,
@@ -5651,26 +5651,26 @@ const {
   transition_out: q
 } = window.__gradio__svelte__internal, { onMount: jl, onDestroy: Xl, createEventDispatcher: Vl } = window.__gradio__svelte__internal;
 function oi(e) {
-  let t, n, i, r, s, u, o, a, f, l, h, m;
+  let t, n, i, r, s, u, o, a, f, l, h, c;
   return i = new Gr({}), u = new Or({}), f = new gr({}), {
     c() {
-      t = we("span"), n = we("button"), De(i.$$.fragment), r = Fe(), s = we("button"), De(u.$$.fragment), o = Fe(), a = we("button"), De(f.$$.fragment), le(n, "class", "icon svelte-182gnnj"), le(s, "class", "icon svelte-182gnnj"), le(a, "class", "icon svelte-182gnnj"), le(t, "class", "canvas-control svelte-182gnnj");
+      t = Ee("span"), n = Ee("button"), De(i.$$.fragment), r = Fe(), s = Ee("button"), De(u.$$.fragment), o = Fe(), a = Ee("button"), De(f.$$.fragment), ae(n, "class", "icon svelte-182gnnj"), ae(s, "class", "icon svelte-182gnnj"), ae(a, "class", "icon svelte-182gnnj"), ae(t, "class", "canvas-control svelte-182gnnj");
     },
     m(_, b) {
-      ye(_, t, b), pe(t, n), Ge(i, n, null), pe(t, r), pe(t, s), Ge(u, s, null), pe(t, o), pe(t, a), Ge(f, a, null), l = !0, h || (m = [
-        re(
+      ve(_, t, b), ge(t, n), Ge(i, n, null), ge(t, r), ge(t, s), Ge(u, s, null), ge(t, o), ge(t, a), Ge(f, a, null), l = !0, h || (c = [
+        ie(
           n,
           "click",
           /*click_handler*/
           e[22]
         ),
-        re(
+        ie(
           s,
           "click",
           /*click_handler_1*/
           e[23]
         ),
-        re(
+        ie(
           a,
           "click",
           /*click_handler_2*/
@@ -5686,7 +5686,7 @@ function oi(e) {
       q(i.$$.fragment, _), q(u.$$.fragment, _), q(f.$$.fragment, _), l = !1;
     },
     d(_) {
-      _ && ve(t), Ue(i), Ue(u), Ue(f), h = !1, qi(m);
+      _ && pe(t), Ue(i), Ue(u), Ue(f), h = !1, qi(c);
     }
   };
 }
@@ -5857,41 +5857,41 @@ function ql(e) {
   ), h = (
     /*editModalVisible*/
     e[6] && ai(e)
-  ), m = (
+  ), c = (
     /*newModalVisible*/
     e[7] && li(e)
   );
   return {
     c() {
-      t = we("div"), n = we("canvas"), i = Fe(), l && l.c(), r = Fe(), h && h.c(), s = Fe(), m && m.c(), u = Ul(), le(n, "class", "canvas-annotator svelte-182gnnj"), le(t, "class", "canvas-container svelte-182gnnj"), le(t, "tabindex", "-1");
+      t = Ee("div"), n = Ee("canvas"), i = Fe(), l && l.c(), r = Fe(), h && h.c(), s = Fe(), c && c.c(), u = Ul(), ae(n, "class", "canvas-annotator svelte-182gnnj"), ae(t, "class", "canvas-container svelte-182gnnj"), ae(t, "tabindex", "-1");
     },
     m(_, b) {
-      ye(_, t, b), pe(t, n), e[21](n), ye(_, i, b), l && l.m(_, b), ye(_, r, b), h && h.m(_, b), ye(_, s, b), m && m.m(_, b), ye(_, u, b), o = !0, a || (f = [
-        re(
+      ve(_, t, b), ge(t, n), e[21](n), ve(_, i, b), l && l.m(_, b), ve(_, r, b), h && h.m(_, b), ve(_, s, b), c && c.m(_, b), ve(_, u, b), o = !0, a || (f = [
+        ie(
           n,
           "mousedown",
           /*handleMouseDown*/
           e[8]
         ),
-        re(
+        ie(
           n,
           "mouseup",
           /*handleMouseUp*/
           e[9]
         ),
-        re(
+        ie(
           n,
           "dblclick",
           /*handleDoubleClick*/
           e[13]
         ),
-        re(
+        ie(
           t,
           "focusin",
           /*handleCanvasFocus*/
           e[16]
         ),
-        re(
+        ie(
           t,
           "focusout",
           /*handleCanvasBlur*/
@@ -5909,19 +5909,19 @@ function ql(e) {
       64 && G(h, 1)) : (h = ai(_), h.c(), G(h, 1), h.m(s.parentNode, s)) : h && (Zt(), q(h, 1, 1, () => {
         h = null;
       }), Yt()), /*newModalVisible*/
-      _[7] ? m ? (m.p(_, b), b[0] & /*newModalVisible*/
-      128 && G(m, 1)) : (m = li(_), m.c(), G(m, 1), m.m(u.parentNode, u)) : m && (Zt(), q(m, 1, 1, () => {
-        m = null;
+      _[7] ? c ? (c.p(_, b), b[0] & /*newModalVisible*/
+      128 && G(c, 1)) : (c = li(_), c.c(), G(c, 1), c.m(u.parentNode, u)) : c && (Zt(), q(c, 1, 1, () => {
+        c = null;
       }), Yt());
     },
     i(_) {
-      o || (G(l), G(h), G(m), o = !0);
+      o || (G(l), G(h), G(c), o = !0);
     },
     o(_) {
-      q(l), q(h), q(m), o = !1;
+      q(l), q(h), q(c), o = !1;
     },
     d(_) {
-      _ && (ve(t), ve(i), ve(r), ve(s), ve(u)), e[21](null), l && l.d(_), h && h.d(_), m && m.d(_), a = !1, qi(f);
+      _ && (pe(t), pe(i), pe(r), pe(s), pe(u)), e[21](null), l && l.d(_), h && h.d(_), c && c.d(_), a = !1, qi(f);
     }
   };
 }
@@ -5934,46 +5934,46 @@ function Xe(e) {
   return "#" + (1 << 24 | n << 16 | i << 8 | r).toString(16).slice(1);
 }
 function Wl(e, t, n) {
-  let { imageUrl: i = null } = t, { interactive: r } = t, { boxAlpha: s = 0.5 } = t, { boxMinSize: u = 25 } = t, { value: o } = t, { choices: a = [] } = t, { choicesColors: f = [] } = t, l, h, m = null, _ = -1, b = 0, g = 0, d = 0, c = 0, y = 1, p = 0, B = 0, C = !1, O = !1;
-  const T = Vl();
+  let { imageUrl: i = null } = t, { interactive: r } = t, { boxAlpha: s = 0.5 } = t, { boxMinSize: u = 25 } = t, { value: o } = t, { choices: a = [] } = t, { choicesColors: f = [] } = t, l, h, c = null, _ = -1, b = 0, g = 0, d = 0, m = 0, y = 1, p = 0, T = 0, C = !1, O = !1;
+  const P = Vl();
   function E() {
     if (h) {
-      h.clearRect(0, 0, l.width, l.height), m !== null && h.drawImage(m, b, g, p, B);
+      h.clearRect(0, 0, l.width, l.height), c !== null && h.drawImage(c, b, g, p, T);
       for (const v of o.boxes.slice().reverse())
         v.render(h);
     }
   }
-  function k(v) {
-    n(5, _ = v), o.boxes.forEach((P) => {
-      P.setSelected(!1);
+  function M(v) {
+    n(5, _ = v), o.boxes.forEach((A) => {
+      A.setSelected(!1);
     }), v >= 0 && v < o.boxes.length && o.boxes[v].setSelected(!0), E();
   }
   function x(v) {
     if (!r)
       return;
-    const P = l.getBoundingClientRect(), R = v.clientX - P.left, L = v.clientY - P.top;
-    for (const [te, Y] of o.boxes.entries()) {
-      const Qe = Y.indexOfPointInsideHandle(R, L);
+    const A = l.getBoundingClientRect(), R = v.clientX - A.left, U = v.clientY - A.top;
+    for (const [Ie, Y] of o.boxes.entries()) {
+      const Qe = Y.indexOfPointInsideHandle(R, U);
       if (Qe >= 0) {
-        k(te), Y.startResize(Qe, v);
+        M(Ie), Y.startResize(Qe, v);
         return;
       }
     }
-    for (const [te, Y] of o.boxes.entries())
-      if (Y.isPointInsideBox(R, L)) {
-        k(te), Y.startDrag(v);
+    for (const [Ie, Y] of o.boxes.entries())
+      if (Y.isPointInsideBox(R, U)) {
+        M(Ie), Y.startDrag(v);
         return;
       }
-    k(-1);
+    M(-1);
   }
-  function M(v) {
-    T("change");
+  function L(v) {
+    P("change");
   }
   function W(v) {
     if (r)
       switch (v.key) {
         case "Delete":
-          Ie();
+          Pe();
           break;
       }
   }
@@ -5982,75 +5982,72 @@ function Wl(e, t, n) {
   }
   function At(v) {
     n(7, O = !1);
-    const { detail: P } = v;
-    let R = P.label, L = P.color;
-    if (P.ok) {
-      L === null || L === "" ? L = K[o.boxes.length % K.length] : L = ui(L);
-      let Y = b + (d - b) / 3, Qe = d - (d - b) / 3, tr = g + (c - g) / 3, nr = c - (c - g) / 3, ir = new Wt(E, b, g, d, c, R, Math.round(Y), Math.round(tr), Math.round(Qe), Math.round(nr), L, s, u, y);
-      n(0, o.boxes = [ir, ...o.boxes], o), E(), T("change");
+    const { detail: A } = v;
+    let R = A.label, U = A.color;
+    if (A.ok) {
+      U === null || U === "" ? U = K[o.boxes.length % K.length] : U = ui(U);
+      let Y = p / 3 / y, Qe = p / 3 * 2 / y, tr = T / 3 / y, nr = T / 3 * 2 / y, ir = new Wt(E, b, g, d, m, R, Math.round(Y), Math.round(tr), Math.round(Qe), Math.round(nr), U, s, u);
+      n(0, o.boxes = [ir, ...o.boxes], o), E(), P("change");
     }
   }
-  function Pe() {
+  function Ce() {
     _ >= 0 && _ < o.boxes.length && n(6, C = !0);
   }
   function Bt(v) {
-    r && Pe();
+    r && Ce();
   }
-  function Ct(v) {
+  function Tt(v) {
     n(6, C = !1);
-    const { detail: P } = v;
-    let R = P.label, L = P.color;
-    if (P.ok && _ >= 0 && _ < o.boxes.length) {
+    const { detail: A } = v;
+    let R = A.label, U = A.color;
+    if (A.ok && _ >= 0 && _ < o.boxes.length) {
       let Y = o.boxes[_];
-      Y.label = R, Y.color = ui(L), E(), T("change");
+      Y.label = R, Y.color = ui(U), E(), P("change");
     }
   }
-  function Ie() {
-    _ >= 0 && _ < o.boxes.length && (o.boxes.splice(_, 1), k(-1), T("change"));
+  function Pe() {
+    _ >= 0 && _ < o.boxes.length && (o.boxes.splice(_, 1), M(-1), P("change"));
   }
-  function fe() {
+  function ue() {
     if (l) {
-      if (y = 1, n(4, l.width = l.clientWidth, l), m !== null)
-        if (m.width > l.width)
-          y = l.width / m.width, p = m.width * y, B = m.height * y, b = 0, g = 0, d = p, c = B, n(4, l.height = B, l);
+      if (y = 1, n(4, l.width = l.clientWidth, l), c !== null)
+        if (c.width > l.width)
+          y = l.width / c.width, p = c.width * y, T = c.height * y, b = 0, g = 0, d = p, m = T, n(4, l.height = T, l);
         else {
-          p = m.width, B = m.height;
+          p = c.width, T = c.height;
           var v = (l.width - p) / 2;
-          b = v, g = 0, d = v + p, c = m.height, n(4, l.height = B, l);
+          b = v, g = 0, d = v + p, m = c.height, n(4, l.height = T, l);
         }
       else
-        b = 0, g = 0, d = l.width, c = l.height, n(4, l.height = l.clientHeight, l);
-      if (d > 0 && c > 0)
-        for (const P of o.boxes)
-          P.canvasXmin = b, P.canvasYmin = g, P.canvasXmax = d, P.canvasYmax = c, P.setScaleFactor(y);
-      E(), T("change");
+        b = 0, g = 0, d = l.width, m = l.height, n(4, l.height = l.clientHeight, l);
+      if (d > 0 && m > 0)
+        for (const A of o.boxes)
+          A.canvasXmin = b, A.canvasYmin = g, A.canvasXmax = d, A.canvasYmax = m, A.setScaleFactor(y);
+      E(), P("change");
     }
   }
-  const w = new ResizeObserver(fe);
+  const w = new ResizeObserver(ue);
   function yn() {
-    let v = [];
-    for (let P = 0; P < o.boxes.length; P++) {
-      let R = o.boxes[P];
-      if (!(R instanceof Wt)) {
-        let L = "", te = "";
-        R.hasOwnProperty("color") ? (L = R.color, Array.isArray(L) && L.length === 3 && (L = `rgb(${L[0]}, ${L[1]}, ${L[2]})`)) : L = K[v.length % K.length], R.hasOwnProperty("label") && (te = R.label), R = new Wt(E, b, g, d, c, te, R.xmin, R.ymin, R.xmax, R.ymax, L, s, u, y);
+    for (let v = 0; v < o.boxes.length; v++) {
+      let A = o.boxes[v];
+      if (!(A instanceof Wt)) {
+        let R = "", U = "";
+        A.hasOwnProperty("color") ? (R = A.color, Array.isArray(R) && R.length === 3 && (R = `rgb(${R[0]}, ${R[1]}, ${R[2]})`)) : R = K[v % K.length], A.hasOwnProperty("label") && (U = A.label), A = new Wt(E, b, g, d, m, U, A.xmin, A.ymin, A.xmax, A.ymax, R, s, u), n(0, o.boxes[v] = A, o);
       }
-      v.push(R);
     }
-    n(0, o.boxes = v, o);
   }
   function Ze() {
-    i !== null && (m === null || m.src != i) && (m = new Image(), m.src = i, m.onload = function() {
-      fe(), E();
+    i !== null && (c === null || c.src != i) && (c = new Image(), c.src = i, c.onload = function() {
+      ue(), E();
     });
   }
   jl(() => {
     if (Array.isArray(a) && a.length > 0 && (!Array.isArray(f) || f.length == 0))
       for (let v = 0; v < a.length; v++) {
-        let P = K[v % K.length];
-        f.push(Xe(P));
+        let A = K[v % K.length];
+        f.push(Xe(A));
       }
-    h = l.getContext("2d"), w.observe(l), Ze(), fe(), E();
+    h = l.getContext("2d"), w.observe(l), Ze(), ue(), E();
   });
   function Wi() {
     document.addEventListener("keydown", W);
@@ -6066,7 +6063,7 @@ function Wl(e, t, n) {
       l = v, n(4, l);
     });
   }
-  const Qi = () => ee(), Ji = () => Pe(), Ki = () => Ie();
+  const Qi = () => ee(), Ji = () => Ce(), Ki = () => Pe();
   function $i(v) {
     si.call(this, e, v);
   }
@@ -6077,7 +6074,7 @@ function Wl(e, t, n) {
     "imageUrl" in v && n(18, i = v.imageUrl), "interactive" in v && n(1, r = v.interactive), "boxAlpha" in v && n(19, s = v.boxAlpha), "boxMinSize" in v && n(20, u = v.boxMinSize), "value" in v && n(0, o = v.value), "choices" in v && n(2, a = v.choices), "choicesColors" in v && n(3, f = v.choicesColors);
   }, e.$$.update = () => {
     e.$$.dirty[0] & /*value*/
-    1 && (Ze(), yn(), fe(), E());
+    1 && (Ze(), yn(), ue(), E());
   }, [
     o,
     r,
@@ -6088,13 +6085,13 @@ function Wl(e, t, n) {
     C,
     O,
     x,
-    M,
+    L,
     ee,
     At,
-    Pe,
+    Ce,
     Bt,
-    Ct,
-    Ie,
+    Tt,
+    Pe,
     Wi,
     Yi,
     i,
@@ -6220,11 +6217,11 @@ function au(e) {
 }
 function lu(e, t, n) {
   let { src: i = void 0 } = t, { interactive: r } = t, { boxesAlpha: s } = t, { labelList: u } = t, { labelColors: o } = t, { boxMinSize: a } = t, { value: f } = t, l, h;
-  const m = ou();
+  const c = ou();
   function _(g) {
     f = g, n(0, f);
   }
-  const b = () => m("change");
+  const b = () => c("change");
   return e.$$set = (g) => {
     "src" in g && n(8, i = g.src), "interactive" in g && n(1, r = g.interactive), "boxesAlpha" in g && n(2, s = g.boxesAlpha), "labelList" in g && n(3, u = g.labelList), "labelColors" in g && n(4, o = g.labelColors), "boxMinSize" in g && n(5, a = g.boxMinSize), "value" in g && n(0, f = g.value);
   }, e.$$.update = () => {
@@ -6244,7 +6241,7 @@ function lu(e, t, n) {
     o,
     a,
     l,
-    m,
+    c,
     i,
     h,
     _,
@@ -6277,7 +6274,7 @@ const {
   insert: vu,
   mount_component: yu,
   safe_not_equal: Eu,
-  toggle_class: ie,
+  toggle_class: ne,
   transition_in: mt,
   transition_out: hn
 } = window.__gradio__svelte__internal;
@@ -6324,22 +6321,22 @@ function wu(e) {
   );
   return {
     c() {
-      t = bu("div"), i && i.c(), hu(t, "class", "container svelte-1sgcyba"), ie(
+      t = bu("div"), i && i.c(), hu(t, "class", "container svelte-1sgcyba"), ne(
         t,
         "table",
         /*type*/
         e[2] === "table"
-      ), ie(
+      ), ne(
         t,
         "gallery",
         /*type*/
         e[2] === "gallery"
-      ), ie(
+      ), ne(
         t,
         "selected",
         /*selected*/
         e[3]
-      ), ie(
+      ), ne(
         t,
         "border",
         /*value*/
@@ -6355,25 +6352,25 @@ function wu(e) {
       1 && mt(i, 1)) : (i = fi(r), i.c(), mt(i, 1), i.m(t, null)) : i && (gu(), hn(i, 1, 1, () => {
         i = null;
       }), cu()), (!n || s & /*type*/
-      4) && ie(
+      4) && ne(
         t,
         "table",
         /*type*/
         r[2] === "table"
       ), (!n || s & /*type*/
-      4) && ie(
+      4) && ne(
         t,
         "gallery",
         /*type*/
         r[2] === "gallery"
       ), (!n || s & /*selected*/
-      8) && ie(
+      8) && ne(
         t,
         "selected",
         /*selected*/
         r[3]
       ), (!n || s & /*value*/
-      1) && ie(
+      1) && ne(
         t,
         "border",
         /*value*/

src/demo/app.py

@@ -27,12 +27,7 @@ def crop(annotations):
 
 
 def get_boxes_json(annotations):
-    return [
-        {k: box[k]
-            for k in box if k in ("xmin", "ymin", "xmax", "ymax", "label")}
-        for box in annotations["boxes"]
-    ]
-
+    return annotations["boxes"]
 
 with gr.Blocks() as demo:
     with gr.Tab("Object annotation"):

src/demo/space.py

@@ -67,12 +67,7 @@ def crop(annotations):
 
 
 def get_boxes_json(annotations):
-    return [
-        {k: box[k]
-            for k in box if k in ("xmin", "ymin", "xmax", "ymax", "label")}
-        for box in annotations["boxes"]
-    ]
-
+    return annotations["boxes"]
 
 with gr.Blocks() as demo:
     with gr.Tab("Object annotation"):

src/frontend/shared/Box.ts

@@ -67,8 +67,10 @@ export default class Box {
         this.scaleFactor = scaleFactor;
         this.label = label;
         this.isDragging = false;
-        [this.xmin, this.ymin] = this.toBoxCoordinates(xmin, ymin);
-        [this.xmax, this.ymax] = this.toBoxCoordinates(xmax, ymax);
+        this.xmin = xmin;
+        this.ymin = ymin;
+        this.xmax = xmax;
+        this.ymax = ymax;
         this.isResizing = false;
         this.isSelected = false;
         this.offsetMouseX = 0;

src/frontend/shared/Canvas.svelte

@@ -135,10 +135,10 @@
 			} else {
 				color = colorHexToRGB(color);
 			}
-			let xmin = canvasXmin + ((canvasXmax - canvasXmin) / 3);
-			let xmax = canvasXmax - ((canvasXmax - canvasXmin) / 3);
-			let ymin = canvasYmin + ((canvasYmax - canvasYmin) / 3);
-			let ymax = canvasYmax - ((canvasYmax - canvasYmin) / 3);
+			let xmin = (imageWidth / 3) / scaleFactor;
+			let xmax = ((imageWidth / 3)*2) / scaleFactor;
+			let ymin = (imageHeight / 3) / scaleFactor;
+			let ymax = ((imageHeight / 3)*2) / scaleFactor;
 			let box = new Box(
 				draw,
 				canvasXmin,
@@ -153,7 +153,6 @@
 				color,
 				boxAlpha,
 				boxMinSize,
-				scaleFactor
 			);
 			value.boxes = [box, ...value.boxes];
 			draw();
@@ -245,7 +244,6 @@
 	const observer = new ResizeObserver(resize);
 
 	function parseInputBoxes() {
-		let newBoxes = [];
 		for (let i = 0; i < value.boxes.length; i++) {
 			let box = value.boxes[i];
 			if (!(box instanceof Box)) {
@@ -257,7 +255,7 @@
             			color = `rgb(${color[0]}, ${color[1]}, ${color[2]})`;
         			}
 				} else {
-					color = Colors[newBoxes.length % Colors.length];
+					color = Colors[i % Colors.length];
 				}
 				if (box.hasOwnProperty("label")) {
 					label = box["label"];
@@ -276,12 +274,10 @@
 					color,
 					boxAlpha,
 					boxMinSize,
-					scaleFactor
 				);
+				value.boxes[i] = box;
 			}
-			newBoxes.push(box);
 		}
-		value.boxes = newBoxes;
 	}
 
 	$: {

src/pyproject.toml

@@ -8,7 +8,7 @@ build-backend = "hatchling.build"
 
 [project]
 name = "gradio_image_annotation"
-version = "0.0.5"
+version = "0.0.6"
 description = "A Gradio component that can be used to annotate images with bounding boxes."
 readme = "README.md"
 license = "MIT"
@@ -40,7 +40,7 @@ Issues = "https://github.com/edgarGracia/gradio_image_annotator/issues"
 dev = ["build", "twine"]
 
 [tool.hatch.build]
-artifacts = ["/backend/gradio_image_annotation/templates", "*.pyi", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates"]
+artifacts = ["/backend/gradio_image_annotation/templates", "*.pyi", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates", "backend/gradio_image_annotation/templates"]
 
 [tool.hatch.build.targets.wheel]
 packages = ["/backend/gradio_image_annotation"]